@orangelogic/design-system 2.143.0 → 2.144.0

package/library/chunks/{tree.BpSudcAI.js → tree.CvxvKWUm.js}

@@ -1,10 +1,10 @@
 import { C as R, n as l } from "./lib-cortex-element.CVMmyPMC.js";
 import { c as N } from "./component.styles.CRO4Odto.js";
 import { c as G } from "./custom-element.L4WJXn1j.js";
-import { L as M } from "./i18n.C4wPyPTR.js";
+import { L as M } from "./i18n.DYXys45m.js";
 import { c as K } from "./math.DuKzLacZ.js";
-import { w as f } from "./watch.CkGTlwIo.js";
-import { i as Z, x as b, E as D } from "./lit-element.jLBm65_O.js";
+import { w as f } from "./watch.K-dbDP6P.js";
+import { i as H, x as b, E as L } from "./lit-element.jLBm65_O.js";
 import { r as y } from "./state.CSDxrqLd.js";
 import { e as x } from "./query.BBf1UFkC.js";
 import { s as U, a as z, b as $ } from "./event.BeKOsirN.js";
@@ -12,18 +12,18 @@ import { e as C } from "./class-map.BiVq-cVR.js";
 import { o as E } from "./if-defined.BRoBj_Rp.js";
 import { l as W } from "./live.DCegntDo.js";
 import { n as S } from "./when.Dr1es41R.js";
