@pibit.ai/cure-design-system 0.3.17 → 0.3.20

package/dist/patterns/table/toolbar/AlignDropdown.d.ts

@@ -0,0 +1,11 @@
+import { Dispatch, FC, SetStateAction } from 'react';
+import { TableColumnSchema } from '../types';
+import { CellAlignment } from './tableToolbarHelpers';
+export interface AlignDropdownProps {
+    schema: TableColumnSchema[];
+    columnAlignments: ReadonlyMap<string, CellAlignment>;
+    setColumnAlignments: Dispatch<SetStateAction<Map<string, CellAlignment>>>;
+    isDisabled?: boolean;
+}
+export declare const AlignDropdown: FC<AlignDropdownProps>;
+//# sourceMappingURL=AlignDropdown.d.ts.map

package/dist/patterns/table/toolbar/AlignDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlignDropdown.d.ts","sourceRoot":"","sources":["../../../../src/patterns/table/toolbar/AlignDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAK1D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAClD,OAAO,EACL,KAAK,aAAa,EAGnB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,iBAAiB,EAAE,CAAC;IAC5B,gBAAgB,EAAE,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;IACrD,mBAAmB,EAAE,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAC1E,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAoBD,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAgEhD,CAAC"}

package/dist/patterns/table/toolbar/AlignDropdown.js

@@ -0,0 +1,77 @@
+import { jsxs as s, jsx as n } from "react/jsx-runtime";
+import { AlignLeft as g, AlignCenter as u, AlignRight as h, Check as b } from "@untitledui/icons";
+import { cx as a } from "../../../utils/cn.js";
+import { getEffectiveAlignment as d, getDefaultAlignmentForType as A } from "./tableToolbarHelpers.js";
+import { Dropdown as f } from "../../../primitives/dropdown/dropdown.js";
+import { Button as N } from "../../../primitives/button/button.js";
+const v = [
+  { id: "left", icon: g, label: "Align left" },
+  { id: "center", icon: u, label: "Align center" },
+  { id: "right", icon: h, label: "Align right" }
+];
+function y(i, t) {
+  if (i.length === 0) return null;
+  const o = d(i[0], t);
+  for (let l = 1; l < i.length; l++)
+    if (d(i[l], t) !== o) return null;
+  return o;
+}
+const L = ({
+  schema: i,
+  columnAlignments: t,
+  setColumnAlignments: o,
+  isDisabled: l
+}) => {
+  const m = t.size > 0, p = y(i, t), x = (e) => {
+    const c = /* @__PURE__ */ new Map();
+    for (const r of i)
+      A(r.value_type) !== e && c.set(r.value, e);
+    o(c);
+  };
+  return /* @__PURE__ */ s(f.Root, { children: [
+    /* @__PURE__ */ n(
+      N,
+      {
+        size: "xs",
+        color: "secondary",
+        isDisabled: l,
+        iconLeading: /* @__PURE__ */ n(g, { size: 12 }),
+        className: a(
+          m && "ring-1 ring-brand-600 bg-brand-primary text-brand-600 hover:bg-brand-primary hover:text-brand-600"
+        ),
+        children: "Align"
+      }
+    ),
+    /* @__PURE__ */ n(f.Popover, { className: "w-44", children: /* @__PURE__ */ n("div", { className: "flex flex-col gap-1 py-1 px-2", children: /* @__PURE__ */ n("ul", { className: "flex flex-col", children: v.map((e) => {
+      const c = e.icon, r = p === e.id;
+      return /* @__PURE__ */ s(
+        "li",
+        {
+          className: a([
+            "flex items-center gap-2 rounded-md px-2 py-2",
+            r && "bg-utility-brand-25",
+            !r && "text-secondary hover:bg-primary_hover"
+          ]),
+          children: [
+            /* @__PURE__ */ s(
+              "div",
+              {
+                onClick: () => x(e.id),
+                className: "flex w-full items-center gap-2 text-xs font-medium text-left transition-colors",
+                children: [
+                  /* @__PURE__ */ n(c, { size: 16 }),
+                  /* @__PURE__ */ n("span", { className: "flex-1", children: e.label })
+                ]
+              }
+            ),
+            r && /* @__PURE__ */ n(b, { size: 16, className: "shrink-0 text-brand-600" })
+          ]
+        },
+        e.id
+      );
+    }) }) }) })
+  ] });
+};
+export {
+  L as AlignDropdown
+};

