New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@aurodesignsystem/auro-alert

Package Overview
Dependencies
Maintainers
4
Versions
31
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@aurodesignsystem/auro-alert - npm Package Compare versions

Comparing version 2.0.2 to 2.0.3

7

CHANGELOG.md
# Semantic Release Automated Changelog
## [2.0.3](https://github.com/AlaskaAirlines/auro-alert/compare/v2.0.2...v2.0.3) (2023-05-09)
### Performance Improvements
* **parts:** add css parts to alert and content [#28](https://github.com/AlaskaAirlines/auro-alert/issues/28) ([9da88bc](https://github.com/AlaskaAirlines/auro-alert/commit/9da88bc6c244b973f07f1b5e0c8e29a7678f197c))
## [2.0.2](https://github.com/AlaskaAirlines/auro-alert/compare/v2.0.1...v2.0.2) (2022-09-08)

@@ -4,0 +11,0 @@

2

dist/auro-alert__bundled.js

@@ -158,2 +158,2 @@ /**

*/
(window.litElementVersions||(window.litElementVersions=[])).push("2.5.1");const B={};class Z extends R{static getStyles(){return this.styles}static _getUniqueStyles(){if(this.hasOwnProperty(JSCompiler_renameProperty("_styles",this)))return;const t=this.getStyles();if(Array.isArray(t)){const e=(t,s)=>t.reduceRight(((t,s)=>Array.isArray(s)?e(s,t):(t.add(s),t)),s),s=e(t,new Set),i=[];s.forEach((t=>i.unshift(t))),this._styles=i}else this._styles=void 0===t?[]:[t];this._styles=this._styles.map((t=>{if(t instanceof CSSStyleSheet&&!H){const e=Array.prototype.slice.call(t.cssRules).reduce(((t,e)=>t+e.cssText),"");return new L(String(e),$)}return t}))}initialize(){super.initialize(),this.constructor._getUniqueStyles(),this.renderRoot=this.createRenderRoot(),window.ShadowRoot&&this.renderRoot instanceof window.ShadowRoot&&this.adoptStyles()}createRenderRoot(){return this.attachShadow(this.constructor.shadowRootOptions)}adoptStyles(){const t=this.constructor._styles;0!==t.length&&(void 0===window.ShadyCSS||window.ShadyCSS.nativeShadow?H?this.renderRoot.adoptedStyleSheets=t.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet)):this._needsShimAdoptedStyleSheets=!0:window.ShadyCSS.ScopingShim.prepareAdoptedCssText(t.map((t=>t.cssText)),this.localName))}connectedCallback(){super.connectedCallback(),this.hasUpdated&&void 0!==window.ShadyCSS&&window.ShadyCSS.styleElement(this)}update(t){const e=this.render();super.update(t),e!==B&&this.constructor.render(e,this.renderRoot,{scopeName:this.localName,eventContext:this}),this._needsShimAdoptedStyleSheets&&(this._needsShimAdoptedStyleSheets=!1,this.constructor._styles.forEach((t=>{const e=document.createElement("style");e.textContent=t.cssText,this.renderRoot.appendChild(e)})))}render(){return B}}Z.finalized=!0,Z.render=(t,e,s)=>{let r=U.get(e);void 0===r&&(i(e,e.firstChild),U.set(e,r=new S(Object.assign({templateFactory:E},s))),r.appendInto(e)),r.setValue(t),r.commit()},Z.shadowRootOptions={mode:"open"};class F extends Z{static get properties(){return{hidden:{type:Boolean,reflect:!0},hiddenVisually:{type:Boolean,reflect:!0},hiddenAudible:{type:Boolean,reflect:!0}}}hideAudible(t){return t?"true":"false"}}var j='<svg viewBox="0 0 24 24" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true" style="min-width:var(--auro-size-lg);height:var(--auro-size-lg);fill:currentColor" class="ico_squareLarge"><title>Error</title><desc>Error alert indicator</desc><path d="m13.047 5.599 6.786 11.586A1.207 1.207 0 0 1 18.786 19H5.214a1.207 1.207 0 0 1-1.047-1.815l6.786-11.586a1.214 1.214 0 0 1 2.094 0Zm-1.165.87a.234.234 0 0 0-.085.085L5.419 17.442a.232.232 0 0 0 .203.35h12.756a.234.234 0 0 0 .203-.35L12.203 6.554a.236.236 0 0 0-.321-.084ZM12 15.5a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5Zm-.024-6.22c.325 0 .589.261.589.583v4.434a.586.586 0 0 1-.589.583.586.586 0 0 1-.588-.583V9.863c0-.322.264-.583.588-.583Z"/></svg>',W='<svg viewBox="0 0 24 24" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true" style="min-width:var(--auro-size-lg);height:var(--auro-size-lg);fill:currentColor" class="ico_squareLarge"><title>Warning</title><desc>Alerts user of troubling or concerning situation</desc><path d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2Zm0 1.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm0 12a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5ZM12 7a.75.75 0 0 1 .743.648l.007.102V14a.75.75 0 0 1-1.493.102L11.25 14V7.75A.75.75 0 0 1 12 7Z"/></svg>',J='<svg viewBox="0 0 24 24" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true" style="min-width:var(--auro-size-lg);height:var(--auro-size-lg);fill:currentColor" class="ico_squareLarge"><title>Information</title><desc>Important information indicator</desc><path d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2Zm0 1.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm0 5.75a.75.75 0 0 1 .743.648l.007.102v6.25a.75.75 0 0 1-1.493.102l-.007-.102V10a.75.75 0 0 1 .75-.75ZM12 7a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5Z"/></svg>',D='<svg viewBox="0 0 24 24" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true" style="min-width:var(--auro-size-lg);height:var(--auro-size-lg);fill:currentColor" class="ico_squareLarge"><title>Check</title><desc/><path d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2Zm0 1.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm-1.524 10.416 4.971-5.423a.75.75 0 0 1 1.175.927l-.07.087-5.5 6a.75.75 0 0 1-.996.098l-.086-.075-2.5-2.5a.75.75 0 0 1 .976-1.133l.084.073 1.946 1.946 4.971-5.423-4.97 5.423Z"/></svg>',G=q`*,:after,:before{box-sizing:border-box}@media(prefers-reduced-motion:reduce){*,:after,:before{animation-duration:NaNs!important;animation-iteration-count:1!important;transition-duration:NaNs!important}}:focus-visible{outline:0}:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.js-focus-visible :focus:not(.focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}:host([type=error]) .alert,:host([type=information]) .alert,:host([type=success]) .alert,:host([type=warning]) .alert{color:#222;color:var(--auro-color-text-primary-on-light)}:host([type=error]) .alert{border-color:#df0b37;border-color:var(--auro-color-alert-error-on-light)}:host([type=error]) svg{color:#df0b37;color:var(--auro-color-alert-error-on-light)}:host([type=warning]) .alert{border-color:#de750c;border-color:var(--auro-color-alert-warning-on-light)}:host([type=warning]) svg{color:#de750c;color:var(--auro-color-alert-warning-on-light)}:host([type=information]) .alert{border-color:#0074c8;border-color:var(--auro-color-alert-notification-on-light)}:host([type=information]) svg{color:#0074c8;color:var(--auro-color-alert-notification-on-light)}:host([type=success]) .alert{border-color:#00805d;border-color:var(--auro-color-alert-success-on-light)}:host([type=success]) svg{color:#00805d;color:var(--auro-color-alert-success-on-light)}.alert{display:flex;padding:.5rem;padding:var(--auro-size-xs);padding-right:1rem;padding-right:var(--auro-size-md);padding-left:.75rem;padding-left:var(--auro-size-sm);border-width:1px;border-style:solid;border-color:#9fabbb;border-color:var(--auro-color-base-neutral-400);border-left-width:.5rem;border-left-width:var(--auro-size-xs);border-radius:.375rem;border-radius:var(--auro-border-radius)}.icon{display:flex;width:1.5rem;width:var(--auro-size-lg);height:1.5rem;height:var(--auro-size-lg);margin-right:.5rem;margin-right:var(--auro-size-xs)}.content{width:-webkit-fill-available;line-height:1.625rem;line-height:var(--auro-text-body-height-lg)}.content ::slotted(p){margin-top:0;margin-top:var(--auro-size-none)}.content ::slotted(p:last-child){margin-bottom:0;margin-bottom:var(--auro-size-none)}`,K=q`:host([fixed]) .alert{padding:8px;padding-right:16px;padding-left:12px;border-left-width:8px;border-radius:6px}:host([fixed]) .icon{width:24px;height:24px;margin-right:8px}:host([fixed]) .content{line-height:26px}:host([fixed]) .content ::slotted(p){margin-top:0}:host([fixed]) .content ::slotted(p:last-child){margin-bottom:0}`;class Q extends F{static get properties(){return{...super.properties,noIcon:{type:Boolean},type:{type:String,reflect:!0},role:{type:String,reflect:!0}}}static get styles(){return[G,K]}generateIconHtml(t){const e=(new DOMParser).parseFromString(t,"text/html").body.firstChild;return this.noIcon?I``:I`<div class="icon">${e}</div>`}render(){let t=I``;switch(this.type){case void 0:break;case"error":t=this.generateIconHtml(j),this.role="alert",this.typeStr="Error.";break;case"success":t=this.generateIconHtml(D),this.role="alert",this.typeStr="Success.";break;case"warning":t=this.generateIconHtml(W),this.role="alert",this.typeStr="Warning.";break;case"information":t=this.generateIconHtml(J),this.typeStr="Informational notice."}return I`<div class="alert" aria-hidden="${this.hideAudible(this.hiddenAudible)}">${t}<div class="content"><span class="util_displayHiddenVisually">${this.typeStr}</span><slot></slot></div></div>`}}customElements.get("auro-alert")||customElements.define("auro-alert",Q);
(window.litElementVersions||(window.litElementVersions=[])).push("2.5.1");const B={};class Z extends R{static getStyles(){return this.styles}static _getUniqueStyles(){if(this.hasOwnProperty(JSCompiler_renameProperty("_styles",this)))return;const t=this.getStyles();if(Array.isArray(t)){const e=(t,s)=>t.reduceRight(((t,s)=>Array.isArray(s)?e(s,t):(t.add(s),t)),s),s=e(t,new Set),i=[];s.forEach((t=>i.unshift(t))),this._styles=i}else this._styles=void 0===t?[]:[t];this._styles=this._styles.map((t=>{if(t instanceof CSSStyleSheet&&!H){const e=Array.prototype.slice.call(t.cssRules).reduce(((t,e)=>t+e.cssText),"");return new L(String(e),$)}return t}))}initialize(){super.initialize(),this.constructor._getUniqueStyles(),this.renderRoot=this.createRenderRoot(),window.ShadowRoot&&this.renderRoot instanceof window.ShadowRoot&&this.adoptStyles()}createRenderRoot(){return this.attachShadow(this.constructor.shadowRootOptions)}adoptStyles(){const t=this.constructor._styles;0!==t.length&&(void 0===window.ShadyCSS||window.ShadyCSS.nativeShadow?H?this.renderRoot.adoptedStyleSheets=t.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet)):this._needsShimAdoptedStyleSheets=!0:window.ShadyCSS.ScopingShim.prepareAdoptedCssText(t.map((t=>t.cssText)),this.localName))}connectedCallback(){super.connectedCallback(),this.hasUpdated&&void 0!==window.ShadyCSS&&window.ShadyCSS.styleElement(this)}update(t){const e=this.render();super.update(t),e!==B&&this.constructor.render(e,this.renderRoot,{scopeName:this.localName,eventContext:this}),this._needsShimAdoptedStyleSheets&&(this._needsShimAdoptedStyleSheets=!1,this.constructor._styles.forEach((t=>{const e=document.createElement("style");e.textContent=t.cssText,this.renderRoot.appendChild(e)})))}render(){return B}}Z.finalized=!0,Z.render=(t,e,s)=>{let r=U.get(e);void 0===r&&(i(e,e.firstChild),U.set(e,r=new S(Object.assign({templateFactory:E},s))),r.appendInto(e)),r.setValue(t),r.commit()},Z.shadowRootOptions={mode:"open"};class F extends Z{static get properties(){return{hidden:{type:Boolean,reflect:!0},hiddenVisually:{type:Boolean,reflect:!0},hiddenAudible:{type:Boolean,reflect:!0}}}hideAudible(t){return t?"true":"false"}}var j='<svg viewBox="0 0 24 24" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true" style="min-width:var(--auro-size-lg);height:var(--auro-size-lg);fill:currentColor" class="ico_squareLarge"><title>Error</title><desc>Error alert indicator</desc><path d="m13.047 5.599 6.786 11.586A1.207 1.207 0 0 1 18.786 19H5.214a1.207 1.207 0 0 1-1.047-1.815l6.786-11.586a1.214 1.214 0 0 1 2.094 0Zm-1.165.87a.234.234 0 0 0-.085.085L5.419 17.442a.232.232 0 0 0 .203.35h12.756a.234.234 0 0 0 .203-.35L12.203 6.554a.236.236 0 0 0-.321-.084ZM12 15.5a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5Zm-.024-6.22c.325 0 .589.261.589.583v4.434a.586.586 0 0 1-.589.583.586.586 0 0 1-.588-.583V9.863c0-.322.264-.583.588-.583Z"/></svg>',W='<svg viewBox="0 0 24 24" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true" style="min-width:var(--auro-size-lg);height:var(--auro-size-lg);fill:currentColor" class="ico_squareLarge"><title>Warning</title><desc>Alerts user of troubling or concerning situation</desc><path d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2Zm0 1.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm0 12a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5ZM12 7a.75.75 0 0 1 .743.648l.007.102V14a.75.75 0 0 1-1.493.102L11.25 14V7.75A.75.75 0 0 1 12 7Z"/></svg>',J='<svg viewBox="0 0 24 24" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true" style="min-width:var(--auro-size-lg);height:var(--auro-size-lg);fill:currentColor" class="ico_squareLarge"><title>Information</title><desc>Important information indicator</desc><path d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2Zm0 1.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm0 5.75a.75.75 0 0 1 .743.648l.007.102v6.25a.75.75 0 0 1-1.493.102l-.007-.102V10a.75.75 0 0 1 .75-.75ZM12 7a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5Z"/></svg>',D='<svg viewBox="0 0 24 24" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" role="img" aria-hidden="true" style="min-width:var(--auro-size-lg);height:var(--auro-size-lg);fill:currentColor" class="ico_squareLarge"><title>Check</title><desc/><path d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2Zm0 1.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm-1.524 10.416 4.971-5.423a.75.75 0 0 1 1.175.927l-.07.087-5.5 6a.75.75 0 0 1-.996.098l-.086-.075-2.5-2.5a.75.75 0 0 1 .976-1.133l.084.073 1.946 1.946 4.971-5.423-4.97 5.423Z"/></svg>',G=q`*,:after,:before{box-sizing:border-box}@media(prefers-reduced-motion:reduce){*,:after,:before{animation-duration:NaNs!important;animation-iteration-count:1!important;transition-duration:NaNs!important}}:focus-visible{outline:0}:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.js-focus-visible :focus:not(.focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}:host([type=error]) .alert,:host([type=information]) .alert,:host([type=success]) .alert,:host([type=warning]) .alert{color:#222;color:var(--auro-color-text-primary-on-light)}:host([type=error]) .alert{border-color:#df0b37;border-color:var(--auro-color-alert-error-on-light)}:host([type=error]) svg{color:#df0b37;color:var(--auro-color-alert-error-on-light)}:host([type=warning]) .alert{border-color:#de750c;border-color:var(--auro-color-alert-warning-on-light)}:host([type=warning]) svg{color:#de750c;color:var(--auro-color-alert-warning-on-light)}:host([type=information]) .alert{border-color:#0074c8;border-color:var(--auro-color-alert-notification-on-light)}:host([type=information]) svg{color:#0074c8;color:var(--auro-color-alert-notification-on-light)}:host([type=success]) .alert{border-color:#00805d;border-color:var(--auro-color-alert-success-on-light)}:host([type=success]) svg{color:#00805d;color:var(--auro-color-alert-success-on-light)}.alert{display:flex;padding:.5rem;padding:var(--auro-size-xs);padding-right:1rem;padding-right:var(--auro-size-md);padding-left:.75rem;padding-left:var(--auro-size-sm);border-width:1px;border-style:solid;border-color:#9fabbb;border-color:var(--auro-color-base-neutral-400);border-left-width:.5rem;border-left-width:var(--auro-size-xs);border-radius:.375rem;border-radius:var(--auro-border-radius)}.icon{display:flex;width:1.5rem;width:var(--auro-size-lg);height:1.5rem;height:var(--auro-size-lg);margin-right:.5rem;margin-right:var(--auro-size-xs)}.content{width:-webkit-fill-available;line-height:1.625rem;line-height:var(--auro-text-body-height-lg)}.content ::slotted(p){margin-top:0;margin-top:var(--auro-size-none)}.content ::slotted(p:last-child){margin-bottom:0;margin-bottom:var(--auro-size-none)}`,K=q`:host([fixed]) .alert{padding:8px;padding-right:16px;padding-left:12px;border-left-width:8px;border-radius:6px}:host([fixed]) .icon{width:24px;height:24px;margin-right:8px}:host([fixed]) .content{line-height:26px}:host([fixed]) .content ::slotted(p){margin-top:0}:host([fixed]) .content ::slotted(p:last-child){margin-bottom:0}`;class Q extends F{static get properties(){return{...super.properties,noIcon:{type:Boolean},type:{type:String,reflect:!0},role:{type:String,reflect:!0}}}static get styles(){return[G,K]}generateIconHtml(t){const e=(new DOMParser).parseFromString(t,"text/html").body.firstChild;return this.noIcon?I``:I`<div class="icon">${e}</div>`}render(){let t=I``;switch(this.type){case void 0:break;case"error":t=this.generateIconHtml(j),this.role="alert",this.typeStr="Error.";break;case"success":t=this.generateIconHtml(D),this.role="alert",this.typeStr="Success.";break;case"warning":t=this.generateIconHtml(W),this.role="alert",this.typeStr="Warning.";break;case"information":t=this.generateIconHtml(J),this.typeStr="Informational notice."}return I`<div part="alert" class="alert" aria-hidden="${this.hideAudible(this.hiddenAudible)}">${t}<div part="alert-content" class="content"><span class="util_displayHiddenVisually">${this.typeStr}</span><slot></slot></div></div>`}}customElements.get("auro-alert")||customElements.define("auro-alert",Q);

6

dist/auro-alert.js

@@ -23,2 +23,4 @@ // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license

* @attr {String} type - Component will render visually based on which type value is set; currently supports `error`, `warning`, `success`, `information`
* @csspart alert - Use for customizing the style of the alert container
* @csspart alert-content - Use for customizing the style of the alert content
*

@@ -99,6 +101,6 @@ * @slot - Provide text for the alert. If using multiple lines, separate each line with <p> tags.

return html`
<div class="alert"
<div part="alert" class="alert"
aria-hidden="${this.hideAudible(this.hiddenAudible)}">
${output}
<div class="content">
<div part="alert-content" class="content">
<span class="util_displayHiddenVisually">${this.typeStr}</span>

@@ -105,0 +107,0 @@ <slot></slot>

2

package.json

@@ -11,3 +11,3 @@ {

"name": "@aurodesignsystem/auro-alert",
"version": "2.0.2",
"version": "2.0.3",
"description": "auro-alert HTML custom element",

@@ -14,0 +14,0 @@ "repository": {

dist/auro-alert__bundled.es5.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc