@antadesign/anta 0.2.0 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +40 -1
- package/dist/components/Button.js +6 -3
- package/dist/components/Progress.module.css +0 -5
- package/dist/components/Text.module.css +0 -6
- package/dist/components/Tooltip.d.ts +19 -9
- package/dist/components/Tooltip.js +2 -2
- package/dist/elements/a-button.css +1 -756
- package/dist/elements/a-icon.css +1 -43
- package/dist/elements/a-icon.shapes.css +1 -377
- package/dist/elements/a-icon.shapes.d.ts +2 -2
- package/dist/elements/a-icon.shapes.js +2 -2
- package/dist/elements/a-progress.css +1 -68
- package/dist/elements/a-tag.css +1 -196
- package/dist/elements/a-text.css +1 -90
- package/dist/elements/a-title.css +1 -64
- package/dist/elements/a-tooltip.css +1 -62
- package/dist/elements/a-tooltip.d.ts +25 -7
- package/dist/elements/a-tooltip.js +114 -69
- package/dist/general_types.d.ts +4 -4
- package/dist/index.d.ts +1 -0
- package/dist/jsx-runtime.d.ts +17 -15
- package/dist/reset.css +1 -209
- package/dist/tokens.css +1 -285
- package/package.json +6 -4
- package/dist/components/Button.module.css +0 -2
- package/dist/components/Menu.d.ts +0 -61
- package/dist/components/Menu.js +0 -34
- package/dist/components/MenuGroup.d.ts +0 -24
- package/dist/components/MenuGroup.js +0 -19
- package/dist/components/MenuItem.d.ts +0 -49
- package/dist/components/MenuItem.js +0 -40
- package/dist/components/MenuSeparator.d.ts +0 -14
- package/dist/components/MenuSeparator.js +0 -7
- package/dist/components/Sticker.d.ts +0 -31
- package/dist/components/Sticker.js +0 -17
- package/dist/components/StickerAnimated.d.ts +0 -23
- package/dist/components/StickerAnimated.js +0 -28
- package/dist/components/__generated__/stickers/angry-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/angry-animated.js +0 -7
- package/dist/components/__generated__/stickers/angry.d.ts +0 -3
- package/dist/components/__generated__/stickers/angry.js +0 -7
- package/dist/components/__generated__/stickers/ask-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/ask-animated.js +0 -7
- package/dist/components/__generated__/stickers/ask.d.ts +0 -3
- package/dist/components/__generated__/stickers/ask.js +0 -7
- package/dist/components/__generated__/stickers/balance-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/balance-animated.js +0 -7
- package/dist/components/__generated__/stickers/balance.d.ts +0 -3
- package/dist/components/__generated__/stickers/balance.js +0 -7
- package/dist/components/__generated__/stickers/butterfly-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/butterfly-animated.js +0 -7
- package/dist/components/__generated__/stickers/butterfly-snake-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/butterfly-snake-animated.js +0 -7
- package/dist/components/__generated__/stickers/butterfly-snake.d.ts +0 -3
- package/dist/components/__generated__/stickers/butterfly-snake.js +0 -7
- package/dist/components/__generated__/stickers/butterfly.d.ts +0 -3
- package/dist/components/__generated__/stickers/butterfly.js +0 -7
- package/dist/components/__generated__/stickers/catch-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/catch-animated.js +0 -7
- package/dist/components/__generated__/stickers/catch.d.ts +0 -3
- package/dist/components/__generated__/stickers/catch.js +0 -7
- package/dist/components/__generated__/stickers/clap-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/clap-animated.js +0 -7
- package/dist/components/__generated__/stickers/clap.d.ts +0 -3
- package/dist/components/__generated__/stickers/clap.js +0 -7
- package/dist/components/__generated__/stickers/coding-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/coding-animated.js +0 -7
- package/dist/components/__generated__/stickers/coding.d.ts +0 -3
- package/dist/components/__generated__/stickers/coding.js +0 -7
- package/dist/components/__generated__/stickers/cowboy-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/cowboy-animated.js +0 -7
- package/dist/components/__generated__/stickers/cowboy.d.ts +0 -3
- package/dist/components/__generated__/stickers/cowboy.js +0 -7
- package/dist/components/__generated__/stickers/dance-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/dance-animated.js +0 -7
- package/dist/components/__generated__/stickers/dance.d.ts +0 -3
- package/dist/components/__generated__/stickers/dance.js +0 -7
- package/dist/components/__generated__/stickers/detective-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/detective-animated.js +0 -7
- package/dist/components/__generated__/stickers/detective.d.ts +0 -3
- package/dist/components/__generated__/stickers/detective.js +0 -7
- package/dist/components/__generated__/stickers/disapprove-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/disapprove-animated.js +0 -7
- package/dist/components/__generated__/stickers/disapprove.d.ts +0 -3
- package/dist/components/__generated__/stickers/disapprove.js +0 -7
- package/dist/components/__generated__/stickers/distracted-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/distracted-animated.js +0 -7
- package/dist/components/__generated__/stickers/distracted.d.ts +0 -3
- package/dist/components/__generated__/stickers/distracted.js +0 -7
- package/dist/components/__generated__/stickers/dive-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/dive-animated.js +0 -7
- package/dist/components/__generated__/stickers/dive.d.ts +0 -3
- package/dist/components/__generated__/stickers/dive.js +0 -7
- package/dist/components/__generated__/stickers/eat-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/eat-animated.js +0 -7
- package/dist/components/__generated__/stickers/eat.d.ts +0 -3
- package/dist/components/__generated__/stickers/eat.js +0 -7
- package/dist/components/__generated__/stickers/facepalm-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/facepalm-animated.js +0 -7
- package/dist/components/__generated__/stickers/facepalm.d.ts +0 -3
- package/dist/components/__generated__/stickers/facepalm.js +0 -7
- package/dist/components/__generated__/stickers/failed-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/failed-animated.js +0 -7
- package/dist/components/__generated__/stickers/failed.d.ts +0 -3
- package/dist/components/__generated__/stickers/failed.js +0 -7
- package/dist/components/__generated__/stickers/found-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/found-animated.js +0 -7
- package/dist/components/__generated__/stickers/found.d.ts +0 -3
- package/dist/components/__generated__/stickers/found.js +0 -7
- package/dist/components/__generated__/stickers/grow-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/grow-animated.js +0 -7
- package/dist/components/__generated__/stickers/grow.d.ts +0 -3
- package/dist/components/__generated__/stickers/grow.js +0 -7
- package/dist/components/__generated__/stickers/handstand-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/handstand-animated.js +0 -7
- package/dist/components/__generated__/stickers/handstand.d.ts +0 -3
- package/dist/components/__generated__/stickers/handstand.js +0 -7
- package/dist/components/__generated__/stickers/heart-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/heart-animated.js +0 -7
- package/dist/components/__generated__/stickers/heart.d.ts +0 -3
- package/dist/components/__generated__/stickers/heart.js +0 -7
- package/dist/components/__generated__/stickers/hello-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/hello-animated.js +0 -7
- package/dist/components/__generated__/stickers/hello.d.ts +0 -3
- package/dist/components/__generated__/stickers/hello.js +0 -7
- package/dist/components/__generated__/stickers/idea-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/idea-animated.js +0 -7
- package/dist/components/__generated__/stickers/idea.d.ts +0 -3
- package/dist/components/__generated__/stickers/idea.js +0 -7
- package/dist/components/__generated__/stickers/index.d.ts +0 -99
- package/dist/components/__generated__/stickers/index.js +0 -198
- package/dist/components/__generated__/stickers/laugh-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/laugh-animated.js +0 -7
- package/dist/components/__generated__/stickers/laugh.d.ts +0 -3
- package/dist/components/__generated__/stickers/laugh.js +0 -7
- package/dist/components/__generated__/stickers/love-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/love-animated.js +0 -7
- package/dist/components/__generated__/stickers/love.d.ts +0 -3
- package/dist/components/__generated__/stickers/love.js +0 -7
- package/dist/components/__generated__/stickers/nap-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/nap-animated.js +0 -7
- package/dist/components/__generated__/stickers/nap.d.ts +0 -3
- package/dist/components/__generated__/stickers/nap.js +0 -7
- package/dist/components/__generated__/stickers/party-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/party-animated.js +0 -7
- package/dist/components/__generated__/stickers/party.d.ts +0 -3
- package/dist/components/__generated__/stickers/party.js +0 -7
- package/dist/components/__generated__/stickers/passed-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/passed-animated.js +0 -7
- package/dist/components/__generated__/stickers/passed.d.ts +0 -3
- package/dist/components/__generated__/stickers/passed.js +0 -7
- package/dist/components/__generated__/stickers/peekaboo-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/peekaboo-animated.js +0 -7
- package/dist/components/__generated__/stickers/peekaboo.d.ts +0 -3
- package/dist/components/__generated__/stickers/peekaboo.js +0 -7
- package/dist/components/__generated__/stickers/pizza-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/pizza-animated.js +0 -7
- package/dist/components/__generated__/stickers/pizza.d.ts +0 -3
- package/dist/components/__generated__/stickers/pizza.js +0 -7
- package/dist/components/__generated__/stickers/puzzle-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/puzzle-animated.js +0 -7
- package/dist/components/__generated__/stickers/puzzle.d.ts +0 -3
- package/dist/components/__generated__/stickers/puzzle.js +0 -7
- package/dist/components/__generated__/stickers/sad-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/sad-animated.js +0 -7
- package/dist/components/__generated__/stickers/sad.d.ts +0 -3
- package/dist/components/__generated__/stickers/sad.js +0 -7
- package/dist/components/__generated__/stickers/scared-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/scared-animated.js +0 -7
- package/dist/components/__generated__/stickers/scared.d.ts +0 -3
- package/dist/components/__generated__/stickers/scared.js +0 -7
- package/dist/components/__generated__/stickers/scroll-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/scroll-animated.js +0 -7
- package/dist/components/__generated__/stickers/scroll.d.ts +0 -3
- package/dist/components/__generated__/stickers/scroll.js +0 -7
- package/dist/components/__generated__/stickers/search-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/search-animated.js +0 -7
- package/dist/components/__generated__/stickers/search.d.ts +0 -3
- package/dist/components/__generated__/stickers/search.js +0 -7
- package/dist/components/__generated__/stickers/shield-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/shield-animated.js +0 -7
- package/dist/components/__generated__/stickers/shield.d.ts +0 -3
- package/dist/components/__generated__/stickers/shield.js +0 -7
- package/dist/components/__generated__/stickers/shocked-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/shocked-animated.js +0 -7
- package/dist/components/__generated__/stickers/shocked.d.ts +0 -3
- package/dist/components/__generated__/stickers/shocked.js +0 -7
- package/dist/components/__generated__/stickers/sleep-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/sleep-animated.js +0 -7
- package/dist/components/__generated__/stickers/sleep.d.ts +0 -3
- package/dist/components/__generated__/stickers/sleep.js +0 -7
- package/dist/components/__generated__/stickers/stressed-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/stressed-animated.js +0 -7
- package/dist/components/__generated__/stickers/stressed.d.ts +0 -3
- package/dist/components/__generated__/stickers/stressed.js +0 -7
- package/dist/components/__generated__/stickers/suspicious-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/suspicious-animated.js +0 -7
- package/dist/components/__generated__/stickers/suspicious.d.ts +0 -3
- package/dist/components/__generated__/stickers/suspicious.js +0 -7
- package/dist/components/__generated__/stickers/thanks-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/thanks-animated.js +0 -7
- package/dist/components/__generated__/stickers/thanks.d.ts +0 -3
- package/dist/components/__generated__/stickers/thanks.js +0 -7
- package/dist/components/__generated__/stickers/think-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/think-animated.js +0 -7
- package/dist/components/__generated__/stickers/think-of-you-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/think-of-you-animated.js +0 -7
- package/dist/components/__generated__/stickers/think-of-you.d.ts +0 -3
- package/dist/components/__generated__/stickers/think-of-you.js +0 -7
- package/dist/components/__generated__/stickers/think.d.ts +0 -3
- package/dist/components/__generated__/stickers/think.js +0 -7
- package/dist/components/__generated__/stickers/thumbs-up-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/thumbs-up-animated.js +0 -7
- package/dist/components/__generated__/stickers/thumbs-up.d.ts +0 -3
- package/dist/components/__generated__/stickers/thumbs-up.js +0 -7
- package/dist/components/__generated__/stickers/vacation-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/vacation-animated.js +0 -7
- package/dist/components/__generated__/stickers/vacation.d.ts +0 -3
- package/dist/components/__generated__/stickers/vacation.js +0 -7
- package/dist/components/__generated__/stickers/wait-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/wait-animated.js +0 -7
- package/dist/components/__generated__/stickers/wait.d.ts +0 -3
- package/dist/components/__generated__/stickers/wait.js +0 -7
- package/dist/components/__generated__/stickers/wink-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/wink-animated.js +0 -7
- package/dist/components/__generated__/stickers/wink.d.ts +0 -3
- package/dist/components/__generated__/stickers/wink.js +0 -7
- package/dist/components/__generated__/stickers/work-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/work-animated.js +0 -7
- package/dist/components/__generated__/stickers/work.d.ts +0 -3
- package/dist/components/__generated__/stickers/work.js +0 -7
- package/dist/components/__generated__/stickers/zen-animated.d.ts +0 -3
- package/dist/components/__generated__/stickers/zen-animated.js +0 -7
- package/dist/components/__generated__/stickers/zen.d.ts +0 -3
- package/dist/components/__generated__/stickers/zen.js +0 -7
- package/dist/elements/a-menu-group.css +0 -21
- package/dist/elements/a-menu-group.d.ts +0 -13
- package/dist/elements/a-menu-group.js +0 -15
- package/dist/elements/a-menu-item.css +0 -162
- package/dist/elements/a-menu-item.d.ts +0 -27
- package/dist/elements/a-menu-item.js +0 -29
- package/dist/elements/a-menu-separator.css +0 -15
- package/dist/elements/a-menu-separator.d.ts +0 -12
- package/dist/elements/a-menu-separator.js +0 -15
- package/dist/elements/a-menu.css +0 -34
- package/dist/elements/a-menu.d.ts +0 -120
- package/dist/elements/a-menu.js +0 -649
- package/dist/elements/a-sticker-animated.css +0 -9
- package/dist/elements/a-sticker-animated.d.ts +0 -39
- package/dist/elements/a-sticker-animated.js +0 -81
- package/dist/elements/a-sticker.css +0 -9
- package/dist/elements/a-sticker.d.ts +0 -19
- package/dist/elements/a-sticker.js +0 -32
- package/dist/generate-stickers.mjs +0 -293
package/dist/tokens.css
CHANGED
|
@@ -1,285 +1 @@
|
|
|
1
|
-
|
|
2
|
-
`base` is below — typically used by resets like Tailwind's
|
|
3
|
-
preflight (`@layer base`) — so Anta's reset + element styles
|
|
4
|
-
beat resets but lose to a consumer's own `@layer components`
|
|
5
|
-
rules. `utilities` sits above everything so utility-class
|
|
6
|
-
frameworks like Tailwind (`@layer utilities`) can still
|
|
7
|
-
override single properties when needed. Consumers who load
|
|
8
|
-
their own layer-order declaration earlier in the cascade
|
|
9
|
-
override this one — first mention of each layer name wins. */
|
|
10
|
-
@layer base, anta, components, utilities;
|
|
11
|
-
|
|
12
|
-
:root, .light {
|
|
13
|
-
--sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
|
14
|
-
--monospace: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
|
|
15
|
-
|
|
16
|
-
font-size: 15px;
|
|
17
|
-
font-weight: 400;
|
|
18
|
-
font-feature-settings: 'ss02' on, 'ss05' on;
|
|
19
|
-
|
|
20
|
-
/* Colors imported from Figma library "Anta 0.2" → "Dynamic colors" collection.
|
|
21
|
-
See FIGMA.md for the full extraction procedure (figma.variables Plugin
|
|
22
|
-
API + alias resolution). */
|
|
23
|
-
|
|
24
|
-
/* Backgrounds — light, neutral. Numeric elevation scale: 1 = deepest /
|
|
25
|
-
recessed (was bg-section), 5 = most raised (was bg-spot). */
|
|
26
|
-
--bg-1: #ffffff;
|
|
27
|
-
--bg-2: #fbfafb;
|
|
28
|
-
--bg-3: #f6f4f6;
|
|
29
|
-
--bg-4: #f1eff1;
|
|
30
|
-
--bg-5: #ece9ec;
|
|
31
|
-
|
|
32
|
-
/* Backgrounds — light, Brand (no --bg-1-brand; bg-1 is neutral-only) */
|
|
33
|
-
--bg-2-brand: #fcfcfe;
|
|
34
|
-
--bg-3-brand: #f7f6fd;
|
|
35
|
-
--bg-4-brand: #efeefc;
|
|
36
|
-
--bg-5-brand: #e9e5fa;
|
|
37
|
-
|
|
38
|
-
/* Backgrounds — light, Success */
|
|
39
|
-
--bg-2-success: #f7fcf9;
|
|
40
|
-
--bg-3-success: #ecf9f0;
|
|
41
|
-
--bg-4-success: #e2f5e8;
|
|
42
|
-
--bg-5-success: #d9f2e0;
|
|
43
|
-
|
|
44
|
-
/* Backgrounds — light, Critical */
|
|
45
|
-
--bg-2-critical: #fefbfb;
|
|
46
|
-
--bg-3-critical: #fdf2f2;
|
|
47
|
-
--bg-4-critical: #fcebeb;
|
|
48
|
-
--bg-5-critical: #fae5e5;
|
|
49
|
-
|
|
50
|
-
/* Backgrounds — light, Warning */
|
|
51
|
-
--bg-2-warning: #fefbf6;
|
|
52
|
-
--bg-3-warning: #fcf4e8;
|
|
53
|
-
--bg-4-warning: #fbeeda;
|
|
54
|
-
--bg-5-warning: #f9e7cd;
|
|
55
|
-
|
|
56
|
-
/* Backgrounds — light, Info */
|
|
57
|
-
--bg-2-info: #fbfcfe;
|
|
58
|
-
--bg-3-info: #f2f7fd;
|
|
59
|
-
--bg-4-info: #e9f3fb;
|
|
60
|
-
--bg-5-info: #e1eefa;
|
|
61
|
-
|
|
62
|
-
/* Text — light, neutral */
|
|
63
|
-
--text-1: #050306;
|
|
64
|
-
--text-2: #302b31;
|
|
65
|
-
--text-3: #635b65;
|
|
66
|
-
--text-4: #878089;
|
|
67
|
-
--text-5: #9f99a1;
|
|
68
|
-
|
|
69
|
-
/* Text — light, Brand */
|
|
70
|
-
--text-1-brand: #2e1e7b;
|
|
71
|
-
--text-2-brand: #483493;
|
|
72
|
-
--text-3-brand: #483493cc;
|
|
73
|
-
--text-4-brand: #48349399;
|
|
74
|
-
--text-5-brand: #48349366;
|
|
75
|
-
|
|
76
|
-
/* Text — light, Success */
|
|
77
|
-
--text-1-success: #004618;
|
|
78
|
-
--text-2-success: #1f5c31;
|
|
79
|
-
--text-3-success: #1f5c31cc;
|
|
80
|
-
--text-4-success: #1f5c3199;
|
|
81
|
-
--text-5-success: #1f5c3166;
|
|
82
|
-
|
|
83
|
-
/* Text — light, Critical */
|
|
84
|
-
--text-1-critical: #8f1014;
|
|
85
|
-
--text-2-critical: #a01c1c;
|
|
86
|
-
--text-3-critical: #a01c1ccc;
|
|
87
|
-
--text-4-critical: #a01c1c99;
|
|
88
|
-
--text-5-critical: #a01c1c66;
|
|
89
|
-
|
|
90
|
-
/* Text — light, Warning */
|
|
91
|
-
--text-1-warning: #7f410b;
|
|
92
|
-
--text-2-warning: #995200;
|
|
93
|
-
--text-3-warning: #995200cc;
|
|
94
|
-
--text-4-warning: #99520099;
|
|
95
|
-
--text-5-warning: #99520066;
|
|
96
|
-
|
|
97
|
-
/* Text — light, Info */
|
|
98
|
-
--text-1-info: #003969;
|
|
99
|
-
--text-2-info: #175082;
|
|
100
|
-
--text-3-info: #175082cc;
|
|
101
|
-
--text-4-info: #175082b2;
|
|
102
|
-
--text-5-info: #17508280;
|
|
103
|
-
|
|
104
|
-
/* Borders — light, neutral */
|
|
105
|
-
--border-1: #938d96;
|
|
106
|
-
--border-2: #c1b9c1;
|
|
107
|
-
--border-3: #d4ced4;
|
|
108
|
-
--border-4: #e0dce0;
|
|
109
|
-
--border-5: #ece9ec;
|
|
110
|
-
|
|
111
|
-
/* Borders — light, Brand */
|
|
112
|
-
--border-1-brand: #9081df;
|
|
113
|
-
--border-2-brand: #bcb1f1;
|
|
114
|
-
--border-3-brand: #d2cbf6;
|
|
115
|
-
--border-4-brand: #ddd8f8;
|
|
116
|
-
--border-5-brand: #e9e5fa;
|
|
117
|
-
|
|
118
|
-
/* Borders — light, Success */
|
|
119
|
-
--border-1-success: #44c169;
|
|
120
|
-
--border-2-success: #88d7a0;
|
|
121
|
-
--border-3-success: #b3e5c2;
|
|
122
|
-
--border-4-success: #c6ecd1;
|
|
123
|
-
--border-5-success: #d9f2e0;
|
|
124
|
-
|
|
125
|
-
/* Borders — light, Critical */
|
|
126
|
-
--border-1-critical: #e56c6c;
|
|
127
|
-
--border-2-critical: #efa4a4;
|
|
128
|
-
--border-3-critical: #f4c2c2;
|
|
129
|
-
--border-4-critical: #f7d4d4;
|
|
130
|
-
--border-5-critical: #fae5e5;
|
|
131
|
-
|
|
132
|
-
/* Borders — light, Warning */
|
|
133
|
-
--border-1-warning: #d88118;
|
|
134
|
-
--border-2-warning: #edb25a;
|
|
135
|
-
--border-3-warning: #f3cc91;
|
|
136
|
-
--border-4-warning: #f6dbb1;
|
|
137
|
-
--border-5-warning: #f9e7cd;
|
|
138
|
-
|
|
139
|
-
/* Borders — light, Info */
|
|
140
|
-
--border-1-info: #56a1e1;
|
|
141
|
-
--border-2-info: #93c5ec;
|
|
142
|
-
--border-3-info: #bad6f3;
|
|
143
|
-
--border-4-info: #cfe3f7;
|
|
144
|
-
--border-5-info: #e1eefa;
|
|
145
|
-
|
|
146
|
-
/* Prose link colors — used by <a-text> for priorities 1 & 2 and by
|
|
147
|
-
consumers wiring their own prose contexts. */
|
|
148
|
-
--link-color: #1466d4;
|
|
149
|
-
--link-color-hover: #2674e6;
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
.dark {
|
|
154
|
-
font-weight: 400;
|
|
155
|
-
|
|
156
|
-
/* Backgrounds — dark, neutral. Numeric elevation scale: 1 = deepest /
|
|
157
|
-
recessed (was bg-section), 5 = most raised (was bg-spot). */
|
|
158
|
-
--bg-1: #000000;
|
|
159
|
-
--bg-2: #0e0d0f;
|
|
160
|
-
--bg-3: #121014;
|
|
161
|
-
--bg-4: #161316;
|
|
162
|
-
--bg-5: #1a171b;
|
|
163
|
-
|
|
164
|
-
/* Backgrounds — dark, tinted. The Anta 0.2 values,
|
|
165
|
-
each a touch deeper for dark mode. (No --bg-1-tone; bg-1 is neutral-only.) */
|
|
166
|
-
|
|
167
|
-
/* Backgrounds — dark, Brand */
|
|
168
|
-
--bg-2-brand: #08060e;
|
|
169
|
-
--bg-3-brand: #0f0c1d;
|
|
170
|
-
--bg-4-brand: #130f24;
|
|
171
|
-
--bg-5-brand: #16132b;
|
|
172
|
-
|
|
173
|
-
/* Backgrounds — dark, Success */
|
|
174
|
-
--bg-2-success: #030b06;
|
|
175
|
-
--bg-3-success: #051209;
|
|
176
|
-
--bg-4-success: #06160b;
|
|
177
|
-
--bg-5-success: #081b0e;
|
|
178
|
-
|
|
179
|
-
/* Backgrounds — dark, Critical */
|
|
180
|
-
--bg-2-critical: #120303;
|
|
181
|
-
--bg-3-critical: #210606;
|
|
182
|
-
--bg-4-critical: #260808;
|
|
183
|
-
--bg-5-critical: #2e0a0b;
|
|
184
|
-
|
|
185
|
-
/* Backgrounds — dark, Warning */
|
|
186
|
-
--bg-2-warning: #110a03;
|
|
187
|
-
--bg-3-warning: #1c1105;
|
|
188
|
-
--bg-4-warning: #231406;
|
|
189
|
-
--bg-5-warning: #2b1a08;
|
|
190
|
-
|
|
191
|
-
/* Backgrounds — dark, Info */
|
|
192
|
-
--bg-2-info: #020a12;
|
|
193
|
-
--bg-3-info: #05131f;
|
|
194
|
-
--bg-4-info: #071725;
|
|
195
|
-
--bg-5-info: #0c2337;
|
|
196
|
-
|
|
197
|
-
/* Text — dark, neutral */
|
|
198
|
-
--text-1: #ece9ec;
|
|
199
|
-
--text-2: #c1b9c1;
|
|
200
|
-
--text-3: #9f99a1;
|
|
201
|
-
--text-4: #776e77;
|
|
202
|
-
--text-5: #635b65;
|
|
203
|
-
|
|
204
|
-
/* Text — dark, Brand */
|
|
205
|
-
--text-1-brand: #c5baff;
|
|
206
|
-
--text-2-brand: #ada0ee;
|
|
207
|
-
--text-3-brand: #ada0eecc;
|
|
208
|
-
--text-4-brand: #ada0ee99;
|
|
209
|
-
--text-5-brand: #ada0ee66;
|
|
210
|
-
|
|
211
|
-
/* Text — dark, Success */
|
|
212
|
-
--text-1-success: #9ddeb1;
|
|
213
|
-
--text-2-success: #74cd8e;
|
|
214
|
-
--text-3-success: #74cd8ecc;
|
|
215
|
-
--text-4-success: #74cd8e99;
|
|
216
|
-
--text-5-success: #74cd8e66;
|
|
217
|
-
|
|
218
|
-
/* Text — dark, Critical */
|
|
219
|
-
--text-1-critical: #ffabac;
|
|
220
|
-
--text-2-critical: #e78e90;
|
|
221
|
-
--text-3-critical: #e78e90cc;
|
|
222
|
-
--text-4-critical: #e78e9099;
|
|
223
|
-
--text-5-critical: #e78e9066;
|
|
224
|
-
|
|
225
|
-
/* Text — dark, Warning */
|
|
226
|
-
--text-1-warning: #f0bf75;
|
|
227
|
-
--text-2-warning: #e1a452;
|
|
228
|
-
--text-3-warning: #e1a452cc;
|
|
229
|
-
--text-4-warning: #e1a45299;
|
|
230
|
-
--text-5-warning: #e1a45266;
|
|
231
|
-
|
|
232
|
-
/* Text — dark, Info */
|
|
233
|
-
--text-1-info: #9ed2ff;
|
|
234
|
-
--text-2-info: #7db6e8;
|
|
235
|
-
--text-3-info: #7db6e8cc;
|
|
236
|
-
--text-4-info: #7db6e899;
|
|
237
|
-
--text-5-info: #7db6e866;
|
|
238
|
-
|
|
239
|
-
/* Borders — dark, neutral */
|
|
240
|
-
--border-1: hsl(288deg 5.21% 42%);
|
|
241
|
-
--border-2: hsl(282deg 7.04% 28%);
|
|
242
|
-
--border-3: hsl(277.5deg 6.56% 20%);
|
|
243
|
-
--border-4: hsl(290deg 6.52% 13%);
|
|
244
|
-
--border-5: hsl(285deg 7.14% 10%);
|
|
245
|
-
|
|
246
|
-
/* Borders — dark, Brand */
|
|
247
|
-
--border-1-brand: hsl(250.08deg 59.8% 58%);
|
|
248
|
-
--border-2-brand: hsl(250deg 50% 42%);
|
|
249
|
-
--border-3-brand: hsl(252.63deg 47.74% 30%);
|
|
250
|
-
--border-4-brand: hsl(249.8deg 39.84% 19%);
|
|
251
|
-
--border-5-brand: hsl(249deg 39.22% 14%);
|
|
252
|
-
|
|
253
|
-
/* Borders — dark, Success */
|
|
254
|
-
--border-1-success: hsl(138.18deg 49.75% 29%);
|
|
255
|
-
--border-2-success: hsl(138.26deg 50.36% 20%);
|
|
256
|
-
--border-3-success: hsl(137.7deg 49.59% 16%);
|
|
257
|
-
--border-4-success: hsl(138.46deg 52% 10%);
|
|
258
|
-
--border-5-success: hsl(138.86deg 53.85% 7.5%);
|
|
259
|
-
|
|
260
|
-
/* Borders — dark, Critical */
|
|
261
|
-
--border-1-critical: hsl(0deg 56% 46%);
|
|
262
|
-
--border-2-critical: hsl(0.42deg 63% 30%);
|
|
263
|
-
--border-3-critical: hsl(0deg 62.21% 23%);
|
|
264
|
-
--border-4-critical: hsl(359.13deg 59% 15%);
|
|
265
|
-
--border-5-critical: hsl(359.06deg 63% 11%);
|
|
266
|
-
|
|
267
|
-
/* Borders — dark, Warning */
|
|
268
|
-
--border-1-warning: hsl(32.13deg 80.31% 34%);
|
|
269
|
-
--border-2-warning: hsl(27.93deg 84.06% 24%);
|
|
270
|
-
--border-3-warning: hsl(30deg 79.66% 17%);
|
|
271
|
-
--border-4-warning: hsl(28.75deg 63.16% 12%);
|
|
272
|
-
--border-5-warning: hsl(28.64deg 66.67% 9%);
|
|
273
|
-
|
|
274
|
-
/* Borders — dark, Info */
|
|
275
|
-
--border-1-info: hsl(207.82deg 70.2% 40%);
|
|
276
|
-
--border-2-info: hsl(207.77deg 69.94% 29%);
|
|
277
|
-
--border-3-info: hsl(208.04deg 69.93% 21%);
|
|
278
|
-
--border-4-info: hsl(208.52deg 62.89% 14%);
|
|
279
|
-
--border-5-info: hsl(207.78deg 65.85% 10.5%);
|
|
280
|
-
|
|
281
|
-
/* Prose link colors — dark mode */
|
|
282
|
-
--link-color: #7baee9;
|
|
283
|
-
--link-color-hover: #90bdee;
|
|
284
|
-
}
|
|
285
|
-
|
|
1
|
+
@layer base,anta,components,utilities;:root,.light{--sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--monospace: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", monospace;font-size:15px;font-weight:400;font-feature-settings:"ss02" on,"ss05" on;--bg-1: #ffffff;--bg-2: #fbfafb;--bg-3: #f6f4f6;--bg-4: #f1eff1;--bg-5: #ece9ec;--bg-2-brand: #fcfcfe;--bg-3-brand: #f7f6fd;--bg-4-brand: #efeefc;--bg-5-brand: #e9e5fa;--bg-2-success: #f7fcf9;--bg-3-success: #ecf9f0;--bg-4-success: #e2f5e8;--bg-5-success: #d9f2e0;--bg-2-critical: #fefbfb;--bg-3-critical: #fdf2f2;--bg-4-critical: #fcebeb;--bg-5-critical: #fae5e5;--bg-2-warning: #fefbf6;--bg-3-warning: #fcf4e8;--bg-4-warning: #fbeeda;--bg-5-warning: #f9e7cd;--bg-2-info: #fbfcfe;--bg-3-info: #f2f7fd;--bg-4-info: #e9f3fb;--bg-5-info: #e1eefa;--text-1: #050306;--text-2: #302b31;--text-3: #635b65;--text-4: #878089;--text-5: #9f99a1;--text-1-brand: #2e1e7b;--text-2-brand: #483493;--text-3-brand: #483493cc;--text-4-brand: #48349399;--text-5-brand: #48349366;--text-1-success: #004618;--text-2-success: #1f5c31;--text-3-success: #1f5c31cc;--text-4-success: #1f5c3199;--text-5-success: #1f5c3166;--text-1-critical: #8f1014;--text-2-critical: #a01c1c;--text-3-critical: #a01c1ccc;--text-4-critical: #a01c1c99;--text-5-critical: #a01c1c66;--text-1-warning: #7f410b;--text-2-warning: #995200;--text-3-warning: #995200cc;--text-4-warning: #99520099;--text-5-warning: #99520066;--text-1-info: #003969;--text-2-info: #175082;--text-3-info: #175082cc;--text-4-info: #175082b2;--text-5-info: #17508280;--border-1: #938d96;--border-2: #c1b9c1;--border-3: #d4ced4;--border-4: #e0dce0;--border-5: #ece9ec;--border-1-brand: #9081df;--border-2-brand: #bcb1f1;--border-3-brand: #d2cbf6;--border-4-brand: #ddd8f8;--border-5-brand: #e9e5fa;--border-1-success: #44c169;--border-2-success: #88d7a0;--border-3-success: #b3e5c2;--border-4-success: #c6ecd1;--border-5-success: #d9f2e0;--border-1-critical: #e56c6c;--border-2-critical: #efa4a4;--border-3-critical: #f4c2c2;--border-4-critical: #f7d4d4;--border-5-critical: #fae5e5;--border-1-warning: #d88118;--border-2-warning: #edb25a;--border-3-warning: #f3cc91;--border-4-warning: #f6dbb1;--border-5-warning: #f9e7cd;--border-1-info: #56a1e1;--border-2-info: #93c5ec;--border-3-info: #bad6f3;--border-4-info: #cfe3f7;--border-5-info: #e1eefa;--link-color: #1466d4;--link-color-hover: #2674e6}.dark{font-weight:400;--bg-1: #000000;--bg-2: #0e0d0f;--bg-3: #121014;--bg-4: #161316;--bg-5: #1a171b;--bg-2-brand: #08060e;--bg-3-brand: #0f0c1d;--bg-4-brand: #130f24;--bg-5-brand: #16132b;--bg-2-success: #030b06;--bg-3-success: #051209;--bg-4-success: #06160b;--bg-5-success: #081b0e;--bg-2-critical: #120303;--bg-3-critical: #210606;--bg-4-critical: #260808;--bg-5-critical: #2e0a0b;--bg-2-warning: #110a03;--bg-3-warning: #1c1105;--bg-4-warning: #231406;--bg-5-warning: #2b1a08;--bg-2-info: #020a12;--bg-3-info: #05131f;--bg-4-info: #071725;--bg-5-info: #0c2337;--text-1: #ece9ec;--text-2: #c1b9c1;--text-3: #9f99a1;--text-4: #776e77;--text-5: #635b65;--text-1-brand: #c5baff;--text-2-brand: #ada0ee;--text-3-brand: #ada0eecc;--text-4-brand: #ada0ee99;--text-5-brand: #ada0ee66;--text-1-success: #9ddeb1;--text-2-success: #74cd8e;--text-3-success: #74cd8ecc;--text-4-success: #74cd8e99;--text-5-success: #74cd8e66;--text-1-critical: #ffabac;--text-2-critical: #e78e90;--text-3-critical: #e78e90cc;--text-4-critical: #e78e9099;--text-5-critical: #e78e9066;--text-1-warning: #f0bf75;--text-2-warning: #e1a452;--text-3-warning: #e1a452cc;--text-4-warning: #e1a45299;--text-5-warning: #e1a45266;--text-1-info: #9ed2ff;--text-2-info: #7db6e8;--text-3-info: #7db6e8cc;--text-4-info: #7db6e899;--text-5-info: #7db6e866;--border-1: hsl(288deg 5.21% 42%);--border-2: hsl(282deg 7.04% 28%);--border-3: hsl(277.5deg 6.56% 20%);--border-4: hsl(290deg 6.52% 13%);--border-5: hsl(285deg 7.14% 10%);--border-1-brand: hsl(250.08deg 59.8% 58%);--border-2-brand: hsl(250deg 50% 42%);--border-3-brand: hsl(252.63deg 47.74% 30%);--border-4-brand: hsl(249.8deg 39.84% 19%);--border-5-brand: hsl(249deg 39.22% 14%);--border-1-success: hsl(138.18deg 49.75% 29%);--border-2-success: hsl(138.26deg 50.36% 20%);--border-3-success: hsl(137.7deg 49.59% 16%);--border-4-success: hsl(138.46deg 52% 10%);--border-5-success: hsl(138.86deg 53.85% 7.5%);--border-1-critical: hsl(0deg 56% 46%);--border-2-critical: hsl(.42deg 63% 30%);--border-3-critical: hsl(0deg 62.21% 23%);--border-4-critical: hsl(359.13deg 59% 15%);--border-5-critical: hsl(359.06deg 63% 11%);--border-1-warning: hsl(32.13deg 80.31% 34%);--border-2-warning: hsl(27.93deg 84.06% 24%);--border-3-warning: hsl(30deg 79.66% 17%);--border-4-warning: hsl(28.75deg 63.16% 12%);--border-5-warning: hsl(28.64deg 66.67% 9%);--border-1-info: hsl(207.82deg 70.2% 40%);--border-2-info: hsl(207.77deg 69.94% 29%);--border-3-info: hsl(208.04deg 69.93% 21%);--border-4-info: hsl(208.52deg 62.89% 14%);--border-5-info: hsl(207.78deg 65.85% 10.5%);--link-color: #7baee9;--link-color-hover: #90bdee}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@antadesign/anta",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -44,10 +44,12 @@
|
|
|
44
44
|
},
|
|
45
45
|
"scripts": {
|
|
46
46
|
"build": "pnpm run build:js && pnpm run build:css && pnpm run build:types",
|
|
47
|
-
"build:
|
|
47
|
+
"build:dev": "pnpm run build:js && pnpm run build:css:dev && pnpm run build:types",
|
|
48
|
+
"build:css": "esbuild $(find src -name '*.css') --minify --loader:.module.css=css --outdir=dist --outbase=src && cp scripts/generate-icons.mjs dist/",
|
|
49
|
+
"build:css:dev": "find src -name '*.css' | while IFS= read -r f; do d=\"dist/${f#src/}\"; mkdir -p \"$(dirname \"$d\")\"; cp \"$f\" \"$d\"; done && cp scripts/generate-icons.mjs dist/",
|
|
48
50
|
"build:js": "esbuild $(find src \\( -name '*.ts' -o -name '*.tsx' \\) ! -name '*.d.ts') --outdir=dist --outbase=src --jsx=automatic --jsx-import-source=@antadesign/anta --format=esm --target=ES2022 --loader:.module.css=local-css --loader:.css=global-css",
|
|
49
51
|
"build:types": "tsc -p src/tsconfig.json",
|
|
50
|
-
"dev": "echo $$ > .dev.pid; trap 'rm -f .dev.pid' EXIT; nodemon -w src -w stickers/src -e ts,tsx,css -x 'pnpm run build && pnpm --filter @antadesign/stickers run build && pnpm --filter anta-site run docs' & pnpm --filter anta-site run dev & wait",
|
|
52
|
+
"dev": "echo $$ > .dev.pid; trap 'rm -f .dev.pid' EXIT; nodemon -w src -w stickers/src -e ts,tsx,css -x 'pnpm run build:dev && pnpm --filter @antadesign/stickers run build:dev && pnpm --filter anta-site run docs' & pnpm --filter anta-site run dev & wait",
|
|
51
53
|
"stop": "node scripts/dev-stop.mjs",
|
|
52
54
|
"typecheck": "tsc --noEmit -p src/tsconfig.json",
|
|
53
55
|
"icons": "node scripts/generate-icons.mjs --input src/elements/icons --output src/elements --name a-icon.shapes --internal",
|
|
@@ -63,7 +65,7 @@
|
|
|
63
65
|
},
|
|
64
66
|
"dependencies": {
|
|
65
67
|
"clsx": "^2.1.0",
|
|
66
|
-
"es-toolkit": "
|
|
68
|
+
"es-toolkit": "1.47.0"
|
|
67
69
|
},
|
|
68
70
|
"peerDependencies": {
|
|
69
71
|
"react": "^18.0.0 || ^19.0.0"
|
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
import type { BaseProps } from '../general_types';
|
|
2
|
-
export interface MenuProps extends BaseProps {
|
|
3
|
-
/** Preferred placement relative to the trigger. The cross-axis suffix
|
|
4
|
-
* (`-start` / `-end`) aligns the left / right edges; the menu auto-flips
|
|
5
|
-
* vertically and clamps horizontally when there isn't room.
|
|
6
|
-
* @defaultValue bottom-start */
|
|
7
|
-
placement?: 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end';
|
|
8
|
-
/** Open on right-click (the `contextmenu` event) of the trigger region
|
|
9
|
-
* instead of a left click, positioned at the pointer. */
|
|
10
|
-
context?: boolean;
|
|
11
|
-
/** Open at the pointer coordinates rather than aligned to the trigger box.
|
|
12
|
-
* Pairs naturally with `context`; on its own it positions a left-click
|
|
13
|
-
* menu at the cursor. */
|
|
14
|
-
coord?: boolean;
|
|
15
|
-
/** Marks this menu as a submenu of the enclosing `MenuItem`. Set by passing
|
|
16
|
-
* it as a `MenuItem`'s `submenu`; rarely written by hand. */
|
|
17
|
-
submenu?: boolean;
|
|
18
|
-
/** For a submenu: also open it on hover (with intent timing), not only on
|
|
19
|
-
* click. No effect on a root menu. */
|
|
20
|
-
hover?: boolean;
|
|
21
|
-
/** Gap in pixels between the trigger and the menu.
|
|
22
|
-
* @defaultValue 4 */
|
|
23
|
-
offset?: number;
|
|
24
|
-
/** Controlled open state. Omit for the default **uncontrolled** menu (it
|
|
25
|
-
* opens/closes itself). Pass `'opened'` / `'closed'` to **control** it: the
|
|
26
|
-
* menu's visibility follows this value, and user dismiss (Esc, outside-click,
|
|
27
|
-
* select) fires `openchange` *without* self-closing — you update `state` in
|
|
28
|
-
* response. A string (not a boolean) so there's no `"false"`-as-truthy
|
|
29
|
-
* footgun. Submenus are always uncontrolled regardless of this. */
|
|
30
|
-
state?: 'opened' | 'closed';
|
|
31
|
-
/** The menu's contents: `MenuItem`, `MenuSeparator`, `MenuGroup`, or any
|
|
32
|
-
* custom element. */
|
|
33
|
-
children?: React.ReactNode;
|
|
34
|
-
}
|
|
35
|
-
/**
|
|
36
|
-
* Menu — a dropdown / context menu that anchors to any target and "just
|
|
37
|
-
* works". Place `<Menu>` immediately after the trigger element (a button,
|
|
38
|
-
* say); it opens on click by default. For a whole-area right-click menu, put
|
|
39
|
-
* it after the region and pass `context`.
|
|
40
|
-
*
|
|
41
|
-
* Open state is uncontrolled by default — listen for the `openchange` event
|
|
42
|
-
* (`detail: { open, previousState }`) to observe it, or pass `state` to control
|
|
43
|
-
* it. You can also grab a `ref` and call `.open()` / `.close()` / `.toggle()`.
|
|
44
|
-
* Selecting a `MenuItem` closes the menu;
|
|
45
|
-
* arbitrary injected content does not. Add `data-menu-open` to any item /
|
|
46
|
-
* container to keep it open, or `data-menu-close` to a custom element to let it
|
|
47
|
-
* close.
|
|
48
|
-
*
|
|
49
|
-
* Requires `@antadesign/anta/elements` to be imported (client-side only).
|
|
50
|
-
*
|
|
51
|
-
* @example Dropdown from a button
|
|
52
|
-
* ```tsx
|
|
53
|
-
* <a-button>Actions</a-button>
|
|
54
|
-
* <Menu>
|
|
55
|
-
* <MenuItem icon="edit" label="Edit" kbd="⌘E" onSelect={onEdit} />
|
|
56
|
-
* <MenuSeparator />
|
|
57
|
-
* <MenuItem tone="critical" icon="trash" label="Delete" onSelect={onDelete} />
|
|
58
|
-
* </Menu>
|
|
59
|
-
* ```
|
|
60
|
-
*/
|
|
61
|
-
export declare const Menu: ({ placement, context, coord, submenu, hover, offset, state, className, children, ...rest }: MenuProps) => any;
|
package/dist/components/Menu.js
DELETED
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import { jsx } from "@antadesign/anta/jsx-runtime";
|
|
2
|
-
const Menu = ({
|
|
3
|
-
placement,
|
|
4
|
-
context,
|
|
5
|
-
coord,
|
|
6
|
-
submenu,
|
|
7
|
-
hover,
|
|
8
|
-
offset,
|
|
9
|
-
state,
|
|
10
|
-
className,
|
|
11
|
-
children,
|
|
12
|
-
...rest
|
|
13
|
-
}) => {
|
|
14
|
-
return /* @__PURE__ */ jsx(
|
|
15
|
-
"a-menu",
|
|
16
|
-
{
|
|
17
|
-
placement: placement && placement !== "bottom-start" ? placement : void 0,
|
|
18
|
-
context: context ? "" : void 0,
|
|
19
|
-
coord: coord ? "" : void 0,
|
|
20
|
-
submenu: submenu ? "" : void 0,
|
|
21
|
-
hover: hover ? "" : void 0,
|
|
22
|
-
offset: offset != null ? String(offset) : void 0,
|
|
23
|
-
state,
|
|
24
|
-
role: "menu",
|
|
25
|
-
"aria-orientation": "vertical",
|
|
26
|
-
class: className,
|
|
27
|
-
...rest,
|
|
28
|
-
children
|
|
29
|
-
}
|
|
30
|
-
);
|
|
31
|
-
};
|
|
32
|
-
export {
|
|
33
|
-
Menu
|
|
34
|
-
};
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import type { BaseProps } from '../general_types';
|
|
2
|
-
export interface MenuGroupProps extends BaseProps {
|
|
3
|
-
/** The section heading shown above the grouped items (also the group's
|
|
4
|
-
* accessible name). */
|
|
5
|
-
label?: string;
|
|
6
|
-
/** The grouped `MenuItem`s. */
|
|
7
|
-
children?: React.ReactNode;
|
|
8
|
-
}
|
|
9
|
-
/**
|
|
10
|
-
* MenuGroup — a titled section that organises related `MenuItem`s. Keyboard
|
|
11
|
-
* navigation flattens items across groups, skipping the heading.
|
|
12
|
-
*
|
|
13
|
-
* Add `data-menu-open` to keep the menu open after any item in the group is
|
|
14
|
-
* chosen (it forwards to the element).
|
|
15
|
-
*
|
|
16
|
-
* @example
|
|
17
|
-
* ```tsx
|
|
18
|
-
* <MenuGroup label="Edit">
|
|
19
|
-
* <MenuItem icon="copy" label="Copy" />
|
|
20
|
-
* <MenuItem icon="cut" label="Cut" />
|
|
21
|
-
* </MenuGroup>
|
|
22
|
-
* ```
|
|
23
|
-
*/
|
|
24
|
-
export declare const MenuGroup: ({ label, className, children, ...rest }: MenuGroupProps) => any;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "@antadesign/anta/jsx-runtime";
|
|
2
|
-
const MenuGroup = ({ label, className, children, ...rest }) => {
|
|
3
|
-
return /* @__PURE__ */ jsxs(
|
|
4
|
-
"a-menu-group",
|
|
5
|
-
{
|
|
6
|
-
role: "group",
|
|
7
|
-
"aria-label": label,
|
|
8
|
-
class: className,
|
|
9
|
-
...rest,
|
|
10
|
-
children: [
|
|
11
|
-
label != null && /* @__PURE__ */ jsx("a-menu-group-label", { "aria-hidden": "true", children: label }),
|
|
12
|
-
children
|
|
13
|
-
]
|
|
14
|
-
}
|
|
15
|
-
);
|
|
16
|
-
};
|
|
17
|
-
export {
|
|
18
|
-
MenuGroup
|
|
19
|
-
};
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
import type { BaseProps } from '../general_types';
|
|
2
|
-
import type { IconShape } from '../elements/a-icon.shapes';
|
|
3
|
-
export interface MenuItemProps extends BaseProps {
|
|
4
|
-
/** Leading icon shape. */
|
|
5
|
-
icon?: IconShape;
|
|
6
|
-
/** The item's text. Omit and pass `children` for richer content. */
|
|
7
|
-
label?: string;
|
|
8
|
-
/** A trailing keyboard-shortcut hint, e.g. `"⌘E"`. */
|
|
9
|
-
kbd?: string;
|
|
10
|
-
/** A trailing icon (ignored when `submenu` is set — the chevron takes its
|
|
11
|
-
* place). */
|
|
12
|
-
iconTrailing?: IconShape;
|
|
13
|
-
/** Disable the item: greyed out, not focusable for activation, no close. */
|
|
14
|
-
disabled?: boolean;
|
|
15
|
-
/** Semantic tone — colors the label, icon, and hover tint. `critical` is the
|
|
16
|
-
* destructive action; `neutral` (the default) is the standard gray.
|
|
17
|
-
* @defaultValue neutral */
|
|
18
|
-
tone?: 'neutral' | 'brand' | 'info' | 'success' | 'warning' | 'critical';
|
|
19
|
-
/** Marks this item as a submenu parent: adds the trailing chevron and
|
|
20
|
-
* `aria-haspopup`. Nest the flyout as a `<Menu submenu>` child. */
|
|
21
|
-
submenu?: boolean;
|
|
22
|
-
/** Convenience activation handler — fires on click / Enter / Space unless
|
|
23
|
-
* the item is disabled. (Mapped to the underlying click.) */
|
|
24
|
-
onSelect?: (e: any) => void;
|
|
25
|
-
/** Item content. With `label` set, children are extra content — most
|
|
26
|
-
* notably the nested `<Menu submenu>` for a submenu parent. */
|
|
27
|
-
children?: React.ReactNode;
|
|
28
|
-
}
|
|
29
|
-
/**
|
|
30
|
-
* MenuItem — a single selectable row inside a `Menu`. Composes a leading
|
|
31
|
-
* `icon`, a `label` (or `children`), an optional trailing `kbd` hint, and an
|
|
32
|
-
* optional trailing icon. For a submenu, set `submenu` and nest a
|
|
33
|
-
* `<Menu submenu>` as a child — a chevron is added automatically.
|
|
34
|
-
*
|
|
35
|
-
* Selecting an item closes the menu; add `data-menu-open` to keep it open
|
|
36
|
-
* (toggles / multi-select) — it forwards to the element.
|
|
37
|
-
*
|
|
38
|
-
* @example
|
|
39
|
-
* ```tsx
|
|
40
|
-
* <MenuItem icon="copy" label="Duplicate" kbd="⌘D" onSelect={dup} />
|
|
41
|
-
* <MenuItem label="Word wrap" data-menu-open onSelect={toggleWrap} />
|
|
42
|
-
* <MenuItem label="Share" submenu>
|
|
43
|
-
* <Menu submenu hover>
|
|
44
|
-
* <MenuItem label="Copy link" onSelect={copyLink} />
|
|
45
|
-
* </Menu>
|
|
46
|
-
* </MenuItem>
|
|
47
|
-
* ```
|
|
48
|
-
*/
|
|
49
|
-
export declare const MenuItem: ({ icon, label, kbd, iconTrailing, disabled, tone, submenu, onSelect, className, children, ...rest }: MenuItemProps) => any;
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "@antadesign/anta/jsx-runtime";
|
|
2
|
-
const MenuItem = ({
|
|
3
|
-
icon,
|
|
4
|
-
label,
|
|
5
|
-
kbd,
|
|
6
|
-
iconTrailing,
|
|
7
|
-
disabled,
|
|
8
|
-
tone,
|
|
9
|
-
submenu,
|
|
10
|
-
onSelect,
|
|
11
|
-
className,
|
|
12
|
-
children,
|
|
13
|
-
...rest
|
|
14
|
-
}) => {
|
|
15
|
-
return /* @__PURE__ */ jsxs(
|
|
16
|
-
"a-menu-item",
|
|
17
|
-
{
|
|
18
|
-
role: "menuitem",
|
|
19
|
-
tabIndex: 0,
|
|
20
|
-
disabled: disabled ? "" : void 0,
|
|
21
|
-
tone: tone && tone !== "neutral" ? tone : void 0,
|
|
22
|
-
submenu: submenu ? "" : void 0,
|
|
23
|
-
"aria-haspopup": submenu ? "menu" : void 0,
|
|
24
|
-
"aria-disabled": disabled ? "true" : void 0,
|
|
25
|
-
onClick: disabled ? void 0 : onSelect,
|
|
26
|
-
class: className,
|
|
27
|
-
...rest,
|
|
28
|
-
children: [
|
|
29
|
-
icon && /* @__PURE__ */ jsx("a-icon", { shape: icon, "aria-hidden": "true" }),
|
|
30
|
-
label != null && /* @__PURE__ */ jsx("a-menu-item-label", { children: label }),
|
|
31
|
-
kbd && /* @__PURE__ */ jsx("kbd", { children: kbd }),
|
|
32
|
-
submenu ? /* @__PURE__ */ jsx("a-icon", { shape: "chevron-right", "aria-hidden": "true" }) : iconTrailing && /* @__PURE__ */ jsx("a-icon", { shape: iconTrailing, "aria-hidden": "true" }),
|
|
33
|
-
children
|
|
34
|
-
]
|
|
35
|
-
}
|
|
36
|
-
);
|
|
37
|
-
};
|
|
38
|
-
export {
|
|
39
|
-
MenuItem
|
|
40
|
-
};
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import type { BaseProps } from '../general_types';
|
|
2
|
-
export interface MenuSeparatorProps extends BaseProps {
|
|
3
|
-
}
|
|
4
|
-
/**
|
|
5
|
-
* MenuSeparator — a thin divider between groups of `MenuItem`s.
|
|
6
|
-
*
|
|
7
|
-
* @example
|
|
8
|
-
* ```tsx
|
|
9
|
-
* <MenuItem label="Edit" />
|
|
10
|
-
* <MenuSeparator />
|
|
11
|
-
* <MenuItem tone="critical" label="Delete" />
|
|
12
|
-
* ```
|
|
13
|
-
*/
|
|
14
|
-
export declare const MenuSeparator: ({ className, ...rest }: MenuSeparatorProps) => any;
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import type { BaseProps } from "../general_types";
|
|
2
|
-
/** Base public props for stickers — shared by both static and animated.
|
|
3
|
-
* Inherits `className` and `style` from `BaseProps`. The animated
|
|
4
|
-
* variant (`StickerAnimated`) extends this with `paused`. */
|
|
5
|
-
export interface StickerProps extends Omit<BaseProps, "children"> {
|
|
6
|
-
/** Edge length in pixels. Stickers are always square. Defaults to 256. */
|
|
7
|
-
size?: number;
|
|
8
|
-
label?: string;
|
|
9
|
-
}
|
|
10
|
-
/** ARIA attribute shape applied to sticker hosts — either meaningful
|
|
11
|
-
* (`role="img"` + `aria-label`) or decorative (`aria-hidden="true"`). */
|
|
12
|
-
export type StickerA11y = {
|
|
13
|
-
role?: string;
|
|
14
|
-
"aria-label"?: string;
|
|
15
|
-
"aria-hidden"?: "true";
|
|
16
|
-
};
|
|
17
|
-
/** Internal — supplied by the generated per-sticker module; the bound
|
|
18
|
-
* SVG markup is the per-sticker payload. */
|
|
19
|
-
interface StickerInternalProps extends StickerProps {
|
|
20
|
-
svg: string;
|
|
21
|
-
}
|
|
22
|
-
/**
|
|
23
|
-
* Internal renderer for static stickers. Generated `Sticker{Name}`
|
|
24
|
-
* exports under `@antadesign/anta/stickers` call this with their bound
|
|
25
|
-
* inline SVG markup. The `<a-sticker>` element renders the SVG into
|
|
26
|
-
* its shadow DOM; sizing is composed into the host's inline `style` as
|
|
27
|
-
* `--sticker-size` (the element doesn't mutate its own host — see the
|
|
28
|
-
* declarative-DOM rule in CLAUDE.md).
|
|
29
|
-
*/
|
|
30
|
-
export declare const Sticker: ({ svg, size, label, ...rest }: StickerInternalProps) => any;
|
|
31
|
-
export {};
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { jsx } from "@antadesign/anta/jsx-runtime";
|
|
2
|
-
const Sticker = ({
|
|
3
|
-
svg,
|
|
4
|
-
size,
|
|
5
|
-
label,
|
|
6
|
-
...rest
|
|
7
|
-
}) => {
|
|
8
|
-
const a11y = label != null ? { role: "img", "aria-label": label } : { "aria-hidden": "true" };
|
|
9
|
-
const style = size != null ? {
|
|
10
|
-
...rest.style,
|
|
11
|
-
["--sticker-size"]: `${size}px`
|
|
12
|
-
} : rest.style;
|
|
13
|
-
return /* @__PURE__ */ jsx("a-sticker", { svg, ...a11y, ...rest, style });
|
|
14
|
-
};
|
|
15
|
-
export {
|
|
16
|
-
Sticker
|
|
17
|
-
};
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import type { StickerProps } from "./Sticker";
|
|
2
|
-
/** Public props for animated stickers — extends `StickerProps` with
|
|
3
|
-
* `paused`. The static `Sticker` variant doesn't accept `paused`. */
|
|
4
|
-
export interface StickerAnimatedProps extends StickerProps {
|
|
5
|
-
/** `true` freezes the animation at the current frame; a number freezes
|
|
6
|
-
* at that time in seconds; omit (or `false`) to play. */
|
|
7
|
-
paused?: boolean | number;
|
|
8
|
-
}
|
|
9
|
-
/** Internal — the bound Lottie animation is supplied by the generated
|
|
10
|
-
* per-sticker module as a JSON string. The element parses it once on
|
|
11
|
-
* attribute set. */
|
|
12
|
-
interface StickerAnimatedInternalProps extends StickerAnimatedProps {
|
|
13
|
-
animation: string;
|
|
14
|
-
}
|
|
15
|
-
/**
|
|
16
|
-
* Internal renderer for animated stickers. Generated
|
|
17
|
-
* `Sticker{Name}Animated` exports under `@antadesign/anta/stickers`
|
|
18
|
-
* call this with their bound Lottie JSON string. The
|
|
19
|
-
* `<a-sticker-animated>` element receives it as an attribute, parses
|
|
20
|
-
* it once, and drives a shadow-DOM canvas via dotLottie.
|
|
21
|
-
*/
|
|
22
|
-
export declare const StickerAnimated: ({ animation, size, paused, label, ...rest }: StickerAnimatedInternalProps) => any;
|
|
23
|
-
export {};
|