@getflip/swirl-components 0.531.1 → 0.531.3

package/dist/swirl-components/p-7e2b64f8.entry.js

@@ -1 +0,0 @@
-import{r as t,h as n,a as o,d as i}from"./p-Dz56lJ37.js";import{c as r}from"./p-orsBiyT_.js";import{D as a}from"./p-Bfn7CHM9.js";import"./p-CCck-DTo.js";const s=class{constructor(n){t(this,n),this.cursor="pointer",this.iconPosition="start",this.intent="default",this.size="m",this.textAlign="center",this.type="button",this.variant="ghost",this.mediaQueryUnsubscribe=()=>{}}componentDidLoad(){this.updateFormAttribute(),this.mediaQueryUnsubscribe=a.subscribe((t=>{this.isDesktop=t,this.forceIconProps()}))}componentDidRender(){this.updateFormAttribute(),this.forceIconProps()}disconnectedCallback(){this.mediaQueryUnsubscribe()}forceIconProps(){if(!Boolean(this.iconEl))return;const t=this.iconEl.children[0];(t?.tagName.startsWith("SWIRL-ICON")||t?.tagName.startsWith("SWIRL-EMOJI")||t?.tagName.startsWith("SWIRL-SYMBOL"))&&t?.setAttribute("size",this.isDesktop||"s"===this.size?"20":"24")}getAriaLabel(t){return Boolean(this.swirlAriaLabel)?this.swirlAriaLabel:t?this.label:void 0}updateFormAttribute(){Boolean(this.href)||!Boolean(this.form)?this.buttonEl?.removeAttribute("form"):this.buttonEl?.setAttribute("form",this.form)}render(){const t=this.hideLabel&&Boolean(this.icon)||"floating"===this.variant&&"default"===this.intent,i=Boolean(this.href),a=this.getAriaLabel(t),s=this.icon||Boolean(this.el.querySelector("[slot='icon']")),e=Boolean(this.el.querySelector("[slot='tag']")),b=Boolean(this.el.querySelector("[slot='trailing']")),l=r("button",`button--icon-position-${this.iconPosition}`,`button--intent-${this.intent}`,`button--size-${this.size}`,`button--text-align-${this.textAlign}`,`button--variant-${this.variant}`,{"button--elevated":this.elevated,"button--disabled":this.disabled,"button--has-icon":s,"button--icon-only":t,"button--pill":this.pill,"button--pressed":this.pressed});return n(o,{key:"e7602a78117c447e1c37a6951d79ceaade40e2c7",style:{pointerEvents:this.disabled?"none":""}},n(i?"a":"button",{key:"ab00f989857f767b2b75625e9df1064f9125a1a9","aria-controls":this.swirlAriaControls,"aria-current":this.swirlAriaCurrent,"aria-describedby":this.swirlAriaDescribedby,"aria-disabled":this.disabled&&!i?"true":void 0,"aria-expanded":this.swirlAriaExpanded,"aria-haspopup":this.swirlAriaHaspopup,"aria-label":a,"aria-pressed":this.pressed?"true":void 0,class:l,disabled:i?void 0:this.disabled,download:i?void 0:this.download,form:i?void 0:this.form,href:this.href,name:i?void 0:this.name,ref:t=>this.buttonEl=t,target:i?this.target:void 0,type:i?void 0:this.type,value:i?void 0:this.value,style:{cursor:this.disabled||"pointer"===this.cursor?void 0:this.cursor,fontSize:this.inheritFontSize?"inherit":void 0,lineHeight:this.inheritFontSize?"inherit":void 0}},Boolean(this.icon)&&n("span",{key:"fd2334063e4ea5c7c21a17cbfc2ef347d0ad1049",class:"button__icon",innerHTML:this.icon,ref:t=>this.iconEl=t}),!Boolean(this.icon)&&n("span",{key:"105ec9131873da4ded162d97f12e0ef150fd31f4",class:"button__icon",ref:t=>this.iconEl=t},n("slot",{key:"8797f3878578430e2b10ba707e99db179c80b7e6",name:"icon"})),!t&&n("span",{key:"b47564712cf30122100e1cac186019c0d90cf0fb",class:"button__label"},this.label),e&&n("span",{key:"91a903f836ba8f32072798b5fe4f184960037a73",class:"button__tag"},n("slot",{key:"cad22304d1490c362da9d15c8bc55351de5c12d6",name:"tag"})),b&&n("div",{key:"352c11dd6d9332e950486b1e8ee6119e158cb893",class:"button__trailing-slot"},n("slot",{key:"7e6f28a9ea17106c2fc5b18bdfaf67dec3f41468",name:"trailing"}))))}get el(){return i(this)}};s.style=".sc-swirl-button-h{display:inline-block;max-width:100%;flex-shrink:0}.sc-swirl-button-h *.sc-swirl-button{box-sizing:border-box}.button.sc-swirl-button{display:inline-flex;width:100%;padding:var(--s-space-8) var(--s-space-16);justify-content:center;align-items:center;border:none;border-top-left-radius:var(--swirl-button-border-top-left-radius);border-top-right-radius:var(--swirl-button-border-top-right-radius);border-bottom-right-radius:var(--swirl-button-border-bottom-right-radius);border-bottom-left-radius:var(--swirl-button-border-bottom-left-radius);color:var(--s-text-subdued);background-color:var(--swirl-ghost-button-background-default);font:inherit;font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-lg);min-width:var(--s-line-height-lg);text-decoration:none;cursor:pointer;gap:var(--s-space-8);transition:box-shadow 0.3s}.button.sc-swirl-button:hover{background-color:var(--swirl-ghost-button-background-hovered);--swirl-tag-background-default:var(--s-state-pressed)}.button.sc-swirl-button:active{background-color:var(--swirl-ghost-button-background-pressed)}.button--elevated.sc-swirl-button{box-shadow:var(--s-shadow-level-2)}.button.sc-swirl-button:disabled,.button.button--disabled.sc-swirl-button{color:var(--s-text-disabled);cursor:default}.button.sc-swirl-button:disabled:where(:not(.button--variant-ghost)),.button.button--disabled.sc-swirl-button:where(:not(.button--variant-ghost)){background-color:var(--swirl-ghost-button-background-disabled)}.button.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-disabled)}.button.sc-swirl-button:focus-visible{outline-color:var(--s-focus-default);outline-offset:var(--s-space-2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.button.sc-swirl-button{padding:var(--s-space-8) var(--s-space-12);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);min-width:var(--s-line-height-sm);gap:var(--s-space-4)}}.button--text-align-start.sc-swirl-button{justify-content:flex-start}.button--text-align-center.sc-swirl-button{justify-content:center}.button--text-align-end.sc-swirl-button{justify-content:flex-end}.button--variant-ghost.button--intent-strong.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-default)}.button--variant-ghost.button--intent-strong.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-ghost.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-highlight)}.button--variant-ghost.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-highlight)}.button--variant-ghost.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-critical)}.button--variant-ghost.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-critical)}.button--variant-ghost.button--pressed.sc-swirl-button{color:var(--s-text-highlight)}.button--variant-ghost.button--pressed.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-highlight)}.button--variant-ghost.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-ghost.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-flat.sc-swirl-button{color:var(--s-text-default);background-color:var(--swirl-flat-button-background-default);--swirl-tag-background-default:var(--s-state-pressed)}.button--variant-flat.sc-swirl-button:hover{background-color:var(--swirl-flat-button-background-hovered)}.button--variant-flat.sc-swirl-button:active{background-color:var(--swirl-flat-button-background-pressed)}.button--variant-flat.sc-swirl-button:disabled,.button--variant-flat.button--disabled.sc-swirl-button{background-color:var(--swirl-flat-button-background-disabled)}.button--variant-flat.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.button--variant-flat.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)):hover{background-color:var(--s-action-primary-hovered)}.button--variant-flat.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)):active{background-color:var(--s-action-primary-pressed)}.button--variant-flat.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-on-action-primary)}.button--variant-flat.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-on-status);background-color:var(--s-action-critical-default)}.button--variant-flat.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)):hover{background-color:var(--s-action-critical-hovered)}.button--variant-flat.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)):active{background-color:var(--s-action-critical-pressed)}.button--variant-flat.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-on-status)}.button--variant-flat.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-flat.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-flat.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-outline.sc-swirl-button{color:var(--s-text-subdued);outline:var(--s-border-width-default) solid var(--s-border-strong);outline-offset:calc(var(--s-border-width-default) * -1)}.button--variant-outline.sc-swirl-button:disabled,.button--variant-outline.button--disabled.sc-swirl-button{outline-color:var(--s-border-default)}.button--variant-outline.button--intent-strong.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-default)}.button--variant-outline.button--intent-strong.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-outline.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-critical);outline-color:var(--s-border-critical)}.button--variant-outline.button--intent-critical.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-critical)}.button--variant-outline.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)),.button--variant-outline.button--pressed.sc-swirl-button{color:var(--s-text-highlight);outline-color:var(--s-border-highlight)}.button--variant-outline.button--intent-primary.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button,.button--variant-outline.button--pressed.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-highlight)}.button--variant-outline.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-outline.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-outline.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-default)}.button--variant-plain.sc-swirl-button{padding:0;border-radius:0;color:var(--swirl-plain-button-text-color-default);background-color:transparent}.button--variant-plain.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)){color:var(--swirl-plain-button-text-color-hovered);background-color:transparent;text-decoration:underline;text-underline-offset:var(--s-space-4)}.button--variant-plain.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--swirl-plain-button-text-color-hovered)}.button--variant-plain.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)){color:var(--swirl-plain-button-text-color-pressed);background-color:transparent}.button--variant-plain.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--swirl-plain-button-text-color-pressed)}.button--variant-plain.sc-swirl-button:disabled,.button--variant-plain.button--disabled.sc-swirl-button{color:var(--swirl-plain-button-text-color-disabled);background-color:transparent}.button--variant-plain.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button--variant-plain.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--swirl-plain-button-text-color-disabled)}.button--variant-plain.button--icon-only.sc-swirl-button{padding:0}.button--variant-plain.button--intent-strong.sc-swirl-button:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-default)}.button--variant-plain.button--intent-strong.sc-swirl-button:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-plain.button--intent-primary.sc-swirl-button{color:var(--s-interactive-primary-default)}.button--variant-plain.button--intent-primary.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)){color:var(--s-interactive-primary-hovered)}.button--variant-plain.button--intent-primary.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-interactive-primary-hovered)}.button--variant-plain.button--intent-primary.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)){color:var(--s-interactive-primary-pressed)}.button--variant-plain.button--intent-primary.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)) .button__icon.sc-swirl-button{color:var(--s-interactive-primary-pressed)}.button--variant-plain.button--intent-primary.sc-swirl-button:disabled,.button--variant-plain.button--intent-primary.button--disabled.sc-swirl-button{color:var(--s-interactive-primary-disabled)}.button--variant-plain.button--intent-primary.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button--variant-plain.button--intent-primary.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-interactive-primary-disabled)}.button--variant-plain.button--intent-primary.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-interactive-primary-default)}.button--variant-plain.sc-swirl-button .button__icon.sc-swirl-button{margin-left:0;color:var(--swirl-plain-button-text-color-default)}.button--variant-plain.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-plain.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-on-image.sc-swirl-button{color:var(--s-text-on-image);background:rgba(0, 0, 0, 0.6)}.button--variant-on-image.sc-swirl-button:hover{background:rgba(0, 0, 0, 0.5)}.button--variant-on-image.sc-swirl-button:active{background:rgba(0, 0, 0, 0.4)}.button--variant-on-image.sc-swirl-button:disabled,.button--variant-on-image.button--disabled.sc-swirl-button{color:var(--s-text-on-image);background:rgba(0, 0, 0, 0.3)}.button--variant-on-image.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button--variant-on-image.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-on-image)}.button--variant-on-image.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-on-image)}.button--variant-on-image.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-on-image.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-floating.sc-swirl-button{color:var(--s-text-default);background-color:var(--s-surface-overlay-default)}.button--variant-floating.sc-swirl-button:not(.button--elevated){box-shadow:var(--s-shadow-level-1)}.button--variant-floating.sc-swirl-button:hover{color:var(--s-text-on-action-primary);background-color:var(--s-state-hovered)}.button--variant-floating.sc-swirl-button:active{color:var(--s-text-on-action-primary);background-color:var(--s-state-pressed)}.button--variant-floating.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-floating.button--intent-primary.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20);border-radius:1.5rem;color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.button--variant-floating.button--intent-primary.sc-swirl-button:hover:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-hovered)}.button--variant-floating.button--intent-primary.sc-swirl-button:active:where(:not(:disabled):not(.button--disabled)){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-pressed)}.button--variant-floating.button--intent-primary.sc-swirl-button:disabled,.button--variant-floating.button--intent-primary.button--disabled.sc-swirl-button{color:var(--s-text-on-action-primary)}.button--variant-floating.button--intent-primary.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button--variant-floating.button--intent-primary.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-on-action-primary)}.button--variant-floating.button--intent-primary.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--variant-floating.button--intent-primary.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-on-action-primary)}.button--variant-floating.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-translucent.sc-swirl-button{color:var(--s-text-default);outline:var(--s-border-width-default) solid     var(--s-border-translucent-outline);outline-offset:calc(var(--s-border-width-default) * -1);background:var(--s-translucent-medium-default);box-shadow:var(--s-shadow-level-2);-webkit-backdrop-filter:blur(var(--s-blur-s));backdrop-filter:blur(var(--s-blur-s))}.button--variant-translucent.sc-swirl-button:hover{background:var(--s-translucent-medium-hovered)}.button--variant-translucent.sc-swirl-button:active{background:var(--s-translucent-medium-pressed)}.button--variant-translucent.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-strong)}.button--variant-translucent.sc-swirl-button:disabled,.button--variant-translucent.button--disabled.sc-swirl-button{color:var(--s-text-subdued);background:var(--s-translucent-medium-default)}.button--variant-translucent.sc-swirl-button:disabled .button__icon.sc-swirl-button,.button--variant-translucent.button--disabled.sc-swirl-button .button__icon.sc-swirl-button{color:var(--s-icon-default)}.button--variant-translucent.button--size-l.sc-swirl-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-translucent.button--size-l.button--icon-only.sc-swirl-button{padding:var(--s-space-12)}.button--icon-position-end.sc-swirl-button .button__icon.sc-swirl-button{margin-right:calc(-1 * var(--s-space-4));margin-left:0;order:2}.button--pill.sc-swirl-button{border-radius:1.25rem}.button--pill.button--size-l.sc-swirl-button{border-radius:1.5rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.button--pill.button--size-l.sc-swirl-button{border-radius:1.375rem}}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.button--pill.sc-swirl-button{border-radius:1.125rem}}.button--size-s.sc-swirl-button{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);min-width:var(--s-line-height-sm);gap:var(--s-space-4);border-radius:var(--s-border-radius-sm)}.button--size-s.sc-swirl-button:not(.button--variant-plain),.button--size-s.button--variant-floating.button--intent-primary.sc-swirl-button{min-height:1.75rem;padding:var(--s-space-4) var(--s-space-8)}.button--size-s.button--pill.sc-swirl-button,.button--size-s.button--variant-floating.button--intent-primary.sc-swirl-button{border-radius:0.875rem}.button--size-s.sc-swirl-button .button__icon.sc-swirl-button{width:1.25rem;height:1.25rem}.button--size-s.button--icon-only.sc-swirl-button:not(.button--variant-plain),.button--size-s.button--variant-floating.button--intent-primary.button--icon-only.sc-swirl-button{min-width:1.75rem;padding:var(--s-space-4)}.button--icon-only.sc-swirl-button{padding:var(--s-space-8)}.button--icon-only.button--pill.sc-swirl-button{border-top-left-radius:var(--swirl-icon-button-border-top-left-radius);border-top-right-radius:var(--swirl-icon-button-border-top-right-radius);border-bottom-right-radius:var(       --swirl-icon-button-border-bottom-right-radius     );border-bottom-left-radius:var(       --swirl-icon-button-border-bottom-left-radius     )}.button--icon-only.sc-swirl-button .button__icon.sc-swirl-button{margin-right:0;margin-left:0}.button--has-icon.sc-swirl-button .button__icon.sc-swirl-button{display:inline-flex}.button__tag.sc-swirl-button{padding-left:var(--s-space-8);order:3}.button__trailing-slot.sc-swirl-button{order:4}.button__icon.sc-swirl-button{display:none;width:1.5rem;height:1.5rem;margin-left:calc(-1 * var(--s-space-4));color:var(--s-icon-default);order:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.button__icon.sc-swirl-button{width:1.25rem;height:1.25rem}}.button__label.sc-swirl-button{overflow:hidden;max-width:100%;white-space:nowrap;text-overflow:ellipsis;order:1}";export{s as swirl_button}

