@crystallize/design-system 0.0.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.
Files changed (48) hide show
  1. package/dist/index.css +926 -0
  2. package/dist/index.d.ts +123 -0
  3. package/dist/index.js +1023 -0
  4. package/dist/index.mjs +981 -0
  5. package/package.json +73 -0
  6. package/src/action-menu/ActionMenu.stories.tsx +23 -0
  7. package/src/action-menu/action-item.tsx +24 -0
  8. package/src/action-menu/action-menu.tsx +37 -0
  9. package/src/action-menu/index.tsx +1 -0
  10. package/src/button/Button.stories.tsx +63 -0
  11. package/src/button/button.tsx +50 -0
  12. package/src/button/index.ts +3 -0
  13. package/src/button copy/ButtonCopy.stories.tsx +86 -0
  14. package/src/button copy/button.tsx +61 -0
  15. package/src/button copy/index.ts +3 -0
  16. package/src/card/card.stories.tsx +24 -0
  17. package/src/card/card.tsx +25 -0
  18. package/src/card/index.ts +1 -0
  19. package/src/colors/Colors.stories.mdx +33 -0
  20. package/src/dialog/Dialog.stories.tsx +165 -0
  21. package/src/dialog/config.tsx +134 -0
  22. package/src/dialog/confirm-dialog.tsx +59 -0
  23. package/src/dialog/destroyFns.ts +1 -0
  24. package/src/dialog/dialog.tsx +85 -0
  25. package/src/dialog/index.tsx +40 -0
  26. package/src/dialog/types.ts +38 -0
  27. package/src/dropdown-menu/DropdownMenu.stories.tsx +47 -0
  28. package/src/dropdown-menu/dropdown-menu-item.tsx +24 -0
  29. package/src/dropdown-menu/dropdown-menu-label.tsx +17 -0
  30. package/src/dropdown-menu/dropdown-menu-root.tsx +20 -0
  31. package/src/dropdown-menu/index.ts +9 -0
  32. package/src/icon-button/IconButton.stories.tsx +35 -0
  33. package/src/icon-button/icon-button.tsx +42 -0
  34. package/src/icon-button/index.ts +3 -0
  35. package/src/icons/Iconography.stories.mdx +45 -0
  36. package/src/icons/arrow.tsx +15 -0
  37. package/src/icons/cancel.tsx +26 -0
  38. package/src/icons/dots.tsx +24 -0
  39. package/src/icons/error.tsx +50 -0
  40. package/src/icons/glasses.tsx +62 -0
  41. package/src/icons/graphQL.tsx +90 -0
  42. package/src/icons/index.ts +21 -0
  43. package/src/icons/info.tsx +53 -0
  44. package/src/icons/nail-polish.tsx +84 -0
  45. package/src/icons/warning.tsx +62 -0
  46. package/src/index.css +3 -0
  47. package/src/index.ts +8 -0
  48. package/src/vite-env.d.ts +1 -0
