@getflip/swirl-components 0.8.6 → 0.9.0

package/dist/swirl-components/{p-622824bf.entry.js → p-851d6744.entry.js}

@@ -1 +1 @@
-import{r as o,c as i,h as t,H as e,g as a}from"./p-9fe00e8a.js";import{o as s,s as r,f as n,c as p,a as d}from"./p-e8bb09e8.js";import{e as l,d as c}from"./p-33c168b3.js";import{c as h}from"./p-efffd297.js";import{i as m,q as v}from"./p-bb8f2656.js";import"./p-86bd3473.js";const f=class{constructor(t){o(this,t),this.popoverClose=i(this,"popoverClose",7),this.popoverOpen=i(this,"popoverOpen",7),this.animation="scale-in-xy",this.enableFlip=!0,this.offset=8,this.placement="bottom-start",this.active=!1,this.closing=!1,this.toggle=o=>{o.stopPropagation(),this.active?this.close():this.open()},this.onKeydown=o=>{"Escape"===o.code&&this.active&&(o.stopPropagation(),this.close())},this.reposition=async()=>{const o=m();if(!Boolean(this.triggerEl)||!Boolean(this.contentContainer))return;if(o)return void(this.position=void 0);const i="number"==typeof this.offset?{mainAxis:this.offset,crossAxis:0}:{mainAxis:this.offset[0],crossAxis:this.offset[1]},t=this.enableFlip?[s(i),r(),n()]:[s(i),r()];this.position=await p(this.triggerEl,this.contentContainer,{middleware:t,placement:this.placement,strategy:"fixed"})},this.onCloseButtonClick=()=>{this.close()}}componentDidLoad(){this.connectTrigger(),this.updateFocusableChildren(),this.updateTriggerAttributes()}disconnectedCallback(){l(this.scrollContainer)}onWindowFocusIn(o){this.active&&!this.el.contains(o.target)&&this.close()}onWindowClick(o){if(!this.active)return;const i=this.el.contains(o.target),t=o.composedPath().some((o=>!!(Boolean(o)&&o instanceof Node)&&this.el.contains(o)));i||t||o.target===this.triggerEl||this.close()}async close(){var o;!this.closing&&this.active&&(this.popoverClose.emit(),this.disableAutoUpdate&&this.disableAutoUpdate(),this.closing=!0,setTimeout((()=>{this.active=!1,this.closing=!1,this.updateTriggerAttributes()}),150),this.unlockBodyScroll(),null===(o=this.getNativeTriggerElement())||void 0===o||o.focus())}async open(){this.active||(this.adjustWidth(),this.active=!0,this.popoverOpen.emit(),this.updateFocusableChildren(),this.updateTriggerAttributes(),requestAnimationFrame((async()=>{await this.reposition(),this.focusableChildren.length>0?this.focusableChildren[0].focus():this.contentContainer.focus(),this.disableAutoUpdate&&this.disableAutoUpdate(),this.disableAutoUpdate=d(this.triggerEl,this.contentContainer,this.reposition),this.scrollContainer.scrollTop=0,this.lockBodyScroll()})))}connectTrigger(){this.triggerEl=v(document.body,`#${this.trigger}`)[0],Boolean(this.triggerEl)&&this.triggerEl.addEventListener("click",(o=>{this.toggle(o)}))}getNativeTriggerElement(){var o,i,t;return this.triggerEl.tagName.startsWith("FLIP-")&&((null===(o=this.triggerEl)||void 0===o?void 0:o.children[0])||(null===(t=null===(i=this.triggerEl)||void 0===i?void 0:i.shadowRoot)||void 0===t?void 0:t.children[0]))||this.triggerEl}updateTriggerAttributes(){if(!Boolean(this.triggerEl))return;const o=this.getNativeTriggerElement();o.setAttribute("aria-controls",this.popoverId),o.setAttribute("aria-expanded",String(this.active)),o.setAttribute("aria-haspopup","dialog")}updateFocusableChildren(){this.focusableChildren=v(this.el,'[role="menuitem"], [role="listbox"]')}adjustWidth(){let o=this.useContainerWidth;[!0,"true"].includes(this.useContainerWidth)?o=!0:[!1,"false"].includes(this.useContainerWidth)&&(o=!1);const i=!window.matchMedia("(min-width: 768px)").matches;if(Boolean(o)&&!i){const i="string"==typeof o&&this.el.closest(o)||this.el.parentElement;this.contentContainer.style.maxWidth="none",this.contentContainer.style.width=i.getBoundingClientRect().width+"px"}else this.contentContainer.style.maxWidth="",this.contentContainer.style.width=""}lockBodyScroll(){m()&&c(this.scrollContainer)}unlockBodyScroll(){l(this.scrollContainer)}render(){var o,i;const a=h("popover",`popover--animation-${this.animation}`,{"popover--closing":this.closing,"popover--active":this.active,"popover--inactive":!this.active});return t(e,{id:this.popoverId},t("div",{class:a,onKeyDown:this.onKeydown},t("div",{"aria-hidden":this.active?"false":"true","aria-label":this.label,class:"popover__content",role:"dialog",ref:o=>this.contentContainer=o,style:{top:Boolean(this.position)?`${null===(o=this.position)||void 0===o?void 0:o.y}px`:"",left:Boolean(this.position)?`${null===(i=this.position)||void 0===i?void 0:i.x}px`:""},tabindex:"-1"},t("span",{class:"popover__handle"}),t("div",{class:"popover__scroll-container",ref:o=>this.scrollContainer=o},t("slot",null))),this.active&&t("div",{class:"popover__backdrop",onClick:this.onCloseButtonClick})))}get el(){return a(this)}};f.style=":host{position:relative;z-index:var(--s-z-40);display:inline-flex}:host *{box-sizing:border-box}.popover--active:not(.popover--closing) .popover__backdrop{-webkit-animation:0.15s popover-fade-in;animation:0.15s popover-fade-in}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__backdrop{-webkit-animation:none;animation:none}}.popover--active:not(.popover--closing) .popover__content{-webkit-animation:0.15s popover-slide-in;animation:0.15s popover-slide-in}@media (min-width: 768px){.popover--active:not(.popover--closing) .popover__content{transform-origin:top left;-webkit-animation:0.15s popover-fade-scale-in-xy;animation:0.15s popover-fade-scale-in-xy}}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__content{-webkit-animation:none;animation:none}}.popover--closing .popover__backdrop{-webkit-animation:0.15s popover-fade-out;animation:0.15s popover-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.popover--closing .popover__backdrop{-webkit-animation:none;animation:none}}.popover--closing .popover__content{-webkit-animation:0.15s popover-slide-out;animation:0.15s popover-slide-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (min-width: 768px){.popover--closing .popover__content{-webkit-animation:0.15s popover-fade-out;animation:0.15s popover-fade-out}}@media (prefers-reduced-motion){.popover--closing .popover__content{-webkit-animation:none;animation:none}}.popover--inactive .popover__content{display:none}@media (min-width: 768px){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{-webkit-animation:0.15s popover-fade-scale-in-y;animation:0.15s popover-fade-scale-in-y}}@media (prefers-reduced-motion){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{-webkit-animation:none;animation:none}}.popover__backdrop{position:fixed;z-index:0;background-color:rgba(0, 0, 0, 0.2);-webkit-animation:0.15s popover-backdrop-fade-in;animation:0.15s popover-backdrop-fade-in;inset:0}@media (prefers-reduced-motion){.popover__backdrop{-webkit-animation:none;animation:none}}@media (min-width: 768px){.popover__backdrop{display:none}}.popover__content{position:fixed;z-index:2;right:0;bottom:0;left:0;overflow:hidden;border-top-left-radius:var(--s-border-radius-xl);border-top-right-radius:var(--s-border-radius-xl);background-color:var(--s-surface-overlay-default)}@media (min-width: 768px){.popover__content{right:unset;bottom:unset;left:unset;max-width:22.5rem;border-radius:var(--s-border-radius-sm);-webkit-animation:none;animation:none;box-shadow:0.125rem 0.25rem 2.5rem rgba(0, 0, 0, 0.14)}}.popover__scroll-container{overflow-x:hidden;overflow-y:auto;width:100%;max-height:90vh;padding-top:var(--s-space-24);padding-bottom:var(--s-space-24);overscroll-behavior:contain}@media (min-width: 768px){.popover__scroll-container{max-height:22rem;padding-top:var(--s-space-8);padding-bottom:var(--s-space-8)}}.popover__handle{position:absolute;top:var(--s-space-8);left:50%;width:2.5rem;height:0.375rem;border-radius:0.1875rem;background-color:var(--s-border-default);transform:translatex(-50%)}@media (min-width: 768px){.popover__handle{display:none}}@-webkit-keyframes popover-slide-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes popover-slide-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@-webkit-keyframes popover-slide-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes popover-slide-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@-webkit-keyframes popover-fade-in{from{opacity:0}to{opacity:1}}@keyframes popover-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes popover-fade-out{from{opacity:1}to{opacity:0}}@keyframes popover-fade-out{from{opacity:1}to{opacity:0}}@-webkit-keyframes popover-fade-scale-in-xy{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes popover-fade-scale-in-xy{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@-webkit-keyframes popover-fade-scale-in-y{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}@keyframes popover-fade-scale-in-y{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}";export{f as flip_popover}
+import{r as o,c as i,h as t,H as e,g as a}from"./p-9fe00e8a.js";import{o as s,s as n,f as r,c as p,a as d}from"./p-e8bb09e8.js";import{e as l,d as c}from"./p-33c168b3.js";import{c as h}from"./p-efffd297.js";import{i as m,q as v}from"./p-bb8f2656.js";import"./p-86bd3473.js";const f=class{constructor(t){o(this,t),this.popoverClose=i(this,"popoverClose",7),this.popoverOpen=i(this,"popoverOpen",7),this.animation="scale-in-xy",this.enableFlip=!0,this.offset=8,this.placement="bottom-start",this.active=!1,this.closing=!1,this.toggle=o=>{o.stopPropagation(),this.active?this.close():this.open()},this.onKeydown=o=>{"Escape"===o.code&&this.active&&(o.stopPropagation(),this.close())},this.reposition=async()=>{const o=m();if(!Boolean(this.triggerEl)||!Boolean(this.contentContainer))return;if(o)return void(this.position=void 0);const i="number"==typeof this.offset?{mainAxis:this.offset,crossAxis:0}:{mainAxis:this.offset[0],crossAxis:this.offset[1]},t=this.enableFlip?[s(i),n(),r()]:[s(i),n()];this.position=await p(this.triggerEl,this.contentContainer,{middleware:t,placement:this.placement,strategy:"fixed"})},this.onCloseButtonClick=()=>{this.close()}}componentDidLoad(){this.connectTrigger(),this.updateFocusableChildren(),this.updateTriggerAttributes()}disconnectedCallback(){l(this.scrollContainer)}onWindowFocusIn(o){this.active&&!this.el.contains(o.target)&&this.close()}onWindowClick(o){if(!this.active)return;const i=this.el.contains(o.target),t=o.composedPath().some((o=>!!(Boolean(o)&&o instanceof Node)&&this.el.contains(o)));i||t||o.target===this.triggerEl||this.close()}async close(){var o;!this.closing&&this.active&&(this.popoverClose.emit(),this.disableAutoUpdate&&this.disableAutoUpdate(),this.closing=!0,setTimeout((()=>{this.active=!1,this.closing=!1,this.updateTriggerAttributes()}),150),this.unlockBodyScroll(),null===(o=this.getNativeTriggerElement())||void 0===o||o.focus())}async open(){this.active||(this.adjustWidth(),this.active=!0,this.popoverOpen.emit(),this.updateFocusableChildren(),this.updateTriggerAttributes(),requestAnimationFrame((async()=>{await this.reposition(),this.focusableChildren.length>0?this.focusableChildren[0].focus():this.contentContainer.focus(),this.disableAutoUpdate&&this.disableAutoUpdate(),this.disableAutoUpdate=d(this.triggerEl,this.contentContainer,this.reposition),this.scrollContainer.scrollTop=0,this.lockBodyScroll()})))}connectTrigger(){this.triggerEl=v(document.body,`#${this.trigger}`)[0],Boolean(this.triggerEl)&&this.triggerEl.addEventListener("click",(o=>{this.toggle(o)}))}getNativeTriggerElement(){var o,i,t;return this.triggerEl.tagName.startsWith("FLIP-")&&((null===(o=this.triggerEl)||void 0===o?void 0:o.children[0])||(null===(t=null===(i=this.triggerEl)||void 0===i?void 0:i.shadowRoot)||void 0===t?void 0:t.children[0]))||this.triggerEl}updateTriggerAttributes(){if(!Boolean(this.triggerEl))return;const o=this.getNativeTriggerElement();o.setAttribute("aria-controls",this.popoverId),o.setAttribute("aria-expanded",String(this.active)),o.setAttribute("aria-haspopup","dialog")}updateFocusableChildren(){this.focusableChildren=v(this.el,'[role="menuitem"], [role="listbox"]')}adjustWidth(){let o=this.useContainerWidth;[!0,"true"].includes(this.useContainerWidth)?o=!0:[!1,"false"].includes(this.useContainerWidth)&&(o=!1);const i=!window.matchMedia("(min-width: 768px)").matches;if(Boolean(o)&&!i){const i="string"==typeof o&&this.el.closest(o)||this.el.parentElement;this.contentContainer.style.maxWidth="none",this.contentContainer.style.width=i.getBoundingClientRect().width+"px"}else this.contentContainer.style.maxWidth="",this.contentContainer.style.width=""}lockBodyScroll(){m()&&c(this.scrollContainer)}unlockBodyScroll(){l(this.scrollContainer)}render(){var o,i;const a=h("popover",`popover--animation-${this.animation}`,{"popover--closing":this.closing,"popover--active":this.active,"popover--inactive":!this.active});return t(e,{id:this.popoverId},t("div",{class:a,onKeyDown:this.onKeydown},t("div",{"aria-hidden":this.active?"false":"true","aria-label":this.label,class:"popover__content",role:"dialog",ref:o=>this.contentContainer=o,style:{top:Boolean(this.position)?`${null===(o=this.position)||void 0===o?void 0:o.y}px`:"",left:Boolean(this.position)?`${null===(i=this.position)||void 0===i?void 0:i.x}px`:""},tabindex:"-1"},t("span",{class:"popover__handle"}),t("div",{class:"popover__scroll-container",ref:o=>this.scrollContainer=o},t("slot",null))),this.active&&t("div",{class:"popover__backdrop",onClick:this.onCloseButtonClick})))}get el(){return a(this)}};f.style=":host{position:relative;z-index:var(--s-z-40);display:inline-flex}:host *{box-sizing:border-box}.popover--active:not(.popover--closing) .popover__backdrop{-webkit-animation:0.15s popover-fade-in;animation:0.15s popover-fade-in}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__backdrop{-webkit-animation:none;animation:none}}.popover--active:not(.popover--closing) .popover__content{-webkit-animation:0.15s popover-slide-in;animation:0.15s popover-slide-in}@media (min-width: 768px){.popover--active:not(.popover--closing) .popover__content{transform-origin:top left;-webkit-animation:0.15s popover-fade-scale-in-xy;animation:0.15s popover-fade-scale-in-xy}}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__content{-webkit-animation:none;animation:none}}.popover--closing .popover__backdrop{-webkit-animation:0.15s popover-fade-out;animation:0.15s popover-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.popover--closing .popover__backdrop{-webkit-animation:none;animation:none}}.popover--closing .popover__content{-webkit-animation:0.15s popover-slide-out;animation:0.15s popover-slide-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (min-width: 768px){.popover--closing .popover__content{-webkit-animation:0.15s popover-fade-out;animation:0.15s popover-fade-out}}@media (prefers-reduced-motion){.popover--closing .popover__content{-webkit-animation:none;animation:none}}.popover--inactive .popover__content{display:none}@media (min-width: 768px){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{-webkit-animation:0.15s popover-fade-scale-in-y;animation:0.15s popover-fade-scale-in-y}}@media (prefers-reduced-motion){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{-webkit-animation:none;animation:none}}.popover__backdrop{position:fixed;z-index:0;background-color:rgba(0, 0, 0, 0.2);-webkit-animation:0.15s popover-backdrop-fade-in;animation:0.15s popover-backdrop-fade-in;inset:0}@media (prefers-reduced-motion){.popover__backdrop{-webkit-animation:none;animation:none}}@media (min-width: 768px){.popover__backdrop{display:none}}.popover__content{position:fixed;z-index:2;right:0;bottom:0;left:0;overflow:hidden;border-top-left-radius:var(--s-border-radius-xl);border-top-right-radius:var(--s-border-radius-xl);background-color:var(--s-surface-overlay-default)}@media (min-width: 768px){.popover__content{right:unset;bottom:unset;left:unset;max-width:22.5rem;border-radius:var(--s-border-radius-sm);-webkit-animation:none;animation:none;box-shadow:var(--s-shadow-level-1)}}.popover__scroll-container{overflow-x:hidden;overflow-y:auto;width:100%;max-height:90vh;padding-top:var(--s-space-24);padding-bottom:var(--s-space-24);overscroll-behavior:contain}@media (min-width: 768px){.popover__scroll-container{max-height:22rem;padding-top:var(--s-space-8);padding-bottom:var(--s-space-8)}}.popover__handle{position:absolute;top:var(--s-space-8);left:50%;width:2.5rem;height:0.375rem;border-radius:0.1875rem;background-color:var(--s-border-default);transform:translatex(-50%)}@media (min-width: 768px){.popover__handle{display:none}}@-webkit-keyframes popover-slide-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes popover-slide-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@-webkit-keyframes popover-slide-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes popover-slide-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@-webkit-keyframes popover-fade-in{from{opacity:0}to{opacity:1}}@keyframes popover-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes popover-fade-out{from{opacity:1}to{opacity:0}}@keyframes popover-fade-out{from{opacity:1}to{opacity:0}}@-webkit-keyframes popover-fade-scale-in-xy{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes popover-fade-scale-in-xy{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@-webkit-keyframes popover-fade-scale-in-y{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}@keyframes popover-fade-scale-in-y{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}";export{f as flip_popover}

