cytur-design-system 0.5.2 → 0.6.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/index.js CHANGED
@@ -1,18 +1,23 @@
1
- import { Alert as e, App as t, AutoComplete as n, Avatar as r, Badge as i, Breadcrumb as a, Button as o, Button as s, Card as c, Card as l, Checkbox as u, Col as d, ConfigProvider as f, ConfigProvider as p, DatePicker as m, Descriptions as h, Divider as ee, Drawer as te, Dropdown as g, Empty as _, Flex as v, Form as y, Input as b, InputNumber as ne, Layout as re, List as ie, Menu as ae, Modal as oe, Pagination as se, Popconfirm as ce, Popover as le, Progress as ue, Radio as de, Result as fe, Row as x, Select as S, Skeleton as C, Skeleton as w, Slider as T, Space as E, Space as D, Spin as O, Spin as k, Steps as A, Switch as j, Table as M, Table as N, Tabs as P, Tag as F, Tag as I, TimePicker as L, Tooltip as R, Tree as z, Typography as pe, Typography as B, Upload as me, message as he, notification as ge } from "antd";
2
- import { forwardRef as _e } from "react";
3
- import { Fragment as ve, jsx as V, jsxs as H } from "react/jsx-runtime";
4
- import { DownloadOutlined as ye, NotificationOutlined as be, SettingOutlined as xe } from "@ant-design/icons";
1
+ import { forwardRef as e, useEffect as t } from "react";
2
+ import { Alert as n, App as r, AutoComplete as i, Avatar as a, Badge as o, Breadcrumb as s, Button as c, Button as l, Card as u, Card as ee, Checkbox as d, Col as f, ConfigProvider as p, ConfigProvider as m, DatePicker as te, Descriptions as ne, Divider as re, Drawer as ie, Dropdown as ae, Empty as oe, Flex as se, Form as h, Input as g, InputNumber as ce, Layout as le, List as ue, Menu as de, Modal as fe, Pagination as pe, Popconfirm as me, Popover as he, Progress as ge, Radio as _e, Result as ve, Row as ye, Select as be, Skeleton as xe, Skeleton as _, Slider as v, Space as y, Space as b, Spin as x, Spin as S, Steps as C, Switch as w, Table as T, Table as E, Tabs as D, Tag as O, Tag as k, TimePicker as A, Tooltip as j, Tree as M, Typography as Se, Typography as N, Upload as Ce, message as we, notification as Te, theme as P } from "antd";
3
+ import { Fragment as F, jsx as I, jsxs as L } from "react/jsx-runtime";
4
+ import { DownloadOutlined as Ee, NotificationOutlined as De, SettingOutlined as Oe } from "@ant-design/icons";
5
5
  //#region src/theme/index.ts
