@patternfly/pfe-toast - npm Package Compare versions

Comparing version 2.0.0-next.0 to 2.0.0-next.1

package.json

 {
   "name": "@patternfly/pfe-toast",
   "license": "MIT",
-  "version": "2.0.0-next.0",
+  "version": "2.0.0-next.1",
   "description": "Toast element for PatternFly Elements",
@@ -12,10 +12,4 @@ "customElements": "custom-elements.json",
   "exports": {
-    ".": {
-      "esbuild": "./pfe-toast.ts",
-      "default": "./pfe-toast.js"
-    },
-    "./*": {
-      "esbuild": "./*.ts",
-      "default": "./*.js"
-    }
+    ".": "./pfe-toast.js",
+    "./*": "./*.js"
   },
@@ -75,5 +69,5 @@ "publishConfig": {
   "dependencies": {
-    "@patternfly/pfe-core": "^2.0.0-next.0",
+    "@patternfly/pfe-core": "^2.0.0-next.3",
     "lit": "^2.1.2"
   }
 }

pfe-toast.js

@@ -1,93 +0,2 @@
-var b=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var o=(r,e,t,i)=>{for(var a=i>1?void 0:i?g(e,t):e,l=r.length-1,c;l>=0;l--)(c=r[l])&&(a=(i?c(e,t,a):c(a))||a);return i&&a&&b(e,t,a),a};import{LitElement as w,html as y}from"lit";import{customElement as k,property as d,state as h,query as A}from"lit/decorators.js";import{ifDefined as E}from"lit/directives/if-defined.js";import{ComposedEvent as m}from"@patternfly/pfe-core";import{bound as n,observed as C,pfelement as D}from"@patternfly/pfe-core/decorators.js";import{deprecatedCustomEvent as f}from"@patternfly/pfe-core/functions/deprecatedCustomEvent.js";import{css as _}from"lit";var x=_`@charset "UTF-8";
-:host {
-  align-items: stretch;
-  display: flex;
-  flex-flow: row wrap;
-  justify-content: flex-start;
-  position: absolute;
-  right: var(--pfe-toast--Right, calc(-1 * (var(--pfe-toast--MaxWidth, 500px) + var(--pfe-toast--Right--offset, 50px))));
-  top: var(--pfe-toast--Top, 50px);
-  transition: right var(--pfe-theme--animation-speed, 0.3s) var(--pfe-theme--animation-timing, cubic-bezier(0.465, 0.183, 0.153, 0.946));
-  will-change: right;
-  max-width: var(--pfe-toast--MaxWidth, 500px);
-  min-width: var(--pfe-toast--MinWidth, 250px);
-}
-@media only screen and (max-width: 575px) {
-  :host {
-    max-width: calc(var(--pfe-toast--MaxWidth, 500px) / 2);
-    min-width: calc(var(--pfe-toast--MinWidth, 250px) / 2);
-  }
-}
-
-:host([hidden]) {
-  display: none;
-}
-
-:host(.open) {
-  --pfe-toast--Right: 50px;
-}
-
-:host(:not(.open)) {
-  --pfe-toast--Right: calc(-1 * var(--pfe-toast--MaxWidth, 500px) + var(--pfe-toast--Right--offset, 50px));
-}
-
-::slotted(:first-child) {
-  margin-top: 0;
-}
-
-::slotted(button) {
-  background:  none;
-  border-radius:  0;
-  display:  inline-block;
-  margin-bottom:  0;
-  margin-right:  1rem;
-  padding:  (0.5rem  0.75rem);
-  text-align:  center;
-}
-
-.pfe-toast__container {
-  align-self: flex-start;
-  flex: 1 1 auto;
-  align-items: flex-start;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  background-color: var(--pfe-toast__container--BackgroundColor, var(--pfe-theme--color--surface--lightest, #fff));
-  box-shadow: var(--pfe-toast__container--BoxShadow, var(--pfe-theme--box-shadow--lg, 0 0.1875rem 0.4375rem 0.1875rem rgba(3, 3, 3, 0.13), 0 0.6875rem 1.5rem 1rem rgba(3, 3, 3, 0.12)));
-  color: var(--pfe-toast__container--Color, var(--pfe-theme--color--text, #151515));
-  padding: var(--pfe-toast__container--Padding, var(--pfe-theme--container-padding, 1rem));
-}
-.pfe-toast__content {
-  flex: 1 1 auto;
-}
-.pfe-toast__close {
-  flex: 0 0 auto;
-  background-color: transparent;
-  border: none;
-  cursor: pointer;
-  margin: 0;
-  padding: var(--pfe-toast__close--Padding, var(--pfe-toast__close--PaddingTop, 0) var(--pfe-toast__close--PaddingRight, 0) var(--pfe-toast__close--PaddingBottom, 0) var(--pfe-toast__close--PaddingLeft, 0));
-}
-.pfe-toast__close > svg {
-  fill: var(--pfe-toast__close--svg--Fill, var(--pfe-theme--color--feedback--default--darkest, #3c3f42));
-  height: var(--pfe-toast__close--svg--Height, 12px);
-  width: var(--pfe-toast__close--svg--Width, 12px);
-}
-.pfe-toast__close:hover > svg {
-  fill: var(--pfe-toast__close--svg--Fill--hover, #333);
-}`,p=x;var u=class extends m{constructor(){super("open")}},v=class extends m{constructor(){super("close")}},s=class extends w{constructor(){super(...arguments);this.closeLabel="Close";this.doesAutoDismiss=!!this.autoDismiss;this.isOpen=!1}static async toast(e){let t=document.createElement("pfe-toast");return t.append(e),t.addEventListener("close",()=>t.remove(),{once:!0}),document.body.append(t),t.open(),await t.updateComplete,t}connectedCallback(){super.connectedCallback(),this.hidden=!0,this._setAccessibility(),this.addEventListener("keydown",this._keydownHandler)}render(){return y`
-      <div class="pfe-toast__container" part="container">
-        <!-- Toast content (default slot) -->
-        <div class="pfe-toast__content" part="content">
-          <slot></slot>
-        </div>
-        <!-- Close button -->
-        <button part="close-button" class="pfe-toast__close" aria-label="${E(this.closeLabel)}" @click="${this.close}">
-          <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="-11 11 22 23">
-            <path d="M30 16.669v-1.331c0-0.363-0.131-0.675-0.394-0.938s-0.575-0.394-0.938-0.394h-10.669v-10.65c0-0.362-0.131-0.675-0.394-0.938s-0.575-0.394-0.938-0.394h-1.331c-0.363 0-0.675 0.131-0.938 0.394s-0.394 0.575-0.394 0.938v10.644h-10.675c-0.362 0-0.675 0.131-0.938 0.394s-0.394 0.575-0.394 0.938v1.331c0 0.363 0.131 0.675 0.394 0.938s0.575 0.394 0.938 0.394h10.669v10.644c0 0.363 0.131 0.675 0.394 0.938 0.262 0.262 0.575 0.394 0.938 0.394h1.331c0.363 0 0.675-0.131 0.938-0.394s0.394-0.575 0.394-0.938v-10.637h10.669c0.363 0 0.675-0.131 0.938-0.394 0.269-0.262 0.4-0.575 0.4-0.938z"
-                transform="rotate(45)" />
-          </svg>
-        </button>
-      </div>
-    `}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("keydown",this._keydownHandler)}_setAccessibility(){this.doesAutoDismiss=!!this.autoDismiss,this.doesAutoDismiss?(this.removeAttribute("aria-label"),this.removeAttribute("aria-describedby"),this.setAttribute("role","alert"),this.setAttribute("aria-live","polite"),this.setAttribute("aria-atomic","true")):(this.removeAttribute("aria-live"),this.removeAttribute("aria-atomic"),this.setAttribute("role","alertdialog"),this.hasAttribute("aria-label")||this.setAttribute("aria-label","Alert dialog"),this.setAttribute("aria-describedby","pfe-toast__content"))}_toMilliseconds(e=""){let t=e.match(/\d+/)||[8e3];return(e.match(/\D+/)||"")[0]==="s"?Number(t[0])*1e3:Number(t[0])}_keydownHandler(e){let{target:t}=e,{key:i}=e;switch(i){case"Escape":case"Esc":e.preventDefault(),this.close();break;case"Enter":t===this._toastCloseButton&&e.preventDefault(),this.close();break;default:break}}open(){return this.isOpen=!0,this.hidden=!1,setTimeout(()=>this.classList.add("open"),500),this.dispatchEvent(new u),this.dispatchEvent(f("pfe-toast:open")),this.doesAutoDismiss&&setTimeout(this.close,this._toMilliseconds(this.autoDismiss)),this}close(){return this.isOpen=!1,setTimeout(()=>{this.classList.remove("open"),this.hidden=!0},500),this.dispatchEvent(new v),this.dispatchEvent(f("pfe-toast:close")),this}toggle(){return this.isOpen?this.close():this.open(),this}};s.version="2.0.0-next.0",s.styles=[p],o([C("_setAccessibility"),d({attribute:"auto-dismiss",reflect:!0})],s.prototype,"autoDismiss",2),o([d({attribute:"close-label",reflect:!0})],s.prototype,"closeLabel",2),o([h()],s.prototype,"doesAutoDismiss",2),o([h()],s.prototype,"isOpen",2),o([A(".pfe-toast__close")],s.prototype,"_toastCloseButton",2),o([n],s.prototype,"_keydownHandler",1),o([n],s.prototype,"open",1),o([n],s.prototype,"close",1),o([n],s.prototype,"toggle",1),s=o([k("pfe-toast"),D()],s);export{s as PfeToast,v as ToastCloseEvent,u as ToastOpenEvent};
+var b=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var i=(r,e,t,o)=>{for(var a=o>1?void 0:o?g(e,t):e,l=r.length-1,c;l>=0;l--)(c=r[l])&&(a=(o?c(e,t,a):c(a))||a);return o&&a&&b(e,t,a),a};import{LitElement as w,html as y}from"lit";import{customElement as k,property as d,state as h,query as A}from"lit/decorators.js";import{ifDefined as E}from"lit/directives/if-defined.js";import{ComposedEvent as m}from"@patternfly/pfe-core";import{bound as n,observed as C,pfelement as D}from"@patternfly/pfe-core/decorators.js";import{deprecatedCustomEvent as f}from"@patternfly/pfe-core/functions/deprecatedCustomEvent.js";import{css as _}from"lit";var x=_`@charset "UTF-8";:host{align-items:stretch;display:flex;flex-flow:row wrap;justify-content:flex-start;position:absolute;right:var(--pfe-toast--Right,calc(-1 * (var(--pfe-toast--MaxWidth,500px) + var(--pfe-toast--Right--offset,50px))));top:var(--pfe-toast--Top,50px);transition:right var(--pfe-theme--animation-speed, .3s) var(--pfe-theme--animation-timing, cubic-bezier(.465, .183, .153, .946));will-change:right;max-width:var(--pfe-toast--MaxWidth,500px);min-width:var(--pfe-toast--MinWidth,250px)}@media only screen and (max-width:575px){:host{max-width:calc(var(--pfe-toast--MaxWidth,500px)/ 2);min-width:calc(var(--pfe-toast--MinWidth,250px)/ 2)}}:host([hidden]){display:none}:host(.open){--pfe-toast--Right:50px}:host(:not(.open)){--pfe-toast--Right:calc(-1 * var(--pfe-toast--MaxWidth, 500px) + var(--pfe-toast--Right--offset, 50px))}::slotted(:first-child){margin-top:0}::slotted(button){background:0 0;border-radius:0;display:inline-block;margin-bottom:0;margin-right:1rem;padding:(.5rem .75rem);text-align:center}.pfe-toast__container{align-self:flex-start;flex:1 1 auto;align-items:flex-start;display:flex;flex-flow:row nowrap;justify-content:flex-start;background-color:var(--pfe-toast__container--BackgroundColor,var(--pfe-theme--color--surface--lightest,#fff));box-shadow:var(--pfe-toast__container--BoxShadow,var(--pfe-theme--box-shadow--lg,0 .1875rem .4375rem .1875rem rgba(3,3,3,.13),0 .6875rem 1.5rem 1rem rgba(3,3,3,.12)));color:var(--pfe-toast__container--Color,var(--pfe-theme--color--text,#151515));padding:var(--pfe-toast__container--Padding,var(--pfe-theme--container-padding,1rem))}.pfe-toast__content{flex:1 1 auto}.pfe-toast__close{flex:0 0 auto;background-color:transparent;border:none;cursor:pointer;margin:0;padding:var(--pfe-toast__close--Padding,var(--pfe-toast__close--PaddingTop,0) var(--pfe-toast__close--PaddingRight,0) var(--pfe-toast__close--PaddingBottom,0) var(--pfe-toast__close--PaddingLeft,0))}.pfe-toast__close>svg{fill:var(--pfe-toast__close--svg--Fill,var(--pfe-theme--color--feedback--default--darkest,#3c3f42));height:var(--pfe-toast__close--svg--Height,12px);width:var(--pfe-toast__close--svg--Width,12px)}.pfe-toast__close:hover>svg{fill:var(--pfe-toast__close--svg--Fill--hover,#333)}`,p=x;var u=class extends m{constructor(){super("open")}},v=class extends m{constructor(){super("close")}},s=class extends w{constructor(){super(...arguments);this.closeLabel="Close";this.doesAutoDismiss=!!this.autoDismiss;this.isOpen=!1}static async toast(e){let t=document.createElement("pfe-toast");return t.append(e),t.addEventListener("close",()=>t.remove(),{once:!0}),document.body.append(t),t.open(),await t.updateComplete,t}connectedCallback(){super.connectedCallback(),this.hidden=!0,this._setAccessibility(),this.addEventListener("keydown",this._keydownHandler)}render(){return y`<div class="pfe-toast__container" part="container"><div class="pfe-toast__content" part="content"><slot></slot></div><button part="close-button" class="pfe-toast__close" aria-label="${E(this.closeLabel)}" @click="${this.close}"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="-11 11 22 23"><path d="M30 16.669v-1.331c0-0.363-0.131-0.675-0.394-0.938s-0.575-0.394-0.938-0.394h-10.669v-10.65c0-0.362-0.131-0.675-0.394-0.938s-0.575-0.394-0.938-0.394h-1.331c-0.363 0-0.675 0.131-0.938 0.394s-0.394 0.575-0.394 0.938v10.644h-10.675c-0.362 0-0.675 0.131-0.938 0.394s-0.394 0.575-0.394 0.938v1.331c0 0.363 0.131 0.675 0.394 0.938s0.575 0.394 0.938 0.394h10.669v10.644c0 0.363 0.131 0.675 0.394 0.938 0.262 0.262 0.575 0.394 0.938 0.394h1.331c0.363 0 0.675-0.131 0.938-0.394s0.394-0.575 0.394-0.938v-10.637h10.669c0.363 0 0.675-0.131 0.938-0.394 0.269-0.262 0.4-0.575 0.4-0.938z" transform="rotate(45)"/></svg></button></div>`}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("keydown",this._keydownHandler)}_setAccessibility(){this.doesAutoDismiss=!!this.autoDismiss,this.doesAutoDismiss?(this.removeAttribute("aria-label"),this.removeAttribute("aria-describedby"),this.setAttribute("role","alert"),this.setAttribute("aria-live","polite"),this.setAttribute("aria-atomic","true")):(this.removeAttribute("aria-live"),this.removeAttribute("aria-atomic"),this.setAttribute("role","alertdialog"),this.hasAttribute("aria-label")||this.setAttribute("aria-label","Alert dialog"),this.setAttribute("aria-describedby","pfe-toast__content"))}_toMilliseconds(e=""){let t=e.match(/\d+/)||[8e3];return(e.match(/\D+/)||"")[0]==="s"?Number(t[0])*1e3:Number(t[0])}_keydownHandler(e){let{target:t}=e,{key:o}=e;switch(o){case"Escape":case"Esc":e.preventDefault(),this.close();break;case"Enter":t===this._toastCloseButton&&e.preventDefault(),this.close();break;default:break}}open(){return this.isOpen=!0,this.hidden=!1,setTimeout(()=>this.classList.add("open"),500),this.dispatchEvent(new u),this.dispatchEvent(f("pfe-toast:open")),this.doesAutoDismiss&&setTimeout(this.close,this._toMilliseconds(this.autoDismiss)),this}close(){return this.isOpen=!1,setTimeout(()=>{this.classList.remove("open"),this.hidden=!0},500),this.dispatchEvent(new v),this.dispatchEvent(f("pfe-toast:close")),this}toggle(){return this.isOpen?this.close():this.open(),this}};s.version="{{version}}",s.styles=[p],i([C("_setAccessibility"),d({attribute:"auto-dismiss",reflect:!0})],s.prototype,"autoDismiss",2),i([d({attribute:"close-label",reflect:!0})],s.prototype,"closeLabel",2),i([h()],s.prototype,"doesAutoDismiss",2),i([h()],s.prototype,"isOpen",2),i([A(".pfe-toast__close")],s.prototype,"_toastCloseButton",2),i([n],s.prototype,"_keydownHandler",1),i([n],s.prototype,"open",1),i([n],s.prototype,"close",1),i([n],s.prototype,"toggle",1),s=i([k("pfe-toast"),D()],s);export{s as PfeToast,v as ToastCloseEvent,u as ToastOpenEvent};
 //# sourceMappingURL=pfe-toast.js.map

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

28206

decreased by-24.42%

Lines of code

404

decreased by-15.48%

Dependency changes

• + Added@floating-ui/core@1.6.0(transitive)

• + Added@floating-ui/dom@1.6.3(transitive)

• + Added@floating-ui/utils@0.2.1(transitive)

• - Removed@floating-ui/core@1.6.1(transitive)

• - Removed@floating-ui/dom@1.6.4(transitive)

• - Removed@floating-ui/utils@0.2.2(transitive)

• Updated@patternfly/pfe-core@^2.0.0-next.3