@serendie/ui 2.1.1 → 2.1.2-dev.202508070336
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/README.md +26 -0
- package/dist/client.d.ts +1 -0
- package/dist/client.js +117 -0
- package/dist/components/Accordion/Accordion.d.ts +1 -1
- package/dist/components/Accordion/Accordion.js +6 -8
- package/dist/components/Accordion/AccordionGroup.js +2 -6
- package/dist/components/Avatar/Avatar.js +11 -13
- package/dist/components/Badge/Badge.js +8 -10
- package/dist/components/Banner/Banner.d.ts +1 -1
- package/dist/components/Banner/Banner.js +6 -8
- package/dist/components/BottomNavigation/BottomNavigation.js +10 -11
- package/dist/components/BottomNavigation/BottomNavigationItem.d.ts +1 -1
- package/dist/components/BottomNavigation/BottomNavigationItem.js +6 -8
- package/dist/components/Button/Button.d.ts +2 -2
- package/dist/components/Button/Button.js +13 -15
- package/dist/components/CheckBox/CheckBox.js +10 -11
- package/dist/components/ChoiceBox/ChoiceBox.js +20 -22
- package/dist/components/DashboardWidget/DashboardWidget.js +11 -13
- package/dist/components/DataTable/table/BodyCell.js +2 -4
- package/dist/components/DataTable/table/HeaderCell.js +6 -7
- package/dist/components/DataTable/table/HeaderCheckbox.js +8 -9
- package/dist/components/DataTable/table/HeaderRow.js +2 -3
- package/dist/components/DataTable/table/Root.js +4 -6
- package/dist/components/DataTable/table/Row.js +2 -4
- package/dist/components/DataTable/table/Tr.js +6 -7
- package/dist/components/Divider/Divider.js +6 -8
- package/dist/components/Drawer/Drawer.js +11 -13
- package/dist/components/DropdownMenu/DropdownMenu.d.ts +1 -1
- package/dist/components/DropdownMenu/DropdownMenu.js +13 -15
- package/dist/components/IconButton/IconButton.d.ts +3 -3
- package/dist/components/IconButton/IconButton.js +6 -8
- package/dist/components/List/ListItem.js +7 -8
- package/dist/components/ModalDialog/ModalDialog.js +12 -14
- package/dist/components/NotificationBadge/NotificationBadge.js +6 -8
- package/dist/components/Pagination/Pagination.d.ts +1 -1
- package/dist/components/Pagination/Pagination.js +8 -10
- package/dist/components/ProgressIndicator/ProgressIndicator.js +9 -11
- package/dist/components/RadioButton/RadioButton.d.ts +1 -1
- package/dist/components/RadioButton/RadioButton.js +14 -15
- package/dist/components/Search/Search.d.ts +1 -1
- package/dist/components/Search/Search.js +17 -21
- package/dist/components/Select/Select.d.ts +1 -1
- package/dist/components/Select/Select.js +16 -17
- package/dist/components/Switch/Switch.js +13 -14
- package/dist/components/Tabs/TabItem.d.ts +1 -1
- package/dist/components/Tabs/TabItem.js +8 -10
- package/dist/components/Tabs/Tabs.js +8 -10
- package/dist/components/TextArea/TextArea.js +8 -10
- package/dist/components/TextField/TextField.js +6 -7
- package/dist/components/Toast/Toast.d.ts +1 -1
- package/dist/components/Toast/Toast.js +8 -10
- package/dist/components/Tooltip/Tooltip.js +17 -19
- package/dist/components/TopAppBar/TopAppBar.js +14 -16
- package/dist/node_modules/@ark-ui/react/dist/components/avatar/use-avatar.js +3 -3
- package/dist/node_modules/@ark-ui/react/dist/components/checkbox/use-checkbox.js +3 -3
- package/dist/node_modules/@ark-ui/react/dist/components/dialog/use-dialog.js +3 -3
- package/dist/node_modules/@ark-ui/react/dist/components/menu/use-menu.js +3 -3
- package/dist/node_modules/@ark-ui/react/dist/components/pagination/use-pagination.js +3 -3
- package/dist/node_modules/@ark-ui/react/dist/components/presence/use-presence.js +2 -2
- package/dist/node_modules/@ark-ui/react/dist/components/radio-group/use-radio-group.js +3 -3
- package/dist/node_modules/@ark-ui/react/dist/components/switch/use-switch.js +3 -3
- package/dist/node_modules/@ark-ui/react/dist/components/tabs/use-tabs.js +3 -3
- package/dist/node_modules/@zag-js/checkbox/dist/index.js +10 -10
- package/dist/node_modules/@zag-js/combobox/dist/index.js +4 -4
- package/dist/node_modules/@zag-js/menu/dist/index.js +31 -31
- package/dist/node_modules/@zag-js/radio-group/dist/index.js +10 -10
- package/dist/node_modules/@zag-js/select/dist/index.js +11 -11
- package/dist/node_modules/@zag-js/switch/dist/index.js +10 -10
- package/dist/node_modules/@zag-js/tabs/dist/index.js +12 -12
- package/dist/node_modules/@zag-js/toast/dist/index.js +5 -5
- package/dist/node_modules/@zag-js/tooltip/dist/index.js +4 -4
- package/dist/styled-system/css/css.js +3 -3
- package/dist/styled-system/jsx/factory.js +12 -12
- package/dist/styled-system/patterns/box.js +3 -4
- package/package.json +9 -1
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
import { jsx as e, jsxs as t } from "react/jsx-runtime";
|
|
2
|
-
import "../../styled-system/css/css.js";
|
|
3
|
-
import { cx as c } from "../../styled-system/css/cx.js";
|
|
4
|
-
import "../../styled-system/helpers.js";
|
|
5
|
-
import { sva as g } from "../../styled-system/css/sva.js";
|
|
6
2
|
import { Button as i } from "../Button/Button.js";
|
|
7
|
-
import { Portal as
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
3
|
+
import { Portal as c } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
|
|
4
|
+
import { sva as g } from "../../styled-system/css/sva.js";
|
|
5
|
+
import { DialogRoot as y } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-root.js";
|
|
6
|
+
import { DialogBackdrop as x } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-backdrop.js";
|
|
7
|
+
import { DialogPositioner as f } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-positioner.js";
|
|
8
|
+
import { DialogContent as h } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-content.js";
|
|
9
|
+
import { cx as u } from "../../styled-system/css/cx.js";
|
|
12
10
|
import { DialogTitle as b } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-title.js";
|
|
13
11
|
import { DialogDescription as D } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-description.js";
|
|
14
12
|
import { DialogCloseTrigger as v } from "../../node_modules/@ark-ui/react/dist/components/dialog/dialog-close-trigger.js";
|
|
@@ -76,7 +74,7 @@ const I = g({
|
|
|
76
74
|
}
|
|
77
75
|
}
|
|
78
76
|
}
|
|
79
|
-
}),
|
|
77
|
+
}), R = ({
|
|
80
78
|
isOpen: n,
|
|
81
79
|
title: d,
|
|
82
80
|
cancelButtonLabel: a,
|
|
@@ -87,9 +85,9 @@ const I = g({
|
|
|
87
85
|
...o
|
|
88
86
|
}) => {
|
|
89
87
|
const s = I(o);
|
|
90
|
-
return /* @__PURE__ */ e(
|
|
91
|
-
/* @__PURE__ */ e(
|
|
92
|
-
/* @__PURE__ */ e(
|
|
88
|
+
return /* @__PURE__ */ e(y, { open: n, ...o, children: /* @__PURE__ */ t(c, { children: [
|
|
89
|
+
/* @__PURE__ */ e(x, { className: s.backdrop }),
|
|
90
|
+
/* @__PURE__ */ e(f, { children: /* @__PURE__ */ t(h, { className: u(s.content, l), children: [
|
|
93
91
|
/* @__PURE__ */ t("div", { className: s.contentInner, children: [
|
|
94
92
|
/* @__PURE__ */ e(b, { className: s.title, children: d }),
|
|
95
93
|
/* @__PURE__ */ e(D, { className: s.description, children: p })
|
|
@@ -102,5 +100,5 @@ const I = g({
|
|
|
102
100
|
] }) });
|
|
103
101
|
};
|
|
104
102
|
export {
|
|
105
|
-
|
|
103
|
+
R as ModalDialog
|
|
106
104
|
};
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import "../../styled-system/css/
|
|
2
|
+
import { sva as m } from "../../styled-system/css/sva.js";
|
|
3
3
|
import { cx as a } from "../../styled-system/css/cx.js";
|
|
4
|
-
|
|
5
|
-
import { sva as l } from "../../styled-system/css/sva.js";
|
|
6
|
-
const n = l({
|
|
4
|
+
const n = m({
|
|
7
5
|
slots: ["root", "text"],
|
|
8
6
|
base: {
|
|
9
7
|
root: {
|
|
@@ -76,15 +74,15 @@ const n = l({
|
|
|
76
74
|
variant: "primary",
|
|
77
75
|
size: "medium"
|
|
78
76
|
}
|
|
79
|
-
}),
|
|
77
|
+
}), g = ({
|
|
80
78
|
count: t,
|
|
81
79
|
noNumber: s,
|
|
82
80
|
className: o,
|
|
83
|
-
...
|
|
81
|
+
...d
|
|
84
82
|
}) => {
|
|
85
|
-
const [
|
|
83
|
+
const [l, r] = n.splitVariantProps(d), i = n({ noNumber: s, ...l });
|
|
86
84
|
return s ? /* @__PURE__ */ e("div", { className: a(i.root, o), ...r }) : !t || t < 1 ? null : /* @__PURE__ */ e("div", { className: a(i.root, o), ...r, children: /* @__PURE__ */ e("span", { className: i.text, children: t > 99 ? "99+" : t }) });
|
|
87
85
|
};
|
|
88
86
|
export {
|
|
89
|
-
|
|
87
|
+
g as NotificationBadge
|
|
90
88
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { default as React, ComponentProps } from 'react';
|
|
2
2
|
import { RecipeVariantProps } from '../../../styled-system/css';
|
|
3
|
-
export declare const PaginationStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"
|
|
3
|
+
export declare const PaginationStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"item" | "root" | "ellipsis" | "prevTrigger" | "nextTrigger", {
|
|
4
4
|
size: {
|
|
5
5
|
medium: {
|
|
6
6
|
root: {
|
|
@@ -2,17 +2,15 @@ import { jsx as e, jsxs as T, Fragment as g } from "react/jsx-runtime";
|
|
|
2
2
|
import { SerendieSymbolChevronLeft as S, SerendieSymbolChevronRight as _ } from "@serendie/symbols";
|
|
3
3
|
import C, { useState as I } from "react";
|
|
4
4
|
import { IconButton as m } from "../IconButton/IconButton.js";
|
|
5
|
-
import "../../styled-system/css/
|
|
6
|
-
import {
|
|
7
|
-
import "../../styled-system/
|
|
8
|
-
import { sva as j } from "../../styled-system/css/sva.js";
|
|
9
|
-
import { PaginationRoot as z } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-root.js";
|
|
5
|
+
import { sva as N } from "../../styled-system/css/sva.js";
|
|
6
|
+
import { PaginationRoot as j } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-root.js";
|
|
7
|
+
import { cx as z } from "../../styled-system/css/cx.js";
|
|
10
8
|
import { PaginationContext as R } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-context.js";
|
|
11
9
|
import { PaginationPrevTrigger as w } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-prev-trigger.js";
|
|
12
10
|
import { PaginationItem as O } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-item.js";
|
|
13
11
|
import { PaginationEllipsis as W } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-ellipsis.js";
|
|
14
12
|
import { PaginationNextTrigger as F } from "../../node_modules/@ark-ui/react/dist/components/pagination/pagination-next-trigger.js";
|
|
15
|
-
const L =
|
|
13
|
+
const L = N({
|
|
16
14
|
slots: ["root", "item", "ellipsis", "prevTrigger", "nextTrigger"],
|
|
17
15
|
base: {
|
|
18
16
|
root: {
|
|
@@ -86,7 +84,7 @@ const L = j({
|
|
|
86
84
|
defaultVariants: {
|
|
87
85
|
size: "medium"
|
|
88
86
|
}
|
|
89
|
-
}),
|
|
87
|
+
}), Q = C.forwardRef(
|
|
90
88
|
({
|
|
91
89
|
count: d,
|
|
92
90
|
pageSize: c = 1,
|
|
@@ -107,10 +105,10 @@ const L = j({
|
|
|
107
105
|
}
|
|
108
106
|
};
|
|
109
107
|
return /* @__PURE__ */ e(
|
|
110
|
-
|
|
108
|
+
j,
|
|
111
109
|
{
|
|
112
110
|
ref: u,
|
|
113
|
-
className:
|
|
111
|
+
className: z(i.root, y),
|
|
114
112
|
...v,
|
|
115
113
|
...f,
|
|
116
114
|
children: /* @__PURE__ */ e(R, { children: (t) => {
|
|
@@ -190,6 +188,6 @@ const L = j({
|
|
|
190
188
|
}
|
|
191
189
|
);
|
|
192
190
|
export {
|
|
193
|
-
|
|
191
|
+
Q as Pagination,
|
|
194
192
|
L as PaginationStyle
|
|
195
193
|
};
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import "../../styled-system/css/
|
|
3
|
-
import { cx as
|
|
4
|
-
|
|
5
|
-
import "../../styled-system/helpers.js";
|
|
6
|
-
const r = l({
|
|
2
|
+
import { cva as n } from "../../styled-system/css/cva.js";
|
|
3
|
+
import { cx as l } from "../../styled-system/css/cx.js";
|
|
4
|
+
const r = n({
|
|
7
5
|
base: {
|
|
8
6
|
animation: "1s linear infinite spin",
|
|
9
7
|
stroke: "sd.reference.color.scale.gray.400"
|
|
@@ -36,11 +34,11 @@ const r = l({
|
|
|
36
34
|
size: "medium",
|
|
37
35
|
color: "gray"
|
|
38
36
|
}
|
|
39
|
-
}),
|
|
37
|
+
}), d = ({
|
|
40
38
|
className: t,
|
|
41
|
-
...
|
|
39
|
+
...s
|
|
42
40
|
}) => {
|
|
43
|
-
const [
|
|
41
|
+
const [o, i] = r.splitVariantProps(s), a = r(o);
|
|
44
42
|
return /* @__PURE__ */ e(
|
|
45
43
|
"svg",
|
|
46
44
|
{
|
|
@@ -49,8 +47,8 @@ const r = l({
|
|
|
49
47
|
viewBox: "0 0 48 48",
|
|
50
48
|
fill: "none",
|
|
51
49
|
xmlns: "http://www.w3.org/2000/svg",
|
|
52
|
-
className:
|
|
53
|
-
...
|
|
50
|
+
className: l(a, t),
|
|
51
|
+
...i,
|
|
54
52
|
children: /* @__PURE__ */ e(
|
|
55
53
|
"path",
|
|
56
54
|
{
|
|
@@ -62,6 +60,6 @@ const r = l({
|
|
|
62
60
|
);
|
|
63
61
|
};
|
|
64
62
|
export {
|
|
65
|
-
|
|
63
|
+
d as ProgressIndicator,
|
|
66
64
|
r as ProgressIndicatorStyle
|
|
67
65
|
};
|
|
@@ -20,7 +20,7 @@ export declare const radioUncheckedIconCss: {
|
|
|
20
20
|
color: string;
|
|
21
21
|
};
|
|
22
22
|
};
|
|
23
|
-
export declare const RadioButtonStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"itemControl" | "checkedIcon" | "itemTextGroup" | "itemText" | "helperText" | "
|
|
23
|
+
export declare const RadioButtonStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"item" | "itemControl" | "checkedIcon" | "itemTextGroup" | "itemText" | "helperText" | "unCheckedIcon", import('../../../styled-system/types').SlotRecipeVariantRecord<"item" | "itemControl" | "checkedIcon" | "itemTextGroup" | "itemText" | "helperText" | "unCheckedIcon">>;
|
|
24
24
|
type RadioButtonItemProps = {
|
|
25
25
|
label?: string;
|
|
26
26
|
helperText?: string;
|
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
import { jsxs as r, jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import
|
|
2
|
+
import x from "../../assets/radioChecked.svg.js";
|
|
3
|
+
import h from "../../assets/radioUnchecked.svg.js";
|
|
4
|
+
import { sva as f } from "../../styled-system/css/sva.js";
|
|
3
5
|
import { cx as i } from "../../styled-system/css/cx.js";
|
|
4
|
-
import "../../styled-system/
|
|
5
|
-
import { sva as h } from "../../styled-system/css/sva.js";
|
|
6
|
-
import f from "../../assets/radioChecked.svg.js";
|
|
7
|
-
import g from "../../assets/radioUnchecked.svg.js";
|
|
6
|
+
import { css as g } from "../../styled-system/css/css.js";
|
|
8
7
|
import { RadioGroupItem as I } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item.js";
|
|
9
8
|
import { RadioGroupItemContext as S } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-context.js";
|
|
10
9
|
import { RadioGroupItemControl as b } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-control.js";
|
|
11
|
-
import { RadioGroupItemText as
|
|
10
|
+
import { RadioGroupItemText as c } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-text.js";
|
|
12
11
|
import { RadioGroupItemHiddenInput as C } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-hidden-input.js";
|
|
13
12
|
const k = {
|
|
14
13
|
flexShrink: 0,
|
|
@@ -27,7 +26,7 @@ const k = {
|
|
|
27
26
|
_disabled: {
|
|
28
27
|
color: "color-mix(in srgb, {colors.sd.system.color.component.outlineVariant}, {colors.sd.system.color.interaction.hoveredOnPrimary});"
|
|
29
28
|
}
|
|
30
|
-
},
|
|
29
|
+
}, m = f({
|
|
31
30
|
slots: [
|
|
32
31
|
"item",
|
|
33
32
|
"itemControl",
|
|
@@ -75,16 +74,16 @@ const k = {
|
|
|
75
74
|
}
|
|
76
75
|
}
|
|
77
76
|
}
|
|
78
|
-
}),
|
|
77
|
+
}), E = ({
|
|
79
78
|
value: n,
|
|
80
79
|
label: t,
|
|
81
80
|
helperText: s,
|
|
82
81
|
className: d,
|
|
83
82
|
...a
|
|
84
83
|
}) => {
|
|
85
|
-
const [l, p] =
|
|
84
|
+
const [l, p] = m.splitVariantProps(a), o = m(l), y = i(
|
|
86
85
|
o.item,
|
|
87
|
-
s &&
|
|
86
|
+
s && g({ alignItems: "flex-start" })
|
|
88
87
|
);
|
|
89
88
|
return /* @__PURE__ */ r(
|
|
90
89
|
I,
|
|
@@ -93,10 +92,10 @@ const k = {
|
|
|
93
92
|
className: i("group", y, d),
|
|
94
93
|
...p,
|
|
95
94
|
children: [
|
|
96
|
-
/* @__PURE__ */ e(S, { children: (u) => /* @__PURE__ */ e(b, { className: o.itemControl, asChild: !0, children: u.checked ? /* @__PURE__ */ e(
|
|
95
|
+
/* @__PURE__ */ e(S, { children: (u) => /* @__PURE__ */ e(b, { className: o.itemControl, asChild: !0, children: u.checked ? /* @__PURE__ */ e(x, { className: o.checkedIcon }) : /* @__PURE__ */ e(h, { className: o.unCheckedIcon }) }) }),
|
|
97
96
|
/* @__PURE__ */ r("div", { className: o.itemTextGroup, children: [
|
|
98
|
-
t && /* @__PURE__ */ e(
|
|
99
|
-
s && /* @__PURE__ */ e(
|
|
97
|
+
t && /* @__PURE__ */ e(c, { className: o.itemText, children: t }),
|
|
98
|
+
s && /* @__PURE__ */ e(c, { className: o.helperText, children: s })
|
|
100
99
|
] }),
|
|
101
100
|
/* @__PURE__ */ e(C, {})
|
|
102
101
|
]
|
|
@@ -104,8 +103,8 @@ const k = {
|
|
|
104
103
|
);
|
|
105
104
|
};
|
|
106
105
|
export {
|
|
107
|
-
|
|
108
|
-
|
|
106
|
+
E as RadioButton,
|
|
107
|
+
m as RadioButtonStyle,
|
|
109
108
|
R as radioCheckedIconCss,
|
|
110
109
|
k as radioIconCss,
|
|
111
110
|
_ as radioUncheckedIconCss
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ComboboxRootProps } from '@ark-ui/react';
|
|
2
2
|
import { RecipeVariantProps } from '../../../styled-system/css';
|
|
3
|
-
export declare const SearchStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"
|
|
3
|
+
export declare const SearchStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"icon" | "input" | "combobox" | "control" | "comboboxItem" | "iconBox" | "closeIcon", {
|
|
4
4
|
size: {
|
|
5
5
|
medium: {
|
|
6
6
|
iconBox: {
|
|
@@ -1,16 +1,12 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as i, jsx as o } from "react/jsx-runtime";
|
|
2
2
|
import { SerendieSymbolMagnifyingGlass as p, SerendieSymbolClose as g } from "@serendie/symbols";
|
|
3
|
-
import "../../
|
|
4
|
-
import {
|
|
5
|
-
import "../../styled-system/helpers.js";
|
|
6
|
-
import { sva as x } from "../../styled-system/css/sva.js";
|
|
7
|
-
import "react";
|
|
8
|
-
import "../../styled-system/jsx/is-valid-prop.js";
|
|
3
|
+
import { createListCollection as y } from "../../node_modules/@ark-ui/react/dist/components/collection/list-collection.js";
|
|
4
|
+
import { Portal as x } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
|
|
9
5
|
import { Box as b } from "../../styled-system/jsx/box.js";
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
6
|
+
import { sva as u } from "../../styled-system/css/sva.js";
|
|
7
|
+
import { ComboboxRoot as h } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-root.js";
|
|
8
|
+
import { ComboboxControl as f } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-control.js";
|
|
9
|
+
import { cx as S } from "../../styled-system/css/cx.js";
|
|
14
10
|
import { ComboboxInput as C } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-input.js";
|
|
15
11
|
import { ComboboxTrigger as w } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-trigger.js";
|
|
16
12
|
import { ComboboxPositioner as I } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-positioner.js";
|
|
@@ -18,7 +14,7 @@ import { ComboboxContent as v } from "../../node_modules/@ark-ui/react/dist/comp
|
|
|
18
14
|
import { ComboboxItemGroup as B } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-item-group.js";
|
|
19
15
|
import { ComboboxItem as N } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-item.js";
|
|
20
16
|
import { ComboboxItemText as _ } from "../../node_modules/@ark-ui/react/dist/components/combobox/combobox-item-text.js";
|
|
21
|
-
const d =
|
|
17
|
+
const d = u({
|
|
22
18
|
slots: [
|
|
23
19
|
"input",
|
|
24
20
|
"control",
|
|
@@ -147,13 +143,13 @@ const d = x({
|
|
|
147
143
|
defaultVariants: {
|
|
148
144
|
size: "medium"
|
|
149
145
|
}
|
|
150
|
-
}),
|
|
151
|
-
items:
|
|
146
|
+
}), F = ({
|
|
147
|
+
items: e = [],
|
|
152
148
|
...a
|
|
153
149
|
}) => {
|
|
154
|
-
const [r, l] = d.splitVariantProps(a), s = d(r), { collection: E, ...t } = l, n =
|
|
155
|
-
return /* @__PURE__ */
|
|
156
|
-
|
|
150
|
+
const [r, l] = d.splitVariantProps(a), s = d(r), { collection: E, ...t } = l, n = y({ items: e });
|
|
151
|
+
return /* @__PURE__ */ i(
|
|
152
|
+
h,
|
|
157
153
|
{
|
|
158
154
|
...t,
|
|
159
155
|
collection: n,
|
|
@@ -166,12 +162,12 @@ const d = x({
|
|
|
166
162
|
}
|
|
167
163
|
},
|
|
168
164
|
children: [
|
|
169
|
-
/* @__PURE__ */
|
|
165
|
+
/* @__PURE__ */ i(f, { className: S(s.control, t.className), children: [
|
|
170
166
|
/* @__PURE__ */ o("div", { className: s.iconBox, children: /* @__PURE__ */ o(p, { className: s.icon }) }),
|
|
171
167
|
/* @__PURE__ */ o(C, { className: s.input }),
|
|
172
|
-
|
|
168
|
+
e.length > 0 && /* @__PURE__ */ o(w, { children: /* @__PURE__ */ o("div", { className: s.closeIcon, children: /* @__PURE__ */ o(g, { className: s.icon }) }) })
|
|
173
169
|
] }),
|
|
174
|
-
|
|
170
|
+
e.length > 0 && /* @__PURE__ */ o(x, { children: /* @__PURE__ */ o(I, { children: /* @__PURE__ */ o(v, { className: s.combobox, children: /* @__PURE__ */ o(B, { id: "framework", children: n.items.map((m, c) => /* @__PURE__ */ i(
|
|
175
171
|
N,
|
|
176
172
|
{
|
|
177
173
|
item: m,
|
|
@@ -194,6 +190,6 @@ const d = x({
|
|
|
194
190
|
);
|
|
195
191
|
};
|
|
196
192
|
export {
|
|
197
|
-
|
|
193
|
+
F as Search,
|
|
198
194
|
d as SearchStyle
|
|
199
195
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { SelectRootProps } from '@ark-ui/react';
|
|
2
2
|
import { RecipeVariantProps } from '../../../styled-system/css';
|
|
3
|
-
export declare const SelectStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"content" | "
|
|
3
|
+
export declare const SelectStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"content" | "item" | "root" | "valueText" | "iconBox" | "trigger", {
|
|
4
4
|
size: {
|
|
5
5
|
medium: {
|
|
6
6
|
root: {
|
|
@@ -1,22 +1,21 @@
|
|
|
1
1
|
import { jsxs as i, jsx as e } from "react/jsx-runtime";
|
|
2
2
|
import { SerendieSymbolChevronDown as S } from "@serendie/symbols";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import "../../
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import { Portal as T } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
|
|
11
|
-
import { SelectRoot as N } from "../../node_modules/@ark-ui/react/dist/components/select/select-root.js";
|
|
3
|
+
import { List as f } from "../List/List.js";
|
|
4
|
+
import { ListItem as v } from "../List/ListItem.js";
|
|
5
|
+
import { createListCollection as w } from "../../node_modules/@ark-ui/react/dist/components/collection/list-collection.js";
|
|
6
|
+
import { Portal as _ } from "../../node_modules/@ark-ui/react/dist/components/portal/portal.js";
|
|
7
|
+
import { sva as C } from "../../styled-system/css/sva.js";
|
|
8
|
+
import { SelectRoot as T } from "../../node_modules/@ark-ui/react/dist/components/select/select-root.js";
|
|
9
|
+
import { cx as N } from "../../styled-system/css/cx.js";
|
|
12
10
|
import { SelectLabel as z } from "../../node_modules/@ark-ui/react/dist/components/select/select-label.js";
|
|
11
|
+
import { css as d } from "../../styled-system/css/css.js";
|
|
13
12
|
import { SelectControl as R } from "../../node_modules/@ark-ui/react/dist/components/select/select-control.js";
|
|
14
13
|
import { SelectTrigger as V } from "../../node_modules/@ark-ui/react/dist/components/select/select-trigger.js";
|
|
15
14
|
import { SelectValueText as L } from "../../node_modules/@ark-ui/react/dist/components/select/select-value-text.js";
|
|
16
15
|
import { SelectPositioner as P } from "../../node_modules/@ark-ui/react/dist/components/select/select-positioner.js";
|
|
17
16
|
import { SelectContent as B } from "../../node_modules/@ark-ui/react/dist/components/select/select-content.js";
|
|
18
17
|
import { SelectItem as I } from "../../node_modules/@ark-ui/react/dist/components/select/select-item.js";
|
|
19
|
-
const n =
|
|
18
|
+
const n = C({
|
|
20
19
|
slots: ["root", "valueText", "trigger", "content", "item", "iconBox"],
|
|
21
20
|
base: {
|
|
22
21
|
root: {
|
|
@@ -153,7 +152,7 @@ const n = v({
|
|
|
153
152
|
defaultVariants: {
|
|
154
153
|
size: "medium"
|
|
155
154
|
}
|
|
156
|
-
}),
|
|
155
|
+
}), $ = ({
|
|
157
156
|
placeholder: c = "",
|
|
158
157
|
label: r,
|
|
159
158
|
required: p,
|
|
@@ -163,18 +162,18 @@ const n = v({
|
|
|
163
162
|
items: g = [],
|
|
164
163
|
...u
|
|
165
164
|
}) => {
|
|
166
|
-
const [t, x] = n.splitVariantProps(u), o = n(t), { collection: O, ...h } = x, l =
|
|
165
|
+
const [t, x] = n.splitVariantProps(u), o = n(t), { collection: O, ...h } = x, l = w({
|
|
167
166
|
items: g,
|
|
168
167
|
itemToString: (s) => s.label,
|
|
169
168
|
itemToValue: (s) => s.value
|
|
170
169
|
});
|
|
171
170
|
return /* @__PURE__ */ i(
|
|
172
|
-
|
|
171
|
+
T,
|
|
173
172
|
{
|
|
174
173
|
...h,
|
|
175
174
|
collection: l,
|
|
176
175
|
invalid: a,
|
|
177
|
-
className:
|
|
176
|
+
className: N(o.root, y),
|
|
178
177
|
positioning: {
|
|
179
178
|
sameWidth: !0,
|
|
180
179
|
offset: {
|
|
@@ -232,8 +231,8 @@ const n = v({
|
|
|
232
231
|
children: m
|
|
233
232
|
}
|
|
234
233
|
),
|
|
235
|
-
/* @__PURE__ */ e(
|
|
236
|
-
|
|
234
|
+
/* @__PURE__ */ e(_, { children: /* @__PURE__ */ e(P, { children: /* @__PURE__ */ e(B, { className: o.content, children: /* @__PURE__ */ e(f, { children: l.items.map((s, b) => /* @__PURE__ */ e(I, { item: s, children: /* @__PURE__ */ e(
|
|
235
|
+
v,
|
|
237
236
|
{
|
|
238
237
|
title: s.label,
|
|
239
238
|
value: s.value,
|
|
@@ -246,6 +245,6 @@ const n = v({
|
|
|
246
245
|
);
|
|
247
246
|
};
|
|
248
247
|
export {
|
|
249
|
-
|
|
248
|
+
$ as Select,
|
|
250
249
|
n as SelectStyle
|
|
251
250
|
};
|
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import { jsxs as e, jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef as y } from "react";
|
|
3
|
-
import {
|
|
3
|
+
import { sva as u } from "../../styled-system/css/sva.js";
|
|
4
|
+
import { SwitchRoot as b } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-root.js";
|
|
4
5
|
import { cx as t } from "../../styled-system/css/cx.js";
|
|
5
|
-
import "../../styled-system/helpers.js";
|
|
6
|
-
import { sva as b } from "../../styled-system/css/sva.js";
|
|
7
|
-
import { SwitchRoot as h } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-root.js";
|
|
8
6
|
import { SwitchLabel as i } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-label.js";
|
|
9
|
-
import { SwitchControl as
|
|
10
|
-
import { SwitchThumb as
|
|
11
|
-
import { SwitchHiddenInput as
|
|
12
|
-
|
|
7
|
+
import { SwitchControl as h } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-control.js";
|
|
8
|
+
import { SwitchThumb as g } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-thumb.js";
|
|
9
|
+
import { SwitchHiddenInput as f } from "../../node_modules/@ark-ui/react/dist/components/switch/switch-hidden-input.js";
|
|
10
|
+
import { css as x } from "../../styled-system/css/css.js";
|
|
11
|
+
const n = u({
|
|
13
12
|
slots: ["root", "control", "thumb", "label", "textGroup", "helperText"],
|
|
14
13
|
base: {
|
|
15
14
|
root: {
|
|
@@ -96,17 +95,17 @@ const n = b({
|
|
|
96
95
|
}
|
|
97
96
|
}
|
|
98
97
|
}
|
|
99
|
-
}),
|
|
98
|
+
}), F = y(
|
|
100
99
|
({ label: d, helperText: s, className: a, ...l }, m) => {
|
|
101
100
|
const [c, p] = n.splitVariantProps(l), o = n(c);
|
|
102
101
|
return /* @__PURE__ */ e(
|
|
103
|
-
|
|
102
|
+
b,
|
|
104
103
|
{
|
|
105
104
|
ref: m,
|
|
106
105
|
className: t(
|
|
107
106
|
"group",
|
|
108
107
|
o.root,
|
|
109
|
-
s &&
|
|
108
|
+
s && x({ alignItems: "flex-start" }),
|
|
110
109
|
a
|
|
111
110
|
),
|
|
112
111
|
...p,
|
|
@@ -115,14 +114,14 @@ const n = b({
|
|
|
115
114
|
/* @__PURE__ */ r(i, { className: o.label, children: d }),
|
|
116
115
|
s && /* @__PURE__ */ r(i, { className: o.helperText, children: s })
|
|
117
116
|
] }),
|
|
118
|
-
/* @__PURE__ */ r(
|
|
119
|
-
/* @__PURE__ */ r(
|
|
117
|
+
/* @__PURE__ */ r(h, { className: t("control", o.control), children: /* @__PURE__ */ r(g, { className: o.thumb }) }),
|
|
118
|
+
/* @__PURE__ */ r(f, {})
|
|
120
119
|
]
|
|
121
120
|
}
|
|
122
121
|
);
|
|
123
122
|
}
|
|
124
123
|
);
|
|
125
124
|
export {
|
|
126
|
-
|
|
125
|
+
F as Switch,
|
|
127
126
|
n as SwitchStyle
|
|
128
127
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Tabs as ArkTabs } from '@ark-ui/react';
|
|
2
2
|
import { RecipeVariantProps } from '../../../styled-system/css';
|
|
3
|
-
export declare const TabItemStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"
|
|
3
|
+
export declare const TabItemStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"badge" | "dot" | "trigger" | "badgeBox", import('../../../styled-system/types').SlotRecipeVariantRecord<"badge" | "dot" | "trigger" | "badgeBox">>;
|
|
4
4
|
type TabItemBaseProps = {
|
|
5
5
|
title: string;
|
|
6
6
|
value: string;
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
import { jsxs as y, jsx as o } from "react/jsx-runtime";
|
|
2
|
-
import "../../styled-system/css/css.js";
|
|
3
|
-
import { cx as b } from "../../styled-system/css/cx.js";
|
|
4
|
-
import "../../styled-system/helpers.js";
|
|
5
|
-
import { sva as u } from "../../styled-system/css/sva.js";
|
|
6
2
|
import { NotificationBadge as i } from "../NotificationBadge/NotificationBadge.js";
|
|
7
|
-
import {
|
|
8
|
-
|
|
3
|
+
import { sva as b } from "../../styled-system/css/sva.js";
|
|
4
|
+
import { TabTrigger as u } from "../../node_modules/@ark-ui/react/dist/components/tabs/tab-trigger.js";
|
|
5
|
+
import { cx as h } from "../../styled-system/css/cx.js";
|
|
6
|
+
const l = b({
|
|
9
7
|
slots: ["trigger", "dot", "badgeBox", "badge"],
|
|
10
8
|
base: {
|
|
11
9
|
trigger: {
|
|
@@ -60,7 +58,7 @@ const l = u({
|
|
|
60
58
|
backgroundColor: "color-mix(in srgb, {colors.sd.system.color.interaction.hoveredOnPrimary}, {colors.sd.system.color.impression.negativeContainer});"
|
|
61
59
|
}
|
|
62
60
|
}
|
|
63
|
-
}),
|
|
61
|
+
}), B = ({
|
|
64
62
|
title: n,
|
|
65
63
|
value: a,
|
|
66
64
|
disabled: r,
|
|
@@ -71,10 +69,10 @@ const l = u({
|
|
|
71
69
|
}) => {
|
|
72
70
|
const [p, g] = l.splitVariantProps(m), e = l(p), s = r ? e.badge : "";
|
|
73
71
|
return /* @__PURE__ */ y(
|
|
74
|
-
|
|
72
|
+
u,
|
|
75
73
|
{
|
|
76
74
|
value: a,
|
|
77
|
-
className:
|
|
75
|
+
className: h(e.trigger, d),
|
|
78
76
|
disabled: r,
|
|
79
77
|
...g,
|
|
80
78
|
children: [
|
|
@@ -93,6 +91,6 @@ const l = u({
|
|
|
93
91
|
);
|
|
94
92
|
};
|
|
95
93
|
export {
|
|
96
|
-
|
|
94
|
+
B as TabItem,
|
|
97
95
|
l as TabItemStyle
|
|
98
96
|
};
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
import { jsx as t } from "react/jsx-runtime";
|
|
2
|
-
import "../../styled-system/css/
|
|
3
|
-
import {
|
|
4
|
-
import "../../styled-system/
|
|
5
|
-
import { sva as l } from "../../styled-system/css/sva.js";
|
|
6
|
-
import { TabsRoot as p } from "../../node_modules/@ark-ui/react/dist/components/tabs/tabs-root.js";
|
|
2
|
+
import { sva as n } from "../../styled-system/css/sva.js";
|
|
3
|
+
import { TabsRoot as l } from "../../node_modules/@ark-ui/react/dist/components/tabs/tabs-root.js";
|
|
4
|
+
import { cx as p } from "../../styled-system/css/cx.js";
|
|
7
5
|
import { TabList as c } from "../../node_modules/@ark-ui/react/dist/components/tabs/tab-list.js";
|
|
8
|
-
const o =
|
|
6
|
+
const o = n({
|
|
9
7
|
slots: ["root", "list"],
|
|
10
8
|
base: {
|
|
11
9
|
root: {
|
|
@@ -19,11 +17,11 @@ const o = l({
|
|
|
19
17
|
justifyContent: "space-around"
|
|
20
18
|
}
|
|
21
19
|
}
|
|
22
|
-
}),
|
|
23
|
-
const [a, m] = o.splitVariantProps(
|
|
24
|
-
return /* @__PURE__ */ t(
|
|
20
|
+
}), u = ({ children: r, className: e, ...i }) => {
|
|
21
|
+
const [a, m] = o.splitVariantProps(i), s = o(a);
|
|
22
|
+
return /* @__PURE__ */ t(l, { className: p(s.root, e), ...m, children: /* @__PURE__ */ t(c, { className: s.list, children: r }) });
|
|
25
23
|
};
|
|
26
24
|
export {
|
|
27
|
-
|
|
25
|
+
u as Tabs,
|
|
28
26
|
o as TabsStyle
|
|
29
27
|
};
|