@getflip/swirl-components 0.363.1 → 0.363.3

package/dist/components/swirl-table.js

@@ -227,11 +227,17 @@ const SwirlTable$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTable extends H
                 this.setupDragDrop();
             }
         });
-        this.rowMutationObserver.observe(this.bodyEl, {
+        this.startRowMutationObserver();
+    }
+    startRowMutationObserver() {
+        this.rowMutationObserver?.observe(this.bodyEl, {
             childList: true,
             subtree: true,
         });
     }
+    stopRowMutationObserver() {
+        this.rowMutationObserver?.disconnect();
+    }
     setupDragDrop() {
         if (this.sortable) {
             this.sortable.destroy();
@@ -259,6 +265,9 @@ const SwirlTable$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTable extends H
                 handle: this.dragDropHandle,
                 fallbackOnBody: true,
                 group: `swirl-table-${Math.random().toString().substring(2)}`,
+                onStart: () => {
+                    this.stopRowMutationObserver();
+                },
                 onEnd: (event) => {
                     event.stopPropagation();
                     const { to, newIndex, oldIndex, item } = event;
@@ -272,6 +281,7 @@ const SwirlTable$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTable extends H
                             : undefined,
                         newPrevSiblingItemId: newIndex > 0 ? to.children[newIndex - 1].id : undefined,
                     });
+                    this.startRowMutationObserver();
                 },
             });
         }
@@ -571,7 +581,7 @@ const SwirlTable$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTable extends H
             "table--show-empty-state": this.empty && !this.loading,
             "table--keyboard-move": this.movingViaKeyboard,
         });
