@esri/calcite-components 3.0.0-next.98 → 3.0.0

package/dist/components/calcite-list-item/customElement.js

@@ -1,39 +1,37 @@
-import { c as M } from "../../chunks/runtime.js";
+import { c as z } from "../../chunks/runtime.js";
 import { keyed as r } from "lit-html/directives/keyed.js";
-import { html as s, nothing as D } from "lit";
-import { createRef as C, ref as v } from "lit-html/directives/ref.js";
-import { LitElement as T, createEvent as d, safeClassMap as i } from "@arcgis/lumina";
-import { a as b, x as w, g as P } from "../../chunks/dom.js";
-import { u as F, I as U } from "../../chunks/interactive.js";
-import { c as G, s as R, a as K } from "../../chunks/loadable.js";
-import { u as j } from "../../chunks/useT9n.js";
+import { html as o, nothing as M } from "lit";
+import { createRef as b, ref as v } from "lit-html/directives/ref.js";
+import { LitElement as D, createEvent as d, safeClassMap as i } from "@arcgis/lumina";
+import { a as C, x as T, g as P } from "../../chunks/dom.js";
+import { u as U, I as F } from "../../chunks/interactive.js";
+import { c as R } from "../../chunks/loadable.js";
+import { u as G } from "../../chunks/useT9n.js";
 import { g as $ } from "../../chunks/component.js";
