@esri/solutions-components 0.10.27 → 0.10.28

package/dist/esm/calcite-filter_5.entry.js

@@ -3,26 +3,26 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { r as registerInstance, c as createEvent, h, g as getElement, H as Host } from './index-b793d9aa.js';
-import { f as filter } from './filter-6ee02739.js';
-import { c as connectInteractive, u as updateHostInteraction, d as disconnectInteractive, I as InteractiveContainer } from './interactive-b2a41b8b.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-1a9b14b8.js';
-import { c as connectLocalized, d as disconnectLocalized, n as numberStringFormatter } from './locale-a53a7bc6.js';
-import { u as updateMessages, s as setUpMessages, c as connectMessages, d as disconnectMessages } from './t9n-b33c486a.js';
-import { D as DEBOUNCE } from './resources-745dec87.js';
+import { r as registerInstance, c as createEvent, h, g as getElement, H as Host } from './index-904bc599.js';
+import { f as filter } from './filter-c0066fe2.js';
+import { u as updateHostInteraction, I as InteractiveContainer } from './interactive-98ed6b6f.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-7cb2fc6f.js';
+import { c as connectLocalized, d as disconnectLocalized, n as numberStringFormatter } from './locale-24516fec.js';
+import { u as updateMessages, s as setUpMessages, c as connectMessages, d as disconnectMessages } from './t9n-9a5d28cf.js';
+import { D as DEBOUNCE } from './resources-8e2ed936.js';
 import { d as debounce } from './debounce-6e9ade8c.js';