package/dist/patterns/table/toolbar/BasicSortPanel.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+import { LegacySortToolConfig } from './legacyToolbarTypes';
+export declare const BasicSortPanel: FC<{
+    config: LegacySortToolConfig;
+}>;
+//# sourceMappingURL=BasicSortPanel.d.ts.map

package/dist/patterns/table/toolbar/BasicSortPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasicSortPanel.d.ts","sourceRoot":"","sources":["../../../../src/patterns/table/toolbar/BasicSortPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAOhC,OAAO,KAAK,EAAgC,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAuG/F,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC;IAAE,MAAM,EAAE,oBAAoB,CAAA;CAAE,CAmG/D,CAAC"}

package/dist/patterns/table/toolbar/BulkActionBar.d.ts

@@ -0,0 +1,12 @@
+import { FC } from 'react';
+interface BulkActionBarProps {
+    count: number;
+    itemNoun?: string;
+    onDuplicate?: () => void;
+    onDelete?: () => void;
+    onClearSelection: () => void;
+    busy?: boolean;
+}
+export declare const BulkActionBar: FC<BulkActionBarProps>;
+export {};
+//# sourceMappingURL=BulkActionBar.d.ts.map

package/dist/patterns/table/toolbar/BulkActionBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BulkActionBar.d.ts","sourceRoot":"","sources":["../../../../src/patterns/table/toolbar/BulkActionBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAIhC,UAAU,kBAAkB;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAkDhD,CAAC"}

package/dist/patterns/table/toolbar/BulkActionBar.js

