@bioturing/components 0.46.4 → 0.48.0
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.
- package/dist/components/base-menu/component.js +19 -21
- package/dist/components/base-menu/component.js.map +1 -1
- package/dist/components/base-menu/index.d.ts +1 -1
- package/dist/components/base-menu/index.d.ts.map +1 -1
- package/dist/components/base-menu/index.js +12 -7
- package/dist/components/base-menu/index.js.map +1 -1
- package/dist/components/base-menu/item.css +1 -1
- package/dist/components/base-menu/item.d.ts +13 -2
- package/dist/components/base-menu/item.d.ts.map +1 -1
- package/dist/components/base-menu/item.js +62 -47
- package/dist/components/base-menu/item.js.map +1 -1
- package/dist/components/base-menu/style.css +1 -1
- package/dist/components/checkbox/component.d.ts +2 -2
- package/dist/components/checkbox/component.d.ts.map +1 -1
- package/dist/components/checkbox/component.js.map +1 -1
- package/dist/components/choice-list/component.js +12 -12
- package/dist/components/combobox/component.d.ts.map +1 -1
- package/dist/components/combobox/component.js +121 -121
- package/dist/components/combobox/component.js.map +1 -1
- package/dist/components/combobox/style.css +1 -1
- package/dist/components/data-table/component.d.ts.map +1 -1
- package/dist/components/data-table/component.js +99 -79
- package/dist/components/data-table/component.js.map +1 -1
- package/dist/components/data-table/components/TableBody.d.ts +3 -2
- package/dist/components/data-table/components/TableBody.d.ts.map +1 -1
- package/dist/components/data-table/components/TableBody.js +106 -89
- package/dist/components/data-table/components/TableBody.js.map +1 -1
- package/dist/components/data-table/components/TableHeader.d.ts +3 -1
- package/dist/components/data-table/components/TableHeader.d.ts.map +1 -1
- package/dist/components/data-table/components/TableHeader.js +121 -93
- package/dist/components/data-table/components/TableHeader.js.map +1 -1
- package/dist/components/data-table/components/TablePagination.d.ts.map +1 -1
- package/dist/components/data-table/components/TablePagination.js +36 -31
- package/dist/components/data-table/components/TablePagination.js.map +1 -1
- package/dist/components/data-table/hooks.d.ts.map +1 -1
- package/dist/components/data-table/hooks.js +98 -83
- package/dist/components/data-table/hooks.js.map +1 -1
- package/dist/components/data-table/style.css +1 -1
- package/dist/components/data-table/types.d.ts +1 -1
- package/dist/components/data-table/types.d.ts.map +1 -1
- package/dist/components/data-table/utils.js +37 -30
- package/dist/components/data-table/utils.js.map +1 -1
- package/dist/components/data-table/variant-minimal.css +1 -0
- package/dist/components/data-table/variant-zebra.css +1 -0
- package/dist/components/dialog/Dialog.js +46 -46
- package/dist/components/dialog/Dialog.js.map +1 -1
- package/dist/components/dialog/dialog.css +1 -1
- package/dist/components/dropdown-menu/component.d.ts.map +1 -1
- package/dist/components/dropdown-menu/component.js +121 -144
- package/dist/components/dropdown-menu/component.js.map +1 -1
- package/dist/components/dropdown-menu/index.d.ts +2 -0
- package/dist/components/dropdown-menu/index.d.ts.map +1 -1
- package/dist/components/dropdown-menu/item.d.ts +7 -15
- package/dist/components/dropdown-menu/item.d.ts.map +1 -1
- package/dist/components/dropdown-menu/item.js +132 -81
- package/dist/components/dropdown-menu/item.js.map +1 -1
- package/dist/components/dropdown-menu/radio-group.d.ts +14 -0
- package/dist/components/dropdown-menu/radio-group.d.ts.map +1 -0
- package/dist/components/dropdown-menu/radio-group.js +45 -0
- package/dist/components/dropdown-menu/radio-group.js.map +1 -0
- package/dist/components/dropdown-menu/search-mode.d.ts +4 -0
- package/dist/components/dropdown-menu/search-mode.d.ts.map +1 -0
- package/dist/components/dropdown-menu/search-mode.js +6 -0
- package/dist/components/dropdown-menu/search-mode.js.map +1 -0
- package/dist/components/dropdown-menu/style.css +1 -1
- package/dist/components/dropdown-menu/submenu.d.ts +25 -0
- package/dist/components/dropdown-menu/submenu.d.ts.map +1 -0
- package/dist/components/dropdown-menu/submenu.js +96 -0
- package/dist/components/dropdown-menu/submenu.js.map +1 -0
- package/dist/components/dropdown-menu/types.d.ts +85 -12
- package/dist/components/dropdown-menu/types.d.ts.map +1 -1
- package/dist/components/dropdown-menu/useDropdownMenu.d.ts +4 -8
- package/dist/components/dropdown-menu/useDropdownMenu.d.ts.map +1 -1
- package/dist/components/dropdown-menu/useDropdownMenu.js +108 -81
- package/dist/components/dropdown-menu/useDropdownMenu.js.map +1 -1
- package/dist/components/form/FormItem/ItemHolder.d.ts +6 -5
- package/dist/components/form/FormItem/ItemHolder.d.ts.map +1 -1
- package/dist/components/form/FormItem/ItemHolder.js +32 -29
- package/dist/components/form/FormItem/ItemHolder.js.map +1 -1
- package/dist/components/form/FormItem/index.d.ts +6 -0
- package/dist/components/form/FormItem/index.d.ts.map +1 -1
- package/dist/components/form/FormItem/index.js +138 -127
- package/dist/components/form/FormItem/index.js.map +1 -1
- package/dist/components/form/FormValidationContext.d.ts +5 -0
- package/dist/components/form/FormValidationContext.d.ts.map +1 -0
- package/dist/components/form/FormValidationContext.js +7 -0
- package/dist/components/form/FormValidationContext.js.map +1 -0
- package/dist/components/form/component.d.ts +6 -1
- package/dist/components/form/component.d.ts.map +1 -1
- package/dist/components/form/component.js +30 -20
- package/dist/components/form/component.js.map +1 -1
- package/dist/components/form/formValidationRule.d.ts +19 -0
- package/dist/components/form/formValidationRule.d.ts.map +1 -0
- package/dist/components/form/formValidationRule.js +22 -0
- package/dist/components/form/formValidationRule.js.map +1 -0
- package/dist/components/form/index.d.ts +2 -0
- package/dist/components/form/index.d.ts.map +1 -1
- package/dist/components/form/useFormValidation.d.ts +3 -0
- package/dist/components/form/useFormValidation.d.ts.map +1 -0
- package/dist/components/form/useFormValidation.js +18 -0
- package/dist/components/form/useFormValidation.js.map +1 -0
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/keyboard-shortcut/component.d.ts +2 -0
- package/dist/components/keyboard-shortcut/component.d.ts.map +1 -1
- package/dist/components/keyboard-shortcut/component.js +69 -49
- package/dist/components/keyboard-shortcut/component.js.map +1 -1
- package/dist/components/modal/Modal.d.ts +1 -1
- package/dist/components/modal/Modal.js +9 -9
- package/dist/components/modal/Modal.js.map +1 -1
- package/dist/components/modal/style.css +1 -1
- package/dist/components/select/component.js +29 -29
- package/dist/components/select/component.js.map +1 -1
- package/dist/components/theme-provider/component.d.ts +3 -1
- package/dist/components/theme-provider/component.d.ts.map +1 -1
- package/dist/components/theme-provider/component.js +32 -31
- package/dist/components/theme-provider/component.js.map +1 -1
- package/dist/components/theme-provider/context/index.d.ts +2 -1
- package/dist/components/theme-provider/context/index.d.ts.map +1 -1
- package/dist/components/theme-provider/context/provider.d.ts +2 -3
- package/dist/components/theme-provider/context/provider.d.ts.map +1 -1
- package/dist/components/theme-provider/context/provider.js +13 -6
- package/dist/components/theme-provider/context/provider.js.map +1 -1
- package/dist/components/theme-provider/context/themeStore.d.ts +15 -0
- package/dist/components/theme-provider/context/themeStore.d.ts.map +1 -1
- package/dist/components/theme-provider/context/themeStore.js +10 -9
- package/dist/components/theme-provider/context/themeStore.js.map +1 -1
- package/dist/components/theme-provider/style.css +1 -1
- package/dist/components/tooltip/component.d.ts.map +1 -1
- package/dist/components/tooltip/component.js +23 -12
- package/dist/components/tooltip/component.js.map +1 -1
- package/dist/index.js +273 -258
- package/dist/index.js.map +1 -1
- package/dist/metadata.d.ts +9 -0
- package/dist/metadata.d.ts.map +1 -1
- package/dist/metadata.js +14 -0
- package/dist/metadata.js.map +1 -1
- package/dist/stats.html +1 -1
- package/package.json +6 -6
|
@@ -1,22 +1,18 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { DropdownMenuInteractiveItem } from './types';
|
|
3
3
|
export interface DropdownMenuItemProps {
|
|
4
4
|
/**
|
|
5
5
|
* The menu item data
|
|
6
6
|
*/
|
|
7
|
-
item:
|
|
8
|
-
type: "item";
|
|
9
|
-
};
|
|
7
|
+
item: DropdownMenuInteractiveItem;
|
|
10
8
|
/**
|
|
11
9
|
* Custom render function for the item
|
|
12
10
|
*/
|
|
13
|
-
itemRender?: (item:
|
|
11
|
+
itemRender?: (item: DropdownMenuInteractiveItem, props: React.HTMLAttributes<HTMLElement>) => React.ReactElement;
|
|
14
12
|
/**
|
|
15
13
|
* Custom render function for the item label
|
|
16
14
|
*/
|
|
17
|
-
itemLabelRender?: (item:
|
|
18
|
-
type: "item";
|
|
19
|
-
}, props: React.HTMLAttributes<HTMLElement>) => React.ReactElement;
|
|
15
|
+
itemLabelRender?: (item: DropdownMenuInteractiveItem, props: React.HTMLAttributes<HTMLElement>) => React.ReactElement;
|
|
20
16
|
/**
|
|
21
17
|
* Additional props to pass to the item
|
|
22
18
|
*/
|
|
@@ -33,9 +29,7 @@ export interface DropdownMenuItemProps {
|
|
|
33
29
|
/**
|
|
34
30
|
* Function to be called after the menu item is selected
|
|
35
31
|
*/
|
|
36
|
-
afterSelect?: (item:
|
|
37
|
-
type: "item";
|
|
38
|
-
}) => void;
|
|
32
|
+
afterSelect?: (item: DropdownMenuInteractiveItem) => void;
|
|
39
33
|
/**
|
|
40
34
|
* Whether the menu item is in a combobox
|
|
41
35
|
*/
|
|
@@ -58,9 +52,7 @@ export interface DropdownMenuItemProps {
|
|
|
58
52
|
* Function to extract keywords from the item for search filtering
|
|
59
53
|
* @default (item) => [String(item.key), reactNodeToString(item.label)]
|
|
60
54
|
*/
|
|
61
|
-
getItemKeywords?: (item:
|
|
62
|
-
type: "item";
|
|
63
|
-
}) => string[];
|
|
55
|
+
getItemKeywords?: (item: DropdownMenuInteractiveItem) => string[];
|
|
64
56
|
}
|
|
65
|
-
export declare const DropdownMenuItem: React.
|
|
57
|
+
export declare const DropdownMenuItem: React.NamedExoticComponent<DropdownMenuItemProps>;
|
|
66
58
|
//# sourceMappingURL=item.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/item.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/item.tsx"],"names":[],"mappings":"AACA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAEhD,OAAO,KAAK,EAA4B,2BAA2B,EAAE,MAAM,SAAS,CAAC;AAOrF,MAAM,WAAW,qBAAqB;IACpC;;OAEG;IACH,IAAI,EAAE,2BAA2B,CAAC;IAClC;;OAEG;IACH,UAAU,CAAC,EAAE,CACX,IAAI,EAAE,2BAA2B,EACjC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,KACrC,KAAK,CAAC,YAAY,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,CAChB,IAAI,EAAE,2BAA2B,EACjC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,KACrC,KAAK,CAAC,YAAY,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC;IAC9C;;OAEG;IACH,UAAU,CAAC,EAAE;QACX,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,UAAU,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;IACF;;OAEG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,2BAA2B,KAAK,IAAI,CAAC;IAC1D;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,2BAA2B,KAAK,MAAM,EAAE,CAAC;CACnE;AAsLD,eAAO,MAAM,gBAAgB,mDAAoC,CAAC"}
|
|
@@ -1,106 +1,157 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as
|
|
3
|
-
import { useCallback as
|
|
4
|
-
import { Combobox as
|
|
5
|
-
import { Menu as
|
|
6
|
-
import {
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import { useCls as
|
|
10
|
-
import {
|
|
11
|
-
|
|
2
|
+
import { jsx as n } from "react/jsx-runtime";
|
|
3
|
+
import E, { useCallback as N } from "react";
|
|
4
|
+
import { Combobox as L } from "@base-ui/react/combobox";
|
|
5
|
+
import { Menu as h } from "@base-ui/react/menu";
|
|
6
|
+
import { CheckIcon as j } from "@bioturing/assets";
|
|
7
|
+
import { BaseMenuItem as C } from "../base-menu/item.js";
|
|
8
|
+
import D from "../utils/createSyntheticClickEvent.js";
|
|
9
|
+
import { useCls as R } from "../utils/antdUtils.js";
|
|
10
|
+
import { useControlledState as _ } from "../hooks/useControlledState.js";
|
|
11
|
+
import { clsx as d } from "../utils/cn.js";
|
|
12
|
+
const z = ({
|
|
12
13
|
item: o,
|
|
13
|
-
inCombobox:
|
|
14
|
-
selected:
|
|
15
|
-
itemRender:
|
|
16
|
-
itemLabelRender:
|
|
17
|
-
itemProps:
|
|
18
|
-
classNames:
|
|
19
|
-
afterSelect:
|
|
20
|
-
showCheckbox:
|
|
21
|
-
indeterminate:
|
|
22
|
-
getItemKeywords: u
|
|
14
|
+
inCombobox: u = !1,
|
|
15
|
+
selected: M = !1,
|
|
16
|
+
itemRender: i,
|
|
17
|
+
itemLabelRender: b,
|
|
18
|
+
itemProps: I = {},
|
|
19
|
+
classNames: l,
|
|
20
|
+
afterSelect: r,
|
|
21
|
+
showCheckbox: y,
|
|
22
|
+
indeterminate: g
|
|
23
23
|
}) => {
|
|
24
|
-
const
|
|
25
|
-
(
|
|
26
|
-
if (o.onSelect)
|
|
24
|
+
const f = R(), k = N(
|
|
25
|
+
(e) => {
|
|
26
|
+
if (o.type === "item" && o.onSelect)
|
|
27
|
+
o.onSelect(o);
|
|
28
|
+
else if (o.type === "checkbox" && o.onSelect)
|
|
29
|
+
o.onSelect(o);
|
|
30
|
+
else if (o.type === "radio" && o.onSelect)
|
|
27
31
|
o.onSelect(o);
|
|
28
32
|
else if (o.onClick)
|
|
29
|
-
if (typeof
|
|
30
|
-
o.onClick(
|
|
33
|
+
if (typeof e == "object")
|
|
34
|
+
o.onClick(e);
|
|
31
35
|
else {
|
|
32
|
-
const
|
|
33
|
-
o.onClick(
|
|
36
|
+
const c = D(null);
|
|
37
|
+
o.onClick(c);
|
|
34
38
|
}
|
|
35
|
-
|
|
39
|
+
r && r(o);
|
|
36
40
|
},
|
|
37
|
-
[
|
|
38
|
-
)
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
),
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
41
|
+
[r, o]
|
|
42
|
+
), s = o.type === "checkbox", v = o.type === "radio", [x, O] = _(
|
|
43
|
+
s ? o.checked : void 0,
|
|
44
|
+
s ? o.onCheckedChange : void 0,
|
|
45
|
+
s ? o.defaultChecked : void 0
|
|
46
|
+
), a = s || v, t = s ? x ?? !1 : M, S = a ? /* @__PURE__ */ n("span", { className: f("dropdown-menu-checkbox-indicator"), children: t ? /* @__PURE__ */ n(j, { size: 14 }) : null }) : o.icon, w = u ? void 0 : o.suffix;
|
|
47
|
+
if (i)
|
|
48
|
+
return i(o, {
|
|
49
|
+
className: d(
|
|
50
|
+
f("dropdown-menu-item", u && "dropdown-menu-item-combobox"),
|
|
51
|
+
l?.item,
|
|
52
|
+
o.className
|
|
53
|
+
),
|
|
54
|
+
"data-danger": o.danger,
|
|
55
|
+
"data-actual-selected": a ? !1 : t,
|
|
56
|
+
"data-value": typeof o.label == "string" ? o.label : String(o.key),
|
|
57
|
+
ref: o.ref,
|
|
58
|
+
onClick: k,
|
|
59
|
+
onMouseEnter: o.onMouseEnter,
|
|
60
|
+
onMouseLeave: o.onMouseLeave,
|
|
61
|
+
onMouseOver: o.onMouseOver,
|
|
62
|
+
onMouseOut: o.onMouseOut,
|
|
63
|
+
...I
|
|
64
|
+
});
|
|
65
|
+
const p = {
|
|
66
|
+
disabled: o.disabled,
|
|
67
|
+
danger: o.danger,
|
|
68
|
+
selected: a ? !1 : t,
|
|
69
|
+
showCheckbox: a ? !1 : y,
|
|
70
|
+
indeterminate: g,
|
|
71
|
+
icon: S,
|
|
72
|
+
description: o.description,
|
|
73
|
+
suffix: w,
|
|
74
|
+
classNames: {
|
|
75
|
+
root: d(
|
|
76
|
+
f("dropdown-menu-item", u && "dropdown-menu-item-combobox"),
|
|
77
|
+
l?.item,
|
|
78
|
+
o.className,
|
|
79
|
+
o.classNames?.root
|
|
80
|
+
),
|
|
81
|
+
icon: d(l?.itemIcon, o.classNames?.icon),
|
|
82
|
+
text: d(l?.itemText, o.classNames?.text),
|
|
83
|
+
suffix: d(l?.itemSuffix, o.classNames?.suffix)
|
|
84
|
+
},
|
|
85
|
+
labelRender: b ? (e) => b(o, e) : void 0,
|
|
51
86
|
ref: o.ref,
|
|
52
|
-
onClick: c,
|
|
53
87
|
onMouseEnter: o.onMouseEnter,
|
|
54
88
|
onMouseLeave: o.onMouseLeave,
|
|
55
89
|
onMouseOver: o.onMouseOver,
|
|
56
90
|
onMouseOut: o.onMouseOut,
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
91
|
+
"data-value": typeof o.label == "string" ? o.label : String(o.key),
|
|
92
|
+
"data-actual-selected": a ? !1 : t
|
|
93
|
+
};
|
|
94
|
+
if (s) {
|
|
95
|
+
const e = o;
|
|
96
|
+
return /* @__PURE__ */ n(
|
|
97
|
+
C,
|
|
98
|
+
{
|
|
99
|
+
...p,
|
|
100
|
+
render: /* @__PURE__ */ n(
|
|
101
|
+
h.CheckboxItem,
|
|
102
|
+
{
|
|
103
|
+
checked: x,
|
|
104
|
+
closeOnClick: !1,
|
|
105
|
+
onClick: (c) => {
|
|
106
|
+
e.onClick?.(c);
|
|
107
|
+
},
|
|
108
|
+
onCheckedChange: (c) => {
|
|
109
|
+
e.onSelect?.(e), O(c, e), r?.(e);
|
|
110
|
+
}
|
|
111
|
+
}
|
|
77
112
|
),
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
113
|
+
children: e.label
|
|
114
|
+
}
|
|
115
|
+
);
|
|
116
|
+
}
|
|
117
|
+
if (v) {
|
|
118
|
+
const e = o;
|
|
119
|
+
return /* @__PURE__ */ n(
|
|
120
|
+
C,
|
|
121
|
+
{
|
|
122
|
+
...p,
|
|
123
|
+
render: /* @__PURE__ */ n(
|
|
124
|
+
h.RadioItem,
|
|
125
|
+
{
|
|
126
|
+
value: e.value,
|
|
127
|
+
closeOnClick: !1,
|
|
128
|
+
onClick: (c) => {
|
|
129
|
+
e.onClick?.(c), e.onSelect?.(e), r?.(e);
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
),
|
|
133
|
+
children: e.label
|
|
134
|
+
}
|
|
135
|
+
);
|
|
136
|
+
}
|
|
137
|
+
return /* @__PURE__ */ n(
|
|
138
|
+
C,
|
|
139
|
+
{
|
|
140
|
+
...p,
|
|
141
|
+
render: u ? /* @__PURE__ */ n(
|
|
142
|
+
L.Item,
|
|
92
143
|
{
|
|
93
144
|
role: "option",
|
|
94
145
|
value: String(o.key),
|
|
95
|
-
onClick:
|
|
146
|
+
onClick: k
|
|
96
147
|
},
|
|
97
148
|
String(o.key)
|
|
98
|
-
) : /* @__PURE__ */
|
|
149
|
+
) : /* @__PURE__ */ n(h.Item, { closeOnClick: !1, onClick: k }),
|
|
99
150
|
children: o.label
|
|
100
151
|
}
|
|
101
152
|
);
|
|
102
|
-
};
|
|
153
|
+
}, Q = E.memo(z);
|
|
103
154
|
export {
|
|
104
|
-
|
|
155
|
+
Q as DropdownMenuItem
|
|
105
156
|
};
|
|
106
157
|
//# sourceMappingURL=item.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.js","sources":["../../../src/components/dropdown-menu/item.tsx"],"sourcesContent":["\"use client\";\nimport React, { Ref, useCallback, useMemo } from \"react\";\nimport {\n clsx,\n createSyntheticClickEvent,\n reactNodeToString,\n useCls,\n} from \"../utils\";\nimport type { DropdownMenuItemType } from \"./types\";\nimport { Combobox } from \"@base-ui/react/combobox\";\nimport { Menu } from \"@base-ui/react/menu\";\nimport { BaseMenuItem } from \"../base-menu\";\n\nexport interface DropdownMenuItemProps {\n /**\n * The menu item data\n */\n item: DropdownMenuItemType & { type: \"item\" };\n /**\n * Custom render function for the item\n */\n itemRender?: (\n item: DropdownMenuItemType,\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n /**\n * Custom render function for the item label\n */\n itemLabelRender?: (\n item: DropdownMenuItemType & { type: \"item\" },\n props: React.HTMLAttributes<HTMLElement>\n ) => React.ReactElement;\n /**\n * Additional props to pass to the item\n */\n itemProps?: React.HTMLAttributes<HTMLElement>;\n /**\n * Class names from parent DropdownMenu\n */\n classNames?: {\n item?: string;\n itemIcon?: string;\n itemText?: string;\n itemSuffix?: string;\n };\n /**\n * Function to be called after the menu item is selected\n */\n afterSelect?: (item: DropdownMenuItemType & { type: \"item\" }) => void;\n /**\n * Whether the menu item is in a combobox\n */\n inCombobox?: boolean;\n /**\n * Whether the menu item is selected (for combobox)\n * @default false\n */\n selected?: boolean;\n /**\n * Whether to show checkbox (only for decoration purpose)\n */\n showCheckbox?: boolean;\n /**\n * Whether the menu item checkbox is indeterminate (for combobox)\n * @default false\n */\n indeterminate?: boolean;\n /**\n * Function to extract keywords from the item for search filtering\n * @default (item) => [String(item.key), reactNodeToString(item.label)]\n */\n getItemKeywords?: (item: DropdownMenuItemType & { type: \"item\" }) => string[];\n}\n\nexport const DropdownMenuItem: React.FC<DropdownMenuItemProps> = ({\n item,\n inCombobox = false,\n selected = false,\n itemRender,\n itemLabelRender,\n itemProps = {},\n classNames,\n afterSelect,\n showCheckbox,\n indeterminate,\n getItemKeywords,\n}) => {\n const cls = useCls();\n\n const handler = useCallback(\n (e?: React.MouseEvent<HTMLElement, MouseEvent> | string) => {\n // onSelect has priority over onClick\n if (item.onSelect) {\n item.onSelect(item);\n } else if (item.onClick) {\n if (typeof e === \"object\") {\n item.onClick(e);\n } else {\n const event = createSyntheticClickEvent(null);\n item.onClick(event);\n }\n }\n if (afterSelect) afterSelect(item);\n },\n [afterSelect, item]\n );\n\n const keywords = useMemo(\n () =>\n getItemKeywords\n ? getItemKeywords(item)\n : [String(item.key), reactNodeToString(item.label)],\n [getItemKeywords, item]\n );\n\n // If custom render function is provided, use it\n if (itemRender) {\n return itemRender(item, {\n className: clsx(\n cls(\"dropdown-menu-item\", inCombobox && \"dropdown-menu-item-combobox\"),\n classNames?.item,\n item.className\n ),\n \"data-danger\": item.danger,\n \"data-actual-selected\": selected,\n \"data-value\":\n typeof item.label === \"string\" ? item.label : String(item.key),\n ref: item.ref as Ref<HTMLDivElement>,\n onClick: handler,\n onMouseEnter: item.onMouseEnter,\n onMouseLeave: item.onMouseLeave,\n onMouseOver: item.onMouseOver,\n onMouseOut: item.onMouseOut,\n ...itemProps,\n } as React.HTMLAttributes<HTMLElement>);\n }\n\n return (\n <BaseMenuItem\n // BaseMenuItem props\n disabled={item.disabled}\n danger={item.danger}\n selected={selected}\n showCheckbox={showCheckbox}\n indeterminate={indeterminate}\n icon={item.icon}\n suffix={!inCombobox ? item.suffix : undefined}\n classNames={{\n root: clsx(\n cls(\n \"dropdown-menu-item\",\n inCombobox && \"dropdown-menu-item-combobox\"\n ),\n classNames?.item,\n item.className,\n item.classNames?.root\n ),\n icon: clsx(classNames?.itemIcon, item.classNames?.icon),\n text: clsx(classNames?.itemText, item.classNames?.text),\n suffix: clsx(classNames?.itemSuffix, item.classNames?.suffix),\n }}\n labelRender={\n itemLabelRender\n ? (props: React.HTMLAttributes<HTMLElement>) =>\n itemLabelRender(item, props)\n : undefined\n }\n ref={item.ref as Ref<HTMLDivElement>}\n onMouseEnter={item.onMouseEnter}\n onMouseLeave={item.onMouseLeave}\n onMouseOver={item.onMouseOver}\n onMouseOut={item.onMouseOut}\n data-value={\n typeof item.label === \"string\" ? item.label : String(item.key)\n }\n data-actual-selected={selected}\n // Render prop to use Base UI components\n render={\n inCombobox ? (\n <Combobox.Item\n role=\"option\"\n key={String(item.key)}\n value={String(item.key)}\n onClick={handler}\n />\n ) : (\n <Menu.Item onClick={handler} />\n )\n }\n >\n {item.label}\n </BaseMenuItem>\n );\n};\n"],"names":["DropdownMenuItem","item","inCombobox","selected","itemRender","itemLabelRender","itemProps","classNames","afterSelect","showCheckbox","indeterminate","getItemKeywords","cls","useCls","handler","useCallback","e","event","createSyntheticClickEvent","useMemo","reactNodeToString","clsx","jsx","BaseMenuItem","props","Combobox","Menu"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"item.js","sources":["../../../src/components/dropdown-menu/item.tsx"],"sourcesContent":["\"use client\";\nimport React, { Ref, useCallback } from \"react\";\nimport { clsx, createSyntheticClickEvent, useCls } from \"../utils\";\nimport type { DropdownMenuCheckboxItem, DropdownMenuInteractiveItem } from \"./types\";\nimport { Combobox } from \"@base-ui/react/combobox\";\nimport { Menu } from \"@base-ui/react/menu\";\nimport { CheckIcon } from \"@bioturing/assets\";\nimport { BaseMenuItem } from \"../base-menu\";\nimport { useControlledState } from \"../hooks\";\n\nexport interface DropdownMenuItemProps {\n /**\n * The menu item data\n */\n item: DropdownMenuInteractiveItem;\n /**\n * Custom render function for the item\n */\n itemRender?: (\n item: DropdownMenuInteractiveItem,\n props: React.HTMLAttributes<HTMLElement>,\n ) => React.ReactElement;\n /**\n * Custom render function for the item label\n */\n itemLabelRender?: (\n item: DropdownMenuInteractiveItem,\n props: React.HTMLAttributes<HTMLElement>,\n ) => React.ReactElement;\n /**\n * Additional props to pass to the item\n */\n itemProps?: React.HTMLAttributes<HTMLElement>;\n /**\n * Class names from parent DropdownMenu\n */\n classNames?: {\n item?: string;\n itemIcon?: string;\n itemText?: string;\n itemSuffix?: string;\n };\n /**\n * Function to be called after the menu item is selected\n */\n afterSelect?: (item: DropdownMenuInteractiveItem) => void;\n /**\n * Whether the menu item is in a combobox\n */\n inCombobox?: boolean;\n /**\n * Whether the menu item is selected (for combobox)\n * @default false\n */\n selected?: boolean;\n /**\n * Whether to show checkbox (only for decoration purpose)\n */\n showCheckbox?: boolean;\n /**\n * Whether the menu item checkbox is indeterminate (for combobox)\n * @default false\n */\n indeterminate?: boolean;\n /**\n * Function to extract keywords from the item for search filtering\n * @default (item) => [String(item.key), reactNodeToString(item.label)]\n */\n getItemKeywords?: (item: DropdownMenuInteractiveItem) => string[];\n}\n\nconst DropdownMenuItemInner: React.FC<DropdownMenuItemProps> = ({\n item,\n inCombobox = false,\n selected = false,\n itemRender,\n itemLabelRender,\n itemProps = {},\n classNames,\n afterSelect,\n showCheckbox,\n indeterminate,\n}) => {\n const cls = useCls();\n\n const handler = useCallback(\n (e?: React.MouseEvent<HTMLElement, MouseEvent> | string) => {\n // onSelect has priority over onClick\n if (item.type === \"item\" && item.onSelect) {\n item.onSelect(item);\n } else if (item.type === \"checkbox\" && item.onSelect) {\n item.onSelect(item);\n } else if (item.type === \"radio\" && item.onSelect) {\n item.onSelect(item);\n } else if (item.onClick) {\n if (typeof e === \"object\") {\n item.onClick(e);\n } else {\n const event = createSyntheticClickEvent(null);\n item.onClick(event);\n }\n }\n if (afterSelect) afterSelect(item);\n },\n [afterSelect, item],\n );\n\n const isCheckboxItem = item.type === \"checkbox\";\n const isRadioItem = item.type === \"radio\";\n const [checkboxChecked, setCheckboxChecked] = useControlledState<\n boolean,\n [DropdownMenuCheckboxItem]\n >(\n isCheckboxItem ? item.checked : undefined,\n isCheckboxItem ? item.onCheckedChange : undefined,\n isCheckboxItem ? item.defaultChecked : undefined,\n );\n const hasCheckIndicator = isCheckboxItem || isRadioItem;\n const checked = isCheckboxItem ? (checkboxChecked ?? false) : selected;\n const icon = hasCheckIndicator ? (\n <span className={cls(\"dropdown-menu-checkbox-indicator\")}>\n {checked ? <CheckIcon size={14} /> : null}\n </span>\n ) : (\n item.icon\n );\n const suffix = !inCombobox ? item.suffix : undefined;\n\n // If custom render function is provided, use it\n if (itemRender) {\n return itemRender(item, {\n className: clsx(\n cls(\"dropdown-menu-item\", inCombobox && \"dropdown-menu-item-combobox\"),\n classNames?.item,\n item.className,\n ),\n \"data-danger\": item.danger,\n \"data-actual-selected\": hasCheckIndicator ? false : checked,\n \"data-value\": typeof item.label === \"string\" ? item.label : String(item.key),\n ref: item.ref as Ref<HTMLDivElement>,\n onClick: handler,\n onMouseEnter: item.onMouseEnter,\n onMouseLeave: item.onMouseLeave,\n onMouseOver: item.onMouseOver,\n onMouseOut: item.onMouseOut,\n ...itemProps,\n } as React.HTMLAttributes<HTMLElement>);\n }\n\n const commonProps = {\n disabled: item.disabled,\n danger: item.danger,\n selected: hasCheckIndicator ? false : checked,\n showCheckbox: hasCheckIndicator ? false : showCheckbox,\n indeterminate,\n icon,\n description: item.description,\n suffix,\n classNames: {\n root: clsx(\n cls(\"dropdown-menu-item\", inCombobox && \"dropdown-menu-item-combobox\"),\n classNames?.item,\n item.className,\n item.classNames?.root,\n ),\n icon: clsx(classNames?.itemIcon, item.classNames?.icon),\n text: clsx(classNames?.itemText, item.classNames?.text),\n suffix: clsx(classNames?.itemSuffix, item.classNames?.suffix),\n },\n labelRender: itemLabelRender\n ? (props: React.HTMLAttributes<HTMLElement>) => itemLabelRender(item, props)\n : undefined,\n ref: item.ref as Ref<HTMLDivElement>,\n onMouseEnter: item.onMouseEnter,\n onMouseLeave: item.onMouseLeave,\n onMouseOver: item.onMouseOver,\n onMouseOut: item.onMouseOut,\n \"data-value\": typeof item.label === \"string\" ? item.label : String(item.key),\n \"data-actual-selected\": hasCheckIndicator ? false : checked,\n } as const;\n\n if (isCheckboxItem) {\n const checkboxItem = item;\n\n return (\n <BaseMenuItem\n {...commonProps}\n render={\n <Menu.CheckboxItem\n checked={checkboxChecked}\n closeOnClick={false}\n onClick={(event) => {\n checkboxItem.onClick?.(event);\n }}\n onCheckedChange={(nextChecked) => {\n checkboxItem.onSelect?.(checkboxItem);\n setCheckboxChecked(nextChecked, checkboxItem);\n afterSelect?.(checkboxItem);\n }}\n />\n }\n >\n {checkboxItem.label}\n </BaseMenuItem>\n );\n }\n\n if (isRadioItem) {\n const radioItem = item;\n\n return (\n <BaseMenuItem\n {...commonProps}\n render={\n <Menu.RadioItem\n value={radioItem.value}\n closeOnClick={false}\n onClick={(event) => {\n radioItem.onClick?.(event);\n radioItem.onSelect?.(radioItem);\n afterSelect?.(radioItem);\n }}\n />\n }\n >\n {radioItem.label}\n </BaseMenuItem>\n );\n }\n\n return (\n <BaseMenuItem\n {...commonProps}\n render={\n inCombobox ? (\n <Combobox.Item\n role=\"option\"\n key={String(item.key)}\n value={String(item.key)}\n onClick={handler}\n />\n ) : (\n <Menu.Item closeOnClick={false} onClick={handler} />\n )\n }\n >\n {item.label}\n </BaseMenuItem>\n );\n};\n\nexport const DropdownMenuItem = React.memo(DropdownMenuItemInner);\n"],"names":["DropdownMenuItemInner","item","inCombobox","selected","itemRender","itemLabelRender","itemProps","classNames","afterSelect","showCheckbox","indeterminate","cls","useCls","handler","useCallback","event","createSyntheticClickEvent","isCheckboxItem","isRadioItem","checkboxChecked","setCheckboxChecked","useControlledState","hasCheckIndicator","checked","icon","jsx","CheckIcon","suffix","clsx","commonProps","props","checkboxItem","BaseMenuItem","Menu","nextChecked","radioItem","Combobox","DropdownMenuItem","React"],"mappings":"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"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { DropdownMenuRadioGroupItem } from './types';
|
|
3
|
+
import { UseDropdownMenuProps } from './useDropdownMenu';
|
|
4
|
+
export interface DropdownMenuRadioGroupProps extends Pick<UseDropdownMenuProps, "itemRender" | "itemLabelRender" | "getItemKeywords" | "keepOpenOnSelect" | "onOpenChange"> {
|
|
5
|
+
group: DropdownMenuRadioGroupItem;
|
|
6
|
+
classNames?: {
|
|
7
|
+
item?: string;
|
|
8
|
+
itemIcon?: string;
|
|
9
|
+
itemText?: string;
|
|
10
|
+
itemSuffix?: string;
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
export declare const DropdownMenuRadioGroup: React.NamedExoticComponent<DropdownMenuRadioGroupProps>;
|
|
14
|
+
//# sourceMappingURL=radio-group.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/radio-group.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAC;AAE1D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAE9D,MAAM,WAAW,2BAA4B,SAAQ,IAAI,CACvD,oBAAoB,EACpB,YAAY,GAAG,iBAAiB,GAAG,iBAAiB,GAAG,kBAAkB,GAAG,cAAc,CAC3F;IACC,KAAK,EAAE,0BAA0B,CAAC;IAClC,UAAU,CAAC,EAAE;QACX,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,UAAU,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;CACH;AA0CD,eAAO,MAAM,sBAAsB,yDAA0C,CAAC"}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
3
|
+
import d from "react";
|
|
4
|
+
import { Menu as p } from "@base-ui/react/menu";
|
|
5
|
+
import { DropdownMenuItem as c } from "./item.js";
|
|
6
|
+
import { useControlledState as x } from "../hooks/useControlledState.js";
|
|
7
|
+
const h = ({
|
|
8
|
+
group: e,
|
|
9
|
+
classNames: o,
|
|
10
|
+
itemRender: i,
|
|
11
|
+
itemLabelRender: m,
|
|
12
|
+
getItemKeywords: u,
|
|
13
|
+
keepOpenOnSelect: a,
|
|
14
|
+
onOpenChange: l
|
|
15
|
+
}) => {
|
|
16
|
+
const [n, f] = x(
|
|
17
|
+
e.value,
|
|
18
|
+
e.onValueChange,
|
|
19
|
+
e.defaultValue
|
|
20
|
+
);
|
|
21
|
+
return /* @__PURE__ */ r(p.RadioGroup, { value: n, onValueChange: f, children: e.children.map((t) => /* @__PURE__ */ r(
|
|
22
|
+
c,
|
|
23
|
+
{
|
|
24
|
+
item: t,
|
|
25
|
+
selected: t.value === n,
|
|
26
|
+
afterSelect: () => {
|
|
27
|
+
a || l?.(!1);
|
|
28
|
+
},
|
|
29
|
+
itemRender: i,
|
|
30
|
+
itemLabelRender: m,
|
|
31
|
+
getItemKeywords: u,
|
|
32
|
+
classNames: {
|
|
33
|
+
item: o?.item,
|
|
34
|
+
itemIcon: o?.itemIcon,
|
|
35
|
+
itemText: o?.itemText,
|
|
36
|
+
itemSuffix: o?.itemSuffix
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
t.key
|
|
40
|
+
)) });
|
|
41
|
+
}, s = d.memo(h);
|
|
42
|
+
export {
|
|
43
|
+
s as DropdownMenuRadioGroup
|
|
44
|
+
};
|
|
45
|
+
//# sourceMappingURL=radio-group.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"radio-group.js","sources":["../../../src/components/dropdown-menu/radio-group.tsx"],"sourcesContent":["\"use client\";\nimport React from \"react\";\nimport { Menu } from \"@base-ui/react/menu\";\nimport { useControlledState } from \"../hooks\";\nimport type { DropdownMenuRadioGroupItem } from \"./types\";\nimport { DropdownMenuItem } from \"./item\";\nimport type { UseDropdownMenuProps } from \"./useDropdownMenu\";\n\nexport interface DropdownMenuRadioGroupProps extends Pick<\n UseDropdownMenuProps,\n \"itemRender\" | \"itemLabelRender\" | \"getItemKeywords\" | \"keepOpenOnSelect\" | \"onOpenChange\"\n> {\n group: DropdownMenuRadioGroupItem;\n classNames?: {\n item?: string;\n itemIcon?: string;\n itemText?: string;\n itemSuffix?: string;\n };\n}\n\nconst DropdownMenuRadioGroupInner: React.FC<DropdownMenuRadioGroupProps> = ({\n group,\n classNames,\n itemRender,\n itemLabelRender,\n getItemKeywords,\n keepOpenOnSelect,\n onOpenChange,\n}) => {\n const [value, setValue] = useControlledState(\n group.value,\n group.onValueChange,\n group.defaultValue,\n );\n\n return (\n <Menu.RadioGroup value={value} onValueChange={setValue}>\n {group.children.map((item) => (\n <DropdownMenuItem\n key={item.key}\n item={item}\n selected={item.value === value}\n afterSelect={() => {\n if (!keepOpenOnSelect) onOpenChange?.(false);\n }}\n itemRender={itemRender}\n itemLabelRender={itemLabelRender}\n getItemKeywords={getItemKeywords}\n classNames={{\n item: classNames?.item,\n itemIcon: classNames?.itemIcon,\n itemText: classNames?.itemText,\n itemSuffix: classNames?.itemSuffix,\n }}\n />\n ))}\n </Menu.RadioGroup>\n );\n};\n\nexport const DropdownMenuRadioGroup = React.memo(DropdownMenuRadioGroupInner);\n"],"names":["DropdownMenuRadioGroupInner","group","classNames","itemRender","itemLabelRender","getItemKeywords","keepOpenOnSelect","onOpenChange","value","setValue","useControlledState","jsx","Menu","item","DropdownMenuItem","DropdownMenuRadioGroup","React"],"mappings":";;;;;;AAqBA,MAAMA,IAAqE,CAAC;AAAA,EAC1E,OAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC;AACF,MAAM;AACJ,QAAM,CAACC,GAAOC,CAAQ,IAAIC;AAAA,IACxBT,EAAM;AAAA,IACNA,EAAM;AAAA,IACNA,EAAM;AAAA,EAAA;AAGR,SACE,gBAAAU,EAACC,EAAK,YAAL,EAAgB,OAAAJ,GAAc,eAAeC,GAC3C,UAAAR,EAAM,SAAS,IAAI,CAACY,MACnB,gBAAAF;AAAA,IAACG;AAAA,IAAA;AAAA,MAEC,MAAAD;AAAA,MACA,UAAUA,EAAK,UAAUL;AAAA,MACzB,aAAa,MAAM;AACjB,QAAKF,KAAkBC,IAAe,EAAK;AAAA,MAC7C;AAAA,MACA,YAAAJ;AAAA,MACA,iBAAAC;AAAA,MACA,iBAAAC;AAAA,MACA,YAAY;AAAA,QACV,MAAMH,GAAY;AAAA,QAClB,UAAUA,GAAY;AAAA,QACtB,UAAUA,GAAY;AAAA,QACtB,YAAYA,GAAY;AAAA,MAAA;AAAA,IAC1B;AAAA,IAdKW,EAAK;AAAA,EAAA,CAgBb,GACH;AAEJ,GAEaE,IAAyBC,EAAM,KAAKhB,CAA2B;"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { DropdownMenuItemType } from './types';
|
|
2
|
+
export declare const isDropdownMenuSearchSupportedItem: (item: DropdownMenuItemType) => boolean;
|
|
3
|
+
export declare const hasUnsupportedDropdownMenuSearchItems: (items: DropdownMenuItemType[]) => boolean;
|
|
4
|
+
//# sourceMappingURL=search-mode.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search-mode.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/search-mode.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAEpD,eAAO,MAAM,iCAAiC,GAAI,MAAM,oBAAoB,YAG1B,CAAC;AAEnD,eAAO,MAAM,qCAAqC,GAAI,OAAO,oBAAoB,EAAE,YACnB,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
const p = (e) => e.type === "header" || e.type === "divider" || e.type === "item" && !e.children?.length, r = (e) => e.some((o) => !p(o));
|
|
2
|
+
export {
|
|
3
|
+
r as hasUnsupportedDropdownMenuSearchItems,
|
|
4
|
+
p as isDropdownMenuSearchSupportedItem
|
|
5
|
+
};
|
|
6
|
+
//# sourceMappingURL=search-mode.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search-mode.js","sources":["../../../src/components/dropdown-menu/search-mode.ts"],"sourcesContent":["import type { DropdownMenuItemType } from \"./types\";\n\nexport const isDropdownMenuSearchSupportedItem = (item: DropdownMenuItemType) =>\n item.type === \"header\" ||\n item.type === \"divider\" ||\n (item.type === \"item\" && !item.children?.length);\n\nexport const hasUnsupportedDropdownMenuSearchItems = (items: DropdownMenuItemType[]) =>\n items.some((item) => !isDropdownMenuSearchSupportedItem(item));\n"],"names":["isDropdownMenuSearchSupportedItem","item","hasUnsupportedDropdownMenuSearchItems","items"],"mappings":"AAEO,MAAMA,IAAoC,CAACC,MAChDA,EAAK,SAAS,YACdA,EAAK,SAAS,aACbA,EAAK,SAAS,UAAU,CAACA,EAAK,UAAU,QAE9BC,IAAwC,CAACC,MACpDA,EAAM,KAAK,CAACF,MAAS,CAACD,EAAkCC,CAAI,CAAC;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer components{.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)}.ds-dropdown-menu-empty:empty{display:none}.ds-dropdown-menu-match-trigger-width{width:min(var(--anchor-width),var(--available-width))}.ds-dropdown-menu-container{display:flex;flex-direction:column;flex-shrink:1;min-height:0;gap:.25rem}.ds-dropdown-menu-search-wrapper{order:-1}.ds-dropdown-menu-root[data-side=top] .ds-dropdown-menu-search-wrapper{order:1}}
|
|
1
|
+
@layer components{.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)}.ds-dropdown-menu-empty:empty{display:none}.ds-dropdown-menu-match-trigger-width{width:min(var(--anchor-width),var(--available-width))}.ds-dropdown-menu-container{display:flex;flex-direction:column;flex-shrink:1;min-height:0;gap:.25rem}.ds-dropdown-menu-search-wrapper{order:-1}.ds-dropdown-menu-root[data-side=top] .ds-dropdown-menu-search-wrapper{order:1}.ds-dropdown-menu-submenu-caret{margin-left:.5rem;flex-shrink:0;color:var(--ds-color-text-tertiary);font-size:.75rem}.ds-dropdown-menu-checkbox-indicator{display:flex;align-items:center;justify-content:center;width:1rem}}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { DropdownMenuActionItem, DropdownMenuItemType } from './types';
|
|
3
|
+
import { UseDropdownMenuProps } from './useDropdownMenu';
|
|
4
|
+
export interface DropdownMenuSubmenuProps extends Pick<UseDropdownMenuProps, "itemRender" | "itemLabelRender" | "showCheckbox" | "getItemKeywords" | "selectedItemKeys" | "keepOpenOnSelect" | "onOpenChange"> {
|
|
5
|
+
/**
|
|
6
|
+
* The menu item data that contains children
|
|
7
|
+
*/
|
|
8
|
+
item: DropdownMenuActionItem & {
|
|
9
|
+
children?: DropdownMenuItemType[];
|
|
10
|
+
};
|
|
11
|
+
/**
|
|
12
|
+
* Class names from parent DropdownMenu
|
|
13
|
+
*/
|
|
14
|
+
classNames?: {
|
|
15
|
+
item?: string;
|
|
16
|
+
itemIcon?: string;
|
|
17
|
+
itemText?: string;
|
|
18
|
+
itemSuffix?: string;
|
|
19
|
+
group?: string;
|
|
20
|
+
groupLabel?: string;
|
|
21
|
+
divider?: string;
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
export declare const DropdownMenuSubmenu: React.NamedExoticComponent<DropdownMenuSubmenuProps>;
|
|
25
|
+
//# sourceMappingURL=submenu.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"submenu.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown-menu/submenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAKpD,OAAO,KAAK,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAC5E,OAAO,EAAmB,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAG1E,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CACpD,oBAAoB,EAClB,YAAY,GACZ,iBAAiB,GACjB,cAAc,GACd,iBAAiB,GACjB,kBAAkB,GAClB,kBAAkB,GAClB,cAAc,CACjB;IACC;;OAEG;IACH,IAAI,EAAE,sBAAsB,GAAG;QAAE,QAAQ,CAAC,EAAE,oBAAoB,EAAE,CAAA;KAAE,CAAC;IACrE;;OAEG;IACH,UAAU,CAAC,EAAE;QACX,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;CACH;AA0HD,eAAO,MAAM,mBAAmB,sDAAuC,CAAC"}
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as t, jsxs as c, Fragment as C } from "react/jsx-runtime";
|
|
3
|
+
import L, { useMemo as l, useCallback as j } from "react";
|
|
4
|
+
import { Menu as i } from "@base-ui/react/menu";
|
|
5
|
+
import { CaretRightIcon as k } from "@bioturing/assets";
|
|
6
|
+
import { BaseMenu as d } from "../base-menu/index.js";
|
|
7
|
+
import { useDropdownMenu as y } from "./useDropdownMenu.js";
|
|
8
|
+
import { ScrollArea as G } from "../scroll-area/component.js";
|
|
9
|
+
import { useCls as N } from "../utils/antdUtils.js";
|
|
10
|
+
import { clsx as s } from "../utils/cn.js";
|
|
11
|
+
const T = ({
|
|
12
|
+
item: e,
|
|
13
|
+
classNames: r,
|
|
14
|
+
itemRender: g,
|
|
15
|
+
itemLabelRender: a,
|
|
16
|
+
showCheckbox: m,
|
|
17
|
+
getItemKeywords: p,
|
|
18
|
+
selectedItemKeys: b,
|
|
19
|
+
keepOpenOnSelect: x,
|
|
20
|
+
onOpenChange: S
|
|
21
|
+
}) => {
|
|
22
|
+
const o = N(), { itemGroups: h, renderGroup: O } = y({
|
|
23
|
+
items: e.children || [],
|
|
24
|
+
keepOpenOnSelect: x,
|
|
25
|
+
selectedItemKeys: b,
|
|
26
|
+
showCheckbox: m,
|
|
27
|
+
getItemKeywords: p,
|
|
28
|
+
itemLabelRender: a,
|
|
29
|
+
itemRender: g,
|
|
30
|
+
onOpenChange: S,
|
|
31
|
+
classNames: {
|
|
32
|
+
item: r?.item,
|
|
33
|
+
itemIcon: r?.itemIcon,
|
|
34
|
+
itemSuffix: r?.itemSuffix,
|
|
35
|
+
group: r?.group,
|
|
36
|
+
groupLabel: r?.groupLabel,
|
|
37
|
+
divider: r?.divider
|
|
38
|
+
}
|
|
39
|
+
}), w = l(() => {
|
|
40
|
+
const n = e.suffix, f = /* @__PURE__ */ t(k, { size: 12, className: o("dropdown-menu-submenu-caret") }, "caret");
|
|
41
|
+
return n ? /* @__PURE__ */ c(C, { children: [
|
|
42
|
+
n,
|
|
43
|
+
f
|
|
44
|
+
] }) : f;
|
|
45
|
+
}, [e.suffix, o]), { getSideOffset: I, getAlignOffset: M } = l(() => ({ getSideOffset: (u) => u.side === "top" || u.side === "bottom" ? 0 : 8, getAlignOffset: (u) => u.align === "start" ? -2 : 0 }), []), A = e.label, D = e.icon, R = e.disabled, v = e.danger, P = j(
|
|
46
|
+
(n) => /* @__PURE__ */ t(d.Popup, { ...n }),
|
|
47
|
+
[]
|
|
48
|
+
);
|
|
49
|
+
return /* @__PURE__ */ c(i.SubmenuRoot, { children: [
|
|
50
|
+
/* @__PURE__ */ t(
|
|
51
|
+
d.Item,
|
|
52
|
+
{
|
|
53
|
+
disabled: R,
|
|
54
|
+
danger: v,
|
|
55
|
+
icon: D,
|
|
56
|
+
description: e.description,
|
|
57
|
+
suffix: w,
|
|
58
|
+
classNames: {
|
|
59
|
+
root: s(
|
|
60
|
+
o("dropdown-menu-item"),
|
|
61
|
+
r?.item,
|
|
62
|
+
e.className,
|
|
63
|
+
e.classNames?.root
|
|
64
|
+
),
|
|
65
|
+
icon: s(r?.itemIcon, e.classNames?.icon),
|
|
66
|
+
text: s(r?.itemText, e.classNames?.text),
|
|
67
|
+
suffix: s(r?.itemSuffix, e.classNames?.suffix)
|
|
68
|
+
},
|
|
69
|
+
"data-value": typeof e.label == "string" ? e.label : String(e.key),
|
|
70
|
+
render: /* @__PURE__ */ t(i.SubmenuTrigger, {}),
|
|
71
|
+
children: A
|
|
72
|
+
}
|
|
73
|
+
),
|
|
74
|
+
/* @__PURE__ */ t(i.Portal, { children: /* @__PURE__ */ t(
|
|
75
|
+
i.Positioner,
|
|
76
|
+
{
|
|
77
|
+
side: "right",
|
|
78
|
+
align: "start",
|
|
79
|
+
sideOffset: I,
|
|
80
|
+
alignOffset: M,
|
|
81
|
+
render: (n) => /* @__PURE__ */ t(
|
|
82
|
+
d.Root,
|
|
83
|
+
{
|
|
84
|
+
...n,
|
|
85
|
+
className: s(n.className, o("dropdown-menu-submenu-root"))
|
|
86
|
+
}
|
|
87
|
+
),
|
|
88
|
+
children: /* @__PURE__ */ t(i.Popup, { render: P, children: /* @__PURE__ */ t("div", { className: o("dropdown-menu-container"), children: /* @__PURE__ */ t(G, { fadeEdges: !0, children: h.map(O) }) }) })
|
|
89
|
+
}
|
|
90
|
+
) })
|
|
91
|
+
] });
|
|
92
|
+
}, Q = L.memo(T);
|
|
93
|
+
export {
|
|
94
|
+
Q as DropdownMenuSubmenu
|
|
95
|
+
};
|
|
96
|
+
//# sourceMappingURL=submenu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"submenu.js","sources":["../../../src/components/dropdown-menu/submenu.tsx"],"sourcesContent":["\"use client\";\nimport React, { useMemo, useCallback } from \"react\";\nimport { clsx, useCls } from \"../utils\";\nimport { Menu } from \"@base-ui/react/menu\";\nimport { CaretRightIcon } from \"@bioturing/assets\";\nimport { BaseMenu } from \"../base-menu\";\nimport type { DropdownMenuActionItem, DropdownMenuItemType } from \"./types\";\nimport { useDropdownMenu, UseDropdownMenuProps } from \"./useDropdownMenu\";\nimport { ScrollArea } from \"../scroll-area\";\n\nexport interface DropdownMenuSubmenuProps extends Pick<\n UseDropdownMenuProps,\n | \"itemRender\"\n | \"itemLabelRender\"\n | \"showCheckbox\"\n | \"getItemKeywords\"\n | \"selectedItemKeys\"\n | \"keepOpenOnSelect\"\n | \"onOpenChange\"\n> {\n /**\n * The menu item data that contains children\n */\n item: DropdownMenuActionItem & { children?: DropdownMenuItemType[] };\n /**\n * Class names from parent DropdownMenu\n */\n classNames?: {\n item?: string;\n itemIcon?: string;\n itemText?: string;\n itemSuffix?: string;\n group?: string;\n groupLabel?: string;\n divider?: string;\n };\n}\n\nconst DropdownMenuSubmenuInner: React.FC<DropdownMenuSubmenuProps> = ({\n item,\n classNames,\n itemRender,\n itemLabelRender,\n showCheckbox,\n getItemKeywords,\n selectedItemKeys,\n keepOpenOnSelect,\n onOpenChange,\n}) => {\n const cls = useCls();\n\n const { itemGroups, renderGroup } = useDropdownMenu({\n items: item.children || [],\n keepOpenOnSelect,\n selectedItemKeys,\n showCheckbox,\n getItemKeywords,\n itemLabelRender,\n itemRender,\n onOpenChange,\n classNames: {\n item: classNames?.item,\n itemIcon: classNames?.itemIcon,\n itemSuffix: classNames?.itemSuffix,\n group: classNames?.group,\n groupLabel: classNames?.groupLabel,\n divider: classNames?.divider,\n },\n });\n\n const triggerSuffix = useMemo(() => {\n const userSuffix = item.suffix;\n const caret = (\n <CaretRightIcon key=\"caret\" size={12} className={cls(\"dropdown-menu-submenu-caret\")} />\n );\n if (userSuffix) {\n return (\n <>\n {userSuffix}\n {caret}\n </>\n );\n }\n return caret;\n }, [item.suffix, cls]);\n\n // Submenu offset: overlap slightly when placed horizontally for a tighter connection\n const { getSideOffset, getAlignOffset } = useMemo(() => {\n const getSideOffset = (props: { side: Menu.Positioner.Props[\"side\"] }) => {\n return props.side === \"top\" || props.side === \"bottom\" ? 0 : 8;\n };\n\n const getAlignOffset = (props: { align: Menu.Positioner.Props[\"align\"] }) => {\n return props.align === \"start\" ? -2 : 0;\n };\n\n return { getSideOffset, getAlignOffset };\n }, []);\n\n const triggerLabel = item.label;\n const triggerIcon = item.icon;\n const triggerDisabled = item.disabled;\n const triggerDanger = item.danger;\n\n // Render prop for popup so Base UI can inject transition state attributes\n const popupRender = useCallback(\n (props: React.ComponentPropsWithoutRef<\"div\">) => <BaseMenu.Popup {...props} />,\n [],\n );\n\n return (\n <Menu.SubmenuRoot>\n <BaseMenu.Item\n disabled={triggerDisabled}\n danger={triggerDanger}\n icon={triggerIcon}\n description={item.description}\n suffix={triggerSuffix}\n classNames={{\n root: clsx(\n cls(\"dropdown-menu-item\"),\n classNames?.item,\n item.className,\n item.classNames?.root,\n ),\n icon: clsx(classNames?.itemIcon, item.classNames?.icon),\n text: clsx(classNames?.itemText, item.classNames?.text),\n suffix: clsx(classNames?.itemSuffix, item.classNames?.suffix),\n }}\n data-value={typeof item.label === \"string\" ? item.label : String(item.key)}\n render={<Menu.SubmenuTrigger />}\n >\n {triggerLabel}\n </BaseMenu.Item>\n <Menu.Portal>\n <Menu.Positioner\n side=\"right\"\n align=\"start\"\n sideOffset={getSideOffset}\n alignOffset={getAlignOffset}\n render={(props) => (\n <BaseMenu.Root\n {...props}\n className={clsx(props.className, cls(\"dropdown-menu-submenu-root\"))}\n />\n )}\n >\n <Menu.Popup render={popupRender}>\n <div className={cls(\"dropdown-menu-container\")}>\n <ScrollArea fadeEdges>{itemGroups.map(renderGroup)}</ScrollArea>\n </div>\n </Menu.Popup>\n </Menu.Positioner>\n </Menu.Portal>\n </Menu.SubmenuRoot>\n );\n};\n\nexport const DropdownMenuSubmenu = React.memo(DropdownMenuSubmenuInner);\n"],"names":["DropdownMenuSubmenuInner","item","classNames","itemRender","itemLabelRender","showCheckbox","getItemKeywords","selectedItemKeys","keepOpenOnSelect","onOpenChange","cls","useCls","itemGroups","renderGroup","useDropdownMenu","triggerSuffix","useMemo","userSuffix","caret","CaretRightIcon","jsxs","Fragment","getSideOffset","getAlignOffset","props","triggerLabel","triggerIcon","triggerDisabled","triggerDanger","popupRender","useCallback","jsx","BaseMenu","Menu","clsx","ScrollArea","DropdownMenuSubmenu","React"],"mappings":"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"}
|