@getflip/swirl-components 0.268.0 → 0.270.0

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

@@ -1 +0,0 @@
-import{r as t,h as i,H as e,g as s,F as a}from"./p-30e99c25.js";import{q as o,b as r,g as n}from"./p-0f3e0216.js";import{c}from"./p-a5dce9e6.js";const l=class{constructor(i){t(this,i),this.onKeyDown=t=>{"ArrowDown"===t.code||"ArrowRight"===t.code?(t.preventDefault(),this.focusNextItem()):"ArrowUp"!==t.code&&"ArrowLeft"!==t.code||(t.preventDefault(),this.focusPreviousItem())},this.onFocusOut=t=>{if(this.isInsidePopover)return;const i=t.relatedTarget,e=t.target,s="SWIRL-ACTION-LIST-ITEM"===e?.tagName,a=null===i||!this.el.contains(i);!this.isInsidePopover&&a&&s&&this.container.setAttribute("tabindex","0")},this.onFocus=()=>{if(this.isInsidePopover)return;this.container.removeAttribute("tabindex");const t=this.getItems(),i=this.getActiveItemIndex();i>-1?t[i]?.focus():t[0]?.focus()},this.isInsidePopover=void 0}componentDidLoad(){queueMicrotask((()=>{this.isInsidePopover=null!==this.el.closest("swirl-popover"),this.isInsidePopover||this.container.setAttribute("tabindex","0")}))}getItems(){return o(this.el,'[role="menuitem"]')}focusNextItem(){const t=this.getItems();t[(this.getActiveItemIndex()+1)%t.length].focus()}focusPreviousItem(){const t=this.getItems(),i=this.getActiveItemIndex(),e=0===i?t.length-1:i-1;t[e]?.focus()}getActiveItemIndex(){const t=this.getItems(),i=r();return t.findIndex((t=>t===i||t===i?.querySelector('[role="menuitem"]')))}render(){return i(e,{key:"df9e8d994a640babeec12638708d986a90e15ccb"},i("div",{key:"75d900e53d5cab787775d484b744e2f61a6fa0df","aria-orientation":"vertical",class:"action-list",onFocusout:this.isInsidePopover?void 0:this.onFocusOut,onFocus:this.isInsidePopover?void 0:this.onFocus,onKeyDown:this.onKeyDown,part:"action-list",ref:t=>this.container=t,role:"menu"},i("slot",{key:"33ee2e5013f8d4c95b4ba52581296940230a9574"})))}get el(){return s(this)}};l.style=":host{display:block;width:100%}:host *{box-sizing:border-box}.action-list{background-color:var(--s-surface-overlay-default)}";const d=class{constructor(i){t(this,i),this.desktopMediaQuery=n(),this.desktopMediaQueryHandler=t=>{this.forceIconProps(t.matches)},this.badge=void 0,this.disabled=void 0,this.description=void 0,this.icon=void 0,this.intent="default",this.label=void 0,this.size="m",this.swirlAriaExpanded=void 0,this.swirlAriaHaspopup=void 0,this.suffix=void 0}componentDidLoad(){this.forceIconProps(this.desktopMediaQuery.matches),this.desktopMediaQuery.onchange=this.desktopMediaQueryHandler}componentDidRender(){this.forceIconProps(this.desktopMediaQuery.matches)}disconnectedCallback(){this.desktopMediaQuery.removeEventListener?.("change",this.desktopMediaQueryHandler)}forceIconProps(t){const i=this.iconEl?.children[0],e=this.suffixEl?.children[0];i?.setAttribute("size",t?"20":"24"),"SWIRL-TAG"!==e?.tagName&&e?.setAttribute("size",t?"20":"24")}render(){const t=Boolean(this.badge),s=Boolean(this.el.querySelector('[slot="suffix"]')),a=(Boolean(this.suffix)||s)&&!this.disabled,o=c("action-list-item",`action-list-item--intent-${this.intent}`,`action-list-item--size-${this.size}`);return i(e,{key:"06605ecf01b587dbfb1de890ba776cdb72926c5b"},i("button",{key:"c70ad0ecbc3e58a6b5c8543c37907346f3301284","aria-expanded":this.swirlAriaExpanded,"aria-haspopup":this.swirlAriaHaspopup,class:o,disabled:this.disabled,part:"action-list-item",role:"menuitem",tabIndex:-1,type:"button"},this.icon&&i("span",{key:"e250cabb8119ad251d4d3d70cd080408f2122d5d",class:"action-list-item__icon",innerHTML:this.icon,ref:t=>this.iconEl=t}),i("span",{key:"28361e8c9cd8696c3661d7263d550a66c87fd26e",class:"action-list-item__label-container"},i("span",{key:"c8d504ca27d5ba2d1c8979ce45dda984c1e48436",class:"action-list-item__label"},this.label),this.description&&i("span",{key:"303dec5fe699a2c47a4e9e5417d06e3285a30d6f",class:"action-list-item__description"},this.description)),t&&i("span",{key:"96c4500b611acc6a1cb40cbb8b6088deffb273b6",class:"action-list-item__badge",innerHTML:this.badge}),a&&i("span",{key:"739d6e49ad6890a23c1b12eea9037da43c9c9e52",class:"action-list-item__suffix",innerHTML:s?void 0:this.suffix,ref:t=>this.suffixEl=t},i("slot",{key:"a391b536421efd55d4132772d143ec89e757c9d8",name:"suffix"}))))}get el(){return s(this)}};d.style=":host{display:block}:host *{box-sizing:border-box}.action-list-item{display:inline-flex;width:100%;min-width:15rem;margin:0;padding:var(--s-space-12) var(--s-space-16);justify-content:flex-start;align-items:center;border:none;color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;line-height:var(--s-line-height-base);text-align:left;cursor:pointer;gap:var(--s-space-12)}.action-list-item:hover{background-color:var(--s-surface-overlay-hovered);--swirl-tag-background-default:var(--s-surface-sunken-pressed)}.action-list-item:focus{outline:none}.action-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered)}.action-list-item:active{background-color:var(--s-surface-overlay-pressed)}.action-list-item:disabled{background-color:var(--s-surface-overlay-default);cursor:default}.action-list-item:disabled .action-list-item__label,.action-list-item:disabled .action-list-item__description{color:var(--s-text-disabled)}.action-list-item:disabled .action-list-item__icon{color:var(--s-icon-disabled)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.action-list-item{padding:var(--s-space-8) var(--s-space-12);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);gap:var(--s-space-8)}}.action-list-item--size-l{padding:var(--s-space-16)}.action-list-item--intent-critical ::part(icon){color:var(--s-icon-critical)}.action-list-item--intent-critical:not(:disabled) .action-list-item__label{color:var(--s-text-critical)}.action-list-item--intent-critical:not(:disabled) .action-list-item__icon{color:var(--s-icon-critical)}.action-list-item__icon{display:inline-flex;width:1.5rem;height:1.5rem;flex-shrink:0;color:var(--s-icon-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.action-list-item__icon{width:1.25rem;height:1.25rem}}.action-list-item__label-container{display:inline-flex;min-width:0;flex-grow:1;flex-shrink:1;align-items:flex-start;flex-direction:column}.action-list-item__label{overflow:hidden;max-width:100%;font-weight:var(--s-font-weight-medium);white-space:nowrap;text-overflow:ellipsis}.action-list-item__description{color:var(--s-text-subdued)}.action-list-item__badge{overflow:hidden;min-width:4rem;padding-left:var(--s-space-8);flex-shrink:3;color:var(--s-text-subdued);font-weight:var(--s-font-weight-medium);text-align:right;white-space:nowrap;text-overflow:ellipsis}.action-list-item__suffix{display:inline-flex;flex-shrink:0;color:var(--s-icon-highlight)}";const h=class{constructor(i){t(this,i),this.borderColor="default",this.color="default",this.label=void 0,this.orientation="horizontal",this.spacing="8"}componentWillLoad(){this.forceColor()}forceColor(){"default"!==this.borderColor&&(console.warn('[Swirl] The "borderColor" prop of swirl-separator is deprecated and will be removed with the next major release. Please use the "color" prop to achieve the same result.'),this.color=this.borderColor)}render(){const t="horizontal"===this.orientation?{paddingTop:`var(--s-space-${this.spacing})`,paddingBottom:`var(--s-space-${this.spacing})`}:{paddingRight:`var(--s-space-${this.spacing})`,paddingLeft:`var(--s-space-${this.spacing})`},s=c("separator",`separator--color-${this.color}`,`separator--orientation-${this.orientation}`);return i(e,{key:"9cb972d889442ef48f3ab65f6c60019822d93258","aria-orientation":this.orientation,class:s,role:"separator",style:t},i("span",{key:"f776b4d21bd22a4c4a7d1960f6dda0c5f317a634",class:"separator__line"}),this.label&&i(a,{key:"582ebc1523ef4670dccc0385839efe00297c608a"},i("span",{key:"43adeaf3215ac01addc7a311d7ee39d74033aa82",class:"separator__label"},this.label),i("span",{key:"c9096ba71a04b585360117a9e8654c6f0ed708d0",class:"separator__line"})))}};h.style=":host{display:flex;width:100%;align-items:center;gap:var(--s-space-8)}:host *{box-sizing:border-box}:host(.separator--orientation-vertical){display:inline-flex;width:auto;flex-direction:column}:host(.separator--orientation-vertical) .separator__line{width:var(--s-border-width-default);height:100%;min-height:1.125rem}:host(.separator--color-strong) .separator__line{background-color:var(--s-border-strong)}:host(.separator--color-strong) .separator__label{color:var(--s-text-subdued)}:host(.separator--color-highlight) .separator__line{background-color:var(--s-border-highlight)}:host(.separator--color-highlight) .separator__label{color:var(--s-text-highlight)}.separator__line{display:block;width:100%;height:var(--s-border-width-default);background-color:var(--s-border-default)}.separator__label{flex-shrink:0;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;font-size:var(--s-font-size-sm);color:var(--s-text-disabled)}";export{l as swirl_action_list,d as swirl_action_list_item,h as swirl_separator}

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

