@khanhminh/design-system 1.7.0 → 1.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,4 @@
1
+ export { Button } from './ui/button';
2
+ export { Input } from './ui/input';
3
+ export { Spinner } from './ui/spinner';
4
+ export { Checkbox } from './ui/checkbox';
@@ -0,0 +1,10 @@
1
+ import * as React from 'react';
2
+ import { type VariantProps } from 'class-variance-authority';
3
+ declare const buttonVariants: (props?: ({
4
+ variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
5
+ size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
6
+ } & import("class-variance-authority/types").ClassProp) | undefined) => string;
7
+ declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
8
+ asChild?: boolean;
9
+ }): import("react/jsx-runtime").JSX.Element;
10
+ export { Button, buttonVariants };
@@ -0,0 +1,4 @@
1
+ import * as React from 'react';
2
+ import { Checkbox as CheckboxPrimitive } from 'radix-ui';
3
+ declare function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
4
+ export { Checkbox };
@@ -0,0 +1,3 @@
1
+ import * as React from 'react';
2
+ declare function Input({ className, type, ...props }: React.ComponentProps<'input'>): import("react/jsx-runtime").JSX.Element;
3
+ export { Input };
@@ -0,0 +1,2 @@
1
+ declare function Spinner({ className, ...props }: React.ComponentProps<'svg'>): import("react/jsx-runtime").JSX.Element;
2
+ export { Spinner };
@@ -0,0 +1 @@
1
+ export * from './useToggle';
@@ -0,0 +1,12 @@
1
+ /**
2
+ * A simple boolean toggle hook.
3
+ *
4
+ * @param initial initial value (defaults to false)
5
+ * @returns an object with the current state and helpers to toggle / set on / set off
6
+ */
7
+ export declare function useToggle(initial?: boolean): {
8
+ readonly state: boolean;
9
+ readonly toggle: () => void;
10
+ readonly setOn: () => void;
11
+ readonly setOff: () => void;
12
+ };
package/dist/index.cjs ADDED
@@ -0,0 +1,490 @@
1
+ 'use strict';
2
+
3
+ var require$$0 = require('react');
4
+ var classVarianceAuthority = require('class-variance-authority');
5
+ var radixUi = require('radix-ui');
6
+ var clsx = require('clsx');
7
+ var tailwindMerge = require('tailwind-merge');
8
+ var lucideReact = require('lucide-react');
9
+
10
+ var jsxRuntime = {exports: {}};
11
+
12
+ var reactJsxRuntime_production = {};
13
+
14
+ /**
15
+ * @license React
16
+ * react-jsx-runtime.production.js
17
+ *
18
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
19
+ *
20
+ * This source code is licensed under the MIT license found in the
21
+ * LICENSE file in the root directory of this source tree.
22
+ */
23
+
24
+ var hasRequiredReactJsxRuntime_production;
25
+
26
+ function requireReactJsxRuntime_production () {
27
+ if (hasRequiredReactJsxRuntime_production) return reactJsxRuntime_production;
28
+ hasRequiredReactJsxRuntime_production = 1;
29
+ var REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"),
30
+ REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
31
+ function jsxProd(type, config, maybeKey) {
32
+ var key = null;
33
+ void 0 !== maybeKey && (key = "" + maybeKey);
34
+ void 0 !== config.key && (key = "" + config.key);
35
+ if ("key" in config) {
36
+ maybeKey = {};
37
+ for (var propName in config)
38
+ "key" !== propName && (maybeKey[propName] = config[propName]);
39
+ } else maybeKey = config;
40
+ config = maybeKey.ref;
41
+ return {
42
+ $$typeof: REACT_ELEMENT_TYPE,
43
+ type: type,
44
+ key: key,
45
+ ref: void 0 !== config ? config : null,
46
+ props: maybeKey
47
+ };
48
+ }
49
+ reactJsxRuntime_production.Fragment = REACT_FRAGMENT_TYPE;
50
+ reactJsxRuntime_production.jsx = jsxProd;
51
+ reactJsxRuntime_production.jsxs = jsxProd;
52
+ return reactJsxRuntime_production;
53
+ }
54
+
55
+ var reactJsxRuntime_development = {};
56
+
57
+ /**
58
+ * @license React
59
+ * react-jsx-runtime.development.js
60
+ *
61
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
62
+ *
63
+ * This source code is licensed under the MIT license found in the
64
+ * LICENSE file in the root directory of this source tree.
65
+ */
66
+
67
+ var hasRequiredReactJsxRuntime_development;
68
+
69
+ function requireReactJsxRuntime_development () {
70
+ if (hasRequiredReactJsxRuntime_development) return reactJsxRuntime_development;
71
+ hasRequiredReactJsxRuntime_development = 1;
72
+ "production" !== process.env.NODE_ENV &&
73
+ (function () {
74
+ function getComponentNameFromType(type) {
75
+ if (null == type) return null;
76
+ if ("function" === typeof type)
77
+ return type.$$typeof === REACT_CLIENT_REFERENCE
78
+ ? null
79
+ : type.displayName || type.name || null;
80
+ if ("string" === typeof type) return type;
81
+ switch (type) {
82
+ case REACT_FRAGMENT_TYPE:
83
+ return "Fragment";
84
+ case REACT_PROFILER_TYPE:
85
+ return "Profiler";
86
+ case REACT_STRICT_MODE_TYPE:
87
+ return "StrictMode";
88
+ case REACT_SUSPENSE_TYPE:
89
+ return "Suspense";
90
+ case REACT_SUSPENSE_LIST_TYPE:
91
+ return "SuspenseList";
92
+ case REACT_ACTIVITY_TYPE:
93
+ return "Activity";
94
+ }
95
+ if ("object" === typeof type)
96
+ switch (
97
+ ("number" === typeof type.tag &&
98
+ console.error(
99
+ "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
100
+ ),
101
+ type.$$typeof)
102
+ ) {
103
+ case REACT_PORTAL_TYPE:
104
+ return "Portal";
105
+ case REACT_CONTEXT_TYPE:
106
+ return type.displayName || "Context";
107
+ case REACT_CONSUMER_TYPE:
108
+ return (type._context.displayName || "Context") + ".Consumer";
109
+ case REACT_FORWARD_REF_TYPE:
110
+ var innerType = type.render;
111
+ type = type.displayName;
112
+ type ||
113
+ ((type = innerType.displayName || innerType.name || ""),
114
+ (type = "" !== type ? "ForwardRef(" + type + ")" : "ForwardRef"));
115
+ return type;
116
+ case REACT_MEMO_TYPE:
117
+ return (
118
+ (innerType = type.displayName || null),
119
+ null !== innerType
120
+ ? innerType
121
+ : getComponentNameFromType(type.type) || "Memo"
122
+ );
123
+ case REACT_LAZY_TYPE:
124
+ innerType = type._payload;
125
+ type = type._init;
126
+ try {
127
+ return getComponentNameFromType(type(innerType));
128
+ } catch (x) {}
129
+ }
130
+ return null;
131
+ }
132
+ function testStringCoercion(value) {
133
+ return "" + value;
134
+ }
135
+ function checkKeyStringCoercion(value) {
136
+ try {
137
+ testStringCoercion(value);
138
+ var JSCompiler_inline_result = !1;
139
+ } catch (e) {
140
+ JSCompiler_inline_result = !0;
141
+ }
142
+ if (JSCompiler_inline_result) {
143
+ JSCompiler_inline_result = console;
144
+ var JSCompiler_temp_const = JSCompiler_inline_result.error;
145
+ var JSCompiler_inline_result$jscomp$0 =
146
+ ("function" === typeof Symbol &&
147
+ Symbol.toStringTag &&
148
+ value[Symbol.toStringTag]) ||
149
+ value.constructor.name ||
150
+ "Object";
151
+ JSCompiler_temp_const.call(
152
+ JSCompiler_inline_result,
153
+ "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
154
+ JSCompiler_inline_result$jscomp$0
155
+ );
156
+ return testStringCoercion(value);
157
+ }
158
+ }
159
+ function getTaskName(type) {
160
+ if (type === REACT_FRAGMENT_TYPE) return "<>";
161
+ if (
162
+ "object" === typeof type &&
163
+ null !== type &&
164
+ type.$$typeof === REACT_LAZY_TYPE
165
+ )
166
+ return "<...>";
167
+ try {
168
+ var name = getComponentNameFromType(type);
169
+ return name ? "<" + name + ">" : "<...>";
170
+ } catch (x) {
171
+ return "<...>";
172
+ }
173
+ }
174
+ function getOwner() {
175
+ var dispatcher = ReactSharedInternals.A;
176
+ return null === dispatcher ? null : dispatcher.getOwner();
177
+ }
178
+ function UnknownOwner() {
179
+ return Error("react-stack-top-frame");
180
+ }
181
+ function hasValidKey(config) {
182
+ if (hasOwnProperty.call(config, "key")) {
183
+ var getter = Object.getOwnPropertyDescriptor(config, "key").get;
184
+ if (getter && getter.isReactWarning) return !1;
185
+ }
186
+ return void 0 !== config.key;
187
+ }
188
+ function defineKeyPropWarningGetter(props, displayName) {
189
+ function warnAboutAccessingKey() {
190
+ specialPropKeyWarningShown ||
191
+ ((specialPropKeyWarningShown = !0),
192
+ console.error(
193
+ "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
194
+ displayName
195
+ ));
196
+ }
197
+ warnAboutAccessingKey.isReactWarning = !0;
198
+ Object.defineProperty(props, "key", {
199
+ get: warnAboutAccessingKey,
200
+ configurable: !0
201
+ });
202
+ }
203
+ function elementRefGetterWithDeprecationWarning() {
204
+ var componentName = getComponentNameFromType(this.type);
205
+ didWarnAboutElementRef[componentName] ||
206
+ ((didWarnAboutElementRef[componentName] = !0),
207
+ console.error(
208
+ "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
209
+ ));
210
+ componentName = this.props.ref;
211
+ return void 0 !== componentName ? componentName : null;
212
+ }
213
+ function ReactElement(type, key, props, owner, debugStack, debugTask) {
214
+ var refProp = props.ref;
215
+ type = {
216
+ $$typeof: REACT_ELEMENT_TYPE,
217
+ type: type,
218
+ key: key,
219
+ props: props,
220
+ _owner: owner
221
+ };
222
+ null !== (void 0 !== refProp ? refProp : null)
223
+ ? Object.defineProperty(type, "ref", {
224
+ enumerable: !1,
225
+ get: elementRefGetterWithDeprecationWarning
226
+ })
227
+ : Object.defineProperty(type, "ref", { enumerable: !1, value: null });
228
+ type._store = {};
229
+ Object.defineProperty(type._store, "validated", {
230
+ configurable: !1,
231
+ enumerable: !1,
232
+ writable: !0,
233
+ value: 0
234
+ });
235
+ Object.defineProperty(type, "_debugInfo", {
236
+ configurable: !1,
237
+ enumerable: !1,
238
+ writable: !0,
239
+ value: null
240
+ });
241
+ Object.defineProperty(type, "_debugStack", {
242
+ configurable: !1,
243
+ enumerable: !1,
244
+ writable: !0,
245
+ value: debugStack
246
+ });
247
+ Object.defineProperty(type, "_debugTask", {
248
+ configurable: !1,
249
+ enumerable: !1,
250
+ writable: !0,
251
+ value: debugTask
252
+ });
253
+ Object.freeze && (Object.freeze(type.props), Object.freeze(type));
254
+ return type;
255
+ }
256
+ function jsxDEVImpl(
257
+ type,
258
+ config,
259
+ maybeKey,
260
+ isStaticChildren,
261
+ debugStack,
262
+ debugTask
263
+ ) {
264
+ var children = config.children;
265
+ if (void 0 !== children)
266
+ if (isStaticChildren)
267
+ if (isArrayImpl(children)) {
268
+ for (
269
+ isStaticChildren = 0;
270
+ isStaticChildren < children.length;
271
+ isStaticChildren++
272
+ )
273
+ validateChildKeys(children[isStaticChildren]);
274
+ Object.freeze && Object.freeze(children);
275
+ } else
276
+ console.error(
277
+ "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
278
+ );
279
+ else validateChildKeys(children);
280
+ if (hasOwnProperty.call(config, "key")) {
281
+ children = getComponentNameFromType(type);
282
+ var keys = Object.keys(config).filter(function (k) {
283
+ return "key" !== k;
284
+ });
285
+ isStaticChildren =
286
+ 0 < keys.length
287
+ ? "{key: someKey, " + keys.join(": ..., ") + ": ...}"
288
+ : "{key: someKey}";
289
+ didWarnAboutKeySpread[children + isStaticChildren] ||
290
+ ((keys =
291
+ 0 < keys.length ? "{" + keys.join(": ..., ") + ": ...}" : "{}"),
292
+ console.error(
293
+ 'A props object containing a "key" prop is being spread into JSX:\n let props = %s;\n <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n let props = %s;\n <%s key={someKey} {...props} />',
294
+ isStaticChildren,
295
+ children,
296
+ keys,
297
+ children
298
+ ),
299
+ (didWarnAboutKeySpread[children + isStaticChildren] = !0));
300
+ }
301
+ children = null;
302
+ void 0 !== maybeKey &&
303
+ (checkKeyStringCoercion(maybeKey), (children = "" + maybeKey));
304
+ hasValidKey(config) &&
305
+ (checkKeyStringCoercion(config.key), (children = "" + config.key));
306
+ if ("key" in config) {
307
+ maybeKey = {};
308
+ for (var propName in config)
309
+ "key" !== propName && (maybeKey[propName] = config[propName]);
310
+ } else maybeKey = config;
311
+ children &&
312
+ defineKeyPropWarningGetter(
313
+ maybeKey,
314
+ "function" === typeof type
315
+ ? type.displayName || type.name || "Unknown"
316
+ : type
317
+ );
318
+ return ReactElement(
319
+ type,
320
+ children,
321
+ maybeKey,
322
+ getOwner(),
323
+ debugStack,
324
+ debugTask
325
+ );
326
+ }
327
+ function validateChildKeys(node) {
328
+ isValidElement(node)
329
+ ? node._store && (node._store.validated = 1)
330
+ : "object" === typeof node &&
331
+ null !== node &&
332
+ node.$$typeof === REACT_LAZY_TYPE &&
333
+ ("fulfilled" === node._payload.status
334
+ ? isValidElement(node._payload.value) &&
335
+ node._payload.value._store &&
336
+ (node._payload.value._store.validated = 1)
337
+ : node._store && (node._store.validated = 1));
338
+ }
339
+ function isValidElement(object) {
340
+ return (
341
+ "object" === typeof object &&
342
+ null !== object &&
343
+ object.$$typeof === REACT_ELEMENT_TYPE
344
+ );
345
+ }
346
+ var React = require$$0,
347
+ REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"),
348
+ REACT_PORTAL_TYPE = Symbol.for("react.portal"),
349
+ REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
350
+ REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"),
351
+ REACT_PROFILER_TYPE = Symbol.for("react.profiler"),
352
+ REACT_CONSUMER_TYPE = Symbol.for("react.consumer"),
353
+ REACT_CONTEXT_TYPE = Symbol.for("react.context"),
354
+ REACT_FORWARD_REF_TYPE = Symbol.for("react.forward_ref"),
355
+ REACT_SUSPENSE_TYPE = Symbol.for("react.suspense"),
356
+ REACT_SUSPENSE_LIST_TYPE = Symbol.for("react.suspense_list"),
357
+ REACT_MEMO_TYPE = Symbol.for("react.memo"),
358
+ REACT_LAZY_TYPE = Symbol.for("react.lazy"),
359
+ REACT_ACTIVITY_TYPE = Symbol.for("react.activity"),
360
+ REACT_CLIENT_REFERENCE = Symbol.for("react.client.reference"),
361
+ ReactSharedInternals =
362
+ React.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,
363
+ hasOwnProperty = Object.prototype.hasOwnProperty,
364
+ isArrayImpl = Array.isArray,
365
+ createTask = console.createTask
366
+ ? console.createTask
367
+ : function () {
368
+ return null;
369
+ };
370
+ React = {
371
+ react_stack_bottom_frame: function (callStackForError) {
372
+ return callStackForError();
373
+ }
374
+ };
375
+ var specialPropKeyWarningShown;
376
+ var didWarnAboutElementRef = {};
377
+ var unknownOwnerDebugStack = React.react_stack_bottom_frame.bind(
378
+ React,
379
+ UnknownOwner
380
+ )();
381
+ var unknownOwnerDebugTask = createTask(getTaskName(UnknownOwner));
382
+ var didWarnAboutKeySpread = {};
383
+ reactJsxRuntime_development.Fragment = REACT_FRAGMENT_TYPE;
384
+ reactJsxRuntime_development.jsx = function (type, config, maybeKey) {
385
+ var trackActualOwner =
386
+ 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
387
+ return jsxDEVImpl(
388
+ type,
389
+ config,
390
+ maybeKey,
391
+ !1,
392
+ trackActualOwner
393
+ ? Error("react-stack-top-frame")
394
+ : unknownOwnerDebugStack,
395
+ trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
396
+ );
397
+ };
398
+ reactJsxRuntime_development.jsxs = function (type, config, maybeKey) {
399
+ var trackActualOwner =
400
+ 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
401
+ return jsxDEVImpl(
402
+ type,
403
+ config,
404
+ maybeKey,
405
+ !0,
406
+ trackActualOwner
407
+ ? Error("react-stack-top-frame")
408
+ : unknownOwnerDebugStack,
409
+ trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
410
+ );
411
+ };
412
+ })();
413
+ return reactJsxRuntime_development;
414
+ }
415
+
416
+ if (process.env.NODE_ENV === 'production') {
417
+ jsxRuntime.exports = requireReactJsxRuntime_production();
418
+ } else {
419
+ jsxRuntime.exports = requireReactJsxRuntime_development();
420
+ }
421
+
422
+ var jsxRuntimeExports = jsxRuntime.exports;
423
+
424
+ function cn(...inputs) {
425
+ return tailwindMerge.twMerge(clsx.clsx(inputs));
426
+ }
427
+
428
+ const buttonVariants = classVarianceAuthority.cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
429
+ variants: {
430
+ variant: {
431
+ default: 'bg-cerulean-600 text-white hover:bg-cerulean-700 focus-visible:ring-cerulean-600/20',
432
+ destructive: 'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
433
+ outline: 'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',
434
+ secondary: 'border border-cerulean-600 bg-white text-cerulean-600 hover:bg-cerulean-50 focus-visible:ring-cerulean-600/20',
435
+ ghost: 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
436
+ link: 'text-primary underline-offset-4 hover:underline',
437
+ },
438
+ size: {
439
+ default: 'h-9 px-4 py-2 has-[>svg]:px-3',
440
+ xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
441
+ sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',
442
+ lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',
443
+ icon: 'size-9',
444
+ 'icon-xs': "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
445
+ 'icon-sm': 'size-8',
446
+ 'icon-lg': 'size-10',
447
+ },
448
+ },
449
+ defaultVariants: {
450
+ variant: 'default',
451
+ size: 'default',
452
+ },
453
+ });
454
+ function Button({ className, variant = 'default', size = 'default', asChild = false, ...props }) {
455
+ const Comp = asChild ? radixUi.Slot.Root : 'button';
456
+ return (jsxRuntimeExports.jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), "data-size": size, "data-slot": "button", "data-variant": variant, ...props }));
457
+ }
458
+
459
+ function Input({ className, type, ...props }) {
460
+ return (jsxRuntimeExports.jsx("input", { className: cn('border-input selection:bg-primary selection:text-primary-foreground file:text-foreground placeholder:text-muted-foreground dark:bg-input/30 h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]', 'aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40', className), "data-slot": "input", type: type, ...props }));
461
+ }
462
+
463
+ function Spinner({ className, ...props }) {
464
+ return jsxRuntimeExports.jsx(lucideReact.Loader2Icon, { "aria-label": "Loading", className: cn('size-4 animate-spin', className), role: "status", ...props });
465
+ }
466
+
467
+ function Checkbox({ className, ...props }) {
468
+ return (jsxRuntimeExports.jsx(radixUi.Checkbox.Root, { className: cn('peer border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:bg-input/30 dark:aria-invalid:ring-destructive/40 dark:data-[state=checked]:bg-primary size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50', className), "data-slot": "checkbox", ...props, children: jsxRuntimeExports.jsx(radixUi.Checkbox.Indicator, { className: "grid place-content-center text-current transition-none", "data-slot": "checkbox-indicator", children: jsxRuntimeExports.jsx(lucideReact.CheckIcon, { className: "size-3.5" }) }) }));
469
+ }
470
+
471
+ /**
472
+ * A simple boolean toggle hook.
473
+ *
474
+ * @param initial initial value (defaults to false)
475
+ * @returns an object with the current state and helpers to toggle / set on / set off
476
+ */
477
+ function useToggle(initial = false) {
478
+ const [state, setState] = require$$0.useState(initial);
479
+ const toggle = require$$0.useCallback(() => setState((s) => !s), []);
480
+ const setOn = require$$0.useCallback(() => setState(true), []);
481
+ const setOff = require$$0.useCallback(() => setState(false), []);
482
+ return { state, toggle, setOn, setOff };
483
+ }
484
+
485
+ exports.Button = Button;
486
+ exports.Checkbox = Checkbox;
487
+ exports.Input = Input;
488
+ exports.Spinner = Spinner;
489
+ exports.cn = cn;
490
+ exports.useToggle = useToggle;
package/dist/index.css ADDED
@@ -0,0 +1 @@
1
+ /*! tailwindcss v4.1.7 | MIT License | https://tailwindcss.com */@layer theme, base, components, utilities;@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-gray-200:oklch(92.8% 0.006 264.531);--color-white:#fff;--spacing:0.25rem;--text-xs:0.75rem;--text-xs--line-height:1.33333;--text-sm:0.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-base--line-height:1.5;--font-weight-medium:500;--animate-spin:spin 1s linear infinite;--default-transition-duration:150ms;--default-transition-timing-function:cubic-bezier(0.4,0,0.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,::backdrop,::file-selector-button,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:var(--default-font-feature-settings,normal);-webkit-tap-highlight-color:transparent;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:var(--default-mono-font-feature-settings,normal);font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}::file-selector-button,button,input,optgroup,select,textarea{font-feature-settings:inherit;background-color:transparent;border-radius:0;color:inherit;font:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}::file-selector-button,button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.relative{position:relative}.contents{display:contents}.grid{display:grid}.inline-flex{display:inline-flex}.size-3\.5{height:calc(var(--spacing)*3.5);width:calc(var(--spacing)*3.5)}.size-4{height:calc(var(--spacing)*4);width:calc(var(--spacing)*4)}.size-6{height:calc(var(--spacing)*6);width:calc(var(--spacing)*6)}.size-8{height:calc(var(--spacing)*8);width:calc(var(--spacing)*8)}.size-9{height:calc(var(--spacing)*9);width:calc(var(--spacing)*9)}.size-10{height:calc(var(--spacing)*10);width:calc(var(--spacing)*10)}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-9{height:calc(var(--spacing)*9)}.h-10{height:calc(var(--spacing)*10)}.w-full{width:100%}.min-w-0{min-width:calc(var(--spacing)*0)}.shrink-0{flex-shrink:0}.animate-spin{animation:var(--animate-spin)}.place-content-center{place-content:center}.items-center{align-items:center}.justify-center{justify-content:center}.gap-1{gap:calc(var(--spacing)*1)}.gap-1\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.rounded-\[4px\]{border-radius:4px}.rounded-md{border-radius:calc(var(--radius) - 2px)}.border{border-style:var(--tw-border-style);border-width:1px}.border-cerulean-600{border-color:var(--cerulean-600)}.border-input{border-color:var(--input)}.bg-background{background-color:var(--background)}.bg-cerulean-600{background-color:var(--cerulean-600)}.bg-destructive{background-color:var(--destructive)}.bg-transparent{background-color:transparent}.bg-white{background-color:var(--color-white)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-1{padding-block:calc(var(--spacing)*1)}.py-2{padding-block:calc(var(--spacing)*2)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.whitespace-nowrap{white-space:nowrap}.text-cerulean-600{color:var(--cerulean-600)}.text-current{color:currentcolor}.text-primary{color:var(--primary)}.text-white{color:var(--color-white)}.underline-offset-4{text-underline-offset:4px}.shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,rgba(0,0,0,.05));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-\[color\,box-shadow\]{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-all{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-shadow{transition-duration:var(--tw-duration,var(--default-transition-duration));transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function))}.transition-none{transition-property:none}.outline-none{--tw-outline-style:none;outline-style:none}.selection\:bg-primary{& ::-moz-selection{background-color:var(--primary)}& ::selection{background-color:var(--primary)}&::-moz-selection{background-color:var(--primary)}&::selection{background-color:var(--primary)}}.selection\:text-primary-foreground{& ::-moz-selection{color:var(--primary-foreground)}& ::selection{color:var(--primary-foreground)}&::-moz-selection{color:var(--primary-foreground)}&::selection{color:var(--primary-foreground)}}.file\:inline-flex{&::file-selector-button{display:inline-flex}}.file\:h-7{&::file-selector-button{height:calc(var(--spacing)*7)}}.file\:border-0{&::file-selector-button{border-style:var(--tw-border-style);border-width:0}}.file\:bg-transparent{&::file-selector-button{background-color:transparent}}.file\:text-sm{&::file-selector-button{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}.file\:font-medium{&::file-selector-button{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}}.file\:text-foreground{&::file-selector-button{color:var(--foreground)}}.placeholder\:text-muted-foreground{&::-moz-placeholder{color:var(--muted-foreground)}&::placeholder{color:var(--muted-foreground)}}.hover\:bg-accent{&:hover{@media (hover:hover){background-color:var(--accent)}}}.hover\:bg-cerulean-50{&:hover{@media (hover:hover){background-color:var(--cerulean-50)}}}.hover\:bg-cerulean-700{&:hover{@media (hover:hover){background-color:var(--cerulean-700)}}}.hover\:bg-destructive\/90{&:hover{@media (hover:hover){background-color:var(--destructive);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--destructive) 90%,transparent)}}}}.hover\:text-accent-foreground{&:hover{@media (hover:hover){color:var(--accent-foreground)}}}.hover\:underline{&:hover{@media (hover:hover){text-decoration-line:underline}}}.focus-visible\:border-ring{&:focus-visible{border-color:var(--ring)}}.focus-visible\:ring-\[3px\]{&:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + 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)}}.focus-visible\:ring-cerulean-600\/20{&:focus-visible{--tw-ring-color:var(--cerulean-600);@supports (color:color-mix(in lab,red,red)){--tw-ring-color:color-mix(in oklab,var(--cerulean-600) 20%,transparent)}}}.focus-visible\:ring-destructive\/20{&:focus-visible{--tw-ring-color:var(--destructive);@supports (color:color-mix(in lab,red,red)){--tw-ring-color:color-mix(in oklab,var(--destructive) 20%,transparent)}}}.focus-visible\:ring-ring\/50{&:focus-visible{--tw-ring-color:var(--ring);@supports (color:color-mix(in lab,red,red)){--tw-ring-color:color-mix(in oklab,var(--ring) 50%,transparent)}}}.disabled\:pointer-events-none{&:disabled{pointer-events:none}}.disabled\:cursor-not-allowed{&:disabled{cursor:not-allowed}}.disabled\:opacity-50{&:disabled{opacity:50%}}.has-\[\>svg\]\:px-1\.5{&:has(>svg){padding-inline:calc(var(--spacing)*1.5)}}.has-\[\>svg\]\:px-2\.5{&:has(>svg){padding-inline:calc(var(--spacing)*2.5)}}.has-\[\>svg\]\:px-3{&:has(>svg){padding-inline:calc(var(--spacing)*3)}}.has-\[\>svg\]\:px-4{&:has(>svg){padding-inline:calc(var(--spacing)*4)}}.aria-invalid\:border-destructive{&[aria-invalid=true]{border-color:var(--destructive)}}.aria-invalid\:ring-destructive\/20{&[aria-invalid=true]{--tw-ring-color:var(--destructive);@supports (color:color-mix(in lab,red,red)){--tw-ring-color:color-mix(in oklab,var(--destructive) 20%,transparent)}}}.data-\[state\=checked\]\:border-primary{&[data-state=checked]{border-color:var(--primary)}}.data-\[state\=checked\]\:bg-primary{&[data-state=checked]{background-color:var(--primary)}}.data-\[state\=checked\]\:text-primary-foreground{&[data-state=checked]{color:var(--primary-foreground)}}.dark\:border-input,.md\:text-sm{&:is(.dark *){border-color:var(--input)}}.dark\:bg-destructive\/60{&:is(.dark *){background-color:var(--destructive);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--destructive) 60%,transparent)}}}.dark\:bg-input\/30{&:is(.dark *){background-color:var(--input);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--input) 30%,transparent)}}}.dark\:hover\:bg-accent\/50{&:is(.dark *){&:hover{@media (hover:hover){background-color:var(--accent);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--accent) 50%,transparent)}}}}}.dark\:hover\:bg-input\/50{&:is(.dark *){&:hover{@media (hover:hover){background-color:var(--input);@supports (color:color-mix(in lab,red,red)){background-color:color-mix(in oklab,var(--input) 50%,transparent)}}}}}.dark\:focus-visible\:ring-destructive\/40{&:is(.dark *){&:focus-visible{--tw-ring-color:var(--destructive);@supports (color:color-mix(in lab,red,red)){--tw-ring-color:color-mix(in oklab,var(--destructive) 40%,transparent)}}}}.dark\:aria-invalid\:ring-destructive\/40{&:is(.dark *){&[aria-invalid=true]{--tw-ring-color:var(--destructive);@supports (color:color-mix(in lab,red,red)){--tw-ring-color:color-mix(in oklab,var(--destructive) 40%,transparent)}}}}.dark\:data-\[state\=checked\]\:bg-primary{&:is(.dark *){&[data-state=checked]{background-color:var(--primary)}}}.\[\&_svg\]\:pointer-events-none{& svg{pointer-events:none}}.\[\&_svg\]\:shrink-0{& svg{flex-shrink:0}}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3{& svg:not([class*=size-]){height:calc(var(--spacing)*3);width:calc(var(--spacing)*3)}}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4{& svg:not([class*=size-]){height:calc(var(--spacing)*4);width:calc(var(--spacing)*4)}}}@property --tw-animation-delay{syntax:"*";inherits:false;initial-value:0s}@property --tw-animation-direction{syntax:"*";inherits:false;initial-value:normal}@property --tw-animation-duration{syntax:"*";inherits:false}@property --tw-animation-fill-mode{syntax:"*";inherits:false;initial-value:none}@property --tw-animation-iteration-count{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-translate-y{syntax:"*";inherits:false;initial-value:0}@layer base{*,::backdrop,::file-selector-button,:after,:before{border-color:var(--color-gray-200,currentcolor)}*{border-color:var(--border);outline-color:var(--ring);@supports (color:color-mix(in lab,red,red)){outline-color:color-mix(in oklab,var(--ring) 50%,transparent)}}body{background-color:var(--background);color:var(--foreground)}}:root{--radius:0.625rem;--background:oklch(1 0 0);--foreground:oklch(0.145 0 0);--card:oklch(1 0 0);--card-foreground:oklch(0.145 0 0);--popover:oklch(1 0 0);--popover-foreground:oklch(0.145 0 0);--primary:oklch(0.205 0 0);--primary-foreground:oklch(0.985 0 0);--secondary:oklch(0.97 0 0);--secondary-foreground:oklch(0.205 0 0);--muted:oklch(0.97 0 0);--muted-foreground:oklch(0.556 0 0);--accent:oklch(0.97 0 0);--accent-foreground:oklch(0.205 0 0);--destructive:oklch(0.577 0.245 27.325);--border:oklch(0.922 0 0);--input:oklch(0.922 0 0);--ring:oklch(0.708 0 0);--chart-1:oklch(0.646 0.222 41.116);--chart-2:oklch(0.6 0.118 184.704);--chart-3:oklch(0.398 0.07 227.392);--chart-4:oklch(0.828 0.189 84.429);--chart-5:oklch(0.769 0.188 70.08);--sidebar:oklch(0.985 0 0);--sidebar-foreground:oklch(0.145 0 0);--sidebar-primary:oklch(0.205 0 0);--sidebar-primary-foreground:oklch(0.985 0 0);--sidebar-accent:oklch(0.97 0 0);--sidebar-accent-foreground:oklch(0.205 0 0);--sidebar-border:oklch(0.922 0 0);--sidebar-ring:oklch(0.708 0 0);--cerulean-50:#eef7ff;--cerulean-100:#d9edff;--cerulean-200:#bbe1ff;--cerulean-300:#8dceff;--cerulean-400:#57b2ff;--cerulean-500:#3090ff;--cerulean-600:#1a71f6;--cerulean-700:#1154d4;--cerulean-800:#184190;--cerulean-900:#132958}.dark{--background:oklch(0.145 0 0);--foreground:oklch(0.985 0 0);--card:oklch(0.205 0 0);--card-foreground:oklch(0.985 0 0);--popover:oklch(0.205 0 0);--popover-foreground:oklch(0.985 0 0);--primary:oklch(0.922 0 0);--primary-foreground:oklch(0.205 0 0);--secondary:oklch(0.269 0 0);--secondary-foreground:oklch(0.985 0 0);--muted:oklch(0.269 0 0);--muted-foreground:oklch(0.708 0 0);--accent:oklch(0.269 0 0);--accent-foreground:oklch(0.985 0 0);--destructive:oklch(0.704 0.191 22.216);--border:oklch(1 0 0/10%);--input:oklch(1 0 0/15%);--ring:oklch(0.556 0 0);--chart-1:oklch(0.488 0.243 264.376);--chart-2:oklch(0.696 0.17 162.48);--chart-3:oklch(0.769 0.188 70.08);--chart-4:oklch(0.627 0.265 303.9);--chart-5:oklch(0.645 0.246 16.439);--sidebar:oklch(0.205 0 0);--sidebar-foreground:oklch(0.985 0 0);--sidebar-primary:oklch(0.488 0.243 264.376);--sidebar-primary-foreground:oklch(0.985 0 0);--sidebar-accent:oklch(0.269 0 0);--sidebar-accent-foreground:oklch(0.985 0 0);--sidebar-border:oklch(1 0 0/10%);--sidebar-ring:oklch(0.556 0 0);--cerulean-50:#eef7ff;--cerulean-100:#d9edff;--cerulean-200:#bbe1ff;--cerulean-300:#8dceff;--cerulean-400:#57b2ff;--cerulean-500:#3090ff;--cerulean-600:#1a71f6;--cerulean-700:#1154d4;--cerulean-800:#184190;--cerulean-900:#132958}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@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-outline-style{syntax:"*";inherits:false;initial-value:solid}@keyframes spin{to{transform:rotate(1turn)}}@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-border-style:solid;--tw-font-weight:initial;--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-outline-style:solid;--tw-animation-delay:0s;--tw-animation-direction:normal;--tw-animation-duration:initial;--tw-animation-fill-mode:none;--tw-animation-iteration-count:1;--tw-enter-blur:0;--tw-enter-opacity:1;--tw-enter-rotate:0;--tw-enter-scale:1;--tw-enter-translate-x:0;--tw-enter-translate-y:0;--tw-exit-blur:0;--tw-exit-opacity:1;--tw-exit-rotate:0;--tw-exit-scale:1;--tw-exit-translate-x:0;--tw-exit-translate-y:0}}}
@@ -0,0 +1,4 @@
1
+ export * from './components';
2
+ export * from './hooks';
3
+ export * from './lib';
4
+ import './index.css';
package/dist/index.js ADDED
@@ -0,0 +1,483 @@
1
+ import require$$0, { useState, useCallback } from 'react';
2
+ import { cva } from 'class-variance-authority';
3
+ import { Slot, Checkbox as Checkbox$1 } from 'radix-ui';
4
+ import { clsx } from 'clsx';
5
+ import { twMerge } from 'tailwind-merge';
6
+ import { Loader2Icon, CheckIcon } from 'lucide-react';
7
+
8
+ var jsxRuntime = {exports: {}};
9
+
10
+ var reactJsxRuntime_production = {};
11
+
12
+ /**
13
+ * @license React
14
+ * react-jsx-runtime.production.js
15
+ *
16
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
17
+ *
18
+ * This source code is licensed under the MIT license found in the
19
+ * LICENSE file in the root directory of this source tree.
20
+ */
21
+
22
+ var hasRequiredReactJsxRuntime_production;
23
+
24
+ function requireReactJsxRuntime_production () {
25
+ if (hasRequiredReactJsxRuntime_production) return reactJsxRuntime_production;
26
+ hasRequiredReactJsxRuntime_production = 1;
27
+ var REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"),
28
+ REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
29
+ function jsxProd(type, config, maybeKey) {
30
+ var key = null;
31
+ void 0 !== maybeKey && (key = "" + maybeKey);
32
+ void 0 !== config.key && (key = "" + config.key);
33
+ if ("key" in config) {
34
+ maybeKey = {};
35
+ for (var propName in config)
36
+ "key" !== propName && (maybeKey[propName] = config[propName]);
37
+ } else maybeKey = config;
38
+ config = maybeKey.ref;
39
+ return {
40
+ $$typeof: REACT_ELEMENT_TYPE,
41
+ type: type,
42
+ key: key,
43
+ ref: void 0 !== config ? config : null,
44
+ props: maybeKey
45
+ };
46
+ }
47
+ reactJsxRuntime_production.Fragment = REACT_FRAGMENT_TYPE;
48
+ reactJsxRuntime_production.jsx = jsxProd;
49
+ reactJsxRuntime_production.jsxs = jsxProd;
50
+ return reactJsxRuntime_production;
51
+ }
52
+
53
+ var reactJsxRuntime_development = {};
54
+
55
+ /**
56
+ * @license React
57
+ * react-jsx-runtime.development.js
58
+ *
59
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
60
+ *
61
+ * This source code is licensed under the MIT license found in the
62
+ * LICENSE file in the root directory of this source tree.
63
+ */
64
+
65
+ var hasRequiredReactJsxRuntime_development;
66
+
67
+ function requireReactJsxRuntime_development () {
68
+ if (hasRequiredReactJsxRuntime_development) return reactJsxRuntime_development;
69
+ hasRequiredReactJsxRuntime_development = 1;
70
+ "production" !== process.env.NODE_ENV &&
71
+ (function () {
72
+ function getComponentNameFromType(type) {
73
+ if (null == type) return null;
74
+ if ("function" === typeof type)
75
+ return type.$$typeof === REACT_CLIENT_REFERENCE
76
+ ? null
77
+ : type.displayName || type.name || null;
78
+ if ("string" === typeof type) return type;
79
+ switch (type) {
80
+ case REACT_FRAGMENT_TYPE:
81
+ return "Fragment";
82
+ case REACT_PROFILER_TYPE:
83
+ return "Profiler";
84
+ case REACT_STRICT_MODE_TYPE:
85
+ return "StrictMode";
86
+ case REACT_SUSPENSE_TYPE:
87
+ return "Suspense";
88
+ case REACT_SUSPENSE_LIST_TYPE:
89
+ return "SuspenseList";
90
+ case REACT_ACTIVITY_TYPE:
91
+ return "Activity";
92
+ }
93
+ if ("object" === typeof type)
94
+ switch (
95
+ ("number" === typeof type.tag &&
96
+ console.error(
97
+ "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
98
+ ),
99
+ type.$$typeof)
100
+ ) {
101
+ case REACT_PORTAL_TYPE:
102
+ return "Portal";
103
+ case REACT_CONTEXT_TYPE:
104
+ return type.displayName || "Context";
105
+ case REACT_CONSUMER_TYPE:
106
+ return (type._context.displayName || "Context") + ".Consumer";
107
+ case REACT_FORWARD_REF_TYPE:
108
+ var innerType = type.render;
109
+ type = type.displayName;
110
+ type ||
111
+ ((type = innerType.displayName || innerType.name || ""),
112
+ (type = "" !== type ? "ForwardRef(" + type + ")" : "ForwardRef"));
113
+ return type;
114
+ case REACT_MEMO_TYPE:
115
+ return (
116
+ (innerType = type.displayName || null),
117
+ null !== innerType
118
+ ? innerType
119
+ : getComponentNameFromType(type.type) || "Memo"
120
+ );
121
+ case REACT_LAZY_TYPE:
122
+ innerType = type._payload;
123
+ type = type._init;
124
+ try {
125
+ return getComponentNameFromType(type(innerType));
126
+ } catch (x) {}
127
+ }
128
+ return null;
129
+ }
130
+ function testStringCoercion(value) {
131
+ return "" + value;
132
+ }
133
+ function checkKeyStringCoercion(value) {
134
+ try {
135
+ testStringCoercion(value);
136
+ var JSCompiler_inline_result = !1;
137
+ } catch (e) {
138
+ JSCompiler_inline_result = !0;
139
+ }
140
+ if (JSCompiler_inline_result) {
141
+ JSCompiler_inline_result = console;
142
+ var JSCompiler_temp_const = JSCompiler_inline_result.error;
143
+ var JSCompiler_inline_result$jscomp$0 =
144
+ ("function" === typeof Symbol &&
145
+ Symbol.toStringTag &&
146
+ value[Symbol.toStringTag]) ||
147
+ value.constructor.name ||
148
+ "Object";
149
+ JSCompiler_temp_const.call(
150
+ JSCompiler_inline_result,
151
+ "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
152
+ JSCompiler_inline_result$jscomp$0
153
+ );
154
+ return testStringCoercion(value);
155
+ }
156
+ }
157
+ function getTaskName(type) {
158
+ if (type === REACT_FRAGMENT_TYPE) return "<>";
159
+ if (
160
+ "object" === typeof type &&
161
+ null !== type &&
162
+ type.$$typeof === REACT_LAZY_TYPE
163
+ )
164
+ return "<...>";
165
+ try {
166
+ var name = getComponentNameFromType(type);
167
+ return name ? "<" + name + ">" : "<...>";
168
+ } catch (x) {
169
+ return "<...>";
170
+ }
171
+ }
172
+ function getOwner() {
173
+ var dispatcher = ReactSharedInternals.A;
174
+ return null === dispatcher ? null : dispatcher.getOwner();
175
+ }
176
+ function UnknownOwner() {
177
+ return Error("react-stack-top-frame");
178
+ }
179
+ function hasValidKey(config) {
180
+ if (hasOwnProperty.call(config, "key")) {
181
+ var getter = Object.getOwnPropertyDescriptor(config, "key").get;
182
+ if (getter && getter.isReactWarning) return !1;
183
+ }
184
+ return void 0 !== config.key;
185
+ }
186
+ function defineKeyPropWarningGetter(props, displayName) {
187
+ function warnAboutAccessingKey() {
188
+ specialPropKeyWarningShown ||
189
+ ((specialPropKeyWarningShown = !0),
190
+ console.error(
191
+ "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
192
+ displayName
193
+ ));
194
+ }
195
+ warnAboutAccessingKey.isReactWarning = !0;
196
+ Object.defineProperty(props, "key", {
197
+ get: warnAboutAccessingKey,
198
+ configurable: !0
199
+ });
200
+ }
201
+ function elementRefGetterWithDeprecationWarning() {
202
+ var componentName = getComponentNameFromType(this.type);
203
+ didWarnAboutElementRef[componentName] ||
204
+ ((didWarnAboutElementRef[componentName] = !0),
205
+ console.error(
206
+ "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
207
+ ));
208
+ componentName = this.props.ref;
209
+ return void 0 !== componentName ? componentName : null;
210
+ }
211
+ function ReactElement(type, key, props, owner, debugStack, debugTask) {
212
+ var refProp = props.ref;
213
+ type = {
214
+ $$typeof: REACT_ELEMENT_TYPE,
215
+ type: type,
216
+ key: key,
217
+ props: props,
218
+ _owner: owner
219
+ };
220
+ null !== (void 0 !== refProp ? refProp : null)
221
+ ? Object.defineProperty(type, "ref", {
222
+ enumerable: !1,
223
+ get: elementRefGetterWithDeprecationWarning
224
+ })
225
+ : Object.defineProperty(type, "ref", { enumerable: !1, value: null });
226
+ type._store = {};
227
+ Object.defineProperty(type._store, "validated", {
228
+ configurable: !1,
229
+ enumerable: !1,
230
+ writable: !0,
231
+ value: 0
232
+ });
233
+ Object.defineProperty(type, "_debugInfo", {
234
+ configurable: !1,
235
+ enumerable: !1,
236
+ writable: !0,
237
+ value: null
238
+ });
239
+ Object.defineProperty(type, "_debugStack", {
240
+ configurable: !1,
241
+ enumerable: !1,
242
+ writable: !0,
243
+ value: debugStack
244
+ });
245
+ Object.defineProperty(type, "_debugTask", {
246
+ configurable: !1,
247
+ enumerable: !1,
248
+ writable: !0,
249
+ value: debugTask
250
+ });
251
+ Object.freeze && (Object.freeze(type.props), Object.freeze(type));
252
+ return type;
253
+ }
254
+ function jsxDEVImpl(
255
+ type,
256
+ config,
257
+ maybeKey,
258
+ isStaticChildren,
259
+ debugStack,
260
+ debugTask
261
+ ) {
262
+ var children = config.children;
263
+ if (void 0 !== children)
264
+ if (isStaticChildren)
265
+ if (isArrayImpl(children)) {
266
+ for (
267
+ isStaticChildren = 0;
268
+ isStaticChildren < children.length;
269
+ isStaticChildren++
270
+ )
271
+ validateChildKeys(children[isStaticChildren]);
272
+ Object.freeze && Object.freeze(children);
273
+ } else
274
+ console.error(
275
+ "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
276
+ );
277
+ else validateChildKeys(children);
278
+ if (hasOwnProperty.call(config, "key")) {
279
+ children = getComponentNameFromType(type);
280
+ var keys = Object.keys(config).filter(function (k) {
281
+ return "key" !== k;
282
+ });
283
+ isStaticChildren =
284
+ 0 < keys.length
285
+ ? "{key: someKey, " + keys.join(": ..., ") + ": ...}"
286
+ : "{key: someKey}";
287
+ didWarnAboutKeySpread[children + isStaticChildren] ||
288
+ ((keys =
289
+ 0 < keys.length ? "{" + keys.join(": ..., ") + ": ...}" : "{}"),
290
+ console.error(
291
+ 'A props object containing a "key" prop is being spread into JSX:\n let props = %s;\n <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n let props = %s;\n <%s key={someKey} {...props} />',
292
+ isStaticChildren,
293
+ children,
294
+ keys,
295
+ children
296
+ ),
297
+ (didWarnAboutKeySpread[children + isStaticChildren] = !0));
298
+ }
299
+ children = null;
300
+ void 0 !== maybeKey &&
301
+ (checkKeyStringCoercion(maybeKey), (children = "" + maybeKey));
302
+ hasValidKey(config) &&
303
+ (checkKeyStringCoercion(config.key), (children = "" + config.key));
304
+ if ("key" in config) {
305
+ maybeKey = {};
306
+ for (var propName in config)
307
+ "key" !== propName && (maybeKey[propName] = config[propName]);
308
+ } else maybeKey = config;
309
+ children &&
310
+ defineKeyPropWarningGetter(
311
+ maybeKey,
312
+ "function" === typeof type
313
+ ? type.displayName || type.name || "Unknown"
314
+ : type
315
+ );
316
+ return ReactElement(
317
+ type,
318
+ children,
319
+ maybeKey,
320
+ getOwner(),
321
+ debugStack,
322
+ debugTask
323
+ );
324
+ }
325
+ function validateChildKeys(node) {
326
+ isValidElement(node)
327
+ ? node._store && (node._store.validated = 1)
328
+ : "object" === typeof node &&
329
+ null !== node &&
330
+ node.$$typeof === REACT_LAZY_TYPE &&
331
+ ("fulfilled" === node._payload.status
332
+ ? isValidElement(node._payload.value) &&
333
+ node._payload.value._store &&
334
+ (node._payload.value._store.validated = 1)
335
+ : node._store && (node._store.validated = 1));
336
+ }
337
+ function isValidElement(object) {
338
+ return (
339
+ "object" === typeof object &&
340
+ null !== object &&
341
+ object.$$typeof === REACT_ELEMENT_TYPE
342
+ );
343
+ }
344
+ var React = require$$0,
345
+ REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"),
346
+ REACT_PORTAL_TYPE = Symbol.for("react.portal"),
347
+ REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"),
348
+ REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"),
349
+ REACT_PROFILER_TYPE = Symbol.for("react.profiler"),
350
+ REACT_CONSUMER_TYPE = Symbol.for("react.consumer"),
351
+ REACT_CONTEXT_TYPE = Symbol.for("react.context"),
352
+ REACT_FORWARD_REF_TYPE = Symbol.for("react.forward_ref"),
353
+ REACT_SUSPENSE_TYPE = Symbol.for("react.suspense"),
354
+ REACT_SUSPENSE_LIST_TYPE = Symbol.for("react.suspense_list"),
355
+ REACT_MEMO_TYPE = Symbol.for("react.memo"),
356
+ REACT_LAZY_TYPE = Symbol.for("react.lazy"),
357
+ REACT_ACTIVITY_TYPE = Symbol.for("react.activity"),
358
+ REACT_CLIENT_REFERENCE = Symbol.for("react.client.reference"),
359
+ ReactSharedInternals =
360
+ React.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,
361
+ hasOwnProperty = Object.prototype.hasOwnProperty,
362
+ isArrayImpl = Array.isArray,
363
+ createTask = console.createTask
364
+ ? console.createTask
365
+ : function () {
366
+ return null;
367
+ };
368
+ React = {
369
+ react_stack_bottom_frame: function (callStackForError) {
370
+ return callStackForError();
371
+ }
372
+ };
373
+ var specialPropKeyWarningShown;
374
+ var didWarnAboutElementRef = {};
375
+ var unknownOwnerDebugStack = React.react_stack_bottom_frame.bind(
376
+ React,
377
+ UnknownOwner
378
+ )();
379
+ var unknownOwnerDebugTask = createTask(getTaskName(UnknownOwner));
380
+ var didWarnAboutKeySpread = {};
381
+ reactJsxRuntime_development.Fragment = REACT_FRAGMENT_TYPE;
382
+ reactJsxRuntime_development.jsx = function (type, config, maybeKey) {
383
+ var trackActualOwner =
384
+ 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
385
+ return jsxDEVImpl(
386
+ type,
387
+ config,
388
+ maybeKey,
389
+ !1,
390
+ trackActualOwner
391
+ ? Error("react-stack-top-frame")
392
+ : unknownOwnerDebugStack,
393
+ trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
394
+ );
395
+ };
396
+ reactJsxRuntime_development.jsxs = function (type, config, maybeKey) {
397
+ var trackActualOwner =
398
+ 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
399
+ return jsxDEVImpl(
400
+ type,
401
+ config,
402
+ maybeKey,
403
+ !0,
404
+ trackActualOwner
405
+ ? Error("react-stack-top-frame")
406
+ : unknownOwnerDebugStack,
407
+ trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
408
+ );
409
+ };
410
+ })();
411
+ return reactJsxRuntime_development;
412
+ }
413
+
414
+ if (process.env.NODE_ENV === 'production') {
415
+ jsxRuntime.exports = requireReactJsxRuntime_production();
416
+ } else {
417
+ jsxRuntime.exports = requireReactJsxRuntime_development();
418
+ }
419
+
420
+ var jsxRuntimeExports = jsxRuntime.exports;
421
+
422
+ function cn(...inputs) {
423
+ return twMerge(clsx(inputs));
424
+ }
425
+
426
+ const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
427
+ variants: {
428
+ variant: {
429
+ default: 'bg-cerulean-600 text-white hover:bg-cerulean-700 focus-visible:ring-cerulean-600/20',
430
+ destructive: 'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
431
+ outline: 'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',
432
+ secondary: 'border border-cerulean-600 bg-white text-cerulean-600 hover:bg-cerulean-50 focus-visible:ring-cerulean-600/20',
433
+ ghost: 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
434
+ link: 'text-primary underline-offset-4 hover:underline',
435
+ },
436
+ size: {
437
+ default: 'h-9 px-4 py-2 has-[>svg]:px-3',
438
+ xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
439
+ sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',
440
+ lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',
441
+ icon: 'size-9',
442
+ 'icon-xs': "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
443
+ 'icon-sm': 'size-8',
444
+ 'icon-lg': 'size-10',
445
+ },
446
+ },
447
+ defaultVariants: {
448
+ variant: 'default',
449
+ size: 'default',
450
+ },
451
+ });
452
+ function Button({ className, variant = 'default', size = 'default', asChild = false, ...props }) {
453
+ const Comp = asChild ? Slot.Root : 'button';
454
+ return (jsxRuntimeExports.jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), "data-size": size, "data-slot": "button", "data-variant": variant, ...props }));
455
+ }
456
+
457
+ function Input({ className, type, ...props }) {
458
+ return (jsxRuntimeExports.jsx("input", { className: cn('border-input selection:bg-primary selection:text-primary-foreground file:text-foreground placeholder:text-muted-foreground dark:bg-input/30 h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]', 'aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40', className), "data-slot": "input", type: type, ...props }));
459
+ }
460
+
461
+ function Spinner({ className, ...props }) {
462
+ return jsxRuntimeExports.jsx(Loader2Icon, { "aria-label": "Loading", className: cn('size-4 animate-spin', className), role: "status", ...props });
463
+ }
464
+
465
+ function Checkbox({ className, ...props }) {
466
+ return (jsxRuntimeExports.jsx(Checkbox$1.Root, { className: cn('peer border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:bg-input/30 dark:aria-invalid:ring-destructive/40 dark:data-[state=checked]:bg-primary size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50', className), "data-slot": "checkbox", ...props, children: jsxRuntimeExports.jsx(Checkbox$1.Indicator, { className: "grid place-content-center text-current transition-none", "data-slot": "checkbox-indicator", children: jsxRuntimeExports.jsx(CheckIcon, { className: "size-3.5" }) }) }));
467
+ }
468
+
469
+ /**
470
+ * A simple boolean toggle hook.
471
+ *
472
+ * @param initial initial value (defaults to false)
473
+ * @returns an object with the current state and helpers to toggle / set on / set off
474
+ */
475
+ function useToggle(initial = false) {
476
+ const [state, setState] = useState(initial);
477
+ const toggle = useCallback(() => setState((s) => !s), []);
478
+ const setOn = useCallback(() => setState(true), []);
479
+ const setOff = useCallback(() => setState(false), []);
480
+ return { state, toggle, setOn, setOff };
481
+ }
482
+
483
+ export { Button, Checkbox, Input, Spinner, cn, useToggle };
@@ -0,0 +1 @@
1
+ export { cn } from './utils';
@@ -0,0 +1,2 @@
1
+ import { type ClassValue } from 'clsx';
2
+ export declare function cn(...inputs: ClassValue[]): string;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@khanhminh/design-system",
3
3
  "description": "A reusable React component library built with TypeScript, Tailwind CSS, and Radix UI",
4
- "version": "1.7.0",
4
+ "version": "1.9.0",
5
5
  "type": "module",
6
6
  "private": false,
7
7
  "main": "dist/index.cjs",