-import { l as N, g as W, a as q } from "../../chunks/utils.js";
-import { a as L, C as a, I as g, S } from "../../chunks/resources5.js";
-import { css as J } from "@lit/reactive-element/css-tag.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.
- * v3.0.0-next.98
-*/
-const Q = J`:host([disabled]){cursor:default;-webkit-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}:host([filter-hidden]),:host([closed]){display:none}.wrapper--bordered{border-block-end:1px solid var(--calcite-list-border-color, 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-list-background-color, var(--calcite-color-foreground-1))}.container *{box-sizing:border-box}.container--hover:hover{cursor:pointer;background-color:var(--calcite-list-background-color-hover, var(--calcite-color-foreground-2))}.container:active{background-color:var(--calcite-list-background-color-press, var(--calcite-color-foreground-1))}.container--border-selected{box-shadow:inset 4px 0 0 0 var(--calcite-list-selection-border-color, var(--calcite-color-brand))}.container--border-unselected{box-shadow:inset 4px 0 0 0 transparent}.container:hover.container--border-unselected{box-shadow:inset 4px 0 0 0 var(--calcite-list-selection-border-color, var(--calcite-color-border-1))}.nested-container{display:none;flex-direction:column;border-width:0px;border-style:solid;border-color:1px solid var(--calcite-list-border-color, var(--calcite-color-border-3));margin-inline-start:var(--calcite-list-spacing-indent, 1.5rem)}.nested-container--open{display:flex}.selection-container{display:flex;padding-block:0px;color:var(--calcite-list-icon-color, var(--calcite-color-border-input))}:host(:not([disabled]):not([selected])) .container:hover .selection-container--single{color:var(--calcite-list-icon-color, var(--calcite-color-border-input))}:host([selected]:hover) .selection-container,:host([selected]:hover) .selection-container--single,:host([selected]) .selection-container{color:var(--calcite-list-icon-color, var(--calcite-color-brand))}.content-container-wrapper{display:flex;flex:1 1 auto}.content-container-wrapper--bordered{border-block-end:1px solid var(--calcite-list-border-color, var(--calcite-color-border-3))}.content-container{display:flex;flex:1 1 auto;-webkit-user-select:none;user-select:none;align-items:stretch;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-list-content-text-color, var(--calcite-color-text-2))}.content-container--unavailable{opacity:var(--calcite-opacity-disabled)}.row,.grid-cell{outline-color:transparent}.row{position:relative}.row:focus,.grid-cell:focus{outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}.content,.custom-content{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;line-height:var(--calcite-font-line-height-relative-snug)}.label{color:var(--calcite-list-label-text-color, var(--calcite-color-text-1))}.description{color:var(--calcite-list-description-text-color, var(--calcite-color-text-3))}.icon{align-self:center;color:var(--calcite-list-icon-color, var(--calcite-color-text-3))}:host([display-mode=flat][drag-handle]:is([selection-mode=none],[selection-appearance=border])) .drag-container{padding-inline-end:var(--calcite-spacing-xxs)}:host([scale=s]) .actions-start{padding-inline-end:var(--calcite-spacing-sm)}:host([scale=s]) .content-container{gap:var(--calcite-spacing-sm);min-block-size:32px;padding-block:var(--calcite-spacing-xxs);padding-inline-end:var(--calcite-spacing-sm)}:host([scale=s]) .content,:host([scale=s]) .custom-content,:host([scale=s]) .label{font-size:var(--calcite-font-size--2)}:host([scale=s]) .description{font-size:var(--calcite-font-size--3)}:host([scale=s][display-mode=flat]:not([drag-handle])) .container{padding-inline-start:var(--calcite-spacing-sm)}:host([scale=s][display-mode=flat]:not([drag-handle])) .selection-container{padding-inline-end:var(--calcite-spacing-sm)}:host([scale=s][display-mode=flat][drag-handle]) .selection-container{padding-inline:var(--calcite-spacing-xxs) var(--calcite-spacing-sm)}:host([scale=s][display-mode=nested]) .selection-container{padding-inline-end:var(--calcite-spacing-xxs)}:host([scale=s][display-mode=nested][selection-appearance=icon]:not([selection-mode=none]):not([drag-handle])) .container{padding-inline-start:var(--calcite-spacing-sm)}:host([scale=s][display-mode=nested][selection-appearance=icon]:not([selection-mode=none]):not([drag-handle])) .selection-container{padding-inline-end:var(--calcite-spacing-xxs)}:host([scale=s][display-mode=nested][drag-handle]) .selection-container{padding-inline:var(--calcite-spacing-xxs)}:host([scale=m]) .actions-start{padding-inline-end:var(--calcite-spacing-sm)}:host([scale=m]) .content-container{gap:var(--calcite-spacing-sm);min-block-size:40px;padding-block:var(--calcite-spacing-sm);padding-inline-end:var(--calcite-spacing-md)}:host([scale=m]) .content,:host([scale=m]) .custom-content{font-size:var(--calcite-font-size--2)}:host([scale=m]) .label{font-size:var(--calcite-font-size--1)}:host([scale=m]) .description{font-size:var(--calcite-font-size--2)}:host([scale=m][display-mode=flat]) .container{padding-inline-start:var(--calcite-spacing-md)}:host([scale=m][display-mode=flat]) .selection-container{padding-inline-end:var(--calcite-spacing-sm)}:host([scale=m][display-mode=flat][drag-handle]) .container{padding-inline-start:0}:host([scale=m][display-mode=flat][drag-handle]) .selection-container{padding-inline:var(--calcite-spacing-xxs) var(--calcite-spacing-sm)}:host([scale=m][display-mode=nested]) .container{padding-inline-start:var(--calcite-spacing-xxs)}:host([scale=m][display-mode=nested]) .selection-container{padding-inline-end:var(--calcite-spacing-xxs)}:host([scale=m][display-mode=nested][selection-appearance=icon]:not([selection-mode=none]):not([drag-handle])) .container{padding-inline-start:var(--calcite-spacing-md)}:host([scale=m][display-mode=nested][drag-handle]) .container{padding-inline-start:0}:host([scale=m][display-mode=nested][drag-handle]) .selection-container{padding-inline:var(--calcite-spacing-xxs)}:host([scale=l]) .actions-start{padding-inline-end:var(--calcite-spacing-md)}:host([scale=l]) .content-container{gap:var(--calcite-spacing-md);min-block-size:56px;padding-block:.625rem;padding-inline-end:var(--calcite-spacing-lg)}:host([scale=l]) .content,:host([scale=l]) .custom-content,:host([scale=l]) .label{font-size:var(--calcite-font-size-0)}:host([scale=l]) .description{font-size:var(--calcite-font-size--1)}:host([scale=l]) .nested-container{margin-inline-start:1.75rem}:host([scale=l][display-mode=flat]) .container{padding-inline-start:var(--calcite-spacing-lg)}:host([scale=l][display-mode=flat]) .selection-container{padding-inline-end:var(--calcite-spacing-md)}:host([scale=l][display-mode=flat][drag-handle]) .container{padding-inline-start:0}:host([scale=l][display-mode=flat][drag-handle]) .selection-container{padding-inline-end:var(--calcite-spacing-md)}:host([scale=l][display-mode=nested]) .container{padding-inline-start:var(--calcite-spacing-xxs)}:host([scale=l][display-mode=nested][drag-handle]) .container{padding-inline-start:0}:host([scale=l][display-mode=nested][selection-appearance=icon]:not([selection-mode=none]):not([drag-handle])) .container{padding-inline-start:var(--calcite-spacing-lg)}.label,.description,.content-bottom{font-family:var(--calcite-font-family);font-weight:var(--calcite-font-weight-normal);word-wrap:break-word;word-break:break-word}:host([selected]) .label{font-weight:var(--calcite-font-weight-medium)}:host([selected]) .icon{color:var(--calcite-list-icon-color, var(--calcite-color-text-1))}:host([selected]) .description{color:var(--calcite-list-description-text-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){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}.open-container{color:var(--calcite-list-icon-color, var(--calcite-color-text-3));padding-inline:var(--calcite-spacing-xxs)}:host(:not([disabled])) .container:hover .open-container{color:var(--calcite-list-icon-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-sort-handle,.actions-end calcite-action,.actions-end calcite-sort-handle,.content-start calcite-action,.content-start calcite-sort-handle,.content-end calcite-action,.content-end calcite-sort-handle,.selection-container calcite-action,.selection-container calcite-sort-handle,.drag-container calcite-action,.drag-container calcite-sort-handle,.open-container calcite-action,.open-container calcite-sort-handle{align-self:stretch}.open-container,.selection-container{cursor:pointer}.actions-start,.actions-end{position:relative;padding:0}.actions-start ::slotted(calcite-action),.actions-start ::slotted(calcite-action-menu),.actions-start ::slotted(calcite-sort-handle),.actions-start ::slotted(calcite-dropdown),.actions-end ::slotted(calcite-action),.actions-end ::slotted(calcite-action-menu),.actions-end ::slotted(calcite-sort-handle),.actions-end ::slotted(calcite-dropdown){align-self:stretch;color:inherit}.row:focus .actions-start,.row:focus .actions-end{inset-block:.125rem}.row:focus .actions-start .close,.row:focus .actions-start ::slotted(calcite-action),.row:focus .actions-start ::slotted(calcite-action-menu),.row:focus .actions-start ::slotted(calcite-sort-handle),.row:focus .actions-start ::slotted(calcite-dropdown),.row:focus .actions-end .close,.row:focus .actions-end ::slotted(calcite-action),.row:focus .actions-end ::slotted(calcite-action-menu),.row:focus .actions-end ::slotted(calcite-sort-handle),.row:focus .actions-end ::slotted(calcite-dropdown){block-size:calc(100% - .25rem)}.row:focus:after,.row:focus:before{position:absolute;content:"";inline-size:.125rem;z-index:var(--calcite-z-index-header);background-color:var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));inset-block:0}.row:focus:before{inset-inline-start:0}.row: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}`, I = /* @__PURE__ */ new Map();
-class V extends T {
+import { l as K, g as j, a as N } from "../../chunks/utils.js";
+import { a as w, I as u, C as a, S } from "../../chunks/resources5.js";
+import { css as W } from "@lit/reactive-element/css-tag.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.
+v3.0.0 */
+const q = W`:host([disabled]){cursor:default;-webkit-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}:host([filter-hidden]),:host([closed]){display:none}.wrapper--bordered{border-block-end:1px solid var(--calcite-list-border-color, 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-list-background-color, var(--calcite-color-foreground-1))}.container *{box-sizing:border-box}.container--hover:hover{cursor:pointer;background-color:var(--calcite-list-background-color-hover, var(--calcite-color-foreground-2))}.container:active{background-color:var(--calcite-list-background-color-press, var(--calcite-color-foreground-1))}.container--border{position:relative}.container--border:before{position:absolute;inline-size:var(--calcite-border-width-lg);inset-block:0;inset-inline-start:0;background-color:transparent;content:""}.container--border-selected:before{background-color:var(--calcite-list-selection-border-color, var(--calcite-color-brand))}.container:hover.container--border-unselected:before{background-color:var(--calcite-list-selection-border-color, var(--calcite-color-border-1))}.nested-container{display:none;flex-direction:column;border-width:0px;border-style:solid;border-color:1px solid var(--calcite-list-border-color, var(--calcite-color-border-3));margin-inline-start:var(--calcite-list-spacing-indent, 1.5rem)}.nested-container--open{display:flex}.selection-container{display:flex;padding-block:0px;color:var(--calcite-list-icon-color, var(--calcite-color-border-input))}:host(:not([disabled]):not([selected])) .container:hover .selection-container--single{color:var(--calcite-list-icon-color, var(--calcite-color-border-input))}:host([selected]:hover) .selection-container,:host([selected]:hover) .selection-container--single,:host([selected]) .selection-container{color:var(--calcite-list-icon-color, var(--calcite-color-brand))}.content-container-wrapper{display:flex;flex:1 1 auto}.content-container-wrapper--bordered{border-block-end:1px solid var(--calcite-list-border-color, var(--calcite-color-border-3))}.content-container{display:flex;flex:1 1 auto;-webkit-user-select:none;user-select:none;align-items:stretch;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-list-content-text-color, var(--calcite-color-text-2))}.content-container--unavailable{opacity:var(--calcite-opacity-disabled)}.row,.grid-cell{outline-color:transparent}.row{position:relative}.row:focus,.grid-cell:focus{outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}.content,.custom-content{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;line-height:var(--calcite-font-line-height-relative-snug)}.label{color:var(--calcite-list-label-text-color, var(--calcite-color-text-1))}.description{color:var(--calcite-list-description-text-color, var(--calcite-color-text-3))}.icon{align-self:center;color:var(--calcite-list-icon-color, var(--calcite-color-text-3))}:host([display-mode=flat][drag-handle]:is([selection-mode=none],[selection-appearance=border])) .drag-container{padding-inline-end:var(--calcite-spacing-xxs)}:host([scale=s]) .actions-start{padding-inline-end:var(--calcite-spacing-sm)}:host([scale=s]) .content-container{gap:var(--calcite-spacing-sm);min-block-size:32px;padding-block:var(--calcite-spacing-xxs);padding-inline-end:var(--calcite-spacing-sm)}:host([scale=s]) .content,:host([scale=s]) .custom-content,:host([scale=s]) .label{font-size:var(--calcite-font-size--2)}:host([scale=s]) .description{font-size:var(--calcite-font-size--3)}:host([scale=s][display-mode=flat]:not([drag-handle])) .container{padding-inline-start:var(--calcite-spacing-sm)}:host([scale=s][display-mode=flat]:not([drag-handle])) .selection-container{padding-inline-end:var(--calcite-spacing-sm)}:host([scale=s][display-mode=flat][drag-handle]) .selection-container{padding-inline:var(--calcite-spacing-xxs) var(--calcite-spacing-sm)}:host([scale=s][display-mode=nested]) .selection-container{padding-inline-end:var(--calcite-spacing-xxs)}:host([scale=s][display-mode=nested][selection-appearance=icon]:not([selection-mode=none]):not([drag-handle])) .container{padding-inline-start:var(--calcite-spacing-sm)}:host([scale=s][display-mode=nested][selection-appearance=icon]:not([selection-mode=none]):not([drag-handle])) .selection-container{padding-inline-end:var(--calcite-spacing-xxs)}:host([scale=s][display-mode=nested][drag-handle]) .selection-container{padding-inline:var(--calcite-spacing-xxs)}:host([scale=m]) .actions-start{padding-inline-end:var(--calcite-spacing-sm)}:host([scale=m]) .content-container{gap:var(--calcite-spacing-sm);min-block-size:40px;padding-block:var(--calcite-spacing-sm);padding-inline-end:var(--calcite-spacing-md)}:host([scale=m]) .content,:host([scale=m]) .custom-content{font-size:var(--calcite-font-size--2)}:host([scale=m]) .label{font-size:var(--calcite-font-size--1)}:host([scale=m]) .description{font-size:var(--calcite-font-size--2)}:host([scale=m][display-mode=flat]) .container{padding-inline-start:var(--calcite-spacing-md)}:host([scale=m][display-mode=flat]) .selection-container{padding-inline-end:var(--calcite-spacing-sm)}:host([scale=m][display-mode=flat][drag-handle]) .container{padding-inline-start:0}:host([scale=m][display-mode=flat][drag-handle]) .selection-container{padding-inline:var(--calcite-spacing-xxs) var(--calcite-spacing-sm)}:host([scale=m][display-mode=nested]) .container{padding-inline-start:var(--calcite-spacing-xxs)}:host([scale=m][display-mode=nested]) .selection-container{padding-inline-end:var(--calcite-spacing-xxs)}:host([scale=m][display-mode=nested][selection-appearance=icon]:not([selection-mode=none]):not([drag-handle])) .container{padding-inline-start:var(--calcite-spacing-md)}:host([scale=m][display-mode=nested][drag-handle]) .container{padding-inline-start:0}:host([scale=m][display-mode=nested][drag-handle]) .selection-container{padding-inline:var(--calcite-spacing-xxs)}:host([scale=l]) .actions-start{padding-inline-end:var(--calcite-spacing-md)}:host([scale=l]) .content-container{gap:var(--calcite-spacing-md);min-block-size:56px;padding-block:.625rem;padding-inline-end:var(--calcite-spacing-lg)}:host([scale=l]) .content,:host([scale=l]) .custom-content,:host([scale=l]) .label{font-size:var(--calcite-font-size-0)}:host([scale=l]) .description{font-size:var(--calcite-font-size--1)}:host([scale=l]) .nested-container{margin-inline-start:1.75rem}:host([scale=l][display-mode=flat]) .container{padding-inline-start:var(--calcite-spacing-lg)}:host([scale=l][display-mode=flat]) .selection-container{padding-inline-end:var(--calcite-spacing-md)}:host([scale=l][display-mode=flat][drag-handle]) .container{padding-inline-start:0}:host([scale=l][display-mode=flat][drag-handle]) .selection-container{padding-inline-end:var(--calcite-spacing-md)}:host([scale=l][display-mode=nested]) .container{padding-inline-start:var(--calcite-spacing-xxs)}:host([scale=l][display-mode=nested][drag-handle]) .container{padding-inline-start:0}:host([scale=l][display-mode=nested][selection-appearance=icon]:not([selection-mode=none]):not([drag-handle])) .container{padding-inline-start:var(--calcite-spacing-lg)}.label,.description,.content-bottom{font-family:var(--calcite-font-family);font-weight:var(--calcite-font-weight-normal);word-wrap:break-word;word-break:break-word}:host([selected]) .label{font-weight:var(--calcite-font-weight-medium)}:host([selected]) .icon{color:var(--calcite-list-icon-color, var(--calcite-color-text-1))}:host([selected]) .description{color:var(--calcite-list-description-text-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){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}.open-container{color:var(--calcite-list-icon-color, var(--calcite-color-text-3));padding-inline:var(--calcite-spacing-xxs)}:host(:not([disabled])) .container:hover .open-container{color:var(--calcite-list-icon-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-sort-handle,.actions-end calcite-action,.actions-end calcite-sort-handle,.content-start calcite-action,.content-start calcite-sort-handle,.content-end calcite-action,.content-end calcite-sort-handle,.selection-container calcite-action,.selection-container calcite-sort-handle,.drag-container calcite-action,.drag-container calcite-sort-handle,.open-container calcite-action,.open-container calcite-sort-handle{align-self:stretch}.open-container,.selection-container{cursor:pointer}.actions-start,.actions-end{position:relative;padding:0}.actions-start ::slotted(calcite-action),.actions-start ::slotted(calcite-action-menu),.actions-start ::slotted(calcite-sort-handle),.actions-start ::slotted(calcite-dropdown),.actions-end ::slotted(calcite-action),.actions-end ::slotted(calcite-action-menu),.actions-end ::slotted(calcite-sort-handle),.actions-end ::slotted(calcite-dropdown){align-self:stretch;color:inherit}.row:focus .actions-start,.row:focus .actions-end{inset-block:.125rem}.row:focus .actions-start .close,.row:focus .actions-start ::slotted(calcite-action),.row:focus .actions-start ::slotted(calcite-action-menu),.row:focus .actions-start ::slotted(calcite-sort-handle),.row:focus .actions-start ::slotted(calcite-dropdown),.row:focus .actions-end .close,.row:focus .actions-end ::slotted(calcite-action),.row:focus .actions-end ::slotted(calcite-action-menu),.row:focus .actions-end ::slotted(calcite-sort-handle),.row:focus .actions-end ::slotted(calcite-dropdown){block-size:calc(100% - .25rem)}.row:focus:after,.row:focus:before{position:absolute;content:"";inline-size:.125rem;z-index:var(--calcite-z-index-header);background-color:var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));inset-block:0}.row:focus:before{inset-inline-start:0}.row: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}`, I = /* @__PURE__ */ new Map();
+class J extends D {
   // #endregion
   // #region Lifecycle
   constructor() {
-    super(), this.actionsEndEl = C(), this.actionsStartEl = C(), this.containerEl = C(), this.contentEl = C(), this.defaultSlotEl = C(), this.handleGridEl = C(), this.hasActionsEnd = !1, this.hasActionsStart = !1, this.hasContentBottom = !1, this.hasContentEnd = !1, this.hasContentStart = !1, this.hasCustomContent = !1, this.level = null, this.openable = !1, this.active = !1, this.bordered = !1, this.closable = !1, this.closed = !1, this.disabled = !1, this.dragDisabled = !1, this.dragHandle = !1, this.filterHidden = !1, this.interactionMode = null, this.messages = j(), this.displayMode = "flat", this.moveToItems = [], this.open = !1, this.scale = "m", this.selected = !1, this.selectionAppearance = null, this.selectionMode = null, this.setPosition = null, this.setSize = null, this.sortHandleOpen = !1, this.unavailable = !1, this.calciteInternalFocusPreviousItem = d({ cancelable: !1 }), this.calciteInternalListItemActive = d({ cancelable: !1 }), this.calciteInternalListItemChange = d({ cancelable: !1 }), this.calciteInternalListItemSelect = d({ cancelable: !1 }), this.calciteInternalListItemSelectMultiple = d({ cancelable: !1 }), this.calciteInternalListItemToggle = d({ cancelable: !1 }), this.calciteListItemClose = d({ cancelable: !1 }), this.calciteListItemSelect = d({ cancelable: !1 }), this.calciteListItemSortHandleBeforeClose = d({ cancelable: !1 }), this.calciteListItemSortHandleBeforeOpen = d({ cancelable: !1 }), this.calciteListItemSortHandleClose = d({ cancelable: !1 }), this.calciteListItemSortHandleOpen = d({ cancelable: !1 }), this.calciteListItemToggle = d({ cancelable: !1 }), this.listen("calciteInternalListItemGroupDefaultSlotChange", this.handleCalciteInternalListDefaultSlotChanges), this.listen("calciteInternalListDefaultSlotChange", this.handleCalciteInternalListDefaultSlotChanges);
+    super(), this.actionsEndEl = b(), this.actionsStartEl = b(), this.containerEl = b(), this.contentEl = b(), this.defaultSlotEl = b(), this.handleGridEl = b(), this.hasActionsEnd = !1, this.hasActionsStart = !1, this.hasContentBottom = !1, this.hasContentEnd = !1, this.hasContentStart = !1, this.hasCustomContent = !1, this.level = null, this.openable = !1, this.active = !1, this.bordered = !1, this.closable = !1, this.closed = !1, this.disabled = !1, this.dragDisabled = !1, this.dragHandle = !1, this.filterHidden = !1, this.interactionMode = null, this.messages = G(), this.displayMode = "flat", this.moveToItems = [], this.open = !1, this.scale = "m", this.selected = !1, this.selectionAppearance = null, this.selectionMode = null, this.setPosition = null, this.setSize = null, this.sortHandleOpen = !1, this.unavailable = !1, this.calciteInternalFocusPreviousItem = d({ cancelable: !1 }), this.calciteInternalListItemActive = d({ cancelable: !1 }), this.calciteInternalListItemChange = d({ cancelable: !1 }), this.calciteInternalListItemSelect = d({ cancelable: !1 }), this.calciteInternalListItemSelectMultiple = d({ cancelable: !1 }), this.calciteInternalListItemToggle = d({ cancelable: !1 }), this.calciteListItemClose = d({ cancelable: !1 }), this.calciteListItemSelect = d({ cancelable: !1 }), this.calciteListItemSortHandleBeforeClose = d({ cancelable: !1 }), this.calciteListItemSortHandleBeforeOpen = d({ cancelable: !1 }), this.calciteListItemSortHandleClose = d({ cancelable: !1 }), this.calciteListItemSortHandleOpen = d({ cancelable: !1 }), this.calciteListItemToggle = d({ cancelable: !1 }), this.listen("calciteInternalListItemGroupDefaultSlotChange", this.handleCalciteInternalListDefaultSlotChanges), this.listen("calciteInternalListDefaultSlotChange", this.handleCalciteInternalListDefaultSlotChanges);
   }
   static {
-    this.properties = { hasActionsEnd: 16, hasActionsStart: 16, hasContentBottom: 16, hasContentEnd: 16, hasContentStart: 16, hasCustomContent: 16, level: 16, openable: 16, parentListEl: 16, active: 5, bordered: 5, closable: 7, closed: 7, description: 1, disabled: 7, dragDisabled: 7, dragHandle: 7, filterHidden: 7, interactionMode: 1, label: 1, messageOverrides: 0, metadata: 0, displayMode: 3, moveToItems: 0, open: 7, scale: 3, selected: 7, selectionAppearance: 3, selectionMode: 3, setPosition: 9, setSize: 9, sortHandleOpen: 5, unavailable: 7, value: 1, iconStart: 3, iconEnd: 3, iconFlipRtl: 3 };
+    this.properties = { hasActionsEnd: 16, hasActionsStart: 16, hasContentBottom: 16, hasContentEnd: 16, hasContentStart: 16, hasCustomContent: 16, level: 16, openable: 16, parentListEl: 16, active: 5, bordered: 5, closable: 7, closed: 7, description: 1, disabled: 7, dragDisabled: 7, dragHandle: 7, filterHidden: 7, interactionMode: 1, label: 1, messageOverrides: 0, metadata: 0, displayMode: 3, moveToItems: 0, open: 7, scale: 3, selected: 7, selectionAppearance: 3, selectionMode: 3, setPosition: 9, setSize: 9, sortHandleOpen: 7, unavailable: 7, value: 1, iconStart: 3, iconEnd: 3, iconFlipRtl: 3 };
   }
   static {
-    this.styles = Q;
+    this.styles = q;
   }
   // #endregion
   // #region Public Methods
   /** Sets focus on the component. */
   async setFocus() {
-    await G(this);
+    await R(this);
     const { containerEl: { value: e }, parentListEl: t } = this, n = I.get(t);
     if (typeof n == "number") {
       const l = this.getGridCells();
@@ -45,10 +43,9 @@ class V extends T {
   connectedCallback() {
     super.connectedCallback();
     const { el: e } = this;
-    this.parentListEl = e.closest(N), this.level = W(e) + 1, this.setSelectionDefaults();
+    this.parentListEl = e.closest(K), this.level = j(e) + 1, this.setSelectionDefaults();
   }
   async load() {
-    R(this);
   }
   /**
    * TODO: [MIGRATION] Consider inlining some of the watch functions called inside of this method to reduce boilerplate code
@@ -59,10 +56,9 @@ class V extends T {
     e.has("active") && (this.hasUpdated || this.active !== !1) && this.activeHandler(this.active), e.has("closed") && (this.hasUpdated || this.closed !== !1) && this.handleClosedChange(), e.has("disabled") && (this.hasUpdated || this.disabled !== !1) && this.handleDisabledChange(), e.has("open") && (this.hasUpdated || this.open !== !1) && this.handleOpenChange(), e.has("selected") && (this.hasUpdated || this.selected !== !1) && this.handleSelectedChange(), e.has("sortHandleOpen") && (this.hasUpdated || this.sortHandleOpen !== !1) && this.sortHandleOpenHandler(), e.has("displayMode") && this.hasUpdated && this.handleOpenableChange(this.defaultSlotEl.value);
   }
   updated() {
-    F(this);
+    U(this);
   }
   loaded() {
-    K(this);
   }
   // #endregion
   // #region Private Methods
@@ -105,18 +101,6 @@ class V extends T {
   emitInternalListItemActive() {
     this.calciteInternalListItemActive.emit();
   }
-  focusCellHandle() {
-    this.handleCellFocusIn(this.handleGridEl.value);
-  }
-  focusCellActionsStart() {
-    this.handleCellFocusIn(this.actionsStartEl.value);
-  }
-  focusCellContent() {
-    this.handleCellFocusIn(this.contentEl.value);
-  }
-  focusCellActionsEnd() {
-    this.handleCellFocusIn(this.actionsEndEl.value);
-  }
   emitCalciteInternalListItemToggle() {
     this.calciteInternalListItemToggle.emit();
   }
@@ -127,22 +111,22 @@ class V extends T {
     this.closed = !0, this.calciteListItemClose.emit();
   }
   handleContentSlotChange(e) {
-    this.hasCustomContent = b(e);
+    this.hasCustomContent = C(e);
   }
   handleActionsStartSlotChange(e) {
-    this.hasActionsStart = b(e);
+    this.hasActionsStart = C(e);
   }
   handleActionsEndSlotChange(e) {
-    this.hasActionsEnd = b(e);
+    this.hasActionsEnd = C(e);
   }
   handleContentStartSlotChange(e) {
-    this.hasContentStart = b(e);
+    this.hasContentStart = C(e);
   }
   handleContentEndSlotChange(e) {
-    this.hasContentEnd = b(e);
+    this.hasContentEnd = C(e);
   }
   handleContentBottomSlotChange(e) {
-    this.hasContentBottom = b(e);
+    this.hasContentBottom = C(e);
   }
   setSelectionDefaults() {
     const { parentListEl: e, selectionMode: t, selectionAppearance: n } = this;
@@ -151,7 +135,7 @@ class V extends T {
   handleOpenableChange(e) {
     if (!e)
       return;
-    const t = q(e);
+    const t = N(e);
     t.lists.forEach((n) => {
       n.displayMode = this.displayMode;
     }), this.openable = this.displayMode === "nested" && (t.lists.length > 0 || t.items.length > 0);
@@ -185,101 +169,98 @@ class V extends T {
   handleItemKeyDown(e) {
     if (e.defaultPrevented)
       return;
-    const { key: t } = e, n = e.composedPath(), { containerEl: { value: l }, actionsStartEl: { value: h }, actionsEndEl: { value: o }, open: u, openable: m } = this, c = this.getGridCells(), p = c.findIndex((f) => n.includes(f));
-    if (t === "Enter" && !n.includes(h) && !n.includes(o))
+    const { key: t } = e, n = e.composedPath(), { containerEl: { value: l }, actionsStartEl: { value: h }, actionsEndEl: { value: s }, open: g, openable: m } = this, c = this.getGridCells(), p = c.findIndex((f) => n.includes(f));
+    if (t === "Enter" && !n.includes(h) && !n.includes(s))
       e.preventDefault(), this.toggleSelected(e.shiftKey);
     else if (t === "ArrowRight") {
       e.preventDefault();
       const f = p + 1;
-      p === -1 ? !u && m ? (this.toggle(!0), this.focusCell(null)) : c[0] && this.focusCell(c[0]) : c[p] && c[f] && this.focusCell(c[f]);
+      p === -1 ? !g && m ? (this.toggle(!0), this.focusCell(null)) : c[0] && this.focusCell(c[0]) : c[p] && c[f] && this.focusCell(c[f]);
     } else if (t === "ArrowLeft") {
       e.preventDefault();
       const f = p - 1;
-      p === -1 ? (this.focusCell(null), u && m ? this.toggle(!1) : this.calciteInternalFocusPreviousItem.emit()) : p === 0 ? (this.focusCell(null), l.focus()) : c[p] && c[f] && this.focusCell(c[f]);
+      p === -1 ? (this.focusCell(null), g && m ? this.toggle(!1) : this.calciteInternalFocusPreviousItem.emit()) : p === 0 ? (this.focusCell(null), l.focus()) : c[p] && c[f] && this.focusCell(c[f]);
     }
   }
   focusCellNull() {
     this.focusCell(null);
   }
-  handleCellFocusIn(e) {
-    this.setFocusCell(e, w(e), !0);
-  }
   setFocusCell(e, t, n) {
     const { parentListEl: l } = this;
     n && I.set(l, null);
     const h = this.getGridCells();
-    h.forEach((o) => {
-      o.tabIndex = -1, o.removeAttribute(L);
-    }), e && (e.tabIndex = e === t ? 0 : -1, e.setAttribute(L, ""), n && I.set(l, h.indexOf(e)));
+    h.forEach((s) => {
+      s.removeAttribute("tabindex"), s.removeAttribute(w);
+    }), e && (e === t ? e.tabIndex = 0 : e.removeAttribute("tabindex"), e.setAttribute(w, ""), n && I.set(l, h.indexOf(e)));
   }
   focusCell(e, t = !0) {
-    const n = w(e);
+    const n = T(e);
     this.setFocusCell(e, n, t), n?.focus();
   }
   // #endregion
   // #region Rendering
   renderSelected() {
     const { selected: e, selectionMode: t, selectionAppearance: n } = this;
-    return t === "none" || n === "border" ? null : r("selection-container", s`<div class=${i({
+    return t === "none" || n === "border" ? null : r("selection-container", o`<div class=${i({
       [a.selectionContainer]: !0,
       [a.selectionContainerSingle]: t === "single" || t === "single-persist"
-    })} @click=${this.handleItemClick}><calcite-icon .icon=${e ? t === "multiple" ? g.selectedMultiple : g.selectedSingle : t === "multiple" ? g.unselectedMultiple : g.unselectedSingle} .scale=${$(this.scale)}></calcite-icon></div>`);
+    })} @click=${this.handleItemClick}><calcite-icon .icon=${e ? t === "multiple" ? u.selectedMultiple : u.selectedSingle : t === "multiple" ? u.unselectedMultiple : u.unselectedSingle} .scale=${$(this.scale)}></calcite-icon></div>`);
   }
   renderDragHandle() {
-    const { label: e, dragHandle: t, dragDisabled: n, setPosition: l, setSize: h, moveToItems: o } = this;
-    return t ? r("drag-handle-container", s`<div .ariaLabel=${e} class=${i({ [a.dragContainer]: !0, [a.gridCell]: !0 })} @focusin=${this.focusCellHandle} role=gridcell ${v(this.handleGridEl)}><calcite-sort-handle .disabled=${n} .label=${e} .moveToItems=${o} @calciteSortHandleBeforeClose=${this.handleSortHandleBeforeClose} @calciteSortHandleBeforeOpen=${this.handleSortHandleBeforeOpen} @calciteSortHandleClose=${this.handleSortHandleClose} @calciteSortHandleOpen=${this.handleSortHandleOpen} overlay-positioning=fixed .scale=${this.scale} .setPosition=${l} .setSize=${h} ${v(this.setSortHandleEl)}></calcite-sort-handle></div>`) : null;
+    const { label: e, dragHandle: t, dragDisabled: n, setPosition: l, setSize: h, moveToItems: s } = this;
+    return t ? r("drag-handle-container", o`<div .ariaLabel=${e} class=${i({ [a.dragContainer]: !0, [a.gridCell]: !0 })} role=gridcell ${v(this.handleGridEl)}><calcite-sort-handle .disabled=${n} .label=${e} .moveToItems=${s} @calciteSortHandleBeforeClose=${this.handleSortHandleBeforeClose} @calciteSortHandleBeforeOpen=${this.handleSortHandleBeforeOpen} @calciteSortHandleClose=${this.handleSortHandleClose} @calciteSortHandleOpen=${this.handleSortHandleOpen} overlay-positioning=fixed .scale=${this.scale} .setPosition=${l} .setSize=${h} ${v(this.setSortHandleEl)}></calcite-sort-handle></div>`) : null;
   }
   renderOpen() {
-    const { el: e, open: t, openable: n, messages: l, displayMode: h, scale: o } = this;
+    const { el: e, open: t, openable: n, messages: l, displayMode: h, scale: s } = this;
     if (h !== "nested")
       return null;
-    const u = P(e), m = n ? t ? g.open : u === "rtl" ? g.closedRTL : g.closedLTR : g.blank, c = $(o), p = n ? t ? l.collapse : l.expand : void 0, f = n ? this.handleToggleClick : void 0;
-    return r("open-container", s`<div class=${i(a.openContainer)} @click=${f} title=${p ?? D}>${r(m, s`<calcite-icon .icon=${m} .scale=${c}></calcite-icon>`)}</div>`);
+    const g = P(e), m = n ? t ? u.open : g === "rtl" ? u.closedRTL : u.closedLTR : u.blank, c = $(s), p = n ? t ? l.collapse : l.expand : void 0, f = n ? this.handleToggleClick : void 0;
+    return r("open-container", o`<div class=${i(a.openContainer)} @click=${f} title=${p ?? M}>${r(m, o`<calcite-icon .icon=${m} .scale=${c}></calcite-icon>`)}</div>`);
   }
   renderActionsStart() {
     const { label: e, hasActionsStart: t } = this;
-    return r("actions-start-container", s`<div .ariaLabel=${e} class=${i({ [a.actionsStart]: !0, [a.gridCell]: !0 })} .hidden=${!t} @focusin=${this.focusCellActionsStart} role=gridcell ${v(this.actionsStartEl)}><slot name=${S.actionsStart} @slotchange=${this.handleActionsStartSlotChange}></slot></div>`);
+    return r("actions-start-container", o`<div .ariaLabel=${e} class=${i({ [a.actionsStart]: !0, [a.gridCell]: !0 })} .hidden=${!t} role=gridcell ${v(this.actionsStartEl)}><slot name=${S.actionsStart} @slotchange=${this.handleActionsStartSlotChange}></slot></div>`);
   }
   renderActionsEnd() {
     const { label: e, hasActionsEnd: t, closable: n, messages: l } = this;
-    return r("actions-end-container", s`<div .ariaLabel=${e} class=${i({ [a.actionsEnd]: !0, [a.gridCell]: !0 })} .hidden=${!(t || n)} @focusin=${this.focusCellActionsEnd} role=gridcell ${v(this.actionsEndEl)}><slot name=${S.actionsEnd} @slotchange=${this.handleActionsEndSlotChange}></slot>${n ? r("close-action", s`<calcite-action appearance=transparent class=${i(a.close)} .icon=${g.close} .label=${l.close} @click=${this.handleCloseClick} .scale=${this.scale} .text=${l.close}></calcite-action>`) : null}</div>`);
+    return r("actions-end-container", o`<div .ariaLabel=${e} class=${i({ [a.actionsEnd]: !0, [a.gridCell]: !0 })} .hidden=${!(t || n)} role=gridcell ${v(this.actionsEndEl)}><slot name=${S.actionsEnd} @slotchange=${this.handleActionsEndSlotChange}></slot>${n ? r("close-action", o`<calcite-action appearance=transparent class=${i(a.close)} .icon=${u.close} .label=${l.close} @click=${this.handleCloseClick} .scale=${this.scale} .text=${l.close}></calcite-action>`) : null}</div>`);
   }
   renderContentStart() {
     const { hasContentStart: e } = this;
-    return s`<div class=${i(a.contentStart)} .hidden=${!e}><slot name=${S.contentStart} @slotchange=${this.handleContentStartSlotChange}></slot></div>`;
+    return o`<div class=${i(a.contentStart)} .hidden=${!e}><slot name=${S.contentStart} @slotchange=${this.handleContentStartSlotChange}></slot></div>`;
   }
   renderCustomContent() {
     const { hasCustomContent: e } = this;
-    return s`<div class=${i(a.customContent)} .hidden=${!e}><slot name=${S.content} @slotchange=${this.handleContentSlotChange}></slot></div>`;
+    return o`<div class=${i(a.customContent)} .hidden=${!e}><slot name=${S.content} @slotchange=${this.handleContentSlotChange}></slot></div>`;
   }
   renderIconStart() {
     const { iconStart: e, iconFlipRtl: t, scale: n } = this;
-    return e ? r("icon-start", s`<calcite-icon class=${i(a.icon)} .flipRtl=${t === "both" || t === "start"} .icon=${e} .scale=${$(n)}></calcite-icon>`) : null;
+    return e ? r("icon-start", o`<calcite-icon class=${i(a.icon)} .flipRtl=${t === "both" || t === "start"} .icon=${e} .scale=${$(n)}></calcite-icon>`) : null;
   }
   renderIconEnd() {
     const { iconEnd: e, iconFlipRtl: t, scale: n } = this;
-    return e ? r("icon-end", s`<calcite-icon class=${i(a.icon)} .flipRtl=${t === "both" || t === "end"} .icon=${e} .scale=${$(n)}></calcite-icon>`) : null;
+    return e ? r("icon-end", o`<calcite-icon class=${i(a.icon)} .flipRtl=${t === "both" || t === "end"} .icon=${e} .scale=${$(n)}></calcite-icon>`) : null;
   }
   renderContentEnd() {
     const { hasContentEnd: e } = this;
-    return s`<div class=${i(a.contentEnd)} .hidden=${!e}><slot name=${S.contentEnd} @slotchange=${this.handleContentEndSlotChange}></slot></div>`;
+    return o`<div class=${i(a.contentEnd)} .hidden=${!e}><slot name=${S.contentEnd} @slotchange=${this.handleContentEndSlotChange}></slot></div>`;
   }
   renderContentBottom() {
     const { hasContentBottom: e } = this;
-    return s`<div class=${i(a.contentBottom)} .hidden=${!e}><slot name=${S.contentBottom} @slotchange=${this.handleContentBottomSlotChange}></slot></div>`;
+    return o`<div class=${i(a.contentBottom)} .hidden=${!e}><slot name=${S.contentBottom} @slotchange=${this.handleContentBottomSlotChange}></slot></div>`;
   }
   renderDefaultContainer() {
-    return s`<div class=${i({
+    return o`<div class=${i({
       [a.nestedContainer]: !0,
       [a.nestedContainerOpen]: this.openable && this.open
     })}><slot @slotchange=${this.handleDefaultSlotChange} ${v(this.defaultSlotEl)}></slot></div>`;
   }
   renderContentProperties() {
     const { label: e, description: t, hasCustomContent: n } = this;
-    return !n && (e || t) ? r("content", s`<div class=${i(a.content)}>${e ? r("label", s`<div class=${i(a.label)}>${e}</div>`) : null}${t ? r("description", s`<div class=${i(a.description)}>${t}</div>`) : null}</div>`) : null;
+    return !n && (e || t) ? r("content", o`<div class=${i(a.content)}>${e ? r("label", o`<div class=${i(a.label)}>${e}</div>`) : null}${t ? r("description", o`<div class=${i(a.description)}>${t}</div>`) : null}</div>`) : null;
   }
   renderContentContainer() {
-    const { description: e, label: t, selectionMode: n, hasCustomContent: l, unavailable: h } = this, o = l || !!t || !!e, u = [
+    const { description: e, label: t, selectionMode: n, hasCustomContent: l, unavailable: h } = this, s = l || !!t || !!e, g = [
       this.renderContentStart(),
       this.renderCustomContent(),
       this.renderIconStart(),
@@ -287,30 +268,30 @@ class V extends T {
       this.renderIconEnd(),
       this.renderContentEnd()
     ];
-    return r("content-container", s`<div .ariaLabel=${t} class=${i({
+    return r("content-container", o`<div .ariaLabel=${t} class=${i({
       [a.gridCell]: !0,
       [a.contentContainer]: !0,
       [a.contentContainerUnavailable]: h,
       [a.contentContainerSelectable]: n !== "none",
-      [a.contentContainerHasCenterContent]: o
-    })} @click=${this.handleItemClick} @focusin=${this.focusCellContent} role=gridcell ${v(this.contentEl)}>${u}</div>`);
+      [a.contentContainerHasCenterContent]: s
+    })} @click=${this.handleItemClick} role=gridcell ${v(this.contentEl)}>${g}</div>`);
   }
   render() {
-    const { openable: e, open: t, level: n, active: l, label: h, selected: o, selectionAppearance: u, selectionMode: m, interactionMode: c, closed: p, filterHidden: f, bordered: E, disabled: H, hasContentBottom: y } = this, k = E && y, A = E && !y, x = m !== "none" && u === "border", O = x && o, B = x && !o, z = c === "interactive" || c === "static" && m !== "none" && u === "border";
-    return U({ disabled: H, children: s`<div class=${i({ [a.wrapper]: !0, [a.wrapperBordered]: k })}><div .ariaExpanded=${e ? t : null} .ariaLabel=${h} .ariaLevel=${n} .ariaSelected=${o} class=${i({
+    const { openable: e, open: t, level: n, active: l, label: h, selected: s, selectionAppearance: g, selectionMode: m, interactionMode: c, closed: p, filterHidden: f, bordered: y, disabled: L, hasContentBottom: E } = this, H = y && E, k = y && !E, x = m !== "none" && g === "border", A = x && s, O = x && !s, B = c === "interactive" || c === "static" && m !== "none" && g === "border";
+    return F({ disabled: L, children: o`<div class=${i({ [a.wrapper]: !0, [a.wrapperBordered]: H })}><div .ariaExpanded=${e ? t : null} .ariaLabel=${h} .ariaLevel=${n} .ariaSelected=${s} class=${i({
       [a.row]: !0,
       [a.container]: !0,
-      [a.containerHover]: z,
+      [a.containerHover]: B,
       [a.containerBorder]: x,
-      [a.containerBorderSelected]: O,
-      [a.containerBorderUnselected]: B
+      [a.containerBorderSelected]: A,
+      [a.containerBorderUnselected]: O
     })} .hidden=${p || f} @focus=${this.focusCellNull} @focusin=${this.emitInternalListItemActive} @keydown=${this.handleItemKeyDown} role=row .tabIndex=${l ? 0 : -1} ${v(this.containerEl)}>${this.renderDragHandle()}${this.renderSelected()}${this.renderOpen()}<div class=${i({
       [a.contentContainerWrapper]: !0,
-      [a.contentContainerWrapperBordered]: A
+      [a.contentContainerWrapperBordered]: k
     })}>${this.renderActionsStart()}${this.renderContentContainer()}${this.renderActionsEnd()}</div></div>${this.renderContentBottom()}</div>${this.renderDefaultContainer()}` });
   }
 }
-M("calcite-list-item", V);
+z("calcite-list-item", J);
 export {
-  V as ListItem
+  J as ListItem
 };

package/dist/components/calcite-list-item/utils.d.ts

@@ -10,3 +10,4 @@ export declare function getListItemChildren(slotEl: HTMLSlotElement): {
 };
 export declare function updateListItemChildren(slotEl: HTMLSlotElement): void;
 export declare function getDepth(element: HTMLElement, includeGroup?: boolean): number;
+export declare function isListItem(element: Element): element is HTMLCalciteListItemElement;

package/dist/components/calcite-list-item-group/customElement.js

@@ -4,11 +4,9 @@ import { LitElement as c, createEvent as n, safeClassMap as e } from "@arcgis/lu
 import { u as o, I as r } from "../../chunks/interactive.js";
 import { M as d } from "../../chunks/resources5.js";
 import { css as h } from "@lit/reactive-element/css-tag.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.
- * v3.0.0-next.98
-*/
+/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+v3.0.0 */
 const t = {
   container: "container",
   heading: "heading"

package/dist/components/calcite-loader/customElement.js

@@ -4,14 +4,10 @@ import { LitElement as z, setAttribute as u, safeClassMap as d, safeStyleMap as
 import { g as x } from "../../chunks/guid.js";
 import { u as y } from "../../chunks/useT9n.js";
 import { css as b } from "@lit/reactive-element/css-tag.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.
- * v3.0.0-next.98
-*/
+/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
+v3.0.0 */
 const a = {
-  container: "container",
-  loader: "loader",
   percentage: "percentage",
   progressRing: "ring--progress",
   ring: "ring",

package/dist/components/calcite-menu/customElement.js

@@ -3,20 +3,18 @@ import { html as o } from "lit";
 import { LitElement as n } from "@arcgis/lumina";
 import { useWatchAttributes as u } from "@arcgis/components-controllers";
 import { h as r, d as a, s as h, b as m } from "../../chunks/dom.js";
-import { c, s as f, a as p } from "../../chunks/loadable.js";
-import { u as d } from "../../chunks/useT9n.js";
-import { css as y } from "@lit/reactive-element/css-tag.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.
- * v3.0.0-next.98
-*/
-const b = y`:host{display:flex}ul{margin:0;display:inline-flex;block-size:100%;align-items:center;padding:0}:host([layout=vertical]) ul{display:flex;inline-size:100%;flex-direction:column}:host([hidden]){display:none}[hidden]{display:none}`;
-class g extends n {
+import { c } from "../../chunks/loadable.js";
+import { u as f } from "../../chunks/useT9n.js";
+import { css as p } from "@lit/reactive-element/css-tag.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.
+v3.0.0 */
+const d = p`:host{display:flex}ul{margin:0;display:inline-flex;block-size:100%;align-items:center;padding:0}:host([layout=vertical]) ul{display:flex;inline-size:100%;flex-direction:column}:host([hidden]){display:none}[hidden]{display:none}`;
+class y extends n {
   // #endregion
   // #region Lifecycle
   constructor() {
-    super(), this.attributeWatch = u(["role"], this.handleGlobalAttributesChanged), this.menuItems = [], this.layout = "horizontal", this.messages = d(), this.listen("calciteInternalMenuItemKeyEvent", this.calciteInternalNavMenuItemKeyEvent);
+    super(), this.attributeWatch = u(["role"], this.handleGlobalAttributesChanged), this.menuItems = [], this.layout = "horizontal", this.messages = f(), this.listen("calciteInternalMenuItemKeyEvent", this.calciteInternalNavMenuItemKeyEvent);
   }
   static {
     this.properties = { label: 1, layout: 3, messageOverrides: 0 };
@@ -25,7 +23,7 @@ class g extends n {
     this.shadowRootOptions = { mode: "open", delegatesFocus: !0 };
   }
   static {
-    this.styles = b;
+    this.styles = d;
   }
   // #endregion
   // #region Public Methods
@@ -34,13 +32,11 @@ class g extends n {
     await c(this), r(this.menuItems[0]);
   }
   async load() {
-    f(this);
   }
   willUpdate(e) {
     e.has("layout") && (this.hasUpdated || this.layout !== "horizontal") && this.setMenuItemLayout(this.menuItems, this.layout);
   }
   loaded() {
-    p(this);
   }
   // #endregion
   // #region Private Methods
@@ -72,7 +68,7 @@ class g extends n {
     return o`<ul .ariaLabel=${this.label} .role=${this.getEffectiveRole()}><slot @slotchange=${this.handleMenuSlotChange}></slot></ul>`;
   }
 }
-l("calcite-menu", g);
+l("calcite-menu", y);
 export {
-  g as Menu
+  y as Menu
 };

package/dist/components/calcite-menu-item/customElement.js

@@ -4,14 +4,12 @@ import { keyed as l } from "lit-html/directives/keyed.js";
 import { createRef as m, ref as p } from "lit-html/directives/ref.js";
 import { LitElement as g, createEvent as v, safeClassMap as r, nothing as u } from "@arcgis/lumina";
 import { s as y, g as w } from "../../chunks/dom.js";
-import { c as x, s as I, a as $ } from "../../chunks/loadable.js";
-import { u as k } from "../../chunks/useT9n.js";
-import { css as L } from "@lit/reactive-element/css-tag.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.
- * v3.0.0-next.98
-*/
+import { c as x } from "../../chunks/loadable.js";
+import { u as I } from "../../chunks/useT9n.js";
+import { css as $ } from "@lit/reactive-element/css-tag.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.
+v3.0.0 */
 const t = {
   container: "container",
   content: "content",
@@ -30,18 +28,18 @@ const t = {
   open: "open",
   nested: "nested",
   textContainer: "text-container"
-}, E = L`:host{position:relative;box-sizing:border-box;display:flex;align-items:center;flex-shrink:0}:host .container,:host .item-content,:host .content{min-block-size:3rem}:host([layout=vertical]){inline-size:100%}:host(:not([layout=vertical])){block-size:100%}.container,.item-content{display:flex;block-size:100%;inline-size:100%;flex-direction:row;align-items:stretch}.content{position:relative;box-sizing:border-box;display:flex;block-size:100%;inline-size:100%;cursor:pointer;align-items:center;justify-content:center;padding-inline:1rem;font-size:var(--calcite-font-size-0);outline:2px solid transparent;outline-offset:2px;text-decoration:none;padding-block-start:.125rem;border-block-end:.125rem solid var(--calcite-color-transparent);background-color:var(--calcite-menu-background-color, var(--calcite-internal-menu-background-color, var(--calcite-color-foreground-1)));color:var(--calcite-menu-text-color, var(--calcite-internal-menu-text-color, var(--calcite-color-text-2)))}.content:hover{border-block-end-color:var(--calcite-menu-item-accent-color, var(--calcite-color-border-2))}.content:focus{border-block-end-width:4px;outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))));padding-block-start:.25rem;border-block-end-width:.25rem}.content:active{--calcite-internal-menu-background-color: var(--calcite-color-foreground-3);--calcite-internal-menu-text-color: var(--calcite-color-text-1)}.content span{display:inline-flex}.content.layout--vertical{display:flex;inline-size:100%;justify-content:flex-start;padding-block:1rem;border-block-end:0;border-inline-end:.25rem solid var(--calcite-color-transparent)}:host([layout=vertical]) .content{padding-inline:.75rem}:host([active]) .content{--calcite-internal-menu-text-color: var(--calcite-color-text-1);border-color:var(--calcite-menu-item-accent-color, var(--calcite-color-brand))}:host([active]) .icon{--calcite-internal-menu-item-icon-color: var(--calcite-color-brand)}.icon{color:var(--calcite-menu-text-color, var(--calcite-icon-color, var(--calcite-internal-menu-item-icon-color, var(--calcite-color-text-3))))}.icon--start{margin-inline-end:.75rem}.icon--end{margin-inline-start:.75rem}:host([layout=vertical]) .icon--end{margin-inline-start:auto;padding-inline-start:.75rem}.icon--dropdown{position:relative;margin-inline-start:auto;margin-inline-end:0px;padding-inline-start:.5rem}:host([layout=vertical]) .icon--end~.icon--dropdown{margin-inline-start:.75rem}:host([layout=vertical]) .hover-href-icon{padding-inline-start:.5rem}:host([layout=vertical]) .hover-href-icon~.icon--end{margin-inline-start:.5rem}:host([layout=vertical]) .hover-href-icon~.icon--breadcrumb{margin-inline-start:.75rem}.icon--breadcrumb{margin-inline-end:0px;padding-inline-start:.5rem}:host([layout=vertical]) .icon--breadcrumb{margin-inline-start:auto}:host([layout=vertical]) .icon--breadcrumb~.icon--dropdown{margin-inline-start:.5rem}:host([layout=vertical]) .icon--end~.icon--breadcrumb{margin-inline-start:.5rem}:host([breadcrumb]) .content{padding-inline-end:.75rem}calcite-action{position:relative;block-size:auto;border-inline-start:1px solid var(--calcite-color-foreground-1);--calcite-action-background-color: var(--calcite-menu-background-color);--calcite-action-text-color: var(--calcite-menu-text-color)}calcite-action:after{position:absolute;inset-inline-start:-1px;display:block;inline-size:1px;content:"";inset-block:.75rem;background-color:var(--calcite-color-border-3)}calcite-action:hover:after{block-size:100%;inset-block:0}calcite-action:active{--calcite-action-background-color-press: var(--calcite-menu-background-color)}.content:focus~calcite-action,.content:hover~calcite-action{--calcite-action-text-color: var(--calcite-menu-text-color, var(--calcite-color-text-1))}.content:focus~calcite-action:after,.content:hover~calcite-action:after{block-size:100%;inset-block:0}.dropdown-menu-items{position:absolute;display:none;block-size:auto;min-inline-size:100%;flex-direction:column;overflow:visible;border:1px solid var(--calcite-menu-item-sub-menu-border-color, var(--calcite-color-border-3));border-radius:var(--calcite-menu-item-sub-menu-corner-radius, var(--calcite-corner-radius));inset-block-start:100%;z-index:var(--calcite-z-index-dropdown)}.dropdown-menu-items.open{display:block}.dropdown-menu-items.nested{position:absolute;inset-block-start:-1px;transform:translate(calc(100% - 2px))}.parent--vertical{flex-direction:column}.dropdown--vertical.dropdown-menu-items{position:relative;box-shadow:none;inset-block-start:0;transform:none}.dropdown--vertical.dropdown-menu-items:last-of-type{border-inline:0}:host([layout=vertical]:last-of-type) .dropdown-menu-items{border-block-end:0}:host([slot=submenu-item]) .parent--vertical{padding-inline-start:1.5rem}.dropdown-menu-items.nested.calcite--rtl{transform:translate(calc(-100% + 2px))}.dropdown--vertical.dropdown-menu-items.nested.calcite--rtl{transform:none}.hover-href-icon{position:relative;inset-inline-end:.25rem;margin-inline-start:auto;opacity:0;transition:all var(--calcite-internal-animation-timing-medium) ease-in-out}.content:focus .hover-href-icon,.content:hover .hover-href-icon{inset-inline-end:-.25rem;opacity:1}:host([hidden]){display:none}[hidden]{display:none}`;
-class S extends g {
+}, k = $`:host{position:relative;box-sizing:border-box;display:flex;align-items:center;flex-shrink:0}:host .container,:host .item-content,:host .content{min-block-size:3rem}:host([layout=vertical]){inline-size:100%}:host(:not([layout=vertical])){block-size:100%}.container,.item-content{display:flex;block-size:100%;inline-size:100%;flex-direction:row;align-items:stretch}.content{position:relative;box-sizing:border-box;display:flex;block-size:100%;inline-size:100%;cursor:pointer;align-items:center;justify-content:center;padding-inline:1rem;font-size:var(--calcite-font-size-0);outline:2px solid transparent;outline-offset:2px;text-decoration:none;padding-block-start:.125rem;border-block-end:.125rem solid var(--calcite-color-transparent);background-color:var(--calcite-menu-background-color, var(--calcite-internal-menu-background-color, var(--calcite-color-foreground-1)));color:var(--calcite-menu-text-color, var(--calcite-internal-menu-text-color, var(--calcite-color-text-2)))}.content:hover{border-block-end-color:var(--calcite-menu-item-accent-color, var(--calcite-color-border-2))}.content:focus{border-block-end-width:4px;outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))));padding-block-start:.25rem;border-block-end-width:.25rem}.content:active{--calcite-internal-menu-background-color: var(--calcite-color-foreground-3);--calcite-internal-menu-text-color: var(--calcite-color-text-1)}.content span{display:inline-flex}.content.layout--vertical{display:flex;inline-size:100%;justify-content:flex-start;padding-block:1rem;border-block-end:0;border-inline-end:.25rem solid var(--calcite-color-transparent)}:host([layout=vertical]) .content{padding-inline:.75rem}:host([active]) .content{--calcite-internal-menu-text-color: var(--calcite-color-text-1);border-color:var(--calcite-menu-item-accent-color, var(--calcite-color-brand))}:host([active]) .icon{--calcite-internal-menu-item-icon-color: var(--calcite-color-brand)}.icon{color:var(--calcite-menu-text-color, var(--calcite-icon-color, var(--calcite-internal-menu-item-icon-color, var(--calcite-color-text-3))))}.icon--start{margin-inline-end:.75rem}.icon--end{margin-inline-start:.75rem}:host([layout=vertical]) .icon--end{margin-inline-start:auto;padding-inline-start:.75rem}.icon--dropdown{position:relative;margin-inline-start:auto;margin-inline-end:0px;padding-inline-start:.5rem}:host([layout=vertical]) .icon--end~.icon--dropdown{margin-inline-start:.75rem}:host([layout=vertical]) .hover-href-icon{padding-inline-start:.5rem}:host([layout=vertical]) .hover-href-icon~.icon--end{margin-inline-start:.5rem}:host([layout=vertical]) .hover-href-icon~.icon--breadcrumb{margin-inline-start:.75rem}.icon--breadcrumb{margin-inline-end:0px;padding-inline-start:.5rem}:host([layout=vertical]) .icon--breadcrumb{margin-inline-start:auto}:host([layout=vertical]) .icon--breadcrumb~.icon--dropdown{margin-inline-start:.5rem}:host([layout=vertical]) .icon--end~.icon--breadcrumb{margin-inline-start:.5rem}:host([breadcrumb]) .content{padding-inline-end:.75rem}calcite-action{position:relative;block-size:auto;border-inline-start:1px solid var(--calcite-color-foreground-1);--calcite-action-background-color: var(--calcite-menu-background-color);--calcite-action-text-color: var(--calcite-menu-text-color)}calcite-action:after{position:absolute;inset-inline-start:-1px;display:block;inline-size:1px;content:"";inset-block:.75rem;background-color:var(--calcite-color-border-3)}calcite-action:hover:after{block-size:100%;inset-block:0}calcite-action:active{--calcite-action-background-color-press: var(--calcite-menu-background-color)}.content:focus~calcite-action,.content:hover~calcite-action{--calcite-action-text-color: var(--calcite-menu-text-color, var(--calcite-color-text-1))}.content:focus~calcite-action:after,.content:hover~calcite-action:after{block-size:100%;inset-block:0}.dropdown-menu-items{position:absolute;display:none;block-size:auto;min-inline-size:100%;flex-direction:column;overflow:visible;border:1px solid var(--calcite-menu-item-sub-menu-border-color, var(--calcite-color-border-3));border-radius:var(--calcite-menu-item-sub-menu-corner-radius, var(--calcite-corner-radius));inset-block-start:100%;z-index:var(--calcite-z-index-dropdown)}.dropdown-menu-items.open{display:block}.dropdown-menu-items.nested{position:absolute;inset-block-start:-1px;transform:translate(calc(100% - 2px))}.parent--vertical{flex-direction:column}.dropdown--vertical.dropdown-menu-items{position:relative;box-shadow:none;inset-block-start:0;transform:none}.dropdown--vertical.dropdown-menu-items:last-of-type{border-inline:0}:host([layout=vertical]:last-of-type) .dropdown-menu-items{border-block-end:0}:host([slot=submenu-item]) .parent--vertical{padding-inline-start:1.5rem}.dropdown-menu-items.nested.calcite--rtl{transform:translate(calc(-100% + 2px))}.dropdown--vertical.dropdown-menu-items.nested.calcite--rtl{transform:none}.hover-href-icon{position:relative;inset-inline-end:.25rem;margin-inline-start:auto;opacity:0;transition:all var(--calcite-internal-animation-timing-medium) ease-in-out}.content:focus .hover-href-icon,.content:hover .hover-href-icon{inset-inline-end:-.25rem;opacity:1}:host([hidden]){display:none}[hidden]{display:none}`;
+class L extends g {
   // #endregion
   // #region Lifecycle
   constructor() {
-    super(), this.anchorEl = m(), this.dropdownActionEl = m(), this.hasSubmenu = !1, this.isTopLevelItem = !1, this.messages = k(), this.open = !1, this.calciteInternalMenuItemKeyEvent = v(), this.calciteMenuItemSelect = v(), this.listenOn(window, "click", this.handleClickOut), this.listen("focusout", this.handleFocusOut), this.listen("blur", this.blurHandler), this.listen("focus", this.focusHandler);
+    super(), this.anchorEl = m(), this.dropdownActionEl = m(), this.hasSubmenu = !1, this.isTopLevelItem = !1, this.messages = I(), this.open = !1, this.calciteInternalMenuItemKeyEvent = v(), this.calciteMenuItemSelect = v(), this.listenOn(window, "click", this.handleClickOut), this.listen("focusout", this.handleFocusOut), this.listen("blur", this.blurHandler), this.listen("focus", this.focusHandler);
   }
   static {
     this.properties = { hasSubmenu: 16, submenuItems: 16, active: 7, breadcrumb: 7, href: 1, iconEnd: 3, iconFlipRtl: 3, iconStart: 3, isTopLevelItem: 5, label: 1, layout: 3, messageOverrides: 0, open: 7, rel: 3, target: 3, text: 1, topLevelMenuLayout: 1 };
   }
   static {
-    this.styles = E;
+    this.styles = k;
   }
   // #endregion
   // #region Public Methods
@@ -50,10 +48,8 @@ class S extends g {
     await x(this), this.anchorEl.value.focus();
   }
   async load() {
-    I(this);
   }
   loaded() {
-    $(this);
   }
   // #endregion
   // #region Private Methods
@@ -164,7 +160,7 @@ class S extends g {
     })} role=none><div class=${r(t.itemContent)}><a .ariaCurrent=${this.isFocused ? "page" : !1} .ariaExpanded=${this.open} .ariaHasPopup=${this.hasSubmenu} .ariaLabel=${this.label} class=${r({ [t.layoutVertical]: this.layout === "vertical", [t.content]: !0 })} href=${this.href ?? u} @click=${this.clickHandler} @keydown=${this.keyDownHandler} rel=${this.rel ?? u} role=menuitem .tabIndex=${this.isTopLevelItem ? 0 : -1} target=${this.target ?? u} ${p(this.anchorEl)}>${this.renderItemContent(e)}</a>${this.href && this.hasSubmenu ? this.renderDropdownAction(e) : null}</div>${this.renderSubmenuItems(e)}</li>`;
   }
 }
-f("calcite-menu-item", S);
+f("calcite-menu-item", L);
 export {
-  S as MenuItem
+  L as MenuItem
 };