impact-nova 2.1.0-alpha.4 → 2.1.0-alpha.6

package/dist/components/data/data-table/use-data-table-column-list-sync.d.ts

@@ -0,0 +1,16 @@
+import { GridApi } from 'ag-grid-community';
+import { NestedListItem } from '../nested-list/nested-list.types';
+export interface UseDataTableColumnListSyncOptions {
+    gridApi: GridApi | null;
+    frozenColumnsLabel: string;
+    scrollableColumnsLabel: string;
+}
+export declare function useDataTableColumnListSync({ gridApi, frozenColumnsLabel, scrollableColumnsLabel, }: UseDataTableColumnListSyncOptions): {
+    items: NestedListItem[];
+    isReady: boolean;
+    externalSyncKey: boolean;
+    listWrapperRef: import('react').RefObject<HTMLDivElement | null>;
+    handleChange: (currentItems: NestedListItem[], enableApplyDiscard: boolean) => void;
+    handleSubmit: (finalItems: NestedListItem[]) => void;
+    handlePinChange: (itemId: string, newPinned: "left" | "right" | null) => void;
+};

package/dist/components/data/data-table/use-data-table-column-list-sync.js

@@ -0,0 +1,222 @@
+import { useState as M, useRef as h, useCallback as a, useEffect as x } from "react";
+import { mergePartialOrderedColumnState as L } from "./data-table-column-state.js";
+import { afterSynchronousColumnApply as b, normalizeColumnPinned as q, GRID_AUTO_UNPIN_WAIT_MS as H, alignColumnTreePinMetadata as N, EXTERNAL_SYNC_DEBOUNCE_MS as J, readGridColumnPinned as Q } from "./data-table-column-apply.js";
+import { buildColumnTreeFromGrid as Z } from "./build-column-tree-from-grid.js";
+import { computeColumnListSyncFingerprints as z, resolveColumnListSyncMode as A } from "./data-table-column-list-sync.js";
+import { subscribeGridApiEvent as j } from "../ag-grid-react/grid-api-event-subscription.js";
+function se({
+  gridApi: n,
+  frozenColumnsLabel: O,
+  scrollableColumnsLabel: _
+}) {
+  const [K, v] = M([]), [V, W] = M(!1), [w, B] = M(!1), i = h(!1), E = h(null), S = h(0), y = h(""), P = h(""), C = a(() => !n || i.current ? null : Z(n, {
+    frozenColumns: O,
+    scrollableColumns: _
+  }), [n, O, _]), g = a(
+    (t, e, o) => {
+      const l = y.current, c = z(t);
+      y.current = c.structural, P.current = c.indicators, v(t), W(!0), e === "structural" && l !== "" && B((d) => !d);
+    },
+    [n]
+  ), p = a(
+    (t = "unknown") => {
+      const e = C();
+      e && g(e, "structural", t);
+    },
+    [g, C, n]
+  ), D = a(
+    (t) => {
+      const e = C();
+      if (!e) return;
+      const o = A(
+        e,
+        y.current,
+        P.current
+      );
+      if (o !== "skip") {
+        if (o === "structural") {
+          const l = E.current?.querySelector(
+            '[data-component="nested-list"] .overflow-y-auto'
+          );
+          l && (S.current = l.scrollTop);
+        }
+        g(e, o, t);
+      }
+    },
+    [g, C]
+  );
+  x(() => {
+    if (!n) return;
+    queueMicrotask(() => p("initial"));
+    const t = [
+      "columnVisible",
+      "columnPinned",
+      "columnMoved",
+      "gridReady",
+      "columnGroupOpened",
+      "columnRowGroupChanged",
+      "columnPivotModeChanged",
+      "columnEverythingChanged",
+      "dragStopped",
+      "columnValueChanged",
+      "displayedColumnsChanged",
+      "sortChanged",
+      "filterChanged",
+      "newColumnsLoaded"
+    ];
+    let e = null;
+    const o = (c) => {
+      i.current || (e && clearTimeout(e), e = setTimeout(() => {
+        e = null, !(i.current || n.isDestroyed()) && D(`grid:${c}`);
+      }, J));
+    }, l = t.map(
+      (c) => j(n, c, () => {
+        o(c);
+      })
+    );
+    return () => {
+      e && clearTimeout(e), l.forEach((c) => c());
+    };
+  }, [n, p, D]), x(() => {
+    if (S.current === 0) return;
+    const t = requestAnimationFrame(() => {
+      const e = E.current?.querySelector(
+        '[data-component="nested-list"] .overflow-y-auto'
+      );
+      e && (e.scrollTop = S.current, S.current = 0);
+    });
+    return () => cancelAnimationFrame(t);
+  }, [w]);
+  const U = a(
+    (t) => {
+      const e = [], o = (l, c) => {
+        l.forEach((r) => {
+          if (r.id === "root-frozen") {
+            r.children && o(r.children, "left");
+            return;
+          }
+          if (r.id === "root-scrollable") {
+            r.children && o(r.children, null);
+            return;
+          }
+          if (r.category === "group" || r.children && r.children.length > 0)
+            r.children && o(r.children, c);
+          else {
+            let u;
+            if (c === null)
+              u = null;
+            else {
+              const f = r.data?.pinned;
+              u = f === "left" || f === "right" ? f : c;
+            }
+            e.push({
+              colId: r.id,
+              pinned: u,
+              hide: !r.checked
+            });
+          }
+        });
+      };
+      return o(t, null), e;
+    },
+    []
+  ), I = a(
+    (t) => {
+      if (!n) return;
+      i.current = !0;
+      const e = U(t);
+      if (e.length === 0) {
+        b(() => {
+          i.current = !1;
+        });
+        return;
+      }
+      const o = n.getColumnState(), l = L(o, e), c = new Set(
+        o.filter((s) => q(s.pinned)).map((s) => s.colId)
+      ), r = l.filter(
+        (s) => q(s.pinned) && !c.has(s.colId)
+      ), d = new Set(r.map((s) => s.colId));
+      n.applyColumnState({ state: l, applyOrder: !0 });
+      const u = () => {
+        i.current = !1, p("handleChanges:releaseLockAndSync");
+      };
+      if (d.size === 0) {
+        b(u);
+        return;
+      }
+      let T = !1, f = null, G = null;
+      G = j(n, "columnPinned", () => {
+        if (T || n.isDestroyed()) return;
+        const s = n.getColumnState();
+        if (r.filter((R) => {
+          const m = s.find((F) => F.colId === R.colId);
+          return m && !m.pinned;
+        }).length > 0) {
+          T = !0, f && clearTimeout(f), G?.();
+          const R = l.filter(
+            (m) => m.pinned && !d.has(m.colId)
+          );
+          if (R.length > 0) {
+            const m = R[0], F = l.map(
+              (k) => k.colId === m.colId ? { ...k, pinned: null } : k
+            );
+            n.applyColumnState({ state: F, applyOrder: !0 });
+          }
+          b(u);
+        }
+      }), f = setTimeout(() => {
+        G?.(), T || u();
+      }, H);
+    },
+    [n, U, p]
+  ), X = a(
+    (t) => {
+      I(N(t));
+    },
+    [I]
+  ), Y = a(
+    (t, e) => {
+      const o = N(t);
+      e || I(o), v(o);
+      const l = z(o);
+      y.current = l.structural, P.current = l.indicators;
+    },
+    [I]
+  ), $ = a(
+    (t, e) => {
+      if (v((c) => {
+        const r = (d) => d.map((u) => u.id === t ? {
+          ...u,
+          data: {
+            ...u.data,
+            pinned: e
+          }
+        } : u.children ? {
+          ...u,
+          children: r(u.children)
+        } : u);
+        return r(c);
+      }), !n) return;
+      i.current = !0;
+      const o = n.getColumnState(), l = L(o, [
+        { colId: t, pinned: e }
+      ]);
+      n.applyColumnState({ state: l, applyOrder: !0 }), b(() => {
+        i.current = !1, Q(n, t) !== e && p("handlePinChange");
+      });
+    },
+    [n, p]
+  );
+  return {
+    items: K,
+    isReady: V,
+    externalSyncKey: w,
+    listWrapperRef: E,
+    handleChange: Y,
+    handleSubmit: X,
+    handlePinChange: $
+  };
+}
+export {
+  se as useDataTableColumnListSync
+};

