@bioturing/components 0.20.1 → 0.20.2

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.
@@ -7,12 +7,12 @@ import { Highlight as J, themes as K } from "prism-react-renderer";
7
7
  import './style.css';/* empty css */
8
8
  import { WithAntdTokens as Q } from "../utils/WithAntdTokens.js";
9
9
  import { Segmented as R } from "../segmented/component.js";
10
- import { ScrollArea as U } from "../scroll-area/component.js";
11
- import { reactNodeToString as V } from "../utils/reactToString.js";
12
- import { useControlledState as X } from "../hooks/useControlledState.js";
13
- import { useCls as Y } from "../utils/antdUtils.js";
14
- import { clsx as Z } from "../utils/cn.js";
15
- import { IconButton as H } from "../icon-button/component.js";
10
+ import { reactNodeToString as U } from "../utils/reactToString.js";
11
+ import { useControlledState as V } from "../hooks/useControlledState.js";
12
+ import { useCls as X } from "../utils/antdUtils.js";
13
+ import { clsx as Y } from "../utils/cn.js";
14
+ import { IconButton as Z } from "../icon-button/component.js";
15
+ import { ScrollArea as H } from "../scroll-area/component.js";
16
16
  const fo = ({
17
17
  code: u,
18
18
  children: s,
@@ -29,7 +29,7 @@ const fo = ({
29
29
  maxHeight: c,
30
30
  ...O
31
31
  }) => {
32
- const [i, k] = X(
32
+ const [i, k] = V(
33
33
  x,
34
34
  T,
35
35
  v
@@ -50,7 +50,7 @@ const fo = ({
50
50
  k
51
51
  ]);
52
52
  const [L, a] = p(g), [M, b] = p(!1), D = () => {
53
- const t = l || V(s);
53
+ const t = l || U(s);
54
54
  try {
55
55
  navigator.clipboard.writeText(t).then(() => {
56
56
  a(w), b(!0);
@@ -60,11 +60,11 @@ const fo = ({
60
60
  }
61
61
  }, E = () => {
62
62
  a(g), b(!1);
63
- }, d = Y();
63
+ }, d = X();
64
64
  return /* @__PURE__ */ o(G, { theme: "dark", children: /* @__PURE__ */ _(
65
65
  Q,
66
66
  {
67
- className: Z(d("code-block"), S, e == null ? void 0 : e.root),
67
+ className: Y(d("code-block"), S, e == null ? void 0 : e.root),
68
68
  ...O,
69
69
  children: [
70
70
  h && /* @__PURE__ */ o("div", { className: d("code-block-header", e == null ? void 0 : e.header), children: /* @__PURE__ */ o(
@@ -79,7 +79,7 @@ const fo = ({
79
79
  }
80
80
  ) }),
81
81
  /* @__PURE__ */ o("div", { className: d("code-block-copy"), children: /* @__PURE__ */ o(
82
- H,
82
+ Z,
83
83
  {
84
84
  onClick: D,
85
85
  label: L,
@@ -94,7 +94,7 @@ const fo = ({
94
94
  style: {
95
95
  maxHeight: c && (typeof c == "number" ? `${c}px` : c)
96
96
  },
97
- children: /* @__PURE__ */ o(U, { children: l ? /* @__PURE__ */ o(
97
+ children: /* @__PURE__ */ o(H, { children: l ? /* @__PURE__ */ o(
98
98
  J,
99
99
  {
100
100
  language: A,
@@ -1,28 +1,29 @@
1
1
  "use client";
2
- import { jsx as t, jsxs as v } from "react/jsx-runtime";
3
- import { useCallback as m, useRef as j, createElement as q } from "react";
2
+ import { jsx as e, jsxs as g } from "react/jsx-runtime";
3
+ import { useCallback as M, useRef as j, createElement as q } from "react";
4
4
  import { Menu as f } from "@base-ui-components/react/menu";
5
5
  import { useControlled as F } from "@base-ui-components/react/utils";
6
6
  import { Popover as H } from "@base-ui-components/react/popover";
7
- import { Command as i } from "../cmdk/index.js";
7
+ import { Command as u } from "../cmdk/index.js";
8
8
  import { PopupPanelSize as S } from "../popup-panel/constants.js";
9
9
  import './style.css';/* empty css */
10
10
  import { useCls as J, useAntdCssVarClassname as K, parseAntdPlacement as Q } from "../utils/antdUtils.js";
11
11
  import { Input as X } from "../input/component.js";
12
+ import { ScrollArea as R } from "../scroll-area/component.js";
12
13
  import { DROPDOWN_COLLISION_AVOIDANCE as Y } from "../utils/constants.js";
13
- import { clsx as p } from "../utils/cn.js";
14
- const uo = ({
14
+ import { clsx as d } from "../utils/cn.js";
15
+ const lo = ({
15
16
  children: V,
16
17
  items: _,
17
18
  placement: x,
18
19
  openOnHover: z,
19
20
  open: B,
20
- onOpenChange: g,
21
+ onOpenChange: v,
21
22
  className: O,
22
23
  itemRender: I,
23
24
  classNames: r,
24
- size: w = "auto",
25
- showSearch: u,
25
+ size: C = "auto",
26
+ showSearch: i,
26
27
  searchProps: L = {
27
28
  placeholder: "Search..."
28
29
  }
@@ -31,23 +32,23 @@ const uo = ({
31
32
  controlled: B,
32
33
  default: !1,
33
34
  name: "open"
34
- }), b = m(
35
+ }), m = M(
35
36
  (o) => {
36
- P(o), g == null || g(o);
37
+ P(o), v == null || v(o);
37
38
  },
38
- [P, g]
39
- ), n = J(), k = K(), G = Q(x), U = j(null), y = _.reduce((o, e) => (o.length === 0 && e.type !== "header" && o.push({
39
+ [P, v]
40
+ ), n = J(), c = K(), k = Q(x), U = j(null), w = _.reduce((o, t) => (o.length === 0 && t.type !== "header" && o.push({
40
41
  label: null,
41
42
  items: []
42
- }), e.type === "header" ? o.push({
43
- label: e.title,
43
+ }), t.type === "header" ? o.push({
44
+ label: t.title,
44
45
  items: []
45
- }) : (e.type === "item" || e.type === "divider") && o.length > 0 && o[o.length - 1].items.push(e), o), []), E = u ? i.Separator : f.Separator, h = m(
46
- (o, e, d) => {
47
- const l = u ? i.Item : f.Item;
46
+ }) : (t.type === "item" || t.type === "divider") && o.length > 0 && o[o.length - 1].items.push(t), o), []), G = i ? u.Separator : f.Separator, b = M(
47
+ (o, t, p) => {
48
+ const l = i ? u.Item : f.Item;
48
49
  if (o.type === "item") {
49
- const R = {
50
- className: p(n("dropdown-menu-item"), r == null ? void 0 : r.item),
50
+ const D = {
51
+ className: d(n("dropdown-menu-item"), r == null ? void 0 : r.item),
51
52
  disabled: o.disabled,
52
53
  "data-danger": o.danger,
53
54
  ref: o.ref,
@@ -56,19 +57,19 @@ const uo = ({
56
57
  onMouseLeave: o.onMouseLeave,
57
58
  onMouseOver: o.onMouseOver,
58
59
  onMouseOut: o.onMouseOut,
59
- onSelect: u ? () => {
60
- const C = new MouseEvent("click", {
60
+ onSelect: i ? () => {
61
+ const y = new MouseEvent("click", {
61
62
  bubbles: !0,
62
63
  cancelable: !0
63
64
  });
64
- o.onClick(C), b == null || b(!1);
65
+ o.onClick(y), m == null || m(!1);
65
66
  } : void 0,
66
- render: I ? (C) => I(o, C) : void 0,
67
+ render: I ? (y) => I(o, y) : void 0,
67
68
  children: [
68
- o.icon && /* @__PURE__ */ t(
69
+ o.icon && /* @__PURE__ */ e(
69
70
  "span",
70
71
  {
71
- className: p(
72
+ className: d(
72
73
  n("dropdown-menu-item-icon"),
73
74
  r == null ? void 0 : r.itemIcon
74
75
  ),
@@ -76,128 +77,128 @@ const uo = ({
76
77
  },
77
78
  "icon"
78
79
  ),
79
- /* @__PURE__ */ t("span", { children: o.label }, "label")
80
+ /* @__PURE__ */ e("span", { children: o.label }, "label")
80
81
  ]
81
82
  };
82
- return u ? /* @__PURE__ */ t(i.Item, { ...R }, e + "-" + d) : /* @__PURE__ */ t(l, { ...R }, e + "-" + d);
83
+ return i ? /* @__PURE__ */ e(u.Item, { ...D }, t + "-" + p) : /* @__PURE__ */ e(l, { ...D }, t + "-" + p);
83
84
  } else if (o.type === "divider")
84
- return /* @__PURE__ */ t(
85
- E,
85
+ return /* @__PURE__ */ e(
86
+ G,
86
87
  {
87
- className: p(
88
+ className: d(
88
89
  n("dropdown-menu-divider"),
89
90
  r == null ? void 0 : r.separator
90
91
  )
91
92
  },
92
- e + "-" + d
93
+ t + "-" + p
93
94
  );
94
95
  return null;
95
96
  },
96
- [n, r, I, b, u, E]
97
- ), A = m(
98
- (o, e) => /* @__PURE__ */ v(
97
+ [n, r, I, m, i, G]
98
+ ), A = M(
99
+ (o, t) => /* @__PURE__ */ g(
99
100
  f.Group,
100
101
  {
101
- className: p(n("dropdown-menu-group"), r == null ? void 0 : r.group),
102
+ className: d(n("dropdown-menu-group"), r == null ? void 0 : r.group),
102
103
  children: [
103
- o.label && /* @__PURE__ */ t(
104
+ o.label && /* @__PURE__ */ e(
104
105
  f.GroupLabel,
105
106
  {
106
- className: p(
107
+ className: d(
107
108
  n("dropdown-menu-header"),
108
109
  r == null ? void 0 : r.groupLabel
109
110
  ),
110
- children: /* @__PURE__ */ t("span", { children: o.label })
111
+ children: /* @__PURE__ */ e("span", { children: o.label })
111
112
  }
112
113
  ),
113
- o.items.map((d, l) => h(d, e, l))
114
+ o.items.map((p, l) => b(p, t, l))
114
115
  ]
115
116
  },
116
- "group" + e
117
+ "group" + t
117
118
  ),
118
- [n, r, h]
119
- ), D = m(
120
- (o, e) => o.label ? /* @__PURE__ */ t(
121
- i.Group,
119
+ [n, r, b]
120
+ ), E = M(
121
+ (o, t) => o.label ? /* @__PURE__ */ e(
122
+ u.Group,
122
123
  {
123
- className: p(n("dropdown-menu-group"), r == null ? void 0 : r.group),
124
- heading: /* @__PURE__ */ t(
124
+ className: d(n("dropdown-menu-group"), r == null ? void 0 : r.group),
125
+ heading: /* @__PURE__ */ e(
125
126
  f.GroupLabel,
126
127
  {
127
- className: p(
128
+ className: d(
128
129
  n("dropdown-menu-header"),
129
130
  r == null ? void 0 : r.groupLabel
130
131
  ),
131
- children: /* @__PURE__ */ t("span", { children: o.label })
132
+ children: /* @__PURE__ */ e("span", { children: o.label })
132
133
  }
133
134
  ),
134
- children: o.items.map((d, l) => h(d, e, l))
135
+ children: o.items.map((p, l) => b(p, t, l))
135
136
  },
136
- "group" + e
137
- ) : o.items.map((d, l) => h(d, e, l)),
138
- [n, r, h]
139
- ), W = m(
140
- () => u ? /* @__PURE__ */ v(i, { children: [
137
+ "group" + t
138
+ ) : o.items.map((p, l) => b(p, t, l)),
139
+ [n, r, b]
140
+ ), W = M(
141
+ () => i ? /* @__PURE__ */ g(u, { className: n("dropdown-menu-container"), children: [
141
142
  /* @__PURE__ */ q(
142
- i.Input,
143
+ u.Input,
143
144
  {
144
145
  ...L,
145
146
  key: "search",
146
- render: /* @__PURE__ */ t(X, { allowClear: !0, className: n("dropdown-menu-search") })
147
+ render: /* @__PURE__ */ e(X, { allowClear: !0, className: n("dropdown-menu-search") })
147
148
  }
148
149
  ),
149
- /* @__PURE__ */ v(i.List, { children: [
150
- /* @__PURE__ */ t(i.Empty, { className: n("dropdown-menu-empty"), children: "No results found." }),
151
- y.map(D)
152
- ] })
153
- ] }) : y.map(A),
150
+ /* @__PURE__ */ e(R, { children: /* @__PURE__ */ g(u.List, { className: n("dropdown-menu-list"), children: [
151
+ /* @__PURE__ */ e(u.Empty, { className: n("dropdown-menu-empty"), children: "No results found." }),
152
+ w.map(E)
153
+ ] }) })
154
+ ] }) : /* @__PURE__ */ e("div", { className: n("dropdown-menu-container"), children: /* @__PURE__ */ e(R, { children: w.map(A) }) }),
154
155
  [
155
- u,
156
- y,
157
- D,
156
+ i,
157
+ w,
158
+ E,
158
159
  A,
159
160
  L,
160
161
  n
161
162
  ]
162
- ), M = u ? H : f;
163
- return /* @__PURE__ */ v(
164
- M.Root,
163
+ ), h = i ? H : f;
164
+ return /* @__PURE__ */ g(
165
+ h.Root,
165
166
  {
166
167
  openOnHover: z,
167
168
  open: T,
168
- onOpenChange: b,
169
+ onOpenChange: m,
169
170
  children: [
170
- /* @__PURE__ */ t(
171
- M.Trigger,
171
+ /* @__PURE__ */ e(
172
+ h.Trigger,
172
173
  {
173
174
  render: V,
174
175
  ref: U,
175
- className: p(
176
+ className: d(
176
177
  n("dropdown-menu-trigger"),
177
178
  r == null ? void 0 : r.trigger,
178
- k
179
+ c
179
180
  )
180
181
  }
181
182
  ),
182
- /* @__PURE__ */ t(M.Portal, { children: /* @__PURE__ */ t(
183
- M.Positioner,
183
+ /* @__PURE__ */ e(h.Portal, { children: /* @__PURE__ */ e(
184
+ h.Positioner,
184
185
  {
185
- side: G.placement,
186
- align: G.align,
186
+ side: k.placement,
187
+ align: k.align,
187
188
  sideOffset: 4,
188
- className: p(n("dropdown-menu-root"), r == null ? void 0 : r.root),
189
+ className: d(n("dropdown-menu-root"), r == null ? void 0 : r.root),
189
190
  collisionAvoidance: Y,
190
- children: /* @__PURE__ */ t(
191
- M.Popup,
191
+ children: /* @__PURE__ */ e(
192
+ h.Popup,
192
193
  {
193
- className: p(
194
+ className: d(
194
195
  n("dropdown-menu"),
195
196
  O,
196
197
  r == null ? void 0 : r.popup,
197
- k
198
+ c
198
199
  ),
199
200
  style: {
200
- "--size-width": w in S ? S[w] : void 0
201
+ "--size-width": C in S ? S[C] : void 0
201
202
  },
202
203
  children: W()
203
204
  }
@@ -209,6 +210,6 @@ const uo = ({
209
210
  );
210
211
  };
211
212
  export {
212
- uo as DropdownMenu
213
+ lo as DropdownMenu
213
214
  };
214
215
  //# sourceMappingURL=component.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"component.js","sources":["../../../src/components/dropdown-menu/component.tsx"],"sourcesContent":["\"use client\";\nimport { Menu } from \"@base-ui-components/react/menu\";\nimport { useControlled } from \"@base-ui-components/react/utils\";\nimport { Popover } from \"@base-ui-components/react/popover\";\nimport { type PopoverProps } from \"antd/es/popover\";\nimport { Ref, useCallback, useRef } from \"react\";\nimport {\n clsx,\n DROPDOWN_COLLISION_AVOIDANCE,\n parseAntdPlacement,\n useAntdCssVarClassname,\n useCls,\n} from \"../utils\";\nimport { Command } from \"../cmdk\";\n\n// Import component-specific styles\nimport { Input } from \"../input\";\nimport { PopupPanelSize } from \"../popup-panel/constants\";\n\nimport \"./style.css\";\n\nexport type DropdownMenuItemType =\n | {\n type: \"item\";\n label?: React.ReactNode;\n disabled?: boolean;\n icon?: React.ReactNode;\n key: React.Key;\n onClick?: React.HTMLAttributes<HTMLElement>[\"onClick\"];\n onMouseEnter?: React.HTMLAttributes<HTMLElement>[\"onMouseEnter\"];\n onMouseLeave?: React.HTMLAttributes<HTMLElement>[\"onMouseLeave\"];\n onMouseOver?: React.HTMLAttributes<HTMLElement>[\"onMouseOver\"];\n onMouseOut?: React.HTMLAttributes<HTMLElement>[\"onMouseOut\"];\n danger?: boolean;\n ref?: React.Ref<HTMLElement>;\n }\n | {\n type: \"divider\";\n }\n | {\n type: \"header\";\n title?: React.ReactNode;\n };\n\nexport interface DropdownMenuProps {\n /** Array of menu items to be displayed in the dropdown */\n items: DropdownMenuItemType[];\n /** Custom render function for the trigger element */\n children?: React.ComponentProps<typeof Menu.Trigger>[\"render\"];\n /**\n * Placement of the dropdown relative to the trigger element\n * @default \"bottomLeft\"\n */\n placement?: PopoverProps[\"placement\"];\n /**\n * Whether to open the dropdown on hover instead of click\n * @default false\n */\n openOnHover?: boolean;\n /**\n * Controlled open state of the dropdown\n */\n open?: boolean;\n /**\n * Callback fired when the dropdown open state changes\n */\n onOpenChange?: (open: boolean) => void;\n /**\n * Additional CSS class for the dropdown component\n */\n className?: string;\n /**\n * Custom class names for different parts of the dropdown\n * @default {}\n */\n classNames?: {\n root?: string;\n trigger?: string;\n popup?: string;\n group?: string;\n groupLabel?: string;\n item?: string;\n itemIcon?: string;\n itemText?: string;\n separator?: string;\n positioner?: string;\n };\n /**\n * Custom render function for menu items\n */\n itemRender?: (\n item: DropdownMenuItemType,\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n /**\n * Whether to show search input\n * @default false\n */\n showSearch?: boolean;\n /**\n * Size of the dropdown menu\n * @default \"auto\"\n */\n size?: \"auto\" | keyof typeof PopupPanelSize;\n /**\n * Search placeholder\n */\n searchProps?: Omit<\n React.ComponentProps<typeof Command.Input>,\n \"size\" | \"ref\"\n >;\n /**\n *\n */\n}\n\ninterface DropdownMenuGroup {\n label: React.ReactNode | null;\n items: DropdownMenuItemType[];\n}\n\nexport const DropdownMenu = ({\n children,\n items,\n placement,\n openOnHover,\n open: outsideOpen,\n onOpenChange: outsideOnOpenChange,\n className,\n itemRender,\n classNames,\n size = \"auto\",\n showSearch,\n searchProps = {\n placeholder: \"Search...\",\n },\n}: DropdownMenuProps) => {\n const [open, setOpen] = useControlled({\n controlled: outsideOpen,\n default: false,\n name: \"open\",\n });\n const onOpenChange = useCallback(\n (newValue: boolean) => {\n setOpen(newValue);\n outsideOnOpenChange?.(newValue);\n },\n [setOpen, outsideOnOpenChange]\n );\n const cls = useCls();\n const antdCssVarClassname = useAntdCssVarClassname();\n const headlessUIPlacement = parseAntdPlacement(placement);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const itemGroups = items.reduce<DropdownMenuGroup[]>((acc, current) => {\n // If no groups exist yet and current item is not a header, create default group\n if (acc.length === 0 && current.type !== \"header\") {\n acc.push({\n label: null,\n items: [],\n });\n }\n\n // If it's a header, create a new group\n if (current.type === \"header\") {\n acc.push({\n label: current.title,\n items: [],\n });\n }\n // If it's an item and we have at least one group, add it to the last group's items\n else if (\n (current.type === \"item\" || current.type === \"divider\") &&\n acc.length > 0\n ) {\n acc[acc.length - 1].items.push(current);\n }\n // Skip dividers\n return acc;\n }, []);\n\n const MenuSeparator = showSearch ? Command.Separator : Menu.Separator;\n\n const renderMenuItem = useCallback(\n (item: DropdownMenuItemType, i: number, j: number) => {\n const MenuItem = showSearch ? Command.Item : Menu.Item;\n\n if (item.type === \"item\") {\n const props = {\n className: clsx(cls(\"dropdown-menu-item\"), classNames?.item),\n disabled: item.disabled,\n \"data-danger\": item.danger,\n ref: item.ref as Ref<HTMLDivElement>,\n onClick: item.onClick,\n onMouseEnter: item.onMouseEnter,\n onMouseLeave: item.onMouseLeave,\n onMouseOver: item.onMouseOver,\n onMouseOut: item.onMouseOut,\n onSelect: showSearch\n ? () => {\n const e = new MouseEvent(\"click\", {\n bubbles: true,\n cancelable: true,\n }) as unknown as React.MouseEvent<HTMLElement, MouseEvent>;\n item.onClick(e);\n onOpenChange?.(false);\n }\n : undefined,\n render: itemRender\n ? (itemProps: React.HTMLAttributes<HTMLElement>) =>\n itemRender(item, itemProps)\n : undefined,\n children: [\n item.icon && (\n <span\n key=\"icon\"\n className={clsx(\n cls(\"dropdown-menu-item-icon\"),\n classNames?.itemIcon\n )}\n >\n {item.icon}\n </span>\n ),\n <span key=\"label\">{item.label}</span>,\n ],\n };\n return showSearch ? (\n <Command.Item key={i + \"-\" + j} {...props}></Command.Item>\n ) : (\n <MenuItem key={i + \"-\" + j} {...props}></MenuItem>\n );\n } else if (item.type === \"divider\") {\n return (\n <MenuSeparator\n key={i + \"-\" + j}\n className={clsx(\n cls(\"dropdown-menu-divider\"),\n classNames?.separator\n )}\n />\n );\n }\n return null;\n },\n [cls, classNames, itemRender, onOpenChange, showSearch, MenuSeparator]\n );\n\n const renderGroup = useCallback(\n (group: DropdownMenuGroup, index: number) => (\n <Menu.Group\n key={\"group\" + index}\n className={clsx(cls(\"dropdown-menu-group\"), classNames?.group)}\n >\n {group.label && (\n <Menu.GroupLabel\n className={clsx(\n cls(\"dropdown-menu-header\"),\n classNames?.groupLabel\n )}\n >\n <span>{group.label}</span>\n </Menu.GroupLabel>\n )}\n {group.items.map((item, j) => renderMenuItem(item, index, j))}\n </Menu.Group>\n ),\n [cls, classNames, renderMenuItem]\n );\n\n const renderGroupShowSearch = useCallback(\n (group: DropdownMenuGroup, index: number) =>\n group.label ? (\n <Command.Group\n key={\"group\" + index}\n className={clsx(cls(\"dropdown-menu-group\"), classNames?.group)}\n heading={\n <Menu.GroupLabel\n className={clsx(\n cls(\"dropdown-menu-header\"),\n classNames?.groupLabel\n )}\n >\n <span>{group.label}</span>\n </Menu.GroupLabel>\n }\n >\n {group.items.map((item, j) => renderMenuItem(item, index, j))}\n </Command.Group>\n ) : (\n group.items.map((item, j) => renderMenuItem(item, index, j))\n ),\n [cls, classNames, renderMenuItem]\n );\n\n const renderMenuInner = useCallback(\n () =>\n showSearch ? (\n <Command>\n <Command.Input\n {...searchProps}\n key=\"search\"\n render={\n <Input allowClear className={cls(\"dropdown-menu-search\")} />\n }\n />\n <Command.List>\n <Command.Empty className={cls(\"dropdown-menu-empty\")}>\n No results found.\n </Command.Empty>\n {itemGroups.map(renderGroupShowSearch)}\n </Command.List>\n </Command>\n ) : (\n itemGroups.map(renderGroup)\n ),\n [\n showSearch,\n itemGroups,\n renderGroupShowSearch,\n renderGroup,\n searchProps,\n cls,\n ]\n );\n\n const BaseComponent = showSearch ? Popover : Menu;\n\n return (\n <BaseComponent.Root\n openOnHover={openOnHover}\n open={open}\n onOpenChange={onOpenChange}\n >\n <BaseComponent.Trigger\n render={children}\n ref={buttonRef}\n className={clsx(\n cls(\"dropdown-menu-trigger\"),\n classNames?.trigger,\n antdCssVarClassname\n )}\n />\n <BaseComponent.Portal>\n <BaseComponent.Positioner\n side={headlessUIPlacement.placement}\n align={headlessUIPlacement.align}\n sideOffset={4}\n className={clsx(cls(\"dropdown-menu-root\"), classNames?.root)}\n collisionAvoidance={DROPDOWN_COLLISION_AVOIDANCE}\n >\n <BaseComponent.Popup\n className={clsx(\n cls(\"dropdown-menu\"),\n className,\n classNames?.popup,\n antdCssVarClassname\n )}\n style={\n {\n \"--size-width\":\n size in PopupPanelSize ? PopupPanelSize[size] : undefined,\n } as React.CSSProperties\n }\n >\n {renderMenuInner()}\n </BaseComponent.Popup>\n </BaseComponent.Positioner>\n </BaseComponent.Portal>\n </BaseComponent.Root>\n );\n};\n"],"names":["DropdownMenu","children","items","placement","openOnHover","outsideOpen","outsideOnOpenChange","className","itemRender","classNames","size","showSearch","searchProps","open","setOpen","useControlled","onOpenChange","useCallback","newValue","cls","useCls","antdCssVarClassname","useAntdCssVarClassname","headlessUIPlacement","parseAntdPlacement","buttonRef","useRef","itemGroups","acc","current","MenuSeparator","Command","Menu","renderMenuItem","item","i","j","MenuItem","props","clsx","e","itemProps","jsx","renderGroup","group","index","jsxs","renderGroupShowSearch","renderMenuInner","createElement","Input","BaseComponent","Popover","DROPDOWN_COLLISION_AVOIDANCE","PopupPanelSize"],"mappings":";;;;;;;;;;;;;AAyHO,MAAMA,KAAe,CAAC;AAAA,EAC3B,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,MAAMC;AAAA,EACN,cAAcC;AAAA,EACd,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,YAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,IACZ,aAAa;AAAA,EAAA;AAEjB,MAAyB;AACvB,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAc;AAAA,IACpC,YAAYV;AAAA,IACZ,SAAS;AAAA,IACT,MAAM;AAAA,EAAA,CACP,GACKW,IAAeC;AAAA,IACnB,CAACC,MAAsB;AACrB,MAAAJ,EAAQI,CAAQ,GAChBZ,KAAA,QAAAA,EAAsBY;AAAA,IACxB;AAAA,IACA,CAACJ,GAASR,CAAmB;AAAA,EAC/B,GACMa,IAAMC,EAAO,GACbC,IAAsBC,EAAuB,GAC7CC,IAAsBC,EAAmBrB,CAAS,GAClDsB,IAAYC,EAA0B,IAAI,GAC1CC,IAAazB,EAAM,OAA4B,CAAC0B,GAAKC,OAErDD,EAAI,WAAW,KAAKC,EAAQ,SAAS,YACvCD,EAAI,KAAK;AAAA,IACP,OAAO;AAAA,IACP,OAAO,CAAA;AAAA,EAAC,CACT,GAICC,EAAQ,SAAS,WACnBD,EAAI,KAAK;AAAA,IACP,OAAOC,EAAQ;AAAA,IACf,OAAO,CAAA;AAAA,EAAC,CACT,KAIAA,EAAQ,SAAS,UAAUA,EAAQ,SAAS,cAC7CD,EAAI,SAAS,KAEbA,EAAIA,EAAI,SAAS,CAAC,EAAE,MAAM,KAAKC,CAAO,GAGjCD,IACN,EAAE,GAECE,IAAgBnB,IAAaoB,EAAQ,YAAYC,EAAK,WAEtDC,IAAiBhB;AAAA,IACrB,CAACiB,GAA4BC,GAAWC,MAAc;AACpD,YAAMC,IAAW1B,IAAaoB,EAAQ,OAAOC,EAAK;AAE9C,UAAAE,EAAK,SAAS,QAAQ;AACxB,cAAMI,IAAQ;AAAA,UACZ,WAAWC,EAAKpB,EAAI,oBAAoB,GAAGV,KAAA,gBAAAA,EAAY,IAAI;AAAA,UAC3D,UAAUyB,EAAK;AAAA,UACf,eAAeA,EAAK;AAAA,UACpB,KAAKA,EAAK;AAAA,UACV,SAASA,EAAK;AAAA,UACd,cAAcA,EAAK;AAAA,UACnB,cAAcA,EAAK;AAAA,UACnB,aAAaA,EAAK;AAAA,UAClB,YAAYA,EAAK;AAAA,UACjB,UAAUvB,IACN,MAAM;AACE,kBAAA6B,IAAI,IAAI,WAAW,SAAS;AAAA,cAChC,SAAS;AAAA,cACT,YAAY;AAAA,YAAA,CACb;AACD,YAAAN,EAAK,QAAQM,CAAC,GACdxB,KAAA,QAAAA,EAAe;AAAA,UAAK,IAEtB;AAAA,UACJ,QAAQR,IACJ,CAACiC,MACCjC,EAAW0B,GAAMO,CAAS,IAC5B;AAAA,UACJ,UAAU;AAAA,YACRP,EAAK,QACH,gBAAAQ;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,WAAWH;AAAA,kBACTpB,EAAI,yBAAyB;AAAA,kBAC7BV,KAAA,gBAAAA,EAAY;AAAA,gBACd;AAAA,gBAEC,UAAKyB,EAAA;AAAA,cAAA;AAAA,cANF;AAAA,YAON;AAAA,YAED,gBAAAQ,EAAA,QAAA,EAAkB,UAAKR,EAAA,MAAA,GAAd,OAAoB;AAAA,UAAA;AAAA,QAElC;AACA,eAAOvB,IACJ,gBAAA+B,EAAAX,EAAQ,MAAR,EAAgC,GAAGO,EAAjB,GAAAH,IAAI,MAAMC,CAAc,IAE1C,gBAAAM,EAAAL,GAAA,EAA4B,GAAGC,EAAjB,GAAAH,IAAI,MAAMC,CAAc;AAAA,MAAA,WAEhCF,EAAK,SAAS;AAErB,eAAA,gBAAAQ;AAAA,UAACZ;AAAA,UAAA;AAAA,YAEC,WAAWS;AAAA,cACTpB,EAAI,uBAAuB;AAAA,cAC3BV,KAAA,gBAAAA,EAAY;AAAA,YAAA;AAAA,UACd;AAAA,UAJK0B,IAAI,MAAMC;AAAA,QAKjB;AAGG,aAAA;AAAA,IACT;AAAA,IACA,CAACjB,GAAKV,GAAYD,GAAYQ,GAAcL,GAAYmB,CAAa;AAAA,EACvE,GAEMa,IAAc1B;AAAA,IAClB,CAAC2B,GAA0BC,MACzB,gBAAAC;AAAA,MAACd,EAAK;AAAA,MAAL;AAAA,QAEC,WAAWO,EAAKpB,EAAI,qBAAqB,GAAGV,KAAA,gBAAAA,EAAY,KAAK;AAAA,QAE5D,UAAA;AAAA,UAAAmC,EAAM,SACL,gBAAAF;AAAA,YAACV,EAAK;AAAA,YAAL;AAAA,cACC,WAAWO;AAAA,gBACTpB,EAAI,sBAAsB;AAAA,gBAC1BV,KAAA,gBAAAA,EAAY;AAAA,cACd;AAAA,cAEA,UAAA,gBAAAiC,EAAC,QAAM,EAAA,UAAAE,EAAM,MAAM,CAAA;AAAA,YAAA;AAAA,UACrB;AAAA,UAEDA,EAAM,MAAM,IAAI,CAACV,GAAME,MAAMH,EAAeC,GAAMW,GAAOT,CAAC,CAAC;AAAA,QAAA;AAAA,MAAA;AAAA,MAbvD,UAAUS;AAAA,IAcjB;AAAA,IAEF,CAAC1B,GAAKV,GAAYwB,CAAc;AAAA,EAClC,GAEMc,IAAwB9B;AAAA,IAC5B,CAAC2B,GAA0BC,MACzBD,EAAM,QACJ,gBAAAF;AAAA,MAACX,EAAQ;AAAA,MAAR;AAAA,QAEC,WAAWQ,EAAKpB,EAAI,qBAAqB,GAAGV,KAAA,gBAAAA,EAAY,KAAK;AAAA,QAC7D,SACE,gBAAAiC;AAAA,UAACV,EAAK;AAAA,UAAL;AAAA,YACC,WAAWO;AAAA,cACTpB,EAAI,sBAAsB;AAAA,cAC1BV,KAAA,gBAAAA,EAAY;AAAA,YACd;AAAA,YAEA,UAAA,gBAAAiC,EAAC,QAAM,EAAA,UAAAE,EAAM,MAAM,CAAA;AAAA,UAAA;AAAA,QACrB;AAAA,QAGD,UAAAA,EAAM,MAAM,IAAI,CAACV,GAAME,MAAMH,EAAeC,GAAMW,GAAOT,CAAC,CAAC;AAAA,MAAA;AAAA,MAbvD,UAAUS;AAAA,IAcjB,IAEAD,EAAM,MAAM,IAAI,CAACV,GAAME,MAAMH,EAAeC,GAAMW,GAAOT,CAAC,CAAC;AAAA,IAE/D,CAACjB,GAAKV,GAAYwB,CAAc;AAAA,EAClC,GAEMe,IAAkB/B;AAAA,IACtB,MACEN,IACE,gBAAAmC,EAACf,GACC,EAAA,UAAA;AAAA,MAAA,gBAAAkB;AAAA,QAAClB,EAAQ;AAAA,QAAR;AAAA,UACE,GAAGnB;AAAA,UACJ,KAAI;AAAA,UACJ,0BACGsC,GAAM,EAAA,YAAU,IAAC,WAAW/B,EAAI,sBAAsB,EAAG,CAAA;AAAA,QAAA;AAAA,MAE9D;AAAA,MACA,gBAAA2B,EAACf,EAAQ,MAAR,EACC,UAAA;AAAA,QAAA,gBAAAW,EAACX,EAAQ,OAAR,EAAc,WAAWZ,EAAI,qBAAqB,GAAG,UAEtD,qBAAA;AAAA,QACCQ,EAAW,IAAIoB,CAAqB;AAAA,MAAA,EACvC,CAAA;AAAA,IACF,EAAA,CAAA,IAEApB,EAAW,IAAIgB,CAAW;AAAA,IAE9B;AAAA,MACEhC;AAAA,MACAgB;AAAA,MACAoB;AAAA,MACAJ;AAAA,MACA/B;AAAA,MACAO;AAAA,IAAA;AAAA,EAEJ,GAEMgC,IAAgBxC,IAAayC,IAAUpB;AAG3C,SAAA,gBAAAc;AAAA,IAACK,EAAc;AAAA,IAAd;AAAA,MACC,aAAA/C;AAAA,MACA,MAAAS;AAAA,MACA,cAAAG;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAA0B;AAAA,UAACS,EAAc;AAAA,UAAd;AAAA,YACC,QAAQlD;AAAA,YACR,KAAKwB;AAAA,YACL,WAAWc;AAAA,cACTpB,EAAI,uBAAuB;AAAA,cAC3BV,KAAA,gBAAAA,EAAY;AAAA,cACZY;AAAA,YAAA;AAAA,UACF;AAAA,QACF;AAAA,QACA,gBAAAqB,EAACS,EAAc,QAAd,EACC,UAAA,gBAAAT;AAAA,UAACS,EAAc;AAAA,UAAd;AAAA,YACC,MAAM5B,EAAoB;AAAA,YAC1B,OAAOA,EAAoB;AAAA,YAC3B,YAAY;AAAA,YACZ,WAAWgB,EAAKpB,EAAI,oBAAoB,GAAGV,KAAA,gBAAAA,EAAY,IAAI;AAAA,YAC3D,oBAAoB4C;AAAA,YAEpB,UAAA,gBAAAX;AAAA,cAACS,EAAc;AAAA,cAAd;AAAA,gBACC,WAAWZ;AAAA,kBACTpB,EAAI,eAAe;AAAA,kBACnBZ;AAAA,kBACAE,KAAA,gBAAAA,EAAY;AAAA,kBACZY;AAAA,gBACF;AAAA,gBACA,OACE;AAAA,kBACE,gBACEX,KAAQ4C,IAAiBA,EAAe5C,CAAI,IAAI;AAAA,gBACpD;AAAA,gBAGD,UAAgBsC,EAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UACnB;AAAA,QAAA,EAEJ,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF;AAEJ;"}
1
+ {"version":3,"file":"component.js","sources":["../../../src/components/dropdown-menu/component.tsx"],"sourcesContent":["\"use client\";\nimport { Menu } from \"@base-ui-components/react/menu\";\nimport { useControlled } from \"@base-ui-components/react/utils\";\nimport { Popover } from \"@base-ui-components/react/popover\";\nimport { type PopoverProps } from \"antd/es/popover\";\nimport { Ref, useCallback, useRef } from \"react\";\nimport {\n clsx,\n DROPDOWN_COLLISION_AVOIDANCE,\n parseAntdPlacement,\n useAntdCssVarClassname,\n useCls,\n} from \"../utils\";\nimport { Command } from \"../cmdk\";\nimport { ScrollArea } from \"../scroll-area\";\n\n// Import component-specific styles\nimport { Input } from \"../input\";\nimport { PopupPanelSize } from \"../popup-panel/constants\";\n\nimport \"./style.css\";\n\nexport type DropdownMenuItemType =\n | {\n type: \"item\";\n label?: React.ReactNode;\n disabled?: boolean;\n icon?: React.ReactNode;\n key: React.Key;\n onClick?: React.HTMLAttributes<HTMLElement>[\"onClick\"];\n onMouseEnter?: React.HTMLAttributes<HTMLElement>[\"onMouseEnter\"];\n onMouseLeave?: React.HTMLAttributes<HTMLElement>[\"onMouseLeave\"];\n onMouseOver?: React.HTMLAttributes<HTMLElement>[\"onMouseOver\"];\n onMouseOut?: React.HTMLAttributes<HTMLElement>[\"onMouseOut\"];\n danger?: boolean;\n ref?: React.Ref<HTMLElement>;\n }\n | {\n type: \"divider\";\n }\n | {\n type: \"header\";\n title?: React.ReactNode;\n };\n\nexport interface DropdownMenuProps {\n /** Array of menu items to be displayed in the dropdown */\n items: DropdownMenuItemType[];\n /** Custom render function for the trigger element */\n children?: React.ComponentProps<typeof Menu.Trigger>[\"render\"];\n /**\n * Placement of the dropdown relative to the trigger element\n * @default \"bottomLeft\"\n */\n placement?: PopoverProps[\"placement\"];\n /**\n * Whether to open the dropdown on hover instead of click\n * @default false\n */\n openOnHover?: boolean;\n /**\n * Controlled open state of the dropdown\n */\n open?: boolean;\n /**\n * Callback fired when the dropdown open state changes\n */\n onOpenChange?: (open: boolean) => void;\n /**\n * Additional CSS class for the dropdown component\n */\n className?: string;\n /**\n * Custom class names for different parts of the dropdown\n * @default {}\n */\n classNames?: {\n root?: string;\n trigger?: string;\n popup?: string;\n group?: string;\n groupLabel?: string;\n item?: string;\n itemIcon?: string;\n itemText?: string;\n separator?: string;\n positioner?: string;\n };\n /**\n * Custom render function for menu items\n */\n itemRender?: (\n item: DropdownMenuItemType,\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n /**\n * Whether to show search input\n * @default false\n */\n showSearch?: boolean;\n /**\n * Size of the dropdown menu\n * @default \"auto\"\n */\n size?: \"auto\" | keyof typeof PopupPanelSize;\n /**\n * Search placeholder\n */\n searchProps?: Omit<\n React.ComponentProps<typeof Command.Input>,\n \"size\" | \"ref\"\n >;\n /**\n *\n */\n}\n\ninterface DropdownMenuGroup {\n label: React.ReactNode | null;\n items: DropdownMenuItemType[];\n}\n\nexport const DropdownMenu = ({\n children,\n items,\n placement,\n openOnHover,\n open: outsideOpen,\n onOpenChange: outsideOnOpenChange,\n className,\n itemRender,\n classNames,\n size = \"auto\",\n showSearch,\n searchProps = {\n placeholder: \"Search...\",\n },\n}: DropdownMenuProps) => {\n const [open, setOpen] = useControlled({\n controlled: outsideOpen,\n default: false,\n name: \"open\",\n });\n const onOpenChange = useCallback(\n (newValue: boolean) => {\n setOpen(newValue);\n outsideOnOpenChange?.(newValue);\n },\n [setOpen, outsideOnOpenChange]\n );\n const cls = useCls();\n const antdCssVarClassname = useAntdCssVarClassname();\n const headlessUIPlacement = parseAntdPlacement(placement);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const itemGroups = items.reduce<DropdownMenuGroup[]>((acc, current) => {\n // If no groups exist yet and current item is not a header, create default group\n if (acc.length === 0 && current.type !== \"header\") {\n acc.push({\n label: null,\n items: [],\n });\n }\n\n // If it's a header, create a new group\n if (current.type === \"header\") {\n acc.push({\n label: current.title,\n items: [],\n });\n }\n // If it's an item and we have at least one group, add it to the last group's items\n else if (\n (current.type === \"item\" || current.type === \"divider\") &&\n acc.length > 0\n ) {\n acc[acc.length - 1].items.push(current);\n }\n // Skip dividers\n return acc;\n }, []);\n\n const MenuSeparator = showSearch ? Command.Separator : Menu.Separator;\n\n const renderMenuItem = useCallback(\n (item: DropdownMenuItemType, i: number, j: number) => {\n const MenuItem = showSearch ? Command.Item : Menu.Item;\n\n if (item.type === \"item\") {\n const props = {\n className: clsx(cls(\"dropdown-menu-item\"), classNames?.item),\n disabled: item.disabled,\n \"data-danger\": item.danger,\n ref: item.ref as Ref<HTMLDivElement>,\n onClick: item.onClick,\n onMouseEnter: item.onMouseEnter,\n onMouseLeave: item.onMouseLeave,\n onMouseOver: item.onMouseOver,\n onMouseOut: item.onMouseOut,\n onSelect: showSearch\n ? () => {\n const e = new MouseEvent(\"click\", {\n bubbles: true,\n cancelable: true,\n }) as unknown as React.MouseEvent<HTMLElement, MouseEvent>;\n item.onClick(e);\n onOpenChange?.(false);\n }\n : undefined,\n render: itemRender\n ? (itemProps: React.HTMLAttributes<HTMLElement>) =>\n itemRender(item, itemProps)\n : undefined,\n children: [\n item.icon && (\n <span\n key=\"icon\"\n className={clsx(\n cls(\"dropdown-menu-item-icon\"),\n classNames?.itemIcon\n )}\n >\n {item.icon}\n </span>\n ),\n <span key=\"label\">{item.label}</span>,\n ],\n };\n return showSearch ? (\n <Command.Item key={i + \"-\" + j} {...props}></Command.Item>\n ) : (\n <MenuItem key={i + \"-\" + j} {...props}></MenuItem>\n );\n } else if (item.type === \"divider\") {\n return (\n <MenuSeparator\n key={i + \"-\" + j}\n className={clsx(\n cls(\"dropdown-menu-divider\"),\n classNames?.separator\n )}\n />\n );\n }\n return null;\n },\n [cls, classNames, itemRender, onOpenChange, showSearch, MenuSeparator]\n );\n\n const renderGroup = useCallback(\n (group: DropdownMenuGroup, index: number) => (\n <Menu.Group\n key={\"group\" + index}\n className={clsx(cls(\"dropdown-menu-group\"), classNames?.group)}\n >\n {group.label && (\n <Menu.GroupLabel\n className={clsx(\n cls(\"dropdown-menu-header\"),\n classNames?.groupLabel\n )}\n >\n <span>{group.label}</span>\n </Menu.GroupLabel>\n )}\n {group.items.map((item, j) => renderMenuItem(item, index, j))}\n </Menu.Group>\n ),\n [cls, classNames, renderMenuItem]\n );\n\n const renderGroupShowSearch = useCallback(\n (group: DropdownMenuGroup, index: number) =>\n group.label ? (\n <Command.Group\n key={\"group\" + index}\n className={clsx(cls(\"dropdown-menu-group\"), classNames?.group)}\n heading={\n <Menu.GroupLabel\n className={clsx(\n cls(\"dropdown-menu-header\"),\n classNames?.groupLabel\n )}\n >\n <span>{group.label}</span>\n </Menu.GroupLabel>\n }\n >\n {group.items.map((item, j) => renderMenuItem(item, index, j))}\n </Command.Group>\n ) : (\n group.items.map((item, j) => renderMenuItem(item, index, j))\n ),\n [cls, classNames, renderMenuItem]\n );\n\n const renderMenuInner = useCallback(\n () =>\n showSearch ? (\n <Command className={cls(\"dropdown-menu-container\")}>\n <Command.Input\n {...searchProps}\n key=\"search\"\n render={\n <Input allowClear className={cls(\"dropdown-menu-search\")} />\n }\n />\n <ScrollArea>\n <Command.List className={cls(\"dropdown-menu-list\")}>\n <Command.Empty className={cls(\"dropdown-menu-empty\")}>\n No results found.\n </Command.Empty>\n {itemGroups.map(renderGroupShowSearch)}\n </Command.List>\n </ScrollArea>\n </Command>\n ) : (\n <div className={cls(\"dropdown-menu-container\")}>\n <ScrollArea>{itemGroups.map(renderGroup)}</ScrollArea>\n </div>\n ),\n [\n showSearch,\n itemGroups,\n renderGroupShowSearch,\n renderGroup,\n searchProps,\n cls,\n ]\n );\n\n const BaseComponent = showSearch ? Popover : Menu;\n\n return (\n <BaseComponent.Root\n openOnHover={openOnHover}\n open={open}\n onOpenChange={onOpenChange}\n >\n <BaseComponent.Trigger\n render={children}\n ref={buttonRef}\n className={clsx(\n cls(\"dropdown-menu-trigger\"),\n classNames?.trigger,\n antdCssVarClassname\n )}\n />\n <BaseComponent.Portal>\n <BaseComponent.Positioner\n side={headlessUIPlacement.placement}\n align={headlessUIPlacement.align}\n sideOffset={4}\n className={clsx(cls(\"dropdown-menu-root\"), classNames?.root)}\n collisionAvoidance={DROPDOWN_COLLISION_AVOIDANCE}\n >\n <BaseComponent.Popup\n className={clsx(\n cls(\"dropdown-menu\"),\n className,\n classNames?.popup,\n antdCssVarClassname\n )}\n style={\n {\n \"--size-width\":\n size in PopupPanelSize ? PopupPanelSize[size] : undefined,\n } as React.CSSProperties\n }\n >\n {renderMenuInner()}\n </BaseComponent.Popup>\n </BaseComponent.Positioner>\n </BaseComponent.Portal>\n </BaseComponent.Root>\n );\n};\n"],"names":["DropdownMenu","children","items","placement","openOnHover","outsideOpen","outsideOnOpenChange","className","itemRender","classNames","size","showSearch","searchProps","open","setOpen","useControlled","onOpenChange","useCallback","newValue","cls","useCls","antdCssVarClassname","useAntdCssVarClassname","headlessUIPlacement","parseAntdPlacement","buttonRef","useRef","itemGroups","acc","current","MenuSeparator","Command","Menu","renderMenuItem","item","i","j","MenuItem","props","clsx","e","itemProps","jsx","renderGroup","group","index","jsxs","renderGroupShowSearch","renderMenuInner","createElement","Input","ScrollArea","BaseComponent","Popover","DROPDOWN_COLLISION_AVOIDANCE","PopupPanelSize"],"mappings":"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"}
@@ -1 +1 @@
1
- @layer components{.ds-dropdown-menu-root{z-index:2000}.ds-dropdown-menu{box-shadow:var(--ds-box-shadow-secondary);border-radius:var(--ds-border-radius);background:var(--ds-color-bg-elevated);list-style:none;padding:.25rem;color:var(--ds-color-text);font-size:var(--ds-font-size);font-family:var(--ds-font-family);transition-property:transform,scale,opacity;transition-duration:.2s;transition-timing-function:var(--ds-motion-ease-out);transform-origin:var(--transform-origin);max-width:min(var(--size-width),var(--available-width))}.ds-dropdown-menu[data-ending-style],.ds-dropdown-menu[data-starting-style]{transform:scale(.9);opacity:0}.ds-dropdown-menu:focus{outline:none}.ds-dropdown-menu-item{padding:.375rem .75rem;border-radius:var(--ds-border-radius-sm);transition:all .3s var(--ds-motion-ease-out);cursor:pointer;display:flex;align-items:center}.ds-dropdown-menu-item:focus{outline:none}.ds-dropdown-menu-item:hover{background:var(--ds-control-item-bg-hover)}.ds-dropdown-menu-item:active,.ds-dropdown-menu-item:focus,.ds-dropdown-menu-item[data-focus=true],.ds-dropdown-menu-item[data-selected=true]{background:var(--ds-control-item-bg-active)}.ds-dropdown-menu-item[data-disabled=true]{pointer-events:none;color:var(--ds-color-text-disabled)}.ds-dropdown-menu-item[data-danger=true]{color:var(--ds-color-error)}.ds-dropdown-menu-item[data-danger=true]:hover{background:var(--ds-color-error-bg)}.ds-dropdown-menu-item[data-danger=true]:active,.ds-dropdown-menu-item[data-danger=true]:focus,.ds-dropdown-menu-item[data-danger=true][data-focus=true]{background:var(--ds-color-error-bg-hover)}.ds-dropdown-menu-search{margin-bottom:.25rem}.ds-dropdown-menu-item-icon{display:flex;align-items:center;justify-content:center;margin-right:.5rem;font-size:1rem;color:var(--ds-color-icon)}[data-danger=true] .ds-dropdown-menu-item-icon{color:var(--ds-color-error)}.ds-dropdown-menu-divider{border-bottom:1px solid var(--ds-color-split);margin:.25rem 0}.ds-dropdown-menu-header{font-size:.75rem;font-weight:500;line-height:1rem;text-transform:uppercase;color:var(--ds-color-text-tertiary);padding:.75rem .75rem .25rem}.ds-dropdown-menu-header:first-child{padding-top:.5rem}.ds-dropdown-menu-empty{padding:.375rem .75rem;color:var(--ds-color-text-tertiary)}}
1
+ @layer components{.ds-dropdown-menu-root{z-index:2000}.ds-dropdown-menu{box-shadow:var(--ds-box-shadow-secondary);border-radius:var(--ds-border-radius);background:var(--ds-color-bg-elevated);list-style:none;padding:.25rem;color:var(--ds-color-text);font-size:var(--ds-font-size);font-family:var(--ds-font-family);transition-property:transform,scale,opacity;transition-duration:.2s;transition-timing-function:var(--ds-motion-ease-out);transform-origin:var(--transform-origin);max-width:min(var(--size-width),var(--available-width));max-height:var(--available-height);display:flex;flex-direction:column}.ds-dropdown-menu[data-ending-style],.ds-dropdown-menu[data-starting-style]{transform:scale(.9);opacity:0}.ds-dropdown-menu:focus{outline:none}.ds-dropdown-menu .ds-dropdown-menu-container{flex-shrink:1;min-height:0;display:flex;flex-direction:column}.ds-dropdown-menu .ds-dropdown-menu-search{flex-shrink:0}.ds-dropdown-menu .ds-dropdown-menu-list{flex-shrink:1;min-height:0;display:flex;flex-direction:column}.ds-dropdown-menu-item{padding:.375rem .75rem;border-radius:var(--ds-border-radius-sm);transition:all .3s var(--ds-motion-ease-out);cursor:pointer;display:flex;align-items:center}.ds-dropdown-menu-item:focus{outline:none}.ds-dropdown-menu-item:hover{background:var(--ds-control-item-bg-hover)}.ds-dropdown-menu-item:active,.ds-dropdown-menu-item:focus,.ds-dropdown-menu-item[data-focus=true],.ds-dropdown-menu-item[data-selected=true]{background:var(--ds-control-item-bg-active)}.ds-dropdown-menu-item[data-disabled=true]{pointer-events:none;color:var(--ds-color-text-disabled)}.ds-dropdown-menu-item[data-danger=true]{color:var(--ds-color-error)}.ds-dropdown-menu-item[data-danger=true]:hover{background:var(--ds-color-error-bg)}.ds-dropdown-menu-item[data-danger=true]:active,.ds-dropdown-menu-item[data-danger=true]:focus,.ds-dropdown-menu-item[data-danger=true][data-focus=true]{background:var(--ds-color-error-bg-hover)}.ds-dropdown-menu-search{margin-bottom:.25rem}.ds-dropdown-menu-item-icon{display:flex;align-items:center;justify-content:center;margin-right:.5rem;font-size:1rem;color:var(--ds-color-icon)}[data-danger=true] .ds-dropdown-menu-item-icon{color:var(--ds-color-error)}.ds-dropdown-menu-divider{border-bottom:1px solid var(--ds-color-split);margin:.25rem 0}.ds-dropdown-menu-header{font-size:.75rem;font-weight:500;line-height:1rem;text-transform:uppercase;color:var(--ds-color-text-tertiary);padding:.75rem .75rem .25rem}.ds-dropdown-menu-header:first-child{padding-top:.5rem}.ds-dropdown-menu-empty{padding:.375rem .75rem;color:var(--ds-color-text-tertiary)}}
@@ -1 +1 @@
1
- {"version":3,"file":"item.js","sources":["../../../src/components/form/item.tsx"],"sourcesContent":["\"use client\";\nimport { isValidElement } from \"react\";\nimport {\n default as AntdFormItem,\n type FormItemProps as AntdFormItemProps,\n} from \"antd/es/form/FormItem\";\nimport { Question } from \"@bioturing/assets\";\nimport { IconButton } from \"../icon-button\";\nimport { useCls } from \"../utils\";\n\nexport interface FormItemProps<Values = unknown>\n extends AntdFormItemProps<Values> {\n // tooltip?: React.ReactNode | TooltipProps;\n optionalMark?: boolean | React.ReactNode;\n}\n\nexport const FormItem = <Values = unknown,>({\n tooltip,\n label,\n optionalMark,\n ...rest\n}: FormItemProps<Values>) => {\n const cls = useCls();\n const renderedLabel =\n tooltip || optionalMark ? (\n <span className={cls(\"form-item-label-inner\")}>\n {label}\n {tooltip && (\n <IconButton\n className={cls(\"form-item-explaination-icon\")}\n label={\n typeof tooltip == \"string\" || isValidElement(tooltip)\n ? tooltip\n : undefined\n }\n >\n <Question />\n </IconButton>\n )}\n {optionalMark && (\n <span className={cls(\"form-item-label-optional-mark\")}>\n {typeof optionalMark == \"boolean\" ? \"(optional)\" : optionalMark}\n </span>\n )}\n </span>\n ) : (\n label\n );\n return <AntdFormItem label={renderedLabel} {...rest} />;\n};\n"],"names":["FormItem","tooltip","label","optionalMark","rest","cls","useCls","renderedLabel","jsxs","jsx","IconButton","isValidElement","Question","AntdFormItem"],"mappings":";;;;;;;AAgBO,MAAMA,IAAW,CAAoB;AAAA,EAC1C,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,GAAGC;AACL,MAA6B;AAC3B,QAAMC,IAAMC,EAAO,GACbC,IACJN,KAAWE,IACT,gBAAAK,EAAC,UAAK,WAAWH,EAAI,uBAAuB,GACzC,UAAA;AAAA,IAAAH;AAAA,IACAD,KACC,gBAAAQ;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAWL,EAAI,6BAA6B;AAAA,QAC5C,OACE,OAAOJ,KAAW,YAAYU,EAAeV,CAAO,IAChDA,IACA;AAAA,QAGN,4BAACW,GAAS,CAAA,CAAA;AAAA,MAAA;AAAA,IACZ;AAAA,IAEDT,KACE,gBAAAM,EAAA,QAAA,EAAK,WAAWJ,EAAI,+BAA+B,GACjD,UAAO,OAAAF,KAAgB,YAAY,eAAeA,EACrD,CAAA;AAAA,EAAA,EAAA,CAEJ,IAEAD;AAEJ,SAAQ,gBAAAO,EAAAI,GAAA,EAAa,OAAON,GAAgB,GAAGH,GAAM;AACvD;"}
1
+ {"version":3,"file":"item.js","sources":["../../../src/components/form/item.tsx"],"sourcesContent":["\"use client\";\nimport { isValidElement } from \"react\";\nimport {\n default as AntdFormItem,\n type FormItemProps as AntdFormItemProps,\n} from \"antd/es/form/FormItem\";\nimport { Question } from \"@bioturing/assets\";\nimport { IconButton } from \"../icon-button\";\nimport { useCls } from \"../utils\";\n\nexport interface FormItemProps<Values = unknown>\n extends AntdFormItemProps<Values> {\n // tooltip?: React.ReactNode | TooltipProps;\n /**\n * Whether the field is optional. If true, the label will be marked as optional.\n * @default false\n */\n optionalMark?: boolean | React.ReactNode;\n}\n\nexport const FormItem = <Values = unknown,>({\n tooltip,\n label,\n optionalMark,\n ...rest\n}: FormItemProps<Values>) => {\n const cls = useCls();\n const renderedLabel =\n tooltip || optionalMark ? (\n <span className={cls(\"form-item-label-inner\")}>\n {label}\n {tooltip && (\n <IconButton\n className={cls(\"form-item-explaination-icon\")}\n label={\n typeof tooltip == \"string\" || isValidElement(tooltip)\n ? tooltip\n : undefined\n }\n >\n <Question />\n </IconButton>\n )}\n {optionalMark && (\n <span className={cls(\"form-item-label-optional-mark\")}>\n {typeof optionalMark == \"boolean\" ? \"(optional)\" : optionalMark}\n </span>\n )}\n </span>\n ) : (\n label\n );\n return <AntdFormItem label={renderedLabel} {...rest} />;\n};\n"],"names":["FormItem","tooltip","label","optionalMark","rest","cls","useCls","renderedLabel","jsxs","jsx","IconButton","isValidElement","Question","AntdFormItem"],"mappings":";;;;;;;AAoBO,MAAMA,IAAW,CAAoB;AAAA,EAC1C,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,GAAGC;AACL,MAA6B;AAC3B,QAAMC,IAAMC,EAAO,GACbC,IACJN,KAAWE,IACT,gBAAAK,EAAC,UAAK,WAAWH,EAAI,uBAAuB,GACzC,UAAA;AAAA,IAAAH;AAAA,IACAD,KACC,gBAAAQ;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAWL,EAAI,6BAA6B;AAAA,QAC5C,OACE,OAAOJ,KAAW,YAAYU,EAAeV,CAAO,IAChDA,IACA;AAAA,QAGN,4BAACW,GAAS,CAAA,CAAA;AAAA,MAAA;AAAA,IACZ;AAAA,IAEDT,KACE,gBAAAM,EAAA,QAAA,EAAK,WAAWJ,EAAI,+BAA+B,GACjD,UAAO,OAAAF,KAAgB,YAAY,eAAeA,EACrD,CAAA;AAAA,EAAA,EAAA,CAEJ,IAEAD;AAEJ,SAAQ,gBAAAO,EAAAI,GAAA,EAAa,OAAON,GAAgB,GAAGH,GAAM;AACvD;"}
@@ -1,30 +1,34 @@
1
1
  import { useDS as c } from "../ds-root/context.js";
2
2
  import { getTokensByTheme as C } from "../../tokens/utils.js";
3
3
  import { chartColorTokens as h } from "../../tokens/charts/palettes/cloudscape.js";
4
- import { CATEGORICAL_PALETTE_NAMES as m, getCategoricalChartColors as L, SEQUENTIAL_PALETTE_NAMES as A, getSequentialChartColors as p } from "../../tokens/charts/palettes/index.js";
5
- const S = (r = {
4
+ import { useMemo as m } from "react";
5
+ import { CATEGORICAL_PALETTE_NAMES as L, getCategoricalChartColors as A, SEQUENTIAL_PALETTE_NAMES as f, getSequentialChartColors as p } from "../../tokens/charts/palettes/index.js";
6
+ const I = (t = {
6
7
  palette: "cloudscape",
7
8
  theme: void 0
8
9
  }) => {
9
- const { theme: a } = c(), o = r.theme || a, t = C(h, o), s = t.colorChartsLineAxis, l = t.colorChartsLineGrid, i = t.colorChartsLabelAxis, e = r.palette, n = m.includes(
10
- e
11
- ) ? L(e, o) : A.includes(e) ? p(e, o) : [];
12
- return {
13
- axisLineColor: s,
14
- splitLineColor: l,
15
- axisLabelColor: i,
16
- chartColors: n,
17
- echartsAxisConfig: {
18
- axisLine: { lineStyle: { color: s } },
19
- splitLine: { lineStyle: { color: l } },
20
- axisLabel: {
21
- color: i,
22
- fontFamily: "InterVariable, Inter, Helvetica, Arial, sans-serif"
10
+ const { theme: i } = c(), e = t.theme || i;
11
+ return m(() => {
12
+ const r = C(h, e), s = r.colorChartsLineAxis, l = r.colorChartsLineGrid, a = r.colorChartsLabelAxis, o = t.palette, n = L.includes(
13
+ o
14
+ ) ? A(o, e) : f.includes(o) ? p(o, e) : [];
15
+ return {
16
+ axisLineColor: s,
17
+ splitLineColor: l,
18
+ axisLabelColor: a,
19
+ chartColors: n,
20
+ echartsAxisConfig: {
21
+ axisLine: { lineStyle: { color: s } },
22
+ splitLine: { lineStyle: { color: l } },
23
+ axisLabel: {
24
+ color: a,
25
+ fontFamily: "InterVariable, Inter, Helvetica, Arial, sans-serif"
26
+ }
23
27
  }
24
- }
25
- };
28
+ };
29
+ }, [e, t.palette]);
26
30
  };
27
31
  export {
28
- S as useCharts
32
+ I as useCharts
29
33
  };
30
34
  //# sourceMappingURL=useCharts.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useCharts.js","sources":["../../../src/components/hooks/useCharts.ts"],"sourcesContent":["import { useDS } from \"../ds-root/context\";\nimport { getTokensByTheme } from \"../../tokens/utils\";\nimport { chartColorTokens } from \"../../tokens/charts/palettes/cloudscape\";\n\nimport {\n SequentialPaletteName,\n CategoricalPaletteName,\n CATEGORICAL_PALETTE_NAMES,\n getCategoricalChartColors,\n getSequentialChartColors,\n SEQUENTIAL_PALETTE_NAMES,\n Theme,\n} from \"../../tokens\";\n\nexport interface UseChartsOptions {\n /**\n * The palette to use for the charts.\n * @default \"cloudscape\"\n */\n palette?: SequentialPaletteName | CategoricalPaletteName;\n /**\n * The theme to use for the charts.\n * @default \"light\"\n */\n theme?: Theme;\n}\n\n/**\n * Get chart colors and axis configuration based on the current theme.\n * @param options\n * @returns\n */\nexport const useCharts = (\n options: UseChartsOptions = {\n palette: \"cloudscape\",\n theme: undefined,\n }\n) => {\n const { theme: themeContext } = useDS();\n const theme = options.theme || themeContext;\n const themedChartColorTokens = getTokensByTheme(chartColorTokens, theme);\n const axisLineColor = themedChartColorTokens[\"colorChartsLineAxis\"];\n const splitLineColor = themedChartColorTokens[\"colorChartsLineGrid\"];\n const axisLabelColor = themedChartColorTokens[\"colorChartsLabelAxis\"];\n\n const palette = options.palette;\n\n const chartColors = CATEGORICAL_PALETTE_NAMES.includes(\n palette as CategoricalPaletteName\n )\n ? getCategoricalChartColors(palette as CategoricalPaletteName, theme)\n : SEQUENTIAL_PALETTE_NAMES.includes(palette as SequentialPaletteName)\n ? getSequentialChartColors(palette as SequentialPaletteName, theme)\n : [];\n const echartsAxisConfig = {\n axisLine: { lineStyle: { color: axisLineColor } },\n splitLine: { lineStyle: { color: splitLineColor } },\n axisLabel: {\n color: axisLabelColor,\n fontFamily: \"InterVariable, Inter, Helvetica, Arial, sans-serif\",\n },\n };\n\n return {\n axisLineColor,\n splitLineColor,\n axisLabelColor,\n chartColors,\n echartsAxisConfig,\n };\n};\n"],"names":["useCharts","options","themeContext","useDS","theme","themedChartColorTokens","getTokensByTheme","chartColorTokens","axisLineColor","splitLineColor","axisLabelColor","palette","chartColors","CATEGORICAL_PALETTE_NAMES","getCategoricalChartColors","SEQUENTIAL_PALETTE_NAMES","getSequentialChartColors"],"mappings":";;;;AAgCa,MAAAA,IAAY,CACvBC,IAA4B;AAAA,EAC1B,SAAS;AAAA,EACT,OAAO;AACT,MACG;AACH,QAAM,EAAE,OAAOC,EAAa,IAAIC,EAAM,GAChCC,IAAQH,EAAQ,SAASC,GACzBG,IAAyBC,EAAiBC,GAAkBH,CAAK,GACjEI,IAAgBH,EAAuB,qBACvCI,IAAiBJ,EAAuB,qBACxCK,IAAiBL,EAAuB,sBAExCM,IAAUV,EAAQ,SAElBW,IAAcC,EAA0B;AAAA,IAC5CF;AAAA,EAEE,IAAAG,EAA0BH,GAAmCP,CAAK,IAClEW,EAAyB,SAASJ,CAAgC,IAClEK,EAAyBL,GAAkCP,CAAK,IAChE,CAAC;AAUE,SAAA;AAAA,IACL,eAAAI;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAE;AAAA,IACA,mBAdwB;AAAA,MACxB,UAAU,EAAE,WAAW,EAAE,OAAOJ,IAAgB;AAAA,MAChD,WAAW,EAAE,WAAW,EAAE,OAAOC,IAAiB;AAAA,MAClD,WAAW;AAAA,QACT,OAAOC;AAAA,QACP,YAAY;AAAA,MAAA;AAAA,IAEhB;AAAA,EAQA;AACF;"}
1
+ {"version":3,"file":"useCharts.js","sources":["../../../src/components/hooks/useCharts.ts"],"sourcesContent":["import { useDS } from \"../ds-root/context\";\nimport { getTokensByTheme } from \"../../tokens/utils\";\nimport { chartColorTokens } from \"../../tokens/charts/palettes/cloudscape\";\n\nimport {\n SequentialPaletteName,\n CategoricalPaletteName,\n CATEGORICAL_PALETTE_NAMES,\n getCategoricalChartColors,\n getSequentialChartColors,\n SEQUENTIAL_PALETTE_NAMES,\n Theme,\n} from \"../../tokens\";\nimport { useMemo } from \"react\";\n\nexport interface UseChartsOptions {\n /**\n * The palette to use for the charts.\n * @default \"cloudscape\"\n */\n palette?: SequentialPaletteName | CategoricalPaletteName;\n /**\n * The theme to use for the charts.\n * @default \"light\"\n */\n theme?: Theme;\n}\n\n/**\n * Get chart colors and axis configuration based on the current theme.\n * @param options\n * @returns\n */\nexport const useCharts = (\n options: UseChartsOptions = {\n palette: \"cloudscape\",\n theme: undefined,\n }\n) => {\n const { theme: themeContext } = useDS();\n const theme = options.theme || themeContext;\n\n const chartInfo = useMemo(() => {\n const themedChartColorTokens = getTokensByTheme(chartColorTokens, theme);\n const axisLineColor = themedChartColorTokens[\"colorChartsLineAxis\"];\n const splitLineColor = themedChartColorTokens[\"colorChartsLineGrid\"];\n const axisLabelColor = themedChartColorTokens[\"colorChartsLabelAxis\"];\n\n const palette = options.palette;\n\n const chartColors = CATEGORICAL_PALETTE_NAMES.includes(\n palette as CategoricalPaletteName\n )\n ? getCategoricalChartColors(palette as CategoricalPaletteName, theme)\n : SEQUENTIAL_PALETTE_NAMES.includes(palette as SequentialPaletteName)\n ? getSequentialChartColors(palette as SequentialPaletteName, theme)\n : [];\n const echartsAxisConfig = {\n axisLine: { lineStyle: { color: axisLineColor } },\n splitLine: { lineStyle: { color: splitLineColor } },\n axisLabel: {\n color: axisLabelColor,\n fontFamily: \"InterVariable, Inter, Helvetica, Arial, sans-serif\",\n },\n };\n return {\n axisLineColor,\n splitLineColor,\n axisLabelColor,\n chartColors,\n echartsAxisConfig,\n };\n }, [theme, options.palette]);\n\n return chartInfo;\n};\n"],"names":["useCharts","options","themeContext","useDS","theme","useMemo","themedChartColorTokens","getTokensByTheme","chartColorTokens","axisLineColor","splitLineColor","axisLabelColor","palette","chartColors","CATEGORICAL_PALETTE_NAMES","getCategoricalChartColors","SEQUENTIAL_PALETTE_NAMES","getSequentialChartColors"],"mappings":";;;;;AAiCa,MAAAA,IAAY,CACvBC,IAA4B;AAAA,EAC1B,SAAS;AAAA,EACT,OAAO;AACT,MACG;AACH,QAAM,EAAE,OAAOC,EAAa,IAAIC,EAAM,GAChCC,IAAQH,EAAQ,SAASC;AAkCxB,SAhCWG,EAAQ,MAAM;AACxB,UAAAC,IAAyBC,EAAiBC,GAAkBJ,CAAK,GACjEK,IAAgBH,EAAuB,qBACvCI,IAAiBJ,EAAuB,qBACxCK,IAAiBL,EAAuB,sBAExCM,IAAUX,EAAQ,SAElBY,IAAcC,EAA0B;AAAA,MAC5CF;AAAA,IAEE,IAAAG,EAA0BH,GAAmCR,CAAK,IAClEY,EAAyB,SAASJ,CAAgC,IAClEK,EAAyBL,GAAkCR,CAAK,IAChE,CAAC;AASE,WAAA;AAAA,MACL,eAAAK;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,aAAAE;AAAA,MACA,mBAbwB;AAAA,QACxB,UAAU,EAAE,WAAW,EAAE,OAAOJ,IAAgB;AAAA,QAChD,WAAW,EAAE,WAAW,EAAE,OAAOC,IAAiB;AAAA,QAClD,WAAW;AAAA,UACT,OAAOC;AAAA,UACP,YAAY;AAAA,QAAA;AAAA,MAEhB;AAAA,IAOA;AAAA,EACC,GAAA,CAACP,GAAOH,EAAQ,OAAO,CAAC;AAG7B;"}
@@ -1,16 +1,31 @@
1
1
  "use client";
2
2
  import { jsx as o } from "react/jsx-runtime";
3
- import { forwardRef as p } from "react";
4
- import { NavGroupContext as i } from "./context.js";
5
- import { useCls as s } from "../utils/antdUtils.js";
6
- const u = p(
7
- ({ children: e, size: r = "medium", collapsible: m }, a) => {
8
- const t = s();
9
- return /* @__PURE__ */ o(i.Provider, { value: { size: r, collapsible: m }, children: /* @__PURE__ */ o("div", { className: t("nav-group", `nav-${r}`), ref: a, children: e }) });
3
+ import { forwardRef as s } from "react";
4
+ import { NavGroupContext as u } from "./context.js";
5
+ import { useCls as l } from "../utils/antdUtils.js";
6
+ import { clsx as n } from "../utils/cn.js";
7
+ const v = s(
8
+ ({
9
+ children: m,
10
+ size: r = "medium",
11
+ collapsible: e,
12
+ className: t,
13
+ ...a
14
+ }, p) => {
15
+ const i = l();
16
+ return /* @__PURE__ */ o(u.Provider, { value: { size: r, collapsible: e }, children: /* @__PURE__ */ o(
17
+ "div",
18
+ {
19
+ className: n(i("nav-group", `nav-${r}`), t),
20
+ ref: p,
21
+ ...a,
22
+ children: m
23
+ }
24
+ ) });
10
25
  }
11
26
  );
12
- u.displayName = "NavGroup";
27
+ v.displayName = "NavGroup";
13
28
  export {
14
- u as NavGroup
29
+ v as NavGroup
15
30
  };
16
31
  //# sourceMappingURL=group.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"group.js","sources":["../../../src/components/nav/group.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef } from \"react\";\nimport { useCls } from \"../utils\";\nimport { NavGroupContext } from \"./context\";\n\nexport interface NavGroupProps extends React.ComponentPropsWithoutRef<\"div\"> {\n /**\n * Size of the nav\n * @default \"medium\"\n */\n size?: \"small\" | \"medium\" | \"large\";\n /**\n * Weather it's collapsible or not\n */\n collapsible?: boolean;\n}\n\nconst NavGroup = forwardRef(\n (\n { children, size = \"medium\", collapsible }: NavGroupProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const cls = useCls();\n return (\n <NavGroupContext.Provider value={{ size, collapsible }}>\n <div className={cls(\"nav-group\", `nav-${size}`)} ref={ref}>\n {children}\n </div>\n </NavGroupContext.Provider>\n );\n }\n);\n\nNavGroup.displayName = \"NavGroup\";\n\nexport { NavGroup };\n"],"names":["NavGroup","forwardRef","children","size","collapsible","ref","cls","useCls","jsx","NavGroupContext"],"mappings":";;;;;AAiBA,MAAMA,IAAWC;AAAA,EACf,CACE,EAAE,UAAAC,GAAU,MAAAC,IAAO,UAAU,aAAAC,EAAA,GAC7BC,MACG;AACH,UAAMC,IAAMC,EAAO;AAEjB,WAAA,gBAAAC,EAACC,EAAgB,UAAhB,EAAyB,OAAO,EAAE,MAAAN,GAAM,aAAAC,KACvC,UAAA,gBAAAI,EAAC,SAAI,WAAWF,EAAI,aAAa,OAAOH,CAAI,EAAE,GAAG,KAAAE,GAC9C,UAAAH,EACH,CAAA,GACF;AAAA,EAAA;AAGN;AAEAF,EAAS,cAAc;"}
1
+ {"version":3,"file":"group.js","sources":["../../../src/components/nav/group.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef } from \"react\";\nimport { useCls, clsx } from \"../utils\";\nimport { NavGroupContext } from \"./context\";\n\nexport interface NavGroupProps extends React.ComponentPropsWithoutRef<\"div\"> {\n /**\n * Size of the nav\n * @default \"medium\"\n */\n size?: \"small\" | \"medium\" | \"large\";\n /**\n * Weather it's collapsible or not\n */\n collapsible?: boolean;\n}\n\nconst NavGroup = forwardRef(\n (\n {\n children,\n size = \"medium\",\n collapsible,\n className,\n ...rest\n }: NavGroupProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const cls = useCls();\n return (\n <NavGroupContext.Provider value={{ size, collapsible }}>\n <div\n className={clsx(cls(\"nav-group\", `nav-${size}`), className)}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n </NavGroupContext.Provider>\n );\n }\n);\n\nNavGroup.displayName = \"NavGroup\";\n\nexport { NavGroup };\n"],"names":["NavGroup","forwardRef","children","size","collapsible","className","rest","ref","cls","useCls","jsx","NavGroupContext","clsx"],"mappings":";;;;;;AAiBA,MAAMA,IAAWC;AAAA,EACf,CACE;AAAA,IACE,UAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,KAELC,MACG;AACH,UAAMC,IAAMC,EAAO;AAEjB,WAAA,gBAAAC,EAACC,EAAgB,UAAhB,EAAyB,OAAO,EAAE,MAAAR,GAAM,aAAAC,KACvC,UAAA,gBAAAM;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWE,EAAKJ,EAAI,aAAa,OAAOL,CAAI,EAAE,GAAGE,CAAS;AAAA,QAC1D,KAAAE;AAAA,QACC,GAAGD;AAAA,QAEH,UAAAJ;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,EAAA;AAGN;AAEAF,EAAS,cAAc;"}
@@ -21,11 +21,11 @@ const R = (e) => N(e), j = ({
21
21
  "data-active": r || void 0,
22
22
  "aria-expanded": n["aria-expanded"],
23
23
  className: void 0,
24
- ...n,
25
24
  children: /* @__PURE__ */ p(c, { children: [
26
25
  /* @__PURE__ */ a("span", { className: t("nav-item-icon"), children: i }),
27
26
  /* @__PURE__ */ a("span", { className: t("nav-item-content"), children: l })
28
- ] })
27
+ ] }),
28
+ ...n
29
29
  },
30
30
  state: { active: r, icon: e }
31
31
  });
@@ -1 +1 @@
1
- {"version":3,"file":"item.js","sources":["../../../src/components/nav/item.tsx"],"sourcesContent":["\"use client\";\nimport React, {\n useState,\n type MouseEvent,\n forwardRef,\n isValidElement,\n useMemo,\n} from \"react\";\nimport { clsx, useCls } from \"../utils\";\nimport { Transition } from \"../transition\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\n\nexport interface NavItemProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n /**\n * The icon to display in the nav item\n */\n icon?: React.ReactNode;\n /**\n * Whether the nav item is active\n */\n active?: boolean;\n /**\n * The render prop to render the nav item\n */\n render?: useRender.RenderProp<{\n active: boolean;\n icon?: React.ReactNode;\n }>;\n /**\n * The size of the nav item\n * @default \"medium\"\n */\n size?: \"small\" | \"medium\" | \"large\";\n /**\n * Whether to change the icon weight on active state\n * @default true\n */\n changeIconWeightOnActive?: boolean;\n}\n\n// Define a type for elements that can have a weight prop\ntype ElementWithWeight = React.ReactElement<{ weight?: string }>;\n\n// Type guard to check if an element can accept a weight prop\nconst canHaveWeightProp = (el: React.ReactNode): el is ElementWithWeight => {\n return isValidElement(el);\n};\n\nconst NavItemImpl = <T extends HTMLElement>(\n {\n icon,\n active = false,\n render,\n className,\n children,\n changeIconWeightOnActive = true,\n ...rest\n }: NavItemProps,\n ref: React.Ref<T>\n) => {\n const cls = useCls();\n\n // Apply weight prop only if the element can accept it\n const renderedIcon = useMemo(() => {\n if (!changeIconWeightOnActive || !active || !canHaveWeightProp(icon)) {\n return icon;\n }\n return React.cloneElement(icon, { weight: \"fill\" });\n }, [icon, changeIconWeightOnActive, active]);\n\n return useRender({\n render: render ?? <button className={clsx(cls(\"nav-item\"), className)} />,\n ref,\n props: {\n \"data-active\": active || undefined,\n \"aria-expanded\": rest[\"aria-expanded\"],\n className: undefined,\n ...rest,\n children: (\n <>\n <span className={cls(\"nav-item-icon\")}>{renderedIcon}</span>\n <span className={cls(\"nav-item-content\")}>{children}</span>\n </>\n ),\n },\n state: { active, icon },\n });\n};\n\nconst NavItem = forwardRef(NavItemImpl) as <T extends HTMLElement>(\n props: NavItemProps & { ref?: React.Ref<T> }\n) => ReturnType<typeof NavItemImpl>;\n\nexport { NavItem };\n"],"names":["canHaveWeightProp","el","isValidElement","NavItemImpl","icon","active","render","className","children","changeIconWeightOnActive","rest","ref","cls","useCls","renderedIcon","useMemo","React","useRender","jsx","clsx","jsxs","Fragment","NavItem","forwardRef"],"mappings":";;;;;;AA6CA,MAAMA,IAAoB,CAACC,MAClBC,EAAeD,CAAE,GAGpBE,IAAc,CAClB;AAAA,EACE,MAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,0BAAAC,IAA2B;AAAA,EAC3B,GAAGC;AACL,GACAC,MACG;AACH,QAAMC,IAAMC,EAAO,GAGbC,IAAeC,EAAQ,MACvB,CAACN,KAA4B,CAACJ,KAAU,CAACL,EAAkBI,CAAI,IAC1DA,IAEFY,EAAM,aAAaZ,GAAM,EAAE,QAAQ,QAAQ,GACjD,CAACA,GAAMK,GAA0BJ,CAAM,CAAC;AAE3C,SAAOY,EAAU;AAAA,IACf,QAAQX,KAAU,gBAAAY,EAAC,UAAO,EAAA,WAAWC,EAAKP,EAAI,UAAU,GAAGL,CAAS,EAAG,CAAA;AAAA,IACvE,KAAAI;AAAA,IACA,OAAO;AAAA,MACL,eAAeN,KAAU;AAAA,MACzB,iBAAiBK,EAAK,eAAe;AAAA,MACrC,WAAW;AAAA,MACX,GAAGA;AAAA,MACH,UAEI,gBAAAU,EAAAC,GAAA,EAAA,UAAA;AAAA,QAAA,gBAAAH,EAAC,QAAK,EAAA,WAAWN,EAAI,eAAe,GAAI,UAAaE,GAAA;AAAA,0BACpD,QAAK,EAAA,WAAWF,EAAI,kBAAkB,GAAI,UAAAJ,EAAS,CAAA;AAAA,MAAA,EACtD,CAAA;AAAA,IAEJ;AAAA,IACA,OAAO,EAAE,QAAAH,GAAQ,MAAAD,EAAK;AAAA,EAAA,CACvB;AACH,GAEMkB,IAAUC,EAAWpB,CAAW;"}
1
+ {"version":3,"file":"item.js","sources":["../../../src/components/nav/item.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef, isValidElement, useMemo } from \"react\";\nimport { clsx, useCls } from \"../utils\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\n\nexport interface NavItemProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n /**\n * The icon to display in the nav item\n */\n icon?: React.ReactNode;\n /**\n * Whether the nav item is active\n */\n active?: boolean;\n /**\n * The render prop to render the nav item\n */\n render?: useRender.RenderProp<{\n active: boolean;\n icon?: React.ReactNode;\n }>;\n /**\n * The size of the nav item\n * @default \"medium\"\n */\n size?: \"small\" | \"medium\" | \"large\";\n /**\n * Whether to change the icon weight on active state\n * @default true\n */\n changeIconWeightOnActive?: boolean;\n}\n\n// Define a type for elements that can have a weight prop\ntype ElementWithWeight = React.ReactElement<{ weight?: string }>;\n\n// Type guard to check if an element can accept a weight prop\nconst canHaveWeightProp = (el: React.ReactNode): el is ElementWithWeight => {\n return isValidElement(el);\n};\n\nconst NavItemImpl = <T extends HTMLElement>(\n {\n icon,\n active = false,\n render,\n className,\n children,\n changeIconWeightOnActive = true,\n ...rest\n }: NavItemProps,\n ref: React.Ref<T>\n) => {\n const cls = useCls();\n\n // Apply weight prop only if the element can accept it\n const renderedIcon = useMemo(() => {\n if (!changeIconWeightOnActive || !active || !canHaveWeightProp(icon)) {\n return icon;\n }\n return React.cloneElement(icon, { weight: \"fill\" });\n }, [icon, changeIconWeightOnActive, active]);\n\n return useRender({\n render: render ?? <button className={clsx(cls(\"nav-item\"), className)} />,\n ref,\n props: {\n \"data-active\": active || undefined,\n \"aria-expanded\": rest[\"aria-expanded\"],\n className: undefined,\n children: (\n <>\n <span className={cls(\"nav-item-icon\")}>{renderedIcon}</span>\n <span className={cls(\"nav-item-content\")}>{children}</span>\n </>\n ),\n ...rest,\n },\n state: { active, icon },\n });\n};\n\nconst NavItem = forwardRef(NavItemImpl) as <T extends HTMLElement>(\n props: NavItemProps & { ref?: React.Ref<T> }\n) => ReturnType<typeof NavItemImpl>;\n\nexport { NavItem };\n"],"names":["canHaveWeightProp","el","isValidElement","NavItemImpl","icon","active","render","className","children","changeIconWeightOnActive","rest","ref","cls","useCls","renderedIcon","useMemo","React","useRender","jsx","clsx","jsxs","Fragment","NavItem","forwardRef"],"mappings":";;;;;;AAsCA,MAAMA,IAAoB,CAACC,MAClBC,EAAeD,CAAE,GAGpBE,IAAc,CAClB;AAAA,EACE,MAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,0BAAAC,IAA2B;AAAA,EAC3B,GAAGC;AACL,GACAC,MACG;AACH,QAAMC,IAAMC,EAAO,GAGbC,IAAeC,EAAQ,MACvB,CAACN,KAA4B,CAACJ,KAAU,CAACL,EAAkBI,CAAI,IAC1DA,IAEFY,EAAM,aAAaZ,GAAM,EAAE,QAAQ,QAAQ,GACjD,CAACA,GAAMK,GAA0BJ,CAAM,CAAC;AAE3C,SAAOY,EAAU;AAAA,IACf,QAAQX,KAAU,gBAAAY,EAAC,UAAO,EAAA,WAAWC,EAAKP,EAAI,UAAU,GAAGL,CAAS,EAAG,CAAA;AAAA,IACvE,KAAAI;AAAA,IACA,OAAO;AAAA,MACL,eAAeN,KAAU;AAAA,MACzB,iBAAiBK,EAAK,eAAe;AAAA,MACrC,WAAW;AAAA,MACX,UAEI,gBAAAU,EAAAC,GAAA,EAAA,UAAA;AAAA,QAAA,gBAAAH,EAAC,QAAK,EAAA,WAAWN,EAAI,eAAe,GAAI,UAAaE,GAAA;AAAA,0BACpD,QAAK,EAAA,WAAWF,EAAI,kBAAkB,GAAI,UAAAJ,EAAS,CAAA;AAAA,MAAA,GACtD;AAAA,MAEF,GAAGE;AAAA,IACL;AAAA,IACA,OAAO,EAAE,QAAAL,GAAQ,MAAAD,EAAK;AAAA,EAAA,CACvB;AACH,GAEMkB,IAAUC,EAAWpB,CAAW;"}
@@ -1 +1 @@
1
- .ds-nav-group{display:flex;flex-direction:column;gap:.25rem}.ds-nav-item{width:100%;display:flex;align-items:center;gap:.5rem;padding:.375rem .75rem;font-size:1.25rem;color:var(--ds-color-icon);background:transparent;border-radius:var(--ds-border-radius);transition:background-color var(--ds-motion-duration-mid),color var(--ds-motion-duration-mid)}.ds-nav-item:hover{background-color:var(--ds-color-fill-tertiary);color:var(--ds-color-icon-hover)}.ds-nav-item[data-active]{background-color:var(--ds-color-fill-secondary);color:var(--ds-color-text);font-weight:500}.ds-nav-item[aria-expanded]{background-color:var(--ds-color-fill-secondary);color:var(--ds-color-text)}.ds-nav-item:disabled{background:transparent;color:var(--ds-color-text-disabled);cursor:not-allowed}.ds-nav-item .ds-nav-item-icon{font-size:1.25rem;line-height:1;transition:all .1s}.ds-nav-item .ds-nav-item-content{flex:1;display:flex;align-items:center;white-space:nowrap;overflow:hidden;font-size:.875rem;line-height:1rem;transition:max-width .15s,opacity .15s}.ds-nav-small .ds-nav-item,.ds-nav-item.ds-nav-item-small{padding:.25rem .5rem}:is(.ds-nav-small .ds-nav-item,.ds-nav-item.ds-nav-item-small) .ds-nav-item-icon{font-size:1rem}.ds-nav-large .ds-nav-item,.ds-nav-item.ds-nav-item-large{padding:.5rem 1rem}:is(.ds-nav-large .ds-nav-item,.ds-nav-item.ds-nav-item-large) .ds-nav-item-icon{font-size:1.5rem}:is(.ds-nav-large .ds-nav-item,.ds-nav-item.ds-nav-item-large) .ds-nav-item-content{font-size:1rem;line-height:1.5rem}.ds-nav-heading{width:100%;height:.875rem;position:relative;color:var(--ds-color-text-tertiary);text-transform:uppercase;font-weight:500;letter-spacing:.002em;font-size:.75rem;line-height:1rem;margin-bottom:.5rem}.ds-nav-small .ds-nav-heading{font-size:.625rem;line-height:1.4}.ds-nav-heading-text{display:inline-block;overflow:hidden;text-overflow:ellipsis;position:absolute;transition:all .1s;white-space:nowrap}
1
+ @layer components{.ds-nav-group{display:flex;flex-direction:column;gap:.25rem}.ds-nav-item{width:100%;display:flex;align-items:center;gap:.5rem;padding:.375rem .75rem;font-size:1.25rem;color:var(--ds-color-icon);background:transparent;border-radius:var(--ds-border-radius);transition:background-color var(--ds-motion-duration-mid),color var(--ds-motion-duration-mid)}.ds-nav-item:hover{background-color:var(--ds-color-fill-tertiary);color:var(--ds-color-icon-hover)}.ds-nav-item[data-active=true]{background-color:var(--ds-color-fill-secondary);color:var(--ds-color-text);font-weight:500}.ds-nav-item[aria-expanded=true]{background-color:var(--ds-color-fill-secondary);color:var(--ds-color-text)}.ds-nav-item:disabled{background:transparent;color:var(--ds-color-text-disabled);cursor:not-allowed}.ds-nav-item .ds-nav-item-icon{font-size:1.25rem;line-height:1;transition:all .1s}.ds-nav-item .ds-nav-item-content{flex:1;display:flex;align-items:center;white-space:nowrap;overflow:hidden;font-size:.875rem;line-height:1rem;transition:max-width .15s,opacity .15s}.ds-nav-small .ds-nav-item,.ds-nav-item.ds-nav-item-small{padding:.25rem .5rem}:is(.ds-nav-small .ds-nav-item,.ds-nav-item.ds-nav-item-small) .ds-nav-item-icon{font-size:1rem}.ds-nav-large .ds-nav-item,.ds-nav-item.ds-nav-item-large{padding:.5rem 1rem}:is(.ds-nav-large .ds-nav-item,.ds-nav-item.ds-nav-item-large) .ds-nav-item-icon{font-size:1.5rem}:is(.ds-nav-large .ds-nav-item,.ds-nav-item.ds-nav-item-large) .ds-nav-item-content{font-size:1rem;line-height:1.5rem}.ds-nav-heading{width:100%;height:.875rem;position:relative;color:var(--ds-color-text-tertiary);text-transform:uppercase;font-weight:500;letter-spacing:.002em;font-size:.75rem;line-height:1rem;margin-bottom:.5rem}.ds-nav-small .ds-nav-heading{font-size:.625rem;line-height:1.4}.ds-nav-heading-text{display:inline-block;overflow:hidden;text-overflow:ellipsis;position:absolute;transition:all .1s;white-space:nowrap}}
@@ -1,65 +1,62 @@
1
1
  "use client";
2
- import { jsx as c } from "react/jsx-runtime";
3
- import b, { forwardRef as g } from "react";
4
- import { useRender as R } from "@base-ui-components/react/use-render";
5
- import { mergeProps as S } from "@base-ui-components/react/merge-props";
6
- import { Stack as V } from "./Stack.js";
7
- import { useCls as v } from "../utils/antdUtils.js";
8
- import { cn as w } from "../utils/cn.js";
9
- const E = g(
2
+ import { jsx as l } from "react/jsx-runtime";
3
+ import S, { forwardRef as g, useMemo as v } from "react";
4
+ import { useRender as w } from "@base-ui-components/react/use-render";
5
+ import { mergeProps as E } from "@base-ui-components/react/merge-props";
6
+ import { Stack as P } from "./Stack.js";
7
+ import { useCls as V } from "../utils/antdUtils.js";
8
+ import { cn as j } from "../utils/cn.js";
9
+ const x = g(
10
10
  ({
11
11
  flex: s,
12
12
  grow: m = !1,
13
- shrink: f = !1,
14
- children: t,
15
- style: i,
16
- stack: n = !1,
13
+ shrink: i = !1,
14
+ children: e,
15
+ style: n,
16
+ stack: f = !1,
17
17
  // stack props
18
18
  hug: p = !1,
19
19
  align: d = "flex-start",
20
20
  justify: k = "flex-start",
21
21
  vertical: u = !1,
22
- gap: x = 0,
23
- wrap: h = !1,
22
+ gap: h = 0,
23
+ wrap: C = !1,
24
24
  className: y,
25
25
  ...o
26
26
  }, a) => {
27
- const e = v(), C = {
27
+ const t = V(), N = {
28
28
  hug: p,
29
29
  align: d,
30
30
  justify: k,
31
31
  vertical: u,
32
- gap: x,
33
- wrap: h
34
- };
35
- let l = "";
36
- typeof s == "boolean" && (l = e(s ? "stack-child-flex-1" : "stack-child-flex-0"));
37
- const r = w(
38
- e("stack-child"),
39
- m && e("stack-child-grow"),
40
- f && e("stack-child-shrink"),
41
- l,
32
+ gap: h,
33
+ wrap: C
34
+ }, r = v(() => typeof s == "boolean" || s === 0 || s === 1 ? t(s === !0 || s === 1 ? "stack-child-flex-1" : "stack-child-flex-0") : "", [s, t]), c = j(
35
+ t("stack-child"),
36
+ m && t("stack-child-grow"),
37
+ i && t("stack-child-shrink"),
38
+ r,
42
39
  y
43
- ), N = R({
44
- render: () => b.isValidElement(t) ? t : /* @__PURE__ */ c("div", { children: t }),
40
+ ), b = s && typeof s != "boolean" && !r ? s : void 0, R = w({
41
+ render: S.isValidElement(e) ? e : /* @__PURE__ */ l("div", { children: e }),
45
42
  ref: a,
46
- props: S(
43
+ props: E(
47
44
  {
48
- className: r,
45
+ className: c,
49
46
  style: {
50
- ...i,
51
- flex: typeof s == "string" || typeof s == "number" ? s : void 0
47
+ ...n,
48
+ flex: b
52
49
  },
53
50
  ...o
54
51
  },
55
52
  {}
56
53
  )
57
54
  });
58
- return n ? /* @__PURE__ */ c(V, { ...C, ref: a, className: r, ...o, children: t }) : N;
55
+ return f ? /* @__PURE__ */ l(P, { ...N, ref: a, className: c, ...o, children: e }) : R;
59
56
  }
60
57
  );
61
- E.displayName = "StackChild";
58
+ x.displayName = "StackChild";
62
59
  export {
63
- E as StackChild
60
+ x as StackChild
64
61
  };
65
62
  //# sourceMappingURL=StackChild.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"StackChild.js","sources":["../../../src/components/stack/StackChild.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef } from \"react\";\nimport { cn, useCls } from \"../utils\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\nimport { mergeProps } from \"@base-ui-components/react/merge-props\";\nimport { Stack, StackProps } from \"./Stack\";\n\nexport interface StackChildProps extends StackProps {\n /**\n * CSS flex property value (e.g. \"1\", \"1 0 auto\", \"0 1 auto\")\n * When boolean: true = 1, false = 0\n * @default undefined\n */\n flex?: string | number | boolean;\n\n /**\n * Whether this child should grow to fill available space\n * @default false\n */\n grow?: boolean;\n\n /**\n * Whether this child should shrink if necessary\n * @default false\n */\n shrink?: boolean;\n\n /**\n * Children of the stack child\n */\n children?: React.ReactNode;\n /**\n * Whether to render the child with a stack wrapper\n * @default false\n */\n stack?: boolean;\n}\n\nexport const StackChild = forwardRef<HTMLDivElement, StackChildProps>(\n (\n {\n flex,\n grow = false,\n shrink = false,\n children,\n style,\n stack = false,\n // stack props\n hug = false,\n align = \"flex-start\",\n justify = \"flex-start\",\n vertical = false,\n gap = 0,\n wrap = false,\n className,\n ...rest\n },\n ref\n ) => {\n const cls = useCls();\n const stackProps = {\n hug,\n align,\n justify,\n vertical,\n gap,\n wrap,\n };\n\n // Determine flex class based on flex prop type\n let flexClass = \"\";\n if (typeof flex === \"boolean\") {\n flexClass = flex ? cls(\"stack-child-flex-1\") : cls(\"stack-child-flex-0\");\n }\n\n // Calculate the combined className\n const combinedClassName = cn(\n cls(\"stack-child\"),\n grow && cls(\"stack-child-grow\"),\n shrink && cls(\"stack-child-shrink\"),\n flexClass,\n className\n );\n\n // Calculate the flex style value\n const flexValue =\n typeof flex === \"string\" || typeof flex === \"number\" ? flex : undefined;\n\n // Use useRender to apply props directly to the child without creating a wrapper\n const renderedElement = useRender({\n render: () =>\n React.isValidElement(children) ? children : <div>{children}</div>,\n ref,\n props: mergeProps<\"div\">(\n {\n className: combinedClassName,\n style: {\n ...style,\n flex: flexValue,\n },\n ...rest,\n },\n {}\n ),\n });\n\n return stack ? (\n <Stack {...stackProps} ref={ref} className={combinedClassName} {...rest}>\n {children}\n </Stack>\n ) : (\n renderedElement\n );\n }\n);\n\nStackChild.displayName = \"StackChild\";\n"],"names":["StackChild","forwardRef","flex","grow","shrink","children","style","stack","hug","align","justify","vertical","gap","wrap","className","rest","ref","cls","useCls","stackProps","flexClass","combinedClassName","cn","renderedElement","useRender","React","jsx","mergeProps","Stack"],"mappings":";;;;;;;;AAsCO,MAAMA,IAAaC;AAAA,EACxB,CACE;AAAA,IACE,MAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA;AAAA,IAER,KAAAC,IAAM;AAAA,IACN,OAAAC,IAAQ;AAAA,IACR,SAAAC,IAAU;AAAA,IACV,UAAAC,IAAW;AAAA,IACX,KAAAC,IAAM;AAAA,IACN,MAAAC,IAAO;AAAA,IACP,WAAAC;AAAA,IACA,GAAGC;AAAA,KAELC,MACG;AACH,UAAMC,IAAMC,EAAO,GACbC,IAAa;AAAA,MACjB,KAAAX;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,UAAAC;AAAA,MACA,KAAAC;AAAA,MACA,MAAAC;AAAA,IACF;AAGA,QAAIO,IAAY;AACZ,IAAA,OAAOlB,KAAS,cAClBkB,IAAmBH,EAAPf,IAAW,uBAA4B,oBAAR;AAI7C,UAAMmB,IAAoBC;AAAA,MACxBL,EAAI,aAAa;AAAA,MACjBd,KAAQc,EAAI,kBAAkB;AAAA,MAC9Bb,KAAUa,EAAI,oBAAoB;AAAA,MAClCG;AAAA,MACAN;AAAA,IACF,GAOMS,IAAkBC,EAAU;AAAA,MAChC,QAAQ,MACNC,EAAM,eAAepB,CAAQ,IAAIA,IAAY,gBAAAqB,EAAA,OAAA,EAAK,UAAArB,GAAS;AAAA,MAC7D,KAAAW;AAAA,MACA,OAAOW;AAAA,QACL;AAAA,UACE,WAAWN;AAAA,UACX,OAAO;AAAA,YACL,GAAGf;AAAA,YACH,MAZN,OAAOJ,KAAS,YAAY,OAAOA,KAAS,WAAWA,IAAO;AAAA,UAa1D;AAAA,UACA,GAAGa;AAAA,QACL;AAAA,QACA,CAAA;AAAA,MAAC;AAAA,IACH,CACD;AAEM,WAAAR,IACJ,gBAAAmB,EAAAE,GAAA,EAAO,GAAGT,GAAY,KAAAH,GAAU,WAAWK,GAAoB,GAAGN,GAChE,UAAAV,EAAA,CACH,IAEAkB;AAAA,EAAA;AAGN;AAEAvB,EAAW,cAAc;"}
1
+ {"version":3,"file":"StackChild.js","sources":["../../../src/components/stack/StackChild.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef, useMemo } from \"react\";\nimport { cn, useCls } from \"../utils\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\nimport { mergeProps } from \"@base-ui-components/react/merge-props\";\nimport { Stack, StackProps } from \"./Stack\";\n\nexport interface StackChildProps extends StackProps {\n /**\n * CSS flex property value (e.g. \"1\", \"1 0 auto\", \"0 1 auto\")\n * When boolean: true = 1, false = 0\n * @default undefined\n */\n flex?: string | number | boolean;\n\n /**\n * Whether this child should grow to fill available space\n * @default false\n */\n grow?: boolean;\n\n /**\n * Whether this child should shrink if necessary\n * @default false\n */\n shrink?: boolean;\n\n /**\n * Children of the stack child\n */\n children?: React.ReactNode;\n /**\n * Whether to render the child with a stack wrapper\n * @default false\n */\n stack?: boolean;\n}\n\nexport const StackChild = forwardRef<HTMLDivElement, StackChildProps>(\n (\n {\n flex,\n grow = false,\n shrink = false,\n children,\n style,\n stack = false,\n // stack props\n hug = false,\n align = \"flex-start\",\n justify = \"flex-start\",\n vertical = false,\n gap = 0,\n wrap = false,\n className,\n ...rest\n },\n ref\n ) => {\n const cls = useCls();\n const stackProps = {\n hug,\n align,\n justify,\n vertical,\n gap,\n wrap,\n };\n\n // Determine flex class based on flex prop type\n const flexClass = useMemo(() => {\n if (typeof flex === \"boolean\" || flex === 0 || flex === 1) {\n return flex === true || flex === 1\n ? cls(\"stack-child-flex-1\")\n : cls(\"stack-child-flex-0\");\n }\n return \"\";\n }, [flex, cls]);\n\n // Calculate the combined className\n const combinedClassName = cn(\n cls(\"stack-child\"),\n grow && cls(\"stack-child-grow\"),\n shrink && cls(\"stack-child-shrink\"),\n flexClass,\n className\n );\n\n // Calculate the flex style value\n const flexValue =\n flex && typeof flex !== \"boolean\" && !flexClass ? flex : undefined;\n\n // Use useRender to apply props directly to the child without creating a wrapper\n const renderedElement = useRender({\n render: React.isValidElement(children) ? children : <div>{children}</div>,\n ref,\n props: mergeProps<\"div\">(\n {\n className: combinedClassName,\n style: {\n ...style,\n flex: flexValue,\n },\n ...rest,\n },\n {}\n ),\n });\n\n return stack ? (\n <Stack {...stackProps} ref={ref} className={combinedClassName} {...rest}>\n {children}\n </Stack>\n ) : (\n renderedElement\n );\n }\n);\n\nStackChild.displayName = \"StackChild\";\n"],"names":["StackChild","forwardRef","flex","grow","shrink","children","style","stack","hug","align","justify","vertical","gap","wrap","className","rest","ref","cls","useCls","stackProps","flexClass","useMemo","combinedClassName","cn","flexValue","renderedElement","useRender","React","jsx","mergeProps","Stack"],"mappings":";;;;;;;;AAsCO,MAAMA,IAAaC;AAAA,EACxB,CACE;AAAA,IACE,MAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA;AAAA,IAER,KAAAC,IAAM;AAAA,IACN,OAAAC,IAAQ;AAAA,IACR,SAAAC,IAAU;AAAA,IACV,UAAAC,IAAW;AAAA,IACX,KAAAC,IAAM;AAAA,IACN,MAAAC,IAAO;AAAA,IACP,WAAAC;AAAA,IACA,GAAGC;AAAA,KAELC,MACG;AACH,UAAMC,IAAMC,EAAO,GACbC,IAAa;AAAA,MACjB,KAAAX;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,UAAAC;AAAA,MACA,KAAAC;AAAA,MACA,MAAAC;AAAA,IACF,GAGMO,IAAYC,EAAQ,MACpB,OAAOnB,KAAS,aAAaA,MAAS,KAAKA,MAAS,IAElDe,EADGf,MAAS,MAAQA,MAAS,IACzB,uBACA,oBADoB,IAGvB,IACN,CAACA,GAAMe,CAAG,CAAC,GAGRK,IAAoBC;AAAA,MACxBN,EAAI,aAAa;AAAA,MACjBd,KAAQc,EAAI,kBAAkB;AAAA,MAC9Bb,KAAUa,EAAI,oBAAoB;AAAA,MAClCG;AAAA,MACAN;AAAA,IACF,GAGMU,IACJtB,KAAQ,OAAOA,KAAS,aAAa,CAACkB,IAAYlB,IAAO,QAGrDuB,IAAkBC,EAAU;AAAA,MAChC,QAAQC,EAAM,eAAetB,CAAQ,IAAIA,IAAW,gBAAAuB,EAAC,SAAK,UAAAvB,GAAS;AAAA,MACnE,KAAAW;AAAA,MACA,OAAOa;AAAA,QACL;AAAA,UACE,WAAWP;AAAA,UACX,OAAO;AAAA,YACL,GAAGhB;AAAA,YACH,MAAMkB;AAAA,UACR;AAAA,UACA,GAAGT;AAAA,QACL;AAAA,QACA,CAAA;AAAA,MAAC;AAAA,IACH,CACD;AAEM,WAAAR,IACJ,gBAAAqB,EAAAE,GAAA,EAAO,GAAGX,GAAY,KAAAH,GAAU,WAAWM,GAAoB,GAAGP,GAChE,UAAAV,EAAA,CACH,IAEAoB;AAAA,EAAA;AAGN;AAEAzB,EAAW,cAAc;"}
@@ -1 +1 @@
1
- @layer components{.ds-table-column-sort-icon{display:flex;flex-direction:column}.ds-table-column-sort-icon svg{color:var(--ds-color-text-disabled);font-size:1rem}:is(.ds-table-column-sort-icon svg):hover{color:var(--ds-color-text-secondary)}.ds-table-column-sort-icon.ds-table-column-sort-icon-none svg{font-size:.75rem}.ds-table-column-sort-icon.ds-table-column-sort-icon-none>svg:first-child{margin-bottom:-2px}.ds-table-column-sort-icon.ds-table-column-sort-icon-none>svg:last-child{margin-top:-2px}.ds-table-column-filter-icon{display:flex;flex-direction:column}.ds-table-column-filter-icon svg{color:var(--ds-color-text-disabled);font-size:.875rem}:is(.ds-table-column-filter-icon svg):hover{color:var(--ds-color-text-secondary)}.ds-table-column-filter-icon.ds-table-column-filter-icon-active svg{color:var(--ds-color-primary)}.ds-table-wrapper .ds-table-ping-left .ds-table-cell-fix-left-first:after,.ds-table-wrapper .ds-table-ping-left .ds-table-cell-fix-left-last:after{box-shadow:inset 10px 0 8px -8px var(--ds-color-table-fixed-column-shadow)}.ds-table-wrapper .ds-table-ping-right .ds-table-cell-fix-right-first:after,.ds-table-wrapper .ds-table-ping-right .ds-table-cell-fix-right-last:after{box-shadow:inset -10px 0 8px -8px var(--ds-color-table-fixed-column-shadow)}.ds-table-wrapper .ds-table-ping-right:not(.ds-table-has-fix-right) .ds-table-container:after{box-shadow:inset -10px 0 8px -8px var(--ds-color-table-fixed-column-shadow)}.ds-table-wrapper .ds-table-ping-left:not(.ds-table-has-fix-left) .ds-table-container:before{box-shadow:inset 10px 0 8px -8px var(--ds-color-table-fixed-column-shadow)}.ds-table-wrapper{display:flex;flex-direction:column}.ds-table-wrapper .ds-spin-nested-loading,.ds-table-wrapper .ds-spin-container{display:flex;flex-direction:column;flex-shrink:1;flex-grow:1;min-height:0}:is(.ds-table-wrapper .ds-spin-container) .ds-table{flex-shrink:1;flex-grow:1;min-height:0}.ds-table{display:flex;flex-direction:column}.ds-table-container{flex-shrink:1;min-height:0;display:flex;flex-direction:column}.ds-table-header{flex-shrink:0}.ds-table-body{flex-shrink:1;min-height:0;min-width:0}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-thead>tr>th,:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-thead>tr>td{background:transparent}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-thead>tr>th,:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-thead>tr>td,:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>tr>th,:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>tr>td{border-bottom:0}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>.ds-table-row:nth-child(2n) .ds-table-cell{background-color:var(--ds-color-fill-tertiary)}:is(:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>.ds-table-row:nth-child(2n) .ds-table-cell):first-child{border-top-left-radius:var(--ds-border-radius);border-bottom-left-radius:var(--ds-border-radius)}:is(:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>.ds-table-row:nth-child(2n) .ds-table-cell):last-child{border-top-right-radius:var(--ds-border-radius);border-bottom-right-radius:var(--ds-border-radius)}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>.ds-table-row:nth-child(2n)>.ds-table-cell-row-hover{background-color:var(--ds-color-fill-secondary)}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>tr>td.ds-table-column-sort{background-color:unset}}
1
+ @layer components{.ds-table-column-sort-icon{display:flex;flex-direction:column}.ds-table-column-sort-icon svg{color:var(--ds-color-text-disabled);font-size:1rem}:is(.ds-table-column-sort-icon svg):hover{color:var(--ds-color-text-secondary)}.ds-table-column-sort-icon.ds-table-column-sort-icon-none svg{font-size:.75rem}.ds-table-column-sort-icon.ds-table-column-sort-icon-none>svg:first-child{margin-bottom:-2px}.ds-table-column-sort-icon.ds-table-column-sort-icon-none>svg:last-child{margin-top:-2px}.ds-table-column-filter-icon{display:flex;flex-direction:column}.ds-table-column-filter-icon svg{color:var(--ds-color-text-disabled);font-size:.875rem}:is(.ds-table-column-filter-icon svg):hover{color:var(--ds-color-text-secondary)}.ds-table-column-filter-icon.ds-table-column-filter-icon-active svg{color:var(--ds-color-primary)}.ds-table-wrapper .ds-table-ping-left .ds-table-cell-fix-left-first:after,.ds-table-wrapper .ds-table-ping-left .ds-table-cell-fix-left-last:after{box-shadow:inset 10px 0 8px -8px var(--ds-color-table-fixed-column-shadow)}.ds-table-wrapper .ds-table-ping-right .ds-table-cell-fix-right-first:after,.ds-table-wrapper .ds-table-ping-right .ds-table-cell-fix-right-last:after{box-shadow:inset -10px 0 8px -8px var(--ds-color-table-fixed-column-shadow)}.ds-table-wrapper .ds-table-ping-right:not(.ds-table-has-fix-right) .ds-table-container:after{box-shadow:inset -10px 0 8px -8px var(--ds-color-table-fixed-column-shadow)}.ds-table-wrapper .ds-table-ping-left:not(.ds-table-has-fix-left) .ds-table-container:before{box-shadow:inset 10px 0 8px -8px var(--ds-color-table-fixed-column-shadow)}.ds-table-wrapper{display:flex;flex-direction:column}.ds-table-wrapper .ds-spin-nested-loading,.ds-table-wrapper .ds-spin-container{display:flex;flex-direction:column;flex-shrink:1;flex-grow:1;min-height:0}:is(.ds-table-wrapper .ds-spin-container) .ds-table{flex-shrink:1;flex-grow:1;min-height:0}.ds-table{display:flex;flex-direction:column}.ds-table-container{flex-shrink:1;min-height:0;display:flex;flex-direction:column}.ds-table-header{flex-shrink:0}.ds-table-body{flex-shrink:1;min-height:0;min-width:0}.ds-table-zebra .ds-table{background:transparent}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-thead>tr>th,:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-thead>tr>td{background:transparent}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-thead>tr>th,:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-thead>tr>td,:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>tr>th,:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>tr>td{border-bottom:0}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>.ds-table-row:nth-child(2n) .ds-table-cell{background-color:var(--ds-color-fill-tertiary)}:is(:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>.ds-table-row:nth-child(2n) .ds-table-cell):first-child{border-top-left-radius:var(--ds-border-radius);border-bottom-left-radius:var(--ds-border-radius)}:is(:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>.ds-table-row:nth-child(2n) .ds-table-cell):last-child{border-top-right-radius:var(--ds-border-radius);border-bottom-right-radius:var(--ds-border-radius)}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>.ds-table-row:nth-child(2n)>.ds-table-cell-row-hover{background-color:var(--ds-color-fill-secondary)}:is(.ds-table-zebra>.ds-spin-nested-loading>.ds-spin-container>.ds-table>.ds-table-container>.ds-table-content>table)>.ds-table-tbody>tr>td.ds-table-column-sort{background-color:unset}}
package/dist/index.d.ts CHANGED
@@ -1727,6 +1727,10 @@ export declare const Form: (<Values = any>({ ...rest }: InternalFormProps<Values
1727
1727
  export { FormInstance }
1728
1728
 
1729
1729
  export declare interface FormItemProps<Values = unknown> extends FormItemProps_2<Values> {
1730
+ /**
1731
+ * Whether the field is optional. If true, the label will be marked as optional.
1732
+ * @default false
1733
+ */
1730
1734
  optionalMark?: boolean | React.ReactNode;
1731
1735
  }
1732
1736
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bioturing/components",
3
- "version": "0.20.1",
3
+ "version": "0.20.2",
4
4
  "type": "module",
5
5
  "module": "./dist/index.js",
6
6
  "main": "./dist/index.js",