6
- var U = {
6
+ var R = {
7
7
  fontFamily: "\"Pretendard\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif",
8
8
  fontSize: 14,
9
- borderRadius: 8,
10
- borderRadiusLG: 12,
11
- borderRadiusSM: 6,
9
+ borderRadius: 4,
10
+ borderRadiusLG: 8,
11
+ borderRadiusSM: 4,
12
+ borderRadiusXS: 2,
13
+ boxShadow: "0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.08)",
14
+ boxShadowSecondary: "0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.08)",
12
15
  colorSuccess: "#15803d",
13
16
  colorWarning: "#f59e0b",
14
17
  colorError: "#dc2626",
15
- colorInfo: "#2563eb",
18
+ colorErrorHover: "#b91c1c",
19
+ colorErrorActive: "#991b1b",
20
+ colorInfo: "#1d4ed8",
16
21
  colorText: "#111827",
17
22
  colorTextSecondary: "#4a5568",
18
23
  colorTextTertiary: "#6b7b8d",
@@ -22,9 +27,15 @@ var U = {
22
27
  colorBgContainer: "#ffffff",
23
28
  colorBgElevated: "#ffffff",
24
29
  colorBgLayout: "#f8fafb"
25
- }, W = {
30
+ }, z = {
31
+ Button: {
32
+ primaryShadow: "none",
33
+ defaultShadow: "none"
34
+ },
35
+ Modal: { borderRadiusLG: 12 }
36
+ }, B = {
26
37
  token: {
27
- ...U,
38
+ ...R,
28
39
  colorPrimary: "#0a9e9e",
29
40
  colorPrimaryHover: "#078080",
30
41
  colorPrimaryActive: "#056363",
@@ -32,13 +43,10 @@ var U = {
32
43
  colorLinkHover: "#078080",
33
44
  colorLinkActive: "#056363"
34
45
  },
35
- components: { Button: {
36
- primaryShadow: "none",
37
- defaultShadow: "none"
38
- } }
39
- }, G = {
46
+ components: z
47
+ }, V = {
40
48
  token: {
41
- ...U,
49
+ ...R,
42
50
  colorPrimary: "#2563eb",
43
51
  colorPrimaryHover: "#1d4ed8",
44
52
  colorPrimaryActive: "#1e40af",
@@ -46,13 +54,10 @@ var U = {
46
54
  colorLinkHover: "#1d4ed8",
47
55
  colorLinkActive: "#1e40af"
48
56
  },
49
- components: { Button: {
50
- primaryShadow: "none",
51
- defaultShadow: "none"
52
- } }
53
- }, K = {
57
+ components: z
58
+ }, H = {
54
59
  token: {
55
- ...U,
60
+ ...R,
56
61
  colorPrimary: "#4f46e5",
57
62
  colorPrimaryHover: "#4338ca",
58
63
  colorPrimaryActive: "#3730a3",
@@ -60,22 +65,498 @@ var U = {
60
65
  colorLinkHover: "#4338ca",
61
66
  colorLinkActive: "#3730a3"
62
67
  },
63
- components: { Button: {
64
- primaryShadow: "none",
65
- defaultShadow: "none"
66
- } }
67
- }, Se = W, q = {
68
- base: W,
69
- rm: G,
70
- csc: K
71
- }, J = ({ theme: e = "base", children: t }) => /* @__PURE__ */ V(p, {
72
- theme: q[e],
73
- children: t
74
- });
75
- J.displayName = "CyturProvider";
68
+ components: z
69
+ }, ke = B, U = {
70
+ base: B,
71
+ rm: V,
72
+ csc: H
73
+ }, W = {
74
+ "label-default-bg-solid": "#1f2937",
75
+ "label-default-text-solid": "#ffffff",
76
+ "label-primary-bg-solid": "#2563eb",
77
+ "label-primary-text-solid": "#ffffff",
78
+ "label-info-bg-solid": "#2563eb",
79
+ "label-info-text-solid": "#ffffff",
80
+ "label-success-bg-solid": "#15803d",
81
+ "label-success-text-solid": "#ffffff",
82
+ "label-warning-bg-solid": "#f59e0b",
83
+ "label-warning-text-solid": "#78350f",
84
+ "label-danger-bg-solid": "#dc2626",
85
+ "label-danger-text-solid": "#ffffff",
86
+ "label-default-bg-subtle": "#f1f3f5",
87
+ "label-default-text-subtle": "#374151",
88
+ "label-primary-bg-subtle": "#e8f0fe",
89
+ "label-primary-text-subtle": "#1d4ed8",
90
+ "label-info-bg-subtle": "#e8f0fe",
91
+ "label-info-text-subtle": "#1d4ed8",
92
+ "label-success-bg-subtle": "#f0fdf4",
93
+ "label-success-text-subtle": "#16a34a",
94
+ "label-warning-bg-subtle": "#fffbeb",
95
+ "label-warning-text-subtle": "#b45309",
96
+ "label-danger-bg-subtle": "#fef2f2",
97
+ "label-danger-text-subtle": "#b91c1c",
98
+ "label-default-bg-border": "#ffffff",
99
+ "label-default-text-border": "#374151",
100
+ "label-default-border": "#a3adb8",
101
+ "label-primary-bg-border": "#ffffff",
102
+ "label-primary-text-border": "#1d4ed8",
103
+ "label-primary-border": "#3b82f6",
104
+ "label-info-bg-border": "#ffffff",
105
+ "label-info-text-border": "#1d4ed8",
106
+ "label-info-border": "#3b82f6",
107
+ "label-success-bg-border": "#ffffff",
108
+ "label-success-text-border": "#16a34a",
109
+ "label-success-border": "#4ade80",
110
+ "label-warning-bg-border": "#ffffff",
111
+ "label-warning-text-border": "#b45309",
112
+ "label-warning-border": "#fbbf24",
113
+ "label-danger-bg-border": "#ffffff",
114
+ "label-danger-text-border": "#b91c1c",
115
+ "label-danger-border": "#f87171",
116
+ "tag-default-bg-solid": "#1f2937",
117
+ "tag-default-bg-solid-hover": "#1b2430",
118
+ "tag-default-text-solid": "#ffffff",
119
+ "tag-primary-bg-solid": "#2563eb",
120
+ "tag-primary-bg-solid-hover": "#1d4ed8",
121
+ "tag-primary-text-solid": "#ffffff",
122
+ "tag-success-bg-solid": "#15803d",
123
+ "tag-success-bg-solid-hover": "#045757",
124
+ "tag-success-text-solid": "#ffffff",
125
+ "tag-warning-bg-solid": "#f59e0b",
126
+ "tag-warning-bg-solid-hover": "#d88b0a",
127
+ "tag-warning-text-solid": "#78350f",
128
+ "tag-danger-bg-solid": "#dc2626",
129
+ "tag-danger-bg-solid-hover": "#c22121",
130
+ "tag-danger-text-solid": "#ffffff",
131
+ "tag-default-bg-subtle": "#f1f3f5",
132
+ "tag-default-bg-subtle-hover": "#e5e7e9",
133
+ "tag-default-text-subtle": "#374151",
134
+ "tag-primary-bg-subtle": "#e8f0fe",
135
+ "tag-primary-bg-subtle-hover": "#b8d4fc",
136
+ "tag-primary-text-subtle": "#1d4ed8",
137
+ "tag-success-bg-subtle": "#f0fdf4",
138
+ "tag-success-bg-subtle-hover": "#dbebeb",
139
+ "tag-success-text-subtle": "#16a34a",
140
+ "tag-warning-bg-subtle": "#fffbeb",
141
+ "tag-warning-bg-subtle-hover": "#f2eedf",
142
+ "tag-warning-text-subtle": "#b45309",
143
+ "tag-danger-bg-subtle": "#fef2f2",
144
+ "tag-danger-bg-subtle-hover": "#f1e6e6",
145
+ "tag-danger-text-subtle": "#b91c1c",
146
+ "tag-default-bg-border": "#ffffff",
147
+ "tag-default-bg-border-hover": "#f1f3f5",
148
+ "tag-default-text-border": "#374151",
149
+ "tag-default-border": "#a3adb8",
150
+ "tag-primary-bg-border": "#ffffff",
151
+ "tag-primary-bg-border-hover": "#e8f0fe",
152
+ "tag-primary-text-border": "#1d4ed8",
153
+ "tag-primary-border": "#3b82f6",
154
+ "tag-success-bg-border": "#ffffff",
155
+ "tag-success-bg-border-hover": "#e6f7f7",
156
+ "tag-success-text-border": "#16a34a",
157
+ "tag-success-border": "#4ade80",
158
+ "tag-warning-bg-border": "#ffffff",
159
+ "tag-warning-bg-border-hover": "#fffbeb",
160
+ "tag-warning-text-border": "#b45309",
161
+ "tag-warning-border": "#fbbf24",
162
+ "tag-danger-bg-border": "#ffffff",
163
+ "tag-danger-bg-border-hover": "#fef2f2",
164
+ "tag-danger-text-border": "#b91c1c",
165
+ "tag-danger-border": "#f87171",
166
+ "action-primary": "#0a9e9e",
167
+ "action-primary-hover": "#078080",
168
+ "action-primary-active": "#056363",
169
+ "action-secondary": "#1d4ed8",
170
+ "action-secondary-hover": "#1e40af",
171
+ "action-secondary-active": "#1e3a8a",
172
+ "action-danger": "#dc2626",
173
+ "action-danger-hover": "#b91c1c",
174
+ "action-danger-active": "#991b1b",
175
+ "bg-surface": "#ffffff",
176
+ "bg-subtle": "#f8fafb",
177
+ "bg-secondary-subtle": "#e8f0fe",
178
+ "bg-danger-subtle": "#fef2f2",
179
+ "text-primary": "#111827",
180
+ "text-secondary": "#4a5568",
181
+ "text-secondary-action": "#1d4ed8",
182
+ "text-primary-action": "#0a9e9e",
183
+ "text-muted": "#a3adb8",
184
+ "text-danger": "#dc2626",
185
+ "text-inverse": "#ffffff",
186
+ "text-disabled": "#a3adb8",
187
+ "border-default": "#e2e6ea",
188
+ "border-secondary": "#88b8fa",
189
+ "border-danger": "#fca5a5",
190
+ "border-focus": "#26c6c6",
191
+ "disabled-bg": "#e2e6ea",
192
+ "disabled-border": "#e2e6ea",
193
+ "disabled-text": "#a3adb8",
194
+ "font-size-xs": "12px",
195
+ "font-size-sm": "14px",
196
+ "font-size-md": "16px",
197
+ "font-size-lg": "20px",
198
+ "font-size-xl": "24px",
199
+ "font-weight-regular": "400",
200
+ "font-weight-medium": "500",
201
+ "font-weight-semibold": "600",
202
+ "font-weight-bold": "700",
203
+ "line-height-16": "16px",
204
+ "line-height-18": "18px",
205
+ "line-height-20": "20px",
206
+ "line-height-22": "22px",
207
+ "line-height-24": "24px",
208
+ "line-height-28": "28px",
209
+ "line-height-32": "32px",
210
+ "letter-spacing-tighter": "-0.4px",
211
+ "letter-spacing-tight": "-0.2px",
212
+ "letter-spacing-normal": "0",
213
+ "letter-spacing-wide": "0.4px",
214
+ "color-gray-50": "#f8fafb",
215
+ "color-gray-100": "#f1f3f5",
216
+ "color-gray-200": "#e2e6ea",
217
+ "color-gray-300": "#cdd3d9",
218
+ "color-gray-400": "#a3adb8",
219
+ "color-gray-500": "#6b7b8d",
220
+ "color-gray-600": "#4a5568",
221
+ "color-gray-700": "#374151",
222
+ "color-gray-800": "#1f2937",
223
+ "color-gray-900": "#111827",
224
+ "color-yellow-50": "#fffbeb",
225
+ "color-yellow-500": "#f59e0b"
226
+ }, Ae = {
227
+ ...W,
228
+ "action-primary": "#3b82f6",
229
+ "action-primary-hover": "#5899f5",
230
+ "action-primary-active": "#88b8fa",
231
+ "action-danger": "#f87171",
232
+ "action-danger-hover": "#fca5a5",
233
+ "action-danger-active": "#fecaca",
234
+ "bg-surface": "#1f2937",
235
+ "bg-subtle": "#0f172a",
236
+ "bg-secondary-subtle": "#1e3a8a",
237
+ "bg-danger-subtle": "#7f1d1d",
238
+ "text-primary": "#f8fafb",
239
+ "text-secondary": "#cdd3d9",
240
+ "text-secondary-action": "#88b8fa",
241
+ "text-primary-action": "#3b82f6",
242
+ "text-muted": "#6b7b8d",
243
+ "text-danger": "#f87171",
244
+ "text-inverse": "#1f2937",
245
+ "text-disabled": "#6b7b8d",
246
+ "border-default": "#374151",
247
+ "border-secondary": "#4a5568",
248
+ "border-danger": "#7f1d1d",
249
+ "border-focus": "#3b82f6",
250
+ "disabled-bg": "#1f2937",
251
+ "disabled-border": "#374151",
252
+ "disabled-text": "#6b7b8d",
253
+ "color-gray-50": "#0f172a",
254
+ "color-gray-100": "#1f2937",
255
+ "color-gray-200": "#374151",
256
+ "color-gray-300": "#4a5568",
257
+ "color-gray-400": "#6b7b8d",
258
+ "color-gray-500": "#a3adb8",
259
+ "color-gray-600": "#cdd3d9",
260
+ "color-gray-700": "#e2e6ea",
261
+ "color-gray-800": "#f1f3f5",
262
+ "color-gray-900": "#f8fafb"
263
+ }, je = (e, t) => {
264
+ let n = (e) => Object.entries(e).map(([e, t]) => ` --cytur-${e}: ${t};`).join("\n");
265
+ return `
266
+ :root, [data-mode="light"] {
267
+ ${n(e)}
268
+ }
269
+ [data-mode="dark"] {
270
+ ${n(t)}
271
+ }
272
+ `.trim();
273
+ }, G = "__cytur_tokens__", Me = () => {
274
+ if (typeof document > "u") return;
275
+ let e = document.getElementById(G);
276
+ e || (e = document.createElement("style"), e.id = G, document.head.appendChild(e)), e.innerHTML = je(W, Ae);
277
+ }, K = ({ theme: e = "base", mode: n = "light", children: r }) => {
278
+ t(() => {
279
+ Me();
280
+ }, []), t(() => {
281
+ typeof document < "u" && (document.documentElement.dataset.mode = n);
282
+ }, [n]);
283
+ let i = e === "base" && n === "dark" ? { token: {
284
+ ...U[e].token,
285
+ colorPrimary: "#3b82f6",
286
+ colorPrimaryHover: "#5899f5",
287
+ colorPrimaryActive: "#88b8fa",
288
+ colorError: "#f87171",
289
+ colorErrorHover: "#fca5a5",
290
+ colorErrorActive: "#fecaca"
291
+ } } : {};
292
+ return /* @__PURE__ */ I(m, {
293
+ theme: {
294
+ ...U[e],
295
+ ...i,
296
+ algorithm: n === "dark" ? P.darkAlgorithm : P.defaultAlgorithm
297
+ },
298
+ children: r
299
+ });
300
+ };
301
+ K.displayName = "CyturProvider";
76
302
  //#endregion
77
- //#region src/components/icon/icons.ts
78
- var Ce = {
303
+ //#region src/theme/tokens.ts
304
+ var q = (e) => `var(--cytur-${e})`, Ne = {
305
+ label: {
306
+ default: {
307
+ bg: {
308
+ solid: q("label-default-bg-solid"),
309
+ subtle: q("label-default-bg-subtle"),
310
+ border: q("label-default-bg-border")
311
+ },
312
+ text: {
313
+ solid: q("label-default-text-solid"),
314
+ subtle: q("label-default-text-subtle"),
315
+ border: q("label-default-text-border")
316
+ },
317
+ border: q("label-default-border")
318
+ },
319
+ primary: {
320
+ bg: {
321
+ solid: q("label-primary-bg-solid"),
322
+ subtle: q("label-primary-bg-subtle"),
323
+ border: q("label-primary-bg-border")
324
+ },
325
+ text: {
326
+ solid: q("label-primary-text-solid"),
327
+ subtle: q("label-primary-text-subtle"),
328
+ border: q("label-primary-text-border")
329
+ },
330
+ border: q("label-primary-border")
331
+ },
332
+ info: {
333
+ bg: {
334
+ solid: q("label-info-bg-solid"),
335
+ subtle: q("label-info-bg-subtle"),
336
+ border: q("label-info-bg-border")
337
+ },
338
+ text: {
339
+ solid: q("label-info-text-solid"),
340
+ subtle: q("label-info-text-subtle"),
341
+ border: q("label-info-text-border")
342
+ },
343
+ border: q("label-info-border")
344
+ },
345
+ success: {
346
+ bg: {
347
+ solid: q("label-success-bg-solid"),
348
+ subtle: q("label-success-bg-subtle"),
349
+ border: q("label-success-bg-border")
350
+ },
351
+ text: {
352
+ solid: q("label-success-text-solid"),
353
+ subtle: q("label-success-text-subtle"),
354
+ border: q("label-success-text-border")
355
+ },
356
+ border: q("label-success-border")
357
+ },
358
+ warning: {
359
+ bg: {
360
+ solid: q("label-warning-bg-solid"),
361
+ subtle: q("label-warning-bg-subtle"),
362
+ border: q("label-warning-bg-border")
363
+ },
364
+ text: {
365
+ solid: q("label-warning-text-solid"),
366
+ subtle: q("label-warning-text-subtle"),
367
+ border: q("label-warning-text-border")
368
+ },
369
+ border: q("label-warning-border")
370
+ },
371
+ danger: {
372
+ bg: {
373
+ solid: q("label-danger-bg-solid"),
374
+ subtle: q("label-danger-bg-subtle"),
375
+ border: q("label-danger-bg-border")
376
+ },
377
+ text: {
378
+ solid: q("label-danger-text-solid"),
379
+ subtle: q("label-danger-text-subtle"),
380
+ border: q("label-danger-text-border")
381
+ },
382
+ border: q("label-danger-border")
383
+ }
384
+ },
385
+ tag: {
386
+ default: {
387
+ bg: {
388
+ solid: q("tag-default-bg-solid"),
389
+ solidHover: q("tag-default-bg-solid-hover"),
390
+ subtle: q("tag-default-bg-subtle"),
391
+ subtleHover: q("tag-default-bg-subtle-hover"),
392
+ border: q("tag-default-bg-border"),
393
+ borderHover: q("tag-default-bg-border-hover")
394
+ },
395
+ text: {
396
+ solid: q("tag-default-text-solid"),
397
+ subtle: q("tag-default-text-subtle"),
398
+ border: q("tag-default-text-border")
399
+ },
400
+ border: q("tag-default-border")
401
+ },
402
+ primary: {
403
+ bg: {
404
+ solid: q("tag-primary-bg-solid"),
405
+ solidHover: q("tag-primary-bg-solid-hover"),
406
+ subtle: q("tag-primary-bg-subtle"),
407
+ subtleHover: q("tag-primary-bg-subtle-hover"),
408
+ border: q("tag-primary-bg-border"),
409
+ borderHover: q("tag-primary-bg-border-hover")
410
+ },
411
+ text: {
412
+ solid: q("tag-primary-text-solid"),
413
+ subtle: q("tag-primary-text-subtle"),
414
+ border: q("tag-primary-text-border")
415
+ },
416
+ border: q("tag-primary-border")
417
+ },
418
+ success: {
419
+ bg: {
420
+ solid: q("tag-success-bg-solid"),
421
+ solidHover: q("tag-success-bg-solid-hover"),
422
+ subtle: q("tag-success-bg-subtle"),
423
+ subtleHover: q("tag-success-bg-subtle-hover"),
424
+ border: q("tag-success-bg-border"),
425
+ borderHover: q("tag-success-bg-border-hover")
426
+ },
427
+ text: {
428
+ solid: q("tag-success-text-solid"),
429
+ subtle: q("tag-success-text-subtle"),
430
+ border: q("tag-success-text-border")
431
+ },
432
+ border: q("tag-success-border")
433
+ },
434
+ warning: {
435
+ bg: {
436
+ solid: q("tag-warning-bg-solid"),
437
+ solidHover: q("tag-warning-bg-solid-hover"),
438
+ subtle: q("tag-warning-bg-subtle"),
439
+ subtleHover: q("tag-warning-bg-subtle-hover"),
440
+ border: q("tag-warning-bg-border"),
441
+ borderHover: q("tag-warning-bg-border-hover")
442
+ },
443
+ text: {
444
+ solid: q("tag-warning-text-solid"),
445
+ subtle: q("tag-warning-text-subtle"),
446
+ border: q("tag-warning-text-border")
447
+ },
448
+ border: q("tag-warning-border")
449
+ },
450
+ danger: {
451
+ bg: {
452
+ solid: q("tag-danger-bg-solid"),
453
+ solidHover: q("tag-danger-bg-solid-hover"),
454
+ subtle: q("tag-danger-bg-subtle"),
455
+ subtleHover: q("tag-danger-bg-subtle-hover"),
456
+ border: q("tag-danger-bg-border"),
457
+ borderHover: q("tag-danger-bg-border-hover")
458
+ },
459
+ text: {
460
+ solid: q("tag-danger-text-solid"),
461
+ subtle: q("tag-danger-text-subtle"),
462
+ border: q("tag-danger-text-border")
463
+ },
464
+ border: q("tag-danger-border")
465
+ }
466
+ },
467
+ action: {
468
+ primary: {
469
+ default: q("action-primary"),
470
+ hover: q("action-primary-hover"),
471
+ active: q("action-primary-active")
472
+ },
473
+ secondary: {
474
+ default: q("action-secondary"),
475
+ hover: q("action-secondary-hover"),
476
+ active: q("action-secondary-active")
477
+ },
478
+ danger: {
479
+ default: q("action-danger"),
480
+ hover: q("action-danger-hover"),
481
+ active: q("action-danger-active")
482
+ }
483
+ },
484
+ bg: {
485
+ surface: q("bg-surface"),
486
+ subtle: q("bg-subtle"),
487
+ secondarySubtle: q("bg-secondary-subtle"),
488
+ dangerSubtle: q("bg-danger-subtle")
489
+ },
490
+ text: {
491
+ primary: q("text-primary"),
492
+ secondary: q("text-secondary"),
493
+ secondaryAction: q("text-secondary-action"),
494
+ primaryAction: q("text-primary-action"),
495
+ muted: q("text-muted"),
496
+ danger: q("text-danger"),
497
+ inverse: q("text-inverse"),
498
+ disabled: q("text-disabled")
499
+ },
500
+ border: {
501
+ default: q("border-default"),
502
+ secondary: q("border-secondary"),
503
+ danger: q("border-danger"),
504
+ focus: q("border-focus")
505
+ },
506
+ disabled: {
507
+ bg: q("disabled-bg"),
508
+ border: q("disabled-border"),
509
+ text: q("disabled-text")
510
+ },
511
+ font: {
512
+ size: {
513
+ xs: q("font-size-xs"),
514
+ sm: q("font-size-sm"),
515
+ md: q("font-size-md"),
516
+ lg: q("font-size-lg"),
517
+ xl: q("font-size-xl")
518
+ },
519
+ weight: {
520
+ regular: q("font-weight-regular"),
521
+ medium: q("font-weight-medium"),
522
+ semibold: q("font-weight-semibold"),
523
+ bold: q("font-weight-bold")
524
+ },
525
+ lineHeight: {
526
+ 16: q("line-height-16"),
527
+ 18: q("line-height-18"),
528
+ 20: q("line-height-20"),
529
+ 22: q("line-height-22"),
530
+ 24: q("line-height-24"),
531
+ 28: q("line-height-28"),
532
+ 32: q("line-height-32")
533
+ },
534
+ letterSpacing: {
535
+ tighter: q("letter-spacing-tighter"),
536
+ tight: q("letter-spacing-tight"),
537
+ normal: q("letter-spacing-normal"),
538
+ wide: q("letter-spacing-wide")
539
+ }
540
+ },
541
+ color: {
542
+ gray: {
543
+ 50: q("color-gray-50"),
544
+ 100: q("color-gray-100"),
545
+ 200: q("color-gray-200"),
546
+ 300: q("color-gray-300"),
547
+ 400: q("color-gray-400"),
548
+ 500: q("color-gray-500"),
549
+ 600: q("color-gray-600"),
550
+ 700: q("color-gray-700"),
551
+ 800: q("color-gray-800"),
552
+ 900: q("color-gray-900")
553
+ },
554
+ yellow: {
555
+ 50: q("color-yellow-50"),
556
+ 500: q("color-yellow-500")
557
+ }
558
+ }
559
+ }, Pe = {
79
560
  close: {
80
561
  viewBox: "0 0 20 20",
81
562
  paths: ["M16 5.20857L14.7914 4L10 8.79143L5.20857 4L4 5.20857L8.79143 10L4 14.7914L5.20857 16L10 11.2086L14.7914 16L16 14.7914L11.2086 10L16 5.20857Z"]
@@ -159,15 +640,19 @@ var Ce = {
159
640
  campaign: {
160
641
  viewBox: "0 0 20 20",
161
642
  paths: ["M14.5 9.25V10.75H17.5V9.25H14.5ZM13 14.2075C13.72 14.74 14.6575 15.445 15.4 16C15.7 15.6025 16 15.1975 16.3 14.7925C15.5575 14.2375 14.62 13.5325 13.9 12.9925C13.6 13.3975 13.3 13.8025 13 14.2075ZM16.3 5.2C16 4.8025 15.7 4.3975 15.4 4C14.68 4.5325 13.7425 5.2375 13 5.8C13.3 6.205 13.6 6.6025 13.9 7.0075C14.6425 6.4525 15.58 5.7475 16.3 5.2ZM4 7.75C3.175 7.75 2.5 8.425 2.5 9.25V10.75C2.5 11.575 3.175 12.25 4 12.25H4.75V15.25H6.25V12.25H7L10.75 14.5V5.5L7 7.75H4ZM12.625 10C12.625 9.0025 12.19 8.1025 11.5 7.4875V12.505C12.19 11.8975 12.625 10.9975 12.625 10Z"]
643
+ },
644
+ "unfold-more": {
645
+ viewBox: "0 0 20 20",
646
+ paths: ["M10 3L6.5 6.5L7.5 7.5L10 5L12.5 7.5L13.5 6.5L10 3Z", "M10 17L13.5 13.5L12.5 12.5L10 15L7.5 12.5L6.5 13.5L10 17Z"]
162
647
  }
163
- }, we = {
648
+ }, Fe = {
164
649
  xs: 10,
165
650
  sm: 16,
166
651
  md: 20,
167
652
  lg: 24
168
- }, Y = _e(({ name: e, size: t = "md", color: n = "currentColor", style: r, ...i }, a) => {
169
- let o = typeof t == "number" ? t : we[t], s = Ce[e];
170
- return /* @__PURE__ */ V("svg", {
653
+ }, J = e(({ name: e, size: t = "md", color: n = "currentColor", style: r, ...i }, a) => {
654
+ let o = typeof t == "number" ? t : Fe[t], s = Pe[e];
655
+ return /* @__PURE__ */ I("svg", {
171
656
  ref: a,
172
657
  width: o,
173
658
  height: o,
@@ -180,17 +665,51 @@ var Ce = {
180
665
  ...r
181
666
  },
182
667
  ...i,
183
- children: s.paths.map((e, t) => /* @__PURE__ */ V("path", {
668
+ children: s.paths.map((e, t) => /* @__PURE__ */ I("path", {
184
669
  d: e,
185
670
  fillRule: "evenodd",
186
671
  clipRule: "evenodd"
187
672
  }, t))
188
673
  });
189
674
  });
190
- Y.displayName = "Icon";
675
+ J.displayName = "Icon";
676
+ //#endregion
677
+ //#region src/components/icon-button/IconButton.tsx
678
+ var Ie = {
679
+ sm: 28,
680
+ md: 32,
681
+ lg: 36
682
+ }, Le = {
683
+ sm: 16,
684
+ md: 20,
685
+ lg: 24
686
+ }, Y = e(({ size: e = "md", icon: t, style: n, ...r }, i) => {
687
+ let a = Ie[e], o = Le[e];
688
+ return /* @__PURE__ */ I(l, {
689
+ ref: i,
690
+ type: "text",
691
+ icon: /* @__PURE__ */ I("span", {
692
+ style: {
693
+ display: "inline-flex",
694
+ fontSize: o,
695
+ lineHeight: 1
696
+ },
697
+ children: t
698
+ }),
699
+ style: {
700
+ width: a,
701
+ height: a,
702
+ padding: 0,
703
+ borderRadius: 8,
704
+ ...n
705
+ },
706
+ ...r
707
+ });
708
+ });
709
+ Y.displayName = "IconButton";
191
710
  //#endregion
192
711
  //#region src/components/alert-feed/AlertFeed.tsx
193
- var Te = {
712
+ var Re = {
194
713
  emergency: "red",
195
714
  alarm: "orange",
196
715
  warning: "gold",
@@ -200,39 +719,39 @@ var Te = {
200
719
  alarm: "Alarm",
201
720
  warning: "Warning",
202
721
  caution: "Caution"
203
- }, Z = ({ title: e = "Threat Event Alarms", subtitle: t = "(Last 7 Days)", items: n = [], loading: r = !1, maxHeight: i = 620, activeFilter: a = "all", onFilterChange: o, onViewAll: c, onSettingsClick: u, viewAllLabel: d = "View All Threat Events", extra: f }) => {
204
- let p = {
722
+ }, Z = ({ title: e = "Threat Event Alarms", subtitle: t = "(Last 7 Days)", items: n = [], loading: r = !1, maxHeight: i = 620, activeFilter: a = "all", onFilterChange: o, onViewAll: s, onSettingsClick: c, viewAllLabel: u = "View All Threat Events", extra: d }) => {
723
+ let f = {
205
724
  all: n.length,
206
725
  emergency: n.filter((e) => e.severity === "emergency").length,
207
726
  alarm: n.filter((e) => e.severity === "alarm").length,
208
727
  warning: n.filter((e) => e.severity === "warning").length,
209
728
  caution: n.filter((e) => e.severity === "caution").length
210
- }, m = a === "all" ? n : n.filter((e) => e.severity === a), h = f ?? (u && /* @__PURE__ */ V(s, {
729
+ }, p = a === "all" ? n : n.filter((e) => e.severity === a), m = d ?? (c && /* @__PURE__ */ I(l, {
211
730
  type: "text",
212
731
  size: "small",
213
- icon: /* @__PURE__ */ V(xe, {}),
214
- onClick: u
732
+ icon: /* @__PURE__ */ I(Oe, {}),
733
+ onClick: c
215
734
  }));
216
- return /* @__PURE__ */ V(l, {
217
- title: /* @__PURE__ */ H(D, {
735
+ return /* @__PURE__ */ I(ee, {
736
+ title: /* @__PURE__ */ L(b, {
218
737
  size: 6,
219
738
  children: [
220
- /* @__PURE__ */ V(be, { style: { fontSize: 16 } }),
221
- /* @__PURE__ */ V("span", {
739
+ /* @__PURE__ */ I(De, { style: { fontSize: 16 } }),
740
+ /* @__PURE__ */ I("span", {
222
741
  style: {
223
742
  fontSize: 14,
224
743
  fontWeight: 700
225
744
  },
226
745
  children: e
227
746
  }),
228
- /* @__PURE__ */ V(B.Text, {
747
+ /* @__PURE__ */ I(N.Text, {
229
748
  type: "secondary",
230
749
  style: { fontSize: 12 },
231
750
  children: t
232
751
  })
233
752
  ]
234
753
  }),
235
- extra: h,
754
+ extra: m,
236
755
  style: {
237
756
  width: 400,
238
757
  maxHeight: i,
@@ -248,25 +767,25 @@ var Te = {
248
767
  gap: 12,
249
768
  overflow: "hidden"
250
769
  } },
251
- actions: c && !r ? [/* @__PURE__ */ V(s, {
770
+ actions: s && !r ? [/* @__PURE__ */ I(l, {
252
771
  type: "text",
253
772
  size: "small",
254
- onClick: c,
255
- children: d
773
+ onClick: s,
774
+ children: u
256
775
  }, "view-all")] : void 0,
257
- children: r ? /* @__PURE__ */ V(w, {
776
+ children: r ? /* @__PURE__ */ I(_, {
258
777
  active: !0,
259
778
  paragraph: { rows: 6 }
260
- }) : /* @__PURE__ */ H(ve, { children: [/* @__PURE__ */ V(D, {
779
+ }) : /* @__PURE__ */ L(F, { children: [/* @__PURE__ */ I(b, {
261
780
  size: 4,
262
781
  wrap: !0,
263
- children: Object.entries(p).map(([e, t]) => /* @__PURE__ */ V(I.CheckableTag, {
782
+ children: Object.entries(f).map(([e, t]) => /* @__PURE__ */ I(k.CheckableTag, {
264
783
  checked: a === e,
265
784
  onChange: () => o?.(e),
266
785
  style: { margin: 0 },
267
786
  children: `${e === "all" ? "All" : X[e]} ${t}`
268
787
  }, e))
269
- }), /* @__PURE__ */ V("div", {
788
+ }), /* @__PURE__ */ I("div", {
270
789
  style: {
271
790
  flex: 1,
272
791
  minHeight: 0,
@@ -275,10 +794,10 @@ var Te = {
275
794
  flexDirection: "column",
276
795
  gap: 6
277
796
  },
278
- children: m.length === 0 ? /* @__PURE__ */ V(_, {
797
+ children: p.length === 0 ? /* @__PURE__ */ I(oe, {
279
798
  description: n.length === 0 ? "No alerts" : "No matching alerts",
280
799
  style: { margin: "auto" }
281
- }) : m.map((e) => /* @__PURE__ */ H("div", {
800
+ }) : p.map((e) => /* @__PURE__ */ L("div", {
282
801
  style: {
283
802
  padding: "10px 12px",
284
803
  background: "#f9fafb",
@@ -288,23 +807,23 @@ var Te = {
288
807
  gap: 4
289
808
  },
290
809
  children: [
291
- /* @__PURE__ */ H("div", {
810
+ /* @__PURE__ */ L("div", {
292
811
  style: {
293
812
  display: "flex",
294
813
  justifyContent: "space-between",
295
814
  alignItems: "center"
296
815
  },
297
- children: [/* @__PURE__ */ V(I, {
298
- color: Te[e.severity],
816
+ children: [/* @__PURE__ */ I(k, {
817
+ color: Re[e.severity],
299
818
  style: { margin: 0 },
300
819
  children: X[e.severity]
301
- }), /* @__PURE__ */ V(B.Text, {
820
+ }), /* @__PURE__ */ I(N.Text, {
302
821
  type: "secondary",
303
822
  style: { fontSize: 12 },
304
823
  children: e.time
305
824
  })]
306
825
  }),
307
- /* @__PURE__ */ V("div", {
826
+ /* @__PURE__ */ I("div", {
308
827
  style: {
309
828
  fontSize: 14,
310
829
  fontWeight: 500,
@@ -312,7 +831,7 @@ var Te = {
312
831
  },
313
832
  children: e.title
314
833
  }),
315
- /* @__PURE__ */ V(B.Text, {
834
+ /* @__PURE__ */ I(N.Text, {
316
835
  type: "secondary",
317
836
  style: { fontSize: 12 },
318
837
  children: e.meta
@@ -327,7 +846,7 @@ Z.displayName = "AlertFeed";
327
846
  //#region src/components/file/File.tsx
328
847
  var Q = ({ state: e = "default", children: t, style: n, ...r }) => {
329
848
  let i = e === "loading";
330
- return /* @__PURE__ */ H(B.Link, {
849
+ return /* @__PURE__ */ L(N.Link, {
331
850
  ...r,
332
851
  disabled: i,
333
852
  style: {
@@ -338,7 +857,7 @@ var Q = ({ state: e = "default", children: t, style: n, ...r }) => {
338
857
  lineHeight: "18px",
339
858
  ...n
340
859
  },
341
- children: [i ? /* @__PURE__ */ V(k, { size: "small" }) : /* @__PURE__ */ V(ye, {}), t]
860
+ children: [i ? /* @__PURE__ */ I(S, { size: "small" }) : /* @__PURE__ */ I(Ee, {}), t]
342
861
  });
343
862
  };
344
863
  Q.displayName = "File";
@@ -366,7 +885,7 @@ function $({ columns: e, data: t, rowKey: n = "id", pagination: r = !1, pageSize
366
885
  value: e
367
886
  })), u.onFilter = (e, t) => String(t[l] ?? "") === e), u;
368
887
  });
369
- return /* @__PURE__ */ V(N, {
888
+ return /* @__PURE__ */ I(E, {
370
889
  ...c,
371
890
  columns: l,
372
891
  dataSource: t,
@@ -382,4 +901,4 @@ function $({ columns: e, data: t, rowKey: n = "id", pagination: r = !1, pageSize
382
901
  }
383
902
  $.displayName = "DataTable";
384
903
  //#endregion
385
- export { e as Alert, Z as AlertFeed, t as App, n as AutoComplete, r as Avatar, i as Badge, a as Breadcrumb, o as Button, c as Card, u as Checkbox, d as Col, f as ConfigProvider, J as CyturProvider, $ as DataTable, m as DatePicker, h as Descriptions, ee as Divider, te as Drawer, g as Dropdown, Q as File, v as Flex, y as Form, Y as Icon, b as Input, ne as InputNumber, re as Layout, ie as List, ae as Menu, oe as Modal, se as Pagination, ce as Popconfirm, le as Popover, ue as Progress, de as Radio, fe as Result, x as Row, S as Select, C as Skeleton, T as Slider, E as Space, O as Spin, A as Steps, j as Switch, M as Table, P as Tabs, F as Tag, L as TimePicker, R as Tooltip, z as Tree, pe as Typography, me as Upload, W as baseTheme, K as cscTheme, Se as defaultTheme, he as message, ge as notification, G as rmTheme, q as themes };
904
+ export { n as Alert, Z as AlertFeed, r as App, i as AutoComplete, a as Avatar, o as Badge, s as Breadcrumb, c as Button, u as Card, d as Checkbox, f as Col, p as ConfigProvider, K as CyturProvider, $ as DataTable, te as DatePicker, ne as Descriptions, re as Divider, ie as Drawer, ae as Dropdown, Q as File, se as Flex, h as Form, J as Icon, Y as IconButton, g as Input, ce as InputNumber, le as Layout, ue as List, de as Menu, fe as Modal, pe as Pagination, me as Popconfirm, he as Popover, ge as Progress, _e as Radio, ve as Result, ye as Row, be as Select, xe as Skeleton, v as Slider, y as Space, x as Spin, C as Steps, w as Switch, T as Table, D as Tabs, O as Tag, A as TimePicker, j as Tooltip, M as Tree, Se as Typography, Ce as Upload, B as baseTheme, H as cscTheme, ke as defaultTheme, we as message, Te as notification, V as rmTheme, U as themes, Ne as tokens };
@@ -87,5 +87,9 @@ export declare const icons: {
87
87
  readonly viewBox: "0 0 20 20";
88
88
  readonly paths: ["M14.5 9.25V10.75H17.5V9.25H14.5ZM13 14.2075C13.72 14.74 14.6575 15.445 15.4 16C15.7 15.6025 16 15.1975 16.3 14.7925C15.5575 14.2375 14.62 13.5325 13.9 12.9925C13.6 13.3975 13.3 13.8025 13 14.2075ZM16.3 5.2C16 4.8025 15.7 4.3975 15.4 4C14.68 4.5325 13.7425 5.2375 13 5.8C13.3 6.205 13.6 6.6025 13.9 7.0075C14.6425 6.4525 15.58 5.7475 16.3 5.2ZM4 7.75C3.175 7.75 2.5 8.425 2.5 9.25V10.75C2.5 11.575 3.175 12.25 4 12.25H4.75V15.25H6.25V12.25H7L10.75 14.5V5.5L7 7.75H4ZM12.625 10C12.625 9.0025 12.19 8.1025 11.5 7.4875V12.505C12.19 11.8975 12.625 10.9975 12.625 10Z"];
89
89
  };
90
+ readonly 'unfold-more': {
91
+ readonly viewBox: "0 0 20 20";
92
+ readonly paths: ["M10 3L6.5 6.5L7.5 7.5L10 5L12.5 7.5L13.5 6.5L10 3Z", "M10 17L13.5 13.5L12.5 12.5L10 15L7.5 12.5L6.5 13.5L10 17Z"];
93
+ };
90
94
  };
91
95
  export type IconName = keyof typeof icons;
@@ -0,0 +1,17 @@
1
+ import { type ButtonProps } from 'antd';
2
+ import { type ReactNode } from 'react';
3
+ export type IconButtonSize = 'sm' | 'md' | 'lg';
4
+ export interface IconButtonProps extends Omit<ButtonProps, 'size' | 'icon' | 'shape' | 'children'> {
5
+ size?: IconButtonSize;
6
+ icon: ReactNode;
7
+ /** 아이콘 전용 버튼이므로 접근성을 위해 권장 */
8
+ 'aria-label'?: string;
9
+ }
10
+ /**
11
+ * Icon-only 버튼. antd Button을 wrapping해서 Figma 스펙(28/32/36)에 맞춤.
12
+ * 기본은 transparent, hover/active 시 회색 배경.
13
+ *
14
+ * Usage:
15
+ * <IconButton icon={<SettingOutlined />} aria-label="Settings" />
16
+ */
17
+ export declare const IconButton: import("react").ForwardRefExoticComponent<IconButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
@@ -1,4 +1,5 @@
1
1
  export { Icon, type IconProps, type IconSize, type IconName } from './icon/Icon';
2
+ export { IconButton, type IconButtonProps, type IconButtonSize } from './icon-button/IconButton';
2
3
  export { AlertFeed, type AlertFeedProps, type AlertItem, type AlertSeverity } from './alert-feed/AlertFeed';
3
4
  export { File, type FileProps, type FileState } from './file/File';
4
5
  export { DataTable, type DataTableProps, type DataTableColumn } from './data-table/DataTable';
@@ -1,6 +1,8 @@
1
1
  export { baseTheme, rmTheme, cscTheme, defaultTheme, themes, type ThemeName, } from './theme';
2
- export { CyturProvider, type CyturProviderProps } from './theme/CyturProvider';
2
+ export { CyturProvider, type CyturProviderProps, type ColorMode } from './theme/CyturProvider';
3
+ export { tokens, type CyturTokens } from './theme/tokens';
3
4
  export { Icon, type IconProps, type IconSize, type IconName } from './components/icon/Icon';
5
+ export { IconButton, type IconButtonProps, type IconButtonSize } from './components/icon-button/IconButton';
4
6
  export { AlertFeed, type AlertFeedProps, type AlertItem, type AlertSeverity } from './components/alert-feed/AlertFeed';
5
7
  export { File, type FileProps, type FileState } from './components/file/File';
6
8
  export { DataTable, type DataTableProps, type DataTableColumn } from './components/data-table/DataTable';
@@ -1,10 +1,14 @@
1
1
  import { type ReactNode } from 'react';
2
2
  import { type ThemeName } from './index';
3
+ export type ColorMode = 'light' | 'dark';
3
4
  export interface CyturProviderProps {
5
+ /** 프로젝트 테마 (Primary color) */
4
6
  theme?: ThemeName;
7
+ /** 라이트/다크 모드 */
8
+ mode?: ColorMode;
5
9
  children: ReactNode;
6
10
  }
7
11
  export declare const CyturProvider: {
8
- ({ theme, children }: CyturProviderProps): import("react/jsx-runtime").JSX.Element;
12
+ ({ theme, mode, children, }: CyturProviderProps): import("react/jsx-runtime").JSX.Element;
9
13
  displayName: string;
10
14
  };
@@ -0,0 +1,12 @@
1
+ export type TokenMap = Record<string, string>;
2
+ export declare const lightVars: TokenMap;
3
+ /**
4
+ * Dark mode tokens
5
+ * Figma "Button Token (Dark)" (3694:329)에서 추출한 값 + 도출된 base/text/border 값
6
+ *
7
+ * 주의: 다크 모드에서 action-primary가 teal → blue로 시프트됨 (Figma 디자인 결정).
8
+ * 추가 다크 스펙 (label/tag/etc) 받으면 여기 추가.
9
+ */
10
+ export declare const darkVars: TokenMap;
11
+ /** :root와 [data-mode="dark"] CSS 블록 생성 */
12
+ export declare const generateCss: (light: TokenMap, dark: TokenMap) => string;
@@ -0,0 +1,266 @@
1
+ export declare const tokens: {
2
+ /** Label / Badge */
3
+ readonly label: {
4
+ readonly default: {
5
+ readonly bg: {
6
+ readonly solid: string;
7
+ readonly subtle: string;
8
+ readonly border: string;
9
+ };
10
+ readonly text: {
11
+ readonly solid: string;
12
+ readonly subtle: string;
13
+ readonly border: string;
14
+ };
15
+ readonly border: string;
16
+ };
17
+ readonly primary: {
18
+ readonly bg: {
19
+ readonly solid: string;
20
+ readonly subtle: string;
21
+ readonly border: string;
22
+ };
23
+ readonly text: {
24
+ readonly solid: string;
25
+ readonly subtle: string;
26
+ readonly border: string;
27
+ };
28
+ readonly border: string;
29
+ };
30
+ readonly info: {
31
+ readonly bg: {
32
+ readonly solid: string;
33
+ readonly subtle: string;
34
+ readonly border: string;
35
+ };
36
+ readonly text: {
37
+ readonly solid: string;
38
+ readonly subtle: string;
39
+ readonly border: string;
40
+ };
41
+ readonly border: string;
42
+ };
43
+ readonly success: {
44
+ readonly bg: {
45
+ readonly solid: string;
46
+ readonly subtle: string;
47
+ readonly border: string;
48
+ };
49
+ readonly text: {
50
+ readonly solid: string;
51
+ readonly subtle: string;
52
+ readonly border: string;
53
+ };
54
+ readonly border: string;
55
+ };
56
+ readonly warning: {
57
+ readonly bg: {
58
+ readonly solid: string;
59
+ readonly subtle: string;
60
+ readonly border: string;
61
+ };
62
+ readonly text: {
63
+ readonly solid: string;
64
+ readonly subtle: string;
65
+ readonly border: string;
66
+ };
67
+ readonly border: string;
68
+ };
69
+ readonly danger: {
70
+ readonly bg: {
71
+ readonly solid: string;
72
+ readonly subtle: string;
73
+ readonly border: string;
74
+ };
75
+ readonly text: {
76
+ readonly solid: string;
77
+ readonly subtle: string;
78
+ readonly border: string;
79
+ };
80
+ readonly border: string;
81
+ };
82
+ };
83
+ /** Tag */
84
+ readonly tag: {
85
+ readonly default: {
86
+ readonly bg: {
87
+ readonly solid: string;
88
+ readonly solidHover: string;
89
+ readonly subtle: string;
90
+ readonly subtleHover: string;
91
+ readonly border: string;
92
+ readonly borderHover: string;
93
+ };
94
+ readonly text: {
95
+ readonly solid: string;
96
+ readonly subtle: string;
97
+ readonly border: string;
98
+ };
99
+ readonly border: string;
100
+ };
101
+ readonly primary: {
102
+ readonly bg: {
103
+ readonly solid: string;
104
+ readonly solidHover: string;
105
+ readonly subtle: string;
106
+ readonly subtleHover: string;
107
+ readonly border: string;
108
+ readonly borderHover: string;
109
+ };
110
+ readonly text: {
111
+ readonly solid: string;
112
+ readonly subtle: string;
113
+ readonly border: string;
114
+ };
115
+ readonly border: string;
116
+ };
117
+ readonly success: {
118
+ readonly bg: {
119
+ readonly solid: string;
120
+ readonly solidHover: string;
121
+ readonly subtle: string;
122
+ readonly subtleHover: string;
123
+ readonly border: string;
124
+ readonly borderHover: string;
125
+ };
126
+ readonly text: {
127
+ readonly solid: string;
128
+ readonly subtle: string;
129
+ readonly border: string;
130
+ };
131
+ readonly border: string;
132
+ };
133
+ readonly warning: {
134
+ readonly bg: {
135
+ readonly solid: string;
136
+ readonly solidHover: string;
137
+ readonly subtle: string;
138
+ readonly subtleHover: string;
139
+ readonly border: string;
140
+ readonly borderHover: string;
141
+ };
142
+ readonly text: {
143
+ readonly solid: string;
144
+ readonly subtle: string;
145
+ readonly border: string;
146
+ };
147
+ readonly border: string;
148
+ };
149
+ readonly danger: {
150
+ readonly bg: {
151
+ readonly solid: string;
152
+ readonly solidHover: string;
153
+ readonly subtle: string;
154
+ readonly subtleHover: string;
155
+ readonly border: string;
156
+ readonly borderHover: string;
157
+ };
158
+ readonly text: {
159
+ readonly solid: string;
160
+ readonly subtle: string;
161
+ readonly border: string;
162
+ };
163
+ readonly border: string;
164
+ };
165
+ };
166
+ /** Action */
167
+ readonly action: {
168
+ readonly primary: {
169
+ readonly default: string;
170
+ readonly hover: string;
171
+ readonly active: string;
172
+ };
173
+ readonly secondary: {
174
+ readonly default: string;
175
+ readonly hover: string;
176
+ readonly active: string;
177
+ };
178
+ readonly danger: {
179
+ readonly default: string;
180
+ readonly hover: string;
181
+ readonly active: string;
182
+ };
183
+ };
184
+ /** Background */
185
+ readonly bg: {
186
+ readonly surface: string;
187
+ readonly subtle: string;
188
+ readonly secondarySubtle: string;
189
+ readonly dangerSubtle: string;
190
+ };
191
+ /** Text */
192
+ readonly text: {
193
+ readonly primary: string;
194
+ readonly secondary: string;
195
+ readonly secondaryAction: string;
196
+ readonly primaryAction: string;
197
+ readonly muted: string;
198
+ readonly danger: string;
199
+ readonly inverse: string;
200
+ readonly disabled: string;
201
+ };
202
+ /** Border */
203
+ readonly border: {
204
+ readonly default: string;
205
+ readonly secondary: string;
206
+ readonly danger: string;
207
+ readonly focus: string;
208
+ };
209
+ /** Disabled */
210
+ readonly disabled: {
211
+ readonly bg: string;
212
+ readonly border: string;
213
+ readonly text: string;
214
+ };
215
+ /** Font (typography) */
216
+ readonly font: {
217
+ readonly size: {
218
+ readonly xs: string;
219
+ readonly sm: string;
220
+ readonly md: string;
221
+ readonly lg: string;
222
+ readonly xl: string;
223
+ };
224
+ readonly weight: {
225
+ readonly regular: string;
226
+ readonly medium: string;
227
+ readonly semibold: string;
228
+ readonly bold: string;
229
+ };
230
+ readonly lineHeight: {
231
+ readonly '16': string;
232
+ readonly '18': string;
233
+ readonly '20': string;
234
+ readonly '22': string;
235
+ readonly '24': string;
236
+ readonly '28': string;
237
+ readonly '32': string;
238
+ };
239
+ readonly letterSpacing: {
240
+ readonly tighter: string;
241
+ readonly tight: string;
242
+ readonly normal: string;
243
+ readonly wide: string;
244
+ };
245
+ };
246
+ /** Color scale */
247
+ readonly color: {
248
+ readonly gray: {
249
+ readonly 50: string;
250
+ readonly 100: string;
251
+ readonly 200: string;
252
+ readonly 300: string;
253
+ readonly 400: string;
254
+ readonly 500: string;
255
+ readonly 600: string;
256
+ readonly 700: string;
257
+ readonly 800: string;
258
+ readonly 900: string;
259
+ };
260
+ readonly yellow: {
261
+ readonly 50: string;
262
+ readonly 500: string;
263
+ };
264
+ };
265
+ };
266
+ export type CyturTokens = typeof tokens;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cytur-design-system",
3
- "version": "0.5.2",
3
+ "version": "0.6.0",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",
@@ -28,10 +28,13 @@
28
28
  "preview": "vite preview"
29
29
  },
30
30
  "peerDependencies": {
31
- "antd": ">=6",
32
31
  "react": ">=18",
33
32
  "react-dom": ">=18"
34
33
  },
34
+ "dependencies": {
35
+ "antd": "^6.3.6",
36
+ "@ant-design/icons": "^6.1.1"
37
+ },
35
38
  "devDependencies": {
36
39
  "@eslint/js": "^9.39.4",
37
40
  "@types/node": "^24.12.0",
@@ -46,7 +49,6 @@
46
49
  "react-dom": "^19.2.4",
47
50
  "typescript": "~5.9.3",
48
51
  "typescript-eslint": "^8.57.0",
49
- "vite": "^8.0.1",
50
- "antd": "^6.3.6"
52
+ "vite": "^8.0.1"
51
53
  }
52
54
  }