@orangelogic/design-system 2.170.0 → 2.171.0

package/library/components/document-viewer.js

@@ -1,5 +1,5 @@
 import "../chunks/resizable-component.styles.CAfXABBc.js";
-import { C as b } from "../chunks/document-viewer.BT1kp8Ig.js";
+import { C as b } from "../chunks/document-viewer.B89YB5oo.js";
 import "../chunks/component.styles.CRO4Odto.js";
 import "../chunks/index.Cpamj0jB.js";
 import "../chunks/custom-element.L4WJXn1j.js";

package/library/components/drawer.js

@@ -3,7 +3,7 @@ import { c as z } from "../chunks/component.styles.CRO4Odto.js";
 import { a as d, s as h, w as v } from "../chunks/event.BeKOsirN.js";
 import { c as P } from "../chunks/custom-element.L4WJXn1j.js";
 import { L as D } from "../chunks/i18n.DbXTTLXx.js";
-import { M as O } from "../chunks/modal.jdGhujoh.js";
+import { M as O } from "../chunks/modal.Ct0bJBSe.js";
 import { l as w, u } from "../chunks/scroll.xtO5yojm.js";
 import { H as $ } from "../chunks/slot.j5oheLJC.js";
 import { w as C } from "../chunks/watch.DJF5K-8U.js";

package/library/components/dynamic-select.js

@@ -1,9 +1,9 @@
-import { C as g } from "../chunks/button.DDem_XZq.js";
+import { C as g } from "../chunks/button.zWaIO1sl.js";
 import { C as O } from "../chunks/icon-button.DJvfUmOl.js";
 import { C as p, a as $ } from "../chunks/option.Bvyag0r1.js";
 import C from "./select.js";
-import { n as i, C as x } from "../chunks/lib-cortex-element.CVMmyPMC.js";
-import { c as v } from "../chunks/custom-element.L4WJXn1j.js";
+import { n as i, C as v } from "../chunks/lib-cortex-element.CVMmyPMC.js";
+import { c as x } from "../chunks/custom-element.L4WJXn1j.js";
 import { d as w } from "../chunks/debounce.DaHuiSGU.js";
 import { L as S } from "../chunks/i18n.DbXTTLXx.js";
 import { w as c } from "../chunks/watch.DJF5K-8U.js";
@@ -12,40 +12,40 @@ import { r as h } from "../chunks/state.CSDxrqLd.js";
 import { e as E } from "../chunks/query.BBf1UFkC.js";
 import { e as B } from "../chunks/class-map.BiVq-cVR.js";
 import { o as m } from "../chunks/if-defined.BRoBj_Rp.js";
-import { i as T } from "../chunks/keyed.DdOUTIg-.js";
+import { i as F } from "../chunks/keyed.DdOUTIg-.js";
 import { o as b } from "../chunks/map.D8heArFD.js";
 import { c as y } from "../chunks/repeat.CFjcER6_.js";
-import { o as D } from "../chunks/style-map.llVFPd__.js";
+import { o as T } from "../chunks/style-map.llVFPd__.js";
 import { n as f } from "../chunks/when.Dr1es41R.js";
-import { b as _ } from "../chunks/_baseIteratee.sC2wLi2m.js";
+import { b as D } from "../chunks/_baseIteratee.sC2wLi2m.js";
 import { b as V } from "../chunks/_baseUniq.lwMgmtt2.js";