package/dist/swirl-components/{p-3574a311.entry.js → p-879c7fe0.entry.js}

@@ -1 +1 @@
-import{r as i,h as t,F as s,c as e,H as o,g as l}from"./p-9fe00e8a.js";import{q as n}from"./p-bb8f2656.js";import{c as h}from"./p-efffd297.js";import"./p-86bd3473.js";const r=class{constructor(t){i(this,t),this.size=24}render(){return t("svg",{class:"flip-icon",fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${this.size} ${this.size}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&t(s,null,t("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M12.4142 4.91924C12.8047 5.30976 12.8047 5.94293 12.4142 6.33345L7.08086 11.6667C6.69033 12.0572 6.05717 12.0572 5.66664 11.6667L3.70711 9.70707C3.31658 9.31655 3.31658 8.68338 3.70711 8.29286C4.09763 7.90233 4.7308 7.90233 5.12132 8.29286L6.37375 9.54539L11 4.91924C11.3905 4.52871 12.0237 4.52871 12.4142 4.91924Z",fill:"currentColor"})),24===this.size&&t(s,null,t("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M18.6213 7.37879C19.2071 7.96458 19.2071 8.91433 18.6213 9.50011L10.6213 17.5C10.0355 18.0858 9.08577 18.0858 8.49998 17.5L5.56068 14.5605C4.97489 13.9748 4.97489 13.025 5.56068 12.4392C6.14646 11.8534 7.09621 11.8534 7.682 12.4392L9.56064 14.318L16.5 7.37879C17.0858 6.79301 18.0355 6.79301 18.6213 7.37879Z",fill:"currentColor"})),28===this.size&&t(s,null,t("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M21.7248 8.60863C22.4083 9.29205 22.4083 10.4001 21.7248 11.0835L12.3915 20.4167C11.7081 21.1001 10.6001 21.1001 9.91663 20.4167L6.48744 16.9873C5.80403 16.3039 5.80403 15.1959 6.48744 14.5125C7.17086 13.8291 8.2789 13.8291 8.96232 14.5125L11.1541 16.7044L19.25 8.60863C19.9334 7.92521 21.0414 7.92521 21.7248 8.60863Z",fill:"currentColor"})))}};r.style=":host{display:inline-flex}";const c=class{constructor(t){i(this,t),this.valueChange=e(this,"valueChange",7),this.value=[],this.onFocus=()=>{Boolean(this.focusedItem)?this.focusItem(this.getActiveItemIndex()):this.focusItem(0)},this.onClick=i=>{i.preventDefault();const t=i.target,s=null==t?void 0:t.closest("flip-option-list-item");Boolean(s)&&this.selectItem(this.items.findIndex((i=>i.value===s.value)))},this.onKeyDown=i=>{"ArrowDown"===i.code?(i.preventDefault(),this.focusNextItem()):"ArrowUp"===i.code?(i.preventDefault(),this.focusPreviousItem()):"Space"===i.code||"Enter"===i.code?(i.preventDefault(),this.selectFocusedItem()):"Home"===i.code?(i.preventDefault(),this.focusItem(0)):"End"===i.code?(i.preventDefault(),this.focusItem(this.items.length-1)):"KeyA"===i.code&&(i.metaKey||i.ctrlKey)&&this.multiSelect&&(i.preventDefault(),this.selectAllItems())}}componentDidLoad(){this.updateItems(),this.observeSlotChanges(),this.setItemDisabledState(),this.setItemContext(),this.syncItemsWithValue()}disconnectedCallback(){var i;null===(i=this.observer)||void 0===i||i.disconnect()}watchDisabled(){this.setItemDisabledState()}watchMultiSelect(){this.setItemContext()}watchValue(){this.syncItemsWithValue()}observeSlotChanges(){this.observer=new MutationObserver((()=>{this.updateItems()})),this.observer.observe(this.listboxEl,{childList:!0})}updateItems(){this.items=n(this.el,"flip-option-list-item")}setItemDisabledState(){this.items.forEach((i=>i.disabled=this.disabled))}setItemContext(){this.multiSelect?this.items.forEach((i=>i.context="multi-select")):(this.items.forEach((i=>i.context="single-select")),this.value.length>1&&this.updateValue([this.value[0]]))}selectItem(i){if(this.disabled)return;const t=this.items[i];if(t.disabled)return;const s=this.value.includes(t.value);this.multiSelect||(this.value=[]),this.updateValue(s?this.value.filter((i=>i!==t.value)):[...this.value,t.value])}updateValue(i){this.value=i,this.valueChange.emit(this.value)}selectFocusedItem(){this.disabled||-1===this.getActiveItemIndex()||this.selectItem(this.getActiveItemIndex())}selectAllItems(){if(this.disabled)return;const i=this.items.every((i=>this.value.includes(i.value)));this.updateValue(i?[]:this.items.map((i=>i.value)))}syncItemsWithValue(){this.items.forEach((i=>i.selected=this.value.includes(i.value)))}focusItem(i){if(this.disabled)return;this.items.forEach((i=>i.shadowRoot.querySelector('[role="option"]').removeAttribute("tabIndex")));const t=this.items[i].shadowRoot.querySelector('[role="option"]');Boolean(t)&&(t.setAttribute("tabIndex","0"),t.focus(),this.focusedItem=t)}focusNextItem(){if(this.disabled)return;const i=this.getActiveItemIndex(),t=Math.min(i+1,this.items.length-1);this.focusItem(t)}focusPreviousItem(){const i=this.getActiveItemIndex(),t=Math.max(i-1,0);this.focusItem(t)}getActiveItemIndex(){return this.items.map((i=>i.shadowRoot.querySelector('[role="option"]'))).findIndex((i=>i===this.focusedItem))}render(){return t(o,null,t("div",{"aria-label":this.label,"aria-multiselectable":this.multiSelect?"true":void 0,class:"option-list",id:this.optionListId,onClick:this.onClick,onFocus:this.onFocus,onKeyDown:this.onKeyDown,ref:i=>this.listboxEl=i,role:"listbox",tabIndex:this.disabled?-1:0},t("slot",null)))}get el(){return l(this)}static get watchers(){return{disabled:["watchDisabled"],multiSelect:["watchMultiSelect"],value:["watchValue"]}}};c.style=".sc-flip-option-list-h{display:block}.sc-flip-option-list-h *.sc-flip-option-list{box-sizing:border-box}";const a=class{constructor(t){i(this,t),this.context="single-select",this.selected=!1}componentDidLoad(){this.forceIconProps()}forceIconProps(){if(!Boolean(this.iconEl))return;const i=this.iconEl.children[0];null==i||i.setAttribute("size","24")}render(){const i=this.disabled?"true":void 0,s=String(this.selected),e="multi-select"===this.context,l=Boolean(this.icon)&&"single-select"===this.context,n=this.selected&&"single-select"===this.context,r=h("option-list-item",`option-list-item--context-${this.context}`,{"option-list-item--disabled":this.disabled,"option-list-item--selected":this.selected});return t(o,null,t("div",{"aria-disabled":i,"aria-selected":s,class:r,role:"option"},l&&t("span",{class:"option-list-item__icon",innerHTML:this.icon,ref:i=>this.iconEl=i}),e&&t("span",{class:"option-list-item__checkbox"},t("span",{class:"option-list-item__checkbox-box"},this.selected&&t("flip-icon-check-strong",{class:"option-list-item__checkbox-icon",size:16}))),t("span",{class:"option-list-item__label"},this.label),n&&t("span",{class:"option-list-item__selection-icon"},t("flip-icon-check-small",null))))}};a.style=":host{display:inline-flex;width:100%}:host *{box-sizing:border-box}.option-list-item{display:inline-flex;width:100%;min-height:3rem;padding:var(--s-space-12) var(--s-space-16);align-items:center;background-color:var(--s-surface-overlay-default);cursor:pointer;gap:var(--s-space-12)}.option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-hovered)}.option-list-item:active:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item:focus{background-color:var(--s-surface-overlay-hovered);outline:none}.option-list-item--selected .option-list-item__label{color:var(--s-text-highlight)}.option-list-item--selected .option-list-item__icon{color:var(--s-icon-highlight)}.option-list-item--selected .option-list-item__checkbox-box{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.option-list-item--disabled{cursor:default}.option-list-item--disabled.option-list-item--selected .option-list-item__checkbox-box{background-color:var(--s-icon-disabled)}.option-list-item--disabled.option-list-item--selected .option-list-item__checkbox-icon{color:var(--s-text-on-status)}.option-list-item--disabled .option-list-item__label{color:var(--s-text-disabled)}.option-list-item--disabled .option-list-item__icon,.option-list-item--disabled .option-list-item__selection-icon,.option-list-item--disabled .option-list-item__checkbox-icon{color:var(--s-icon-disabled)}.option-list-item--disabled .option-list-item__checkbox-box{border-color:var(--s-icon-disabled);background-color:var(--s-surface-overlay-default)}.option-list-item__label{flex-grow:1;color:var(--s-text-default);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}.option-list-item__icon{display:inline-flex;flex-shrink:0;color:var(--s-icon-default)}.option-list-item__selection-icon{display:inline-flex;flex-shrink:0;color:var(--s-icon-highlight)}.option-list-item__checkbox{display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2)}.option-list-item__checkbox-box{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:var(--s-border-radius-s)}.option-list-item__checkbox-icon{display:inline-flex}";export{r as flip_icon_check_small,c as flip_option_list,a as flip_option_list_item}
+import{r as i,h as t,F as s,c as e,H as o,g as l}from"./p-9fe00e8a.js";import{q as n}from"./p-bb8f2656.js";import{c as h}from"./p-efffd297.js";import"./p-86bd3473.js";const r=class{constructor(t){i(this,t),this.size=24}render(){return t("svg",{class:"flip-icon",fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${this.size} ${this.size}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&t(s,null,t("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M12.4142 4.91924C12.8047 5.30976 12.8047 5.94293 12.4142 6.33345L7.08086 11.6667C6.69033 12.0572 6.05717 12.0572 5.66664 11.6667L3.70711 9.70707C3.31658 9.31655 3.31658 8.68338 3.70711 8.29286C4.09763 7.90233 4.7308 7.90233 5.12132 8.29286L6.37375 9.54539L11 4.91924C11.3905 4.52871 12.0237 4.52871 12.4142 4.91924Z",fill:"currentColor"})),24===this.size&&t(s,null,t("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M18.6213 7.37879C19.2071 7.96458 19.2071 8.91433 18.6213 9.50011L10.6213 17.5C10.0355 18.0858 9.08577 18.0858 8.49998 17.5L5.56068 14.5605C4.97489 13.9748 4.97489 13.025 5.56068 12.4392C6.14646 11.8534 7.09621 11.8534 7.682 12.4392L9.56064 14.318L16.5 7.37879C17.0858 6.79301 18.0355 6.79301 18.6213 7.37879Z",fill:"currentColor"})),28===this.size&&t(s,null,t("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M21.7248 8.60863C22.4083 9.29205 22.4083 10.4001 21.7248 11.0835L12.3915 20.4167C11.7081 21.1001 10.6001 21.1001 9.91663 20.4167L6.48744 16.9873C5.80403 16.3039 5.80403 15.1959 6.48744 14.5125C7.17086 13.8291 8.2789 13.8291 8.96232 14.5125L11.1541 16.7044L19.25 8.60863C19.9334 7.92521 21.0414 7.92521 21.7248 8.60863Z",fill:"currentColor"})))}};r.style=":host{display:inline-flex}";const c=class{constructor(t){i(this,t),this.valueChange=e(this,"valueChange",7),this.value=[],this.onFocus=()=>{Boolean(this.focusedItem)?this.focusItem(this.getActiveItemIndex()):this.focusItem(0)},this.onClick=i=>{i.preventDefault();const t=i.target,s=null==t?void 0:t.closest("flip-option-list-item");Boolean(s)&&this.selectItem(this.items.findIndex((i=>i.value===s.value)))},this.onKeyDown=i=>{"ArrowDown"===i.code?(i.preventDefault(),this.focusNextItem()):"ArrowUp"===i.code?(i.preventDefault(),this.focusPreviousItem()):"Space"===i.code||"Enter"===i.code?(i.preventDefault(),this.selectFocusedItem()):"Home"===i.code?(i.preventDefault(),this.focusItem(0)):"End"===i.code?(i.preventDefault(),this.focusItem(this.items.length-1)):"KeyA"===i.code&&(i.metaKey||i.ctrlKey)&&this.multiSelect&&(i.preventDefault(),this.selectAllItems())}}componentDidLoad(){this.updateItems(),this.observeSlotChanges(),this.setItemDisabledState(),this.setItemContext(),this.syncItemsWithValue()}disconnectedCallback(){var i;null===(i=this.observer)||void 0===i||i.disconnect()}watchDisabled(){this.setItemDisabledState()}watchMultiSelect(){this.setItemContext()}watchValue(){this.syncItemsWithValue()}observeSlotChanges(){this.observer=new MutationObserver((()=>{this.updateItems()})),this.observer.observe(this.listboxEl,{childList:!0})}updateItems(){this.items=n(this.el,"flip-option-list-item")}setItemDisabledState(){this.items.forEach((i=>i.disabled=this.disabled))}setItemContext(){this.multiSelect?this.items.forEach((i=>i.context="multi-select")):(this.items.forEach((i=>i.context="single-select")),this.value.length>1&&this.updateValue([this.value[0]]))}selectItem(i){if(this.disabled)return;const t=this.items[i];if(t.disabled)return;const s=this.value.includes(t.value);this.multiSelect||(this.value=[]),this.updateValue(s?this.value.filter((i=>i!==t.value)):[...this.value,t.value])}updateValue(i){this.value=i,this.valueChange.emit(this.value)}selectFocusedItem(){this.disabled||-1===this.getActiveItemIndex()||this.selectItem(this.getActiveItemIndex())}selectAllItems(){if(this.disabled)return;const i=this.items.every((i=>this.value.includes(i.value)));this.updateValue(i?[]:this.items.map((i=>i.value)))}syncItemsWithValue(){this.items.forEach((i=>i.selected=this.value.includes(i.value)))}focusItem(i){if(this.disabled)return;this.items.forEach((i=>i.shadowRoot.querySelector('[role="option"]').removeAttribute("tabIndex")));const t=this.items[i].shadowRoot.querySelector('[role="option"]');Boolean(t)&&(t.setAttribute("tabIndex","0"),t.focus(),this.focusedItem=t)}focusNextItem(){if(this.disabled)return;const i=this.getActiveItemIndex(),t=Math.min(i+1,this.items.length-1);this.focusItem(t)}focusPreviousItem(){const i=this.getActiveItemIndex(),t=Math.max(i-1,0);this.focusItem(t)}getActiveItemIndex(){return this.items.map((i=>i.shadowRoot.querySelector('[role="option"]'))).findIndex((i=>i===this.focusedItem))}render(){return t(o,null,t("div",{"aria-label":this.label,"aria-multiselectable":this.multiSelect?"true":void 0,class:"option-list",id:this.optionListId,onClick:this.onClick,onFocus:this.onFocus,onKeyDown:this.onKeyDown,ref:i=>this.listboxEl=i,role:"listbox",tabIndex:this.disabled?-1:0},t("slot",null)))}get el(){return l(this)}static get watchers(){return{disabled:["watchDisabled"],multiSelect:["watchMultiSelect"],value:["watchValue"]}}};c.style=".sc-flip-option-list-h{display:block}.sc-flip-option-list-h *.sc-flip-option-list{box-sizing:border-box}";const a=class{constructor(t){i(this,t),this.context="single-select",this.selected=!1}componentDidLoad(){this.forceIconProps()}forceIconProps(){if(!Boolean(this.iconEl))return;const i=this.iconEl.children[0];null==i||i.setAttribute("size","24")}render(){const i=this.disabled?"true":void 0,s=String(this.selected),e="multi-select"===this.context,l=Boolean(this.icon)&&"single-select"===this.context,n=this.selected&&"single-select"===this.context,r=h("option-list-item",`option-list-item--context-${this.context}`,{"option-list-item--disabled":this.disabled,"option-list-item--selected":this.selected});return t(o,null,t("div",{"aria-disabled":i,"aria-selected":s,class:r,role:"option"},l&&t("span",{class:"option-list-item__icon",innerHTML:this.icon,ref:i=>this.iconEl=i}),e&&t("span",{class:"option-list-item__checkbox"},t("span",{class:"option-list-item__checkbox-box"},this.selected&&t("flip-icon-check-strong",{class:"option-list-item__checkbox-icon",size:16}))),t("span",{class:"option-list-item__label"},this.label),n&&t("span",{class:"option-list-item__selection-icon"},t("flip-icon-check-small",null))))}};a.style=":host{display:inline-flex;width:100%}:host *{box-sizing:border-box}.option-list-item{display:inline-flex;width:100%;min-height:3rem;padding:var(--s-space-12) var(--s-space-16);align-items:center;background-color:var(--s-surface-overlay-default);cursor:pointer;gap:var(--s-space-12)}.option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-hovered)}.option-list-item:active:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item:focus{outline:none}.option-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered)}.option-list-item--selected .option-list-item__label{color:var(--s-text-highlight)}.option-list-item--selected .option-list-item__icon{color:var(--s-icon-highlight)}.option-list-item--selected .option-list-item__checkbox-box{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.option-list-item--disabled{cursor:default}.option-list-item--disabled.option-list-item--selected .option-list-item__checkbox-box{background-color:var(--s-icon-disabled)}.option-list-item--disabled.option-list-item--selected .option-list-item__checkbox-icon{color:var(--s-text-on-status)}.option-list-item--disabled .option-list-item__label{color:var(--s-text-disabled)}.option-list-item--disabled .option-list-item__icon,.option-list-item--disabled .option-list-item__selection-icon,.option-list-item--disabled .option-list-item__checkbox-icon{color:var(--s-icon-disabled)}.option-list-item--disabled .option-list-item__checkbox-box{border-color:var(--s-icon-disabled);background-color:var(--s-surface-overlay-default)}.option-list-item__label{flex-grow:1;color:var(--s-text-default);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}.option-list-item__icon{display:inline-flex;flex-shrink:0;color:var(--s-icon-default)}.option-list-item__selection-icon{display:inline-flex;flex-shrink:0;color:var(--s-icon-highlight)}.option-list-item__checkbox{display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2)}.option-list-item__checkbox-box{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:var(--s-border-radius-s)}.option-list-item__checkbox-icon{display:inline-flex}";export{r as flip_icon_check_small,c as flip_option_list,a as flip_option_list_item}