-        return (h(Host, { key: '6bc1959e06eaff434db4841127eaf6011ea4e386' }, h("div", { key: '1aef97ca18f0d367df69681fd4a0287fc1e9a96d', class: className }, this.enableDragDrop && (h("swirl-visually-hidden", { key: 'ae609948912c9656417c710d3bd0e1cc4b8e7977' }, h("span", { key: '8f6d333178d51be1ca097c346f90d01c92f1dfa7', "aria-live": "assertive" }, this.liveRegionText))), h("div", { key: '9ad655fd644d07acdc86c194d9685958f4acbcd9', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, h("div", { key: 'ce68c4da82f895a975e7d48852470bd60b861ce0', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: '77389ebb48e386ebb8d896444a394fa3c9cb82ec' }, h("div", { key: '65d40dac426958eb868d9d93461bb27f8f389b1d', id: "caption" }, this.caption))), h("div", { key: '01c0b5caa080855c98799e4cf2e8d3c3d91e0baf', role: "rowgroup" }, h("div", { key: '66e18f47a2964f15d64b4adfec51b88fb3563c1b', class: "table__header", ref: (el) => (this.headerEl = el), role: "row" }, h("slot", { key: '7e6d17abfec2e509afeff2a4bca5ad4634bc8705', name: "columns" }))), h("div", { key: 'cc5f8948dcf6998d8bd3497b9d93fc1218052278', class: "table__body", ref: (el) => (this.bodyEl = el) }, h("slot", { key: '17d4f92f350e958fd3270569b9fc18f08ccfe325', name: "rows" }), h("div", { key: '25499fcf2e5fbe30be4b281f121fe8df48517692', class: "table__empty-row", role: "row" }, h("div", { key: '007c30a0120784a4c86e22c8b036ee16b4720b6a', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("slot", { key: 'c535c880ecb853342633e3036d99d417a4dd7c83', name: "empty" }), !hasEmptyStateSlotAssignment && (h("swirl-text", { key: 'd5afb052b4c575930aacd9ee366ae91115db16ac', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (h(Host, { key: '31cc2b99cd42ce8de24fcdca3bd25d677b2065e9' }, h("div", { key: '2b10bbe4a18214e22f2ecedb07f2806d830abb55', class: className }, this.enableDragDrop && (h("swirl-visually-hidden", { key: 'aac0580b6da061bcf6a4e57f9e3308bcd83cd9ab' }, h("span", { key: '3c2c47c530275c59c13af5ae0bf95fe865546848', "aria-live": "assertive" }, this.liveRegionText))), h("div", { key: '063f4ec7388d8a9b9cc986e24e98dab85deb81b7', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, h("div", { key: '44ae0cb1ac3dbedba432e5154bb890311544a361', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: '4e98279e3a5e8dd340b05f1851559cbf35b25d95' }, h("div", { key: 'ec620a55154a96b65760fdfe5857d36cabc20e03', id: "caption" }, this.caption))), h("div", { key: 'de46c8483c070f631b529ff0e53db8b6a27ec8d8', role: "rowgroup" }, h("div", { key: '18a6f22082c3fe08134f6843ac9b9722501716fa', class: "table__header", ref: (el) => (this.headerEl = el), role: "row" }, h("slot", { key: '167710dee7162c62f40c218f6f2fb98e3f7534c0', name: "columns" }))), h("div", { key: '58cd2a6ee100461b4a9e8b5da35884f4271092a2', class: "table__body", ref: (el) => (this.bodyEl = el) }, h("slot", { key: 'd258590441b67c639ba479bcbf7ae85dc840fa88', name: "rows" }), h("div", { key: '9ddfc91f1a3055363798312fb0fd1aeb2671c2db', class: "table__empty-row", role: "row" }, h("div", { key: '78c4b0fa18d31277de03507b564ec42eba10c0a3', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("slot", { key: 'f56688d7ff20f7ae1a3fc4f9f8241bc235b8ff5e', name: "empty" }), !hasEmptyStateSlotAssignment && (h("swirl-text", { key: 'b7cb802b3420a554459372d8813f1b7ba6571929', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/swirl-time-input.js

@@ -54,6 +54,7 @@ const SwirlTimeInput$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTimeInput e
     watchValue(newValue, oldValue) {
         if (newValue !== oldValue) {
             this.valueChange.emit(newValue);
+            this.mask.value = newValue;
         }
     }
     updateIconSize(smallIcon) {
@@ -142,7 +143,7 @@ const SwirlTimeInput$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTimeInput e
         const className = classNames("time-input", {
             "time-input--inline": this.inline,
         });
-        return (h(Host, { key: '39b650bef21d4378fe7c2281e59f7732eced9f4e' }, h("div", { key: '4047e3490f47ee4db04bbdfbaa25d5bfa8967e47', class: className }, h("input", { key: '7e44a86247a2940ea355bed8e9d21b8abb2c06c5', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text" }), h("span", { key: '8a2656db86ae2f530f7b4c2b323d444fcf8cafa0', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '51240f09d13d7bd04e0ddae837cbf5fcafb380af', size: this.iconSize })))));
+        return (h(Host, { key: 'bb150e1e738e6b70dd32089de213f0ad8ce49db8' }, h("div", { key: '58728d57b1349781a97070a9b8d47d27123946ab', class: className }, h("input", { key: '84e63c31acfc49b1b54fbce93c0351ed3359da28', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text" }), h("span", { key: '98ac3a262dee95ab34e94f80a7632d074b881f64', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '8266ab31d312c5d5947feb6c77dfe20b727cc601', size: this.iconSize })))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/esm/swirl-table.entry.js

@@ -224,11 +224,17 @@ const SwirlTable = class {
                 this.setupDragDrop();
             }
         });
-        this.rowMutationObserver.observe(this.bodyEl, {
+        this.startRowMutationObserver();
+    }
+    startRowMutationObserver() {
+        this.rowMutationObserver?.observe(this.bodyEl, {
             childList: true,
             subtree: true,
         });
     }
+    stopRowMutationObserver() {
+        this.rowMutationObserver?.disconnect();
+    }
     setupDragDrop() {
         if (this.sortable) {
             this.sortable.destroy();
@@ -256,6 +262,9 @@ const SwirlTable = class {
                 handle: this.dragDropHandle,
                 fallbackOnBody: true,
                 group: `swirl-table-${Math.random().toString().substring(2)}`,
+                onStart: () => {
+                    this.stopRowMutationObserver();
+                },
                 onEnd: (event) => {
                     event.stopPropagation();
                     const { to, newIndex, oldIndex, item } = event;
@@ -269,6 +278,7 @@ const SwirlTable = class {
                             : undefined,
                         newPrevSiblingItemId: newIndex > 0 ? to.children[newIndex - 1].id : undefined,
                     });
+                    this.startRowMutationObserver();
                 },
             });
         }
@@ -568,7 +578,7 @@ const SwirlTable = class {
             "table--show-empty-state": this.empty && !this.loading,
             "table--keyboard-move": this.movingViaKeyboard,
         });
-        return (h(Host, { key: '6bc1959e06eaff434db4841127eaf6011ea4e386' }, h("div", { key: '1aef97ca18f0d367df69681fd4a0287fc1e9a96d', class: className }, this.enableDragDrop && (h("swirl-visually-hidden", { key: 'ae609948912c9656417c710d3bd0e1cc4b8e7977' }, h("span", { key: '8f6d333178d51be1ca097c346f90d01c92f1dfa7', "aria-live": "assertive" }, this.liveRegionText))), h("div", { key: '9ad655fd644d07acdc86c194d9685958f4acbcd9', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, h("div", { key: 'ce68c4da82f895a975e7d48852470bd60b861ce0', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: '77389ebb48e386ebb8d896444a394fa3c9cb82ec' }, h("div", { key: '65d40dac426958eb868d9d93461bb27f8f389b1d', id: "caption" }, this.caption))), h("div", { key: '01c0b5caa080855c98799e4cf2e8d3c3d91e0baf', role: "rowgroup" }, h("div", { key: '66e18f47a2964f15d64b4adfec51b88fb3563c1b', class: "table__header", ref: (el) => (this.headerEl = el), role: "row" }, h("slot", { key: '7e6d17abfec2e509afeff2a4bca5ad4634bc8705', name: "columns" }))), h("div", { key: 'cc5f8948dcf6998d8bd3497b9d93fc1218052278', class: "table__body", ref: (el) => (this.bodyEl = el) }, h("slot", { key: '17d4f92f350e958fd3270569b9fc18f08ccfe325', name: "rows" }), h("div", { key: '25499fcf2e5fbe30be4b281f121fe8df48517692', class: "table__empty-row", role: "row" }, h("div", { key: '007c30a0120784a4c86e22c8b036ee16b4720b6a', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("slot", { key: 'c535c880ecb853342633e3036d99d417a4dd7c83', name: "empty" }), !hasEmptyStateSlotAssignment && (h("swirl-text", { key: 'd5afb052b4c575930aacd9ee366ae91115db16ac', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (h(Host, { key: '31cc2b99cd42ce8de24fcdca3bd25d677b2065e9' }, h("div", { key: '2b10bbe4a18214e22f2ecedb07f2806d830abb55', class: className }, this.enableDragDrop && (h("swirl-visually-hidden", { key: 'aac0580b6da061bcf6a4e57f9e3308bcd83cd9ab' }, h("span", { key: '3c2c47c530275c59c13af5ae0bf95fe865546848', "aria-live": "assertive" }, this.liveRegionText))), h("div", { key: '063f4ec7388d8a9b9cc986e24e98dab85deb81b7', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, h("div", { key: '44ae0cb1ac3dbedba432e5154bb890311544a361', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: '4e98279e3a5e8dd340b05f1851559cbf35b25d95' }, h("div", { key: 'ec620a55154a96b65760fdfe5857d36cabc20e03', id: "caption" }, this.caption))), h("div", { key: 'de46c8483c070f631b529ff0e53db8b6a27ec8d8', role: "rowgroup" }, h("div", { key: '18a6f22082c3fe08134f6843ac9b9722501716fa', class: "table__header", ref: (el) => (this.headerEl = el), role: "row" }, h("slot", { key: '167710dee7162c62f40c218f6f2fb98e3f7534c0', name: "columns" }))), h("div", { key: '58cd2a6ee100461b4a9e8b5da35884f4271092a2', class: "table__body", ref: (el) => (this.bodyEl = el) }, h("slot", { key: 'd258590441b67c639ba479bcbf7ae85dc840fa88', name: "rows" }), h("div", { key: '9ddfc91f1a3055363798312fb0fd1aeb2671c2db', class: "table__empty-row", role: "row" }, h("div", { key: '78c4b0fa18d31277de03507b564ec42eba10c0a3', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("slot", { key: 'f56688d7ff20f7ae1a3fc4f9f8241bc235b8ff5e', name: "empty" }), !hasEmptyStateSlotAssignment && (h("swirl-text", { key: 'b7cb802b3420a554459372d8813f1b7ba6571929', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/swirl-time-input.entry.js

@@ -54,6 +54,7 @@ const SwirlTimeInput = class {
     watchValue(newValue, oldValue) {
         if (newValue !== oldValue) {
             this.valueChange.emit(newValue);
+            this.mask.value = newValue;
         }
     }
     updateIconSize(smallIcon) {
@@ -142,7 +143,7 @@ const SwirlTimeInput = class {
         const className = classnames("time-input", {
             "time-input--inline": this.inline,
         });
-        return (h(Host, { key: '39b650bef21d4378fe7c2281e59f7732eced9f4e' }, h("div", { key: '4047e3490f47ee4db04bbdfbaa25d5bfa8967e47', class: className }, h("input", { key: '7e44a86247a2940ea355bed8e9d21b8abb2c06c5', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text" }), h("span", { key: '8a2656db86ae2f530f7b4c2b323d444fcf8cafa0', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '51240f09d13d7bd04e0ddae837cbf5fcafb380af', size: this.iconSize })))));
+        return (h(Host, { key: 'bb150e1e738e6b70dd32089de213f0ad8ce49db8' }, h("div", { key: '58728d57b1349781a97070a9b8d47d27123946ab', class: className }, h("input", { key: '84e63c31acfc49b1b54fbce93c0351ed3359da28', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text" }), h("span", { key: '98ac3a262dee95ab34e94f80a7632d074b881f64', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '8266ab31d312c5d5947feb6c77dfe20b727cc601', size: this.iconSize })))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/swirl-components/p-4c87fcab.entry.js

@@ -0,0 +1 @@
+import{r as i,c as t,h as s,H as e,d as n}from"./p-CWOhMVtL.js";import{c as a}from"./p-orsBiyT_.js";import{I as r,p as o,i as h,f as m}from"./p-D3UoejeY.js";import{D as p}from"./p-LU4x678Z.js";import"./p-D_MUFqkF.js";const c="HH:mm:ss",d=class{constructor(s){i(this,s),this.inputBlur=t(this,"inputBlur",7),this.inputFocus=t(this,"inputFocus",7),this.valueChange=t(this,"valueChange",7),this.format="HH:mm",this.placeholder="hh:mm",this.iconSize=24,this.mediaQueryUnsubscribe=()=>{},this.onBlur=i=>{this.inputBlur.emit(i)},this.onClick=i=>{i.preventDefault()},this.onFocus=i=>{this.inputFocus.emit(i),this.handleAutoSelect(i)}}componentWillLoad(){const i=Array.from(document.querySelectorAll("swirl-time-input")).indexOf(this.el);this.id=`swirl-time-input-${i}`}componentDidLoad(){this.setupMask(),this.mediaQueryUnsubscribe=p.subscribe((i=>{this.updateIconSize(i)})),this.autoFocus&&setTimeout((()=>{this.inputEl.focus()}))}disconnectedCallback(){this.mask?.destroy(),this.mediaQueryUnsubscribe()}watchFormat(){this.setupMask()}watchValue(i,t){i!==t&&(this.valueChange.emit(i),this.mask.value=i)}updateIconSize(i){this.iconSize=i?20:24}handleAutoSelect(i){this.autoSelect?i.target&&i.target instanceof HTMLInputElement&&i.target.select():setTimeout((()=>{i.target&&i.target instanceof HTMLInputElement&&i.target.setSelectionRange&&i.target.setSelectionRange(0,0)}))}setupMask(){this.mask?.destroy();const i=this.format.replace(/(?<!H)H(?!H)/g,"HH").replace(/(?<!h)h(?!h)/g,"hh").replace(/(?<!m)m(?!m)/g,"mm").replace(/(?<!s)s(?!s)/g,"ss");if(this.mask=r(this.inputEl,{mask:Date,pattern:i.replace(/([^A-Za-z0-9])/g,"$1`"),autofix:"pad",lazy:!0,overwrite:!0,eager:"append",blocks:{HH:{mask:r.MaskedRange,from:0,to:23,maxLength:2},hh:{mask:r.MaskedRange,from:1,to:12,maxLength:2},mm:{mask:r.MaskedRange,from:0,to:59,maxLength:2},ss:{mask:r.MaskedRange,from:0,to:59,maxLength:2}},format:t=>h(t)?(this.value=m(t,c),m(t,i)):"",parse:t=>o(t,i,new Date)}),this.value){const t=o(this.value,c,new Date);if(h(t)){const s=m(t,i);this.mask.value=s}}}render(){const i=!0===this.invalid||!1===this.invalid?String(this.invalid):void 0,t=a("time-input",{"time-input--inline":this.inline});return s(e,{key:"bb150e1e738e6b70dd32089de213f0ad8ce49db8"},s("div",{key:"58728d57b1349781a97070a9b8d47d27123946ab",class:t},s("input",{key:"84e63c31acfc49b1b54fbce93c0351ed3359da28","aria-describedby":this.swirlAriaDescribedby,"aria-disabled":this.disabled?"true":void 0,"aria-invalid":i,autoFocus:this.autoFocus,class:"time-input__input",disabled:this.disabled,id:this.id,inputmode:"numeric",onBlur:this.onBlur,onClick:this.onClick,onFocus:this.onFocus,placeholder:this.placeholder,ref:i=>this.inputEl=i,required:this.required,type:"text"}),s("span",{key:"98ac3a262dee95ab34e94f80a7632d074b881f64",class:"time-input__icon"},s("swirl-icon-time-outlined",{key:"8266ab31d312c5d5947feb6c77dfe20b727cc601",size:this.iconSize}))))}get el(){return n(this)}static get watchers(){return{format:["watchFormat"],value:["watchValue"]}}};d.style=".sc-swirl-time-input-h{display:flex;width:100%}.sc-swirl-time-input-h *.sc-swirl-time-input{box-sizing:border-box}.time-input.sc-swirl-time-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);line-height:var(--s-line-height-sm)}.time-input--inline.sc-swirl-time-input .time-input__icon.sc-swirl-time-input{top:-0.0625rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.time-input--inline.sc-swirl-time-input .time-input__icon.sc-swirl-time-input{top:0}}.time-input__input.sc-swirl-time-input{display:inline-flex;width:calc(100% - 1.25rem - var(--s-space-8));margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.time-input__input.sc-swirl-time-input:focus{outline:none}.time-input__input.sc-swirl-time-input:disabled{color:var(--s-text-disabled);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.time-input__input.sc-swirl-time-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.time-input__icon.sc-swirl-time-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.time-input__icon.sc-swirl-time-input{top:-0.625rem}}";export{d as swirl_time_input}

package/dist/swirl-components/p-992376a7.entry.js

@@ -0,0 +1 @@
+import{r as t,c as e,h as s,H as i,d as o}from"./p-CWOhMVtL.js";import{g as a,c as r}from"./p-orsBiyT_.js";import{S as l}from"./p-CMrz6687.js";import{d as n,i as h,q as c}from"./p-D_MUFqkF.js";var b,d,w=a((d||(d=1,b=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},i=void 0,o=void 0,a=void 0,r=[];return function(){var n=function(t){return"function"==typeof t?t():t}(e),h=(new Date).getTime(),c=!i||h-i>n;i=h;for(var b=arguments.length,d=Array(b),w=0;w<b;w++)d[w]=arguments[w];if(c&&s.leading)return s.accumulate?Promise.resolve(t.call(this,[d])).then((function(t){return t[0]})):Promise.resolve(t.call.apply(t,[this].concat(d)));if(o?clearTimeout(a):o=function(){var t={};return t.promise=new Promise((function(e,s){t.resolve=e,t.reject=s})),t}(),r.push(d),a=setTimeout(l.bind(this),n),s.accumulate){var u=r.length-1;return o.promise.then((function(t){return t[u]}))}return o.promise};function l(){var e=o;clearTimeout(a),Promise.resolve(s.accumulate?t.call(this,r):t.apply(this,r[r.length-1])).then(e.resolve,e.reject),r=[],o=null}}),b));const u={end:"Dropped. Final position in table: {position} of {rowCount}.",initial:"Press space to move the row.",moved:"Current position in table: {position} of {rowCount}.",start:"Row grabbed. Current position in table: {position} of {rowCount}. Press up and down arrow keys to change position, Space to drop."},p=class{constructor(s){t(this,s),this.dropRow=e(this,"dropRow",7),this.dragDropInstructions=u,this.emptyStateLabel="No results found.",this.liveRegionText="",this.triggerRerender=n((async()=>{await this.updateLayout(),this.updateEmptyState()}),0,!0),this.updateLayout=w((async()=>{this.resetCellStyles(),this.resetColumnStyles(),this.resetEmptyRowStyles(),this.resetRowGroupStyles(),this.layoutEmptyRow(),this.layoutRowGroups(),this.layOutCellsAndColumns(),this.updateScrolledState()}),16,{leading:!0}),this.onScroll=()=>{this.updateScrolledState()},this.onFocus=t=>{if(this.movingViaKeyboard){const t=this.el.querySelector(".table-row--moving");t&&this.focusDragHandleOfRow(t)}const e=!!t.target?.closest(this.dragDropHandle);""===this.liveRegionText&&e&&this.updateLiveRegionText("initial")},this.onBlur=t=>{const e=t.relatedTarget,s=!!e?.closest(this.dragDropHandle);this.el.contains(e)&&s||""!==this.liveRegionText&&this.updateLiveRegionText()},this.onKeyDown=t=>{if(!this.enableDragDrop)return;const e=t.target?.closest("swirl-table-row");t.target?.closest(this.dragDropHandle)&&("Space"===t.code?(t.preventDefault(),t.stopPropagation(),this.toggleKeyboardMove(e)):"ArrowUp"===t.code?(t.preventDefault(),t.stopPropagation(),this.moveRow(e,"up")):"ArrowDown"===t.code?(t.preventDefault(),t.stopPropagation(),this.moveRow(e,"down")):"Escape"===t.code&&(t.preventDefault(),t.stopPropagation(),this.cancelKeyboardMove()))}}async componentDidLoad(){this.setupIntersectionObserver(),this.setupMutationObservers(),queueMicrotask((()=>{this.setupDragDrop()}))}disconnectedCallback(){this.intersectionObserver?.disconnect(),this.columnMutationObserver?.disconnect(),this.rowMutationObserver?.disconnect(),this.sortable?.destroy()}handleEnableDragDropChange(){queueMicrotask((()=>{this.setupDragDrop()}))}setupIntersectionObserver(){this.intersectionObserver=new IntersectionObserver(this.onVisibilityChange.bind(this),{threshold:0}),this.intersectionObserver.observe(this.container)}setupMutationObservers(){this.columnMutationObserver=new MutationObserver((t=>{t.some((t=>t.addedNodes.length||t.removedNodes.length))&&this.updateLayout()})),this.columnMutationObserver.observe(this.headerEl,{childList:!0,subtree:!0}),this.rowMutationObserver=new MutationObserver((t=>{t.some((t=>t.addedNodes.length||t.removedNodes.length))&&(this.updateEmptyState(),this.setupDragDrop())})),this.startRowMutationObserver()}startRowMutationObserver(){this.rowMutationObserver?.observe(this.bodyEl,{childList:!0,subtree:!0})}stopRowMutationObserver(){this.rowMutationObserver?.disconnect()}setupDragDrop(){if(this.sortable&&(this.sortable.destroy(),this.sortable=void 0),this.enableDragDrop){if(this.el.querySelector("swirl-table-row-group"))return void console.warn('[Swirl] Drag & drop is not yet supported for swirl-tables using the "swirl-table-row-group" component.');if(!this.dragDropHandle)return void console.warn('[Swirl] swirl-table required the "dragDropHandle" prop to be set when drag & drop is enabled.');const t=this.el.querySelector('[slot="rows"]');this.dragDropContainer="SWIRL-TABLE-ROW"!==t?.tagName?t??this.bodyEl:this.bodyEl,this.sortable=new l(this.dragDropContainer,{animation:100,direction:"vertical",handle:this.dragDropHandle,fallbackOnBody:!0,group:`swirl-table-${Math.random().toString().substring(2)}`,onStart:()=>{this.stopRowMutationObserver()},onEnd:t=>{t.stopPropagation();const{to:e,newIndex:s,oldIndex:i,item:o}=t;this.dropRow.emit({newIndex:s,oldIndex:i,item:o,itemId:o.id??o.querySelector(":scope > swirl-table-row").id,newNextSiblingItemId:s<e.children.length-1?e.children[s+1].id:void 0,newPrevSiblingItemId:s>0?e.children[s-1].id:void 0}),this.startRowMutationObserver()}})}}async onVisibilityChange(t){t.some((t=>t.isIntersecting))&&setTimeout((async()=>{await this.updateLayout()}),100)}async componentDidRender(){await this.updateLayout(),this.updateEmptyState()}async onWindowResize(){await this.updateLayout()}async rerender(){this.triggerRerender()}resetEmptyRowStyles(){const t=this.el.querySelector(".table__empty-row");Boolean(t)&&(t.style.width="")}resetRowGroupStyles(){Array.from(this.el.querySelectorAll("swirl-table-row-group")).forEach((t=>{const e=t.shadowRoot.querySelector(".table-row-group__header-row");Boolean(e)&&(t.shadowRoot.querySelector(".table-row-group__header-row").style.width="")}))}resetColumnStyles(){this.getColumns().forEach((t=>{t.classList.remove("table-column--has-shadow","table-column--is-sticky","table-column--is-sticky-right"),t.style.right="",t.style.left="",t.style.position="",t.style.zIndex=""}))}resetCellStyles(){this.getCells().forEach((t=>{t.classList.remove("table-cell--has-shadow","table-cell--is-sticky","table-cell--is-sticky-right"),t.style.flex="",t.style.left="",t.style.right="",t.style.position="",t.style.zIndex=""}))}updateScrolledState(){const t=h();if(void 0===this.container)return;const e=this.container.scrollWidth>this.container.clientWidth,s=this.container.scrollLeft>0,i=Math.ceil(this.container.clientWidth+this.container.scrollLeft)>=Math.floor(this.container.scrollWidth);e!==this.scrollable&&(e&&!t?this.container.classList.add("table__container--scrollable"):this.container.classList.remove("table__container--scrollable")),s!==this.scrolled&&(s&&!t?this.container.classList.add("table__container--scrolled"):this.container.classList.remove("table__container--scrolled")),i!==this.scrolledToEnd&&(i&&!t?this.container.classList.add("table__container--scrolled-to-end"):this.container.classList.remove("table__container--scrolled-to-end"))}getColumns(){return Array.from(this.el.querySelectorAll("swirl-table-column"))}getCells(){return Array.from(this.el.querySelectorAll("swirl-table-cell"))}layoutEmptyRow(){const t=this.el.querySelector(".table__empty-row");if(!Boolean(t))return;const e=`${this.el.querySelector(".table__container").scrollWidth}px`;t.style.width=e}layoutRowGroups(){const t=Array.from(this.el.querySelectorAll("swirl-table-row-group")),e=`${this.el.querySelector(".table__container")?.scrollWidth}px`;t.forEach((t=>{const s=t.shadowRoot.querySelector(".table-row-group__header-row");Boolean(s)&&(t.shadowRoot.querySelector(".table-row-group__header-row").style.width=e)}))}layOutCellsAndColumns(){const t=this.getColumns(),e=this.getCells();t.forEach(((s,i)=>{const o=this.getCellsForColumn(e,t,i),a=this.calculateColumnProperties(s,t,i);o.forEach((t=>this.applyCellStyles(t,s,a))),this.applyColumnStyles(s,a)}))}getCellsForColumn(t,e,s){return t.filter(((t,i)=>(s-i)%e.length==0))}calculateColumnProperties(t,e,s){return{leftOffsetForStickyColumn:t.sticky?this.getLeftOffsetForStickyColumn(e,s):0,columnWidth:`${t.getBoundingClientRect().width}px`,isLastColumnSticky:t.sticky&&e.length===s+1,hasShadowRight:t.sticky&&!this.hasStickyColumnsToRight(e,s)}}applyCellStyles(t,e,s){const{leftOffsetForStickyColumn:i,columnWidth:o,isLastColumnSticky:a,hasShadowRight:r}=s;t.style.flex=Boolean(o)?`0 0 ${o}`:"",h()||(e.sticky&&!a&&(t.classList.add("table-cell--is-sticky"),t.style.left=i+"px",r&&t.classList.add("table-cell--has-shadow-right")),a&&t.classList.add("table-cell--is-sticky-right","table-cell--has-shadow-left"))}applyColumnStyles(t,e){if(h())return;const{leftOffsetForStickyColumn:s,isLastColumnSticky:i,hasShadowRight:o}=e;t.sticky&&!i&&(t.classList.add("table-column--is-sticky"),t.style.left=s+"px",o&&t.classList.add("table-column--has-shadow-right")),i&&t.classList.add("table-column--is-sticky-right","table-column--has-shadow-left")}getLeftOffsetForStickyColumn(t,e){return t.slice(0,e).reduce(((t,e)=>{if(e.sticky)return t+e.getBoundingClientRect().width}),0)}hasStickyColumnsToRight(t,e){return t.slice(e+1,t.length-1).some((t=>t.sticky))}updateEmptyState(){const t=this.el.querySelector('[slot="rows"]');this.empty=!Boolean(t)||0===t.children.length}updateLiveRegionText(t,e={}){let s=t?this.dragDropInstructions[t]:"";for(const[t,i]of Object.entries(e??{}))s=s.replaceAll(`{${t}}`,String(i));s!==this.liveRegionText&&(this.liveRegionText=s)}toggleKeyboardMove(t){this.movingViaKeyboard?this.endKeyboardMove(t):this.startKeyboardMove(t)}startKeyboardMove(t){this.movingViaKeyboard=!0,this.positionBeforeKeyboardMove=Array.from(this.dragDropContainer.children).indexOf(t),t.classList.add("table-row--moving"),this.updateLiveRegionText("start",{position:Array.from(this.dragDropContainer.children).indexOf(t)+1,rowCount:this.dragDropContainer.children.length})}endKeyboardMove(t){this.movingViaKeyboard=!1,t.classList.remove("table-row--moving"),this.updateLiveRegionText("end",{position:Array.from(this.dragDropContainer.children).indexOf(t)+1,rowCount:this.dragDropContainer.children.length}),this.dropRow.emit({item:t,newIndex:Array.from(this.dragDropContainer.children).indexOf(t),oldIndex:this.positionBeforeKeyboardMove,itemId:t.id,newNextSiblingItemId:Array.from(this.dragDropContainer.children).indexOf(t)<this.dragDropContainer.children.length-1?this.dragDropContainer.children[Array.from(this.dragDropContainer.children).indexOf(t)+1].id:void 0,newPrevSiblingItemId:Array.from(this.dragDropContainer.children).indexOf(t)>0?this.dragDropContainer.children[Array.from(this.dragDropContainer.children).indexOf(t)-1].id:void 0}),this.positionBeforeKeyboardMove=void 0}cancelKeyboardMove(){if(!this.movingViaKeyboard)return;const t=this.el.querySelector(".table-row--moving");t&&(t.classList.remove("table-row--moving"),this.movingViaKeyboard=!1,void 0!==this.positionBeforeKeyboardMove&&this.dragDropContainer.insertBefore(t,this.dragDropContainer.children[this.positionBeforeKeyboardMove]))}moveRow(t,e){if(!this.movingViaKeyboard)return;let s;if("up"===e){const e=Array.from(this.dragDropContainer.children).indexOf(t);s=Math.max(0,e-1),this.dragDropContainer.insertBefore(t,this.dragDropContainer.children[s])}else{const e=Array.from(this.dragDropContainer.children).indexOf(t);s=Math.min(this.dragDropContainer.children.length-1,e+1),this.dragDropContainer.insertBefore(t,this.dragDropContainer.children[s+1])}this.updateLiveRegionText("moved",{position:s+1,rowCount:this.dragDropContainer.children.length}),this.focusDragHandleOfRow(t)}focusDragHandleOfRow(t){const e=c(t,this.dragDropHandle)?.[0];"BUTTON"===e.tagName?e.focus():e.querySelector("button")?.focus()}render(){const t=Boolean(this.el.querySelector('[slot="empty"]')),e=r("table",{"table--show-empty-state":this.empty&&!this.loading,"table--keyboard-move":this.movingViaKeyboard});return s(i,{key:"31cc2b99cd42ce8de24fcdca3bd25d677b2065e9"},s("div",{key:"2b10bbe4a18214e22f2ecedb07f2806d830abb55",class:e},this.enableDragDrop&&s("swirl-visually-hidden",{key:"aac0580b6da061bcf6a4e57f9e3308bcd83cd9ab"},s("span",{key:"3c2c47c530275c59c13af5ae0bf95fe865546848","aria-live":"assertive"},this.liveRegionText)),s("div",{key:"063f4ec7388d8a9b9cc986e24e98dab85deb81b7",class:"table__container",onFocusin:this.onFocus,onFocusout:this.onBlur,onKeyDown:this.onKeyDown,onScroll:this.onScroll,ref:t=>this.container=t,tabIndex:-1},s("div",{key:"44ae0cb1ac3dbedba432e5154bb890311544a361","aria-describedby":Boolean(this.caption)?"caption":void 0,"aria-label":this.label,role:"table",class:"table__table"},this.caption&&s("swirl-visually-hidden",{key:"4e98279e3a5e8dd340b05f1851559cbf35b25d95"},s("div",{key:"ec620a55154a96b65760fdfe5857d36cabc20e03",id:"caption"},this.caption)),s("div",{key:"de46c8483c070f631b529ff0e53db8b6a27ec8d8",role:"rowgroup"},s("div",{key:"18a6f22082c3fe08134f6843ac9b9722501716fa",class:"table__header",ref:t=>this.headerEl=t,role:"row"},s("slot",{key:"167710dee7162c62f40c218f6f2fb98e3f7534c0",name:"columns"}))),s("div",{key:"58cd2a6ee100461b4a9e8b5da35884f4271092a2",class:"table__body",ref:t=>this.bodyEl=t},s("slot",{key:"d258590441b67c639ba479bcbf7ae85dc840fa88",name:"rows"}),s("div",{key:"9ddfc91f1a3055363798312fb0fd1aeb2671c2db",class:"table__empty-row",role:"row"},s("div",{key:"78c4b0fa18d31277de03507b564ec42eba10c0a3","aria-colspan":this.getColumns().length,class:"table__empty-row-cell",role:"cell"},s("slot",{key:"f56688d7ff20f7ae1a3fc4f9f8241bc235b8ff5e",name:"empty"}),!t&&s("swirl-text",{key:"b7cb802b3420a554459372d8813f1b7ba6571929",align:"center",size:"sm"},this.emptyStateLabel))))))))}get el(){return o(this)}static get watchers(){return{enableDragDrop:["handleEnableDragDropChange"]}}};p.style=".sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *.sc-swirl-table{box-sizing:border-box}.table--keyboard-move.sc-swirl-table:focus-within{--swirl-table-moving-row-border:var(--s-border-width-default) solid\n      var(--s-border-highlight)}.table--show-empty-state.sc-swirl-table .table__empty-row.sc-swirl-table{display:flex}.table__container.sc-swirl-table{position:relative;overflow:auto;width:100%}.table__container--scrolled.sc-swirl-table{--swirl-table-sticky-right-shadow:4px 0 16px -4px rgba(23, 23, 23, 0.04),\n    2px 0 4px -2px rgba(23, 23, 23, 0.04)}.table__container--scrollable.sc-swirl-table:not(.table__container--scrolled-to-end){--swirl-table-sticky-left-shadow:0px 4px 16px 0px rgba(23, 23, 23, 0.04),\n    0px 1px 4px 0px rgba(23, 23, 23, 0.04)}.table__table.sc-swirl-table{width:-webkit-max-content;width:-moz-max-content;width:max-content;min-width:max(20rem, 100%)}.table__header.sc-swirl-table-s>*,.table__header .sc-swirl-table-s>*{display:flex}.table__empty-row.sc-swirl-table{display:none}.table__empty-row-cell.sc-swirl-table{display:flex;overflow:auto;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);flex-basis:0;flex-grow:1;flex-shrink:1;align-items:center;background-color:var(--s-surface-default)}.table__empty-row-cell.sc-swirl-table>*.sc-swirl-table{flex-grow:1}";export{p as swirl_table}