package/dist/swirl-components/p-bf3af2c8.entry.js

@@ -1 +0,0 @@
-import{r as a,c as t,h as i,a as r,d as s}from"./p-Dz56lJ37.js";import{c as e}from"./p-orsBiyT_.js";const o={"3xs":20,"2xs":24,xs:28,s:32,m:40,l:48,xl:64,"2xl":144},n=class{constructor(i){a(this,i),this.imageError=t(this,"imageError",7),this.imageLoad=t(this,"imageLoad",7),this.badgePosition="bottom",this.color="kiwi",this.interactive=!1,this.showLabel=!1,this.size="m",this.toolPosition="bottom",this.variant="round",this.loadingError=!1,this.loaded=!1,this.inViewport=!1,this.componentLoaded=!1,this.onImageElementUpdate=a=>{this.imgEl?.removeEventListener("load",this.setImageAvailable),this.imgEl?.removeEventListener("error",this.setImageUnavailable),this.imgEl=a,this.imgEl&&(this.imgEl.addEventListener("load",this.setImageAvailable),this.imgEl.addEventListener("error",this.setImageUnavailable))},this.setImageAvailable=()=>{this.imageAvailable=!0,this.loadingError=!1,this.loaded=!0,this.imageLoad.emit()},this.setImageUnavailable=()=>{this.imageAvailable=!1,this.loaded=!0,this.loadingError=!0,this.imageError.emit()},this.onKeydown=a=>{"Space"===a.code?a.preventDefault():"Enter"===a.code&&(a.preventDefault(),this.element.click())},this.onKeyup=a=>{"Space"===a.code&&(a.preventDefault(),this.element.click())}}componentDidLoad(){this.setupIntersectionObserver(),this.componentLoaded=!0}connectedCallback(){this.componentLoaded&&this.setupIntersectionObserver()}disconnectedCallback(){this.intersectionObserver?.disconnect(),this.imgEl?.removeEventListener("load",this.setImageAvailable),this.imgEl?.removeEventListener("error",this.setImageUnavailable)}watchSrcProp(){this.imageAvailable=void 0}setupIntersectionObserver(){"intersecting"===this.loading&&(this.intersectionObserver=new IntersectionObserver(this.onVisibilityChange.bind(this),{threshold:0}),this.intersectionObserver.observe(this.element))}onVisibilityChange(a){this.inViewport=a.some((a=>a.isIntersecting))}render(){const a=Boolean(this.src)&&(this.imageAvailable||void 0===this.imageAvailable)&&("intersecting"!==this.loading||this.inViewport),t=(!a||!this.loaded&&!this.loadingError)&&Boolean(this.initials),s=!a&&!t&&Boolean(this.icon),n=!a&&!t&&!s,l=Boolean(this.badge)&&"m"===this.size,d=this.interactive?"button":void 0,v=e("avatar",`avatar--color-${this.color}`,`avatar--size-${this.size}`,`avatar--variant-${this.variant}`,{"avatar--has-icon":s||n,"avatar--has-initials":t,"avatar--interactive":this.interactive}),c=e("avatar__badge",`avatar__badge--position-${this.badgePosition}`),h=e("avatar__tool",`avatar__tool--position-${this.toolPosition}`);return i(r,{key:"507321c143bd3a7bd96727522250a32a0bddfda9","aria-label":this.interactive?this.label:void 0,onKeydown:this.interactive?this.onKeydown:void 0,onKeyup:this.interactive?this.onKeyup:void 0,role:d,tabIndex:this.interactive?0:void 0},i("span",{key:"41c06e0e9a91b7012a898a19c7d2ff66b93a3584",class:v,part:"avatar"},a&&i("span",{key:"4026f68212a7026dfdb236bffacc210a7dfd7b30",class:"avatar__image"},i("img",{key:"4636819fb2a365ed239fe765a4efcb347186ca06",alt:"",height:o[this.size],loading:"intersecting"!==this.loading?this.loading:void 0,ref:this.onImageElementUpdate,src:this.src,width:o[this.size]})),t&&i("span",{key:"87a4741931e8a7057764618f4164df8c3286fa15",class:"avatar__initials"},i("span",{key:"ac5d4393d9bfaa22391e3414e0a02d3831c8c137"},this.initials)),s&&i("span",{key:"29690e49b2882761d26dd548bbdd59d3eb458d5d",class:"avatar__icon",innerHTML:this.icon}),n&&i("span",{key:"28cba2cb26c839a0f368bf7312039cfc36cd60ab",class:"avatar__icon"},i("swirl-icon-person",{key:"e76a5efbecc6a46608d7162a9aeebd7e7acfe8f9"})),l&&i("span",{key:"d88cc696f910bd1105811d0d07636f7ed686d11b",class:c,innerHTML:this.badge}),i("span",{key:"eeb86573ed228297fba743a2327aea481cf05e03",class:h},i("slot",{key:"121f539afb9e2ef8adac562c05c1f62fba280e87",name:"tool"}))),this.showLabel&&i("span",{key:"b73d9b0e724038fa345e081ec3761fcd964ea95f","aria-hidden":!0,class:"avatar__label"},this.label))}get element(){return s(this)}static get watchers(){return{src:[{watchSrcProp:0}]}}};n.style=':host{display:inline-flex;flex-shrink:0;align-items:center;flex-direction:column;--swirl-avatar-radius:50%;--swirl-avatar-size:2.5rem}:host *{box-sizing:border-box}:host([size="3xs"]){--swirl-avatar-size:1.25rem}:host([size="2xs"]){--swirl-avatar-size:1.5rem}:host([size="xs"]){--swirl-avatar-size:1.75rem}:host([size="s"]){--swirl-avatar-size:2rem}:host([size="l"]){--swirl-avatar-size:3rem}:host([size="xl"]){--swirl-avatar-size:4rem}:host([size="2xl"]){--swirl-avatar-size:9rem}:host([variant="square"][size="3xs"]),:host([variant="square"][size="2xs"]){--swirl-avatar-radius:0.25rem}:host([variant="square"][size="xs"]),:host([variant="square"][size="s"]){--swirl-avatar-radius:0.5rem}:host([variant="square"][size="m"]){--swirl-avatar-radius:0.625rem}:host([variant="square"][size="l"]){--swirl-avatar-radius:0.75rem}:host([variant="square"][size="xl"]){--swirl-avatar-radius:1rem}:host([variant="square"][size="2xl"]){--swirl-avatar-radius:1.25rem}.avatar{position:relative;display:inline-flex;width:var(--swirl-avatar-size);height:var(--swirl-avatar-size);justify-content:center;align-items:center;border-radius:var(--swirl-avatar-radius);border:var(--swirl-avatar-border-width, 0) solid     var(--swirl-avatar-border-color, transparent)}.avatar--has-icon{color:var(--s-icon-default);background-color:var(--swirl-avatar-background-color)}.avatar--has-initials{padding-right:0;padding-left:0;color:#fff}.avatar--interactive{cursor:pointer}.avatar--interactive:focus:not(:focus-visible){outline:none}.avatar--interactive:focus-visible{outline-color:var(--s-focus-default)}.avatar--size-3xs .avatar__initials{font-size:0.625rem}.avatar--size-3xs.avatar--has-icon{padding-right:0.125rem;padding-left:0.125rem}.avatar--size-2xs .avatar__initials{font-size:0.625rem}.avatar--size-2xs.avatar--has-icon{padding-right:0.125rem;padding-left:0.125rem}.avatar--size-xs .avatar__initials{font-size:0.75rem}.avatar--size-xs.avatar--has-icon{padding-right:0.4375rem;padding-left:0.4375rem}.avatar--size-s .avatar__initials{font-size:0.75rem}.avatar--size-s.avatar--has-icon{padding-right:var(--s-space-8);padding-left:var(--s-space-8)}.avatar--size-m .avatar__initials{font-size:var(--s-font-size-base)}.avatar--size-m.avatar--has-icon{padding-right:0.625rem;padding-left:0.625rem}.avatar--size-l .avatar__initials{font-size:var(--s-font-size-lg)}.avatar--size-l.avatar--has-icon{padding-right:var(--s-space-12);padding-left:var(--s-space-12)}.avatar--size-xl .avatar__initials{font-size:var(--s-font-size-xl)}.avatar--size-xl.avatar--has-icon{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}.avatar--size-2xl .avatar__initials{font-size:3.375rem}.avatar--size-2xl.avatar--has-icon{padding-right:var(--s-space-32);padding-left:var(--s-space-32)}.avatar--size-2xl .avatar__tool{transform:translate3d(-25%, -25%, 0px)}.avatar--size-2xl .avatar__tool--position-top{transform:translate3d(-25%, 25%, 0px)}.avatar--color-banana .avatar__initials{color:var(--s-decorative-banana-text);background-color:var(--s-decorative-banana-surface-subdued)}.avatar--color-blueberry .avatar__initials{color:var(--s-decorative-blueberry-text);background-color:var(--s-decorative-blueberry-surface-subdued)}.avatar--color-chilli .avatar__initials{color:var(--s-decorative-chilli-text);background-color:var(--s-decorative-chilli-surface-subdued)}.avatar--color-grape .avatar__initials{color:var(--s-decorative-grape-text);background-color:var(--s-decorative-grape-surface-subdued)}.avatar--color-kiwi .avatar__initials{color:var(--s-decorative-kiwi-text);background-color:var(--s-decorative-kiwi-surface-subdued)}.avatar--color-pumpkin .avatar__initials{color:var(--s-decorative-pumpkin-text);background-color:var(--s-decorative-pumpkin-surface-subdued)}.avatar--color-radish .avatar__initials{color:var(--s-decorative-radish-text);background-color:var(--s-decorative-radish-surface-subdued)}.avatar--color-neutral .avatar__initials{color:var(--s-text-subdued);background-color:var(--s-surface-neutral-subdued)}.avatar__image{overflow:hidden;width:100%;height:100%;border-radius:var(--swirl-avatar-radius)}.avatar__image>img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.avatar__icon{display:inline-flex}.avatar__icon>*{width:100%;height:100%}.avatar__icon>*::part(icon){width:100%;height:100%}.avatar__initials{position:absolute;display:inline-flex;min-width:0;padding-right:0.0625rem;padding-left:0.0625rem;justify-content:center;align-items:center;border-radius:var(--swirl-avatar-radius);font-weight:var(--s-font-weight-medium);inset:0}.avatar__initials>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.avatar__badge{position:absolute;bottom:0;left:55%;display:inline-flex;min-width:1.5rem;height:1.5rem;transform:translate3d(0, 25%, 0)}.avatar__badge--position-top{top:0;bottom:auto;transform:translate3d(0, -25%, 0)}.avatar__label{margin-top:var(--s-space-4);color:var(--s-icon-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);text-align:center}.avatar__tool{position:absolute;right:0;bottom:0;display:inline-flex;transform:translate3d(25%, 25%, 0)}.avatar__tool--position-top{top:0;bottom:auto;transform:translate3d(25%, -25%, 0)}';export{n as swirl_avatar}