package/dist/index.mjs ADDED
@@ -0,0 +1,981 @@
1
+ // src/action-menu/action-menu.tsx
2
+ import clsx4 from "clsx";
3
+
4
+ // src/dropdown-menu/dropdown-menu-root.tsx
5
+ import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
6
+ import { jsx, jsxs } from "react/jsx-runtime";
7
+ function DropdownMenuRoot({ children, content, onOpenChange, alignContent = "start" }) {
8
+ return /* @__PURE__ */ jsxs(DropdownMenuPrimitive.Root, {
9
+ onOpenChange,
10
+ children: [
11
+ /* @__PURE__ */ jsx(DropdownMenuPrimitive.Trigger, {
12
+ asChild: true,
13
+ children
14
+ }),
15
+ /* @__PURE__ */ jsx(DropdownMenuPrimitive.Content, {
16
+ align: alignContent,
17
+ sideOffset: 5,
18
+ className: "shadow",
19
+ children: content
20
+ })
21
+ ]
22
+ });
23
+ }
24
+
25
+ // src/dropdown-menu/dropdown-menu-item.tsx
26
+ import * as DropdownMenuPrimitive2 from "@radix-ui/react-dropdown-menu";
27
+ import clsx from "clsx";
28
+ import { jsx as jsx2 } from "react/jsx-runtime";
29
+ function DropdownMenuItem({ children, className, ...delegated }) {
30
+ return /* @__PURE__ */ jsx2(DropdownMenuPrimitive2.Item, {
31
+ ...delegated,
32
+ className: clsx(
33
+ "text-xs font-medium text-black-text",
34
+ "flex h-10 cursor-pointer items-center bg-white px-4 outline-asteroid",
35
+ "hover:bg-[#F8F8F9] hover:outline-none hover:focus-visible:outline-none",
36
+ "first:rounded-tr first:rounded-tl last:rounded-br last:rounded-bl",
37
+ className
38
+ ),
39
+ children
40
+ });
41
+ }
42
+
43
+ // src/dropdown-menu/dropdown-menu-label.tsx
44
+ import clsx2 from "clsx";
45
+ import * as DropdownMenuPrimitive3 from "@radix-ui/react-dropdown-menu";
46
+ import { jsx as jsx3 } from "react/jsx-runtime";
47
+ function DropdownMenuLabel({ children }) {
48
+ return /* @__PURE__ */ jsx3(DropdownMenuPrimitive3.Label, {
49
+ className: clsx2("bg-white px-4 py-2 text-xs text-label", "first:rounded-tl first:rounded-tr"),
50
+ children
51
+ });
52
+ }
53
+
54
+ // src/dropdown-menu/index.ts
55
+ var DropdownMenu = {
56
+ Root: DropdownMenuRoot,
57
+ Item: DropdownMenuItem,
58
+ Label: DropdownMenuLabel
59
+ };
60
+
61
+ // src/icons/arrow.tsx
62
+ import { forwardRef } from "react";
63
+ import { jsx as jsx4 } from "react/jsx-runtime";
64
+ var Arrow = forwardRef((delegated, ref) => {
65
+ return /* @__PURE__ */ jsx4("svg", {
66
+ ref,
67
+ width: "10",
68
+ height: "10",
69
+ viewBox: "0 0 10 10",
70
+ fill: "currentColor",
71
+ ...delegated,
72
+ children: /* @__PURE__ */ jsx4("path", {
73
+ d: "M4.14995 9.85C4.24341 9.94161 4.36907 9.99293 4.49995 9.99293C4.63083 9.99293 4.75649 9.94161 4.84995 9.85L8.03995 6.67C8.09195 6.6248 8.13404 6.56934 8.16359 6.5071C8.19314 6.44486 8.20951 6.37719 8.21167 6.30832C8.21383 6.23946 8.20173 6.17089 8.17614 6.10693C8.15055 6.04296 8.11201 5.98497 8.06295 5.9366C8.01389 5.88823 7.95536 5.85052 7.89104 5.82584C7.82671 5.80116 7.75798 5.79003 7.68915 5.79317C7.62033 5.79631 7.55289 5.81363 7.49108 5.84406C7.42927 5.87449 7.37441 5.91737 7.32995 5.97L4.49995 8.78L1.66995 5.96C1.62475 5.908 1.56929 5.86591 1.50705 5.83636C1.44481 5.80681 1.37714 5.79044 1.30827 5.78828C1.23941 5.78612 1.17084 5.79822 1.10688 5.82381C1.04291 5.8494 0.98492 5.88794 0.936549 5.937C0.888179 5.98606 0.850469 6.04459 0.825787 6.10892C0.801105 6.17324 0.789983 6.24197 0.79312 6.3108C0.796256 6.37962 0.813582 6.44706 0.844012 6.50887C0.874442 6.57068 0.917318 6.62554 0.96995 6.67L4.14995 9.85ZM4.49995 -2.18557e-08C4.22381 -3.39261e-08 3.99995 0.223858 3.99995 0.5L3.99995 9.5L4.99995 9.5L4.99995 0.5C4.99995 0.223857 4.77609 -9.78527e-09 4.49995 -2.18557e-08Z"
74
+ })
75
+ });
76
+ });
77
+ Arrow.displayName = "ArrowIcon";
78
+
79
+ // src/icons/cancel.tsx
80
+ import { forwardRef as forwardRef2 } from "react";
81
+ import { jsx as jsx5 } from "react/jsx-runtime";
82
+ var Cancel = forwardRef2((delegated, ref) => {
83
+ return /* @__PURE__ */ jsx5("svg", {
84
+ ref,
85
+ width: "34",
86
+ height: "34",
87
+ viewBox: "0 0 34 34",
88
+ fill: "none",
89
+ xmlns: "http://www.w3.org/2000/svg",
90
+ ...delegated,
91
+ children: /* @__PURE__ */ jsx5("path", {
92
+ d: "m27.4301 24.4325-.1299.1299c-.17.15-.6497.5798-1.1695 1.0595l-1.7392 1.5993-.1499.05a.2783.2783 0 0 1-.2299-.14l-3.6183-3.7182-2.6088-2.6388a1.0488 1.0488 0 0 0-.7926-.3838 1.006 1.006 0 0 0-.7096.2899l-5.6474 5.6773-.7696.7496-.07.18h-.2599l-2.6987-2.7088a.3813.3813 0 0 1-.18-.2598l.02-.14 5.6674-5.6173 1.2394-1.2395a.2995.2995 0 0 0 .1-.2398.2903.2903 0 0 0-.1-.2299l-1.8591-1.8692-2.8487-2.8786-1.5692-1.5992-.6197-.6597-.1-.09v-.12a.3689.3689 0 0 1 .12-.2398l2.7786-2.6588.11-.09h.14l.1099.06 5.7273 5.9272.8696.8796a.6998.6998 0 0 0 .9995 0l5.9672-6.0071.1799-.18a4.5467 4.5467 0 0 1 .5597-.5197.5585.5585 0 0 1 .19-.1c.1099 0 .2099.13.2998.22l.08.0899 2.039 2.109s.1899.2.2299.2499a.864.864 0 0 0 .1399.13.7704.7704 0 0 1 .13.1199c.0899.1499 0 .2598-.1799.4298l-6.1172 6.0871a1.3994 1.3994 0 0 0-.5197.7696.9287.9287 0 0 0 .2899.7997l3.0185 2.9786 3.4284 3.1785a2.001 2.001 0 0 1 .1999.2398.2564.2564 0 0 1 .0853.1524.2564.2564 0 0 1-.0323.1715Z",
93
+ fill: "currentColor"
94
+ })
95
+ });
96
+ });
97
+ Cancel.displayName = "CancelIcon";
98
+
99
+ // src/icons/dots.tsx
100
+ import { forwardRef as forwardRef3 } from "react";
101
+ import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
102
+ var Dots = forwardRef3((delegated, ref) => {
103
+ return /* @__PURE__ */ jsxs2("svg", {
104
+ ref,
105
+ width: "20",
106
+ height: "20",
107
+ viewBox: "0 0 20 20",
108
+ fill: "none",
109
+ xmlns: "http://www.w3.org/2000/svg",
110
+ ...delegated,
111
+ children: [
112
+ /* @__PURE__ */ jsx6("circle", {
113
+ cx: "10",
114
+ cy: "5",
115
+ r: "1.7857",
116
+ fill: "#9095A8"
117
+ }),
118
+ /* @__PURE__ */ jsx6("circle", {
119
+ cx: "10",
120
+ cy: "10",
121
+ r: "1.7857",
122
+ fill: "#9095A8"
123
+ }),
124
+ /* @__PURE__ */ jsx6("circle", {
125
+ cx: "10",
126
+ cy: "15",
127
+ r: "1.7857",
128
+ fill: "#9095A8"
129
+ })
130
+ ]
131
+ });
132
+ });
133
+ Dots.displayName = "DotsIcon";
134
+
135
+ // src/icons/error.tsx
136
+ import { forwardRef as forwardRef4 } from "react";
137
+ import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
138
+ var Error = forwardRef4((delegated, ref) => {
139
+ return /* @__PURE__ */ jsxs3("svg", {
140
+ ref,
141
+ xmlns: "http://www.w3.org/2000/svg",
142
+ width: "22",
143
+ height: "22",
144
+ fill: "none",
145
+ viewBox: "0 0 22 22",
146
+ ...delegated,
147
+ children: [
148
+ /* @__PURE__ */ jsxs3("g", {
149
+ clipPath: "url(#a)",
150
+ children: [
151
+ /* @__PURE__ */ jsx7("path", {
152
+ fill: "#DD1367",
153
+ d: "M20.83 11c0 5.43-4.4 9.83-9.83 9.83S1.17 16.43 1.17 11 5.57 1.17 11 1.17s9.83 4.4 9.83 9.83Z"
154
+ }),
155
+ /* @__PURE__ */ jsx7("path", {
156
+ fill: "#528693",
157
+ fillRule: "evenodd",
158
+ d: "M21.431 11c0 5.76-4.67 10.43-10.43 10.43C5.238 21.43.568 16.76.568 11S5.24.57 11 .57C16.76.57 21.431 5.24 21.431 11Zm-10.43 9.83c5.429 0 9.83-4.4 9.83-9.83s-4.401-9.83-9.83-9.83c-5.43 0-9.832 4.4-9.832 9.83S5.571 20.83 11 20.83Z",
159
+ clipRule: "evenodd"
160
+ }),
161
+ /* @__PURE__ */ jsx7("path", {
162
+ fill: "#fff",
163
+ fillRule: "evenodd",
164
+ d: "m7.364 13.479 1.157 1.157L11 12.158l2.479 2.478 1.157-1.157L12.158 11l2.478-2.479-1.157-1.157-2.48 2.478-2.478-2.478L7.364 8.52 9.842 11l-2.478 2.479Z",
165
+ clipRule: "evenodd"
166
+ }),
167
+ /* @__PURE__ */ jsx7("path", {
168
+ fill: "#528693",
169
+ fillRule: "evenodd",
170
+ d: "M6.94 13.903a.6.6 0 0 1 0-.849L8.994 11 6.94 8.946a.6.6 0 0 1 0-.849L8.097 6.94a.6.6 0 0 1 .849 0L11 8.994l2.054-2.054a.6.6 0 0 1 .849 0l1.157 1.157a.6.6 0 0 1 0 .849L13.006 11l2.054 2.054a.6.6 0 0 1 0 .849l-1.157 1.157a.6.6 0 0 1-.849 0L11 13.006 8.946 15.06a.6.6 0 0 1-.849 0L6.94 13.903ZM11 12.158l2.479 2.478 1.157-1.157L12.158 11l2.478-2.479-1.157-1.157L11 9.842 8.521 7.364 7.364 8.52 9.842 11l-2.478 2.479 1.157 1.157L11 12.158Z",
171
+ clipRule: "evenodd"
172
+ })
173
+ ]
174
+ }),
175
+ /* @__PURE__ */ jsx7("defs", {
176
+ children: /* @__PURE__ */ jsx7("clipPath", {
177
+ id: "a",
178
+ children: /* @__PURE__ */ jsx7("path", {
179
+ fill: "#fff",
180
+ d: "M0 0h22v22H0z"
181
+ })
182
+ })
183
+ })
184
+ ]
185
+ });
186
+ });
187
+ Error.displayName = "ErrorIcon";
188
+
189
+ // src/icons/glasses.tsx
190
+ import { forwardRef as forwardRef5 } from "react";
191
+ import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
192
+ var Glasses = forwardRef5((delegated, ref) => {
193
+ return /* @__PURE__ */ jsxs4("svg", {
194
+ ref,
195
+ width: "20",
196
+ height: "15",
197
+ viewBox: "0 0 20 15",
198
+ fill: "none",
199
+ xmlns: "http://www.w3.org/2000/svg",
200
+ ...delegated,
201
+ children: [
202
+ /* @__PURE__ */ jsx8("path", {
203
+ fillRule: "evenodd",
204
+ clipRule: "evenodd",
205
+ d: "M7.4856 2.0673c-.3158-.7572-1.2453-1.0361-1.9258-.578l-3.42 2.3025c-.8613.5798-.7287 1.8856.2315 2.2806l.1216.05.2282-.5549-.1216-.05c-.517-.2127-.5884-.9158-.1246-1.228l3.42-2.3025c.3664-.2467.8669-.0965 1.037.3112l.0748.1795a.3.3 0 0 0 .5537-.231l-.0748-.1795Z",
206
+ fill: "#528693"
207
+ }),
208
+ /* @__PURE__ */ jsx8("path", {
209
+ d: "m9.7363 8.289-.2116.453-.906-.4233.2116-.453.906.4234Z",
210
+ fill: "#528793"
211
+ }),
212
+ /* @__PURE__ */ jsx8("path", {
213
+ d: "M4.391 9.9236c1.5958.7593 3.5051.0811 4.2644-1.5148.7593-1.596.081-3.5052-1.5148-4.2644-1.5959-.7593-3.5051-.0811-4.2644 1.5148-.7593 1.5958-.0811 3.505 1.5148 4.2644Z",
214
+ fill: "#BFF6F8"
215
+ }),
216
+ /* @__PURE__ */ jsx8("path", {
217
+ d: "M3.1883 8.7645a3.2004 3.2004 0 0 1-.3446-.514l5.955-2.1168c.0388.203.0579.4094.0568.6162L3.1883 8.7644Zm4.8102-4.212L2.468 6.517a3.2001 3.2001 0 0 0 .1588 1.2118l6.0129-2.136a3.2002 3.2002 0 0 0-.6412-1.0403Z",
218
+ fill: "#fff"
219
+ }),
220
+ /* @__PURE__ */ jsx8("path", {
221
+ fillRule: "evenodd",
222
+ clipRule: "evenodd",
223
+ d: "M4.4255 9.3845c1.4463.6881 3.1766.0735 3.8647-1.3728.688-1.4463.0735-3.1765-1.3728-3.8646-1.4463-.6881-3.1765-.0735-3.8646 1.3728-.6882 1.4462-.0735 3.1765 1.3727 3.8646Zm-.2577.5418c1.7455.8305 3.8337.0887 4.6642-1.6568.8304-1.7455.0887-3.8338-1.6568-4.6642-1.7455-.8305-3.8338-.0887-4.6643 1.6568-.8304 1.7455-.0886 3.8337 1.6569 4.6642Z",
224
+ fill: "#528793"
225
+ }),
226
+ /* @__PURE__ */ jsx8("path", {
227
+ d: "M11.3275 12.7751c1.5959.7593 3.5051.0811 4.2644-1.5148.7593-1.5959.0811-3.5051-1.5148-4.2644-1.5959-.7593-3.5051-.081-4.2644 1.5148-.7593 1.5959-.0811 3.5052 1.5148 4.2644Z",
228
+ fill: "#BFF6F8"
229
+ }),
230
+ /* @__PURE__ */ jsx8("path", {
231
+ d: "M10.1248 11.616a3.2048 3.2048 0 0 1-.3446-.5139l5.9551-2.1168c.0388.203.0578.4094.0568.6161l-5.6673 2.0146Zm4.8102-4.212L9.4045 9.3687a3.1998 3.1998 0 0 0 .1588 1.2117l6.0129-2.1358a3.1995 3.1995 0 0 0-.6412-1.0404Z",
232
+ fill: "#fff"
233
+ }),
234
+ /* @__PURE__ */ jsx8("path", {
235
+ fillRule: "evenodd",
236
+ clipRule: "evenodd",
237
+ d: "M11.3621 12.2361c1.4462.6881 3.1765.0734 3.8646-1.3728.6881-1.4463.0735-3.1766-1.3728-3.8647-1.4463-.688-3.1765-.0735-3.8646 1.3728-.6881 1.4463-.0735 3.1766 1.3728 3.8647Zm-.2578.5418c1.7455.8304 3.8337.0887 4.6642-1.6568.8305-1.7455.0887-3.8338-1.6568-4.6643-1.7455-.8304-3.8338-.0887-4.6642 1.6568-.8305 1.7455-.0887 3.8338 1.6568 4.6643Z",
238
+ fill: "#528793"
239
+ }),
240
+ /* @__PURE__ */ jsx8("path", {
241
+ fillRule: "evenodd",
242
+ clipRule: "evenodd",
243
+ d: "M14.7461 5.0551c.7572-.3158 1.614.14 1.7751.9444l.81 4.0424c.204 1.0181-.809 1.8527-1.7692 1.4577l-.1216-.05.2283-.5549.1216.05c.517.2127 1.0625-.2367.9526-.7849l-.81-4.0424c-.0868-.4331-.5481-.6786-.9558-.5085l-.1794.0748a.3.3 0 0 1-.231-.5538l.1794-.0748Z",
244
+ fill: "#528693"
245
+ })
246
+ ]
247
+ });
248
+ });
249
+ Glasses.displayName = "GlassesIcon";
250
+
251
+ // src/icons/graphQL.tsx
252
+ import { forwardRef as forwardRef6 } from "react";
253
+ import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
254
+ var GraphQL = forwardRef6((delegated, ref) => {
255
+ return /* @__PURE__ */ jsxs5("svg", {
256
+ ref,
257
+ width: "23",
258
+ height: "22",
259
+ viewBox: "0 0 23 22",
260
+ fill: "none",
261
+ xmlns: "http://www.w3.org/2000/svg",
262
+ ...delegated,
263
+ children: [
264
+ /* @__PURE__ */ jsx9("path", {
265
+ d: "M10.479 3.4a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
266
+ fill: "#BFF6F8"
267
+ }),
268
+ /* @__PURE__ */ jsx9("path", {
269
+ fillRule: "evenodd",
270
+ clipRule: "evenodd",
271
+ d: "M11.879 5.4a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
272
+ fill: "#528693"
273
+ }),
274
+ /* @__PURE__ */ jsx9("path", {
275
+ d: "M10.479 3.4a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
276
+ fill: "#BFF6F8"
277
+ }),
278
+ /* @__PURE__ */ jsx9("path", {
279
+ fillRule: "evenodd",
280
+ clipRule: "evenodd",
281
+ d: "M11.879 5.4a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
282
+ fill: "#528693"
283
+ }),
284
+ /* @__PURE__ */ jsx9("path", {
285
+ d: "M3.679 7.2a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
286
+ fill: "#BFF6F8"
287
+ }),
288
+ /* @__PURE__ */ jsx9("path", {
289
+ fillRule: "evenodd",
290
+ clipRule: "evenodd",
291
+ d: "M5.079 9.2a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
292
+ fill: "#528693"
293
+ }),
294
+ /* @__PURE__ */ jsx9("path", {
295
+ d: "M17.279 7.2a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
296
+ fill: "#BFF6F8"
297
+ }),
298
+ /* @__PURE__ */ jsx9("path", {
299
+ fillRule: "evenodd",
300
+ clipRule: "evenodd",
301
+ d: "M18.679 9.2a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
302
+ fill: "#528693"
303
+ }),
304
+ /* @__PURE__ */ jsx9("path", {
305
+ d: "M3.679 7.2a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
306
+ fill: "#BFF6F8"
307
+ }),
308
+ /* @__PURE__ */ jsx9("path", {
309
+ fillRule: "evenodd",
310
+ clipRule: "evenodd",
311
+ d: "M5.079 9.2a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
312
+ fill: "#528693"
313
+ }),
314
+ /* @__PURE__ */ jsx9("path", {
315
+ d: "M17.279 7.2a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
316
+ fill: "#BFF6F8"
317
+ }),
318
+ /* @__PURE__ */ jsx9("path", {
319
+ fillRule: "evenodd",
320
+ clipRule: "evenodd",
321
+ d: "M18.679 9.2a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
322
+ fill: "#528693"
323
+ }),
324
+ /* @__PURE__ */ jsx9("path", {
325
+ d: "M3.679 14.8a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
326
+ fill: "#BFF6F8"
327
+ }),
328
+ /* @__PURE__ */ jsx9("path", {
329
+ fillRule: "evenodd",
330
+ clipRule: "evenodd",
331
+ d: "M5.079 16.8a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
332
+ fill: "#528693"
333
+ }),
334
+ /* @__PURE__ */ jsx9("path", {
335
+ d: "M17.279 14.8a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
336
+ fill: "#fff"
337
+ }),
338
+ /* @__PURE__ */ jsx9("path", {
339
+ fillRule: "evenodd",
340
+ clipRule: "evenodd",
341
+ d: "M18.679 16.8a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8Z",
342
+ fill: "#528693"
343
+ }),
344
+ /* @__PURE__ */ jsx9("path", {
345
+ d: "M10.479 18.75a1.4 1.4 0 1 1 2.8 0 1.4 1.4 0 1 1-2.8 0Z",
346
+ fill: "#BFF6F8"
347
+ }),
348
+ /* @__PURE__ */ jsx9("path", {
349
+ fillRule: "evenodd",
350
+ clipRule: "evenodd",
351
+ d: "M11.879 20.75a2 2 0 1 1 0-4 2 2 0 0 1 0 4Zm0-3.4a1.4 1.4 0 1 0 0 2.8 1.4 1.4 0 0 0 0-2.8ZM10.44 3.851a.3.3 0 0 1-.112.41l-3.5 2a.3.3 0 0 1-.298-.521l3.5-2a.3.3 0 0 1 .41.111ZM13.419 3.851a.3.3 0 0 0 .111.41l3.5 2a.3.3 0 0 0 .298-.521l-3.5-2a.3.3 0 0 0-.41.111Z",
352
+ fill: "#528693"
353
+ }),
354
+ /* @__PURE__ */ jsx9("path", {
355
+ fillRule: "evenodd",
356
+ clipRule: "evenodd",
357
+ d: "M10.44 18.149a.3.3 0 0 0-.112-.41l-3.5-2a.3.3 0 0 0-.298.521l3.5 2a.3.3 0 0 0 .41-.111ZM13.419 18.149a.3.3 0 0 1 .111-.41l3.5-2a.3.3 0 0 1 .298.521l-3.5 2a.3.3 0 0 1-.41-.111ZM5.079 8.7a.3.3 0 0 1 .3.3v4a.3.3 0 1 1-.6 0V9a.3.3 0 0 1 .3-.3ZM18.679 8.7a.3.3 0 0 1 .3.3v4a.3.3 0 1 1-.6 0V9a.3.3 0 0 1 .3-.3ZM11.033 4.743a.3.3 0 0 1 .103.411l-4.8 8a.3.3 0 1 1-.514-.308l4.8-8a.3.3 0 0 1 .411-.103ZM12.725 4.743a.3.3 0 0 0-.103.411l4.8 8a.3.3 0 1 0 .514-.308l-4.8-8a.3.3 0 0 0-.411-.103ZM6.579 14.9a.3.3 0 0 1 .3-.3h10a.3.3 0 0 1 0 .6h-10a.3.3 0 0 1-.3-.3Z",
358
+ fill: "#528693"
359
+ })
360
+ ]
361
+ });
362
+ });
363
+ GraphQL.displayName = "GraphQLIcon";
364
+
365
+ // src/icons/info.tsx
366
+ import { forwardRef as forwardRef7 } from "react";
367
+ import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
368
+ var Info = forwardRef7((delegated, ref) => {
369
+ return /* @__PURE__ */ jsxs6("svg", {
370
+ ref,
371
+ xmlns: "http://www.w3.org/2000/svg",
372
+ width: "22",
373
+ height: "22",
374
+ fill: "none",
375
+ viewBox: "0 0 22 22",
376
+ ...delegated,
377
+ children: [
378
+ /* @__PURE__ */ jsxs6("g", {
379
+ clipPath: "url(#a)",
380
+ children: [
381
+ /* @__PURE__ */ jsx10("path", {
382
+ fill: "#BFF6F8",
383
+ d: "M20.83 11c0 5.43-4.4 9.83-9.83 9.83S1.17 16.43 1.17 11 5.57 1.17 11 1.17s9.83 4.4 9.83 9.83Z"
384
+ }),
385
+ /* @__PURE__ */ jsx10("path", {
386
+ fill: "#528693",
387
+ fillRule: "evenodd",
388
+ d: "M21.431 11c0 5.76-4.67 10.43-10.43 10.43C5.238 21.43.568 16.76.568 11S5.24.57 11 .57C16.76.57 21.431 5.24 21.431 11Zm-10.43 9.83c5.429 0 9.83-4.4 9.83-9.83s-4.401-9.83-9.83-9.83c-5.43 0-9.832 4.4-9.832 9.83S5.571 20.83 11 20.83Z",
389
+ clipRule: "evenodd"
390
+ }),
391
+ /* @__PURE__ */ jsx10("path", {
392
+ fill: "#fff",
393
+ d: "M14.814 6.317a.991.991 0 1 1-1.983 0 .991.991 0 0 1 1.983 0Z"
394
+ }),
395
+ /* @__PURE__ */ jsx10("path", {
396
+ fill: "#528693",
397
+ fillRule: "evenodd",
398
+ d: "M15.415 6.317a1.592 1.592 0 1 1-3.184 0 1.592 1.592 0 0 1 3.184 0Zm-1.592.991a.991.991 0 1 0 0-1.982.991.991 0 0 0 0 1.982Z",
399
+ clipRule: "evenodd"
400
+ }),
401
+ /* @__PURE__ */ jsx10("path", {
402
+ fill: "#fff",
403
+ d: "m9.37 16.049 1.8.26-.22-.7-.78-.621.56-1.14 2.261-3.382-.34-1.381-1.92-1-1.261.14-.28.32 1.08.54.14.54-2.22 2.862-.821 2.36 2 1.202Z"
404
+ }),
405
+ /* @__PURE__ */ jsx10("path", {
406
+ fill: "#528693",
407
+ d: "M10.476 16.666a4.93 4.93 0 0 1-2.096-.599c-1.114-.605-1.482-1.63-.961-2.673a9.606 9.606 0 0 1 1.437-1.963l.067-.077c.252-.293.513-.595.742-.897.288-.38.538-.745.443-1.031-.056-.164-.215-.282-.485-.362a1.58 1.58 0 0 0-.247-.033l-.055-.004a.984.984 0 0 1-.481-.096c-.169-.132-.098-.51-.013-.676a.915.915 0 0 1 .701-.473c.139-.025.28-.037.42-.035.656.034 1.301.176 1.91.42 1.104.424 1.631 1.263 1.41 2.244a4.193 4.193 0 0 1-.908 1.714c-.128.161-.26.315-.392.471l-.07.083c-.282.32-.544.654-.788 1.003l-.144.206c-.161.209-.291.44-.385.687a.582.582 0 0 0 .32.743.91.91 0 0 0 .32.08c.175.021.356.044.428.21a.575.575 0 0 1-.035.477 1.144 1.144 0 0 1-1.138.581Zm-.877-8.193c.128.079.268.136.414.17.18.04.35.12.494.236.58.552.14 1.272-.318 1.903-.214.292-.47.58-.74.884l-.068.077c-.624.692-1.27 1.408-1.497 2.232a1.148 1.148 0 0 0 .163 1.06c.493.658 1.78.907 2.819.921l.035-.05-.025-.035a1.248 1.248 0 0 1-.865-.594 1.04 1.04 0 0 1 .006-.894 8.071 8.071 0 0 1 1.309-1.977l.127-.155c.171-.21.356-.437.525-.665.371-.501.844-1.245.664-1.915-.315-1.173-2.15-1.209-3.03-1.226h-.057l.044.028Z"
408
+ })
409
+ ]
410
+ }),
411
+ /* @__PURE__ */ jsx10("defs", {
412
+ children: /* @__PURE__ */ jsx10("clipPath", {
413
+ id: "a",
414
+ children: /* @__PURE__ */ jsx10("path", {
415
+ fill: "#fff",
416
+ d: "M0 0h22v22H0z"
417
+ })
418
+ })
419
+ })
420
+ ]
421
+ });
422
+ });
423
+ Info.displayName = "InfoIcon";
424
+
425
+ // src/icons/nail-polish.tsx
426
+ import { forwardRef as forwardRef8 } from "react";
427
+ import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
428
+ var NailPolish = forwardRef8((delegated, ref) => {
429
+ return /* @__PURE__ */ jsxs7("svg", {
430
+ ref,
431
+ width: "12",
432
+ height: "16",
433
+ viewBox: "0 0 12 16",
434
+ fill: "none",
435
+ xmlns: "http://www.w3.org/2000/svg",
436
+ ...delegated,
437
+ children: [
438
+ /* @__PURE__ */ jsx11("path", {
439
+ d: "M.8573 9.7059H.4287v-.8824c0-.4873.3838-.8823.8571-.8823h4.2858c.4734 0 .8571.395.8571.8823v.8824h-.4286V15H.8573V9.7059Z",
440
+ fill: "#BFF6F8"
441
+ }),
442
+ /* @__PURE__ */ jsx11("path", {
443
+ fillRule: "evenodd",
444
+ clipRule: "evenodd",
445
+ d: "M1.3716 9.1765v5.2941h4.1143V9.1765h.4285v-.353c0-.195-.1535-.353-.3428-.353H1.2858c-.1893 0-.3428.158-.3428.353v.353h.4286ZM6 9.7059h.4286v-.8824c0-.4873-.3837-.8823-.8571-.8823H1.2858c-.4733 0-.857.395-.857.8823v.8824h.4285V15H6V9.7059Z",
446
+ fill: "#528693"
447
+ }),
448
+ /* @__PURE__ */ jsx11("path", {
449
+ d: "M1.2856 6.6176c0-.4873.3838-.8823.8572-.8823h2.5714c.4734 0 .8572.395.8572.8823v1.7648H1.2856V6.6176Z",
450
+ fill: "#BFF6F8"
451
+ }),
452
+ /* @__PURE__ */ jsx11("path", {
453
+ fillRule: "evenodd",
454
+ clipRule: "evenodd",
455
+ d: "M4.7142 6.2647H2.1428c-.1894 0-.3429.158-.3429.353v1.2352h3.2572V6.6176c0-.1949-.1535-.3529-.3429-.3529Zm-2.5714-.5294c-.4734 0-.8572.395-.8572.8823v1.7648h4.2858V6.6176c0-.4873-.3838-.8823-.8572-.8823H2.1428Z",
456
+ fill: "#528693"
457
+ }),
458
+ /* @__PURE__ */ jsx11("path", {
459
+ d: "M1.7144.6228c0-.344.2708-.6228.605-.6228 1.5594 0 2.8235 1.3013 2.8235 2.9066v3.2699H1.7144V.6228Z",
460
+ fill: "#FFCCEC"
461
+ }),
462
+ /* @__PURE__ */ jsx11("path", {
463
+ fillRule: "evenodd",
464
+ clipRule: "evenodd",
465
+ d: "M2.2286 5.647h2.4V2.9067c0-1.3129-1.0338-2.3772-2.3092-2.3772a.0921.0921 0 0 0-.0908.0934v5.0243ZM2.3194 0c-.3342 0-.605.2789-.605.6228v5.5537h3.4285v-3.27C5.143 1.3014 3.8788 0 2.3194 0Z",
466
+ fill: "#528693"
467
+ }),
468
+ /* @__PURE__ */ jsx11("path", {
469
+ fillRule: "evenodd",
470
+ clipRule: "evenodd",
471
+ d: "M2.4626 1.9929c-.432-.5148-.5769-1.1307-.5769-1.5517H2.4c0 .3142.1124.8013.4518 1.2056.3313.3947.8997.7355 1.8625.7355v.5295c-1.0943 0-1.8116-.3945-2.2517-.9189Z",
472
+ fill: "#528693"
473
+ }),
474
+ /* @__PURE__ */ jsx11("path", {
475
+ d: "M4.8708 8.6772c.245-.9414 1.185-1.5 2.0995-1.2478l2.4838.6851c.9145.2523 1.4573 1.22 1.2122 2.1613l-1.2201 4.6876c-.1225.4707-.5925.75-1.0498.6239l-4.1397-1.1418c-.4573-.1262-.7286-.61-.606-1.0807l1.22-4.6876Z",
476
+ fill: "#FFCCEC"
477
+ }),
478
+ /* @__PURE__ */ jsx11("path", {
479
+ fillRule: "evenodd",
480
+ clipRule: "evenodd",
481
+ d: "m9.321 8.6259-2.4838-.6851c-.6401-.1766-1.2981.2145-1.4697.8734l-1.2201 4.6876c-.049.1883.0595.3818.2424.4323l4.1397 1.1418c.1829.0505.3709-.0612.42-.2495l1.2201-4.6876c.1715-.659-.2084-1.3363-.8486-1.513ZM6.9703 7.4294c-.9145-.2523-1.8545.3064-2.0995 1.2478l-1.2202 4.6876c-.1225.4707.1489.9545.6061 1.0807l4.1397 1.1418c.4573.1261.9273-.1532 1.0498-.6239l1.2201-4.6876c.2451-.9414-.2977-1.909-1.2122-2.1613l-2.4838-.6851Z",
482
+ fill: "#528693"
483
+ }),
484
+ /* @__PURE__ */ jsx11("path", {
485
+ d: "M7.9236 3.5069c.1508-.4319.598-.6727 1.0285-.554l.9602.2649c.4306.1188.7009.5575.6217 1.009l-.6114 3.4854c-.0892.508-.581.829-1.0654.6954l-1.5121-.417c-.4844-.1337-.7544-.6649-.5848-1.1507l1.1633-3.333Z",
486
+ fill: "#BFF6F8"
487
+ }),
488
+ /* @__PURE__ */ jsx11("path", {
489
+ fillRule: "evenodd",
490
+ clipRule: "evenodd",
491
+ d: "m9.7792 3.7292-.9602-.2649c-.1722-.0475-.351.0488-.4114.2216l-1.1634 3.333c-.0678.1943.0402.4068.234.4603l1.5121.417c.1938.0535.3905-.075.4262-.2781l.6114-3.4853c.0316-.1806-.0765-.3561-.2487-.4036Zm-.827-.7763c-.4307-.1187-.8778.1221-1.0286.554l-1.1633 3.333c-.1696.4858.1004 1.017.5848 1.1506l1.5121.4171c.4844.1336.9762-.1875 1.0654-.6954l.6114-3.4853c.0792-.4516-.1911-.8903-.6217-1.0091l-.9602-.2649Z",
492
+ fill: "#528693"
493
+ }),
494
+ /* @__PURE__ */ jsx11("path", {
495
+ d: "m5.8906 9.8713 3.3118.9135-.4437 1.7046-3.3118-.9135.4437-1.7046Z",
496
+ fill: "#fff"
497
+ }),
498
+ /* @__PURE__ */ jsx11("path", {
499
+ fillRule: "evenodd",
500
+ clipRule: "evenodd",
501
+ d: "m8.5725 11.1592-2.3182-.6395-.1775.6819 2.3182.6394.1775-.6818ZM5.8906 9.8713 5.447 11.576l3.3118.9135.4437-1.7046-3.3118-.9135Z",
502
+ fill: "#528693"
503
+ })
504
+ ]
505
+ });
506
+ });
507
+ NailPolish.displayName = "NailPolishIcon";
508
+
509
+ // src/icons/warning.tsx
510
+ import { forwardRef as forwardRef9 } from "react";
511
+ import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
512
+ var Warning = forwardRef9((delegated, ref) => {
513
+ return /* @__PURE__ */ jsxs8("svg", {
514
+ ref,
515
+ xmlns: "http://www.w3.org/2000/svg",
516
+ width: "22",
517
+ height: "22",
518
+ fill: "none",
519
+ viewBox: "0 0 22 22",
520
+ ...delegated,
521
+ children: [
522
+ /* @__PURE__ */ jsxs8("g", {
523
+ clipPath: "url(#a)",
524
+ children: [
525
+ /* @__PURE__ */ jsx12("path", {
526
+ fill: "#FFDE99",
527
+ d: "M20.83 11c0 5.43-4.4 9.83-9.83 9.83S1.17 16.43 1.17 11 5.57 1.17 11 1.17s9.83 4.4 9.83 9.83Z"
528
+ }),
529
+ /* @__PURE__ */ jsx12("path", {
530
+ fill: "#528693",
531
+ fillRule: "evenodd",
532
+ d: "M21.43 11c0 5.76-4.67 10.43-10.43 10.43S.57 16.76.57 11 5.24.57 11 .57 21.43 5.24 21.43 11ZM11 20.83c5.43 0 9.83-4.4 9.83-9.83S16.43 1.17 11 1.17 1.17 5.57 1.17 11s4.4 9.83 9.83 9.83Z",
533
+ clipRule: "evenodd"
534
+ }),
535
+ /* @__PURE__ */ jsx12("path", {
536
+ fill: "#fff",
537
+ d: "M10.077 5.232c.41-.71 1.436-.71 1.846 0L17 14.025c.41.71-.103 1.599-.924 1.599H5.923c-.82 0-1.333-.889-.923-1.6l5.077-8.792Z"
538
+ }),
539
+ /* @__PURE__ */ jsx12("path", {
540
+ fill: "#528693",
541
+ fillRule: "evenodd",
542
+ d: "m16.48 14.325-5.077-8.793a.466.466 0 0 0-.806 0L5.52 14.325c-.18.31.045.699.403.699h10.153a.466.466 0 0 0 .404-.7Zm-4.557-9.093a1.066 1.066 0 0 0-1.846 0L5 14.025c-.41.71.103 1.599.923 1.599h10.153c.821 0 1.334-.889.924-1.6l-5.077-8.792Z",
543
+ clipRule: "evenodd"
544
+ }),
545
+ /* @__PURE__ */ jsx12("path", {
546
+ fill: "#FFDE99",
547
+ d: "M10.588 8.628a.5.5 0 1 1 1 0v2.475a.5.5 0 0 1-1 0V8.628Z"
548
+ }),
549
+ /* @__PURE__ */ jsx12("path", {
550
+ fill: "#528693",
551
+ fillRule: "evenodd",
552
+ d: "M12.188 8.628v2.475a1.1 1.1 0 0 1-2.2 0V8.628a1.1 1.1 0 1 1 2.2 0Zm-1.1-.5a.5.5 0 0 0-.5.5v2.475a.5.5 0 1 0 1 0V8.628a.5.5 0 0 0-.5-.5Z",
553
+ clipRule: "evenodd"
554
+ }),
555
+ /* @__PURE__ */ jsx12("path", {
556
+ fill: "#FFDE99",
557
+ d: "M11.588 13.403a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0Z"
558
+ }),
559
+ /* @__PURE__ */ jsx12("path", {
560
+ fill: "#528693",
561
+ fillRule: "evenodd",
562
+ d: "M12.188 13.403a1.1 1.1 0 1 1-2.2 0 1.1 1.1 0 0 1 2.2 0Zm-1.1.5a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1Z",
563
+ clipRule: "evenodd"
564
+ })
565
+ ]
566
+ }),
567
+ /* @__PURE__ */ jsx12("defs", {
568
+ children: /* @__PURE__ */ jsx12("clipPath", {
569
+ id: "a",
570
+ children: /* @__PURE__ */ jsx12("path", {
571
+ fill: "#fff",
572
+ d: "M0 0h22v22H0z"
573
+ })
574
+ })
575
+ })
576
+ ]
577
+ });
578
+ });
579
+ Warning.displayName = "WarningIcon";
580
+
581
+ // src/icons/index.ts
582
+ var Icon = {
583
+ Arrow,
584
+ Cancel,
585
+ Dots,
586
+ Error,
587
+ Glasses,
588
+ GraphQL,
589
+ Info,
590
+ NailPolish,
591
+ Warning
592
+ };
593
+
594
+ // src/action-menu/action-item.tsx
595
+ import clsx3 from "clsx";
596
+ import { jsx as jsx13 } from "react/jsx-runtime";
597
+ function Item2({ children, className, onSelect }) {
598
+ return /* @__PURE__ */ jsx13(DropdownMenu.Item, {
599
+ onClick: onSelect,
600
+ className: clsx3(
601
+ "items-center text-density cursor-pointer flex font-sans font-medium text-sm gap-2 py-2.5 px-5",
602
+ "hover:bg-[#f4f4f4]",
603
+ "[&.danger]:text-error",
604
+ className
605
+ ),
606
+ children
607
+ });
608
+ }
609
+
610
+ // src/action-menu/action-menu.tsx
611
+ import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
612
+ function ActionMenu({ children, className, tabIndex }) {
613
+ return /* @__PURE__ */ jsx14(DropdownMenu.Root, {
614
+ content: children,
615
+ children: /* @__PURE__ */ jsxs9("button", {
616
+ tabIndex,
617
+ type: "button",
618
+ className: clsx4(
619
+ "items-center bg-transparent rounded-full border-none cursor-pointer flex justify-center p-1",
620
+ "hover:bg-gray-6 focus:bg-gray-6 focus:outline-offset-2 focus:outline focus:outline-1 focus:outline-glacier focus-visible:outline-offset-2 focus-visible:outline focus-visible:outline-1 focus-visible:outline-glacier",
621
+ "active:scale-95",
622
+ className
623
+ ),
624
+ "aria-label": "more options",
625
+ children: [
626
+ /* @__PURE__ */ jsx14("span", {
627
+ className: "sr-only",
628
+ children: "Open more options"
629
+ }),
630
+ /* @__PURE__ */ jsx14(Icon.Dots, {})
631
+ ]
632
+ })
633
+ });
634
+ }
635
+ ActionMenu.Item = Item2;
636
+
637
+ // src/button/button.tsx
638
+ import { forwardRef as forwardRef10 } from "react";
639
+ import { cva } from "class-variance-authority";
640
+ import { jsx as jsx15 } from "react/jsx-runtime";
641
+ var DEFAULT_TEXT_COLOR = "text-black-text disabled:text-black-text/50";
642
+ var buttonStyles = cva(
643
+ [
644
+ "inline-grid grid-flow-col items-center gap-2 rounded border-none font-medium cursor-pointer whitespace-nowrap",
645
+ "disabled:cursor-default disabled:scale-100 disabled:drop-shadow-none",
646
+ "active:scale-95",
647
+ "focus:drop-shadow-active",
648
+ "hover:drop-shadow-hover"
649
+ ],
650
+ {
651
+ variants: {
652
+ variant: {
653
+ primary: `bg-neptune disabled:bg-neptune-light ${DEFAULT_TEXT_COLOR}`,
654
+ secondary: `bg-white disabled:bg-[#FBFCFC] ${DEFAULT_TEXT_COLOR}`,
655
+ "secondary-dark": `bg-cosmos disabled:bg-[#F7F8F9] ${DEFAULT_TEXT_COLOR}`,
656
+ danger: "text-white bg-error disabled:bg-error/50 disabled:text-white/75"
657
+ },
658
+ size: {
659
+ xs: "h-8 px-5",
660
+ sm: "h-9 px-6",
661
+ md: "h-10 px-7",
662
+ lg: "h-10 px-8",
663
+ xl: "h-11 px-9"
664
+ }
665
+ },
666
+ defaultVariants: {
667
+ variant: "primary",
668
+ size: "sm"
669
+ }
670
+ }
671
+ );
672
+ var Button = forwardRef10(
673
+ ({ children, className, type = "button", size, variant, ...delegated }, ref) => {
674
+ return /* @__PURE__ */ jsx15("button", {
675
+ ref,
676
+ type,
677
+ className: buttonStyles({ size, variant, className }),
678
+ ...delegated,
679
+ children
680
+ });
681
+ }
682
+ );
683
+ Button.displayName = "Button";
684
+
685
+ // src/dialog/destroyFns.ts
686
+ var destroyFns = [];
687
+
688
+ // src/dialog/dialog.tsx
689
+ import * as DialogPrimitive from "@radix-ui/react-dialog";
690
+ import { cva as cva2 } from "class-variance-authority";
691
+ import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
692
+ var IconMap = {
693
+ error: Icon.Error,
694
+ info: Icon.Info,
695
+ warning: Icon.Warning
696
+ };
697
+ var dialogContentStyles = cva2(
698
+ "bg-white rounded shadow fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 max-w-xl w-auto p-6",
699
+ {
700
+ variants: {
701
+ withIcon: {
702
+ true: "flex gap-4 items-start"
703
+ }
704
+ }
705
+ }
706
+ );
707
+ function DialogContent({ children, closable = true, type, ...delegated }) {
708
+ const withIcon = typeof type !== "undefined";
709
+ const IconComponent = type && IconMap[type];
710
+ return /* @__PURE__ */ jsxs10(DialogPrimitive.Portal, {
711
+ children: [
712
+ /* @__PURE__ */ jsx16(DialogPrimitive.Overlay, {
713
+ className: "bg-black/30 fixed inset-0"
714
+ }),
715
+ /* @__PURE__ */ jsxs10(DialogPrimitive.Content, {
716
+ className: dialogContentStyles({ withIcon }),
717
+ ...delegated,
718
+ children: [
719
+ IconComponent && /* @__PURE__ */ jsx16(IconComponent, {
720
+ className: "my-1 shrink-0",
721
+ width: 32,
722
+ height: 32
723
+ }),
724
+ closable && /* @__PURE__ */ jsx16(DialogClose, {
725
+ asChild: true,
726
+ children: /* @__PURE__ */ jsx16(Button, {
727
+ className: "absolute top-2.5 right-2.5 !rounded-full !p-0 h-6 w-6 inline-flex items-center justify-center !bg-transparent hover:!bg-gray-200 focus:!bg-gray-200 !drop-shadow-none",
728
+ children: /* @__PURE__ */ jsx16(Icon.Cancel, {
729
+ color: "density",
730
+ "aria-label": "Close",
731
+ height: 18,
732
+ width: 18
733
+ })
734
+ })
735
+ }),
736
+ /* @__PURE__ */ jsx16("div", {
737
+ children
738
+ })
739
+ ]
740
+ })
741
+ ]
742
+ });
743
+ }
744
+ function DialogTitle(delegated) {
745
+ return /* @__PURE__ */ jsx16(DialogPrimitive.Title, {
746
+ className: "m-0 font-semibold text-2xl font-sans text-black-text",
747
+ ...delegated
748
+ });
749
+ }
750
+ function DialogDescription(delegated) {
751
+ return /* @__PURE__ */ jsx16(DialogPrimitive.Description, {
752
+ className: "mt-2 mb-5 text-gray-600",
753
+ ...delegated
754
+ });
755
+ }
756
+ var DialogTrigger = DialogPrimitive.Trigger;
757
+ var DialogClose = DialogPrimitive.Close;
758
+ var DialogRoot = DialogPrimitive.Root;
759
+ function DialogBase({ children }) {
760
+ return /* @__PURE__ */ jsx16(DialogRoot, {
761
+ children
762
+ });
763
+ }
764
+ DialogBase.Title = DialogTitle;
765
+ DialogBase.Trigger = DialogTrigger;
766
+ DialogBase.Description = DialogDescription;
767
+ DialogBase.Content = DialogContent;
768
+
769
+ // src/dialog/config.tsx
770
+ import { unmountComponentAtNode, render as DOMRender } from "react-dom";
771
+
772
+ // src/dialog/confirm-dialog.tsx
773
+ import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
774
+ function ConfirmDialog({
775
+ open,
776
+ close,
777
+ title,
778
+ description,
779
+ content,
780
+ okCancel,
781
+ okText = "OK",
782
+ onOk,
783
+ onCancel,
784
+ cancelText = "cancel",
785
+ onEscapeKeyDown,
786
+ onInteractOutside,
787
+ onPointerDownOutside,
788
+ type
789
+ }) {
790
+ const cancelButton = okCancel && /* @__PURE__ */ jsx17(Button, {
791
+ variant: "secondary",
792
+ onClick: () => {
793
+ onCancel == null ? void 0 : onCancel();
794
+ close();
795
+ },
796
+ children: cancelText
797
+ });
798
+ return /* @__PURE__ */ jsx17(DialogRoot, {
799
+ open,
800
+ onOpenChange: () => close(),
801
+ children: /* @__PURE__ */ jsxs11(Dialog.Content, {
802
+ onEscapeKeyDown,
803
+ onInteractOutside,
804
+ onPointerDownOutside,
805
+ type,
806
+ children: [
807
+ title && /* @__PURE__ */ jsx17(Dialog.Title, {
808
+ children: title
809
+ }),
810
+ description && /* @__PURE__ */ jsx17(Dialog.Description, {
811
+ children: description
812
+ }),
813
+ content,
814
+ /* @__PURE__ */ jsxs11("div", {
815
+ className: "flex items-center gap-4 mt-4 justify-end",
816
+ children: [
817
+ cancelButton,
818
+ /* @__PURE__ */ jsx17(Button, {
819
+ onClick: () => {
820
+ onOk == null ? void 0 : onOk();
821
+ close();
822
+ },
823
+ children: okText
824
+ })
825
+ ]
826
+ })
827
+ ]
828
+ })
829
+ });
830
+ }
831
+
832
+ // src/dialog/config.tsx
833
+ import { jsx as jsx18 } from "react/jsx-runtime";
834
+ function confirm(config) {
835
+ const container = document.createDocumentFragment();
836
+ let currentConfig = { ...config, close, open: true };
837
+ let timeoutId;
838
+ function close(...args) {
839
+ currentConfig = {
840
+ ...currentConfig,
841
+ open: false,
842
+ afterClose: () => {
843
+ if (typeof config.afterClose === "function") {
844
+ config.afterClose();
845
+ }
846
+ destroy.apply(this, args);
847
+ }
848
+ };
849
+ render(currentConfig);
850
+ }
851
+ function destroy(...args) {
852
+ const triggerCancel = args.some((param) => param && param.triggerCancel);
853
+ if (config.onCancel && triggerCancel) {
854
+ config.onCancel(() => {
855
+ }, ...args.slice(1));
856
+ }
857
+ for (let i = 0; i < destroyFns.length; i++) {
858
+ const fn = destroyFns[i];
859
+ if (fn === close) {
860
+ destroyFns.splice(i, 1);
861
+ break;
862
+ }
863
+ }
864
+ unmountComponentAtNode(container);
865
+ }
866
+ function render({ okText, cancelText, ...delegated }) {
867
+ clearTimeout(timeoutId);
868
+ timeoutId = setTimeout(() => {
869
+ DOMRender(/* @__PURE__ */ jsx18(ConfirmDialog, {
870
+ ...delegated,
871
+ okText,
872
+ cancelText
873
+ }), container);
874
+ });
875
+ }
876
+ function update(configUpdate) {
877
+ if (typeof configUpdate === "function") {
878
+ currentConfig = configUpdate(currentConfig);
879
+ } else {
880
+ currentConfig = {
881
+ ...currentConfig,
882
+ ...configUpdate
883
+ };
884
+ }
885
+ render(currentConfig);
886
+ }
887
+ render(currentConfig);
888
+ destroyFns.push(close);
889
+ return {
890
+ destroy: close,
891
+ update
892
+ };
893
+ }
894
+ var dumbFn = (event) => {
895
+ event.preventDefault();
896
+ };
897
+ function withDialog(delegated) {
898
+ return {
899
+ ...delegated,
900
+ open: true,
901
+ okCancel: true
902
+ };
903
+ }
904
+ function withWarning(delegated) {
905
+ return {
906
+ ...delegated,
907
+ open: true,
908
+ okCancel: false,
909
+ type: "warning",
910
+ onInteractOutside: dumbFn,
911
+ onPointerDownOutside: dumbFn
912
+ };
913
+ }
914
+ function withError(delegated) {
915
+ return {
916
+ ...delegated,
917
+ open: true,
918
+ okCancel: false,
919
+ type: "error",
920
+ onInteractOutside: dumbFn,
921
+ onPointerDownOutside: dumbFn
922
+ };
923
+ }
924
+ function withInfo(delegated) {
925
+ return {
926
+ ...delegated,
927
+ open: true,
928
+ okCancel: false,
929
+ type: "info",
930
+ onInteractOutside: dumbFn,
931
+ onPointerDownOutside: dumbFn
932
+ };
933
+ }
934
+ function withConfirm(delegated) {
935
+ return {
936
+ ...delegated,
937
+ open: true,
938
+ okCancel: true,
939
+ type: "info",
940
+ onInteractOutside: dumbFn,
941
+ onPointerDownOutside: dumbFn
942
+ };
943
+ }
944
+
945
+ // src/dialog/index.tsx
946
+ var Dialog = DialogBase;
947
+ function showDialog(delegated) {
948
+ return confirm(withDialog(delegated));
949
+ }
950
+ function showWarning(delegated) {
951
+ return confirm(withWarning(delegated));
952
+ }
953
+ function showConfirm(delegated) {
954
+ return confirm(withConfirm(delegated));
955
+ }
956
+ function showError(delegated) {
957
+ return confirm(withError(delegated));
958
+ }
959
+ function showInfo(delegated) {
960
+ return confirm(withInfo(delegated));
961
+ }
962
+ function destroyAll() {
963
+ while (destroyFns.length) {
964
+ const close = destroyFns.pop();
965
+ if (close) {
966
+ close();
967
+ }
968
+ }
969
+ }
970
+ export {
971
+ ActionMenu,
972
+ Button,
973
+ Dialog,
974
+ DropdownMenu,
975
+ destroyAll,
976
+ showConfirm,
977
+ showDialog,
978
+ showError,
979
+ showInfo,
980
+ showWarning
981
+ };