@getflip/swirl-components 0.425.0 → 0.426.1

package/dist/esm/wc-datepicker.entry.js

@@ -104,7 +104,9 @@ function getWeekDays(firstDayOfWeek, locale) {
     return [
       Intl.DateTimeFormat(locale, {
         weekday: 'short'
-      }).format(date),
+      })
+        .format(date)
+        .slice(0, 3),
       Intl.DateTimeFormat(locale, {
         weekday: 'long'
       }).format(date)
@@ -170,12 +172,96 @@ const WCDatepicker = class {
         this.showTodayButton = false;
         this.showYearStepper = false;
         this.startDate = getISODateString(new Date());
+        this.maxSearchDays = 365;
+        this.goToRangeStartOnSelect = true;
         this.init = () => {
             this.currentDate = this.startDate
                 ? removeTimezoneOffset(new Date(this.startDate))
                 : new Date();
             this.updateWeekdays();
         };
+        this.getAvailableDate = (date, direction) => {
+            let potentialDate;
+            let outOfRange = false;
+            switch (direction) {
+                case 'previousDay':
+                    potentialDate = getPreviousDay(date);
+                    break;
+                case 'nextDay':
+                    potentialDate = getNextDay(date);
+                    break;
+                case 'previousSameWeekDay':
+                    potentialDate = subDays(date, 7);
+                    break;
+                case 'nextSameWeekDay':
+                    potentialDate = addDays(date, 7);
+                    break;
+                case 'firstOfMonth':
+                    potentialDate = getFirstOfMonth(date);
+                    break;
+                case 'lastOfMonth':
+                    potentialDate = getLastOfMonth(date);
+                    break;
+                case 'previousMonth':
+                    potentialDate = getPreviousMonth(date);
+                    break;
+                case 'nextMonth':
+                    potentialDate = getNextMonth(date);
+                    break;
+                case 'previousYear':
+                    potentialDate = getPreviousYear(date);
+                    break;
+                case 'nextYear':
+                    potentialDate = getNextYear(date);
+                    break;
+            }
+            while (this.disableDate(potentialDate) && !outOfRange) {
+                switch (direction) {
+                    case 'previousDay':
+                    case 'lastOfMonth':
+                        potentialDate = getPreviousDay(potentialDate);
+                        break;
+                    case 'nextDay':
+                    case 'firstOfMonth':
+                    case 'previousMonth':
+                    case 'nextMonth':
+                    case 'previousYear':
+                    case 'nextYear':
+                        potentialDate = getNextDay(potentialDate);
+                        break;
+                    case 'previousSameWeekDay':
+                        potentialDate = subDays(potentialDate, 7);
+                        break;
+                    case 'nextSameWeekDay':
+                        potentialDate = addDays(potentialDate, 7);
+                        break;
+                }
+                switch (direction) {
+                    case 'firstOfMonth':
+                    case 'lastOfMonth':
+                    case 'previousYear':
+                    case 'nextYear':
+                        outOfRange = potentialDate.getMonth() !== date.getMonth();
+                        break;
+                    case 'previousMonth':
+                        outOfRange = potentialDate.getMonth() !== date.getMonth() - 1;
+                        break;
+                    case 'nextMonth':
+                        outOfRange = potentialDate.getMonth() !== date.getMonth() + 1;
+                        break;
+                    default:
+                        outOfRange = !isDateInRange(potentialDate, {
+                            from: subDays(date, this.maxSearchDays),
+                            to: addDays(date, this.maxSearchDays)
+                        });
+                        break;
+                }
+            }
+            if (outOfRange) {
+                return date;
+            }
+            return potentialDate;
+        };
         this.nextMonth = () => {
             this.updateCurrentDate(getNextMonth(this.currentDate));
         };
@@ -209,9 +295,12 @@ const WCDatepicker = class {
         };
         this.onMonthSelect = (event) => {
             const month = +event.target.value - 1;
-            const date = new Date(this.currentDate);
-            date.setMonth(month);
-            this.updateCurrentDate(date);
+            const currentDay = this.currentDate.getDate();
+            const targetDate = new Date(this.currentDate.getFullYear(), month, 1);
+            const lastDayOfTargetMonth = getLastOfMonth(targetDate).getDate();
+            const clampedDay = Math.min(currentDay, lastDayOfTargetMonth);
+            const updatedDate = new Date(this.currentDate.getFullYear(), month, clampedDay);
+            this.updateCurrentDate(updatedDate);
         };
         this.onYearSelect = (event) => {
             let year = +event.target.value;
@@ -228,9 +317,15 @@ const WCDatepicker = class {
                 year = 9999;
                 input.value = String(year);
             }
-            const date = new Date(this.currentDate);
-            date.setFullYear(year);
-            this.updateCurrentDate(date);
+            const currentDay = this.currentDate.getDate();
+            const currentMonth = this.currentDate.getMonth();
+            const targetDate = new Date();
+            targetDate.setFullYear(year, currentMonth, 1);
+            const lastDayOfTargetMonth = getLastOfMonth(targetDate).getDate();
+            const clampedDay = Math.min(currentDay, lastDayOfTargetMonth);
+            const updatedDate = new Date();
+            updatedDate.setFullYear(year, currentMonth, clampedDay);
+            this.updateCurrentDate(updatedDate);
         };
         this.onKeyDown = (event) => {
             if (this.disabled) {
@@ -238,45 +333,45 @@ const WCDatepicker = class {
             }
             if (event.code === 'ArrowLeft') {
                 event.preventDefault();
-                this.updateCurrentDate(getPreviousDay(this.currentDate), true);
+                this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'previousDay'), true);
             }
             else if (event.code === 'ArrowRight') {
                 event.preventDefault();
-                this.updateCurrentDate(getNextDay(this.currentDate), true);
+                this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'nextDay'), true);
             }
             else if (event.code === 'ArrowUp') {
                 event.preventDefault();
-                this.updateCurrentDate(subDays(this.currentDate, 7), true);
+                this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'previousSameWeekDay'), true);
             }
             else if (event.code === 'ArrowDown') {
                 event.preventDefault();
-                this.updateCurrentDate(addDays(this.currentDate, 7), true);
+                this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'nextSameWeekDay'), true);
             }
             else if (event.code === 'PageUp') {
                 event.preventDefault();
                 if (event.shiftKey) {
-                    this.updateCurrentDate(getPreviousYear(this.currentDate), true);
+                    this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'previousYear'), true);
                 }
                 else {
-                    this.updateCurrentDate(getPreviousMonth(this.currentDate), true);
+                    this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'previousMonth'), true);
                 }
             }
             else if (event.code === 'PageDown') {
                 event.preventDefault();
                 if (event.shiftKey) {
-                    this.updateCurrentDate(getNextYear(this.currentDate), true);
+                    this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'nextYear'), true);
                 }
                 else {
-                    this.updateCurrentDate(getNextMonth(this.currentDate), true);
+                    this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'nextMonth'), true);
                 }
             }
             else if (event.code === 'Home') {
                 event.preventDefault();
-                this.updateCurrentDate(getFirstOfMonth(this.currentDate), true);
+                this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'firstOfMonth'), true);
             }
             else if (event.code === 'End') {
                 event.preventDefault();
-                this.updateCurrentDate(getLastOfMonth(this.currentDate), true);
+                this.updateCurrentDate(this.getAvailableDate(this.currentDate, 'lastOfMonth'), true);
             }
             else if (event.code === 'Space' || event.code === 'Enter') {
                 event.preventDefault();
@@ -316,13 +411,17 @@ const WCDatepicker = class {
             : new Date();
     }
     watchValue() {
-        if (Boolean(this.value)) {
-            if (Array.isArray(this.value) && this.value.length >= 1) {
-                this.currentDate = this.value[0];
-            }
-            else if (this.value instanceof Date) {
-                this.currentDate = this.value;
-            }
+        if (!Boolean(this.value)) {
+            return;
+        }
+        if (Array.isArray(this.value)) {
+            this.currentDate =
+                this.value.length > 1 && !this.goToRangeStartOnSelect
+                    ? this.value[1]
+                    : this.value[0];
+        }
+        else if (this.value instanceof Date) {
+            this.currentDate = this.value;
         }
     }
     componentDidRender() {
@@ -349,14 +448,36 @@ const WCDatepicker = class {
         return calendarRows;
     }
     getTitle() {
-        if (!Boolean(this.currentDate)) {
+        if (!Boolean(this.value)) {
             return;
         }
-        return Intl.DateTimeFormat(this.locale, {
-            day: 'numeric',
-            month: 'long',
-            year: 'numeric'
-        }).format(this.currentDate);
+        if (this.isRangeValue(this.value)) {
+            const startDate = Intl.DateTimeFormat(this.locale, {
+                day: 'numeric',
+                month: 'long',
+                year: 'numeric'
+            }).format(this.value[0]);
+            const endDate = this.value[1]
+                ? Intl.DateTimeFormat(this.locale, {
+                    day: 'numeric',
+                    month: 'long',
+                    year: 'numeric'
+                }).format(this.value[1])
+                : undefined;
+            if (Boolean(endDate)) {
+                return `${startDate} - ${endDate}`;
+            }
+            else {
+                return startDate;
+            }
+        }
+        else {
+            return Intl.DateTimeFormat(this.locale, {
+                day: 'numeric',
+                month: 'long',
+                year: 'numeric'
+            }).format(this.value);
+        }
     }
     focusDate(date) {
         var _a;
@@ -372,7 +493,11 @@ const WCDatepicker = class {
         const monthChanged = month !== this.currentDate.getMonth() ||
             year !== this.currentDate.getFullYear();
         if (monthChanged) {
-            this.changeMonth.emit({ month: getMonth(date), year: getYear(date) });
+            this.changeMonth.emit({
+                month: getMonth(date),
+                year: getYear(date),
+                day: date.getDate()
+            });
             if (moveFocus) {
                 this.moveFocusAfterMonthChanged = true;
             }
@@ -417,7 +542,7 @@ const WCDatepicker = class {
         return (h(Host, null, h("div", { "aria-disabled": String(this.disabled), "aria-label": this.labels.picker, class: {
                 [this.getClassName()]: true,
                 [`${this.getClassName()}--disabled`]: this.disabled
-            }, role: "group" }, h("div", { class: this.getClassName('header') }, h("span", { "aria-atomic": "true", "aria-live": "polite", class: "visually-hidden" }, this.getTitle()), this.showYearStepper && (h("button", { "aria-label": this.labels.previousYearButton, class: this.getClassName('previous-year-button'), disabled: this.disabled, innerHTML: this.previousYearButtonContent || undefined, onClick: this.previousYear, type: "button" }, h("svg", { fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { points: "11 17 6 12 11 7" }), h("polyline", { points: "18 17 13 12 18 7" })))), this.showMonthStepper && (h("button", { "aria-label": this.labels.previousMonthButton, class: this.getClassName('previous-month-button'), disabled: this.disabled, innerHTML: this.previousMonthButtonContent || undefined, onClick: this.previousMonth, type: "button" }, h("svg", { fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { points: "15 18 9 12 15 6" })))), h("span", { class: this.getClassName('current-month') }, h("select", { "aria-label": this.labels.monthSelect, class: this.getClassName('month-select'), disabled: this.disabled, name: "month", onChange: this.onMonthSelect }, getMonths(this.locale).map((month, index) => (h("option", { key: month, selected: this.currentDate.getMonth() === index, value: index + 1 }, month)))), h("input", { "aria-label": this.labels.yearSelect, class: this.getClassName('year-select'), disabled: this.disabled, max: 9999, maxLength: 4, min: 1, name: "year", onChange: this.onYearSelect, type: "number", value: this.currentDate.getFullYear() })), this.showMonthStepper && (h("button", { "aria-label": this.labels.nextMonthButton, class: this.getClassName('next-month-button'), disabled: this.disabled, innerHTML: this.nextMonthButtonContent || undefined, onClick: this.nextMonth, type: "button" }, h("svg", { fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { points: "9 18 15 12 9 6" })))), this.showYearStepper && (h("button", { "aria-label": this.labels.nextYearButton, class: this.getClassName('next-year-button'), disabled: this.disabled, innerHTML: this.nextYearButtonContent || undefined, onClick: this.nextYear, type: "button" }, h("svg", { fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { points: "13 17 18 12 13 7" }), h("polyline", { points: "6 17 11 12 6 7" }))))), h("div", { class: this.getClassName('body') }, h("table", { class: this.getClassName('calendar'), onKeyDown: this.onKeyDown, role: "grid" }, h("thead", { class: this.getClassName('calendar-header') }, h("tr", { class: this.getClassName('weekday-row') }, this.weekdays.map((weekday) => (h("th", { abbr: weekday[1], class: this.getClassName('weekday'), key: weekday[0], scope: "col" }, h("span", null, weekday[0])))))), h("tbody", null, this.getCalendarRows().map((calendarRow) => {
+            }, role: "group" }, h("div", { class: this.getClassName('header') }, h("span", { "aria-atomic": "true", "aria-live": "polite", class: "visually-hidden" }, this.getTitle()), this.showYearStepper && (h("button", { "aria-label": this.labels.previousYearButton, class: this.getClassName('previous-year-button'), disabled: this.disabled, innerHTML: this.previousYearButtonContent || undefined, onClick: this.previousYear, type: "button" }, h("svg", { fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { points: "11 17 6 12 11 7" }), h("polyline", { points: "18 17 13 12 18 7" })))), this.showMonthStepper && (h("button", { "aria-label": this.labels.previousMonthButton, class: this.getClassName('previous-month-button'), disabled: this.disabled, innerHTML: this.previousMonthButtonContent || undefined, onClick: this.previousMonth, type: "button" }, h("svg", { fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { points: "15 18 9 12 15 6" })))), h("span", { class: this.getClassName('current-month') }, h("select", { title: this.labels.monthSelect, "aria-label": this.labels.monthSelect, class: this.getClassName('month-select'), disabled: this.disabled, name: "month", onChange: this.onMonthSelect }, getMonths(this.locale).map((month, index) => (h("option", { key: month, selected: this.currentDate.getMonth() === index, value: index + 1 }, month)))), h("input", { title: this.labels.yearSelect, "aria-label": this.labels.yearSelect, class: this.getClassName('year-select'), disabled: this.disabled, max: 9999, maxLength: 4, min: 1, name: "year", onChange: this.onYearSelect, type: "number", value: this.currentDate.getFullYear() })), this.showMonthStepper && (h("button", { "aria-label": this.labels.nextMonthButton, class: this.getClassName('next-month-button'), disabled: this.disabled, innerHTML: this.nextMonthButtonContent || undefined, onClick: this.nextMonth, type: "button" }, h("svg", { fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { points: "9 18 15 12 9 6" })))), this.showYearStepper && (h("button", { "aria-label": this.labels.nextYearButton, class: this.getClassName('next-year-button'), disabled: this.disabled, innerHTML: this.nextYearButtonContent || undefined, onClick: this.nextYear, type: "button" }, h("svg", { fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { points: "13 17 18 12 13 7" }), h("polyline", { points: "6 17 11 12 6 7" }))))), h("div", { class: this.getClassName('body') }, h("table", { class: this.getClassName('calendar'), onKeyDown: this.onKeyDown, role: "grid" }, h("thead", { class: this.getClassName('calendar-header') }, h("tr", { class: this.getClassName('weekday-row') }, this.weekdays.map((weekday) => (h("th", { "aria-label": weekday[1], abbr: weekday[1], class: this.getClassName('weekday'), key: weekday[0], scope: "col" }, h("span", null, weekday[0])))))), h("tbody", null, this.getCalendarRows().map((calendarRow) => {
             const rowKey = `row-${calendarRow[0].getMonth()}-${calendarRow[0].getDate()}`;
             return (h("tr", { class: this.getClassName('calendar-row'), key: rowKey }, calendarRow.map((day) => {
                 var _a, _b, _c, _d, _e;
@@ -462,11 +587,12 @@ const WCDatepicker = class {
                     : isToday
                         ? 'em'
                         : 'span';
-                return (h("td", { "aria-disabled": String(isDisabled), "aria-selected": isSelected ? 'true' : undefined, class: className, "data-date": getISODateString(day), key: cellKey, onClick: this.onClick, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, role: "gridcell", tabIndex: isSameDay(day, this.currentDate) && !this.disabled
+                return (h("td", { "aria-disabled": String(isDisabled), "aria-selected": isSelected ? 'true' : undefined, "aria-current": isToday ? 'date' : isSelected ? 'true' : undefined, class: className, "data-date": getISODateString(day), key: cellKey, onClick: this.onClick, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, role: "gridcell", tabIndex: isSameDay(day, this.currentDate) && !this.disabled
                         ? 0
                         : -1 }, h(Tag, { "aria-hidden": "true" }, day.getDate()), h("span", { class: "visually-hidden" }, Intl.DateTimeFormat(this.locale, {
                     day: 'numeric',
-                    month: 'long'
+                    month: 'long',
+                    year: 'numeric'
                 }).format(day))));
             })));
         })))), showFooter && (h("div", { class: this.getClassName('footer') }, this.showTodayButton && (h("button", { class: this.getClassName('today-button'), disabled: this.disabled, innerHTML: this.todayButtonContent || undefined, onClick: this.showToday, type: "button" }, this.labels.todayButton)), this.showClearButton && (h("button", { class: this.getClassName('clear-button'), disabled: this.disabled, innerHTML: this.clearButtonContent || undefined, onClick: this.clear, type: "button" }, this.labels.clearButton)))))));

package/dist/swirl-components/{p-8c4c52c4.entry.js → p-54d0e3eb.entry.js}

@@ -1 +1 @@
-import{r as t,c as e,h as s,H as i,d as o}from"./p-Dj_4Fda9.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-wi_3Z3FQ.js";var d,b,w=a((b||(b=1,d=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 d=arguments.length,b=Array(d),w=0;w<d;w++)b[w]=arguments[w];if(c&&s.leading)return s.accumulate?Promise.resolve(t.call(this,[b])).then((function(t){return t[0]})):Promise.resolve(t.call.apply(t,[this].concat(b)));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(b),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}}),d));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:"58cb39e970718c947af8fb05e49327f69ce52406"},s("div",{key:"ccc4d4c35f16a0250bca6473848ec928a20d69f1",class:e},this.enableDragDrop&&s("swirl-visually-hidden",{key:"984ee69c68a1f7ede7c68d11e08ab87677c75d8c"},s("span",{key:"7a27389724c8c0d877c79af23589b637e44d5669","aria-live":"assertive"},this.liveRegionText)),s("div",{key:"d17f542eac55c6da592fc2ab12d838e30ef318e6",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:"dd983c262ce853828b3040c9f97c510c769662e3","aria-describedby":Boolean(this.caption)?"caption":void 0,"aria-label":this.label,role:"table",class:"table__table"},this.caption&&s("swirl-visually-hidden",{key:"031594755193d7ca2e0f8624afd79ec38ac0dec7"},s("div",{key:"7b76523681ef767eb7a5805cc45da2259d6b9ce5",id:"caption"},this.caption)),s("div",{key:"ac6f9ffa3703cbadb12b7384e8f897c5af9d0bc1",role:"rowgroup"},s("div",{key:"5263be7e317340491ee5890a1a2e5d25fcba06d5",class:"table__header",ref:t=>this.headerEl=t,role:"row"},s("slot",{key:"3171ffdd4027b3f32d2d2b110f55209c8bdc5e7e",name:"columns"}))),s("div",{key:"32c054e3e9f63439efb8f9cf9633f5b628a789e0",class:"table__body",ref:t=>this.bodyEl=t},s("slot",{key:"2f5b748c60f91dbe4df98d0f18b367f8292100d0",name:"rows"}),s("div",{key:"b51e7e34b4d4e1c4044f9480a0a115393064d221",class:"table__empty-row",role:"row"},s("div",{key:"1cb8061bef8a30965ea023b31dd0fcfac0276f26","aria-colspan":this.getColumns().length,class:"table__empty-row-cell",role:"cell"},s("slot",{key:"e512da95e312bb19dca9b36e0092a0001810eda7",name:"empty"}),!t&&s("swirl-text",{key:"ab17ca80ff8a609d5eaa4addee7d3358791bc11d",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}
+import{r as t,c as e,h as s,H as i,d as a}from"./p-Dj_4Fda9.js";import{g as o,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-wi_3Z3FQ.js";var d,b,w=o((b||(b=1,d=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,a=void 0,o=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 d=arguments.length,b=Array(d),w=0;w<d;w++)b[w]=arguments[w];if(c&&s.leading)return s.accumulate?Promise.resolve(t.call(this,[b])).then((function(t){return t[0]})):Promise.resolve(t.call.apply(t,[this].concat(b)));if(a?clearTimeout(o):a=function(){var t={};return t.promise=new Promise((function(e,s){t.resolve=e,t.reject=s})),t}(),r.push(b),o=setTimeout(l.bind(this),n),s.accumulate){var u=r.length-1;return a.promise.then((function(t){return t[u]}))}return a.promise};function l(){var e=a;clearTimeout(o),Promise.resolve(s.accumulate?t.call(this,r):t.apply(this,r[r.length-1])).then(e.resolve,e.reject),r=[],a=null}}),d));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:a}=t;this.dropRow.emit({newIndex:s,oldIndex:i,item:a,itemId:a.id??a.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 a=this.getCellsForColumn(e,t,i),o=this.calculateColumnProperties(s,t,i);a.forEach((t=>this.applyCellStyles(t,s,o))),this.applyColumnStyles(s,o)}))}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:a,isLastColumnSticky:o,hasShadowRight:r}=s;t.style.flex=Boolean(a)?`0 0 ${a}`:"",h()||(e.sticky&&!o&&(t.classList.add("table-cell--is-sticky"),t.style.left=i+"px",r&&t.classList.add("table-cell--has-shadow-right")),o&&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:a}=e;t.sticky&&!i&&(t.classList.add("table-column--is-sticky"),t.style.left=s+"px",a&&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:"58cb39e970718c947af8fb05e49327f69ce52406"},s("div",{key:"ccc4d4c35f16a0250bca6473848ec928a20d69f1",class:e},this.enableDragDrop&&s("swirl-visually-hidden",{key:"984ee69c68a1f7ede7c68d11e08ab87677c75d8c"},s("span",{key:"7a27389724c8c0d877c79af23589b637e44d5669","aria-live":"assertive"},this.liveRegionText)),s("div",{key:"d17f542eac55c6da592fc2ab12d838e30ef318e6",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:"dd983c262ce853828b3040c9f97c510c769662e3","aria-describedby":Boolean(this.caption)?"caption":void 0,"aria-label":this.label,role:"table",class:"table__table"},this.caption&&s("swirl-visually-hidden",{key:"031594755193d7ca2e0f8624afd79ec38ac0dec7"},s("div",{key:"7b76523681ef767eb7a5805cc45da2259d6b9ce5",id:"caption"},this.caption)),s("div",{key:"ac6f9ffa3703cbadb12b7384e8f897c5af9d0bc1",role:"rowgroup"},s("div",{key:"5263be7e317340491ee5890a1a2e5d25fcba06d5",class:"table__header",ref:t=>this.headerEl=t,role:"row"},s("slot",{key:"3171ffdd4027b3f32d2d2b110f55209c8bdc5e7e",name:"columns"}))),s("div",{key:"32c054e3e9f63439efb8f9cf9633f5b628a789e0",class:"table__body",ref:t=>this.bodyEl=t},s("slot",{key:"2f5b748c60f91dbe4df98d0f18b367f8292100d0",name:"rows"}),s("div",{key:"b51e7e34b4d4e1c4044f9480a0a115393064d221",class:"table__empty-row",role:"row"},s("div",{key:"1cb8061bef8a30965ea023b31dd0fcfac0276f26","aria-colspan":this.getColumns().length,class:"table__empty-row-cell",role:"cell"},s("slot",{key:"e512da95e312bb19dca9b36e0092a0001810eda7",name:"empty"}),!t&&s("swirl-text",{key:"ab17ca80ff8a609d5eaa4addee7d3358791bc11d",align:"center",size:"sm"},this.emptyStateLabel))))))))}get el(){return a(this)}static get watchers(){return{enableDragDrop:["handleEnableDragDropChange"]}}};p.style=".sc-swirl-table-h{--swirl-table-shadow-rgba:rgba(23, 23, 23, 0.2);position:relative;display:block}.sc-swirl-table-h *.sc-swirl-table{box-sizing:border-box}html.theme-dark.sc-swirl-table-h,html.theme-dark .sc-swirl-table-h{--swirl-table-shadow-rgba:rgba(0, 0, 0, 0.2)}.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 var(--swirl-table-shadow-rgba),\n    2px 0 4px -2px var(--swirl-table-shadow-rgba)}.table__container--scrollable.sc-swirl-table:not(.table__container--scrolled-to-end){--swirl-table-sticky-left-shadow:0px 4px 16px 0px\n      var(--swirl-table-shadow-rgba),\n    0px 1px 4px 0px var(--swirl-table-shadow-rgba)}.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}

package/dist/swirl-components/p-64c8be03.entry.js

@@ -0,0 +1 @@
+import{r as t,h as o,H as n,d as i}from"./p-Dj_4Fda9.js";import{c as r}from"./p-orsBiyT_.js";import{D as a}from"./p-BKpD2IO9.js";import"./p-wi_3Z3FQ.js";const s=class{constructor(o){t(this,o),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.forceIconProps(t)}))}componentDidRender(){this.updateFormAttribute()}disconnectedCallback(){this.mediaQueryUnsubscribe()}forceIconProps(t){if(!Boolean(this.iconEl))return;const o=this.iconEl.children[0];(o?.tagName.startsWith("SWIRL-ICON")||o?.tagName.startsWith("SWIRL-EMOJI")||o?.tagName.startsWith("SWIRL-SYMBOL"))&&o?.setAttribute("size",t?"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 o(n,{key:"45ecb09b0608bb62c759dfe09a4f17629a843e66",style:{pointerEvents:this.disabled?"none":""}},o(i?"a":"button",{key:"9ca424959955c2f56665b6abc64fce23b133ee5e","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)&&o("span",{key:"85c7e12f44561c7754296fac3b6c74be06b93c22",class:"button__icon",innerHTML:this.icon,ref:t=>this.iconEl=t}),!Boolean(this.icon)&&o("span",{key:"082e271c1ca38212e61f9d62aed60b016ac588f6",class:"button__icon",ref:t=>this.iconEl=t},o("slot",{key:"bf24edbe91d4590049429b27da601ba5cd51e9a5",name:"icon"})),!t&&o("span",{key:"06cd510bb5617fec59496d64b32fc19bf59ba026",class:"button__label"},this.label),e&&o("span",{key:"95f4b84ae32def5b1fbf1ba1963382343dac4279",class:"button__tag"},o("slot",{key:"9d778088353420c933a1e22089568c690909026c",name:"tag"})),b&&o("div",{key:"1f5b393f4da411b312220673611a016e96b0d218",class:"button__trailing-slot"},o("slot",{key:"635deb01ac5dbad192f64c79155a944f1c8b4716",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);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-surface-sunken-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);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-surface-sunken-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-default);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-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-strong)}.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-surface-overlay-hovered)}.button--variant-floating.sc-swirl-button:active{color:var(--s-text-on-action-primary);background-color:var(--s-surface-overlay-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\n    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--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--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(\n      --swirl-icon-button-border-bottom-right-radius\n    );border-bottom-left-radius:var(\n      --swirl-icon-button-border-bottom-left-radius\n    )}.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-a001b2e3.entry.js

@@ -0,0 +1 @@
+import{r as t,c as i,h as e,H as s,d as n}from"./p-Dj_4Fda9.js";function a(t,i){const e=new Date(t);return e.setDate(e.getDate()+i),e}function h(t){return k(new Date(`${String(y(t)).padStart(4,"0")}-${String(l(t)).padStart(2,"0")}-01`))}function o(t){if(t instanceof Date)return`${t.getFullYear()}-${String(t.getMonth()+1).padStart(2,"0")}-${String(t.getDate()).padStart(2,"0")}`}function r(t){const i=h(t);return i.setMonth(i.getMonth()+1),i.setDate(i.getDate()-1),i}function l(t){return t.getMonth()+1}function c(t){return a(t,1)}function u(t){const i=new Date(t);return i.setDate(1),i.setMonth(i.getMonth()+1),i}function d(t){const i=new Date(t);return i.setFullYear(i.getFullYear()+1),i}function v(t){return g(t,1)}function w(t){const i=new Date(t);return i.setDate(1),i.setMonth(i.getMonth()-1),i}function p(t){const i=new Date(t);return i.setFullYear(i.getFullYear()-1),i}function y(t){return t.getFullYear()}function f(t,i){return!!(t&&i&&i.from&&i.to)&&(t>=(i.from<i.to?i.from:i.to)&&t<=(i.from<i.to?i.to:i.from))}function b(t,i){return!(!t||!i)&&t.getFullYear()===i.getFullYear()&&t.getMonth()===i.getMonth()&&t.getDate()===i.getDate()}function k(t){const i=new Date(t);return i.setMinutes(i.getMinutes()+i.getTimezoneOffset()),i}function g(t,i){const e=new Date(t);return e.setDate(e.getDate()-i),e}const D={clearButton:"Clear value",monthSelect:"Select month",nextMonthButton:"Next month",nextYearButton:"Next year",picker:"Choose date",previousMonthButton:"Previous month",previousYearButton:"Previous year",todayButton:"Show today",yearSelect:"Select year"},m=class{constructor(e){t(this,e),this.selectDate=i(this,"selectDate",7),this.changeMonth=i(this,"changeMonth",7),this.disabled=!1,this.disableDate=()=>!1,this.elementClassName="wc-datepicker",this.firstDayOfWeek=0,this.labels=D,this.locale=(null===navigator||void 0===navigator?void 0:navigator.language)||"en-US",this.showClearButton=!1,this.showMonthStepper=!0,this.showTodayButton=!1,this.showYearStepper=!1,this.startDate=o(new Date),this.maxSearchDays=365,this.goToRangeStartOnSelect=!0,this.init=()=>{this.currentDate=this.startDate?k(new Date(this.startDate)):new Date,this.updateWeekdays()},this.getAvailableDate=(t,i)=>{let e,s=!1;switch(i){case"previousDay":e=v(t);break;case"nextDay":e=c(t);break;case"previousSameWeekDay":e=g(t,7);break;case"nextSameWeekDay":e=a(t,7);break;case"firstOfMonth":e=h(t);break;case"lastOfMonth":e=r(t);break;case"previousMonth":e=w(t);break;case"nextMonth":e=u(t);break;case"previousYear":e=p(t);break;case"nextYear":e=d(t)}for(;this.disableDate(e)&&!s;){switch(i){case"previousDay":case"lastOfMonth":e=v(e);break;case"nextDay":case"firstOfMonth":case"previousMonth":case"nextMonth":case"previousYear":case"nextYear":e=c(e);break;case"previousSameWeekDay":e=g(e,7);break;case"nextSameWeekDay":e=a(e,7)}switch(i){case"firstOfMonth":case"lastOfMonth":case"previousYear":case"nextYear":s=e.getMonth()!==t.getMonth();break;case"previousMonth":s=e.getMonth()!==t.getMonth()-1;break;case"nextMonth":s=e.getMonth()!==t.getMonth()+1;break;default:s=!f(e,{from:g(t,this.maxSearchDays),to:a(t,this.maxSearchDays)})}}return s?t:e},this.nextMonth=()=>{this.updateCurrentDate(u(this.currentDate))},this.nextYear=()=>{this.updateCurrentDate(d(this.currentDate))},this.previousMonth=()=>{this.updateCurrentDate(w(this.currentDate))},this.previousYear=()=>{this.updateCurrentDate(p(this.currentDate))},this.showToday=()=>{this.updateCurrentDate(new Date)},this.clear=()=>{this.value=void 0,this.selectDate.emit(void 0)},this.onClick=t=>{if(this.disabled)return;const i=t.target.closest("[data-date]");if(!Boolean(i))return;const e=k(new Date(i.dataset.date));this.updateCurrentDate(e),this.onSelectDate(e)},this.onMonthSelect=t=>{const i=+t.target.value-1,e=this.currentDate.getDate(),s=r(new Date(this.currentDate.getFullYear(),i,1)).getDate(),n=Math.min(e,s),a=new Date(this.currentDate.getFullYear(),i,n);this.updateCurrentDate(a)},this.onYearSelect=t=>{let i=+t.target.value;const e=t.target;isNaN(i)?(i=(new Date).getFullYear(),e.value=String(i)):i<0?(i=0,e.value=String(i)):i>9999&&(i=9999,e.value=String(i));const s=this.currentDate.getDate(),n=this.currentDate.getMonth(),a=new Date;a.setFullYear(i,n,1);const h=r(a).getDate(),o=Math.min(s,h),l=new Date;l.setFullYear(i,n,o),this.updateCurrentDate(l)},this.onKeyDown=t=>{this.disabled||("ArrowLeft"===t.code?(t.preventDefault(),this.updateCurrentDate(this.getAvailableDate(this.currentDate,"previousDay"),!0)):"ArrowRight"===t.code?(t.preventDefault(),this.updateCurrentDate(this.getAvailableDate(this.currentDate,"nextDay"),!0)):"ArrowUp"===t.code?(t.preventDefault(),this.updateCurrentDate(this.getAvailableDate(this.currentDate,"previousSameWeekDay"),!0)):"ArrowDown"===t.code?(t.preventDefault(),this.updateCurrentDate(this.getAvailableDate(this.currentDate,"nextSameWeekDay"),!0)):"PageUp"===t.code?(t.preventDefault(),this.updateCurrentDate(this.getAvailableDate(this.currentDate,t.shiftKey?"previousYear":"previousMonth"),!0)):"PageDown"===t.code?(t.preventDefault(),this.updateCurrentDate(this.getAvailableDate(this.currentDate,t.shiftKey?"nextYear":"nextMonth"),!0)):"Home"===t.code?(t.preventDefault(),this.updateCurrentDate(this.getAvailableDate(this.currentDate,"firstOfMonth"),!0)):"End"===t.code?(t.preventDefault(),this.updateCurrentDate(this.getAvailableDate(this.currentDate,"lastOfMonth"),!0)):"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),this.onSelectDate(this.currentDate)))},this.onMouseEnter=t=>{if(this.disabled)return;const i=k(new Date(t.target.closest("td").dataset.date));this.hoveredDate=i},this.onMouseLeave=()=>{this.hoveredDate=void 0}}componentWillLoad(){this.init()}watchFirstDayOfWeek(){this.updateWeekdays()}watchLocale(){Boolean(this.locale)||(this.locale=(null===navigator||void 0===navigator?void 0:navigator.language)||"en-US"),this.updateWeekdays()}watchRange(){this.value=void 0,this.selectDate.emit(void 0)}watchStartDate(){this.currentDate=this.startDate?k(new Date(this.startDate)):new Date}watchValue(){Boolean(this.value)&&(Array.isArray(this.value)?this.currentDate=this.value.length>1&&!this.goToRangeStartOnSelect?this.value[1]:this.value[0]:this.value instanceof Date&&(this.currentDate=this.value))}componentDidRender(){this.moveFocusAfterMonthChanged&&(this.focusDate(this.currentDate),this.moveFocusAfterMonthChanged=!1)}updateWeekdays(){var t,i;this.weekdays=(t=0===this.firstDayOfWeek?7:this.firstDayOfWeek,i=this.locale,new Array(7).fill(void 0).map(((i,e)=>(t+e)%7+1)).map((t=>{const e=k(new Date(`2006-01-0${t}`));return[Intl.DateTimeFormat(i,{weekday:"short"}).format(e).slice(0,3),Intl.DateTimeFormat(i,{weekday:"long"}).format(e)]})))}getClassName(t){return Boolean(t)?`${this.elementClassName}__${t}`:this.elementClassName}getCalendarRows(){const t=function(t,i,e){const s=[],n=h(t),a=0===n.getDay()?7:n.getDay(),o=r(t),l=0===o.getDay()?7:o.getDay(),u=1===e?7:e-1,d=[],w=[];{let t=(7-e+a)%7,i=v(n);for(;t>0;)d.push(i),i=v(i),t-=1;d.reverse();let s=(7-l+u)%7,h=c(o);for(;s>0;)w.push(h),h=c(h),s-=1}let p=n;for(;p.getMonth()===t.getMonth();)s.push(p),p=c(p);return[...d,...s,...w]}(this.currentDate,0,0===this.firstDayOfWeek?7:this.firstDayOfWeek),i=[];for(let e=0;e<t.length;e+=7){const s=t.slice(e,e+7);i.push(s)}return i}getTitle(){if(Boolean(this.value)){if(this.isRangeValue(this.value)){const t=Intl.DateTimeFormat(this.locale,{day:"numeric",month:"long",year:"numeric"}).format(this.value[0]),i=this.value[1]?Intl.DateTimeFormat(this.locale,{day:"numeric",month:"long",year:"numeric"}).format(this.value[1]):void 0;return Boolean(i)?`${t} - ${i}`:t}return Intl.DateTimeFormat(this.locale,{day:"numeric",month:"long",year:"numeric"}).format(this.value)}}focusDate(t){var i;null===(i=this.el.querySelector(`[data-date="${o(t)}"]`))||void 0===i||i.focus()}updateCurrentDate(t,i){const e=t.getMonth(),s=t.getFullYear();s>9999||s<0||((e!==this.currentDate.getMonth()||s!==this.currentDate.getFullYear())&&(this.changeMonth.emit({month:l(t),year:y(t),day:t.getDate()}),i&&(this.moveFocusAfterMonthChanged=!0)),this.currentDate=t,i&&this.focusDate(this.currentDate))}onSelectDate(t){var i,e;if(!this.disableDate(t))if(this.isRangeValue(this.value)){const e=void 0===(null===(i=this.value)||void 0===i?void 0:i[0])||2===this.value.length?[t]:[this.value[0],t];2===e.length&&e[0]>e[1]&&e.reverse();const s=void 0===e[1]?[o(e[0])]:[o(e[0]),o(e[1])];this.value=e,this.selectDate.emit(s)}else{if((null===(e=this.value)||void 0===e?void 0:e.getTime())===t.getTime())return;this.value=t,this.selectDate.emit(o(t))}}isRangeValue(t){return this.range}render(){const t=this.showTodayButton||this.showClearButton;return e(s,null,e("div",{"aria-disabled":String(this.disabled),"aria-label":this.labels.picker,class:{[this.getClassName()]:!0,[`${this.getClassName()}--disabled`]:this.disabled},role:"group"},e("div",{class:this.getClassName("header")},e("span",{"aria-atomic":"true","aria-live":"polite",class:"visually-hidden"},this.getTitle()),this.showYearStepper&&e("button",{"aria-label":this.labels.previousYearButton,class:this.getClassName("previous-year-button"),disabled:this.disabled,innerHTML:this.previousYearButtonContent||void 0,onClick:this.previousYear,type:"button"},e("svg",{fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},e("polyline",{points:"11 17 6 12 11 7"}),e("polyline",{points:"18 17 13 12 18 7"}))),this.showMonthStepper&&e("button",{"aria-label":this.labels.previousMonthButton,class:this.getClassName("previous-month-button"),disabled:this.disabled,innerHTML:this.previousMonthButtonContent||void 0,onClick:this.previousMonth,type:"button"},e("svg",{fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},e("polyline",{points:"15 18 9 12 15 6"}))),e("span",{class:this.getClassName("current-month")},e("select",{title:this.labels.monthSelect,"aria-label":this.labels.monthSelect,class:this.getClassName("month-select"),disabled:this.disabled,name:"month",onChange:this.onMonthSelect},(i=this.locale,new Array(12).fill(void 0).map(((t,e)=>{const s=k(new Date(`2006-${String(e+1).padStart(2,"0")}-01`));return Intl.DateTimeFormat(i,{month:"long"}).format(s)}))).map(((t,i)=>e("option",{key:t,selected:this.currentDate.getMonth()===i,value:i+1},t)))),e("input",{title:this.labels.yearSelect,"aria-label":this.labels.yearSelect,class:this.getClassName("year-select"),disabled:this.disabled,max:9999,maxLength:4,min:1,name:"year",onChange:this.onYearSelect,type:"number",value:this.currentDate.getFullYear()})),this.showMonthStepper&&e("button",{"aria-label":this.labels.nextMonthButton,class:this.getClassName("next-month-button"),disabled:this.disabled,innerHTML:this.nextMonthButtonContent||void 0,onClick:this.nextMonth,type:"button"},e("svg",{fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},e("polyline",{points:"9 18 15 12 9 6"}))),this.showYearStepper&&e("button",{"aria-label":this.labels.nextYearButton,class:this.getClassName("next-year-button"),disabled:this.disabled,innerHTML:this.nextYearButtonContent||void 0,onClick:this.nextYear,type:"button"},e("svg",{fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},e("polyline",{points:"13 17 18 12 13 7"}),e("polyline",{points:"6 17 11 12 6 7"})))),e("div",{class:this.getClassName("body")},e("table",{class:this.getClassName("calendar"),onKeyDown:this.onKeyDown,role:"grid"},e("thead",{class:this.getClassName("calendar-header")},e("tr",{class:this.getClassName("weekday-row")},this.weekdays.map((t=>e("th",{"aria-label":t[1],abbr:t[1],class:this.getClassName("weekday"),key:t[0],scope:"col"},e("span",null,t[0])))))),e("tbody",null,this.getCalendarRows().map((t=>{const i=`row-${t[0].getMonth()}-${t[0].getDate()}`;return e("tr",{class:this.getClassName("calendar-row"),key:i},t.map((t=>{var i,s,n,a,h;const r=b(t,this.currentDate),l=t.getMonth()!==this.currentDate.getMonth(),c=Array.isArray(this.value)?b(t,this.value[0])||b(t,this.value[1]):b(t,this.value),u=!!this.isRangeValue&&f(t,{from:null===(i=this.value)||void 0===i?void 0:i[0],to:(null===(s=this.value)||void 0===s?void 0:s[1])||this.hoveredDate||this.currentDate}),d=Boolean(null===(n=this.value)||void 0===n?void 0:n[0])?[null===(a=this.value)||void 0===a?void 0:a[0],(null===(h=this.value)||void 0===h?void 0:h[1])||this.hoveredDate].sort(((t,i)=>t-i)):[],v=this.range&&b(d[0],t),w=this.range&&b(d[1],t),p=b(t,new Date),y=this.disableDate(t),k=`cell-${t.getMonth()}-${t.getDate()}`,g={[this.getClassName("date")]:!0,[this.getClassName("date--current")]:r,[this.getClassName("date--disabled")]:y,[this.getClassName("date--overflowing")]:l,[this.getClassName("date--today")]:p,[this.getClassName("date--selected")]:c,[this.getClassName("date--in-range")]:u,[this.getClassName("date--start")]:v,[this.getClassName("date--end")]:w},D=c?"strong":p?"em":"span";return e("td",{"aria-disabled":String(y),"aria-selected":c?"true":void 0,"aria-current":p?"date":c?"true":void 0,class:g,"data-date":o(t),key:k,onClick:this.onClick,onMouseEnter:this.onMouseEnter,onMouseLeave:this.onMouseLeave,role:"gridcell",tabIndex:b(t,this.currentDate)&&!this.disabled?0:-1},e(D,{"aria-hidden":"true"},t.getDate()),e("span",{class:"visually-hidden"},Intl.DateTimeFormat(this.locale,{day:"numeric",month:"long",year:"numeric"}).format(t)))})))}))))),t&&e("div",{class:this.getClassName("footer")},this.showTodayButton&&e("button",{class:this.getClassName("today-button"),disabled:this.disabled,innerHTML:this.todayButtonContent||void 0,onClick:this.showToday,type:"button"},this.labels.todayButton),this.showClearButton&&e("button",{class:this.getClassName("clear-button"),disabled:this.disabled,innerHTML:this.clearButtonContent||void 0,onClick:this.clear,type:"button"},this.labels.clearButton))));var i}get el(){return n(this)}static get watchers(){return{firstDayOfWeek:["watchFirstDayOfWeek"],locale:["watchLocale"],range:["watchRange"],startDate:["watchStartDate"],value:["watchValue"]}}};m.style=".visually-hidden.sc-wc-datepicker{position:absolute;overflow:hidden;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(50%)}";export{m as wc_datepicker}