package/dist/swirl-components/p-d9e99fd7.entry.js

@@ -1 +0,0 @@
-import{r as t,c as s,h as i,a}from"./p-Dz56lJ37.js";import{c as o}from"./p-orsBiyT_.js";import{D as e}from"./p-Bfn7CHM9.js";import"./p-CCck-DTo.js";const n=class{constructor(i){t(this,i),this.action=s(this,"action",7),this.dismiss=s(this,"dismiss",7),this.accessibleDismissLabel="Dismiss",this.actionPosition="inline",this.intent="default",this.mediaQueryUnsubscribe=()=>{},this.onAction=()=>{this.action.emit(this.toastId)},this.onDismiss=()=>{this.clearTimer(),this.dismiss.emit(this.toastId)}}watchDuration(){this.startTimer()}componentDidLoad(){this.startTimer(),this.mediaQueryUnsubscribe=e.subscribe((t=>{this.forceIconProps(t)}))}disconnectedCallback(){this.clearTimer(),this.mediaQueryUnsubscribe()}forceIconProps(t){const s=this.iconEl?.children[0],i=this.dismissIconEl;s?.setAttribute("size",t?"20":"24"),i?.setAttribute("size",t?"20":"24")}startTimer(){this.clearTimer(),void 0!==this.duration&&this.duration!==1/0&&(this.timeout=setTimeout((()=>{this.dismiss.emit(this.toastId)}),this.duration))}clearTimer(){Boolean(this.timeout)&&(clearTimeout(this.timeout),this.timeout=void 0)}render(){const t=o("toast",`toast--intent-${this.intent}`,`toast--action-position-${this.actionPosition}`);return i(a,{key:"f263cbe9a8e349d88043fb0d0324e074e4419f0d"},i("div",{key:"5f43b16eb1a1e75e8b7e4fe6b4376965d636924d",class:t},this.icon&&i("span",{key:"adf6249bfd7605b15740e6db5ecf4141df68d614",class:"toast__icon",innerHTML:this.icon,part:"toast__icon",ref:t=>this.iconEl=t}),i("span",{key:"aad0cd3c9b764eb3e05cc5bb9341857aad7a70d2",class:"toast__content-container"},i("span",{key:"82f1b9eab0e381248cbaca4d2b5afbbcb4f30184",class:"toast__content",innerHTML:this.content,part:"toast__content"},i("slot",{key:"0cd204c4d4eab757ad6bc067ba5e356bcaeb9fd2"})),this.actionLabel&&i("swirl-button",{key:"bafaa29ab97d29c6cf41b5d01028c96c1821887b",class:"toast__action-button",label:this.actionLabel,onClick:this.onAction,variant:"plain"})),i("button",{key:"b52db302c2841959fbe68eb938cf10fe59c08103","aria-label":this.dismissLabel||this.accessibleDismissLabel,class:"toast__dismiss-button",onClick:this.onDismiss,type:"button"},this.dismissLabel,!Boolean(this.dismissLabel)&&i("swirl-icon-close",{key:"48379c17bd2ea4b0f183b003b3d0c5e86a8300f4",ref:t=>this.dismissIconEl=t}))))}static get watchers(){return{duration:[{watchDuration:0}]}}};n.style=":host{display:flex}:host *{box-sizing:border-box}.toast{display:flex;width:100%;max-width:28rem;padding:var(--s-space-16);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);box-shadow:var(--s-shadow-level-2)}.toast--intent-critical{background-color:var(--s-surface-critical-default)}.toast--intent-success{background-color:var(--s-surface-success-default)}.toast--action-position-bottom .toast__content-container{flex-direction:column}.toast--action-position-bottom .toast__action-button{margin-top:var(--s-space-8);margin-left:0;align-self:flex-start}.toast__icon{display:inline-flex;width:1.5rem;height:1.5rem;margin-right:0.625rem;flex-shrink:0}.toast__icon ::part(icon){color:var(--s-icon-on-status)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__icon{width:1.25rem;height:1.25rem}}.toast__content-container{display:flex;flex-grow:1;min-width:0}.toast__content{flex-basis:min-content;flex-grow:1;line-height:var(--s-line-height-base);text-align:left;align-self:flex-start}.toast__content ::part(link){color:var(--text-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__content{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.toast__action-button{--swirl-plain-button-text-color-default:var(--s-text-on-status);--swirl-plain-button-text-color-hovered:var(--s-text-on-status);--swirl-plain-button-text-color-pressed:var(--s-text-on-status);margin-left:var(--s-space-16);min-width:0;flex-shrink:1}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__action-button{margin-top:-1px}}.toast__dismiss-button{display:inline-flex;min-width:1.5rem;height:1.5rem;margin-left:var(--s-space-16);padding:0;flex-shrink:0;justify-content:center;align-items:center;border:none;color:var(--s-text-on-status);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-semibold);cursor:pointer}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__dismiss-button{margin-top:calc(-1 * var(--s-space-2))}}.toast__dismiss-button ::part(icon){color:var(--s-icon-on-status)}";export{n as swirl_toast}