@@ -1 +0,0 @@
-import{r as s,h as C,F as c}from"./p-30e99c25.js";import{c as e}from"./p-a5dce9e6.js";const t=class{constructor(C){s(this,C),this.size=24}render(){const s=20===this.size?24:this.size,t=e("swirl-symbol",`swirl-symbol--size-${this.size}`);return C("svg",{key:"59b6cdc810ba6cd894c34eeb0dc71e6c394fd397",class:t,fill:"none",height:this.size,part:"symbol",viewBox:`0 0 ${s} ${s}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},C(c,{key:"ebff67e4f2a77cc49481219e20f2992c381bdbc6"},C("path",{key:"1676c26c9d61a0bc4c6e3145429c290fbb8cd165",d:"M2.917 7.042C2.739 7.042 2.56499 7.09478 2.41699 7.19368C2.26898 7.29257 2.15363 7.43313 2.08551 7.59758C2.01739 7.76204 1.99957 7.943 2.03429 8.11758C2.06902 8.29216 2.15474 8.45253 2.2806 8.5784C2.40647 8.70426 2.56683 8.78998 2.74142 8.82471C2.916 8.85943 3.09696 8.84161 3.26141 8.77349C3.42587 8.70537 3.56643 8.59002 3.66532 8.44201C3.76421 8.29401 3.817 8.12 3.817 7.942C3.817 7.7033 3.72218 7.47439 3.55339 7.3056C3.38461 7.13682 3.15569 7.042 2.917 7.042ZM9.259 7.059C6.459 7.059 4.709 8.967 4.709 12.001C4.709 15.059 6.459 16.959 9.259 16.959C12.042 16.959 13.801 15.059 13.801 12.001C13.801 8.968 12.043 7.059 9.259 7.059ZM18.292 7.059C16.209 7.059 14.725 8.209 14.725 9.917C14.725 11.275 15.567 12.125 17.333 12.534L18.575 12.834C19.783 13.109 20.275 13.509 20.275 14.201C20.275 15.001 19.467 15.568 18.317 15.568C17.142 15.568 16.259 14.993 16.167 14.11H14.5C14.567 15.877 16.017 16.96 18.217 16.96C20.542 16.96 22 15.818 22 14.002C22 12.577 21.167 11.769 19.233 11.327L18.125 11.077C16.95 10.794 16.467 10.419 16.467 9.785C16.467 8.985 17.2 8.452 18.284 8.452C19.368 8.452 20.125 8.992 20.208 9.884H21.841C21.799 8.201 20.409 7.059 18.292 7.059ZM9.258 8.517C10.958 8.517 12.05 9.875 12.05 12C12.05 14.142 10.958 15.5 9.258 15.5C7.541 15.5 6.458 14.142 6.458 12C6.458 9.875 7.541 8.517 9.258 8.517ZM2.093 9.759V16.801H3.75V9.759H2.092H2.093Z",fill:"currentColor"})))}};t.style=":host{display:inline-flex}";export{t as swirl_symbol_ios}