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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/README.md +1 -0
  2. package/dist/applications/schedule-calendar/schedule-calendar.d.ts.map +1 -1
  3. package/dist/applications/schedule-calendar/schedule-calendar.js +24 -22
  4. package/dist/applications/schedule-calendar/utils.d.ts +13 -3
  5. package/dist/applications/schedule-calendar/utils.d.ts.map +1 -1
  6. package/dist/applications/schedule-calendar/utils.js +136 -117
  7. package/dist/patterns/table/TableWrapper.d.ts.map +1 -1
  8. package/dist/patterns/table/TableWrapper.js +776 -661
  9. package/dist/patterns/table/table.d.ts.map +1 -1
  10. package/dist/patterns/table/table.js +44 -43
  11. package/dist/patterns/table/toolbar/AlignDropdown.js +14 -14
  12. package/dist/patterns/table/toolbar/ColumnHeaderMenu.d.ts +9 -0
  13. package/dist/patterns/table/toolbar/ColumnHeaderMenu.d.ts.map +1 -1
  14. package/dist/patterns/table/toolbar/ColumnHeaderMenu.js +115 -81
  15. package/dist/patterns/table/toolbar/SummaryFooter.d.ts.map +1 -1
  16. package/dist/patterns/table/toolbar/SummaryFooter.js +34 -27
  17. package/dist/patterns/table/toolbar/index.d.ts +1 -1
  18. package/dist/patterns/table/toolbar/index.d.ts.map +1 -1
  19. package/dist/patterns/table/toolbar/tableToolbarHelpers.js +1 -1
  20. package/dist/primitives/select/searchable-select.d.ts +5 -3
  21. package/dist/primitives/select/searchable-select.d.ts.map +1 -1
  22. package/dist/primitives/select/searchable-select.js +196 -177
  23. package/dist/primitives/select/select-item.d.ts.map +1 -1
  24. package/dist/primitives/select/select-item.js +70 -54
  25. package/dist/primitives/select/select.d.ts +7 -2
  26. package/dist/primitives/select/select.d.ts.map +1 -1
  27. package/dist/primitives/select/select.js +161 -137
  28. package/dist/primitives/tooltip/ellipsis-content.d.ts.map +1 -1
  29. package/dist/primitives/tooltip/ellipsis-content.js +46 -43
  30. package/dist/styles/components.css +1 -1
  31. package/package.json +1 -1
@@ -1,19 +1,20 @@
1
1
  import { jsxs as u, jsx as e } from "react/jsx-runtime";
2
- import { ChevronDown as C } from "@untitledui/icons";
2
+ import { ChevronDown as w } from "@untitledui/icons";
3
3
  import { Button as A } from "react-aria-components";
4
- import { Table as m } from "../table.js";
4
+ import { Table as c } from "../table.js";
5
5
  import { cx as f } from "../../../utils/cn.js";
6
- import { getEffectiveAlignment as L, getAggregationsForType as j, resolveAggregationValueType as S, AGGREGATION_CELL_LABELS as R } from "./tableToolbarHelpers.js";
6
+ import { getEffectiveAlignment as L, getAggregationsForType as j, resolveAggregationValueType as S, AGGREGATION_CELL_LABELS as T } from "./tableToolbarHelpers.js";
7
7
  import { Dropdown as d } from "../../../primitives/dropdown/dropdown.js";
