@brosco/ui 0.0.85 → 0.0.87

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/index.css +1 -409
  2. package/package.json +3 -2
package/dist/index.css CHANGED
@@ -1,410 +1,2 @@
1
1
  /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
2
- @layer properties {
3
- @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or
4
- ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
5
- *,
6
- :before,
7
- :after,
8
- ::backdrop {
9
- --tw-font-weight: initial;
10
- --tw-scale-x: 1;
11
- --tw-scale-y: 1;
12
- --tw-scale-z: 1;
13
- --tw-shadow: 0 0 #0000;
14
- --tw-shadow-color: initial;
15
- --tw-shadow-alpha: 100%;
16
- --tw-inset-shadow: 0 0 #0000;
17
- --tw-inset-shadow-color: initial;
18
- --tw-inset-shadow-alpha: 100%;
19
- --tw-ring-color: initial;
20
- --tw-ring-shadow: 0 0 #0000;
21
- --tw-inset-ring-color: initial;
22
- --tw-inset-ring-shadow: 0 0 #0000;
23
- --tw-ring-inset: initial;
24
- --tw-ring-offset-width: 0px;
25
- --tw-ring-offset-color: #fff;
26
- --tw-ring-offset-shadow: 0 0 #0000;
27
- --tw-border-style: solid;
28
- --tw-duration: initial;
29
- }
30
- }
31
- }
32
- :root {
33
- --eclipse: oklch(21% 0.006 285.885);
34
- --white: #fff;
35
- --background: var(--white);
36
- --foreground: var(--eclipse);
37
- --muted: oklch(55.2% 0.016 285.938);
38
- --primary: oklch(62.3% 0.214 259.815);
39
- --secondary: var(--eclipse);
40
- --success: oklch(62.7% 0.194 149.214);
41
- --danger: oklch(63.7% 0.237 25.331);
42
- }
43
- :root,
44
- :host {
45
- --color-foreground: var(--foreground);
46
- --color-muted: var(--muted);
47
- --color-white: #fff;
48
- --spacing: 0.25rem;
49
- --text-sm: 0.875rem;
50
- --text-sm--line-height: calc(1.25 / 0.875);
51
- --text-base: 1rem;
52
- --text-base--line-height: calc(1.5 / 1);
53
- --font-weight-medium: 500;
54
- --animate-spin: spin 1s linear infinite;
55
- --default-transition-duration: 0.15s;
56
- --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
57
- }
58
- @layer utilities;
59
- @layer components {
60
- .button {
61
- --color: transparent;
62
- --bg: transparent;
63
- --bg-hover: var(--bg);
64
- --bg-active: var(--bg-hover);
65
- --fg: currentColor;
66
- }
67
- .button--primary {
68
- --color: var(--primary);
69
- }
70
- .button--secondary {
71
- --color: var(--secondary);
72
- }
73
- .button--success {
74
- --color: var(--success);
75
- }
76
- .button--danger {
77
- --color: var(--danger);
78
- }
79
- .button--solid {
80
- --bg: var(--color);
81
- --bg-hover: var(--bg);
82
- }
83
- @supports (color: color-mix(in lab, red, red)) {
84
- .button--solid {
85
- --bg-hover: color-mix(in oklab, var(--bg) 90%, var(--eclipse) 10%);
86
- }
87
- }
88
- .button--solid {
89
- --bg-active: var(--bg);
90
- }
91
- @supports (color: color-mix(in lab, red, red)) {
92
- .button--solid {
93
- --bg-active: color-mix(in oklab, var(--bg) 80%, var(--eclipse) 20%);
94
- }
95
- }
96
- .button--solid {
97
- --fg: var(--color-white);
98
- }
99
- .button--solid.button--secondary {
100
- --bg: var(--color);
101
- }
102
- @supports (color: color-mix(in lab, red, red)) {
103
- .button--solid.button--secondary {
104
- --bg: color-mix(in oklab, var(--color) 5%, transparent);
105
- }
106
- }
107
- .button--solid.button--secondary {
108
- --bg-hover: var(--bg);
109
- }
110
- @supports (color: color-mix(in lab, red, red)) {
111
- .button--solid.button--secondary {
112
- --bg-hover: color-mix(in oklab, var(--bg) 95%, var(--eclipse) 5%);
113
- }
114
- }
115
- .button--solid.button--secondary {
116
- --bg-active: var(--bg);
117
- }
118
- @supports (color: color-mix(in lab, red, red)) {
119
- .button--solid.button--secondary {
120
- --bg-active: color-mix(in oklab, var(--bg) 90%, var(--eclipse) 10%);
121
- }
122
- }
123
- .button--solid.button--secondary {
124
- --fg: var(--color);
125
- }
126
- .button--bordered,
127
- .button--light {
128
- --fg: var(--color);
129
- --bg-hover: var(--fg);
130
- }
131
- @supports (color: color-mix(in lab, red, red)) {
132
- .button--bordered,
133
- .button--light {
134
- --bg-hover: color-mix(in oklab, var(--fg) 5%, transparent);
135
- }
136
- }
137
- .button {
138
- justify-content: center;
139
- align-items: center;
140
- gap: calc(var(--spacing) * 2);
141
- --tw-font-weight: var(--font-weight-medium);
142
- font-weight: var(--font-weight-medium);
143
- white-space: nowrap;
144
- color: var(--fg);
145
- transition-property: background-color, scale;
146
- transition-timing-function: var(
147
- --tw-ease,
148
- var(--default-transition-timing-function)
149
- );
150
- transition-duration: var(--tw-duration, var(--default-transition-duration));
151
- -webkit-user-select: none;
152
- user-select: none;
153
- display: inline-flex;
154
- }
155
- .button:focus-visible {
156
- --tw-outline-style: none;
157
- outline-style: none;
158
- }
159
- .button:enabled {
160
- cursor: pointer;
161
- }
162
- .button:hover {
163
- background-color: var(--bg-hover);
164
- }
165
- .button:active {
166
- --tw-scale-x: 95%;
167
- --tw-scale-y: 95%;
168
- --tw-scale-z: 95%;
169
- scale: var(--tw-scale-x) var(--tw-scale-y);
170
- background-color: var(--bg-active);
171
- }
172
- .button--pending {
173
- pointer-events: none;
174
- }
175
- .button--sm {
176
- height: calc(var(--spacing) * 9);
177
- font-size: var(--text-sm);
178
- line-height: var(--tw-leading, var(--text-sm--line-height));
179
- }
180
- .button--md {
181
- height: calc(var(--spacing) * 10);
182
- font-size: var(--text-sm);
183
- line-height: var(--tw-leading, var(--text-sm--line-height));
184
- }
185
- .button--lg {
186
- height: calc(var(--spacing) * 11);
187
- font-size: var(--text-base);
188
- line-height: var(--tw-leading, var(--text-base--line-height));
189
- }
190
- .button--icon-only {
191
- flex-shrink: 0;
192
- }
193
- .button--icon-only.button--sm {
194
- width: calc(var(--spacing) * 9);
195
- }
196
- .button--icon-only.button--md {
197
- width: calc(var(--spacing) * 10);
198
- }
199
- .button--icon-only.button--lg {
200
- width: calc(var(--spacing) * 11);
201
- }
202
- .button--solid {
203
- background-color: var(--bg);
204
- }
205
- .button--solid:focus-visible:not(.button--pending) {
206
- --tw-ring-color: var(--color);
207
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0
208
- calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
209
- box-shadow:
210
- var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
211
- var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
212
- --tw-ring-offset-width: 2px;
213
- --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0
214
- var(--tw-ring-offset-width) var(--tw-ring-offset-color);
215
- }
216
- .button--bordered {
217
- border-style: var(--tw-border-style);
218
- border-width: 2px;
219
- border-color: var(--fg);
220
- }
221
- .button--bordered:focus-visible:not(.button--pending) {
222
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0
223
- calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
224
- box-shadow:
225
- var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
226
- var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
227
- --tw-ring-offset-width: 2px;
228
- --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0
229
- var(--tw-ring-offset-width) var(--tw-ring-offset-color);
230
- }
231
- .button--light {
232
- text-underline-offset: 6px;
233
- text-decoration-line: underline;
234
- position: relative;
235
- }
236
- @media (hover: hover) {
237
- .button--light:hover {
238
- text-decoration-line: none;
239
- }
240
- }
241
- .button--light:focus-visible:not(.button--pending):after {
242
- top: calc(var(--spacing) * 2);
243
- right: calc(var(--spacing) * 3);
244
- left: calc(var(--spacing) * 3);
245
- height: calc(var(--spacing) * 0.5);
246
- content: "";
247
- background-color: currentColor;
248
- position: absolute;
249
- }
250
- .spinner {
251
- animation: var(--animate-spin);
252
- }
253
- [role="tabs"] {
254
- display: flex;
255
- }
256
- [role="tabs"] [role="tablist"] {
257
- gap: var(--spacing);
258
- display: flex;
259
- position: relative;
260
- }
261
- [role="tabs"] [role="tab"] {
262
- z-index: 10;
263
- height: calc(var(--spacing) * 9);
264
- cursor: default;
265
- padding-inline: calc(var(--spacing) * 4);
266
- font-size: var(--text-sm);
267
- line-height: var(--tw-leading, var(--text-sm--line-height));
268
- --tw-font-weight: var(--font-weight-medium);
269
- font-weight: var(--font-weight-medium);
270
- white-space: nowrap;
271
- color: var(--color-muted);
272
- -webkit-user-select: none;
273
- user-select: none;
274
- justify-content: center;
275
- align-items: center;
276
- display: inline-flex;
277
- position: relative;
278
- }
279
- [role="tabs"] [role="tab"]:focus-visible {
280
- --tw-outline-style: none;
281
- outline-style: none;
282
- }
283
- [role="tabs"] [role="tab"][data-active],
284
- [role="tabs"] [role="tab"]:hover:not([data-active]) {
285
- color: var(--color-foreground);
286
- }
287
- [role="tabs"] [role="tab"]:not([data-active]) {
288
- cursor: pointer;
289
- }
290
- [role="tabs"] [role="presentation"] {
291
- background-color: var(--color-foreground);
292
- transition-property: left, width;
293
- transition-timing-function: var(
294
- --tw-ease,
295
- var(--default-transition-timing-function)
296
- );
297
- transition-duration: var(--tw-duration, var(--default-transition-duration));
298
- --tw-duration: 0.2s;
299
- bottom: 0;
300
- left: var(--active-tab-left);
301
- width: var(--active-tab-width);
302
- border-radius: 2147483647px;
303
- height: 3px;
304
- transition-duration: 0.2s;
305
- position: absolute;
306
- }
307
- :disabled,
308
- [data-disabled] {
309
- pointer-events: none;
310
- opacity: 0.5;
311
- }
312
- }
313
- @property --tw-font-weight {
314
- syntax: "*";
315
- inherits: false;
316
- }
317
- @property --tw-scale-x {
318
- syntax: "*";
319
- inherits: false;
320
- initial-value: 1;
321
- }
322
- @property --tw-scale-y {
323
- syntax: "*";
324
- inherits: false;
325
- initial-value: 1;
326
- }
327
- @property --tw-scale-z {
328
- syntax: "*";
329
- inherits: false;
330
- initial-value: 1;
331
- }
332
- @property --tw-shadow {
333
- syntax: "*";
334
- inherits: false;
335
- initial-value: 0 0 #0000;
336
- }
337
- @property --tw-shadow-color {
338
- syntax: "*";
339
- inherits: false;
340
- }
341
- @property --tw-shadow-alpha {
342
- syntax: "<percentage>";
343
- inherits: false;
344
- initial-value: 100%;
345
- }
346
- @property --tw-inset-shadow {
347
- syntax: "*";
348
- inherits: false;
349
- initial-value: 0 0 #0000;
350
- }
351
- @property --tw-inset-shadow-color {
352
- syntax: "*";
353
- inherits: false;
354
- }
355
- @property --tw-inset-shadow-alpha {
356
- syntax: "<percentage>";
357
- inherits: false;
358
- initial-value: 100%;
359
- }
360
- @property --tw-ring-color {
361
- syntax: "*";
362
- inherits: false;
363
- }
364
- @property --tw-ring-shadow {
365
- syntax: "*";
366
- inherits: false;
367
- initial-value: 0 0 #0000;
368
- }
369
- @property --tw-inset-ring-color {
370
- syntax: "*";
371
- inherits: false;
372
- }
373
- @property --tw-inset-ring-shadow {
374
- syntax: "*";
375
- inherits: false;
376
- initial-value: 0 0 #0000;
377
- }
378
- @property --tw-ring-inset {
379
- syntax: "*";
380
- inherits: false;
381
- }
382
- @property --tw-ring-offset-width {
383
- syntax: "<length>";
384
- inherits: false;
385
- initial-value: 0;
386
- }
387
- @property --tw-ring-offset-color {
388
- syntax: "*";
389
- inherits: false;
390
- initial-value: #fff;
391
- }
392
- @property --tw-ring-offset-shadow {
393
- syntax: "*";
394
- inherits: false;
395
- initial-value: 0 0 #0000;
396
- }
397
- @property --tw-border-style {
398
- syntax: "*";
399
- inherits: false;
400
- initial-value: solid;
401
- }
402
- @property --tw-duration {
403
- syntax: "*";
404
- inherits: false;
405
- }
406
- @keyframes spin {
407
- to {
408
- transform: rotate(360deg);
409
- }
410
- }
2
+ @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-border-style:solid;--tw-duration:initial}}}:root{--eclipse:oklch(21% .006 285.885);--white:#fff;--background:var(--white);--foreground:var(--eclipse);--muted:oklch(55.2% .016 285.938);--primary:oklch(62.3% .214 259.815);--secondary:var(--eclipse);--success:oklch(62.7% .194 149.214);--danger:oklch(63.7% .237 25.331)}:root,:host{--color-foreground:var(--foreground);--color-muted:var(--muted);--color-white:#fff;--spacing:.25rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--font-weight-medium:500;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}@layer utilities;@layer components{.button{--color:transparent;--bg:transparent;--bg-hover:var(--bg);--bg-active:var(--bg-hover);--fg:currentColor}.button--primary{--color:var(--primary)}.button--secondary{--color:var(--secondary)}.button--success{--color:var(--success)}.button--danger{--color:var(--danger)}.button--solid{--bg:var(--color);--bg-hover:var(--bg)}@supports (color:color-mix(in lab, red, red)){.button--solid{--bg-hover:color-mix(in oklab, var(--bg) 90%, var(--eclipse) 10%)}}.button--solid{--bg-active:var(--bg)}@supports (color:color-mix(in lab, red, red)){.button--solid{--bg-active:color-mix(in oklab, var(--bg) 80%, var(--eclipse) 20%)}}.button--solid{--fg:var(--color-white)}.button--solid.button--secondary{--bg:var(--color)}@supports (color:color-mix(in lab, red, red)){.button--solid.button--secondary{--bg:color-mix(in oklab, var(--color) 5%, transparent)}}.button--solid.button--secondary{--bg-hover:var(--bg)}@supports (color:color-mix(in lab, red, red)){.button--solid.button--secondary{--bg-hover:color-mix(in oklab, var(--bg) 95%, var(--eclipse) 5%)}}.button--solid.button--secondary{--bg-active:var(--bg)}@supports (color:color-mix(in lab, red, red)){.button--solid.button--secondary{--bg-active:color-mix(in oklab, var(--bg) 90%, var(--eclipse) 10%)}}.button--solid.button--secondary{--fg:var(--color)}.button--bordered,.button--light{--fg:var(--color);--bg-hover:var(--fg)}@supports (color:color-mix(in lab, red, red)){.button--bordered,.button--light{--bg-hover:color-mix(in oklab, var(--fg) 5%, transparent)}}.button{justify-content:center;align-items:center;gap:calc(var(--spacing) * 2);--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium);white-space:nowrap;color:var(--fg);transition-property:background-color,scale;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration));-webkit-user-select:none;user-select:none;display:inline-flex}.button:focus-visible{--tw-outline-style:none;outline-style:none}.button:enabled{cursor:pointer}.button:hover{background-color:var(--bg-hover)}.button:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y);background-color:var(--bg-active)}.button--pending{pointer-events:none}.button--sm{height:calc(var(--spacing) * 9);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.button--md{height:calc(var(--spacing) * 10);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.button--lg{height:calc(var(--spacing) * 11);font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.button--icon-only{flex-shrink:0}.button--icon-only.button--sm{width:calc(var(--spacing) * 9)}.button--icon-only.button--md{width:calc(var(--spacing) * 10)}.button--icon-only.button--lg{width:calc(var(--spacing) * 11)}.button--solid{background-color:var(--bg)}.button--solid:focus-visible:not(.button--pending){--tw-ring-color:var(--color);--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.button--bordered{border-style:var(--tw-border-style);border-width:2px;border-color:var(--fg)}.button--bordered:focus-visible:not(.button--pending){--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.button--light{text-underline-offset:6px;text-decoration-line:underline;position:relative}@media (hover:hover){.button--light:hover{text-decoration-line:none}}.button--light:focus-visible:not(.button--pending):after{top:calc(var(--spacing) * 2);right:calc(var(--spacing) * 3);left:calc(var(--spacing) * 3);height:calc(var(--spacing) * .5);content:"";background-color:currentColor;position:absolute}.spinner{animation:var(--animate-spin)}[role=tabs]{display:flex}[role=tabs] [role=tablist]{gap:var(--spacing);display:flex;position:relative}[role=tabs] [role=tab]{z-index:10;height:calc(var(--spacing) * 9);cursor:default;padding-inline:calc(var(--spacing) * 4);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium);white-space:nowrap;color:var(--color-muted);-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:inline-flex;position:relative}[role=tabs] [role=tab]:focus-visible{--tw-outline-style:none;outline-style:none}[role=tabs] [role=tab][data-active],[role=tabs] [role=tab]:hover:not([data-active]){color:var(--color-foreground)}[role=tabs] [role=tab]:not([data-active]){cursor:pointer}[role=tabs] [role=presentation]{background-color:var(--color-foreground);transition-property:left,width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration));--tw-duration:.2s;bottom:0;left:var(--active-tab-left);width:var(--active-tab-width);border-radius:2147483647px;height:3px;transition-duration:.2s;position:absolute}:disabled,[data-disabled]{pointer-events:none;opacity:.5}}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brosco/ui",
3
- "version": "0.0.85",
3
+ "version": "0.0.87",
4
4
  "type": "module",
5
5
  "files": [
6
6
  "dist"
@@ -9,7 +9,8 @@
9
9
  ".": {
10
10
  "types": "./dist/index.d.ts",
11
11
  "import": "./dist/index.js"
12
- }
12
+ },
13
+ "./styles.css": "./dist/index.css"
13
14
  },
14
15
  "scripts": {
15
16
  "dev": "vite",