-import { t as toAriaBoolean, s as slotChangeHasAssignedElement, F as getFirstTabbable, h as getElementDir } from './dom-42a638f6.js';
-import { c as createObserver } from './observers-6cac5525.js';
-import { M as MAX_COLUMNS, a as activeCellTestAttribute, I as ICONS$2, C as CSS$4, S as SLOTS$2 } from './resources-d6566b8a.js';
-import { i as isBrowser } from './browser-a791205e.js';
-import { d as disconnectSortableComponent, c as connectSortableComponent } from './sortableComponent-52b99f0f.js';
-import './key-d6dfb50e.js';
-import './guid-42656051.js';
+import { t as toAriaBoolean, s as slotChangeHasAssignedElement, F as getFirstTabbable, g as getElementDir } from './dom-75c641a7.js';
+import { c as createObserver } from './observers-c83631e8.js';
+import { M as MAX_COLUMNS, a as activeCellTestAttribute, I as ICONS$2, C as CSS$4, S as SLOTS$2 } from './resources-bc1429eb.js';
+import { i as isBrowser } from './browser-b67d8df6.js';
+import { d as disconnectSortableComponent, c as connectSortableComponent } from './sortableComponent-7f184466.js';
+import './key-e6b442de.js';
+import './guid-b0fb1de3.js';
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 const CSS$3 = {
     container: "container",
@@ -45,8 +45,7 @@ const Filter = class {
         //  Private Methods
         //
         // --------------------------------------------------------------------------
-        this.filterDebounced = debounce((value, emit = false, onFilter) => this.items.length &&
-            this.updateFiltered(filter(this.items, value, this.filterProps), emit, onFilter), DEBOUNCE.filter);
+        this.filterDebounced = debounce((value, emit = false, onFilter) => this.updateFiltered(filter(this.items ?? [], value, this.filterProps), emit, onFilter), DEBOUNCE.filter);
         this.inputHandler = (event) => {
             const target = event.target;
             this.value = target.value;
@@ -103,13 +102,10 @@ const Filter = class {
     //--------------------------------------------------------------------------
     async componentWillLoad() {
         setUpLoadableComponent(this);
-        if (this.items.length) {
-            this.updateFiltered(filter(this.items, this.value, this.filterProps));
-        }
+        this.updateFiltered(filter(this.items ?? [], this.value, this.filterProps));
         await setUpMessages(this);
     }
     connectedCallback() {
-        connectInteractive(this);
         connectLocalized(this);
         connectMessages(this);
     }
@@ -117,7 +113,6 @@ const Filter = class {
         updateHostInteraction(this);
     }
     disconnectedCallback() {
-        disconnectInteractive(this);
         disconnectLocalized(this);
         disconnectMessages(this);
         this.filterDebounced.cancel();
@@ -163,7 +158,7 @@ const Filter = class {
     // --------------------------------------------------------------------------
     render() {
         const { disabled, scale } = this;
-        return (h(InteractiveContainer, { key: 'da4ff667fdb02ae8b85c56cd717b416f3256145d', disabled: disabled }, h("div", { key: 'f4406a403101afa7c97da11f8408fa464aa8a08c', class: CSS$3.container }, h("label", { key: 'aace74138ebea71058044e05d4fe44cb7ee6beb2' }, h("calcite-input", { key: 'cc7dca3364cc73bf42a78d76155477af98d72552', clearable: true, disabled: disabled, icon: ICONS$1.search, label: this.messages.label, messageOverrides: { clear: this.messages.clear }, onCalciteInputInput: this.inputHandler, onKeyDown: this.keyDownHandler, placeholder: this.placeholder, ref: (el) => {
+        return (h(InteractiveContainer, { key: 'c4a624e52409ed90839b506f5d99ab623767260e', disabled: disabled }, h("div", { key: '1f2ef99156489719dd2f938bc5ce8a05185866bf', class: CSS$3.container }, h("label", { key: '6fe8c6cf73f554908be38299263d23380a4ed089' }, h("calcite-input", { key: '6765e00d208d6898221540769865d84aa1c64974', clearable: true, disabled: disabled, icon: ICONS$1.search, label: this.messages.label, messageOverrides: { clear: this.messages.clear }, onCalciteInputInput: this.inputHandler, onKeyDown: this.keyDownHandler, placeholder: this.placeholder, ref: (el) => {
                 this.textInput = el;
             }, scale: scale, type: "text", value: this.value })))));
     }
@@ -183,7 +178,7 @@ Filter.style = CalciteFilterStyle0;
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 const CSS$2 = {
     handle: "handle",
@@ -198,7 +193,7 @@ const SUBSTITUTIONS = {
     total: "{total}",
 };
 
-const handleCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex}.handle{display:flex;align-items:center;justify-content:center;align-self:stretch;border-style:none;outline-color:transparent;color:var(--calcite-color-border-input);padding-block:0.75rem;padding-inline:0.25rem;line-height:0}.handle calcite-icon{color:inherit}:host(:not([disabled])) .handle{cursor:move}:host(:not([disabled])) .handle:hover{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-1)}:host(:not([disabled])) .handle:focus{color:var(--calcite-color-text-1);outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}:host(:not([disabled])) .handle--selected{background-color:var(--calcite-color-foreground-3);color:var(--calcite-color-text-1)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";
+const handleCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex}.handle{display:flex;align-items:center;justify-content:center;align-self:stretch;border-style:none;outline-color:transparent;color:var(--calcite-handle-icon-color, var(--calcite-color-border-input));background-color:var(--calcite-handle-background-color, transparent);padding-block:0.75rem;padding-inline:0.25rem;line-height:0}.handle calcite-icon{color:inherit}:host(:not([disabled])) .handle{cursor:move}:host(:not([disabled])) .handle:hover{color:var(--calcite-handle-icon-color-hover, var(--calcite-color-text-1));background-color:var(--calcite-handle-background-color-hover, var(--calcite-color-foreground-2))}:host(:not([disabled])) .handle:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          );color:var(--calcite-handle-icon-color-hover, var(--calcite-color-text-1))}:host(:not([disabled])) .handle--selected{color:var(--calcite-handle-icon-color-selected, var(--calcite-color-text-1));background-color:var(--calcite-handle-background-color-selected, var(--calcite-color-foreground-3))}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteHandleStyle0 = handleCss;
 
 const Handle = class {
@@ -271,7 +266,6 @@ const Handle = class {
     //
     //--------------------------------------------------------------------------
     connectedCallback() {
-        connectInteractive(this);
         connectMessages(this);
         connectLocalized(this);
     }
@@ -286,7 +280,6 @@ const Handle = class {
         updateHostInteraction(this);
     }
     disconnectedCallback() {
-        disconnectInteractive(this);
         disconnectMessages(this);
         disconnectLocalized(this);
     }
@@ -340,13 +333,11 @@ const Handle = class {
     //
     // --------------------------------------------------------------------------
     render() {
-        return (
-        // Needs to be a span because of https://github.com/SortableJS/Sortable/issues/1486
-        h("span", { key: '043550c81bdf21e953f33e7b3ffc04c982ae17e3', "aria-checked": this.disabled ? null : toAriaBoolean(this.selected), "aria-disabled": this.disabled ? toAriaBoolean(this.disabled) : null, "aria-label": this.disabled ? null : this.getAriaText("label"), class: { [CSS$2.handle]: true, [CSS$2.handleSelected]: !this.disabled && this.selected }, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
+        return (h(InteractiveContainer, { key: '1a694de393421691c83e7265850275c217ef7ffe', disabled: this.disabled }, h("span", { key: '82ff692c15c2d9294ceb814b3f7f06bb4d8ff0e0', "aria-checked": this.disabled ? null : toAriaBoolean(this.selected), "aria-disabled": this.disabled ? toAriaBoolean(this.disabled) : null, "aria-label": this.disabled ? null : this.getAriaText("label"), class: { [CSS$2.handle]: true, [CSS$2.handleSelected]: !this.disabled && this.selected }, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
                 this.handleButton = el;
             },
             // role of radio is being applied to allow space key to select in screen readers
-            role: "radio", tabIndex: this.disabled ? null : 0, title: this.getTooltip() }, h("calcite-icon", { key: '1d432a3f6e17366782fe92b8347f2f301b181b7b', icon: ICONS.drag, scale: "s" })));
+            role: "radio", tabIndex: this.disabled ? null : 0, title: this.getTooltip() }, h("calcite-icon", { key: '25862a953826aea2d594507157aaffc21d07001c', icon: ICONS.drag, scale: "s" }))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -365,7 +356,7 @@ Handle.style = CalciteHandleStyle0;
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 const listSelector$1 = "calcite-list";
 const listItemGroupSelector = "calcite-list-item-group";
@@ -375,11 +366,13 @@ function getListItemChildLists(slotEl) {
 }
 function getListItemChildren(slotEl) {
     const assignedElements = slotEl.assignedElements({ flatten: true });
-    const listItemGroupChildren = assignedElements.filter((el) => el?.matches(listItemGroupSelector))
+    const listItemGroupChildren = assignedElements
+        .filter((el) => el?.matches(listItemGroupSelector))
         .map((group) => Array.from(group.querySelectorAll(listItemSelector$1)))
         .reduce((previousValue, currentValue) => [...previousValue, ...currentValue], []);
     const listItemChildren = assignedElements.filter((el) => el?.matches(listItemSelector$1));
-    const listItemListChildren = assignedElements.filter((el) => el?.matches(listSelector$1))
+    const listItemListChildren = assignedElements
+        .filter((el) => el?.matches(listSelector$1))
         .map((list) => Array.from(list.querySelectorAll(listItemSelector$1)))
         .reduce((previousValue, currentValue) => [...previousValue, ...currentValue], []);
     return [...listItemListChildren, ...listItemGroupChildren, ...listItemChildren];
@@ -404,7 +397,7 @@ function getDepth(element, includeGroup = false) {
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 const CSS$1 = {
     container: "container",
@@ -424,7 +417,7 @@ const SLOTS$1 = {
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 const CSS = {
     container: "container",
@@ -460,7 +453,7 @@ const List = class {
         this.focusableItems = [];
         this.handleSelector = "calcite-handle";
         this.listItems = [];
-        this.mutationObserver = createObserver("mutation", () => this.updateListItems());
+        this.mutationObserver = createObserver("mutation", () => this.updateListItems({ performFilter: true }));
         this.visibleItems = [];
         this.handleDefaultSlotChange = (event) => {
             updateListItemChildren(getListItemChildren(event.target));
@@ -525,8 +518,10 @@ const List = class {
                 value: item.value,
             }));
         };
-        this.updateListItems = debounce((emit = false) => {
-            const { selectionAppearance, selectionMode, dragEnabled, el } = this;
+        this.updateListItems = debounce((options) => {
+            const emitFilterChange = options?.emitFilterChange ?? false;
+            const performFilter = options?.performFilter ?? false;
+            const { selectionAppearance, selectionMode, dragEnabled, el, filterEl, filterEnabled } = this;
             const items = Array.from(this.el.querySelectorAll(listItemSelector));
             items.forEach((item) => {
                 item.selectionAppearance = selectionAppearance;
@@ -540,18 +535,19 @@ const List = class {
                 return;
             }
             this.listItems = items;
-            if (this.filterEnabled) {
+            if (filterEnabled && performFilter) {
                 this.dataForFilter = this.getItemData();
-                if (this.filterEl) {
-                    this.filterEl.items = this.dataForFilter;
+                if (filterEl) {
+                    filterEl.items = this.dataForFilter;
+                    this.filterAndUpdateData();
                 }
             }
             this.visibleItems = this.listItems.filter((item) => !item.closed && !item.hidden);
-            this.updateFilteredItems(emit);
+            this.updateFilteredItems(emitFilterChange);
             this.borderItems();
             this.focusableItems = this.filteredItems.filter((item) => !item.disabled);
             this.setActiveListItem();
-            this.updateSelectedItems(emit);
+            this.updateSelectedItems();
             this.setUpSorting();
         }, debounceTimeout);
         this.focusRow = (focusEl) => {
@@ -640,14 +636,14 @@ const List = class {
     async handleFilterTextChange() {
         this.performFilter();
     }
-    async handlefilterPropsChange() {
+    async handleFilterPropsChange() {
         this.performFilter();
     }
     onMessagesChange() {
         /* wired up by t9n util */
     }
     handleListItemChange() {
-        this.updateListItems();
+        this.updateListItems({ performFilter: true });
     }
     handleCalciteListItemToggle(event) {
         if (this.parentListEl) {
@@ -747,9 +743,8 @@ const List = class {
         connectLocalized(this);
         connectMessages(this);
         this.connectObserver();
-        this.updateListItems();
+        this.updateListItems({ performFilter: true });
         this.setUpSorting();
-        connectInteractive(this);
         this.setParentList();
     }
     async componentWillLoad() {
@@ -765,7 +760,6 @@ const List = class {
     disconnectedCallback() {
         this.disconnectObserver();
         disconnectSortableComponent(this);
-        disconnectInteractive(this);
         disconnectLocalized(this);
         disconnectMessages(this);
     }
@@ -796,7 +790,7 @@ const List = class {
     // --------------------------------------------------------------------------
     render() {
         const { loading, label, disabled, dataForFilter, filterEnabled, filterPlaceholder, filterText, filteredItems, hasFilterActionsStart, hasFilterActionsEnd, hasFilterNoResults, filterProps, } = this;
-        return (h(InteractiveContainer, { key: '84991009060a8b97b9901ca97f32b32fa6e830fa', disabled: this.disabled }, h("div", { key: '27f5a904be599be5768bb1a7693111573e745e0f', class: CSS.container }, this.dragEnabled ? (h("span", { "aria-live": "assertive", class: CSS.assistiveText }, this.assistiveText)) : null, this.renderItemAriaLive(), loading ? h("calcite-scrim", { class: CSS.scrim, loading: loading }) : null, h("table", { key: 'dd343a43f26edcb50f87a064a41471756a94afeb', "aria-busy": toAriaBoolean(loading), "aria-label": label || "", class: CSS.table, onKeyDown: this.handleListKeydown, role: "treegrid" }, filterEnabled || hasFilterActionsStart || hasFilterActionsEnd ? (h("thead", { class: CSS.sticky }, h("tr", null, h("th", { colSpan: MAX_COLUMNS }, h("calcite-stack", { class: CSS.stack }, h("slot", { name: SLOTS.filterActionsStart, onSlotchange: this.handleFilterActionsStartSlotChange, slot: SLOTS$1.actionsStart }), h("calcite-filter", { "aria-label": filterPlaceholder, disabled: disabled, filterProps: filterProps, items: dataForFilter, onCalciteFilterChange: this.handleFilterChange, placeholder: filterPlaceholder, ref: this.setFilterEl, value: filterText }), h("slot", { name: SLOTS.filterActionsEnd, onSlotchange: this.handleFilterActionsEndSlotChange, slot: SLOTS$1.actionsEnd })))))) : null, h("tbody", { key: '90a288eea3e02d5261e369e14b687852c1ff876b', class: CSS.tableContainer }, h("slot", { key: '08992c3c5ad4d5afe86e7e1cd38327c5f4281bd1', onSlotchange: this.handleDefaultSlotChange }))), h("div", { key: '689185b56a2990e00a409ddbc4e4c135115791d3', "aria-live": "polite", "data-test-id": "no-results-container", hidden: !(hasFilterNoResults && filterEnabled && filterText && !filteredItems.length) }, h("slot", { key: '929ef7f843f5c8e7290a3cbcebea8c5c4cf38707', name: SLOTS.filterNoResults, onSlotchange: this.handleFilterNoResultsSlotChange })))));
+        return (h(InteractiveContainer, { key: 'c3139afe4fe7c7462578a51a4578971c97473167', disabled: this.disabled }, h("div", { key: '5e99dc8b479c35609c5f0318723b3da84ec23ef4', class: CSS.container }, this.dragEnabled ? (h("span", { "aria-live": "assertive", class: CSS.assistiveText }, this.assistiveText)) : null, this.renderItemAriaLive(), loading ? h("calcite-scrim", { class: CSS.scrim, loading: loading }) : null, h("table", { key: 'a31ba050d3141351e491141365e8244ed3ca5303', "aria-busy": toAriaBoolean(loading), "aria-label": label || "", class: CSS.table, onKeyDown: this.handleListKeydown, role: "treegrid" }, filterEnabled || hasFilterActionsStart || hasFilterActionsEnd ? (h("thead", { class: CSS.sticky }, h("tr", null, h("th", { colSpan: MAX_COLUMNS }, h("calcite-stack", { class: CSS.stack }, h("slot", { name: SLOTS.filterActionsStart, onSlotchange: this.handleFilterActionsStartSlotChange, slot: SLOTS$1.actionsStart }), h("calcite-filter", { "aria-label": filterPlaceholder, disabled: disabled, filterProps: filterProps, items: dataForFilter, onCalciteFilterChange: this.handleFilterChange, placeholder: filterPlaceholder, ref: this.setFilterEl, value: filterText }), h("slot", { name: SLOTS.filterActionsEnd, onSlotchange: this.handleFilterActionsEndSlotChange, slot: SLOTS$1.actionsEnd })))))) : null, h("tbody", { key: '3ed1b8d9a4387c3ea0f4ff38e5388be35b32d89b', class: CSS.tableContainer }, h("slot", { key: '712562533b4609749cbff0968bd0a9e77d99758e', onSlotchange: this.handleDefaultSlotChange }))), h("div", { key: '3ff977013e0ca0d58229e1305dca702000d91a99', "aria-live": "polite", "data-test-id": "no-results-container", hidden: !(hasFilterNoResults && filterEnabled && filterText && !filteredItems.length) }, h("slot", { key: '7c2bf6389c8b5f4b6f617950e4068baf6b1dc358', name: SLOTS.filterNoResults, onSlotchange: this.handleFilterNoResultsSlotChange })))));
     }
     // --------------------------------------------------------------------------
     //
@@ -878,17 +872,20 @@ const List = class {
         if (filterEl.filteredItems) {
             this.filteredData = filterEl.filteredItems;
         }
-        this.updateListItems(emit);
+        this.updateListItems({ emitFilterChange: emit });
     }
-    async performFilter() {
+    async filterAndUpdateData() {
+        await this.filterEl?.filter(this.filterText);
+        this.updateFilteredData();
+    }
+    performFilter() {
         const { filterEl, filterText, filterProps } = this;
         if (!filterEl) {
             return;
         }
         filterEl.value = filterText;
         filterEl.filterProps = filterProps;
-        await filterEl.filter(filterText);
-        this.updateFilteredData();
+        this.filterAndUpdateData();
     }
     handleNudgeEvent(event) {
         const { handleSelector, dragSelector } = this;
@@ -932,7 +929,7 @@ const List = class {
     get el() { return getElement(this); }
     static get watchers() { return {
         "filterText": ["handleFilterTextChange"],
-        "filterProps": ["handlefilterPropsChange"],
+        "filterProps": ["handleFilterPropsChange"],
         "messageOverrides": ["onMessagesChange"],
         "filterEnabled": ["handleListItemChange"],
         "group": ["handleListItemChange"],
@@ -944,7 +941,7 @@ const List = class {
 };
 List.style = CalciteListStyle0;
 
-const listItemCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex;flex-direction:column;background-color:var(--calcite-color-foreground-1);--calcite-list-item-icon-color:var(--calcite-color-brand)}:host([filter-hidden]),:host([closed]){display:none}.wrapper--bordered{border-block-end:1px solid var(--calcite-color-border-3)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.container{box-sizing:border-box;display:flex;flex:1 1 0%;overflow:hidden;background-color:var(--calcite-color-foreground-1)}.container *{box-sizing:border-box}.container--hover:hover{cursor:pointer;background-color:var(--calcite-color-foreground-2)}.container:active{background-color:var(--calcite-color-foreground-1)}.container--border{border-inline-start-width:4px;border-inline-start-style:solid}.container--border-selected{border-inline-start-color:var(--calcite-color-brand)}.container--border-unselected{border-inline-start-color:transparent}.container:hover.container--border-unselected{border-color:var(--calcite-color-border-1)}.nested-container{display:none;flex-direction:column;border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);margin-inline-start:var(--calcite-list-item-spacing-indent, 1.5rem)}.nested-container--open{display:flex}.content-container{display:flex;flex:1 1 auto;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:stretch;padding:0px;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}tr,td{outline-color:transparent}tr{position:relative}tr:focus,td:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.content,.custom-content{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;padding-inline:0.75rem;padding-block:0.5rem;font-size:var(--calcite-font-size--2);line-height:1.375}.label,.description,.content-bottom{font-family:var(--calcite-font-family);font-size:var(--calcite-font-size--2);font-weight:var(--calcite-font-weight-normal);word-wrap:break-word;word-break:break-word}.label:only-child,.description:only-child,.content-bottom:only-child{margin:0px;padding-block:0.25rem}.label{color:var(--calcite-color-text-1)}:host([selected]) .label{font-weight:var(--calcite-font-weight-medium)}.description{margin-block-start:0.125rem;color:var(--calcite-color-text-3)}:host([selected]) .description{color:var(--calcite-color-text-2)}.content-start{justify-content:flex-start}.content-end{justify-content:flex-end}.content-start,.content-end{flex:1 1 auto}.content-start ::slotted(calcite-icon),.content-end ::slotted(calcite-icon){margin-inline:0.75rem;align-self:center}.content-bottom{display:flex;flex-direction:column}.content-container--has-center-content .content-start,.content-container--has-center-content .content-end{flex:0 1 auto}.selection-container{display:flex;padding-inline:0.75rem;padding-block:0px;color:var(--calcite-color-border-input)}.selection-container--single{color:transparent}:host(:not([disabled]):not([selected])) .container:hover .selection-container--single{color:var(--calcite-color-border-1)}:host([selected]:hover) .selection-container,:host([selected]:hover) .selection-container--single,:host([selected]) .selection-container{color:var(--calcite-list-item-icon-color)}.open-container{color:var(--calcite-color-text-3)}:host(:not([disabled])) .container:hover .open-container{color:var(--calcite-color-text-1)}.actions-start,.actions-end,.content-start,.content-end,.selection-container,.drag-container,.open-container{display:flex;align-items:center}.actions-start calcite-action,.actions-start calcite-handle,.actions-end calcite-action,.actions-end calcite-handle,.content-start calcite-action,.content-start calcite-handle,.content-end calcite-action,.content-end calcite-handle,.selection-container calcite-action,.selection-container calcite-handle,.drag-container calcite-action,.drag-container calcite-handle,.open-container calcite-action,.open-container calcite-handle{align-self:stretch}.open-container,.selection-container{cursor:pointer}.actions-start,.actions-end{position:relative;padding:0px}.actions-start ::slotted(calcite-action),.actions-start ::slotted(calcite-action-menu),.actions-start ::slotted(calcite-handle),.actions-start ::slotted(calcite-dropdown),.actions-end ::slotted(calcite-action),.actions-end ::slotted(calcite-action-menu),.actions-end ::slotted(calcite-handle),.actions-end ::slotted(calcite-dropdown){align-self:stretch;color:inherit}tr:focus .actions-start,tr:focus .actions-end{inset-block:0.125rem}tr:focus .actions-start .close,tr:focus .actions-start ::slotted(calcite-action),tr:focus .actions-start ::slotted(calcite-action-menu),tr:focus .actions-start ::slotted(calcite-handle),tr:focus .actions-start ::slotted(calcite-dropdown),tr:focus .actions-end .close,tr:focus .actions-end ::slotted(calcite-action),tr:focus .actions-end ::slotted(calcite-action-menu),tr:focus .actions-end ::slotted(calcite-handle),tr:focus .actions-end ::slotted(calcite-dropdown){block-size:calc(100% - 0.25rem)}tr:focus::after,tr:focus::before{position:absolute;content:\"\";inline-size:0.125rem;z-index:var(--calcite-z-index-header);background-color:var(--calcite-color-brand);inset-block:0}tr:focus::before{inset-inline-start:0}tr:focus::after{inset-inline-end:0}.container--border:focus::before{display:none}::slotted(calcite-list:empty){border-block-start-width:0px}:host([hidden]){display:none}[hidden]{display:none}";
+const listItemCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex;flex-direction:column;background-color:var(--calcite-color-foreground-1);--calcite-list-item-icon-color:var(--calcite-color-brand)}:host([filter-hidden]),:host([closed]){display:none}.wrapper--bordered{border-block-end:1px solid var(--calcite-color-border-3)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.container{box-sizing:border-box;display:flex;flex:1 1 0%;overflow:hidden;background-color:var(--calcite-color-foreground-1)}.container *{box-sizing:border-box}.container--hover:hover{cursor:pointer;background-color:var(--calcite-color-foreground-2)}.container:active{background-color:var(--calcite-color-foreground-1)}.container--border{border-inline-start-width:4px;border-inline-start-style:solid}.container--border-selected{border-inline-start-color:var(--calcite-color-brand)}.container--border-unselected{border-inline-start-color:transparent}.container:hover.container--border-unselected{border-color:var(--calcite-color-border-1)}.nested-container{display:none;flex-direction:column;border-width:0px;border-style:solid;border-color:var(--calcite-color-border-3);margin-inline-start:var(--calcite-list-item-spacing-indent, 1.5rem)}.nested-container--open{display:flex}.content-container{display:flex;flex:1 1 auto;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:stretch;padding:0px;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}.content-container--unavailable{opacity:var(--calcite-opacity-disabled)}tr,td{outline-color:transparent}tr{position:relative}tr:focus,td:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.content,.custom-content{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;padding-inline:0.75rem;padding-block:0.5rem;font-size:var(--calcite-font-size--2);line-height:1.375}.label,.description,.content-bottom{font-family:var(--calcite-font-family);font-size:var(--calcite-font-size--2);font-weight:var(--calcite-font-weight-normal);word-wrap:break-word;word-break:break-word}.label:only-child,.description:only-child,.content-bottom:only-child{margin:0px;padding-block:0.25rem}.label{color:var(--calcite-color-text-1)}:host([selected]) .label{font-weight:var(--calcite-font-weight-medium)}.description{margin-block-start:0.125rem;color:var(--calcite-color-text-3)}:host([selected]) .description{color:var(--calcite-color-text-2)}.content-start{justify-content:flex-start}.content-end{justify-content:flex-end}.content-start,.content-end{flex:1 1 auto}.content-start ::slotted(calcite-icon),.content-end ::slotted(calcite-icon){margin-inline:0.75rem;align-self:center}.content-bottom{display:flex;flex-direction:column}.content-container--has-center-content .content-start,.content-container--has-center-content .content-end{flex:0 1 auto}.selection-container{display:flex;padding-block:0px;color:var(--calcite-color-border-input);padding-inline:var(--calcite-spacing-md) var(--calcite-spacing-xxs)}.selection-container--single{color:transparent}:host(:not([disabled]):not([selected])) .container:hover .selection-container--single{color:var(--calcite-color-border-1)}:host([selected]:hover) .selection-container,:host([selected]:hover) .selection-container--single,:host([selected]) .selection-container{color:var(--calcite-list-item-icon-color)}.open-container{color:var(--calcite-color-text-3)}:host(:not([disabled])) .container:hover .open-container{color:var(--calcite-color-text-1)}.actions-start,.actions-end,.content-start,.content-end,.selection-container,.drag-container,.open-container{display:flex;align-items:center}.actions-start calcite-action,.actions-start calcite-handle,.actions-end calcite-action,.actions-end calcite-handle,.content-start calcite-action,.content-start calcite-handle,.content-end calcite-action,.content-end calcite-handle,.selection-container calcite-action,.selection-container calcite-handle,.drag-container calcite-action,.drag-container calcite-handle,.open-container calcite-action,.open-container calcite-handle{align-self:stretch}.open-container,.selection-container{cursor:pointer}.actions-start,.actions-end{position:relative;padding:0px}.actions-start ::slotted(calcite-action),.actions-start ::slotted(calcite-action-menu),.actions-start ::slotted(calcite-handle),.actions-start ::slotted(calcite-dropdown),.actions-end ::slotted(calcite-action),.actions-end ::slotted(calcite-action-menu),.actions-end ::slotted(calcite-handle),.actions-end ::slotted(calcite-dropdown){align-self:stretch;color:inherit}tr:focus .actions-start,tr:focus .actions-end{inset-block:0.125rem}tr:focus .actions-start .close,tr:focus .actions-start ::slotted(calcite-action),tr:focus .actions-start ::slotted(calcite-action-menu),tr:focus .actions-start ::slotted(calcite-handle),tr:focus .actions-start ::slotted(calcite-dropdown),tr:focus .actions-end .close,tr:focus .actions-end ::slotted(calcite-action),tr:focus .actions-end ::slotted(calcite-action-menu),tr:focus .actions-end ::slotted(calcite-handle),tr:focus .actions-end ::slotted(calcite-dropdown){block-size:calc(100% - 0.25rem)}tr:focus::after,tr:focus::before{position:absolute;content:\"\";inline-size:0.125rem;z-index:var(--calcite-z-index-header);background-color:var(--calcite-color-brand);inset-block:0}tr:focus::before{inset-inline-start:0}tr:focus::after{inset-inline-end:0}.container--border:focus::before{display:none}::slotted(calcite-list:empty){border-block-start-width:0px}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteListItemStyle0 = listItemCss;
 
 const focusMap = new Map();
@@ -1140,6 +1137,7 @@ const ListItem = class {
         this.setSize = null;
         this.setPosition = null;
         this.selected = false;
+        this.unavailable = false;
         this.value = undefined;
         this.selectionMode = null;
         this.selectionAppearance = null;
@@ -1190,7 +1188,6 @@ const ListItem = class {
     //
     // --------------------------------------------------------------------------
     connectedCallback() {
-        connectInteractive(this);
         connectLocalized(this);
         connectMessages(this);
         const { el } = this;
@@ -1209,7 +1206,6 @@ const ListItem = class {
         updateHostInteraction(this);
     }
     disconnectedCallback() {
-        disconnectInteractive(this);
         disconnectLocalized(this);
         disconnectMessages(this);
     }
@@ -1302,7 +1298,7 @@ const ListItem = class {
         return !hasCustomContent && (!!label || !!description) ? (h("div", { class: CSS$4.content, key: "content" }, label ? (h("div", { class: CSS$4.label, key: "label" }, label)) : null, description ? (h("div", { class: CSS$4.description, key: "description" }, description)) : null)) : null;
     }
     renderContentContainer() {
-        const { description, label, selectionMode, hasCustomContent } = this;
+        const { description, label, selectionMode, hasCustomContent, unavailable } = this;
         const hasCenterContent = hasCustomContent || !!label || !!description;
         const content = [
             this.renderContentStart(),
@@ -1312,6 +1308,7 @@ const ListItem = class {
         ];
         return (h("td", { "aria-label": label, class: {
                 [CSS$4.contentContainer]: true,
+                [CSS$4.contentContainerUnavailable]: unavailable,
                 [CSS$4.contentContainerSelectable]: selectionMode !== "none",
                 [CSS$4.contentContainerHasCenterContent]: hasCenterContent,
             }, key: "content-container", onClick: this.handleItemClick, onFocusin: this.focusCellContent, ref: (el) => (this.contentEl = el), role: "gridcell" }, content));
@@ -1321,7 +1318,7 @@ const ListItem = class {
         const showBorder = selectionMode !== "none" && selectionAppearance === "border";
         const borderSelected = showBorder && selected;
         const borderUnselected = showBorder && !selected;
-        return (h(Host, { key: 'e5c6ac9b3b611040a89e45804935c9c6e0edce2d' }, h(InteractiveContainer, { key: '352c056d23f70ef0c5596e9bc447c57dad7523c9', disabled: disabled }, h("div", { key: 'c19950786e18433c5197309442118d72806698a9', class: { [CSS$4.wrapper]: true, [CSS$4.wrapperBordered]: bordered } }, h("tr", { key: 'a77a11612d4b15afdfe0146c2808312de96756bc', "aria-expanded": openable ? toAriaBoolean(open) : null, "aria-label": label, "aria-level": level, "aria-posinset": setPosition, "aria-selected": toAriaBoolean(selected), "aria-setsize": setSize, class: {
+        return (h(Host, { key: 'a610ab740c82b6088400839884d58d4d867829db' }, h(InteractiveContainer, { key: 'f05bf10e82fab03ddfdaf3ab2e100dcbd6d69c63', disabled: disabled }, h("div", { key: '4bf63ed08d2a4a049e060d26d3699656558d495e', class: { [CSS$4.wrapper]: true, [CSS$4.wrapperBordered]: bordered } }, h("tr", { key: 'd231a113c3bd8ee7f67c2ffb0cf804c142a95fb9', "aria-expanded": openable ? toAriaBoolean(open) : null, "aria-label": label, "aria-level": level, "aria-posinset": setPosition, "aria-selected": toAriaBoolean(selected), "aria-setsize": setSize, class: {
                 [CSS$4.container]: true,
                 [CSS$4.containerHover]: true,
                 [CSS$4.containerBorder]: showBorder,
@@ -1427,7 +1424,7 @@ const Stack = class {
         return (h("div", { class: CSS$1.contentEnd, hidden: !hasContentEnd }, h("slot", { name: SLOTS$1.contentEnd, onSlotchange: this.handleContentEndSlotChange })));
     }
     render() {
-        return (h(Host, { key: '6469377ccf7311aefda5e864aac7cb5870b24ded' }, h("div", { key: 'd897fc4e108392784147cc0c8ed0a4bf5d347ca1', class: CSS$1.container }, this.renderActionsStart(), this.renderContentStart(), this.renderDefaultContent(), this.renderContentEnd(), this.renderActionsEnd())));
+        return (h(Host, { key: '97f052828720d715fd3b11a4b0e77fa085127796' }, h("div", { key: '5351cc20a8a437763894fef35ecc7a7240cb7c46', class: CSS$1.container }, this.renderActionsStart(), this.renderContentStart(), this.renderDefaultContent(), this.renderContentEnd(), this.renderActionsEnd())));
     }
 };
 Stack.style = CalciteStackStyle0;

package/dist/esm/calcite-flow_4.entry.js

@@ -3,12 +3,12 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { r as registerInstance, h, g as getElement, c as createEvent, F as Fragment } from './index-b793d9aa.js';
-import { c as createObserver } from './observers-6cac5525.js';
-import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-1a9b14b8.js';
-import { l as loadModules, g as getLocaleComponentStrings, f as formatNumber } from './locale-b1d53fb1.js';
+import { r as registerInstance, h, g as getElement, c as createEvent, F as Fragment } from './index-904bc599.js';
+import { c as createObserver } from './observers-c83631e8.js';
+import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-7cb2fc6f.js';
+import { l as loadModules, g as getLocaleComponentStrings, f as formatNumber } from './locale-0d06fca0.js';
 import { b as getAllTables, d as getMapLayerHash, a as getAllLayers, c as getFeatureLayerView } from './mapViewUtils-f54edae3.js';
-import './browser-a791205e.js';
+import './browser-b67d8df6.js';
 import './esri-loader-c6842c6b.js';
 import './_commonjsHelpers-089957fe.js';
 import './interfaces-659e3836.js';
@@ -16,7 +16,7 @@ import './interfaces-659e3836.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 const CSS = {
     frame: "frame",
@@ -145,7 +145,7 @@ const Flow = class {
             [CSS.frameAdvancing]: flowDirection === "advancing",
             [CSS.frameRetreating]: flowDirection === "retreating",
         };
-        return (h("div", { key: '93590e2eec869cef65a59c01aa2c6001b431da9a', class: frameDirectionClasses }, h("slot", { key: '5b97e4147abb053391f170f5e36bac4670934072' })));
+        return (h("div", { key: '01fbee965d48cb54fa5bd1b53a3435538df84332', class: frameDirectionClasses }, h("slot", { key: '495880eceeb04387dd1352aa00337f037ab0636c' })));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/calcite-graph_2.entry.js

@@ -3,25 +3,25 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { r as registerInstance, f as forceUpdate, h, g as getElement, c as createEvent, H as Host } from './index-b793d9aa.js';
-import { g as guid } from './guid-42656051.js';
-import { c as createObserver } from './observers-6cac5525.js';
-import { i as isPrimaryPointerButton, r as intersects } from './dom-42a638f6.js';
-import { c as connectForm, d as disconnectForm, a as afterConnectDefaultValueSet, H as HiddenFormInputSlot } from './form-46367137.js';
-import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction, I as InteractiveContainer } from './interactive-b2a41b8b.js';
-import { i as isActivationKey } from './key-d6dfb50e.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-f2ec1100.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-1a9b14b8.js';
-import { n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized, B as BigDecimal } from './locale-a53a7bc6.js';
-import { d as decimalPlaces, c as clamp } from './math-9afe1f6d.js';
-import './browser-a791205e.js';
-import './resources-745dec87.js';
-import './component-d35983a4.js';
+import { r as registerInstance, f as forceUpdate, h, g as getElement, c as createEvent, H as Host } from './index-904bc599.js';
+import { g as guid } from './guid-b0fb1de3.js';
+import { c as createObserver } from './observers-c83631e8.js';
+import { i as isPrimaryPointerButton, r as intersects } from './dom-75c641a7.js';
+import { c as connectForm, d as disconnectForm, a as afterConnectDefaultValueSet, H as HiddenFormInputSlot } from './form-d45062d8.js';
+import { u as updateHostInteraction, I as InteractiveContainer } from './interactive-98ed6b6f.js';
+import { i as isActivationKey } from './key-e6b442de.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-272c5973.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-7cb2fc6f.js';
+import { n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized, B as BigDecimal } from './locale-24516fec.js';
+import { d as decimalPlaces, c as clamp } from './math-d7c8823c.js';
+import './browser-b67d8df6.js';
+import './resources-8e2ed936.js';
+import './component-83541c88.js';
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 /**
  * Calculate slope of the tangents
@@ -232,7 +232,7 @@ Graph.style = CalciteGraphStyle0;
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.2
+ * v2.13.0
  */
 const CSS = {
     container: "container",
@@ -345,7 +345,7 @@ const Slider = class {
             }
             event.preventDefault();
             if (this.dragProp) {
-                const value = this.translate(event.clientX || event.pageX);
+                const value = this.mapToRange(event.clientX || event.pageX);
                 if (isRange(this.value) && this.dragProp === "minMaxValue") {
                     if (this.minValueDragRange && this.maxValueDragRange && this.minMaxValueRange) {
                         const newMinValue = value - this.minValueDragRange;
@@ -465,7 +465,6 @@ const Slider = class {
     //
     //--------------------------------------------------------------------------
     connectedCallback() {
-        connectInteractive(this);
         connectLocalized(this);
         this.setMinMaxFromValue();
         this.setValueFromMinMax();
@@ -473,7 +472,6 @@ const Slider = class {
         connectForm(this);
     }
     disconnectedCallback() {
-        disconnectInteractive(this);
         disconnectLabel(this);
         disconnectForm(this);
         disconnectLocalized(this);
@@ -548,11 +546,11 @@ const Slider = class {
                         left: `${mirror ? 100 - maxInterval : minInterval}%`,
                         right: `${mirror ? minInterval : 100 - maxInterval}%`,
                     };
-        return (h(Host, { key: 'c0ebc9073b3609d1d47379b5efccbe31c68915ed', id: id, onKeyDown: this.handleKeyDown, onTouchStart: this.handleTouchStart }, h(InteractiveContainer, { key: '1f6930631e4c83e5b47ae1d5c64c10dbe58ed8e7', disabled: this.disabled }, h("div", { key: '09a30ae372ca5e52fde36a0a85adc76d14ca1461', "aria-label": getLabelText(this), class: {
+        return (h(Host, { key: 'dee9376120224b51dfa12f3e87fbdce4a481a1ed', id: id, onKeyDown: this.handleKeyDown, onTouchStart: this.handleTouchStart }, h(InteractiveContainer, { key: '65bca4d477d57ced846ef97b466917b6d7fc2f21', disabled: this.disabled }, h("div", { key: '99dd57b50ded2302ca1d255708d9e4bd90de3ecb', "aria-label": getLabelText(this), class: {
                 [CSS.container]: true,
                 [CSS.containerRange]: valueIsRange,
                 [`scale--${this.scale}`]: true,
-            } }, this.renderGraph(), h("div", { key: 'e996119bc9bba42340d24b2dc8b2ad7daaf02e6e', class: CSS.track, ref: this.storeTrackRef }, h("div", { key: 'fb768d8462137621d7a891d0767e2e27864307fc', class: CSS.trackRange, onPointerDown: this.onTrackPointerDown, style: trackRangePlacementStyles }), h("div", { key: '408a0a05ef7503b1af724cfd95e3fb40f94bcbf8', class: CSS.ticks }, this.tickValues.map((tick) => {
+            } }, this.renderGraph(), h("div", { key: '47647c0d347232a0ddb384333b15860a0264aefa', class: CSS.track, ref: this.storeTrackRef }, h("div", { key: '3dc176871f6245f2dde77a016ddc747ad9571d3d', class: CSS.trackRange, onPointerDown: this.onTrackPointerDown, style: trackRangePlacementStyles }), h("div", { key: '0c08b977678d6ac7e8b9944157e51948969a5dc5', class: CSS.ticks }, this.tickValues.map((tick) => {
             const tickOffset = `${this.getUnitInterval(tick) * 100}%`;
             let activeTicks = false;
             if (fillPlacement === "start" || fillPlacement === "end") {
@@ -572,7 +570,7 @@ const Slider = class {
                     left: mirror ? "" : tickOffset,
                     right: mirror ? tickOffset : "",
                 } }, this.renderTickLabel(tick)));
-        }))), h("div", { key: 'c511ee11206dadb2b23199708abf2d2703423559', class: CSS.thumbContainer }, minThumb, thumb, h(HiddenFormInputSlot, { key: 'f6684d5f25ade745730db775a5e51298b5eb8048', component: this }))))));
+        }))), h("div", { key: '51996cb05142dbeec20093ca12b017adee23f293', class: CSS.thumbContainer }, minThumb, thumb, h(HiddenFormInputSlot, { key: '6fd5c00374205d47e226a417674264417323a5c3', component: this }))))));
     }
     renderThumb({ type, mirror, thumbPlacement, minInterval, maxInterval, }) {
         const isLabeled = type.includes("labeled");
@@ -611,7 +609,7 @@ const Slider = class {
         if (thumbPlacement === "below") {
             thumbContent.reverse();
         }
-        return (h("div", { "aria-disabled": this.disabled, "aria-label": ariaLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": ariaValuenow, class: {
+        return (h("div", { "aria-label": ariaLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": ariaValuenow, class: {
                 [CSS.thumb]: true,
                 [CSS.thumbValue]: !isMinThumb,
                 [CSS.thumbActive]: this.lastDragProp !== "minMaxValue" && this.dragProp === valueProp,
@@ -642,7 +640,7 @@ const Slider = class {
             return;
         }
         const x = event.clientX || event.pageX;
-        const position = this.translate(x);
+        const position = this.mapToRange(x);
         let prop = "value";
         if (isRange(this.value)) {
             const inRange = position >= this.minValue && position <= this.maxValue;
@@ -826,7 +824,7 @@ const Slider = class {
      * @param x
      * @internal
      */
-    translate(x) {
+    mapToRange(x) {
         const range = this.max - this.min;
         const { left, width } = this.trackEl.getBoundingClientRect();
         const percent = (x - left) / width;