-function z(t, s) {
-  return t && t.length ? V(t, _(s)) : [];
+function _(t, l) {
+  return t && t.length ? V(t, D(l)) : [];
 }
-var L = Object.defineProperty, F = Object.getOwnPropertyDescriptor, o = (t, s, l, a) => {
-  for (var n = a > 1 ? void 0 : a ? F(s, l) : s, u = t.length - 1, d; u >= 0; u--)
-    (d = t[u]) && (n = (a ? d(s, l, n) : d(n)) || n);
-  return a && n && L(s, l, n), n;
+var z = Object.defineProperty, L = Object.getOwnPropertyDescriptor, o = (t, l, s, a) => {
+  for (var n = a > 1 ? void 0 : a ? L(l, s) : l, u = t.length - 1, d; u >= 0; u--)
+    (d = t[u]) && (n = (a ? d(l, s, n) : d(n)) || n);
+  return a && n && z(l, s, n), n;
 };
-let e = class extends x {
+let e = class extends v {
   constructor() {
-    super(...arguments), this.localize = new S(this), this.name = "", this.value = "", this.size = "medium", this.placeholder = "", this.allowFreetext = !1, this.multiple = !1, this.maxOptionsVisible = 3, this.disabled = !1, this.clearable = !1, this.open = !1, this.hoist = !1, this.freeWidth = !1, this.autosizePadding = 10, this.filled = !1, this.pill = !1, this.label = "", this.placement = "bottom", this.helpText = "", this.form = "", this.required = !1, this.useTag = !1, this.inputBehavior = "filter", this.getOptionValue = (t) => !t || !(t instanceof p) ? "" : typeof t.value == "string" ? t.value : "", this.setOptionCurrent = (t, s) => {
+    super(...arguments), this.localize = new S(this), this.name = "", this.value = "", this.size = "medium", this.placeholder = "", this.allowFreetext = !1, this.multiple = !1, this.maxOptionsVisible = 3, this.disabled = !1, this.clearable = !1, this.open = !1, this.hoist = !1, this.freeWidth = !1, this.autosizePadding = 10, this.filled = !1, this.pill = !1, this.label = "", this.placement = "bottom", this.helpText = "", this.form = "", this.required = !1, this.useTag = !1, this.inputBehavior = "filter", this.getOptionValue = (t) => !t || !(t instanceof p) ? "" : typeof t.value == "string" ? t.value : "", this.setOptionCurrent = (t, l) => {
       if (t instanceof p) {
-        if (s === void 0) {
+        if (l === void 0) {
           t.current = !t.current;
           return;
         }
-        t.current = s;
+        t.current = l;
       }
-    }, this.setOptionSelected = (t, s) => {
+    }, this.setOptionSelected = (t, l) => {
       if (!(!(t instanceof p) || t.getAttribute("role") !== "option")) {
-        if (s === void 0) {
+        if (l === void 0) {
           t.selected = !t.selected;
           return;
         }
-        t.selected = s, s && this.selectEl.setCurrentOption(t);
+        t.selected = l, l && this.selectEl.setCurrentOption(t);
       }
-    }, this.stayOpenOnSelect = !1, this.closeOnSelect = !1, this.forceOnChange = !1, this.allowDefaultMouseDown = !1, this.columns = [], this.useSearchTerm = !1, this.noSelectOnEnter = !1, this.noResetCurrent = !1, this.iconName = "", this.noDropdown = !1, this.noDropdownOnEmpty = !1, this.noFlip = !1, this.customChangeEvent = "", this.options = [], this.start = 0, this.searchTerm = "", this.hasMore = !1, this.loading = !1;
+    }, this.stayOpenOnSelect = !1, this.closeOnSelect = !1, this.forceOnChange = !1, this.allowDefaultMouseDown = !1, this.columns = [], this.useSearchTerm = !1, this.noSelectOnEnter = !1, this.noResetCurrent = !1, this.iconName = "", this.noDropdown = !1, this.noDropdownOnEmpty = !1, this.noFlip = !1, this.customChangeEvent = "", this.autoFallbackFirstOption = !1, this.options = [], this.start = 0, this.searchTerm = "", this.hasMore = !1, this.loading = !1;
   }
   createRenderRoot() {
     return this;
@@ -54,13 +54,13 @@ let e = class extends x {
     if (this.api)
       try {
         this.loading = !0;
-        const s = await this.api({
+        const l = await this.api({
           searchTerm: this.searchTerm,
           start: this.start
         });
-        if (t ? this.options = s.data : this.options = z([...this.options, ...s.data], "value"), this.hasMore = s.hasMore, await this.updateComplete, this.selectEl) {
-          let l;
-          this.multiple ? l = this.value?.trim() ? this.value.trim().split(/\s+/) : [] : l = this.value, this.selectEl.value = l;
+        if (t ? this.options = l.data : this.options = _([...this.options, ...l.data], "value"), this.hasMore = l.hasMore, await this.updateComplete, this.selectEl) {
+          let s, a = !1;
+          this.multiple ? s = this.value?.trim() ? this.value.trim().split(/\s+/) : [] : (s = this.getFallbackValue(), a = s !== this.value), this.selectEl.value = s, a && this.selectEl.emit("cx-change");
         }
       } catch {
         this.options = [];
@@ -80,12 +80,12 @@ let e = class extends x {
   tableGetOptionValue(t) {
     return t?.getAttribute("data-value") ?? "";
   }
-  tableSetOptionSelected(t, s) {
-    const l = s ?? !t?.hasAttribute("selected");
-    t?.toggleAttribute("selected", l), t?.setAttribute("aria-selected", String(l));
+  tableSetOptionSelected(t, l) {
+    const s = l ?? !t?.hasAttribute("selected");
+    t?.toggleAttribute("selected", s), t?.setAttribute("aria-selected", String(s));
   }
-  tableSetOptionCurrent(t, s) {
-    t?.toggleAttribute("current", s ?? !t?.hasAttribute("current"));
+  tableSetOptionCurrent(t, l) {
+    t?.toggleAttribute("current", l ?? !t?.hasAttribute("current"));
   }
   tableGetOptionLabel(t) {
     return t?.querySelector("td")?.textContent?.trim() ?? "";
@@ -96,26 +96,31 @@ let e = class extends x {
   tableGetOptionDisabled(t) {
     return t?.hasAttribute("disabled") ?? !1;
   }
-  tableFilterCallback(t, s) {
-    const l = s.toLowerCase();
+  tableFilterCallback(t, l) {
+    const s = l.toLowerCase();
     return [...t?.querySelectorAll("td") || []].some(
-      (a) => a.textContent?.toLowerCase().includes(l)
+      (a) => a.textContent?.toLowerCase().includes(s)
     );
   }
-  getCellValue(t, s) {
-    if (s in t) {
-      const l = t[s];
-      return l == null ? "" : String(l);
+  getCellValue(t, l) {
+    if (l in t) {
+      const s = t[l];
+      return s == null ? "" : String(s);
     }
-    return t.extra?.[s] ?? "";
+    return t.extra?.[l] ?? "";
   }
   getColWidth(t) {
-    const s = this.columns.reduce((l, a) => l + (a.flex ?? 1), 0);
-    return `${((t.flex ?? 1) / s * 100).toFixed(1)}%`;
+    const l = this.columns.reduce((s, a) => s + (a.flex ?? 1), 0);
+    return `${((t.flex ?? 1) / l * 100).toFixed(1)}%`;
+  }
+  getFallbackValue() {
+    return this.autoFallbackFirstOption ? this.options.some(
+      (l) => l.value === this.value
+    ) ? this.value : this.options[0]?.value ?? "" : this.value;
   }
   handleInputChange(t) {
-    const { value: s } = t.target.displayInput;
-    this.searchTerm = s, this.selectEl.getOptionLabel = (l) => !l || !(l instanceof p) ? s : l.getTextLabel() || s;
+    const { value: l } = t.target.displayInput;
+    this.searchTerm = l, this.selectEl.getOptionLabel = (s) => !s || !(s instanceof p) ? l : s.getTextLabel() || l;
   }
   handleLoadMore() {
     this.start += 10;
@@ -123,40 +128,40 @@ let e = class extends x {
   handleCustomChange(t) {
     if (!t.target)
       return;
-    const s = t.target, l = this.options.find(
-      (a) => a.value === s.value
+    const l = t.target, s = this.options.find(
+      (a) => a.value === l.value
     );
-    l && this.emit(this.customChangeEvent, {
-      detail: l
+    s && this.emit(this.customChangeEvent, {
+      detail: s
     });
   }
   renderTableOptions() {
     return r`<table class="table-select__table"><thead class="table-select__thead"><tr>${b(
       this.columns,
-      (t) => r`<th class="table-select__th" style=${D({ width: this.getColWidth(t) })}>${t.header}</th>`
+      (t) => r`<th class="table-select__th" style=${T({ width: this.getColWidth(t) })}>${t.header}</th>`
     )}</tr></thead>${y(
       this.options,
       (t) => t.value ?? "",
       (t) => r`<tr role="option" aria-selected="false" aria-disabled=${t.disabled ? "true" : "false"} data-value=${t.value ?? ""} ?disabled=${t.disabled ?? !1}>${b(
         this.columns,
-        (s) => r`<td class="table-select__td">${this.getCellValue(t, s.field)}</td>`
+        (l) => r`<td class="table-select__td">${this.getCellValue(t, l.field)}</td>`
       )}</tr>`
     )}</table>`;
   }
   render() {
-    const t = this.noDropdown || this.noDropdownOnEmpty && !this.options.length, s = this.columns.length > 0;
-    return T(s, r`<cx-select auto-size-padding=${this.autosizePadding} class=${B({
+    const t = this.noDropdown || this.noDropdownOnEmpty && !this.options.length, l = this.columns.length > 0;
+    return F(l, r`<cx-select auto-size-padding=${this.autosizePadding} class=${B({
       "dynamic-select": !0,
-      "table-select": s
+      "table-select": l
     })} data-id=${m(this.dataset.id || void 0)} data-label=${m(this.dataset.label || void 0)} form=${this.form} help-text=${this.helpText} input-behavior=${this.inputBehavior} label=${this.label} max-options-visible=${this.maxOptionsVisible} name=${this.name} placeholder=${this.placeholder} placement=${this.placement} size=${this.size} value=${this.value} .syncElement=${this.syncElement} ?allow-default-mouse-down=${this.allowDefaultMouseDown} ?allow-freetext=${this.allowFreetext} ?clearable=${this.clearable} ?close-on-select=${this.closeOnSelect} ?disabled=${this.disabled} ?filled=${this.filled} ?force-on-change=${this.forceOnChange} ?free-width=${this.freeWidth} ?hoist=${this.hoist} ?loading=${this.loading} ?multiple=${this.multiple} ?no-dropdown=${t} ?no-flip=${this.noFlip} ?no-reset-current=${this.noResetCurrent} ?no-select-on-enter=${this.noSelectOnEnter} ?open=${this.open} ?pill=${this.pill} ?required=${this.required} ?stay-open-on-select=${this.stayOpenOnSelect} ?use-tag=${this.useTag} @cx-change=${this.customChangeEvent ? this.handleCustomChange : void 0} @input=${this.useSearchTerm ? this.handleInputChange : void 0}>${f(this.iconName, () => r`<cx-icon-button class="icon-button" tabindex="-1" label=${this.localize.term("search")} name=${this.iconName} slot="prefix"></cx-icon-button>`)}
       ${f(
-      s,
+      l,
       () => this.renderTableOptions(),
       () => r`
           ${y(
         this.options,
-        (l) => l.value ?? "",
-        (l) => r`<cx-option value=${l.value ?? ""} ?disabled=${l.disabled} show-check check-placement=${$.Right}>${l.label ?? l.value ?? ""}</cx-option>`
+        (s) => s.value ?? "",
+        (s) => r`<cx-option value=${s.value ?? ""} ?disabled=${s.disabled} show-check check-placement=${$.Right}>${s.label ?? s.value ?? ""}</cx-option>`
       )}
           ${f(
         this.hasMore,
@@ -314,6 +319,9 @@ o([
 o([
   i({ attribute: "custom-change-event", type: String })
 ], e.prototype, "customChangeEvent", 2);
+o([
+  i({ attribute: "auto-fallback-first-option", reflect: !0, type: Boolean })
+], e.prototype, "autoFallbackFirstOption", 2);
 o([
   h()
 ], e.prototype, "options", 2);
@@ -343,7 +351,7 @@ o([
   c("columns")
 ], e.prototype, "handleColumnsChange", 1);
 e = o([
-  v("cx-dynamic-select")
+  x("cx-dynamic-select")
 ], e);
 export {
   e as default

package/library/components/element-clamp.js

@@ -9,7 +9,7 @@ import { r as k } from "../chunks/state.CSDxrqLd.js";
 import { e as E } from "../chunks/query.BBf1UFkC.js";
 import { e as H } from "../chunks/class-map.BiVq-cVR.js";
 import { a as p, g } from "../chunks/animation-registry.HmpwNuGH.js";
-import { C as B } from "../chunks/button.DDem_XZq.js";
+import { C as B } from "../chunks/button.zWaIO1sl.js";
 const T = C`:host{--toggler-color:var(--cx-color-primary);display:block;overflow:hidden}.element-clamp{overflow-anchor:none}.element-clamp--disabled{opacity:.5}.element-clamp-icon{transition:var(--cx-transition-medium) rotate ease;flex:none;align-items:center;display:flex}.details--open .element-clamp-icon{rotate:90deg}.details--open.details--rtl .element-clamp-icon{rotate:-90deg}.element-clamp--open slot[name=expand-icon],.element-clamp:not(.element-clamp--open) slot[name=collapse-icon]{display:none}.element-clamp__content{display:block;overflow:hidden}.toggler{margin-top:var(--cx-spacing-2x-small);display:block}.toggler::part(base){color:var(--toggler-color);font-weight:var(--cx-font-weight-medium);text-transform:none;width:auto}.toggler::part(label){padding-left:0}`;
 var z = Object.defineProperty, O = Object.getOwnPropertyDescriptor, n = (e, t, i, r) => {
   for (var s = r > 1 ? void 0 : r ? O(t, i) : t, h = e.length - 1, l; h >= 0; h--)

package/library/components/file-on-demand.js

@@ -16,8 +16,8 @@ import { n as p } from "../chunks/when.Dr1es41R.js";
 import { b as At } from "../chunks/_baseEach.DQk0As2f.js";
 import { b as Dt } from "../chunks/_baseIteratee.sC2wLi2m.js";
 import Tt from "./avatar.js";
-import { C as zt } from "../chunks/button.DDem_XZq.js";
-import { C as Pt } from "../chunks/dialog.B_v8598F.js";
+import { C as zt } from "../chunks/button.zWaIO1sl.js";
+import { C as Pt } from "../chunks/dialog.BaHYOyYO.js";
 import Et from "./divider.js";
 import nt from "./format-bytes.js";
 import { C as vt } from "../chunks/icon-button.DJvfUmOl.js";
@@ -27,11 +27,11 @@ import yt from "./relative-time.js";
 import Ft from "./select.js";
 import Rt from "./space.js";
 import kt from "./tab.js";
-import { C as Ot } from "../chunks/tab-group.BdWDbwBy.js";
+import { C as Ot } from "../chunks/tab-group.C_n0GEc_.js";
 import Nt from "./tab-panel.js";
 import bt from "./tooltip.js";
 import { C as rt } from "../chunks/typography.IqHbnd3C.js";
-import { C as jt } from "../chunks/confirm-popover.Cx6BUoTL.js";
+import { C as jt } from "../chunks/confirm-popover.hHcCIzpX.js";
 import { d as Bt } from "../chunks/debounce.DaHuiSGU.js";
 import { c as Z } from "../chunks/number.Cx2ncfJJ.js";
 import { i as X, b as pt } from "../chunks/url.Bd5rq4G0.js";

package/library/components/folder-select.js

@@ -5,7 +5,7 @@ import "./select.js";
 import "./tag.js";
 import "../chunks/tree.B0-6Ny9b.js";
 import "../chunks/lib-cortex-element.CVMmyPMC.js";
-import { C as j } from "../chunks/folder-select.B9qqU1CQ.js";
+import { C as j } from "../chunks/folder-select.C6Sv4jtu.js";
 import "../chunks/component.styles.CRO4Odto.js";
 import "../chunks/custom-element.L4WJXn1j.js";
 import "../chunks/i18n.DbXTTLXx.js";

package/library/components/line-clamp.js

@@ -1,4 +1,4 @@
-import "../chunks/button.DDem_XZq.js";
+import "../chunks/button.zWaIO1sl.js";
 import "./tooltip.js";
 import "./resize-observer.js";
 import { n as s, C as b } from "../chunks/lib-cortex-element.CVMmyPMC.js";

package/library/components/molecules.js

@@ -1,11 +1,11 @@
 import { default as e } from "./bicolor-picker.js";
 import { default as a } from "./border-input-group.js";
 import { C as x } from "../chunks/color-swatch.DpzAGKQx.js";
-import { C as u } from "../chunks/confirm-popover.Cx6BUoTL.js";
+import { C as u } from "../chunks/confirm-popover.hHcCIzpX.js";
 import { default as d } from "./corner-position-input-group.js";
 import { default as l } from "./cropper.js";
 import { default as i } from "./dynamic-select.js";
-import { C as c } from "../chunks/folder-select.B9qqU1CQ.js";
+import { C as c } from "../chunks/folder-select.C6Sv4jtu.js";
 import { default as P } from "./masonry.js";
 import { default as I } from "./padding-input-group.js";
 import { default as y } from "./position-picker.js";

package/library/components/organisms.js

@@ -1,5 +1,5 @@
-import { C as a } from "../chunks/asset-link-format.BSo7khRt.js";
-import { C as t } from "../chunks/color-swatch-group.C_PwK2oY.js";
+import { C as a } from "../chunks/asset-link-format.BATKDRgD.js";
+import { C as t } from "../chunks/color-swatch-group.CQlgq_I5.js";
 import { default as C } from "./file-on-demand.js";
 export {
   a as CxAssetLinkFormat,

package/library/components/pagination.js

@@ -1,7 +1,7 @@
 import "./space.js";
 import "../chunks/lib-cortex-element.CVMmyPMC.js";
 import "../chunks/icon-button.DJvfUmOl.js";
-import { C as k } from "../chunks/pagination.TxcRv9BL.js";
+import { C as k } from "../chunks/pagination.CwKlKOek.js";
 import "../chunks/custom-element.L4WJXn1j.js";
 import "../chunks/i18n.DbXTTLXx.js";
 import "../chunks/math.DuKzLacZ.js";
@@ -11,7 +11,7 @@ import "../chunks/state.CSDxrqLd.js";
 import "../chunks/class-map.BiVq-cVR.js";
 import "../chunks/repeat.CFjcER6_.js";
 import "../chunks/when.Dr1es41R.js";
-import "../chunks/button.DDem_XZq.js";
+import "../chunks/button.zWaIO1sl.js";
 import "../chunks/input.B-c9KEAH.js";
 import "../chunks/option.Bvyag0r1.js";
 import "./select.js";

package/library/components/radio-button.js

@@ -9,7 +9,7 @@ import { e as y } from "../chunks/class-map.BiVq-cVR.js";
 import { o as h } from "../chunks/if-defined.BRoBj_Rp.js";
 import { u as _ } from "../chunks/static.UA3G1Deq.js";
 import { i as v } from "../chunks/lit-element.jLBm65_O.js";
-import { b as w } from "../chunks/button.styles.BersilzZ.js";
+import { b as w } from "../chunks/button.styles.Bcj_XoRt.js";
 const C = v`
   ${w}
 

package/library/components/tab-group.js

@@ -1,7 +1,7 @@
 import "./resize-observer.js";
 import "../chunks/lib-cortex-element.CVMmyPMC.js";
 import "../chunks/component.styles.CRO4Odto.js";
-import { C as A } from "../chunks/tab-group.BdWDbwBy.js";
+import { C as A } from "../chunks/tab-group.C_n0GEc_.js";
 import "../chunks/custom-element.L4WJXn1j.js";
 import "../chunks/i18n.DbXTTLXx.js";
 import "../chunks/scroll.xtO5yojm.js";
@@ -18,7 +18,7 @@ import "../chunks/guard.D4axKaMo.js";
 import "../chunks/map.D8heArFD.js";
 import "../chunks/style-map.llVFPd__.js";
 import "../chunks/when.Dr1es41R.js";
-import "../chunks/button.DDem_XZq.js";
+import "../chunks/button.zWaIO1sl.js";
 import "./dropdown.js";
 import "../chunks/icon-button.DJvfUmOl.js";
 import "./menu.js";

package/library/components/types.js

@@ -9,7 +9,7 @@ import { default as YYt } from "./avatar.js";
 import dx from "./badge.js";
 import { default as JYt } from "./breadcrumb.js";
 import { default as QYt } from "./breadcrumb-item.js";
-import { C as $n, B as Il, a as Cc } from "../chunks/button.DDem_XZq.js";
+import { C as $n, B as Il, a as Cc } from "../chunks/button.zWaIO1sl.js";
 import $4 from "./button-group.js";
 import nm from "./card.js";
 import jh from "./checkbox.js";
@@ -18,10 +18,10 @@ import eF from "./copy-button.js";
 import AZ from "./date-calendar.js";
 import px from "./details.js";
 import { default as tXt } from "./diff.js";
-import { C as Ia, D as Sf, O as tF, a as OZ, H as DZ, z as IZ, o as MZ } from "../chunks/dialog.B_v8598F.js";
+import { C as Ia, D as Sf, O as tF, a as OZ, H as DZ, z as IZ, o as MZ } from "../chunks/dialog.BaHYOyYO.js";
 import Hs from "./divider.js";
-import { r as PZ, a as iF, b as NZ, c as LZ } from "../chunks/document-viewer.BT1kp8Ig.js";
-import { C as nXt } from "../chunks/document-viewer.BT1kp8Ig.js";
+import { r as PZ, a as iF, b as NZ, c as LZ } from "../chunks/document-viewer.B89YB5oo.js";
+import { C as nXt } from "../chunks/document-viewer.B89YB5oo.js";
 import { d as RZ, C as BZ } from "../chunks/dot-pagination.BqGFeFXK.js";
 import { default as oXt } from "./dot-status.js";
 import { default as sXt } from "./drawer.js";
@@ -53,7 +53,7 @@ import z4 from "./menu-label.js";
 import JZ from "./menu-section.js";
 import ZZ from "./mutation-observer.js";
 import { C as Zo, a as QZ } from "../chunks/option.Bvyag0r1.js";
-import { C as eQ } from "../chunks/pagination.TxcRv9BL.js";
+import { C as eQ } from "../chunks/pagination.CwKlKOek.js";
 import ud from "./popup.js";
 import tQ from "./progress-bar.js";
 import { default as xXt } from "./progress-ring.js";
@@ -75,7 +75,7 @@ import { default as PXt } from "./step.js";
 import { default as LXt } from "./stepper.js";
 import ab from "./switch.js";
 import UC from "./tab.js";
-import { C as qC, T as oF, a as aF, b as sF, g as DI } from "../chunks/tab-group.BdWDbwBy.js";
+import { C as qC, T as oF, a as aF, b as sF, g as DI } from "../chunks/tab-group.C_n0GEc_.js";
 import H4 from "./tab-panel.js";
 import { default as BXt } from "./tag.js";
 import V4 from "./textarea.js";
@@ -115,7 +115,7 @@ import { d as Ql } from "../chunks/debounce.DaHuiSGU.js";
 import { t as RS, c as FI, d as xQ, i as Wk, G as qg, j as hp, h as kQ, s as zI, T as q4, k as wi, l as gF, u as _Q, f as Gk, m as CQ, F as by, M as Wb, n as SQ, o as mF, q as jI } from "../chunks/string.BhJ0Zogu.js";
 import { b as PJt, e as NJt, g as LJt, p as RJt, z as BJt, y as $Jt, a as FJt, x as zJt, v as jJt, r as HJt, w as VJt } from "../chunks/string.BhJ0Zogu.js";
 import { c as pi } from "../chunks/repeat.CFjcER6_.js";
-import { a as Ny, F as Ly, i as W4, b as HI, c as VI, d as TQ, e as fF, f as vF, g as G4, h as Kk, C as EQ, j as UI, k as qI, l as WI, m as GI, n as KI, o as YI, O as XI, D as BS, p as AQ, q as JI, u as Yk } from "../chunks/asset-link-format.BSo7khRt.js";
+import { a as Ny, F as Ly, i as W4, b as HI, c as VI, d as TQ, e as fF, f as vF, g as G4, h as Kk, C as EQ, j as UI, k as qI, l as WI, m as GI, n as KI, o as YI, O as XI, D as BS, p as AQ, q as JI, u as Yk } from "../chunks/asset-link-format.BATKDRgD.js";
 import { H as WC } from "../chunks/slot.j5oheLJC.js";
 import { a as qJt, g as WJt } from "../chunks/slot.j5oheLJC.js";
 import { c as Pr, d as OQ, H as Ii, e as Sa, f as gs, a as DQ, b as er } from "../chunks/resizable-component.styles.CAfXABBc.js";
@@ -128,7 +128,7 @@ import { j as QJt, f as eZt, e as tZt, i as iZt, a as nZt, h as rZt, m as oZt, d
 import bF from "./bicolor-picker.js";
 import wF from "./border-input-group.js";
 import { C as cZt } from "../chunks/color-swatch.DpzAGKQx.js";
-import { C as KC, a as xF } from "../chunks/confirm-popover.Cx6BUoTL.js";
+import { C as KC, a as xF } from "../chunks/confirm-popover.hHcCIzpX.js";
 import PQ from "./corner-position-input-group.js";
 import NQ from "./cropper.js";
 import { h as ai, D as kF, e as i8, C as Vs, M as sb, T as YC, f as _F } from "../chunks/endpoints.CwgTrs4A.js";
@@ -141,9 +141,9 @@ import { g as SF, F as jQ } from "../chunks/form.CP9KLGjF.js";
 import { c as fZt, f as vZt, v as yZt, a as bZt } from "../chunks/form.CP9KLGjF.js";
 import { d as zS, c as o8, e as HQ, i as a8, h as VQ, p as UQ, t as qQ } from "../chunks/date.iWq_pkIk.js";
 import { b as xZt, f as kZt, g as _Zt, a as CZt, n as SZt } from "../chunks/date.iWq_pkIk.js";
-import { F as TF, a as WQ, b as JC, H as GQ, c as l0, d as KQ, o as _u } from "../chunks/color-swatch-group.C_PwK2oY.js";
-import { C as EZt, e as AZt, f as OZt } from "../chunks/color-swatch-group.C_PwK2oY.js";
-import { F as Wd, C as K4, s as ZC, a as jS } from "../chunks/folder-select.B9qqU1CQ.js";
+import { F as TF, a as WQ, b as JC, H as GQ, c as l0, d as KQ, o as _u } from "../chunks/color-swatch-group.CQlgq_I5.js";
+import { C as EZt, e as AZt, f as OZt } from "../chunks/color-swatch-group.CQlgq_I5.js";
+import { F as Wd, C as K4, s as ZC, a as jS } from "../chunks/folder-select.C6Sv4jtu.js";
 import { b as QC, a as bw, c as YQ, r as Ue, j as _e, w as XQ, R as JQ } from "../chunks/jsx-runtime.CTpPVMxj.js";
 import { j as HS } from "../chunks/index.CrhRU5m8.js";
 import { i as Y4, T as VS, t as ZQ } from "../chunks/transform.BuqENXeT.js";
@@ -205,7 +205,7 @@ import { r as jF } from "../chunks/query-async.CTgXGyQ5.js";
 import { S as Pee } from "../chunks/sortable.esm.oSzf6C5Q.js";
 import { a as bQt, g as wQt } from "../chunks/active-elements.jTVWtBDp.js";
 import { f as kQt } from "../chunks/focus-when-visible.jWSw9ks0.js";
-import { g as CQt } from "../chunks/modal.jdGhujoh.js";
+import { g as CQt } from "../chunks/modal.Ct0bJBSe.js";
 import { C as TQt } from "../chunks/calendar-grid.BWjcZL5W.js";
 import { c as AQt, f as OQt, e as DQt, b as IQt, g as MQt, d as PQt, i as NQt, r as LQt, a as RQt } from "../chunks/image.Y5c_hFx8.js";
 import { b as $Qt, e as FQt } from "../chunks/waveform.1U9U_0rd.js";
@@ -97942,8 +97942,8 @@ const d8t = {
   "data-grid-rows-desktop": 2,
   "data-grid-rows-mobile": 2,
   "default-folders": "",
-  "default-sort-order": "",
-  "default-view": "",
+  "default-sort-order": "OR4ND000000063460",
+  "default-view": "DamView_M_Grid_Unlabeled",
   "deploy-stacks": !0,
   "enable-asset-actions": !0,
   "expanded-folders": "",
@@ -98587,6 +98587,9 @@ const w8t = (i) => {
       label: i.term("defaultView"),
       name: "default-view",
       options: [],
+      selectConfigs: {
+        autoFallbackFirstOption: !0
+      },
       tab: "appearance",
       type: "attribute"
     },
@@ -98617,6 +98620,9 @@ const w8t = (i) => {
       label: i.term("defaultSortOrder"),
       name: "default-sort-order",
       options: [],
+      selectConfigs: {
+        autoFallbackFirstOption: !0
+      },
       tab: "appearance",
       type: "attribute"
     },
@@ -122447,7 +122453,7 @@ class XMt {
               let m = h.target.value;
               Array.isArray(m) ? m = m.join(" ") : m = String(m), await o(m);
             }, d = l.selectConfigs?.fullWidthPopup ? t?.value : void 0, u = l.tableSelectConfigs?.columns ?? [];
-            return l.api ? I`<cx-dynamic-select auto-size-padding=${u.length > 0 ? 100 : 10} class="config-form__select" data-label=${l.label ?? ""} hoist label=${l.inputConfigs?.label ?? ""} max-options-visible="0" placement=${Vi(l.selectConfigs?.placement)} value=${n ?? ""} .api=${l.api} .columns=${u} .syncElement=${Vi(d)} ?clearable=${l.clearable ?? !0} ?disabled=${r} ?free-width=${u.length > 0} ?multiple=${l.multiple ?? !1} ?required=${l.required ?? !1} ?use-search-term=${l.useSearchTerm ?? !1} @cx-change=${c}></cx-dynamic-select>` : I`<cx-select class="config-form__select" value=${n ?? ""} hoist label=${l.inputConfigs?.label ?? ""} ?clearable=${l.clearable ?? !0} ?disabled=${r} placement=${Vi(l.selectConfigs?.placement)} .syncElement=${Vi(d)} @cx-change=${c}>${pi(
+            return l.api ? I`<cx-dynamic-select auto-size-padding=${u.length > 0 ? 100 : 10} class="config-form__select" data-label=${l.label ?? ""} hoist label=${l.inputConfigs?.label ?? ""} max-options-visible="0" placement=${Vi(l.selectConfigs?.placement)} value=${n ?? ""} .api=${l.api} .columns=${u} .syncElement=${Vi(d)} ?auto-fallback-first-option=${l.selectConfigs?.autoFallbackFirstOption ?? !1} ?clearable=${l.clearable ?? !0} ?disabled=${r} ?free-width=${u.length > 0} ?multiple=${l.multiple ?? !1} ?required=${l.required ?? !1} ?use-search-term=${l.useSearchTerm ?? !1} @cx-change=${c}></cx-dynamic-select>` : I`<cx-select class="config-form__select" value=${n ?? ""} hoist label=${l.inputConfigs?.label ?? ""} ?clearable=${l.clearable ?? !0} ?disabled=${r} placement=${Vi(l.selectConfigs?.placement)} .syncElement=${Vi(d)} @cx-change=${c}>${pi(
               l.options ?? [],
               (h) => h.value,
               (h) => I`<cx-option value=${h.value} show-check check-placement=${QZ.Right}>${h.name}

package/library/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orangelogic/design-system",
   "type": "module",
-  "version": "2.170.0",
+  "version": "2.171.0",
   "license": "UNLICENSED",
   "types": "library/types.d.ts",
   "scripts": {

package/library/packages/molecules/src/dynamic-select/dynamic-select.d.ts

@@ -209,6 +209,12 @@ export default class CxDynamicSelect extends CortexElement {
      */
     noFlip: boolean;
     customChangeEvent: string;
+    /**
+     * When set to true, after options are fetched, the select falls back to the first option's value
+     * when the current `value` does not match any fetched option (including when no `value` was provided).
+     * Has no effect when `multiple` is enabled.
+     */
+    autoFallbackFirstOption: boolean;
     options: Option[];
     start: number;
     searchTerm: string;
@@ -228,6 +234,7 @@ export default class CxDynamicSelect extends CortexElement {
     private tableFilterCallback;
     private getCellValue;
     private getColWidth;
+    private getFallbackValue;
     private handleInputChange;
     private handleLoadMore;
     private handleCustomChange;

package/library/packages/molecules/src/folder-select/folder-select.d.ts

@@ -59,6 +59,20 @@ export default class CxFolderSelect extends CortexElement {
     private handleSearchTermInputChange;
     private handleSearchTermSelectChange;
     private handleTreeLoadingChange;
+    /**
+     * Lazy-loaded tree children can grow the popup's content well past its
+     * original height. cx-popup only recomputes flip/placement on scroll,
+     * resize, or viewport changes (Floating UI's autoUpdate) — not on
+     * internal content mutations — so without this the popup can stay
+     * anchored below the trigger even after it no longer fits there.
+     *
+     * Clearing --auto-size-available-height/-width first matters as much as
+     * the reposition() call itself: cx-select's own auto-size CSS clamps the
+     * listbox to the *previous* available space, so flip's overflow check
+     * still measures the clamped (small) height and never decides to flip
+     * (see the same clear in cx-select's filterOptionsByInput()).
+     */
+    private handleTreeChildrenLoaded;
     private handleSelectClear;
     /**
      * cx-folder-select-tree owns `currentRootIDsSet` (the real source of

package/library/packages/organisms/src/content-builder/styleController.d.ts

@@ -152,6 +152,7 @@ export default class StyleController {
         };
         required?: boolean;
         selectConfigs?: {
+            autoFallbackFirstOption?: boolean;
             fullWidthPopup?: boolean;
             placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "right" | "right-start" | "right-end" | "left" | "left-start" | "left-end" | "center";
         };

package/library/packages/types/src/content-builder.d.ts

@@ -175,6 +175,11 @@ export type PropertyConfig<T = Record<string, any>> = Omit<TraitProperties, 'opt
     };
     required?: boolean;
     selectConfigs?: {
+        /**
+         * When true (dynamic select only), falls back to the first fetched option's value
+         * when the current value does not match any fetched option (or when no value is set).
+         */
+        autoFallbackFirstOption?: boolean;
         fullWidthPopup?: boolean;
         placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'right' | 'right-start' | 'right-end' | 'left' | 'left-start' | 'left-end' | 'center';
     };

package/library/packages/utils/src/custom-element/modal.d.ts

@@ -17,6 +17,13 @@ export default class Modal {
     activateExternal(): void;
     /** Deactivates external modal behavior and re-enables focus trapping. */
     deactivateExternal(): void;
+    /**
+     * Focus counts as inside if either tree says so. `:focus-within` follows the
+     * render tree and covers content slotted in from elsewhere, but stops at the
+     * top layer (e.g. a hoisted listbox in a popover); the active element chain
+     * follows the DOM tree and covers that.
+     */
+    private hasFocusInside;
     private checkFocus;
     private handleFocusIn;
     private possiblyHasTabbableChildren;

package/library/react-web-component.d.ts

@@ -5977,6 +5977,10 @@
           * 
         */
         customChangeEvent?: string;
+        /**
+          * When set to true, after options are fetched, the select falls back to the first option's value when the current `value` does not match any fetched option (including when no `value` was provided). Has no effect when `multiple` is enabled.
+        */
+        autoFallbackFirstOption?: boolean;
         /**
           * Make localization attributes reactive eslint-disable-next-line lit/no-native-attributes
         */

package/library/utils.js

@@ -15,7 +15,7 @@ import { f as k } from "./chunks/form.CP9KLGjF.js";
 import { F as Ue, c as _e, g as Pe, v as Xe, a as He } from "./chunks/form.CP9KLGjF.js";
 import { L as Be, r as $e } from "./chunks/i18n.DbXTTLXx.js";
 import { c as ze, q as qe } from "./chunks/math.DuKzLacZ.js";
-import { g as Ze } from "./chunks/modal.jdGhujoh.js";
+import { g as Ze } from "./chunks/modal.Ct0bJBSe.js";
 import { g as Je, l as Ke, s as tr, u as er } from "./chunks/scroll.xtO5yojm.js";
 import { k as y } from "./chunks/dom.C5aVLhKS.js";
 import { c as ar, d as sr, h as or, m as nr, a as ir, g as lr, j as cr, b as ur, f as mr, i as fr, e as hr, l as gr, s as dr } from "./chunks/dom.C5aVLhKS.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orangelogic/design-system",
   "type": "module",
-  "version": "2.170.0",
+  "version": "2.171.0",
   "license": "UNLICENSED",
   "types": "library/types.d.ts",
   "scripts": {