@nsaa/core 0.1.0-alpha.1 → 0.1.0-alpha.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/dist/accordion/accordion.d.ts +7 -0
- package/dist/accordion/accordion.js +54 -0
- package/dist/accordion/index.d.ts +3 -0
- package/dist/alert/alert.d.ts +18 -0
- package/dist/alert/alert.js +53 -0
- package/dist/alert/index.d.ts +3 -0
- package/dist/alert-dialog/alert-dialog.d.ts +19 -0
- package/dist/alert-dialog/alert-dialog.js +100 -0
- package/dist/alert-dialog/index.d.ts +3 -0
- package/dist/avatar/avatar.d.ts +12 -0
- package/dist/avatar/avatar.js +50 -0
- package/dist/avatar/index.d.ts +3 -0
- package/dist/badge/badge.d.ts +8 -0
- package/dist/badge/badge.js +29 -0
- package/dist/badge/index.d.ts +3 -0
- package/dist/button/button.d.ts +25 -0
- package/dist/button/button.js +136 -0
- package/dist/button/index.d.ts +3 -0
- package/dist/calendar/calendar.d.ts +11 -0
- package/dist/calendar/calendar.js +131 -0
- package/dist/calendar/index.d.ts +3 -0
- package/dist/card/card.d.ts +12 -0
- package/dist/card/card.js +55 -0
- package/dist/card/index.d.ts +3 -0
- package/dist/checkbox/checkbox.d.ts +4 -0
- package/dist/checkbox/checkbox.js +35 -0
- package/dist/checkbox/index.d.ts +3 -0
- package/dist/collapsible/collapsible.d.ts +6 -0
- package/dist/collapsible/collapsible.js +24 -0
- package/dist/collapsible/index.d.ts +3 -0
- package/dist/combobox/combobox.d.ts +27 -0
- package/dist/combobox/combobox.js +226 -0
- package/dist/combobox/index.d.ts +3 -0
- package/dist/command/command.d.ts +20 -0
- package/dist/command/command.js +116 -0
- package/dist/command/index.d.ts +3 -0
- package/dist/context-menu/context-menu.d.ts +30 -0
- package/dist/context-menu/context-menu.js +173 -0
- package/dist/context-menu/index.d.ts +3 -0
- package/dist/dialog/dialog.d.ts +18 -0
- package/dist/dialog/dialog.js +106 -0
- package/dist/dialog/index.d.ts +3 -0
- package/dist/direction.d.ts +3 -0
- package/dist/direction.js +2 -0
- package/dist/drawer/drawer.d.ts +17 -0
- package/dist/drawer/drawer.js +136 -0
- package/dist/drawer/index.d.ts +3 -0
- package/dist/dropdown-menu/dropdown-menu.d.ts +30 -0
- package/dist/dropdown-menu/dropdown-menu.js +177 -0
- package/dist/dropdown-menu/index.d.ts +3 -0
- package/dist/empty/empty.d.ts +35 -0
- package/dist/empty/empty.js +93 -0
- package/dist/empty/index.d.ts +3 -0
- package/dist/field/field.d.ts +26 -0
- package/dist/field/field.js +109 -0
- package/dist/field/index.d.ts +3 -0
- package/dist/index.d.ts +89 -674
- package/dist/index.js +48 -3876
- package/dist/input/index.d.ts +3 -0
- package/dist/input/input.d.ts +4 -0
- package/dist/input/input.js +14 -0
- package/dist/input-group/index.d.ts +3 -0
- package/dist/input-group/input-group.d.ts +19 -0
- package/dist/input-group/input-group.js +78 -0
- package/dist/input-otp/index.d.ts +3 -0
- package/dist/input-otp/input-otp.d.ts +12 -0
- package/dist/input-otp/input-otp.js +73 -0
- package/dist/kbd/index.d.ts +3 -0
- package/dist/kbd/kbd.d.ts +5 -0
- package/dist/kbd/kbd.js +19 -0
- package/dist/label/index.d.ts +3 -0
- package/dist/label/label.d.ts +4 -0
- package/dist/label/label.js +13 -0
- package/dist/legacy/icon-button/icon-swap.js +58 -0
- package/dist/lib/cn.d.ts +3 -0
- package/dist/{cn-DxFBFdwT.js → lib/cn.js} +1 -1
- package/dist/lib/control-defaults.js +8 -0
- package/dist/lib/icon-swap.d.ts +15 -0
- package/dist/lib/icon-swap.js +26 -0
- package/dist/lib/input-modality.js +39 -0
- package/dist/lib/merge-refs.js +21 -0
- package/dist/lib/shortcut.js +50 -0
- package/dist/lib/track-input-modality.d.ts +2 -0
- package/dist/lib/track-input-modality.js +4 -0
- package/dist/lib/tv.js +7 -0
- package/dist/lib/use-press.js +48 -0
- package/dist/lib/user-action.js +13 -0
- package/dist/loaders/arc.d.ts +6 -0
- package/dist/loaders/arc.js +31 -0
- package/dist/loaders/atom.d.ts +5 -0
- package/dist/loaders/atom.js +70 -0
- package/dist/loaders/blocks.d.ts +8 -0
- package/dist/loaders/blocks.js +74 -0
- package/dist/loaders/bouncing-dots.d.ts +3 -0
- package/dist/loaders/bouncing-dots.js +45 -0
- package/dist/loaders/cap.d.ts +6 -0
- package/dist/loaders/cap.js +7 -0
- package/dist/loaders/cascade.d.ts +5 -0
- package/dist/loaders/cascade.js +50 -0
- package/dist/loaders/circular-dots.d.ts +3 -0
- package/dist/loaders/circular-dots.js +40 -0
- package/dist/loaders/classic-v2.d.ts +3 -0
- package/dist/loaders/classic-v2.js +41 -0
- package/dist/loaders/classic.d.ts +3 -0
- package/dist/loaders/classic.js +48 -0
- package/dist/loaders/clock.d.ts +5 -0
- package/dist/loaders/clock.js +31 -0
- package/dist/loaders/comet.d.ts +5 -0
- package/dist/loaders/comet.js +52 -0
- package/dist/loaders/compass.d.ts +3 -0
- package/dist/loaders/compass.js +39 -0
- package/dist/loaders/dual.d.ts +6 -0
- package/dist/loaders/dual.js +47 -0
- package/dist/loaders/easing.d.ts +6 -0
- package/dist/loaders/easing.js +34 -0
- package/dist/loaders/eclipse.d.ts +3 -0
- package/dist/loaders/eclipse.js +69 -0
- package/dist/loaders/fade.js +28 -0
- package/dist/loaders/flip.d.ts +3 -0
- package/dist/loaders/flip.js +41 -0
- package/dist/{frame-CK9IBOZB.js → loaders/frame.js} +2 -50
- package/dist/loaders/gather.d.ts +3 -0
- package/dist/loaders/gather.js +85 -0
- package/dist/loaders/leap.d.ts +3 -0
- package/dist/loaders/leap.js +67 -0
- package/dist/loaders/linear-dots.d.ts +3 -0
- package/dist/loaders/linear-dots.js +54 -0
- package/dist/loaders/loading.d.ts +3 -0
- package/dist/loaders/loading.js +64 -0
- package/dist/loaders/morph.d.ts +3 -0
- package/dist/loaders/morph.js +40 -0
- package/dist/loaders/motion.d.ts +35 -0
- package/dist/loaders/motion.js +51 -0
- package/dist/loaders/orbit.d.ts +5 -0
- package/dist/loaders/orbit.js +44 -0
- package/dist/loaders/pulse.d.ts +3 -0
- package/dist/loaders/pulse.js +52 -0
- package/dist/loaders/radar.d.ts +5 -0
- package/dist/loaders/radar.js +64 -0
- package/dist/loaders/ring.d.ts +6 -0
- package/dist/loaders/ring.js +38 -0
- package/dist/loaders/ripple.d.ts +8 -0
- package/dist/loaders/ripple.js +57 -0
- package/dist/loaders/slide.d.ts +3 -0
- package/dist/loaders/slide.js +74 -0
- package/dist/loaders/snake.d.ts +6 -0
- package/dist/loaders/snake.js +59 -0
- package/dist/loaders/spinners.d.ts +61 -0
- package/dist/loaders/spinners.js +63 -0
- package/dist/loaders/swirl.d.ts +3 -0
- package/dist/loaders/swirl.js +50 -0
- package/dist/loaders/text/shared.js +25 -0
- package/dist/loaders/text/text-loaders.d.ts +48 -0
- package/dist/loaders/text/text-loaders.js +723 -0
- package/dist/loaders/trace.d.ts +6 -0
- package/dist/loaders/trace.js +46 -0
- package/dist/loaders/types.d.ts +10 -0
- package/dist/loaders/wave.d.ts +8 -0
- package/dist/loaders/wave.js +59 -0
- package/dist/loaders-text.d.ts +2 -47
- package/dist/loaders-text.js +1 -743
- package/dist/loaders.d.ts +36 -132
- package/dist/loaders.js +35 -1096
- package/dist/native-select/index.d.ts +3 -0
- package/dist/native-select/native-select.d.ts +9 -0
- package/dist/native-select/native-select.js +44 -0
- package/dist/pagination/index.d.ts +3 -0
- package/dist/pagination/pagination.d.ts +18 -0
- package/dist/pagination/pagination.js +134 -0
- package/dist/popover/index.d.ts +3 -0
- package/dist/popover/popover.d.ts +10 -0
- package/dist/popover/popover.js +54 -0
- package/dist/radio-group/index.d.ts +3 -0
- package/dist/radio-group/radio-group.d.ts +6 -0
- package/dist/radio-group/radio-group.js +33 -0
- package/dist/select/index.d.ts +3 -0
- package/dist/select/select.d.ts +16 -0
- package/dist/select/select.js +148 -0
- package/dist/separator/index.d.ts +3 -0
- package/dist/separator/separator.d.ts +4 -0
- package/dist/separator/separator.js +15 -0
- package/dist/skeleton/index.d.ts +3 -0
- package/dist/skeleton/skeleton.d.ts +10 -0
- package/dist/skeleton/skeleton.js +24 -0
- package/dist/slider/index.d.ts +3 -0
- package/dist/slider/slider.d.ts +4 -0
- package/dist/slider/slider.js +39 -0
- package/dist/sound/sound-map.d.ts +70 -0
- package/dist/sound/sound-map.js +72 -0
- package/dist/sound/sound.d.ts +38 -0
- package/dist/sound/sound.js +136 -0
- package/dist/sound/uisfx.d.ts +37 -0
- package/dist/sound/uisfx.js +59 -0
- package/dist/sound-uisfx.d.ts +2 -37
- package/dist/sound-uisfx.js +1 -58
- package/dist/spinner/index.d.ts +5 -0
- package/dist/spinner/loader-provider.d.ts +16 -0
- package/dist/spinner/loader-provider.js +28 -0
- package/dist/spinner/registry.d.ts +9 -0
- package/dist/spinner/registry.js +15 -0
- package/dist/spinner/spinner.d.ts +26 -0
- package/dist/spinner/spinner.js +143 -0
- package/dist/switch/index.d.ts +3 -0
- package/dist/switch/switch.d.ts +6 -0
- package/dist/switch/switch.js +25 -0
- package/dist/table/index.d.ts +3 -0
- package/dist/table/table.d.ts +17 -0
- package/dist/table/table.js +66 -0
- package/dist/tabs/index.d.ts +3 -0
- package/dist/tabs/tabs.d.ts +11 -0
- package/dist/tabs/tabs.js +46 -0
- package/dist/textarea/index.d.ts +3 -0
- package/dist/textarea/textarea.d.ts +4 -0
- package/dist/textarea/textarea.js +12 -0
- package/dist/toast/index.d.ts +3 -0
- package/dist/toast/toast.d.ts +17 -0
- package/dist/toast/toast.js +211 -0
- package/dist/toggle-group/index.d.ts +3 -0
- package/dist/toggle-group/toggle-group.d.ts +64 -0
- package/dist/toggle-group/toggle-group.js +95 -0
- package/dist/tokens/dist/motion.d.ts +24 -0
- package/dist/{motion-NQq2BA78.js → tokens/dist/motion.js} +1 -1
- package/dist/toolbar/index.d.ts +3 -0
- package/dist/toolbar/overflow.d.ts +4 -0
- package/dist/toolbar/overflow.js +242 -0
- package/dist/toolbar/toolbar-item.d.ts +29 -0
- package/dist/toolbar/toolbar-item.js +71 -0
- package/dist/toolbar/toolbar.d.ts +73 -0
- package/dist/toolbar/toolbar.js +250 -0
- package/dist/tooltip/index.d.ts +3 -0
- package/dist/tooltip/tooltip.d.ts +7 -0
- package/dist/tooltip/tooltip.js +41 -0
- package/package.json +4 -3
- package/dist/registry-2PyPW9Xw.js +0 -390
- package/dist/registry-DjfWNw3R.d.ts +0 -18
- package/dist/sound-DiYNAnR_.d.ts +0 -61
|
@@ -1,390 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { a as spinnerRoot, d as STEP_VAR, f as animation, i as reducedMotion, l as SIZE, n as SpinnerStyle, o as step, p as stagger } from "./frame-CK9IBOZB.js";
|
|
3
|
-
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
-
// src/loaders/cap.ts
|
|
5
|
-
const DEFAULT_CAP = "round";
|
|
6
|
-
function linecap(cap = DEFAULT_CAP) {
|
|
7
|
-
return cap === "flat" ? "butt" : "round";
|
|
8
|
-
}
|
|
9
|
-
// src/loaders/easing.ts
|
|
10
|
-
const DEFAULT_EASING = "linear";
|
|
11
|
-
function spinClass(name, easing = DEFAULT_EASING) {
|
|
12
|
-
const base = `nsaa-loader-${name}-spin`;
|
|
13
|
-
return easing === "linear" ? base : `${base} ${base}-${easing}`;
|
|
14
|
-
}
|
|
15
|
-
const ROTATE = `to {
|
|
16
|
-
transform: rotate(360deg);
|
|
17
|
-
}`;
|
|
18
|
-
function rotationCss(name, turn = ROTATE) {
|
|
19
|
-
return `
|
|
20
|
-
.nsaa-loader-${name}-spin {
|
|
21
|
-
transform-origin: center;
|
|
22
|
-
${animation(name, `nsaa-loader-${name}-rotate`, "linear")}
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
.nsaa-loader-${name}-spin-ease-in-out {
|
|
26
|
-
animation-timing-function: ease-in-out;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
.nsaa-loader-${name}-spin-stacked {
|
|
30
|
-
animation-name: nsaa-loader-${name}-rotate, nsaa-loader-${name}-rotate;
|
|
31
|
-
animation-timing-function: linear, ease-in-out;
|
|
32
|
-
animation-composition: add;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
@keyframes nsaa-loader-${name}-rotate {
|
|
36
|
-
${turn}
|
|
37
|
-
}
|
|
38
|
-
`;
|
|
39
|
-
}
|
|
40
|
-
// src/loaders/arc.tsx
|
|
41
|
-
const css$7 = `
|
|
42
|
-
${rotationCss("arc")}
|
|
43
|
-
`;
|
|
44
|
-
function Arc({ cap, easing, ...rest }) {
|
|
45
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
|
|
46
|
-
name: "arc",
|
|
47
|
-
children: css$7
|
|
48
|
-
}), /* @__PURE__ */ jsx("svg", {
|
|
49
|
-
...spinnerRoot("arc", rest),
|
|
50
|
-
fill: "none",
|
|
51
|
-
role: "presentation",
|
|
52
|
-
viewBox: "0 0 24 24",
|
|
53
|
-
children: /* @__PURE__ */ jsx("circle", {
|
|
54
|
-
className: spinClass("arc", easing),
|
|
55
|
-
cx: "12",
|
|
56
|
-
cy: "12",
|
|
57
|
-
r: "10",
|
|
58
|
-
stroke: "currentColor",
|
|
59
|
-
strokeDasharray: "18 44.8",
|
|
60
|
-
strokeLinecap: linecap(cap),
|
|
61
|
-
strokeWidth: "2.5"
|
|
62
|
-
})
|
|
63
|
-
})] });
|
|
64
|
-
}
|
|
65
|
-
// src/loaders/bouncing-dots.tsx
|
|
66
|
-
const DOTS$1 = Array.from({ length: 3 }, (_, index) => index);
|
|
67
|
-
const css$6 = `
|
|
68
|
-
.nsaa-loader-bouncing-dots {
|
|
69
|
-
display: flex;
|
|
70
|
-
align-items: center;
|
|
71
|
-
gap: calc(${SIZE} * 0.2);
|
|
72
|
-
width: auto;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.nsaa-loader-bouncing-dots-dot {
|
|
76
|
-
width: calc(${SIZE} * 0.25);
|
|
77
|
-
height: calc(${SIZE} * 0.25);
|
|
78
|
-
background: currentColor;
|
|
79
|
-
border-radius: 9999px;
|
|
80
|
-
${animation("bouncing-dots", "nsaa-loader-bouncing-dots-bounce", "ease-in-out alternate")}
|
|
81
|
-
animation-delay: ${stagger("bouncing-dots", DOTS$1.length)};
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
@keyframes nsaa-loader-bouncing-dots-bounce {
|
|
85
|
-
from {
|
|
86
|
-
transform: translateY(28%);
|
|
87
|
-
}
|
|
88
|
-
to {
|
|
89
|
-
transform: translateY(-72%);
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
`;
|
|
93
|
-
function BouncingDots(props) {
|
|
94
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
|
|
95
|
-
name: "bouncing-dots",
|
|
96
|
-
children: css$6
|
|
97
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
98
|
-
...spinnerRoot("bouncing-dots", props),
|
|
99
|
-
children: DOTS$1.map((dot) => /* @__PURE__ */ jsx("div", {
|
|
100
|
-
className: "nsaa-loader-bouncing-dots-dot",
|
|
101
|
-
style: step(dot)
|
|
102
|
-
}, dot))
|
|
103
|
-
})] });
|
|
104
|
-
}
|
|
105
|
-
// src/loaders/fade.ts
|
|
106
|
-
function fadeCss(name, element, count, { dim, rest }) {
|
|
107
|
-
return `
|
|
108
|
-
.nsaa-loader-${name}-${element} {
|
|
109
|
-
${animation(name, `nsaa-loader-${name}-fade`, "linear")}
|
|
110
|
-
animation-delay: ${stagger(name, count)};
|
|
111
|
-
}
|
|
112
|
-
|
|
113
|
-
@keyframes nsaa-loader-${name}-fade {
|
|
114
|
-
from {
|
|
115
|
-
opacity: 1;
|
|
116
|
-
}
|
|
117
|
-
to {
|
|
118
|
-
opacity: ${dim};
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
${reducedMotion(`
|
|
123
|
-
.nsaa-loader-${name}-${element} {
|
|
124
|
-
opacity: ${rest};
|
|
125
|
-
}
|
|
126
|
-
`)}
|
|
127
|
-
`;
|
|
128
|
-
}
|
|
129
|
-
// src/loaders/circular-dots.tsx
|
|
130
|
-
const DOTS = [
|
|
131
|
-
[8, 1.5],
|
|
132
|
-
[12.5962, 3.4038],
|
|
133
|
-
[14.5, 8],
|
|
134
|
-
[12.5962, 12.5962],
|
|
135
|
-
[8, 14.5],
|
|
136
|
-
[3.4038, 12.5962],
|
|
137
|
-
[1.5, 8],
|
|
138
|
-
[3.4038, 3.4038]
|
|
139
|
-
];
|
|
140
|
-
const css$5 = `
|
|
141
|
-
${fadeCss("circular-dots", "dot", DOTS.length, {
|
|
142
|
-
dim: .2,
|
|
143
|
-
rest: .6
|
|
144
|
-
})}
|
|
145
|
-
`;
|
|
146
|
-
function CircularDots(props) {
|
|
147
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
|
|
148
|
-
name: "circular-dots",
|
|
149
|
-
children: css$5
|
|
150
|
-
}), /* @__PURE__ */ jsx("svg", {
|
|
151
|
-
...spinnerRoot("circular-dots", props),
|
|
152
|
-
fill: "currentColor",
|
|
153
|
-
role: "presentation",
|
|
154
|
-
viewBox: "0 0 16 16",
|
|
155
|
-
children: DOTS.map(([cx, cy], index) => /* @__PURE__ */ jsx("circle", {
|
|
156
|
-
className: "nsaa-loader-circular-dots-dot",
|
|
157
|
-
cx,
|
|
158
|
-
cy,
|
|
159
|
-
r: "1.5",
|
|
160
|
-
style: step(index)
|
|
161
|
-
}, `${cx}-${cy}`))
|
|
162
|
-
})] });
|
|
163
|
-
}
|
|
164
|
-
// src/loaders/classic.tsx
|
|
165
|
-
const BARS$1 = Array.from({ length: 12 }, (_, index) => index);
|
|
166
|
-
const css$4 = `
|
|
167
|
-
.nsaa-loader-classic-inner {
|
|
168
|
-
position: relative;
|
|
169
|
-
top: 50%;
|
|
170
|
-
left: 50%;
|
|
171
|
-
width: ${SIZE};
|
|
172
|
-
height: ${SIZE};
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
.nsaa-loader-classic-bar {
|
|
176
|
-
position: absolute;
|
|
177
|
-
top: -3.9%;
|
|
178
|
-
left: -10%;
|
|
179
|
-
width: 24%;
|
|
180
|
-
height: 8%;
|
|
181
|
-
background: currentColor;
|
|
182
|
-
border-radius: 6px;
|
|
183
|
-
transform: rotate(calc(var(${STEP_VAR}) * 30deg)) translate(146%);
|
|
184
|
-
}
|
|
185
|
-
|
|
186
|
-
${fadeCss("classic", "bar", BARS$1.length, {
|
|
187
|
-
dim: .15,
|
|
188
|
-
rest: .5
|
|
189
|
-
})}
|
|
190
|
-
`;
|
|
191
|
-
function Classic(props) {
|
|
192
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
|
|
193
|
-
name: "classic",
|
|
194
|
-
children: css$4
|
|
195
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
196
|
-
...spinnerRoot("classic", props),
|
|
197
|
-
children: /* @__PURE__ */ jsx("div", {
|
|
198
|
-
className: "nsaa-loader-classic-inner",
|
|
199
|
-
children: BARS$1.map((bar) => /* @__PURE__ */ jsx("div", {
|
|
200
|
-
className: "nsaa-loader-classic-bar",
|
|
201
|
-
style: step(bar)
|
|
202
|
-
}, bar))
|
|
203
|
-
})
|
|
204
|
-
})] });
|
|
205
|
-
}
|
|
206
|
-
// src/loaders/orbit.tsx
|
|
207
|
-
const css$3 = `
|
|
208
|
-
.nsaa-loader-orbit {
|
|
209
|
-
--nsaa-loader-orbit-stroke: calc(${SIZE} * 0.0625);
|
|
210
|
-
position: relative;
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
.nsaa-loader-orbit-track {
|
|
214
|
-
position: absolute;
|
|
215
|
-
inset: 8%;
|
|
216
|
-
border-radius: 9999px;
|
|
217
|
-
background: conic-gradient(from 180deg, transparent 0deg, currentColor 180deg, transparent 180deg);
|
|
218
|
-
-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - var(--nsaa-loader-orbit-stroke)), #000 0);
|
|
219
|
-
mask: radial-gradient(farthest-side, transparent calc(100% - var(--nsaa-loader-orbit-stroke)), #000 0);
|
|
220
|
-
}
|
|
221
|
-
|
|
222
|
-
.nsaa-loader-orbit-dot {
|
|
223
|
-
position: absolute;
|
|
224
|
-
top: 50%;
|
|
225
|
-
left: 50%;
|
|
226
|
-
width: 25%;
|
|
227
|
-
height: 25%;
|
|
228
|
-
background: currentColor;
|
|
229
|
-
border-radius: 9999px;
|
|
230
|
-
transform: translate(-50%, -50%);
|
|
231
|
-
}
|
|
232
|
-
|
|
233
|
-
${rotationCss("orbit")}
|
|
234
|
-
`;
|
|
235
|
-
function Orbit({ easing, ...rest }) {
|
|
236
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
|
|
237
|
-
name: "orbit",
|
|
238
|
-
children: css$3
|
|
239
|
-
}), /* @__PURE__ */ jsxs("div", {
|
|
240
|
-
...spinnerRoot("orbit", rest),
|
|
241
|
-
children: [/* @__PURE__ */ jsx("div", { className: "nsaa-loader-orbit-dot" }), /* @__PURE__ */ jsx("div", { className: `nsaa-loader-orbit-track ${spinClass("orbit", easing)}` })]
|
|
242
|
-
})] });
|
|
243
|
-
}
|
|
244
|
-
// src/loaders/pulse.tsx
|
|
245
|
-
const css$2 = `
|
|
246
|
-
.nsaa-loader-pulse-ring {
|
|
247
|
-
transform-origin: center;
|
|
248
|
-
${animation("pulse", "nsaa-loader-pulse-ripple", "ease-out")}
|
|
249
|
-
}
|
|
250
|
-
|
|
251
|
-
@keyframes nsaa-loader-pulse-ripple {
|
|
252
|
-
from {
|
|
253
|
-
opacity: 0.4;
|
|
254
|
-
transform: scale(0.25);
|
|
255
|
-
}
|
|
256
|
-
to {
|
|
257
|
-
opacity: 0;
|
|
258
|
-
transform: scale(1);
|
|
259
|
-
}
|
|
260
|
-
}
|
|
261
|
-
|
|
262
|
-
${reducedMotion(`
|
|
263
|
-
.nsaa-loader-pulse-ring {
|
|
264
|
-
opacity: 0.2;
|
|
265
|
-
}
|
|
266
|
-
`)}
|
|
267
|
-
`;
|
|
268
|
-
function Pulse(props) {
|
|
269
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
|
|
270
|
-
name: "pulse",
|
|
271
|
-
children: css$2
|
|
272
|
-
}), /* @__PURE__ */ jsxs("svg", {
|
|
273
|
-
...spinnerRoot("pulse", props),
|
|
274
|
-
fill: "none",
|
|
275
|
-
role: "presentation",
|
|
276
|
-
viewBox: "0 0 16 16",
|
|
277
|
-
children: [/* @__PURE__ */ jsx("circle", {
|
|
278
|
-
className: "nsaa-loader-pulse-ring",
|
|
279
|
-
cx: "8",
|
|
280
|
-
cy: "8",
|
|
281
|
-
fill: "currentColor",
|
|
282
|
-
r: "8"
|
|
283
|
-
}), /* @__PURE__ */ jsx("circle", {
|
|
284
|
-
cx: "8",
|
|
285
|
-
cy: "8",
|
|
286
|
-
fill: "currentColor",
|
|
287
|
-
r: "2"
|
|
288
|
-
})]
|
|
289
|
-
})] });
|
|
290
|
-
}
|
|
291
|
-
// src/loaders/ring.tsx
|
|
292
|
-
const css$1 = `
|
|
293
|
-
${rotationCss("ring")}
|
|
294
|
-
`;
|
|
295
|
-
function Ring({ cap, easing, ...rest }) {
|
|
296
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
|
|
297
|
-
name: "ring",
|
|
298
|
-
children: css$1
|
|
299
|
-
}), /* @__PURE__ */ jsxs("svg", {
|
|
300
|
-
...spinnerRoot("ring", rest),
|
|
301
|
-
fill: "none",
|
|
302
|
-
role: "presentation",
|
|
303
|
-
viewBox: "0 0 24 24",
|
|
304
|
-
children: [/* @__PURE__ */ jsx("circle", {
|
|
305
|
-
cx: "12",
|
|
306
|
-
cy: "12",
|
|
307
|
-
opacity: "0.2",
|
|
308
|
-
r: "10",
|
|
309
|
-
stroke: "currentColor",
|
|
310
|
-
strokeWidth: "2.5"
|
|
311
|
-
}), /* @__PURE__ */ jsx("circle", {
|
|
312
|
-
className: spinClass("ring", easing),
|
|
313
|
-
cx: "12",
|
|
314
|
-
cy: "12",
|
|
315
|
-
r: "10",
|
|
316
|
-
stroke: "currentColor",
|
|
317
|
-
strokeDasharray: "16 46.8",
|
|
318
|
-
strokeLinecap: linecap(cap),
|
|
319
|
-
strokeWidth: "2.5"
|
|
320
|
-
})]
|
|
321
|
-
})] });
|
|
322
|
-
}
|
|
323
|
-
// src/loaders/wave.tsx
|
|
324
|
-
const DEFAULT_WAVE_ORIGIN = "center";
|
|
325
|
-
const BARS = Array.from({ length: 5 }, (_, index) => index);
|
|
326
|
-
const css = `
|
|
327
|
-
.nsaa-loader-wave {
|
|
328
|
-
display: flex;
|
|
329
|
-
align-items: center;
|
|
330
|
-
justify-content: space-between;
|
|
331
|
-
}
|
|
332
|
-
|
|
333
|
-
.nsaa-loader-wave-bar {
|
|
334
|
-
width: calc(${SIZE} * 0.12);
|
|
335
|
-
height: 100%;
|
|
336
|
-
background: currentColor;
|
|
337
|
-
border-radius: 9999px;
|
|
338
|
-
transform-origin: center;
|
|
339
|
-
${animation("wave", "nsaa-loader-wave-rise", "ease-in-out")}
|
|
340
|
-
animation-delay: ${stagger("wave", BARS.length)};
|
|
341
|
-
}
|
|
342
|
-
|
|
343
|
-
.nsaa-loader-wave-bar-bottom {
|
|
344
|
-
align-self: flex-end;
|
|
345
|
-
transform-origin: bottom;
|
|
346
|
-
}
|
|
347
|
-
|
|
348
|
-
/* Nsaa (#113): scaleY instead of upstream's height, so the bars don't re-lay out every frame. */
|
|
349
|
-
@keyframes nsaa-loader-wave-rise {
|
|
350
|
-
0%,
|
|
351
|
-
100% {
|
|
352
|
-
transform: scaleY(0.3);
|
|
353
|
-
}
|
|
354
|
-
50% {
|
|
355
|
-
transform: scaleY(1);
|
|
356
|
-
}
|
|
357
|
-
}
|
|
358
|
-
|
|
359
|
-
${reducedMotion(`
|
|
360
|
-
.nsaa-loader-wave-bar {
|
|
361
|
-
transform: scaleY(calc(0.4 + var(${STEP_VAR}) * 0.15));
|
|
362
|
-
}
|
|
363
|
-
`)}
|
|
364
|
-
`;
|
|
365
|
-
function Wave({ origin = DEFAULT_WAVE_ORIGIN, ...rest }) {
|
|
366
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerStyle, {
|
|
367
|
-
name: "wave",
|
|
368
|
-
children: css
|
|
369
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
370
|
-
...spinnerRoot("wave", rest),
|
|
371
|
-
children: BARS.map((index) => /* @__PURE__ */ jsx("div", {
|
|
372
|
-
className: `nsaa-loader-wave-bar nsaa-loader-wave-bar-${origin}`,
|
|
373
|
-
style: step(index)
|
|
374
|
-
}, index))
|
|
375
|
-
})] });
|
|
376
|
-
}
|
|
377
|
-
// src/spinner/registry.ts
|
|
378
|
-
const registry = /* @__PURE__ */ new Map();
|
|
379
|
-
/** Makes a loader available as `<Spinner variant={name} />`. A later registration replaces an earlier one. */
|
|
380
|
-
function registerLoader(name, component) {
|
|
381
|
-
registry.set(name, component);
|
|
382
|
-
}
|
|
383
|
-
/** Registers a map of loaders, e.g. `registerLoaders(LOADERS)` for all 29 from `@nsaa/core/loaders`. */
|
|
384
|
-
function registerLoaders(loaders) {
|
|
385
|
-
for (const [name, component] of Object.entries(loaders)) registry.set(name, component);
|
|
386
|
-
}
|
|
387
|
-
function getLoader(name) {
|
|
388
|
-
return registry.get(name);
|
|
389
|
-
}
|
|
390
|
-
export { DEFAULT_CAP as _, Wave as a, Orbit as c, fadeCss as d, BouncingDots as f, spinClass as g, rotationCss as h, DEFAULT_WAVE_ORIGIN as i, Classic as l, DEFAULT_EASING as m, registerLoader as n, Ring as o, Arc as p, registerLoaders as r, Pulse as s, getLoader as t, CircularDots as u, linecap as v };
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
import { ComponentType } from "react";
|
|
3
|
-
interface SpinnerProps {
|
|
4
|
-
className?: string;
|
|
5
|
-
color?: string;
|
|
6
|
-
duration?: number;
|
|
7
|
-
playState?: "paused" | "running";
|
|
8
|
-
/** A token size (xs 12, sm 14, md 16, lg 20, xl 24) or pixels. Unset: inherited, else md. */
|
|
9
|
-
size?: LoaderSize | number;
|
|
10
|
-
}
|
|
11
|
-
type LoaderSize = "xs" | "sm" | "md" | "lg" | "xl";
|
|
12
|
-
/** A loader: a decorative, `aria-hidden` glyph painted with `currentColor` (the loader contract). */
|
|
13
|
-
type LoaderComponent = ComponentType<SpinnerProps>;
|
|
14
|
-
/** Makes a loader available as `<Spinner variant={name} />`. A later registration replaces an earlier one. */
|
|
15
|
-
declare function registerLoader(name: string, component: LoaderComponent): void;
|
|
16
|
-
/** Registers a map of loaders, e.g. `registerLoaders(LOADERS)` for all 29 from `@nsaa/core/loaders`. */
|
|
17
|
-
declare function registerLoaders(loaders: Record<string, LoaderComponent>): void;
|
|
18
|
-
export { SpinnerProps as a, LoaderSize as i, registerLoader as n, registerLoaders as r, LoaderComponent as t };
|
package/dist/sound-DiYNAnR_.d.ts
DELETED
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
import { ReactNode } from "react";
|
|
3
|
-
declare const sound: {
|
|
4
|
-
readonly $note: "On by default (decision #30): plays only after a user action, never on load; quiet; one remembered global mute; silent under prefers-reduced-motion; apps can turn the default off. Cue values are UISFX 0.4.0 cue names (MIT code, CC0 audio), checked against its CUES export; feel is a UISFX pack name (decision #57).";
|
|
5
|
-
readonly enabled: true;
|
|
6
|
-
readonly volume: 0.35;
|
|
7
|
-
readonly feel: "zen";
|
|
8
|
-
readonly library: "uisfx";
|
|
9
|
-
readonly libraryVersion: "0.4.0";
|
|
10
|
-
readonly cue: {
|
|
11
|
-
readonly "input.press": "press";
|
|
12
|
-
readonly "input.toggle-on": "toggle-on";
|
|
13
|
-
readonly "input.toggle-off": "toggle-off";
|
|
14
|
-
readonly "selection.select": "select";
|
|
15
|
-
readonly "navigation.open": "open";
|
|
16
|
-
readonly "navigation.close": "close";
|
|
17
|
-
readonly "movement.snap": "snap";
|
|
18
|
-
readonly "movement.drop": "drop";
|
|
19
|
-
readonly "feedback.success": "success";
|
|
20
|
-
readonly "feedback.warning": "warning";
|
|
21
|
-
readonly "feedback.error": "error";
|
|
22
|
-
readonly "commerce.payment": "purchase";
|
|
23
|
-
readonly "progress.loop": "loading";
|
|
24
|
-
};
|
|
25
|
-
};
|
|
26
|
-
/** Cue names come from the tokens (`sound.cue` in packages/tokens/src/effects.json). */
|
|
27
|
-
type SoundCue = keyof typeof sound.cue;
|
|
28
|
-
/**
|
|
29
|
-
* Plays a cue. App-supplied, so the library makes no network calls and the sound engine
|
|
30
|
-
* (UISFX or anything else) stays swappable. `asset` is the engine's cue name from the tokens.
|
|
31
|
-
*/
|
|
32
|
-
type SoundPlayer = (cue: SoundCue, options: {
|
|
33
|
-
asset: string;
|
|
34
|
-
volume: number;
|
|
35
|
-
}) => void | (() => void);
|
|
36
|
-
interface PlayOptions {
|
|
37
|
-
/** Give way to any other cue played during the same event (a Button press under a Dialog close). */
|
|
38
|
-
yield?: boolean | undefined;
|
|
39
|
-
}
|
|
40
|
-
interface SoundProviderProps {
|
|
41
|
-
children: ReactNode;
|
|
42
|
-
/** Plays cues. Without one every cue is silent (the current stub behaviour). */
|
|
43
|
-
player?: SoundPlayer | undefined;
|
|
44
|
-
/** Apps can turn the default off (decision #30). */
|
|
45
|
-
enabled?: boolean | undefined;
|
|
46
|
-
volume?: number | undefined;
|
|
47
|
-
}
|
|
48
|
-
/** Global sound settings: one remembered mute for the whole app. */
|
|
49
|
-
declare function SoundProvider({ children, player, enabled, volume }: SoundProviderProps): import("react").JSX.Element;
|
|
50
|
-
/**
|
|
51
|
-
* Plays interface sounds with manners: only from a user action (call `play` in an event handler),
|
|
52
|
-
* never when muted, turned off, or when the user asks for reduced motion; repeats are throttled.
|
|
53
|
-
*/
|
|
54
|
-
declare function useSound(): {
|
|
55
|
-
play: (cue: SoundCue, options?: PlayOptions) => void;
|
|
56
|
-
loop: (cue: SoundCue) => (() => void);
|
|
57
|
-
muted: boolean;
|
|
58
|
-
setMuted: (muted: boolean) => void;
|
|
59
|
-
enabled: boolean;
|
|
60
|
-
};
|
|
61
|
-
export { useSound as a, SoundProviderProps as i, SoundPlayer as n, SoundProvider as r, SoundCue as t };
|