8
- const T = (n) => n === "right" ? "justify-end" : n === "center" ? "justify-center" : "justify-start", _ = ({
8
+ import { EllipsisContentWithTooltip as E } from "../../../primitives/tooltip/ellipsis-content.js";
9
+ const R = (n) => n === "right" ? "justify-end" : n === "center" ? "justify-center" : "justify-start", _ = ({
9
10
  column: n,
10
11
  aggregation: l,
11
- displayValue: a,
12
+ displayValue: s,
12
13
  align: g,
13
14
  fieldDataTypeMap: p,
14
15
  onChange: b
15
16
  }) => {
16
- const i = j(S(n, p)), s = R[l];
17
+ const i = j(S(n, p)), o = T[l];
17
18
  return /* @__PURE__ */ u(d.Root, { children: [
18
19
  /* @__PURE__ */ u(
19
20
  A,
@@ -21,63 +22,69 @@ const T = (n) => n === "right" ? "justify-end" : n === "center" ? "justify-cente
21
22
  className: f(
22
23
  "group flex w-full items-center gap-2 rounded px-2 py-1 text-xs outline-hidden",
23
24
  "text-tertiary hover:bg-primary_hover cursor-pointer",
24
- T(g)
25
+ R(g)
25
26
  ),
26
- "aria-label": `${s}${a ? `: ${a}` : ""}`,
27
+ "aria-label": `${o}${s ? `: ${s}` : ""}`,
27
28
  children: [
28
29
  /* @__PURE__ */ u("span", { className: "flex items-center gap-1.5 min-w-0", children: [
29
- /* @__PURE__ */ e("span", { className: "font-normal text-tertiary", children: s }),
30
- a && /* @__PURE__ */ e("span", { className: "font-semibold text-secondary truncate", children: a })
30
+ /* @__PURE__ */ e("span", { className: "font-normal text-tertiary shrink-0", children: o }),
31
+ s && /* @__PURE__ */ e(
32
+ E,
33
+ {
34
+ content: s,
35
+ textClassName: "font-semibold text-secondary"
36
+ }
37
+ )
31
38
  ] }),
32
- /* @__PURE__ */ e(C, { size: 12, className: "ml-auto shrink-0 text-fg-quaternary" })
39
+ /* @__PURE__ */ e(w, { size: 14, className: "ml-auto shrink-0 stroke-2 text-fg-quaternary" })
33
40
  ]
34
41
  }
35
42
  ),
36
43
  /* @__PURE__ */ e(d.Popover, { className: "w-44", children: /* @__PURE__ */ e(d.Menu, { selectionMode: "none", onAction: (t) => b(t), children: i.map((t) => /* @__PURE__ */ e(d.Item, { id: t.id, label: t.label, isSelected: l === t.id }, t.id)) }) })
37
44
  ] });
38
- }, k = ({
45
+ }, z = ({
39
46
  schema: n,
40
47
  summaryByColumn: l,
41
- summaryAggregations: a,
48
+ summaryAggregations: s,
42
49
  setSummaryAggregations: g,
43
50
  columnAlignments: p,
44
51
  hasActionsColumn: b,
45
52
  hasSelectionColumn: i = !1,
46
- showBorders: s,
53
+ showBorders: o,
47
54
  fieldDataTypeMap: t
48
55
  }) => {
49
- const v = (r, c) => {
56
+ const v = (r, m) => {
50
57
  g((h) => {
51
- const o = new Map(h);
52
- return c === "count" ? o.delete(r) : o.set(r, c), o;
58
+ const a = new Map(h);
59
+ return m === "count" ? a.delete(r) : a.set(r, m), a;
53
60
  });
54
61
  }, y = i ? "selection" : n.length > 0 ? "first-schema" : "none", x = () => /* @__PURE__ */ e("span", { className: "text-xs font-medium text-tertiary px-2 py-1", children: "Summary" });
55
- return /* @__PURE__ */ u(m.Row, { className: "bg-secondary_subtle hover:bg-secondary_subtle", highlightSelectedRow: !1, children: [
56
- i && /* @__PURE__ */ e(m.Cell, { className: f("relative w-10", s && "border-r border-secondary last:border-r-0"), children: y === "selection" && x() }),
57
- n.map((r, c) => {
58
- const h = a.get(r.value) ?? "count", o = L(r, p), N = y === "first-schema" && c === 0;
62
+ return /* @__PURE__ */ u(c.Row, { className: "bg-secondary_subtle hover:bg-secondary_subtle", highlightSelectedRow: !1, children: [
63
+ i && /* @__PURE__ */ e(c.Cell, { className: f("relative w-10", o && "border-r border-secondary last:border-r-0"), children: y === "selection" && x() }),
64
+ n.map((r, m) => {
65
+ const h = s.get(r.value) ?? "count", a = L(r, p), N = y === "first-schema" && m === 0;
59
66
  return /* @__PURE__ */ e(
60
- m.Cell,
67
+ c.Cell,
61
68
  {
62
- className: f("relative", s && "border-r border-secondary last:border-r-0"),
69
+ className: f("relative", o && "border-r border-secondary last:border-r-0"),
63
70
  children: N ? x() : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center px-3", children: /* @__PURE__ */ e(
64
71
  _,
65
72
  {
66
73
  column: r,
67
74
  aggregation: h,
68
75
  displayValue: l[r.value] ?? "",
69
- align: o,
76
+ align: a,
70
77
  fieldDataTypeMap: t,
71
- onChange: (w) => v(r.value, w)
78
+ onChange: (C) => v(r.value, C)
72
79
  }
73
80
  ) })
74
81
  },
75
82
  r.value
76
83
  );
77
84
  }),
78
- b && /* @__PURE__ */ e(m.Cell, { className: f("relative w-14", s && "border-r border-secondary last:border-r-0") })
85
+ b && /* @__PURE__ */ e(c.Cell, { className: f("relative w-14", o && "border-r border-secondary last:border-r-0") })
79
86
  ] });
80
87
  };
81
88
  export {
82
- k as SummaryFooterRow
89
+ z as SummaryFooterRow
83
90
  };
@@ -10,7 +10,7 @@ export { ShowSummaryDropdown } from './ShowSummaryDropdown';
10
10
  export { SummaryFooterRow } from './SummaryFooter';
11
11
  export type { SummaryFooterRowProps } from './SummaryFooter';
12
12
  export { ColumnHeaderMenu } from './ColumnHeaderMenu';
13
- export type { ColumnMenuAction, ColumnMenuCapabilities } from './ColumnHeaderMenu';
13
+ export type { ColumnMenuAction, ColumnMenuCapabilities, ColumnHeaderMenuFieldDef } from './ColumnHeaderMenu';
14
14
  export { RowActionsMenu } from './RowActionsMenu';
15
15
  export type { RowActionsConfig } from './RowActionsMenu';
16
16
  export { BulkActionBar } from './BulkActionBar';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/patterns/table/toolbar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AACpE,YAAY,EACV,iBAAiB,EACjB,cAAc,EACd,gBAAgB,EAChB,gBAAgB,EAChB,mBAAmB,EACnB,oBAAoB,EACpB,eAAe,EACf,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,YAAY,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAEnF,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAEzD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,yBAAyB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACtF,YAAY,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAC;AACtE,YAAY,EACV,oBAAoB,EACpB,sBAAsB,EACtB,gBAAgB,EAChB,UAAU,GACX,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3E,OAAO,EACL,mBAAmB,EACnB,0BAA0B,EAC1B,qBAAqB,EACrB,cAAc,EACd,sBAAsB,EACtB,kBAAkB,EAClB,SAAS,EACT,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,uBAAuB,CAAC;AAC/B,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/patterns/table/toolbar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AACpE,YAAY,EACV,iBAAiB,EACjB,cAAc,EACd,gBAAgB,EAChB,gBAAgB,EAChB,mBAAmB,EACnB,oBAAoB,EACpB,eAAe,EACf,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,YAAY,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAC;AAE7G,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAEzD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,yBAAyB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACtF,YAAY,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAC;AACtE,YAAY,EACV,oBAAoB,EACpB,sBAAsB,EACtB,gBAAgB,EAChB,UAAU,GACX,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3E,OAAO,EACL,mBAAmB,EACnB,0BAA0B,EAC1B,qBAAqB,EACrB,cAAc,EACd,sBAAsB,EACtB,kBAAkB,EAClB,SAAS,EACT,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,uBAAuB,CAAC;AAC/B,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC"}
@@ -66,7 +66,7 @@ function p(e) {
66
66
  case "currency":
67
67
  case "percentage":
68
68
  case "decimal_percentage":
69
- return "right";
69
+ return "left";
70
70
  default:
71
71
  return "left";
72
72
  }
@@ -24,12 +24,14 @@ export interface SearchableSelectProps extends Omit<AriaSelectProps<SelectItemTy
24
24
  popoverClassName?: string;
25
25
  /** Custom text styles */
26
26
  textStyles?: string;
27
- /** Callback when selection changes */
28
- onSelectionChange?: (key: string) => void;
27
+ /** Callback when selection changes; `null` when cleared */
28
+ onSelectionChange?: (key: string | null) => void;
29
+ /** When true, clicking the already-selected option in the dropdown clears the selection. Default false. */
30
+ isDeselectable?: boolean;
29
31
  /** Placeholder for search input */
30
32
  searchPlaceholder?: string;
31
33
  /** Display text to show when selected item is not in items array */
32
34
  selectedDisplayValue?: string;
33
35
  }
34
- export declare const SearchableSelect: ({ placeholder, placeholderIcon, size, items, label, hint, tooltip, className, textStyles, popoverClassName, onSearchChange, onSelectionChange, isLoading, searchPlaceholder, selectedDisplayValue, ...rest }: SearchableSelectProps) => import("react/jsx-runtime").JSX.Element;
36
+ export declare const SearchableSelect: ({ placeholder, placeholderIcon, size, items, label, hint, tooltip, className, textStyles, popoverClassName, onSearchChange, onSelectionChange, isLoading, isDeselectable, searchPlaceholder, selectedDisplayValue, ...rest }: SearchableSelectProps) => import("react/jsx-runtime").JSX.Element;
35
37
  //# sourceMappingURL=searchable-select.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"searchable-select.d.ts","sourceRoot":"","sources":["../../../src/primitives/select/searchable-select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAO,MAAM,OAAO,CAAC;AAGhD,OAAO,KAAK,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAY5E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAC;AAsBhF,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,eAAe,CAAC,cAAc,CAAC,EAC/B,UAAU,GAAG,OAAO,GAAG,mBAAmB,CAC3C;IACC,iEAAiE;IACjE,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,oEAAoE;IACpE,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,wCAAwC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iCAAiC;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4BAA4B;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,mBAAmB;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,gDAAgD;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wCAAwC;IACxC,eAAe,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;IACjC,gCAAgC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sCAAsC;IACtC,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,mCAAmC;IACnC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,oEAAoE;IACpE,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAkHD,eAAO,MAAM,gBAAgB,GAAI,8MAiB9B,qBAAqB,4CAuIvB,CAAC"}
1
+ {"version":3,"file":"searchable-select.d.ts","sourceRoot":"","sources":["../../../src/primitives/select/searchable-select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAO,MAAM,OAAO,CAAC;AAGhD,OAAO,KAAK,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAY5E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAC;AAsBhF,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,eAAe,CAAC,cAAc,CAAC,EAC/B,UAAU,GAAG,OAAO,GAAG,mBAAmB,CAC3C;IACC,iEAAiE;IACjE,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,oEAAoE;IACpE,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,wCAAwC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iCAAiC;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4BAA4B;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,mBAAmB;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,gDAAgD;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wCAAwC;IACxC,eAAe,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;IACjC,gCAAgC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,2DAA2D;IAC3D,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACjD,2GAA2G;IAC3G,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mCAAmC;IACnC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,oEAAoE;IACpE,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAkHD,eAAO,MAAM,gBAAgB,GAAI,8NAkB9B,qBAAqB,4CAkKvB,CAAC"}
@@ -1,104 +1,104 @@
1
- import { jsx as e, jsxs as u, Fragment as P } from "react/jsx-runtime";
2
- import { useState as V, useCallback as S, isValidElement as q } from "react";
3
- import { ChevronDown as U } from "@untitledui/icons";
4
- import { Select as z, ListBox as B, Button as O, SelectValue as R } from "react-aria-components";
5
- import { Avatar as _ } from "../avatar/avatar.js";
6
- import { HintText as A } from "../input/hint-text.js";
7
- import { Label as E } from "../input/label.js";
8
- import { Popover as F } from "./popover.js";
9
- import { SelectItem as H } from "./select-item.js";
10
- import { SelectContext as K, fontSizes as I, sizes as L } from "./select.js";
11
- import { cx as a } from "../../utils/cn.js";
12
- import { isReactComponent as M } from "../../utils/is-react-component.js";
13
- import G from "./SearchInput.js";
14
- import { LoadingIndicator as J } from "../../applications/loading-indicator/loading-indicator.js";
15
- const Q = {
1
+ import { jsx as t, jsxs as f, Fragment as q } from "react/jsx-runtime";
2
+ import { useState as M, useRef as _, useCallback as w, isValidElement as A } from "react";
3
+ import { ChevronDown as C } from "@untitledui/icons";
4
+ import { Select as E, ListBox as F, Button as H, SelectValue as L } from "react-aria-components";
5
+ import { Avatar as D } from "../avatar/avatar.js";
6
+ import { HintText as G } from "../input/hint-text.js";
7
+ import { Label as J } from "../input/label.js";
8
+ import { Popover as Q } from "./popover.js";
9
+ import { SelectItem as W } from "./select-item.js";
10
+ import { SelectContext as X, fontSizes as S, sizes as Y } from "./select.js";
11
+ import { cx as s } from "../../utils/cn.js";
12
+ import { isReactComponent as Z } from "../../utils/is-react-component.js";
13
+ import $ from "./SearchInput.js";
14
+ import { LoadingIndicator as ee } from "../../applications/loading-indicator/loading-indicator.js";
15
+ const te = {
16
16
  sm: "rounded-md",
17
17
  md: "rounded-md",
18
18
  lg: "rounded-lg"
19
- }, W = {
19
+ }, re = {
20
20
  sm: "text-xs",
21
21
  md: "text-xs",
22
22
  lg: "text-sm"
23
- }, X = "relative flex w-full cursor-pointer items-center bg-primary ring-1 ring-secondary outline-hidden transition duration-100 ease-linear ring-inset", Y = ({
24
- isOpen: N,
25
- isFocused: v,
26
- isDisabled: o,
27
- size: r,
28
- placeholder: f,
23
+ }, le = "relative flex w-full cursor-pointer items-center bg-primary ring-1 ring-secondary outline-hidden transition duration-100 ease-linear ring-inset", ne = ({
24
+ isOpen: P,
25
+ isFocused: R,
26
+ isDisabled: i,
27
+ size: l,
28
+ placeholder: x,
29
29
  placeholderIcon: h,
30
- textStyles: x,
31
- selectedDisplayValue: c
32
- }) => /* @__PURE__ */ e(
33
- O,
30
+ textStyles: g,
31
+ selectedDisplayValue: d
32
+ }) => /* @__PURE__ */ t(
33
+ H,
34
34
  {
35
- className: a(
36
- X,
37
- Q[r],
38
- (v || N) && "ring-1 ring-brand",
39
- o && "cursor-not-allowed bg-disabled_subtle text-disabled"
35
+ className: s(
36
+ le,
37
+ te[l],
38
+ (R || P) && "ring-1 ring-brand",
39
+ i && "cursor-not-allowed bg-disabled_subtle text-disabled"
40
40
  ),
41
- children: /* @__PURE__ */ e(
42
- R,
41
+ children: /* @__PURE__ */ t(
42
+ L,
43
43
  {
44
- className: a(
44
+ className: s(
45
45
  "flex h-max w-full items-center justify-start gap-2 truncate text-left align-middle",
46
46
  "*:data-icon:size-5 *:data-icon:shrink-0 *:data-icon:text-fg-quaternary in-disabled:*:data-icon:text-fg-disabled",
47
- L[r].root
47
+ Y[l].root
48
48
  ),
49
49
  children: (n) => {
50
- var p, g, b, i, y;
51
- const d = ((p = n.selectedItem) == null ? void 0 : p.icon) || h, s = !!n.selectedItem, m = !s && !!c;
52
- return /* @__PURE__ */ u(P, { children: [
53
- (g = n.selectedItem) != null && g.avatarUrl ? /* @__PURE__ */ e(
54
- _,
50
+ var u, o, y, v, I;
51
+ const m = ((u = n.selectedItem) == null ? void 0 : u.icon) || h, c = !!n.selectedItem, a = !c && !!d;
52
+ return /* @__PURE__ */ f(q, { children: [
53
+ (o = n.selectedItem) != null && o.avatarUrl ? /* @__PURE__ */ t(
54
+ D,
55
55
  {
56
56
  size: "sm",
57
57
  src: n.selectedItem.avatarUrl,
58
58
  alt: n.selectedItem.label
59
59
  }
60
- ) : M(d) ? /* @__PURE__ */ e(d, { "data-icon": !0, "aria-hidden": "true" }) : q(d) ? d : null,
61
- s ? /* @__PURE__ */ u("section", { className: "flex w-full gap-2 truncate", children: [
62
- /* @__PURE__ */ e(
60
+ ) : Z(m) ? /* @__PURE__ */ t(m, { "data-icon": !0, "aria-hidden": "true" }) : A(m) ? m : null,
61
+ c ? /* @__PURE__ */ f("section", { className: "flex w-full gap-2 truncate", children: [
62
+ /* @__PURE__ */ t(
63
63
  "p",
64
64
  {
65
- className: a(
65
+ className: s(
66
66
  "truncate font-medium text-primary",
67
- I[r],
68
- x
67
+ S[l],
68
+ g
69
69
  ),
70
- children: (b = n.selectedItem) == null ? void 0 : b.label
70
+ children: (y = n.selectedItem) == null ? void 0 : y.label
71
71
  }
72
72
  ),
73
- ((i = n.selectedItem) == null ? void 0 : i.supportingText) && /* @__PURE__ */ e("p", { className: a("text-tertiary", I[r]), children: (y = n.selectedItem) == null ? void 0 : y.supportingText })
74
- ] }) : m ? /* @__PURE__ */ e("section", { className: "flex w-full gap-2 truncate", children: /* @__PURE__ */ e(
73
+ ((v = n.selectedItem) == null ? void 0 : v.supportingText) && /* @__PURE__ */ t("p", { className: s("text-tertiary", S[l]), children: (I = n.selectedItem) == null ? void 0 : I.supportingText })
74
+ ] }) : a ? /* @__PURE__ */ t("section", { className: "flex w-full gap-2 truncate", children: /* @__PURE__ */ t(
75
75
  "p",
76
76
  {
77
- className: a(
77
+ className: s(
78
78
  "truncate font-medium text-primary",
79
- I[r],
80
- x
79
+ S[l],
80
+ g
81
81
  ),
82
- children: c
82
+ children: d
83
83
  }
84
- ) }) : /* @__PURE__ */ e(
84
+ ) }) : /* @__PURE__ */ t(
85
85
  "p",
86
86
  {
87
- className: a(
87
+ className: s(
88
88
  "text-placeholder_subtle",
89
- I[r],
90
- o && "text-disabled"
89
+ S[l],
90
+ i && "text-disabled"
91
91
  ),
92
- children: f
92
+ children: x
93
93
  }
94
94
  ),
95
- /* @__PURE__ */ e(
96
- U,
95
+ /* @__PURE__ */ t(
96
+ C,
97
97
  {
98
98
  "aria-hidden": "true",
99
- className: a(
99
+ className: s(
100
100
  "ml-auto shrink-0 text-fg-quaternary",
101
- r === "sm" ? "size-4 stroke-[2.5px]" : "size-5"
101
+ l === "sm" ? "size-4 stroke-[2.5px]" : "size-5"
102
102
  )
103
103
  }
104
104
  )
@@ -107,133 +107,152 @@ const Q = {
107
107
  }
108
108
  )
109
109
  }
110
- ), pe = ({
111
- placeholder: N = "Select",
112
- placeholderIcon: v,
113
- size: o = "sm",
114
- items: r,
115
- label: f,
110
+ ), ve = ({
111
+ placeholder: P = "Select",
112
+ placeholderIcon: R,
113
+ size: i = "sm",
114
+ items: l,
115
+ label: x,
116
116
  hint: h,
117
- tooltip: x,
118
- className: c,
117
+ tooltip: g,
118
+ className: d,
119
119
  textStyles: n,
120
- popoverClassName: d,
121
- onSearchChange: s,
122
- onSelectionChange: m,
123
- isLoading: p = !1,
124
- searchPlaceholder: g = "Search...",
125
- selectedDisplayValue: b,
126
- ...i
120
+ popoverClassName: m,
121
+ onSearchChange: c,
122
+ onSelectionChange: a,
123
+ isLoading: u = !1,
124
+ isDeselectable: o = !1,
125
+ searchPlaceholder: y = "Search...",
126
+ selectedDisplayValue: v,
127
+ ...I
127
128
  }) => {
128
- const [y, w] = V(""), T = S(
129
- (l) => {
130
- w(l), s(l);
129
+ const [K, k] = M(""), T = _(!1), { selectedKey: N, ...p } = I, b = N === void 0 ? void 0 : N == null || String(N) === "" ? null : N, V = w(
130
+ (r) => {
131
+ k(r), c(r);
131
132
  },
132
- [s]
133
- ), j = S(
134
- (l) => {
135
- var t;
136
- l || (w(""), s("")), (t = i.onOpenChange) == null || t.call(i, l);
133
+ [c]
134
+ ), j = w(
135
+ (r) => {
136
+ var e;
137
+ r || (k(""), c("")), (e = p.onOpenChange) == null || e.call(p, r);
137
138
  },
138
- [s, i.onOpenChange]
139
- ), k = S(
140
- (l) => {
141
- l !== null && (m == null || m(String(l)));
139
+ [p.onOpenChange, c]
140
+ ), U = w(() => {
141
+ !o || b == null || (T.current = !0, a == null || a(null), j(!1), queueMicrotask(() => {
142
+ T.current = !1;
143
+ }));
144
+ }, [j, o, a, b]), z = w(
145
+ (r) => {
146
+ if (T.current) return;
147
+ const e = r == null || String(r) === "" ? null : String(r);
148
+ e === null && !o || a == null || a(e);
142
149
  },
143
- [m]
144
- ), C = [{ id: "none", label: "none" }], D = r.length > 0 ? r : C;
145
- return /* @__PURE__ */ e(K.Provider, { value: { size: o }, children: /* @__PURE__ */ e(
146
- z,
150
+ [o, a]
151
+ ), B = [{ id: "none", label: "none" }], O = l.length > 0 ? l : B;
152
+ return /* @__PURE__ */ t(
153
+ X.Provider,
147
154
  {
148
- ...i,
149
- onOpenChange: j,
150
- onSelectionChange: k,
151
- className: (l) => a(
152
- "flex flex-col gap-1.5",
153
- typeof c == "function" ? c(l) : c
154
- ),
155
- children: (l) => /* @__PURE__ */ u(P, { children: [
156
- f && /* @__PURE__ */ e(
157
- E,
158
- {
159
- isRequired: l.isRequired,
160
- tooltip: x,
161
- className: W[o],
162
- children: f
163
- }
164
- ),
165
- /* @__PURE__ */ e(
166
- Y,
167
- {
168
- ...l,
169
- size: o,
170
- placeholder: N,
171
- placeholderIcon: v,
172
- textStyles: n,
173
- selectedDisplayValue: b
174
- }
175
- ),
176
- /* @__PURE__ */ u(
177
- F,
178
- {
179
- size: o,
180
- className: a("flex flex-col", d),
181
- children: [
182
- /* @__PURE__ */ e(
183
- "div",
184
- {
185
- className: "sticky top-0 z-10 bg-primary p-1.5",
186
- onMouseDown: (t) => t.stopPropagation(),
187
- onPointerDown: (t) => t.stopPropagation(),
188
- onClick: (t) => t.stopPropagation(),
189
- children: /* @__PURE__ */ e(
190
- G,
155
+ value: {
156
+ size: i,
157
+ isDeselectable: o,
158
+ selectedKey: b,
159
+ onReselectCurrent: o ? U : void 0
160
+ },
161
+ children: /* @__PURE__ */ t(
162
+ E,
163
+ {
164
+ ...p,
165
+ selectedKey: b,
166
+ onOpenChange: j,
167
+ onSelectionChange: z,
168
+ className: (r) => s(
169
+ "flex flex-col gap-1.5",
170
+ typeof d == "function" ? d(r) : d
171
+ ),
172
+ children: (r) => /* @__PURE__ */ f(q, { children: [
173
+ x && /* @__PURE__ */ t(
174
+ J,
175
+ {
176
+ isRequired: r.isRequired,
177
+ tooltip: g,
178
+ className: re[i],
179
+ children: x
180
+ }
181
+ ),
182
+ /* @__PURE__ */ t(
183
+ ne,
184
+ {
185
+ ...r,
186
+ size: i,
187
+ placeholder: P,
188
+ placeholderIcon: R,
189
+ textStyles: n,
190
+ selectedDisplayValue: v
191
+ }
192
+ ),
193
+ /* @__PURE__ */ f(
194
+ Q,
195
+ {
196
+ size: i,
197
+ className: s("flex flex-col", m),
198
+ children: [
199
+ /* @__PURE__ */ t(
200
+ "div",
191
201
  {
192
- size: "sm",
193
- placeholder: g,
194
- value: y,
195
- onChange: (t) => T(t),
196
- onKeyDown: (t) => t.stopPropagation(),
197
- className: "w-full ring-0 outline-hidden bg-secondary rounded-lg"
202
+ className: "sticky top-0 z-10 bg-primary p-1.5",
203
+ onMouseDown: (e) => e.stopPropagation(),
204
+ onPointerDown: (e) => e.stopPropagation(),
205
+ onClick: (e) => e.stopPropagation(),
206
+ children: /* @__PURE__ */ t(
207
+ $,
208
+ {
209
+ size: "sm",
210
+ placeholder: y,
211
+ value: K,
212
+ onChange: (e) => V(e),
213
+ onKeyDown: (e) => e.stopPropagation(),
214
+ className: "w-full ring-0 outline-hidden bg-secondary rounded-lg"
215
+ }
216
+ )
198
217
  }
199
- )
200
- }
201
- ),
202
- /* @__PURE__ */ u("div", { className: "flex-1 overflow-y-auto", children: [
203
- p && /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-6", children: /* @__PURE__ */ e(J, { size: "xs", type: "line-simple" }) }),
204
- !p && r.length === 0 && /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-6", children: /* @__PURE__ */ e("p", { className: "text-sm text-tertiary", children: "No results" }) }),
205
- /* @__PURE__ */ e(
206
- B,
207
- {
208
- items: D,
209
- className: a(
210
- "size-full outline-hidden px-1",
211
- (p || r.length === 0) && "hidden"
212
- ),
213
- children: (t) => /* @__PURE__ */ e(
214
- H,
218
+ ),
219
+ /* @__PURE__ */ f("div", { className: "flex-1 overflow-y-auto", children: [
220
+ u && /* @__PURE__ */ t("div", { className: "flex items-center justify-center py-6", children: /* @__PURE__ */ t(ee, { size: "xs", type: "line-simple" }) }),
221
+ !u && l.length === 0 && /* @__PURE__ */ t("div", { className: "flex items-center justify-center py-6", children: /* @__PURE__ */ t("p", { className: "text-sm text-tertiary", children: "No results" }) }),
222
+ /* @__PURE__ */ t(
223
+ F,
215
224
  {
216
- id: t.id,
217
- label: t.label,
218
- avatarUrl: t.avatarUrl,
219
- supportingText: t.supportingText,
220
- isDisabled: t.isDisabled,
221
- icon: t.icon,
222
- textStyles: n
223
- },
224
- t.id
225
+ items: O,
226
+ className: s(
227
+ "size-full outline-hidden px-1",
228
+ (u || l.length === 0) && "hidden"
229
+ ),
230
+ children: (e) => /* @__PURE__ */ t(
231
+ W,
232
+ {
233
+ id: e.id,
234
+ label: e.label,
235
+ avatarUrl: e.avatarUrl,
236
+ supportingText: e.supportingText,
237
+ isDisabled: e.isDisabled,
238
+ icon: e.icon,
239
+ textStyles: n
240
+ },
241
+ e.id
242
+ )
243
+ }
225
244
  )
226
- }
227
- )
228
- ] })
229
- ]
230
- }
231
- ),
232
- h && /* @__PURE__ */ e(A, { isInvalid: l.isInvalid, children: h })
233
- ] })
245
+ ] })
246
+ ]
247
+ }
248
+ ),
249
+ h && /* @__PURE__ */ t(G, { isInvalid: r.isInvalid, children: h })
250
+ ] })
251
+ }
252
+ )
234
253
  }
235
- ) });
254
+ );
236
255
  };
237
256
  export {
238
- pe as SearchableSelect
257
+ ve as SearchableSelect
239
258
  };
@@ -1 +1 @@
1
- {"version":3,"file":"select-item.d.ts","sourceRoot":"","sources":["../../../src/primitives/select/select-item.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,IAAI,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAMtF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAW/C,UAAU,eACR,SAAQ,IAAI,CAAC,oBAAoB,CAAC,cAAc,CAAC,EAAE,IAAI,CAAC,EAAE,cAAc;IACxE,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,UAAU,GAAI,oHAYxB,eAAe,4CAmGjB,CAAC"}
1
+ {"version":3,"file":"select-item.d.ts","sourceRoot":"","sources":["../../../src/primitives/select/select-item.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,gBAAgB,IAAI,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAMtF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAW/C,UAAU,eACR,SAAQ,IAAI,CAAC,oBAAoB,CAAC,cAAc,CAAC,EAAE,IAAI,CAAC,EAAE,cAAc;IACxE,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,UAAU,GAAI,oHAYxB,eAAe,4CAqIjB,CAAC"}