@@ -0,0 +1,62 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { Copy01 as d, Trash01 as m, X as x } from "@untitledui/icons";
+import { Button as c } from "../../../primitives/button/button.js";
+const b = ({
+  count: t,
+  itemNoun: r = "row",
+  onDuplicate: n,
+  onDelete: o,
+  onClearSelection: a,
+  busy: i
+}) => {
+  const l = t === 1 ? r : `${r}s`;
+  return /* @__PURE__ */ s("div", { className: "flex justify-between items-center", children: [
+    /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ s("span", { className: "text-xs font-medium text-secondary", children: [
+        t,
+        " ",
+        l,
+        " selected"
+      ] }),
+      n && /* @__PURE__ */ e(
+        c,
+        {
+          size: "xs",
+          color: "secondary",
+          iconLeading: /* @__PURE__ */ e(d, { size: 12 }),
+          onClick: n,
+          isDisabled: i,
+          children: "Duplicate"
+        }
+      ),
+      o && /* @__PURE__ */ e(
+        c,
+        {
+          size: "xs",
+          color: "secondary",
+          iconLeading: /* @__PURE__ */ e(m, { size: 12 }),
+          onClick: o,
+          isDisabled: i,
+          className: "text-error-primary",
+          children: "Delete"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ s(
+      "button",
+      {
+        type: "button",
+        onClick: a,
+        disabled: i,
+        className: "flex items-center gap-1 text-xs font-medium text-brand-700 hover:text-brand-800 cursor-pointer disabled:opacity-50",
+        children: [
+          /* @__PURE__ */ e(x, { size: 12 }),
+          "Clear Selection"
+        ]
+      }
+    )
+  ] });
+};
+export {
+  b as BulkActionBar
+};

package/dist/patterns/table/toolbar/ColumnHeaderMenu.d.ts

@@ -0,0 +1,41 @@
+import { FC, ReactNode } from 'react';
+import { TableColumnMenuSchema } from '../types';
+import { CellAlignment } from './tableToolbarHelpers';
+export type ColumnMenuAction = {
+    type: "sort";
+    direction: "asc" | "desc";
+} | {
+    type: "align";
+    alignment: CellAlignment;
+} | {
+    type: "filter";
+} | {
+    type: "hide";
+} | {
+    type: "lookup-view";
+} | {
+    type: "lookup-edit";
+} | {
+    type: "add-field";
+    side: "left" | "right";
+} | {
+    type: "lookup-delete";
+};
+export interface ColumnMenuCapabilities {
+    sort?: boolean;
+    align?: boolean;
+    filter?: boolean;
+    hide?: boolean;
+}
+interface ColumnHeaderMenuProps {
+    column: TableColumnMenuSchema;
+    columnLabel: string;
+    currentAlignment: CellAlignment;
+    capabilities?: ColumnMenuCapabilities;
+    onAction: (action: ColumnMenuAction) => void;
+    /** Domain-specific rows rendered after variant sections and before universal items. */
+    renderExtraItems?: (column: TableColumnMenuSchema) => ReactNode;
+}
+export declare const ColumnHeaderMenu: FC<ColumnHeaderMenuProps>;
+export {};
+//# sourceMappingURL=ColumnHeaderMenu.d.ts.map

package/dist/patterns/table/toolbar/ColumnHeaderMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnHeaderMenu.d.ts","sourceRoot":"","sources":["../../../../src/patterns/table/toolbar/ColumnHeaderMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAsB1D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE3D,MAAM,MAAM,gBAAgB,GACxB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,KAAK,GAAG,MAAM,CAAA;CAAE,GAC3C;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,SAAS,EAAE,aAAa,CAAA;CAAE,GAC3C;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,GAClB;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAChB;IAAE,IAAI,EAAE,aAAa,CAAA;CAAE,GACvB;IAAE,IAAI,EAAE,aAAa,CAAA;CAAE,GACvB;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAA;CAAE,GAC7C;IAAE,IAAI,EAAE,eAAe,CAAA;CAAE,CAAC;AAE9B,MAAM,WAAW,sBAAsB;IACrC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,UAAU,qBAAqB;IAC7B,MAAM,EAAE,qBAAqB,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,gBAAgB,EAAE,aAAa,CAAC;IAChC,YAAY,CAAC,EAAE,sBAAsB,CAAC;IACtC,QAAQ,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC7C,uFAAuF;IACvF,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,KAAK,SAAS,CAAC;CACjE;AAoDD,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CA6JtD,CAAC"}

package/dist/patterns/table/toolbar/ColumnHeaderMenu.js

@@ -0,0 +1,171 @@
+import { jsxs as n, jsx as e, Fragment as a } from "react/jsx-runtime";
+import { useState as F } from "react";
+import { AlignLeft as D, AlignCenter as H, AlignRight as M, ChevronDown as T, Eye as P, Edit03 as Z, ArrowRight as B, ArrowLeft as E, ArrowDown as G, ArrowUp as I, ChevronRight as S, FilterLines as U, EyeOff as V, Trash01 as $, Check as J } from "@untitledui/icons";
+import { Button as L } from "react-aria-components";
+import { cx as m } from "../../../utils/cn.js";
+import { Dropdown as x } from "../../../primitives/dropdown/dropdown.js";
+const i = ({ icon: o, label: s, danger: d, submenu: r, selected: p, onClick: f }) => /* @__PURE__ */ n(
+  "div",
+  {
+    onClick: f,
+    className: m(
+      "flex items-center gap-2 rounded-md px-2 py-2 text-xs font-medium cursor-pointer transition-colors w-full text-left",
+      d ? "text-error-primary hover:bg-error-primary" : p ? "bg-utility-brand-25 text-secondary" : "text-secondary hover:bg-primary_hover"
+    ),
+    children: [
+      o && /* @__PURE__ */ e(o, { size: 16, className: m("shrink-0", d ? "text-error-primary" : "text-fg-quaternary") }),
+      /* @__PURE__ */ e("span", { className: "flex-1 truncate", children: s }),
+      p && /* @__PURE__ */ e(J, { size: 14, className: "shrink-0 text-brand-600" }),
+      r && /* @__PURE__ */ e(S, { size: 14, className: "shrink-0 text-fg-quaternary" })
+    ]
+  }
+), c = () => /* @__PURE__ */ e("div", { className: "my-1 h-px w-full bg-secondary" }), R = ({ children: o }) => /* @__PURE__ */ e("span", { className: "text-[10px] font-medium uppercase tracking-wider text-tertiary", children: o }), K = ({ label: o, suffix: s }) => /* @__PURE__ */ n("span", { className: "inline-flex items-center gap-1.5 rounded-md border border-secondary bg-primary px-1.5 py-0.5", children: [
+  /* @__PURE__ */ e("span", { className: "flex h-4 w-4 items-center justify-center rounded-sm border border-secondary text-[9px] font-semibold text-tertiary", children: "T" }),
+  /* @__PURE__ */ e("span", { className: "text-xs font-semibold text-primary", children: o }),
+  s && /* @__PURE__ */ e("span", { className: "text-xs text-tertiary", children: s })
+] }), k = [
+  { id: "left", icon: D, label: "Align Left" },
+  { id: "center", icon: H, label: "Align Center" },
+  { id: "right", icon: M, label: "Align Right" }
+], ne = ({
+  column: o,
+  columnLabel: s,
+  currentAlignment: d,
+  capabilities: r,
+  onAction: p,
+  renderExtraItems: f
+}) => {
+  var O;
+  const h = o.variant === "lookup", b = o.variant === "derived", q = h ? "Hide field" : "Hide column", u = (r == null ? void 0 : r.sort) ?? !0, g = (r == null ? void 0 : r.align) ?? !0, y = (r == null ? void 0 : r.filter) ?? !0, v = (r == null ? void 0 : r.hide) ?? !0, [z, C] = F(!1), [_, N] = F(!1), l = (t) => {
+    p(t), N(!1), C(!1);
+  }, w = k.find((t) => t.id === d) ?? k[0], j = w.icon, A = f == null ? void 0 : f(o);
+  return /* @__PURE__ */ n(
+    x.Root,
+    {
+      isOpen: z,
+      onOpenChange: (t) => {
+        C(t), t || N(!1);
+      },
+      children: [
+        /* @__PURE__ */ e(
+          L,
+          {
+            "aria-label": `Open ${s} column menu`,
+            className: m(
+              "flex items-center justify-center rounded p-0.5 outline-none cursor-pointer",
+              "text-fg-quaternary hover:bg-secondary_subtle hover:text-fg-quaternary_hover",
+              "data-[pressed]:bg-secondary_subtle data-[focus-visible]:ring-2 data-[focus-visible]:ring-focus-ring"
+            ),
+            children: /* @__PURE__ */ e(T, { size: 14, className: "stroke-2" })
+          }
+        ),
+        /* @__PURE__ */ e(x.Popover, { className: m(h || b ? "w-72" : "w-56"), children: /* @__PURE__ */ n("div", { className: "flex flex-col py-1 px-1.5", children: [
+          h && /* @__PURE__ */ n(a, { children: [
+            /* @__PURE__ */ n("div", { className: "flex flex-col gap-1.5 px-2 py-2", children: [
+              /* @__PURE__ */ e(R, { children: "Lookup field" }),
+              /* @__PURE__ */ e(K, { label: s, suffix: "Object name" })
+            ] }),
+            /* @__PURE__ */ e(c, {}),
+            /* @__PURE__ */ e(i, { icon: P, label: "View Field", onClick: () => l({ type: "lookup-view" }) }),
+            /* @__PURE__ */ e(i, { icon: Z, label: "Edit field", onClick: () => l({ type: "lookup-edit" }) }),
+            /* @__PURE__ */ e(c, {}),
+            /* @__PURE__ */ e(
+              i,
+              {
+                icon: B,
+                label: "Add field to right",
+                onClick: () => l({ type: "add-field", side: "right" })
+              }
+            ),
+            /* @__PURE__ */ e(
+              i,
+              {
+                icon: E,
+                label: "Add field to left",
+                onClick: () => l({ type: "add-field", side: "left" })
+              }
+            ),
+            /* @__PURE__ */ e(c, {})
+          ] }),
+          b && /* @__PURE__ */ n(a, { children: [
+            /* @__PURE__ */ n("div", { className: "flex flex-col gap-1.5 px-2 py-2", children: [
+              /* @__PURE__ */ e(R, { children: "Formula" }),
+              /* @__PURE__ */ e("div", { className: "text-xs font-medium text-secondary break-words", children: ((O = o.formula) == null ? void 0 : O.trim()) || s })
+            ] }),
+            /* @__PURE__ */ e(c, {})
+          ] }),
+          A,
+          A && (u || g || y || v) && /* @__PURE__ */ e(c, {}),
+          u && /* @__PURE__ */ n(a, { children: [
+            /* @__PURE__ */ e(
+              i,
+              {
+                icon: G,
+                label: "Sort A to Z",
+                onClick: () => l({ type: "sort", direction: "asc" })
+              }
+            ),
+            /* @__PURE__ */ e(
+              i,
+              {
+                icon: I,
+                label: "Sort Z to A",
+                onClick: () => l({ type: "sort", direction: "desc" })
+              }
+            )
+          ] }),
+          g && /* @__PURE__ */ n(a, { children: [
+            u && /* @__PURE__ */ e(c, {}),
+            /* @__PURE__ */ n(x.Root, { isOpen: _, onOpenChange: N, children: [
+              /* @__PURE__ */ n(
+                L,
+                {
+                  className: m(
+                    "flex items-center gap-2 rounded-md px-2 py-2 text-xs font-medium cursor-pointer transition-colors w-full text-left outline-none",
+                    "text-secondary hover:bg-primary_hover",
+                    "data-[focus-visible]:ring-2 data-[focus-visible]:ring-focus-ring"
+                  ),
+                  children: [
+                    /* @__PURE__ */ e(j, { size: 16, className: "shrink-0 text-fg-quaternary" }),
+                    /* @__PURE__ */ e("span", { className: "flex-1 truncate", children: w.label }),
+                    /* @__PURE__ */ e(S, { size: 14, className: "shrink-0 text-fg-quaternary" })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ e(x.Popover, { placement: "right top", className: "w-44", children: /* @__PURE__ */ e("div", { className: "flex flex-col py-1 px-1.5", children: k.map((t) => /* @__PURE__ */ e(
+                i,
+                {
+                  icon: t.icon,
+                  label: t.label,
+                  selected: d === t.id,
+                  onClick: () => l({ type: "align", alignment: t.id })
+                },
+                t.id
+              )) }) })
+            ] })
+          ] }),
+          (y || v) && /* @__PURE__ */ n(a, { children: [
+            (u || g) && /* @__PURE__ */ e(c, {}),
+            y && /* @__PURE__ */ e(i, { icon: U, label: "Filter by", onClick: () => l({ type: "filter" }) }),
+            v && /* @__PURE__ */ e(i, { icon: V, label: q, onClick: () => l({ type: "hide" }) })
+          ] }),
+          h && /* @__PURE__ */ n(a, { children: [
+            /* @__PURE__ */ e(c, {}),
+            /* @__PURE__ */ e(
+              i,
+              {
+                icon: $,
+                label: "Delete fields",
+                danger: !0,
+                onClick: () => l({ type: "lookup-delete" })
+              }
+            )
+          ] })
+        ] }) })
+      ]
+    }
+  );
+};
+export {
+  ne as ColumnHeaderMenu
+};

package/dist/patterns/table/toolbar/GroupByDropdown.d.ts

@@ -0,0 +1,11 @@
+import { FC } from 'react';
+import { TableColumnSchema } from '../types';
+export interface GroupByDropdownProps {
+    schema: TableColumnSchema[];
+    value: string | null;
+    onChange: (next: string | null) => void;
+    labelMeta?: unknown;
+    isDisabled?: boolean;
+}
+export declare const GroupByDropdown: FC<GroupByDropdownProps>;
+//# sourceMappingURL=GroupByDropdown.d.ts.map

package/dist/patterns/table/toolbar/GroupByDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupByDropdown.d.ts","sourceRoot":"","sources":["../../../../src/patterns/table/toolbar/GroupByDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAMhC,OAAO,KAAK,EAAE,iBAAiB,EAAwB,MAAM,UAAU,CAAC;AAIxE,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,iBAAiB,EAAE,CAAC;IAC5B,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAYD,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAqFpD,CAAC"}

package/dist/patterns/table/toolbar/GroupByDropdown.js

@@ -0,0 +1,80 @@
+import { jsxs as a, jsx as r } from "react/jsx-runtime";
+import { useState as f, useEffect as N, useMemo as C } from "react";
+import { cx as B } from "../../../utils/cn.js";
+import { TOOLBAR_ICONS as O } from "../toolbar-icons.js";
+import { resolveColumnLabel as x } from "./tableToolbarHelpers.js";
+import { RadioGroup as R, RadioButton as w } from "./ToolbarRadio.js";
+import { Dropdown as g } from "../../../primitives/dropdown/dropdown.js";
+import { Button as s } from "../../../primitives/button/button.js";
+const L = /* @__PURE__ */ new Set([
+  "string",
+  "number",
+  "currency",
+  "date",
+  "percentage",
+  "decimal_percentage",
+  "link"
+]), V = ({
+  schema: o,
+  value: n,
+  onChange: h,
+  labelMeta: i,
+  isDisabled: y
+}) => {
+  const [l, p] = f(!1), [c, t] = f(n);
+  N(() => {
+    l && t(n);
+  }, [l, n]);
+  const m = C(
+    () => o.filter((e) => e.groupable === !1 ? !1 : e.groupable === !0 ? !0 : e.value_type ? L.has(e.value_type) : !0),
+    [o]
+  ), d = n ? o.find((e) => e.value === n) : void 0, u = d ? x(d, i) : null, b = () => t(null), v = () => {
+    h(c), p(!1);
+  };
+  return /* @__PURE__ */ a(g.Root, { isOpen: l, onOpenChange: p, children: [
+    /* @__PURE__ */ a(
+      s,
+      {
+        size: "xs",
+        color: "secondary",
+        isDisabled: y,
+        iconLeading: /* @__PURE__ */ r("img", { src: O.groupBy, alt: "", className: "h-3 w-3" }),
+        className: B(
+          !!n && "ring-1 ring-brand-600 bg-brand-primary text-brand-600 hover:bg-brand-primary hover:text-brand-600"
+        ),
+        children: [
+          "Group By",
+          u && /* @__PURE__ */ a("span", { className: "ml-1 max-w-[120px] truncate text-xs font-semibold", children: [
+            ": ",
+            u
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ r(g.Popover, { className: "max-h-[60vh]", children: /* @__PURE__ */ a("div", { className: "flex flex-col gap-2 p-[6px]", children: [
+      /* @__PURE__ */ r("div", { className: "max-h-[40vh] overflow-y-auto pr-0.5", children: m.length === 0 ? /* @__PURE__ */ r("p", { className: "px-2 py-3 text-xs text-tertiary", children: "No groupable fields." }) : /* @__PURE__ */ r(
+        R,
+        {
+          value: c ?? "",
+          onChange: (e) => t(e || null),
+          className: "flex flex-col gap-3 px-2 py-2",
+          children: m.map((e) => /* @__PURE__ */ r(
+            w,
+            {
+              value: e.value,
+              label: x(e, i)
+            },
+            e.value
+          ))
+        }
+      ) }),
+      /* @__PURE__ */ a("div", { className: "flex gap-2 pt-1 px-2 pb-2", children: [
+        /* @__PURE__ */ r(s, { color: "secondary", size: "xs", onClick: b, className: "flex-1", children: "Reset" }),
+        /* @__PURE__ */ r(s, { color: "primary", size: "xs", onClick: v, className: "flex-1", children: "Apply" })
+      ] })
+    ] }) })
+  ] });
+};
+export {
+  V as GroupByDropdown
+};

package/dist/patterns/table/toolbar/HideFieldsDropdown.d.ts

@@ -0,0 +1,13 @@
+import { Dispatch, FC, SetStateAction } from 'react';
+import { TableColumnSchema } from '../types';
+export interface HideFieldsDropdownProps {
+    schema: TableColumnSchema[];
+    hiddenColumns: ReadonlySet<string>;
+    setHiddenColumns: Dispatch<SetStateAction<Set<string>>>;
+    columnOrder: readonly string[];
+    setColumnOrder: Dispatch<SetStateAction<string[]>>;
+    labelMeta?: unknown;
+    isDisabled?: boolean;
+}
+export declare const HideFieldsDropdown: FC<HideFieldsDropdownProps>;
+//# sourceMappingURL=HideFieldsDropdown.d.ts.map

package/dist/patterns/table/toolbar/HideFieldsDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HideFieldsDropdown.d.ts","sourceRoot":"","sources":["../../../../src/patterns/table/toolbar/HideFieldsDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAU1D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAGlD,MAAM,WAAW,uBAAuB;IACtC,MAAM,EAAE,iBAAiB,EAAE,CAAC;IAC5B,aAAa,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,gBAAgB,EAAE,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACxD,WAAW,EAAE,SAAS,MAAM,EAAE,CAAC;IAC/B,cAAc,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAsDD,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CA8J1D,CAAC"}