package/dist/components/data/expandable-list-item/expandable-list-item-attributes.d.ts

@@ -0,0 +1,8 @@
+import { ExpandableListItemAttributesSection } from './expandable-list-item.types';
+export interface ExpandableListItemAttributesProps {
+    tags: ExpandableListItemAttributesSection["tags"];
+    title?: string;
+    maxVisibleTags?: number;
+    formatOverflow?: ExpandableListItemAttributesSection["formatOverflow"];
+}
+export declare function ExpandableListItemAttributes({ tags, title, maxVisibleTags, formatOverflow, }: ExpandableListItemAttributesProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/data/expandable-list-item/expandable-list-item-attributes.js

@@ -0,0 +1,72 @@
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { Badge as p } from "../../data-display/badge/badge.js";
+import { FilterPopoverContent as h } from "../../flows/filter-strip/filter-tag-list.js";
+import { Popover as u, PopoverTrigger as f } from "../../feedback/popover/popover.js";
+import { Tag as x } from "../../primitives/tag/tag.js";
+import { Tooltip as b, TooltipTrigger as g, TooltipContent as v } from "../../feedback/tooltip/tooltip.js";
+function I({
+  tags: n,
+  title: i = "Attributes",
+  maxVisibleTags: a = 4,
+  formatOverflow: s
+}) {
+  const c = n.slice(0, a), t = n.slice(a), o = t.length, d = s?.(o) ?? (o > 0 ? `+${o}` : null);
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      className: "px-4 py-4 pt-0 sm:px-5",
+      "data-component": "expandable-list-item-attributes",
+      children: [
+        /* @__PURE__ */ e("p", { className: "text-xs font-semibold leading-5 text-content-heading", children: i }),
+        /* @__PURE__ */ r("div", { className: "mt-2 flex flex-wrap gap-1.5", children: [
+          c.map((l, m) => /* @__PURE__ */ e(
+            p,
+            {
+              variant: "subtle",
+              color: "neutral",
+              size: "sm",
+              shape: "circle",
+              className: "max-w-full",
+              children: l
+            },
+            `${m}-${l}`
+          )),
+          t.length > 0 ? /* @__PURE__ */ r(u, { children: [
+            /* @__PURE__ */ r(b, { children: [
+              /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e(f, { asChild: !0, children: /* @__PURE__ */ e(
+                x,
+                {
+                  variant: "secondary",
+                  size: "md",
+                  shape: "rounded",
+                  className: "h-6 cursor-pointer whitespace-nowrap border-0 bg-accent px-2 font-['Manrope'] text-xs font-medium text-accent-foreground hover:bg-accent/80",
+                  tabIndex: 0,
+                  role: "button",
+                  "aria-label": `${t.length} more attributes for ${i}`,
+                  children: d
+                }
+              ) }) }),
+              /* @__PURE__ */ r(v, { variant: "tertiary", side: "top", children: [
+                t.length,
+                " more"
+              ] })
+            ] }),
+            /* @__PURE__ */ e(
+              h,
+              {
+                remainingValues: t,
+                onItemRemove: () => {
+                },
+                isRemovable: !1,
+                isCopyable: !0
+              }
+            )
+          ] }) : null
+        ] })
+      ]
+    }
+  );
+}
+export {
+  I as ExpandableListItemAttributes
+};