-import { g as P, s as H } from "./animation-registry.HmpwNuGH.js";
-import { C as Y } from "./checkbox.kdSMUgR1.js";
-import { C as J } from "./icon.-k4fR0bD.js";
+import { g as P, s as Z } from "./animation-registry.HmpwNuGH.js";
+import { C as Y } from "./checkbox.aQnF4Zc3.js";
+import { C as J } from "./icon.CsF1BoUl.js";
 import Q from "../components/line-clamp.js";
 import ee from "../components/spinner.js";
 import { i as te } from "./browser.BHOCIF_A.js";
 import { S as ie } from "./sortable.esm.oSzf6C5Q.js";
 function ne(e, t, i) {
   let n;
-  return function(...r) {
-    const a = this, d = function() {
-      n = null, e.apply(a, r);
+  return function(...s) {
+    const o = this, d = function() {
+      n = null, e.apply(o, s);
     };
     n && clearTimeout(n), n = window.setTimeout(d, t);
   };
@@ -31,30 +31,30 @@ function ne(e, t, i) {
 const p = [];
 for (let e = 0; e < 256; ++e)
   p.push((e + 256).toString(16).slice(1));
-function ae(e, t = 0) {
+function oe(e, t = 0) {
   return (p[e[t + 0]] + p[e[t + 1]] + p[e[t + 2]] + p[e[t + 3]] + "-" + p[e[t + 4]] + p[e[t + 5]] + "-" + p[e[t + 6]] + p[e[t + 7]] + "-" + p[e[t + 8]] + p[e[t + 9]] + "-" + p[e[t + 10]] + p[e[t + 11]] + p[e[t + 12]] + p[e[t + 13]] + p[e[t + 14]] + p[e[t + 15]]).toLowerCase();
 }
-let I;
-const oe = new Uint8Array(16);
-function re() {
-  if (!I) {
+let w;
+const ae = new Uint8Array(16);
+function se() {
+  if (!w) {
     if (typeof crypto > "u" || !crypto.getRandomValues)
       throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
-    I = crypto.getRandomValues.bind(crypto);
+    w = crypto.getRandomValues.bind(crypto);
   }
-  return I(oe);
+  return w(ae);
 }
-const se = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), F = { randomUUID: se };
+const re = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), F = { randomUUID: re };
 function le(e, t, i) {
   if (F.randomUUID && !e)
     return F.randomUUID();
   e = e || {};
-  const n = e.random ?? e.rng?.() ?? re();
+  const n = e.random ?? e.rng?.() ?? se();
   if (n.length < 16)
     throw new Error("Random bytes length must be >= 16");
-  return n[6] = n[6] & 15 | 64, n[8] = n[8] & 63 | 128, ae(n);
+  return n[6] = n[6] & 15 | 64, n[8] = n[8] & 63 | 128, oe(n);
 }
-const de = Z`:host{--selected-color:var(--cx-color-primary-600);--selected-background-color:var(--cx-color-primary-50);--hover-background-color:var(--cx-menu-item-background-color-hover);--active-background-color:var(--cx-color-neutral-200);--item-padding:var(--cx-spacing-2x-small) var(--cx-spacing-x-small);outline:0;display:block}:host(:focus-visible) .tree-item{outline:var(--cx-focus-ring);outline-offset:calc(-1 * var(--cx-focus-ring-width))}[hidden]{display:none!important}slot:not([name])::slotted(cx-icon){margin-inline-end:var(--cx-spacing-x-small)}.tree-item{color:var(--cx-color-neutral);cursor:pointer;-webkit-user-select:none;user-select:none;flex-direction:column;align-items:stretch;display:flex;position:relative}.tree-item__checkbox{margin-inline-end:var(--cx-spacing-x-small)}.tree-item__expand-button,.tree-item__checkbox,.tree-item__label{font-family:var(--cx-font-sans);font-size:var(--cx-tree-item-font-size,var(--cx-font-size-small));font-weight:var(--cx-tree-item-font-weight,var(--cx-font-weight-medium));line-height:var(--cx-tree-item-line-height,var(--cx-line-height-large));letter-spacing:var(--cx-tree-item-letter-spacing,var(--cx-letter-spacing-normal))}.tree-item__checkbox::part(base){align-items:center;display:flex}.tree-item__checkbox::part(label){margin-inline-start:0}.tree-item__indentation{flex-shrink:0;width:1em;display:block}.tree-item__expand-spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.tree-item__expand-button{box-sizing:content-box;color:var(--cx-color-neutral-500);cursor:pointer;min-width:max(1em,1rem);min-height:max(1em,1rem);transition:var(--cx-transition-medium) rotate ease;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.tree-item--expanded .tree-item__expand-button{rotate:90deg}.tree-item--expanded.tree-item--rtl .tree-item__expand-button{rotate:-90deg}.tree-item--expanded slot[name=expand-icon],.tree-item:not(.tree-item--expanded) slot[name=collapse-icon]{display:none}:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__item .tree-item__expand-icon-slot{color:var(--selected-color)}.tree-item:not(.tree-item--has-expand-button) .tree-item__expand-icon-slot{visibility:hidden;opacity:0;pointer-events:none}.tree-item__expand-button--visible{cursor:pointer}.tree-item__item{border-radius:var(--cx-border-radius-large);padding:var(--item-padding,var(--cx-spacing-x-small) var(--cx-spacing-small));transition:var(--cx-transition-x-fast) background-color ease;align-items:center;display:flex}.tree-item__item:hover{background-color:var(--hover-background-color)}.tree-item__item:active{background-color:var(--active-background-color)}.tree-item--disabled .tree-item__item{opacity:.5;cursor:default;outline:none}:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__item{background-color:var(--selected-background-color);color:var(--selected-color)}:host(:not([aria-disabled=true])) .tree-item__expand-button{color:var(--cx-color-neutral)}:host(:not([aria-disabled=true])) .tree-item--selected,:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__expand-button,:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__actions::slotted(cx-icon-button){color:var(--cx-color-neutral-0)}:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__actions::slotted(cx-icon-button){--hover-background-color:var(--cx-color-neutral-0)}.tree-item__label{align-items:center;display:flex}.tree-item__actions{font-size:var(--cx-font-size-medium);align-items:center;width:fit-content;margin-inline-start:auto;display:flex}.tree-item__actions::slotted(*){visibility:hidden;opacity:0;transition:var(--cx-transition-x-fast) visibility, var(--cx-transition-x-fast) opacity ease}.tree-item__item:hover .tree-item__actions::slotted(*){visibility:visible;opacity:1}@supports not (overlay:auto){.tree-item__actions::slotted(cx-dropdown[open]){visibility:visible;opacity:1}}.tree-item__children{font-size:calc(1em + var(--indent-size,var(--cx-spacing-medium)));gap:var(--children-gap,0);flex-direction:column;display:flex}@media (forced-colors:active){:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__item{outline:1px dashed selecteditem}}::slotted(cx-tree-item){--hover-background-color:inherit;--active-background-color:inherit;--selected-background-color:inherit;--selected-color:inherit}:host([data-dragging]){position:relative}:host([data-dragging=inside]){background-color:var(--cx-color-primary-400)}:host([data-dragging=before]):before{content:"";border-top:var(--cx-spacing-2x-small) solid var(--cx-color-primary-400);width:100%;position:absolute;top:0;left:0}:host([data-dragging=after]):before{content:"";border-bottom:var(--cx-spacing-2x-small) solid var(--cx-color-primary-400);width:100%;position:absolute;bottom:0;left:0}`, k = "tree-sortable", w = 0.2, O = (e) => e == null;
+const de = H`:host{--selected-color:var(--cx-color-primary-600);--selected-background-color:var(--cx-color-primary-50);--hover-background-color:var(--cx-menu-item-background-color-hover);--active-background-color:var(--cx-color-neutral-200);--item-padding:var(--cx-spacing-2x-small) var(--cx-spacing-x-small);outline:0;display:block}:host(:focus-visible) .tree-item{outline:var(--cx-focus-ring);outline-offset:calc(-1 * var(--cx-focus-ring-width))}[hidden]{display:none!important}slot:not([name])::slotted(cx-icon){margin-inline-end:var(--cx-spacing-x-small)}.tree-item{color:var(--cx-color-neutral);cursor:pointer;-webkit-user-select:none;user-select:none;flex-direction:column;align-items:stretch;display:flex;position:relative}.tree-item__checkbox{margin-inline-end:var(--cx-spacing-x-small)}.tree-item__expand-button,.tree-item__checkbox,.tree-item__label{font-family:var(--cx-font-sans);font-size:var(--cx-tree-item-font-size,var(--cx-font-size-small));font-weight:var(--cx-tree-item-font-weight,var(--cx-font-weight-medium));line-height:var(--cx-tree-item-line-height,var(--cx-line-height-large));letter-spacing:var(--cx-tree-item-letter-spacing,var(--cx-letter-spacing-normal))}.tree-item__checkbox::part(base){align-items:center;display:flex}.tree-item__checkbox::part(label){margin-inline-start:0}.tree-item__indentation{flex-shrink:0;width:1em;display:block}.tree-item__expand-spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.tree-item__expand-button{box-sizing:content-box;color:var(--cx-color-neutral-500);cursor:pointer;min-width:max(1em,1rem);min-height:max(1em,1rem);transition:var(--cx-transition-medium) rotate ease;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.tree-item--expanded .tree-item__expand-button{rotate:90deg}.tree-item--expanded.tree-item--rtl .tree-item__expand-button{rotate:-90deg}.tree-item--expanded slot[name=expand-icon],.tree-item:not(.tree-item--expanded) slot[name=collapse-icon]{display:none}:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__item .tree-item__expand-icon-slot{color:var(--selected-color)}.tree-item:not(.tree-item--has-expand-button) .tree-item__expand-icon-slot{visibility:hidden;opacity:0;pointer-events:none}.tree-item__expand-button--visible{cursor:pointer}.tree-item__item{border-radius:var(--cx-border-radius-large);padding:var(--item-padding,var(--cx-spacing-x-small) var(--cx-spacing-small));transition:var(--cx-transition-x-fast) background-color ease;align-items:center;display:flex}.tree-item__item:hover{background-color:var(--hover-background-color)}.tree-item__item:active{background-color:var(--active-background-color)}.tree-item--disabled .tree-item__item{opacity:.5;cursor:default;outline:none}:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__item{background-color:var(--selected-background-color);color:var(--selected-color)}:host(:not([aria-disabled=true])) .tree-item__expand-button{color:var(--cx-color-neutral)}:host(:not([aria-disabled=true])) .tree-item--selected,:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__expand-button,:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__actions::slotted(cx-icon-button){color:var(--cx-color-neutral-0)}:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__actions::slotted(cx-icon-button){--hover-background-color:var(--cx-color-neutral-0)}.tree-item__label{align-items:center;display:flex}.tree-item__actions{font-size:var(--cx-font-size-medium);align-items:center;width:fit-content;margin-inline-start:auto;display:flex}.tree-item__actions::slotted(*){visibility:hidden;opacity:0;transition:var(--cx-transition-x-fast) visibility, var(--cx-transition-x-fast) opacity ease}.tree-item__item:hover .tree-item__actions::slotted(*){visibility:visible;opacity:1}@supports not (overlay:auto){.tree-item__actions::slotted(cx-dropdown[open]){visibility:visible;opacity:1}}.tree-item__children{font-size:calc(1em + var(--indent-size,var(--cx-spacing-medium)));gap:var(--children-gap,0);flex-direction:column;display:flex}@media (forced-colors:active){:host(:not([aria-disabled=true])) .tree-item--selected .tree-item__item{outline:1px dashed selecteditem}}::slotted(cx-tree-item){--hover-background-color:inherit;--active-background-color:inherit;--selected-background-color:inherit;--selected-color:inherit}:host([data-dragging]){position:relative}:host([data-dragging=inside]){background-color:var(--cx-color-primary-400)}:host([data-dragging=before]):before{content:"";border-top:var(--cx-spacing-2x-small) solid var(--cx-color-primary-400);width:100%;position:absolute;top:0;left:0}:host([data-dragging=after]):before{content:"";border-bottom:var(--cx-spacing-2x-small) solid var(--cx-color-primary-400);width:100%;position:absolute;bottom:0;left:0}`, k = "tree-sortable", I = 0.2, O = (e) => e == null;
 function ce() {
   function e() {
   }
@@ -72,8 +72,8 @@ function ce() {
     dragOverValid({
       activeSortable: i,
       cancel: n,
-      changed: r,
-      completed: a,
+      changed: s,
+      completed: o,
       dragEl: d,
       originalEvent: m,
       putSortable: g,
@@ -88,17 +88,17 @@ function ce() {
         n();
         return;
       }
-      const T = B.getBoundingClientRect(), L = (m.clientY - T.top) / T.height, _ = g || this.sortable;
+      const T = B.getBoundingClientRect(), D = (m.clientY - T.top) / T.height, _ = g || this.sortable;
       _.captureAnimationState(), _ !== i && i.captureAnimationState();
       const V = u.parentNode;
       if (d && V)
-        if (L < i.options.insertBeforeZonePercentage)
+        if (D < i.options.insertBeforeZonePercentage)
           t = {
             dragEl: d,
             el: u,
             position: -1
           }, u.setAttribute("data-dragging", "before");
-        else if (L > i.options.insertAfterZonePercentage)
+        else if (D > i.options.insertAfterZonePercentage)
           t = {
             dragEl: d,
             el: u,
@@ -106,7 +106,7 @@ function ce() {
           }, u.setAttribute("data-dragging", "after");
         else {
           if (u.hasAttribute("no-drag-inside")) {
-            r(), a(!0), n();
+            s(), o(!0), n();
             return;
           }
           t = {
@@ -116,7 +116,7 @@ function ce() {
           }, u.setAttribute("data-dragging", "inside");
         }
       if (_.animateAll(), _ !== i && i.animateAll(), t)
-        r(), a(!0), n();
+        s(), o(!0), n();
       else
         return !0;
     },
@@ -124,7 +124,7 @@ function ce() {
       cancel: i,
       dragEl: n
     }) {
-      if (n && !o.isTreeItem(n)) {
+      if (n && !a.isTreeItem(n)) {
         i();
         return;
       }
@@ -156,8 +156,8 @@ const j = (e) => ({
   fallbackOnBody: !0,
   forceFallback: te(),
   getDropZone: (t) => t?.shadowRoot?.querySelector(".tree-item__item"),
-  insertAfterZonePercentage: 1 - w,
-  insertBeforeZonePercentage: w,
+  insertAfterZonePercentage: 1 - I,
+  insertBeforeZonePercentage: I,
   invertSwap: !0,
   onStart(t) {
     if (e.onStart?.(t), t.item.tagName === "CX-TREE-ITEM") {
@@ -166,14 +166,14 @@ const j = (e) => ({
     }
   },
   [k]: !0,
-  swapThreshold: w
+  swapThreshold: I
 });
-var he = Object.defineProperty, pe = Object.getOwnPropertyDescriptor, s = (e, t, i, n) => {
-  for (var r = n > 1 ? void 0 : n ? pe(t, i) : t, a = e.length - 1, d; a >= 0; a--)
-    (d = e[a]) && (r = (n ? d(t, i, r) : d(r)) || r);
-  return n && r && he(t, i, r), r;
+var he = Object.defineProperty, pe = Object.getOwnPropertyDescriptor, r = (e, t, i, n) => {
+  for (var s = n > 1 ? void 0 : n ? pe(t, i) : t, o = e.length - 1, d; o >= 0; o--)
+    (d = e[o]) && (s = (n ? d(t, i, s) : d(s)) || s);
+  return n && s && he(t, i, s), s;
 };
-let o = class extends R {
+let a = class extends R {
   constructor() {
     super(), this.localize = new M(this), this.expanded = !1, this.selected = !1, this.disabled = !1, this.readonly = !1, this.lazy = !1, this.href = "", this.rel = "noreferrer noopener", this.itemId = "", this.sortable = !1, this.noDrag = !1, this.noSelect = !1, this.noDragInside = !1, this.sortableGroup = void 0, this.expandButtonPlacement = "start", this.noForwardExpandButtonPlacement = !1, this.disabledSyncCheckboxes = !1, this.partialSyncCheckboxes = !1, this.previouslySelected = !1, this.focusable = !1, this.maxLines = -1, this.indeterminate = !1, this.isLeaf = !1, this.loading = !1, this.selectable = !1, this.sortableInstance = null, this.onDragStart = (e) => {
       if (e.dataTransfer) {
@@ -207,7 +207,7 @@ let o = class extends R {
   // Checks whether the item is nested into an item
   isNestedItem() {
     const e = this.parentElement;
-    return !!e && o.isTreeItem(e);
+    return !!e && a.isTreeItem(e);
   }
   /**
    * Wait for this item to be fully updated before processing the slot change.
@@ -259,7 +259,7 @@ let o = class extends R {
     includeDisabled: e = !0
   } = {}) {
     return this.childrenSlot ? [...this.childrenSlot.assignedElements({ flatten: !0 })].filter(
-      (t) => o.isTreeItem(t) && (e || !t.disabled)
+      (t) => a.isTreeItem(t) && (e || !t.disabled)
     ) : [];
   }
   renderExpandButton() {
@@ -340,7 +340,7 @@ let o = class extends R {
           "><div class="tree-item__indentation" part="indentation"></div>${S(
       this.expandButtonPlacement === "start",
       this.renderExpandButton,
-      () => D
+      () => L
     )}
         ${S(
       this.selectable,
@@ -362,165 +362,165 @@ let o = class extends R {
     )}<slot class="tree-item__actions" part="actions" name="actions"></slot>${S(
       this.expandButtonPlacement === "end",
       this.renderExpandButton,
-      () => D
+      () => L
     )}</div><div class="tree-item__children" part="children" role="group"><slot name="children" @slotchange=${this.handleChildrenSlotChange}></slot></div>`);
   }
 };
-o.styles = [N, de];
-o.dependencies = {
+a.styles = [N, de];
+a.dependencies = {
   "cx-checkbox": Y,
   "cx-icon": J,
   "cx-line-clamp": Q,
   "cx-spinner": ee
 };
-s([
+r([
   x("slot:not([name])")
-], o.prototype, "defaultSlot", 2);
-s([
+], a.prototype, "defaultSlot", 2);
+r([
   x("slot[name=children]")
-], o.prototype, "childrenSlot", 2);
-s([
+], a.prototype, "childrenSlot", 2);
+r([
   x(".tree-item__item")
-], o.prototype, "itemElement", 2);
-s([
+], a.prototype, "itemElement", 2);
+r([
   x(".tree-item__children")
-], o.prototype, "childrenContainer", 2);
-s([
+], a.prototype, "childrenContainer", 2);
+r([
   x(".tree-item__expand-button slot")
-], o.prototype, "expandButtonSlot", 2);
-s([
+], a.prototype, "expandButtonSlot", 2);
+r([
   l({ reflect: !0, type: Boolean })
-], o.prototype, "expanded", 2);
-s([
+], a.prototype, "expanded", 2);
+r([
   l({ reflect: !0, type: Boolean })
-], o.prototype, "selected", 2);
-s([
+], a.prototype, "selected", 2);
+r([
   l({ reflect: !0, type: Boolean })
-], o.prototype, "disabled", 2);
-s([
+], a.prototype, "disabled", 2);
+r([
   l({ reflect: !0, type: Boolean })
-], o.prototype, "readonly", 2);
-s([
+], a.prototype, "readonly", 2);
+r([
   l({ reflect: !0, type: Boolean })
-], o.prototype, "lazy", 2);
-s([
+], a.prototype, "lazy", 2);
+r([
   l()
-], o.prototype, "href", 2);
-s([
+], a.prototype, "href", 2);
+r([
   l()
-], o.prototype, "target", 2);
-s([
+], a.prototype, "target", 2);
+r([
   l()
-], o.prototype, "rel", 2);
-s([
+], a.prototype, "rel", 2);
+r([
   l()
-], o.prototype, "download", 2);
-s([
+], a.prototype, "download", 2);
+r([
   l({ attribute: "itemid", reflect: !0, type: String })
-], o.prototype, "itemId", 2);
-s([
+], a.prototype, "itemId", 2);
+r([
   l({ reflect: !0, type: Boolean })
-], o.prototype, "sortable", 2);
-s([
+], a.prototype, "sortable", 2);
+r([
   l({ attribute: "no-drag", reflect: !0, type: Boolean })
-], o.prototype, "noDrag", 2);
-s([
+], a.prototype, "noDrag", 2);
+r([
   l({ attribute: "no-select", reflect: !0, type: Boolean })
-], o.prototype, "noSelect", 2);
-s([
+], a.prototype, "noSelect", 2);
+r([
   l({ attribute: "no-drag-inside", reflect: !0, type: Boolean })
-], o.prototype, "noDragInside", 2);
-s([
+], a.prototype, "noDragInside", 2);
+r([
   l({ attribute: "sortable-group", type: String })
-], o.prototype, "sortableGroup", 2);
-s([
+], a.prototype, "sortableGroup", 2);
+r([
   l({
     attribute: "expand-button-placement",
     reflect: !0,
     type: String
   })
-], o.prototype, "expandButtonPlacement", 2);
-s([
+], a.prototype, "expandButtonPlacement", 2);
+r([
   l({ attribute: "no-forward-expand-button-placement", type: Boolean })
-], o.prototype, "noForwardExpandButtonPlacement", 2);
-s([
+], a.prototype, "noForwardExpandButtonPlacement", 2);
+r([
   l({
     attribute: "disabled-sync-checkboxes",
     reflect: !0,
     type: Boolean
   })
-], o.prototype, "disabledSyncCheckboxes", 2);
-s([
+], a.prototype, "disabledSyncCheckboxes", 2);
+r([
   l({
     attribute: "partial-sync-checkboxes",
     reflect: !0,
     type: Boolean
   })
-], o.prototype, "partialSyncCheckboxes", 2);
-s([
+], a.prototype, "partialSyncCheckboxes", 2);
+r([
   l({ attribute: "previously-selected", reflect: !0, type: Boolean })
-], o.prototype, "previouslySelected", 2);
-s([
+], a.prototype, "previouslySelected", 2);
+r([
   l({ reflect: !0, type: Boolean })
-], o.prototype, "focusable", 2);
-s([
+], a.prototype, "focusable", 2);
+r([
   l({ attribute: "max-lines", type: Number })
-], o.prototype, "maxLines", 2);
-s([
+], a.prototype, "maxLines", 2);
+r([
   y()
-], o.prototype, "indeterminate", 2);
-s([
+], a.prototype, "indeterminate", 2);
+r([
   y()
-], o.prototype, "isLeaf", 2);
-s([
+], a.prototype, "isLeaf", 2);
+r([
   y()
-], o.prototype, "loading", 2);
-s([
+], a.prototype, "loading", 2);
+r([
   y()
-], o.prototype, "selectable", 2);
-s([
+], a.prototype, "selectable", 2);
+r([
   y()
-], o.prototype, "sortableInstance", 2);
-s([
+], a.prototype, "sortableInstance", 2);
+r([
   f("loading", { waitUntilFirstUpdate: !0 })
-], o.prototype, "handleLoadingChange", 1);
-s([
+], a.prototype, "handleLoadingChange", 1);
+r([
   f("disabled")
-], o.prototype, "handleDisabledChange", 1);
-s([
+], a.prototype, "handleDisabledChange", 1);
+r([
   f("selected")
-], o.prototype, "handleSelectedChange", 1);
-s([
+], a.prototype, "handleSelectedChange", 1);
+r([
   f("expanded", { waitUntilFirstUpdate: !0 })
-], o.prototype, "handleExpandedChange", 1);
-s([
+], a.prototype, "handleExpandedChange", 1);
+r([
   f("expanded", { waitUntilFirstUpdate: !0 })
-], o.prototype, "handleExpandAnimation", 1);
-s([
+], a.prototype, "handleExpandAnimation", 1);
+r([
   f("lazy", { waitUntilFirstUpdate: !0 })
-], o.prototype, "handleLazyChange", 1);
-o = s([
+], a.prototype, "handleLazyChange", 1);
+a = r([
   G("cx-tree-item")
-], o);
-H("tree-item.expand", {
+], a);
+Z("tree-item.expand", {
   keyframes: [
     { height: "0", opacity: "0", overflow: "hidden" },
     { height: "auto", opacity: "1", overflow: "hidden" }
   ],
   options: { duration: 250, easing: "cubic-bezier(0.4, 0.0, 0.2, 1)" }
 });
-H("tree-item.collapse", {
+Z("tree-item.collapse", {
   keyframes: [
     { height: "auto", opacity: "1", overflow: "hidden" },
     { height: "0", opacity: "0", overflow: "hidden" }
   ],
   options: { duration: 200, easing: "cubic-bezier(0.4, 0.0, 0.2, 1)" }
 });
-const ue = Z`:host{--indent-guide-color:var(--cx-color-neutral-200);--indent-guide-offset:0;--indent-guide-style:solid;--indent-guide-width:0;--indent-size:var(--cx-spacing-large);font-size:0;display:block}:host::part(children){gap:var(--children-gap,0);flex-direction:column;display:flex}:host([dragging]) ::slotted(cx-tree-item){--hover-background-color:transparent!important;--active-background-color:transparent!important;--selected-background-color:transparent!important}`;
+const ue = H`:host{--indent-guide-color:var(--cx-color-neutral-200);--indent-guide-offset:0;--indent-guide-style:solid;--indent-guide-width:0;--indent-size:var(--cx-spacing-large);font-size:0;display:block}:host::part(children){gap:var(--children-gap,0);flex-direction:column;display:flex}:host([dragging]) ::slotted(cx-tree-item){--hover-background-color:transparent!important;--active-background-color:transparent!important;--selected-background-color:transparent!important}`;
 var me = Object.defineProperty, be = Object.getOwnPropertyDescriptor, h = (e, t, i, n) => {
-  for (var r = n > 1 ? void 0 : n ? be(t, i) : t, a = e.length - 1, d; a >= 0; a--)
-    (d = e[a]) && (r = (n ? d(t, i, r) : d(r)) || r);
-  return n && r && me(t, i, r), r;
+  for (var s = n > 1 ? void 0 : n ? be(t, i) : t, o = e.length - 1, d; o >= 0; o--)
+    (d = e[o]) && (s = (n ? d(t, i, s) : d(s)) || s);
+  return n && s && me(t, i, s), s;
 };
 function q(e) {
   const t = e.getChildrenItems({ includeDisabled: !1 });
@@ -528,33 +528,33 @@ function q(e) {
     const i = t.every((d) => d.selected), n = t.every(
       (d) => !d.selected && !d.indeterminate
     );
-    let r = !1, a = !1;
-    (!i && !n || e.partialSyncCheckboxes && (i || n && e.previouslySelected)) && (r = !0), e.partialSyncCheckboxes ? a = i && !r : a = i, e.indeterminate = r, e.selected = a;
+    let s = !1, o = !1;
+    (!i && !n || e.partialSyncCheckboxes && (i || n && e.previouslySelected)) && (s = !0), e.partialSyncCheckboxes ? o = i && !s : o = i, e.indeterminate = s, e.selected = o;
   }
 }
 function X(e, t = "single") {
   const i = e.parentElement;
-  o.isTreeItem(i) && !i.disabledSyncCheckboxes && t === "multiple" && (q(i), X(i, t));
+  a.isTreeItem(i) && !i.disabledSyncCheckboxes && t === "multiple" && (q(i), X(i, t));
 }
 function A(e, t = !1, i = "single") {
-  function n(r) {
-    if (!(!(r instanceof o) && r.getAttribute("role") !== "treeitem")) {
-      for (const a of r.getChildrenItems())
-        a.selected = t ? r.selected || a.selected : !a.disabled && !a.readonly && r.selected, n(a);
-      t && q(r);
+  function n(s) {
+    if (!(!(s instanceof a) && s.getAttribute("role") !== "treeitem")) {
+      for (const o of s.getChildrenItems())
+        o.selected = t ? s.selected || o.selected : !o.disabled && !o.readonly && s.selected, n(o);
+      t && q(s);
     }
   }
   !e.disabledSyncCheckboxes && i === "multiple" && (e.partialSyncCheckboxes && (e.selected ? e.previouslySelected = !0 : e.previouslySelected = !1), n(e)), X(e, i);
 }
 let c = class extends R {
   constructor() {
-    super(), this.sortable = !1, this.sortableGroup = null, this.disabledSortableGroup = !1, this.selection = "single", this.disabledAutoExpand = !1, this.autoExpandToSelected = !1, this.expandButtonPlacement = "start", this.noForwardExpandButtonPlacement = !1, this.forceOnChange = !1, this.labelSelectSingle = !1, this.noDragInside = !1, this.focusable = !1, this.clickTarget = null, this.localize = new M(this), this.sortableInstance = null, this.handleSortableUpdate = this.handleSortableUpdate.bind(this), this.handleSortableStart = this.handleSortableStart.bind(this), this.handleSortableEnd = this.handleSortableEnd.bind(this), this.handleFocusIn = this.handleFocusIn.bind(this), this.handleFocusOut = this.handleFocusOut.bind(this), this.handleSlotChange = this.handleSlotChange.bind(this), this.handleTreeChanged = this.handleTreeChanged.bind(this), this.initTreeItem = this.initTreeItem.bind(this);
+    super(), this.sortable = !1, this.sortableGroup = null, this.disabledSortableGroup = !1, this.selection = "single", this.disabledAutoExpand = !1, this.autoExpandToSelected = !1, this.expandButtonPlacement = "start", this.noForwardExpandButtonPlacement = !1, this.forceOnChange = !1, this.labelSelectSingle = !1, this.noDragInside = !1, this.focusable = !1, this.clickTarget = null, this.localize = new M(this), this.sortableInstance = null, this.handleSortableUpdate = this.handleSortableUpdate.bind(this), this.handleSortableStart = this.handleSortableStart.bind(this), this.handleSortableEnd = this.handleSortableEnd.bind(this), this.handleFocusIn = this.handleFocusIn.bind(this), this.handleFocusOut = this.handleFocusOut.bind(this), this.handleHostMouseDown = this.handleHostMouseDown.bind(this), this.handleSlotChange = this.handleSlotChange.bind(this), this.handleTreeChanged = this.handleTreeChanged.bind(this), this.initTreeItem = this.initTreeItem.bind(this);
   }
   runFirstUpdated() {
     this.setAttribute("role", "tree"), this.setAttribute("tabindex", "0");
   }
   runConnectedCallback() {
-    if (this.addEventListener("focusin", this.handleFocusIn), this.addEventListener("focusout", this.handleFocusOut), this.addEventListener("cx-lazy-change", this.handleSlotChange), this.mutationObserver = new MutationObserver(this.handleTreeChanged), this.mutationObserver.observe(this, { childList: !0, subtree: !0 }), this.autoExpandToSelected) {
+    if (this.addEventListener("focusin", this.handleFocusIn), this.addEventListener("focusout", this.handleFocusOut), this.addEventListener("mousedown", this.handleHostMouseDown), this.addEventListener("cx-lazy-change", this.handleSlotChange), this.mutationObserver = new MutationObserver(this.handleTreeChanged), this.mutationObserver.observe(this, { childList: !0, subtree: !0 }), this.autoExpandToSelected) {
       const e = ne(() => {
         customElements.whenDefined("cx-tree-item").then(() => {
           this.selectedItems.forEach((t) => {
@@ -572,7 +572,7 @@ let c = class extends R {
     this.hasUpdated && this.sortable && this.initSortable();
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this.removeEventListener("focusin", this.handleFocusIn), this.removeEventListener("focusout", this.handleFocusOut), this.removeEventListener("cx-lazy-change", this.handleSlotChange), this.mutationObserver?.disconnect(), this.autoExpandObserver?.disconnect(), this.destroySortable();
+    super.disconnectedCallback(), this.removeEventListener("focusin", this.handleFocusIn), this.removeEventListener("focusout", this.handleFocusOut), this.removeEventListener("mousedown", this.handleHostMouseDown), this.removeEventListener("cx-lazy-change", this.handleSlotChange), this.mutationObserver?.disconnect(), this.autoExpandObserver?.disconnect(), this.destroySortable();
   }
   /**
    * Generates a clone of the expand icon element to use for each tree item
@@ -582,7 +582,7 @@ let c = class extends R {
     if (i) {
       const n = i.cloneNode(!0);
       return [n, ...n.querySelectorAll("[id]")].forEach(
-        (r) => r.removeAttribute("id")
+        (s) => s.removeAttribute("id")
       ), n.setAttribute("data-default", ""), n.slot = `${e}-icon`, n;
     }
     return null;
@@ -602,9 +602,9 @@ let c = class extends R {
   handleTreeChanged(e) {
     for (const t of e) {
       const i = [...t.addedNodes].filter(
-        o.isTreeItem
+        a.isTreeItem
       ), n = [...t.removedNodes].filter(
-        o.isTreeItem
+        a.isTreeItem
       );
       i.forEach(this.initTreeItem), this.lastFocusedItem && n.includes(this.lastFocusedItem) && (this.lastFocusedItem = null);
     }
@@ -619,18 +619,18 @@ let c = class extends R {
     const i = [...this.selectedItems], n = this.getAllTreeItems();
     if (this.selection === "multiple")
       t && await Promise.all(
-        n.map(async (a) => {
-          a.selected = !1, a.indeterminate = !1, a.previouslySelected = !1, await a.updateComplete;
+        n.map(async (o) => {
+          o.selected = !1, o.indeterminate = !1, o.previouslySelected = !1, await o.updateComplete;
         })
       ), e.selected = t || !e.selected, e.lazy && !this.disabledAutoExpand && (e.expanded = !0), A(e, !1, this.selection);
     else if ((this.selection === "single" || e.isLeaf) && !e.noSelect)
-      for (const a of n)
-        a.selected = a === e;
+      for (const o of n)
+        o.selected = o === e;
     else (this.selection === "leaf" || e.noSelect) && (e.expanded = !e.expanded);
     if (e.noSelect)
       return;
-    const r = this.selectedItems;
-    (i.length !== r.length || r.some((a) => !i.includes(a)) || this.forceOnChange || t) && Promise.all(r.map((a) => a.updateComplete)).then(() => {
+    const s = this.selectedItems;
+    (i.length !== s.length || s.some((o) => !i.includes(o)) || this.forceOnChange || t) && Promise.all(s.map((o) => o.updateComplete)).then(() => {
       this.emit("cx-selection-change", {
         /**
          * Use this.selectedItems instead of nextSelection because
@@ -646,8 +646,8 @@ let c = class extends R {
   getAllDirectTreeItems() {
     return [...this.querySelectorAll(":scope > cx-tree-item")];
   }
-  focusItem(e) {
-    e?.focus();
+  focusItem(e, t) {
+    e?.focus(t);
   }
   handleKeyDown(e) {
     if (![
@@ -660,27 +660,27 @@ let c = class extends R {
       "Enter",
       " "
     ].includes(e.key) || e.composedPath().some(
-      (r) => ["input", "textarea"].includes(
-        r?.tagName?.toLowerCase()
+      (s) => ["input", "textarea"].includes(
+        s?.tagName?.toLowerCase()
       )
     ))
       return;
     const t = this.getFocusableItems(), i = this.localize.dir() === "ltr", n = this.localize.dir() === "rtl";
     if (t.length > 0) {
       e.preventDefault();
-      const r = t.findIndex((g) => g.matches(":focus")), a = t[r], d = (g) => {
+      const s = t.findIndex((g) => g.matches(":focus")), o = t[s], d = (g) => {
         const u = t[K(g, 0, t.length - 1)];
         this.focusItem(u);
       }, m = (g) => {
-        a.expanded = g;
+        o.expanded = g;
       };
-      e.key === "ArrowDown" ? d(r + 1) : e.key === "ArrowUp" ? d(r - 1) : i && e.key === "ArrowRight" || n && e.key === "ArrowLeft" ? !a || a.disabled || a.readonly || a.expanded || a.isLeaf && !a.lazy ? d(r + 1) : m(!0) : i && e.key === "ArrowLeft" || n && e.key === "ArrowRight" ? !a || a.disabled || a.readonly || a.isLeaf || !a.expanded ? d(r - 1) : m(!1) : e.key === "Home" ? d(0) : e.key === "End" ? d(t.length - 1) : (e.key === "Enter" || e.key === " ") && !a.disabled && !a.readonly && this.selectItem(a);
+      e.key === "ArrowDown" ? d(s + 1) : e.key === "ArrowUp" ? d(s - 1) : i && e.key === "ArrowRight" || n && e.key === "ArrowLeft" ? !o || o.disabled || o.readonly || o.expanded || o.isLeaf && !o.lazy ? d(s + 1) : m(!0) : i && e.key === "ArrowLeft" || n && e.key === "ArrowRight" ? !o || o.disabled || o.readonly || o.isLeaf || !o.expanded ? d(s - 1) : m(!1) : e.key === "Home" ? d(0) : e.key === "End" ? d(t.length - 1) : (e.key === "Enter" || e.key === " ") && !o.disabled && !o.readonly && this.selectItem(o);
     }
   }
   handleClick(e) {
-    const t = e.composedPath(), i = e.target, n = i.closest("cx-tree-item"), r = e.composedPath().some(
+    const t = e.composedPath(), i = e.target, n = i.closest("cx-tree-item"), s = e.composedPath().some(
       (m) => m?.classList?.contains("tree-item__expand-button")
-    ), a = e.composedPath().some(
+    ), o = e.composedPath().some(
       (m) => m?.classList?.contains("tree-item__actions")
     );
     if (!n || n.disabled || n.readonly || i !== this.clickTarget)
@@ -688,7 +688,7 @@ let c = class extends R {
     const d = !t.find(
       (m) => m.tagName?.toLowerCase() === "cx-checkbox"
     );
-    r && n.showExpandButton ? n.expanded = !n.expanded : a || this.selectItem(
+    s && n.showExpandButton ? n.expanded = !n.expanded : o || this.selectItem(
       n,
       d && this.labelSelectSingle && this.selection === "multiple"
     );
@@ -696,13 +696,30 @@ let c = class extends R {
   handleMouseDown(e) {
     this.clickTarget = e.target;
   }
+  /**
+   * A `mousedown` whose real, non-retargeted origin (`composedPath()[0]`) is
+   * the tree host itself is only reachable by clicking the host's own
+   * scrollbar/gutter — shadow content otherwise fills the box, so a content
+   * click's real origin is always a descendant. The browser's default action
+   * for that mousedown focuses the host, and since the host is itself the
+   * scrollable element (`overflow: auto`), focusing it resets its own
+   * scrollTop natively — before any of our JS runs, so `preventScroll` on a
+   * later `this.focusItem(...)` call can't undo it. Cancel that default
+   * action outright; it doesn't affect the scrollbar's own drag/track
+   * behavior, only whether the mousedown also focuses the element.
+   */
+  handleHostMouseDown(e) {
+    e.composedPath()[0] === this && e.preventDefault();
+  }
   handleFocusOut(e) {
     const t = e.relatedTarget;
     (!t || !this.contains(t)) && (this.tabIndex = 0);
   }
   handleFocusIn(e) {
     const t = e.target;
-    e.target === this && this.focusItem(this.lastFocusedItem || this.getAllTreeItems()[0]), o.isTreeItem(t) && !t.disabled && !t.readonly && (this.lastFocusedItem && !this.focusable && (this.lastFocusedItem.tabIndex = -1), this.lastFocusedItem = t, this.tabIndex = -1, t.tabIndex = 0);
+    e.target === this && this.focusItem(this.lastFocusedItem || this.getAllTreeItems()[0], {
+      preventScroll: !0
+    }), a.isTreeItem(t) && !t.disabled && !t.readonly && (this.lastFocusedItem && !this.focusable && (this.lastFocusedItem.tabIndex = -1), this.lastFocusedItem = t, this.tabIndex = -1, t.tabIndex = 0);
   }
   expandToItem(e) {
     const t = e.parentElement?.closest("cx-tree-item");
@@ -787,7 +804,7 @@ let c = class extends R {
       if (i.disabled || i.readonly)
         return !1;
       const n = i.parentElement?.closest("[role=treeitem]");
-      return n instanceof o ? (n && (!n.expanded || n.loading || t.has(n)) && t.add(i), !t.has(i)) : !0;
+      return n instanceof a ? (n && (!n.expanded || n.loading || t.has(n)) && t.add(i), !t.has(i)) : !0;
     });
   }
   render() {
@@ -857,7 +874,7 @@ c = h([
   G("cx-tree")
 ], c);
 export {
-  o as C,
+  a as C,
   c as a,
   X as b,
   q as c,