@pibit.ai/cure-design-system 0.6.19 → 0.6.21

package/dist/patterns/breadcrumbs/breadcrumbs.js

@@ -1,41 +1,39 @@
 import { jsx as t } from "react/jsx-runtime";
-import b, { useState as h } from "react";
-import { Breadcrumbs as g } from "react-aria-components";
-import { cx as o } from "../../utils/cn.js";
-import { BreadcrumbItem as n } from "./breadcrumb-item.js";
-import { BreadcrumbsContext as x } from "./context.js";
-const B = {
+import h, { useState as g } from "react";
+import { Breadcrumbs as x } from "react-aria-components";
+import { cx as n } from "../../utils/cn.js";
+import { BreadcrumbItem as l } from "./breadcrumb-item.js";
+import { BreadcrumbsContext as B } from "./context.js";
+const v = {
   text: "gap-0.5 md:gap-0.5",
   "text-line": "pl-2 gap-1.25 md:gap-1.25 py-2 after:pointer-events-none after:absolute after:inset-0 after:border-b after:border-t after:border-secondary",
   button: "gap-0.5 md:gap-0.5"
-}, v = ({
-  children: l,
+}, C = ({
+  children: c,
   divider: a = "slash",
   type: s = "text",
-  className: c,
+  className: i,
   maxVisibleItems: r = 4
 }) => {
-  const [i, m] = h(!1), d = (() => {
-    const e = b.Children.toArray(l);
-    if (!r || e.length <= r || i)
+  const [m, d] = g(!1), p = (() => {
+    const e = h.Children.toArray(c);
+    if (!r || e.length <= r || m)
       return e;
-    const p = e.slice(0, Math.ceil(r / 2)), f = e.slice(
-      -Math.floor((r - 1) / 2)
-    ), u = /* @__PURE__ */ t(
-      n,
+    const f = e.slice(0, Math.ceil(r / 2)), o = Math.floor((r - 1) / 2), u = o > 0 ? e.slice(-o) : [], b = /* @__PURE__ */ t(
+      l,
       {
         isEllipsis: !0,
         divider: a,
         type: s,
-        onClick: () => m(!0)
+        onClick: () => d(!0)
       },
       "ellipsis"
     );
-    return [...p, u, ...f];
+    return [...f, b, ...u];
   })();
-  return /* @__PURE__ */ t("nav", { "aria-label": "Breadcrumbs", className: o("min-w-0", c), children: /* @__PURE__ */ t(x.Provider, { value: { divider: a, type: s }, children: /* @__PURE__ */ t(g, { className: o("relative flex", B[s]), children: d }) }) });
+  return /* @__PURE__ */ t("nav", { "aria-label": "Breadcrumbs", className: n("min-w-0", i), children: /* @__PURE__ */ t(B.Provider, { value: { divider: a, type: s }, children: /* @__PURE__ */ t(x, { className: n("relative flex", v[s]), children: p }) }) });
 };
-v.Item = n;
+C.Item = l;
 export {
-  v as Breadcrumbs
+  C as Breadcrumbs
 };

package/dist/patterns/filters/checklist-select.d.ts

@@ -0,0 +1,22 @@
+export interface ChecklistSelectOption {
+    key: string;
+    /** The label shown next to the checkbox. */
+    value: string;
+}
+export interface ChecklistSelectProps {
+    /** Options to display. Each must have `key` and `value` (display label). */
+    options: ChecklistSelectOption[];
+    /** Currently selected option keys (e.g. for API filter value list). */
+    selectedKeys: string[];
+    /** Called when selection changes (e.g. after toggle). */
+    onChange?: (keys: string[]) => void;
+    /** Called when user clicks Apply. Pass current selected keys. */
+    onApply?: (keys: string[]) => void;
+    /** Called when user clicks Reset. Parent typically selects all. */
+    onReset?: () => void;
+    /** Called when panel should close (e.g. after Apply). */
+    onClose?: () => void;
+    className?: string;
+}
+export declare function ChecklistSelect({ options, selectedKeys, onChange, onApply, onReset, onClose, className, }: ChecklistSelectProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=checklist-select.d.ts.map

package/dist/patterns/filters/checklist-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"checklist-select.d.ts","sourceRoot":"","sources":["../../../src/patterns/filters/checklist-select.tsx"],"names":[],"mappings":"AAWA,MAAM,WAAW,qBAAqB;IACpC,GAAG,EAAE,MAAM,CAAC;IACZ,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,oBAAoB;IACnC,4EAA4E;IAC5E,OAAO,EAAE,qBAAqB,EAAE,CAAC;IACjC,uEAAuE;IACvE,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,yDAAyD;IACzD,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACpC,iEAAiE;IACjE,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnC,mEAAmE;IACnE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,yDAAyD;IACzD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,eAAe,CAAC,EAC9B,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,OAAO,EACP,OAAO,EACP,OAAO,EACP,SAAS,GACV,EAAE,oBAAoB,2CAoHtB"}

package/dist/patterns/filters/checklist-select.js

@@ -0,0 +1,117 @@
+import { jsxs as s, jsx as r } from "react/jsx-runtime";
+import { MinusSquare as v } from "@untitledui/icons";
+import { cx as o } from "../../utils/cn.js";
+import { Checkbox as u } from "../../primitives/checkbox/checkbox.js";
+import { Button as y } from "../../primitives/button/button.js";
+function _({
+  options: p,
+  selectedKeys: a,
+  onChange: l,
+  onApply: d,
+  onReset: m,
+  onClose: n,
+  className: b
+}) {
+  const t = p.map((e) => e.key).filter(Boolean), i = new Set(a), x = t.length > 0 && i.size === t.length, f = i.size > 0 && i.size < t.length, h = () => {
+    x || f ? l == null || l([]) : l == null || l(t);
+  }, S = (e) => {
+    const c = new Set(a);
+    c.has(e) ? c.delete(e) : c.add(e), l == null || l(Array.from(c));
+  }, N = () => {
+    d == null || d(a), n == null || n();
+  }, k = () => {
+    m == null || m();
+  };
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: o(
+        "flex flex-col rounded-xl bg-primary shadow-sm ring-1 ring-primary",
+        b
+      ),
+      "data-slot": "checklist-select",
+      children: [
+        /* @__PURE__ */ s("div", { className: "flex flex-col gap-0 p-3", children: [
+          /* @__PURE__ */ s(
+            "label",
+            {
+              className: o(
+                "flex cursor-pointer items-center gap-3 rounded-md py-2 pr-2 pl-0 outline-hidden",
+                "hover:bg-primary_hover"
+              ),
+              children: [
+                f ? /* @__PURE__ */ r(
+                  v,
+                  {
+                    size: 18,
+                    className: "text-utility-brand-600",
+                    onClick: h,
+                    cursor: "pointer"
+                  }
+                ) : /* @__PURE__ */ r(
+                  u,
+                  {
+                    id: "all",
+                    isSelected: x,
+                    onChange: h,
+                    size: "sm",
+                    "aria-label": "Select all options"
+                  }
+                ),
+                /* @__PURE__ */ r("span", { className: "text-sm font-medium text-primary select-none", children: "All" })
+              ]
+            }
+          ),
+          p.map((e) => /* @__PURE__ */ s(
+            "label",
+            {
+              className: o(
+                "flex cursor-pointer items-center gap-3 rounded-md py-2 pr-2 pl-0 outline-hidden",
+                "hover:bg-primary_hover"
+              ),
+              children: [
+                /* @__PURE__ */ r(
+                  u,
+                  {
+                    id: e.key,
+                    isSelected: i.has(e.key),
+                    onChange: () => S(e.key),
+                    size: "sm",
+                    "aria-label": e.value
+                  }
+                ),
+                /* @__PURE__ */ r("span", { className: "text-sm text-secondary select-none", children: e.value })
+              ]
+            },
+            e.key
+          ))
+        ] }),
+        /* @__PURE__ */ s("div", { className: "flex gap-2 border-primary p-3", children: [
+          /* @__PURE__ */ r(
+            y,
+            {
+              size: "xs",
+              color: "secondary",
+              className: "flex-1 bg-secondary border-none text-primary",
+              onClick: k,
+              children: "Reset"
+            }
+          ),
+          /* @__PURE__ */ r(
+            y,
+            {
+              size: "xs",
+              color: "primary",
+              className: "flex-1",
+              onClick: N,
+              children: "Apply"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+export {
+  _ as ChecklistSelect
+};

package/dist/patterns/filters/filter-list-section.d.ts

@@ -0,0 +1,22 @@
+export type FilterListItem = {
+    id: string;
+    label: string;
+    value: string;
+};
+export interface FilterListSectionProps<T extends FilterListItem> {
+    title: string;
+    items: T[];
+    selectedValues: string[];
+    selectAll: boolean;
+    search: string;
+    placeholder?: string;
+    showAvatar?: boolean;
+    getItemLabel?: (item: T) => string;
+    getItemValue?: (item: T) => string;
+    getItemKey?: (item: T) => string;
+    onSearchChange: (value: string) => void;
+    onToggleSelectAll: () => void;
+    onToggleItem: (value: string) => void;
+}
+export declare function FilterListSection<T extends FilterListItem>({ title, items, selectedValues, selectAll, search, placeholder, showAvatar, getItemLabel, getItemValue, getItemKey, onSearchChange, onToggleSelectAll, onToggleItem, }: FilterListSectionProps<T>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=filter-list-section.d.ts.map

package/dist/patterns/filters/filter-list-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"filter-list-section.d.ts","sourceRoot":"","sources":["../../../src/patterns/filters/filter-list-section.tsx"],"names":[],"mappings":"AAYA,MAAM,MAAM,cAAc,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAE1E,MAAM,WAAW,sBAAsB,CAAC,CAAC,SAAS,cAAc;IAC9D,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAEnC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAEnC,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAEjC,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAExC,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAE9B,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAcD,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,cAAc,EAAE,EAC1D,KAAK,EACL,KAAK,EACL,cAAc,EACd,SAAS,EACT,MAAM,EACN,WAAsB,EACtB,UAAU,EACV,YAAkC,EAClC,YAAkC,EAClC,UAA8B,EAC9B,cAAc,EACd,iBAAiB,EACjB,YAAY,GACb,EAAE,sBAAsB,CAAC,CAAC,CAAC,2CA8E3B"}

package/dist/patterns/filters/filter-list-section.js

@@ -0,0 +1,107 @@
+import { jsxs as n, jsx as r } from "react/jsx-runtime";
+import { MinusSquare as g } from "@untitledui/icons";
+import y from "../../primitives/select/SearchInput.js";
+import { Checkbox as u } from "../../primitives/checkbox/checkbox.js";
+import { Avatar as S } from "../../primitives/avatar/avatar.js";
+function C(e) {
+  return e.label ?? String(e.value ?? "");
+}
+function b(e) {
+  return e.value ?? String(e.id ?? "");
+}
+function w(e) {
+  return e.id ?? e.value;
+}
+function q({
+  title: e,
+  items: s,
+  selectedValues: i,
+  selectAll: c,
+  search: l,
+  placeholder: m = "Search",
+  showAvatar: h,
+  getItemLabel: t = C,
+  getItemValue: f = b,
+  getItemKey: p = w,
+  onSearchChange: x,
+  onToggleSelectAll: o,
+  onToggleItem: v
+}) {
+  const N = s.filter(
+    (a) => t(a).toLowerCase().includes(l.toLowerCase())
+  );
+  return /* @__PURE__ */ n("div", { children: [
+    /* @__PURE__ */ n("div", { className: "flex items-center gap-2 mb-4", children: [
+      /* @__PURE__ */ r("h3", { className: "text-sm font-medium text-gray-900", children: e }),
+      i.length > 0 && /* @__PURE__ */ n("span", { className: "text-xs", children: [
+        i.length,
+        " selected"
+      ] })
+    ] }),
+    /* @__PURE__ */ n("div", { className: "space-y-1", children: [
+      (s.length > 10 || l) && /* @__PURE__ */ r(
+        y,
+        {
+          className: "bg-secondary_subtle ring-0 rounded-md",
+          size: "sm",
+          placeholder: m,
+          value: l,
+          onChange: x
+        }
+      ),
+      /* @__PURE__ */ n("div", { className: "max-h-48 overflow-y-auto", children: [
+        /* @__PURE__ */ n("div", { className: "flex items-center gap-3 p-2", children: [
+          c ? /* @__PURE__ */ r(
+            u,
+            {
+              className: "cursor-pointer",
+              "aria-label": "Select all",
+              isSelected: c,
+              onChange: o
+            }
+          ) : /* @__PURE__ */ r(
+            "div",
+            {
+              onClick: o,
+              className: "h-4 w-4 flex items-center justify-center overflow-hidden cursor-pointer",
+              children: /* @__PURE__ */ r(g, { size: 18, className: "text-utility-brand-600" })
+            }
+          ),
+          /* @__PURE__ */ r("span", { className: "text-sm font-medium text-gray-900", children: "Select All" })
+        ] }),
+        N.map((a) => {
+          const d = f(a);
+          return /* @__PURE__ */ n(
+            "div",
+            {
+              className: "flex items-center gap-3 hover:bg-primary_hover rounded-md p-2",
+              children: [
+                /* @__PURE__ */ r(
+                  u,
+                  {
+                    "aria-label": t(a),
+                    isSelected: i.includes(d),
+                    onChange: () => v(d)
+                  }
+                ),
+                h ? /* @__PURE__ */ r(
+                  S,
+                  {
+                    size: "xs",
+                    initials: t(a).charAt(0),
+                    alt: t(a)
+                  }
+                ) : null,
+                /* @__PURE__ */ r("span", { className: "text-sm text-gray-700", children: t(a) })
+              ]
+            },
+            p(a)
+          );
+        })
+      ] })
+    ] })
+  ] });
+}
+export {
+  q as FilterListSection
+};

package/dist/patterns/filters/index.d.ts

@@ -0,0 +1,4 @@
+export { StatusFilterDropdown, type StatusFilterDropdownProps, type StatusFilterOption, type StatusFilters, } from './status-filter-dropdown';
+export { ChecklistSelect, type ChecklistSelectProps, type ChecklistSelectOption, } from './checklist-select';
+export { FilterListSection, type FilterListSectionProps, type FilterListItem, } from './filter-list-section';
+//# sourceMappingURL=index.d.ts.map

package/dist/patterns/filters/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/patterns/filters/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,KAAK,yBAAyB,EAC9B,KAAK,kBAAkB,EACvB,KAAK,aAAa,GACnB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,eAAe,EACf,KAAK,oBAAoB,EACzB,KAAK,qBAAqB,GAC3B,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,iBAAiB,EACjB,KAAK,sBAAsB,EAC3B,KAAK,cAAc,GACpB,MAAM,uBAAuB,CAAC"}

package/dist/patterns/filters/status-filter-dropdown.d.ts

@@ -0,0 +1,44 @@
+import { FC } from 'react';
+export interface StatusFilterOption {
+    key: string;
+    label: string;
+}
+export interface StatusFilters {
+    all: boolean;
+    [key: string]: boolean;
+}
+type BaseFilterDropdownProps = {
+    isOpen: boolean;
+    onOpenChange: (isOpen: boolean) => void;
+    onApply: () => void;
+    onReset: () => void;
+    className?: string;
+    buttonLabel?: string;
+    isDisabled?: boolean;
+    /** When set, controls Apply button disabled state. Omit to keep Apply always enabled. */
+    isApplyDisabled?: boolean;
+    /** When set, controls Reset button disabled state. Omit to keep Reset always enabled. */
+    isResetDisabled?: boolean;
+};
+type MultipleSelectFilterDropdownProps = BaseFilterDropdownProps & {
+    selectionMode?: "multiple";
+    statusFilters: StatusFilters;
+    appliedStatusFilters: StatusFilters;
+    onStatusChange: (status: string) => void;
+    statusOptions: StatusFilterOption[];
+    /** When true, every option selected is the unfiltered default (active styling when not fully selected). */
+    defaultSelectAll?: boolean;
+};
+type SingleSelectFilterDropdownProps = BaseFilterDropdownProps & {
+    selectionMode: "single";
+    options: StatusFilterOption[];
+    value: string;
+    pendingValue: string;
+    onValueChange: (key: string) => void;
+    /** Value treated as unfiltered — used for active button styling and reset. Defaults to `all`. */
+    defaultValue?: string;
+};
+export type StatusFilterDropdownProps = MultipleSelectFilterDropdownProps | SingleSelectFilterDropdownProps;
+export declare const StatusFilterDropdown: FC<StatusFilterDropdownProps>;
+export {};
+//# sourceMappingURL=status-filter-dropdown.d.ts.map

package/dist/patterns/filters/status-filter-dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-filter-dropdown.d.ts","sourceRoot":"","sources":["../../../src/patterns/filters/status-filter-dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA8C,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAgB5E,MAAM,WAAW,kBAAkB;IACjC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,aAAa;IAC5B,GAAG,EAAE,OAAO,CAAC;IACb,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,KAAK,uBAAuB,GAAG;IAC7B,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yFAAyF;IACzF,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,yFAAyF;IACzF,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,KAAK,iCAAiC,GAAG,uBAAuB,GAAG;IACjE,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B,aAAa,EAAE,aAAa,CAAC;IAC7B,oBAAoB,EAAE,aAAa,CAAC;IACpC,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,aAAa,EAAE,kBAAkB,EAAE,CAAC;IACpC,2GAA2G;IAC3G,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B,CAAC;AAEF,KAAK,+BAA+B,GAAG,uBAAuB,GAAG;IAC/D,aAAa,EAAE,QAAQ,CAAC;IACxB,OAAO,EAAE,kBAAkB,EAAE,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,iGAAiG;IACjG,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,yBAAyB,GACjC,iCAAiC,GACjC,+BAA+B,CAAC;AAQpC,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CAsQ9D,CAAC"}

package/dist/patterns/filters/status-filter-dropdown.js

@@ -0,0 +1,212 @@
+import { jsx as l, jsxs as c, Fragment as L } from "react/jsx-runtime";
+import { useMemo as h, useRef as k, useState as O, useLayoutEffect as w } from "react";
+import { ChevronDown as T, MinusSquare as B } from "@untitledui/icons";
+import { cx as K } from "../../utils/cn.js";
+import { Dropdown as C } from "../../primitives/dropdown/dropdown.js";
+import { Button as y } from "../../primitives/button/button.js";
+import { RadioButtonBase as _ } from "../../primitives/radio/radio.js";
+import { CheckboxBase as I } from "../../primitives/checkbox/checkbox.js";
+const S = ({ isSelected: t }) => /* @__PURE__ */ l("div", { className: "pointer-events-none", "aria-hidden": !0, children: /* @__PURE__ */ l(I, { isSelected: t }) }), X = (t) => {
+  const {
+    isOpen: u,
+    onOpenChange: D,
+    onApply: N,
+    onReset: F,
+    className: M,
+    buttonLabel: d = "Status",
+    isDisabled: R = !1,
+    isApplyDisabled: A,
+    isResetDisabled: p
+  } = t, r = t.selectionMode === "single", s = r ? t.options : t.statusOptions, a = (s == null ? void 0 : s.length) ?? 0, o = h(() => r ? 0 : Object.entries(t.appliedStatusFilters).filter(
+    ([e, n]) => e !== "all" && n
+  ).length, [r, t]), g = !r && t.defaultSelectAll === !0, z = h(() => {
+    if (r) {
+      const e = t.defaultValue ?? "all";
+      return t.value !== e;
+    }
+    return a === 0 ? !1 : g ? o < a : o > 0;
+  }, [
+    g,
+    r,
+    t,
+    o,
+    a
+  ]), m = h(() => r ? 0 : Object.entries(t.statusFilters).filter(
+    ([e, n]) => e !== "all" && n
+  ).length, [r, t]), x = m === a && a > 0, v = m > 0 && m < a, V = h(() => {
+    var n;
+    if (!r)
+      return !(o === a && a > 0) && o > 0 ? `${d} ${o} selected` : d;
+    const e = t.defaultValue ?? "all";
+    return t.value === e ? d : ((n = s.find((i) => i.key === t.value)) == null ? void 0 : n.label) ?? d;
+  }, [
+    r,
+    o,
+    a,
+    d,
+    t,
+    s
+  ]), f = k(null), b = k(0), [E, H] = O(
+    () => typeof window > "u" ? 400 : Math.round(window.innerHeight * 0.5)
+  ), j = r ? t.pendingValue : t.statusFilters;
+  return w(() => {
+    if (!u) return;
+    const e = () => {
+      H(Math.round(window.innerHeight * 0.5));
+    };
+    return e(), window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
+  }, [u]), w(() => {
+    const e = () => {
+      f.current && (f.current.scrollTop = b.current);
+    };
+    e();
+    const n = requestAnimationFrame(e);
+    return () => cancelAnimationFrame(n);
+  }, [j]), /* @__PURE__ */ l("div", { className: "relative", children: /* @__PURE__ */ c(C.Root, { isOpen: u, onOpenChange: D, children: [
+    /* @__PURE__ */ l(
+      y,
+      {
+        size: "xs",
+        color: "secondary",
+        iconTrailing: /* @__PURE__ */ l(T, { size: 12 }),
+        className: K(
+          "relative",
+          z && !u && "ring-1 ring-brand-600 bg-brand-primary text-brand-600 hover:bg-brand-primary hover:text-brand-600",
+          M,
+          u && "shadow-[0_0_0_4px_rgba(102,112,133,0.14)]"
+        ),
+        isDisabled: R,
+        children: V
+      }
+    ),
+    /* @__PURE__ */ l(
+      C.Popover,
+      {
+        className: "overflow-hidden",
+        style: { overflow: "hidden" },
+        maxHeight: E,
+        scrollRef: f,
+        children: /* @__PURE__ */ c("div", { className: "flex max-h-[50vh] flex-col overflow-hidden text-secondary text-xs", children: [
+          /* @__PURE__ */ l(
+            "div",
+            {
+              ref: f,
+              className: "min-h-0 flex-1 space-y-3 overflow-y-auto p-3",
+              role: r ? "radiogroup" : void 0,
+              "aria-label": r ? d : void 0,
+              onScroll: (e) => {
+                b.current = e.currentTarget.scrollTop;
+              },
+              children: r ? s.map((e) => {
+                const n = t.pendingValue === e.key;
+                return /* @__PURE__ */ c(
+                  "div",
+                  {
+                    role: "radio",
+                    "aria-checked": n,
+                    tabIndex: 0,
+                    className: "flex cursor-pointer items-center gap-3",
+                    onMouseDownCapture: (i) => i.preventDefault(),
+                    onClick: () => t.onValueChange(e.key),
+                    onKeyDown: (i) => {
+                      (i.key === "Enter" || i.key === " ") && (i.preventDefault(), t.onValueChange(e.key));
+                    },
+                    children: [
+                      /* @__PURE__ */ l("div", { className: "pointer-events-none", children: /* @__PURE__ */ l(
+                        _,
+                        {
+                          size: "sm",
+                          isSelected: n,
+                          "aria-hidden": !0
+                        }
+                      ) }),
+                      /* @__PURE__ */ l("span", { children: e.label })
+                    ]
+                  },
+                  e.key
+                );
+              }) : /* @__PURE__ */ c(L, { children: [
+                /* @__PURE__ */ c(
+                  "div",
+                  {
+                    role: "checkbox",
+                    "aria-checked": v ? "mixed" : x,
+                    tabIndex: 0,
+                    className: "flex cursor-pointer items-center gap-3",
+                    onMouseDownCapture: (e) => e.preventDefault(),
+                    onClick: () => t.onStatusChange("all"),
+                    onKeyDown: (e) => {
+                      (e.key === "Enter" || e.key === " ") && (e.preventDefault(), t.onStatusChange("all"));
+                    },
+                    children: [
+                      v ? /* @__PURE__ */ l(
+                        B,
+                        {
+                          size: 18,
+                          className: "text-utility-brand-600",
+                          "aria-hidden": !0
+                        }
+                      ) : /* @__PURE__ */ l(S, { isSelected: x }),
+                      /* @__PURE__ */ l("span", { children: "All" })
+                    ]
+                  }
+                ),
+                s.map((e) => /* @__PURE__ */ c(
+                  "div",
+                  {
+                    role: "checkbox",
+                    "aria-checked": t.statusFilters[e.key],
+                    tabIndex: 0,
+                    className: "flex cursor-pointer items-center gap-3",
+                    onMouseDownCapture: (n) => n.preventDefault(),
+                    onClick: () => t.onStatusChange(e.key),
+                    onKeyDown: (n) => {
+                      (n.key === "Enter" || n.key === " ") && (n.preventDefault(), t.onStatusChange(e.key));
+                    },
+                    children: [
+                      /* @__PURE__ */ l(
+                        S,
+                        {
+                          isSelected: t.statusFilters[e.key]
+                        }
+                      ),
+                      /* @__PURE__ */ l("span", { children: e.label })
+                    ]
+                  },
+                  e.key
+                ))
+              ] })
+            }
+          ),
+          /* @__PURE__ */ c("div", { className: "flex shrink-0 justify-end gap-2 bg-primary p-3", children: [
+            /* @__PURE__ */ l(
+              y,
+              {
+                size: "xs",
+                color: "secondary",
+                className: "flex-1 p-2",
+                onClick: F,
+                isDisabled: p,
+                children: "Reset"
+              }
+            ),
+            /* @__PURE__ */ l(
+              y,
+              {
+                size: "xs",
+                color: "primary",
+                className: "flex-1 p-2",
+                onClick: N,
+                isDisabled: A,
+                children: "Apply"
+              }
+            )
+          ] })
+        ] })
+      }
+    )
+  ] }) });
+};
+export {
+  X as StatusFilterDropdown
+};

package/dist/patterns/sub-sidebar/sub-sidebar.d.ts

@@ -1,6 +1,10 @@
 import { ReactNode } from 'react';
 import { SubSidebarConfig, SubSidebarGuard, SubSidebarLinkProps } from './types';
 export interface SubSidebarProps {
+    /**
+     * Keep it stable (memoize it): a group holding the active link re-opens whenever `config.sections` changes
+     * identity, so an inline config re-opens it on every parent render.
+     */
     config: SubSidebarConfig;
     /** The current location's path, e.g. `useLocation().pathname`. */
     currentPath: string;

package/dist/patterns/sub-sidebar/sub-sidebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sub-sidebar.d.ts","sourceRoot":"","sources":["../../../src/patterns/sub-sidebar/sub-sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAQf,OAAO,KAAK,EACV,gBAAgB,EAChB,eAAe,EAEf,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAajB,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,gBAAgB,CAAC;IACzB,kEAAkE;IAClE,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,iBAAiB,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,sDAAsD;IACtD,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,SAAS,CAAC;IACvD,yFAAyF;IACzF,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAcD,eAAO,MAAM,UAAU,GAAI,wFAQxB,eAAe,4CA8YjB,CAAC"}
+{"version":3,"file":"sub-sidebar.d.ts","sourceRoot":"","sources":["../../../src/patterns/sub-sidebar/sub-sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAQf,OAAO,KAAK,EACV,gBAAgB,EAChB,eAAe,EAEf,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAajB,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,MAAM,EAAE,gBAAgB,CAAC;IACzB,kEAAkE;IAClE,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,iBAAiB,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,sDAAsD;IACtD,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,SAAS,CAAC;IACvD,yFAAyF;IACzF,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAcD,eAAO,MAAM,UAAU,GAAI,wFAQxB,eAAe,4CAmZjB,CAAC"}