package/dist/components/data/expandable-list-item/expandable-list-item-context.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+export interface ExpandableListItemContextValue {
+    showSelectionChrome: boolean;
+    disabled?: boolean;
+    expandAriaLabel: string;
+    collapseAriaLabel: string;
+}
+export declare function ExpandableListItemProvider({ value, children, }: {
+    value: ExpandableListItemContextValue;
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useExpandableListItemContext(): ExpandableListItemContextValue;
+export declare const EXPANDABLE_LIST_ITEM_ACCORDION_VALUE = "expandable-list-item-row-item";

package/dist/components/data/expandable-list-item/expandable-list-item-context.js

@@ -0,0 +1,25 @@
+import { jsx as r } from "react/jsx-runtime";
+import * as e from "react";
+const n = e.createContext(
+  null
+);
+function a({
+  value: t,
+  children: o
+}) {
+  return /* @__PURE__ */ r(n.Provider, { value: t, children: o });
+}
+function s() {
+  const t = e.useContext(n);
+  if (!t)
+    throw new Error(
+      "ExpandableListItem compound parts must be used within ExpandableListItemRoot."
+    );
+  return t;
+}
+const m = "expandable-list-item-row-item";
+export {
+  m as EXPANDABLE_LIST_ITEM_ACCORDION_VALUE,
+  a as ExpandableListItemProvider,
+  s as useExpandableListItemContext
+};

package/dist/components/data/expandable-list-item/expandable-list-item-metrics.d.ts

@@ -0,0 +1,6 @@
+import { ExpandableListItemMetricsSection } from './expandable-list-item.types';
+export interface ExpandableListItemMetricsProps {
+    columns: ExpandableListItemMetricsSection["columns"];
+    sectionId?: string;
+}
+export declare function ExpandableListItemMetrics({ columns, sectionId, }: ExpandableListItemMetricsProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/data/expandable-list-item/expandable-list-item-metrics.js

@@ -0,0 +1,41 @@
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+function o({
+  columns: l,
+  sectionId: i = "metrics"
+}) {
+  return l.length === 0 ? null : /* @__PURE__ */ e(
+    "div",
+    {
+      className: "min-w-0 bg-transparent",
+      "data-component": "expandable-list-item-metrics",
+      children: /* @__PURE__ */ e("div", { className: "scrollbar-hide overflow-x-auto overscroll-x-contain [-webkit-overflow-scrolling:touch]", children: /* @__PURE__ */ e("div", { className: "flex min-w-0 flex-nowrap divide-x divide-stroke-hairline px-4 py-4 sm:px-5", children: l.map((t, n) => /* @__PURE__ */ a(
+        "div",
+        {
+          className: "flex min-w-[7.5rem] flex-1 basis-0 flex-col gap-1 overflow-hidden px-3 first:pl-0 last:pr-0 sm:min-w-[8rem] sm:px-4",
+          children: [
+            /* @__PURE__ */ e(
+              "p",
+              {
+                className: "truncate text-xs font-semibold leading-5 text-content-heading",
+                title: t.label,
+                children: t.label
+              }
+            ),
+            /* @__PURE__ */ e(
+              "p",
+              {
+                className: "truncate text-sm font-semibold leading-5 text-content",
+                title: String(t.value),
+                children: t.value
+              }
+            )
+          ]
+        },
+        `${i}-metric-${n}`
+      )) }) })
+    }
+  );
+}
+export {
+  o as ExpandableListItemMetrics
+};

package/dist/components/data/expandable-list-item/expandable-list-item-parts.d.ts

@@ -0,0 +1,31 @@
+import { Checkbox } from '../../forms/checkbox';
+import * as React from "react";
+export interface ExpandableListItemRootProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children" | "onChange"> {
+    selected?: boolean;
+    expanded?: boolean;
+    defaultExpanded?: boolean;
+    onExpandedChange?: (open: boolean) => void;
+    disabled?: boolean;
+    expandAriaLabel?: string;
+    collapseAriaLabel?: string;
+    children: React.ReactNode;
+}
+export declare const ExpandableListItemRoot: React.ForwardRefExoticComponent<ExpandableListItemRootProps & React.RefAttributes<HTMLDivElement>>;
+export declare const ExpandableListItemRow: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export interface ExpandableListItemCheckboxProps extends Omit<React.ComponentPropsWithoutRef<typeof Checkbox>, "onCheckedChange"> {
+    onCheckedChange?: (checked: boolean) => void;
+}
+export declare const ExpandableListItemCheckbox: React.ForwardRefExoticComponent<ExpandableListItemCheckboxProps & React.RefAttributes<HTMLButtonElement>>;
+export declare const ExpandableListItemTrigger: React.ForwardRefExoticComponent<Omit<Omit<import('@radix-ui/react-accordion').AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
+    badge?: React.ReactNode;
+    rightActions?: React.ReactNode;
+    headingLevel?: import('../../..').AccordionHeadingLevel;
+    variant?: "default" | "plain";
+    renderChevronTooltip?: import('../../..').InfoTooltipRender;
+} & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const ExpandableListItemTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
+export declare const ExpandableListItemDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const ExpandableListItemMedia: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const ExpandableListItemHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const ExpandableListItemContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const ExpandableListItemFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/data/expandable-list-item/expandable-list-item-parts.js

@@ -0,0 +1,233 @@
+import { jsx as n, jsxs as v } from "react/jsx-runtime";
+import * as i from "react";
+import { ChevronRight as y } from "impact-nova-icons";
+import { AccordionContent as R, Accordion as A, AccordionItem as k, AccordionTrigger as T } from "../../primitives/accordion/accordion.js";
+import { Checkbox as P } from "../../forms/checkbox/checkbox.js";
+import { createCompoundPart as I } from "../../../lib/primitives/create-compound.js";
+import { cn as r } from "../../../lib/utils.js";
+import { useExpandableListItemContext as x, ExpandableListItemProvider as E, EXPANDABLE_LIST_ITEM_ACCORDION_VALUE as c } from "./expandable-list-item-context.js";
+function N(e, t) {
+  return r(
+    "rounded-xl transition-[background-color,border-color,box-shadow] duration-200",
+    e ? "border-stroke-accent/40 bg-canvas-accent shadow-sm" : "border-stroke bg-canvas-elevated",
+    t
+  );
+}
+function V(e) {
+  return i.isValidElement(e) && e.type.displayName === "ExpandableListItemContent";
+}
+const D = i.forwardRef(
+  ({
+    className: e,
+    selected: t,
+    expanded: a,
+    defaultExpanded: o = !1,
+    onExpandedChange: s,
+    disabled: l,
+    expandAriaLabel: m = "Expand details",
+    collapseAriaLabel: b = "Collapse details",
+    children: p,
+    ...f
+  }, h) => {
+    const d = !!t, L = i.Children.toArray(p).find(V) != null, u = i.useMemo(
+      () => ({
+        showSelectionChrome: d,
+        disabled: l,
+        expandAriaLabel: m,
+        collapseAriaLabel: b
+      }),
+      [d, l, m, b]
+    );
+    if (!L)
+      return /* @__PURE__ */ n(E, { value: u, children: /* @__PURE__ */ n(
+        "div",
+        {
+          ref: h,
+          "data-component": "expandable-list-item-row",
+          "data-expandable": "false",
+          "data-selected": t ? "" : void 0,
+          "data-selection-chrome": d ? "" : void 0,
+          className: N(d, e),
+          ...f,
+          children: p
+        }
+      ) });
+    const g = a !== void 0, C = g ? a ? c : "" : void 0;
+    return /* @__PURE__ */ n(E, { value: u, children: /* @__PURE__ */ n(
+      "div",
+      {
+        ref: h,
+        "data-component": "expandable-list-item",
+        "data-expandable": "true",
+        "data-expanded": a ?? void 0,
+        "data-selected": t ? "" : void 0,
+        "data-selection-chrome": d ? "" : void 0,
+        className: N(d, e),
+        ...f,
+        children: /* @__PURE__ */ n(
+          A,
+          {
+            type: "single",
+            collapsible: !0,
+            disabled: l,
+            ...g ? { value: C } : {
+              defaultValue: o ? c : void 0
+            },
+            onValueChange: (w) => s?.(w === c),
+            children: /* @__PURE__ */ n(
+              k,
+              {
+                value: c,
+                className: "overflow-visible rounded-none border-0 bg-transparent p-0 shadow-none",
+                children: p
+              }
+            )
+          }
+        )
+      }
+    ) });
+  }
+);
+D.displayName = "ExpandableListItemRoot";
+const W = I("expandable-list-item", {
+  part: "row",
+  displayName: "ExpandableListItemRow",
+  className: "flex items-start gap-3 px-3 py-3"
+}), M = i.forwardRef(({ className: e, onCheckedChange: t, ...a }, o) => /* @__PURE__ */ n(
+  "div",
+  {
+    className: r("pt-0.5", e),
+    "data-component": "expandable-list-item-checkbox",
+    onClick: (s) => s.stopPropagation(),
+    onKeyDown: (s) => s.stopPropagation(),
+    children: /* @__PURE__ */ n(
+      P,
+      {
+        ref: o,
+        onCheckedChange: (s) => t?.(s === !0),
+        ...a
+      }
+    )
+  }
+));
+M.displayName = "ExpandableListItemCheckbox";
+const S = i.forwardRef(({ className: e, children: t, ...a }, o) => {
+  const { disabled: s, expandAriaLabel: l, collapseAriaLabel: m } = x();
+  return /* @__PURE__ */ v(
+    T,
+    {
+      ref: o,
+      variant: "plain",
+      "data-component": "expandable-list-item-trigger",
+      className: r(
+        "min-w-0 items-center gap-2 text-left",
+        s && "pointer-events-none opacity-50",
+        e
+      ),
+      disabled: s,
+      ...a,
+      children: [
+        t,
+        /* @__PURE__ */ n(
+          "span",
+          {
+            className: "mt-0.5 inline-flex shrink-0 text-content-icon transition-transform duration-200 motion-reduce:transition-none group-data-[state=open]:rotate-180",
+            "aria-hidden": !0,
+            children: /* @__PURE__ */ n(y, { className: "size-4 rotate-90" })
+          }
+        ),
+        /* @__PURE__ */ v("span", { className: "sr-only", children: [
+          l,
+          " / ",
+          m
+        ] })
+      ]
+    }
+  );
+});
+S.displayName = "ExpandableListItemTrigger";
+const _ = i.forwardRef(({ className: e, ...t }, a) => {
+  const { showSelectionChrome: o } = x();
+  return /* @__PURE__ */ n(
+    "span",
+    {
+      ref: a,
+      "data-component": "expandable-list-item-title",
+      className: r(
+        "text-sm font-semibold leading-6 text-content",
+        o && "tracking-tight",
+        e
+      ),
+      ...t
+    }
+  );
+});
+_.displayName = "ExpandableListItemTitle";
+const j = i.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ n(
+  "div",
+  {
+    ref: a,
+    "data-component": "expandable-list-item-description",
+    className: r("mt-0.5 text-xs font-medium leading-4 text-secondary-foreground", e),
+    ...t
+  }
+));
+j.displayName = "ExpandableListItemDescription";
+const B = i.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ n(
+  "div",
+  {
+    ref: a,
+    "data-component": "expandable-list-item-media",
+    className: r("flex flex-wrap items-center gap-2", e),
+    ...t
+  }
+));
+B.displayName = "ExpandableListItemMedia";
+const F = i.forwardRef(({ className: e, ...t }, a) => {
+  const { disabled: o } = x();
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      ref: a,
+      "data-component": "expandable-list-item-header",
+      className: r(
+        "min-w-0 flex-1",
+        o && "pointer-events-none opacity-50",
+        e
+      ),
+      ...t
+    }
+  );
+});
+F.displayName = "ExpandableListItemHeader";
+const H = i.forwardRef(({ className: e, children: t, ...a }, o) => /* @__PURE__ */ n(R, { className: "border-0 bg-transparent p-0 pb-[0.01rem]", children: /* @__PURE__ */ n(
+  "div",
+  {
+    ref: o,
+    "data-component": "expandable-list-item-content",
+    className: r(
+      "mx-2 mb-2 overflow-hidden rounded-lg bg-canvas-subtle pt-2",
+      e
+    ),
+    ...a,
+    children: t
+  }
+) }));
+H.displayName = "ExpandableListItemContent";
+const Y = I("expandable-list-item", {
+  part: "footer",
+  displayName: "ExpandableListItemFooter",
+  className: "px-4 py-3 sm:px-5"
+});
+export {
+  M as ExpandableListItemCheckbox,
+  H as ExpandableListItemContent,
+  j as ExpandableListItemDescription,
+  Y as ExpandableListItemFooter,
+  F as ExpandableListItemHeader,
+  B as ExpandableListItemMedia,
+  D as ExpandableListItemRoot,
+  W as ExpandableListItemRow,
+  _ as ExpandableListItemTitle,
+  S as ExpandableListItemTrigger
+};