@minimalstuff/ui 1.0.0 → 1.1.1

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 (4) hide show
  1. package/dist/index.d.ts +38 -2
  2. package/dist/minimalstuff-ui.css +1 -1
  3. package/dist/minimalstuff-ui.js +294 -154
  4. package/package.json +25 -22
package/dist/index.d.ts CHANGED
@@ -7,13 +7,14 @@ import { JSXElementConstructor } from 'react';
7
7
  import { ReactElement } from 'react';
8
8
  import { ReactNode } from 'react';
9
9
  import { ReactPortal } from 'react';
10
+ import { SelectHTMLAttributes } from 'react';
10
11
  import { TextareaHTMLAttributes } from 'react';
11
12
 
12
13
  export declare function applyTheme(newTheme: Theme_2): void;
13
14
 
14
15
  export declare const BASE_INPUT_STYLES = "w-full rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed";
15
16
 
16
- export declare const Button: ({ variant, size, children, className, fullWidth, disabled, ...props }: ButtonProps) => JSX.Element;
17
+ export declare const Button: ({ variant, size, children, className, fullWidth, loading, disabled, ...props }: ButtonProps) => JSX.Element;
17
18
 
18
19
  declare interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
19
20
  variant?: ButtonVariant;
@@ -21,6 +22,7 @@ declare interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
21
22
  children: ReactNode;
22
23
  className?: string;
23
24
  fullWidth?: boolean;
25
+ loading?: boolean;
24
26
  }
25
27
 
26
28
  declare type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';
@@ -37,6 +39,15 @@ declare interface CharacterCountProps {
37
39
  showMax?: boolean;
38
40
  }
39
41
 
42
+ export declare function Checkbox({ label, error, className, wrapperClassName, checked, defaultChecked, onChange, id, ...props }: CheckboxProps): JSX.Element;
43
+
44
+ declare interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'className'> {
45
+ label?: string;
46
+ error?: string;
47
+ className?: string;
48
+ wrapperClassName?: string;
49
+ }
50
+
40
51
  export declare function ClientOnly({ children, fallback }: ClientOnlyProps): string | number | bigint | boolean | ReactElement<unknown, string | JSXElementConstructor<any>> | Iterable<ReactNode> | Promise<string | number | bigint | boolean | ReactPortal | ReactElement<unknown, string | JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | FunctionComponentElement<FragmentProps> | null;
41
52
 
42
53
  declare interface ClientOnlyProps extends React.PropsWithChildren {
@@ -48,7 +59,7 @@ export declare const IconButton: ({ icon, "aria-label": ariaLabel, variant, size
48
59
  declare interface IconButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
49
60
  icon: string;
50
61
  'aria-label': string;
51
- variant?: 'default' | 'ghost' | 'danger' | 'outline';
62
+ variant?: 'default' | 'ghost' | 'danger' | 'outline' | 'subtle';
52
63
  size?: 'sm' | 'md' | 'lg';
53
64
  children?: ReactNode;
54
65
  ref?: React.Ref<HTMLButtonElement>;
@@ -77,6 +88,31 @@ declare interface ModalProps {
77
88
  className?: string;
78
89
  }
79
90
 
91
+ export declare function Select({ options, label, error, placeholder, className, wrapperClassName, value, defaultValue, onChange, id, ...props }: SelectProps): JSX.Element;
92
+
93
+ export declare interface SelectOption {
94
+ value: string;
95
+ label: string;
96
+ }
97
+
98
+ declare interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'children'> {
99
+ options: SelectOption[];
100
+ label?: string;
101
+ error?: string;
102
+ placeholder?: string;
103
+ className?: string;
104
+ wrapperClassName?: string;
105
+ }
106
+
107
+ export declare function Switch({ label, error, className, wrapperClassName, checked, defaultChecked, onChange, id, ...props }: SwitchProps): JSX.Element;
108
+
109
+ declare interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'className'> {
110
+ label?: string;
111
+ error?: string;
112
+ className?: string;
113
+ wrapperClassName?: string;
114
+ }
115
+
80
116
  export declare interface TabItem {
81
117
  title: string;
82
118
  content: ReactNode;
package/dist/minimalstuff-ui.css CHANGED
@@ -1,2 +1,2 @@
1
- @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{--un-bg-opacity:100%;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-translate-x:initial;--un-translate-y:initial;--un-translate-z:initial;--un-text-opacity:100%;--un-border-opacity:100%;--un-ring-opacity:100%;--un-ring-offset-opacity:100%;--un-placeholder-opacity:100%}}@property --un-text-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --un-border-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-bg-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-ring-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-ring-offset-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-inset-ring-color{syntax:"*";inherits:false}@property --un-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow-color{syntax:"*";inherits:false}@property --un-ring-color{syntax:"*";inherits:false}@property --un-ring-inset{syntax:"*";inherits:false}@property --un-ring-offset-color{syntax:"*";inherits:false}@property --un-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --un-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow-color{syntax:"*";inherits:false}@property --un-translate-x{syntax:"*";inherits:false;initial-value:0}@property --un-translate-y{syntax:"*";inherits:false;initial-value:0}@property --un-translate-z{syntax:"*";inherits:false;initial-value:0}@property --un-scale-x{syntax:"*";inherits:false;initial-value:1}@property --un-scale-y{syntax:"*";inherits:false;initial-value:1}@property --un-scale-z{syntax:"*";inherits:false;initial-value:1}@property --un-backdrop-blur{syntax:"*";inherits:false}@property --un-backdrop-brightness{syntax:"*";inherits:false}@property --un-backdrop-contrast{syntax:"*";inherits:false}@property --un-backdrop-grayscale{syntax:"*";inherits:false}@property --un-backdrop-hue-rotate{syntax:"*";inherits:false}@property --un-backdrop-invert{syntax:"*";inherits:false}@property --un-backdrop-opacity{syntax:"*";inherits:false}@property --un-backdrop-saturate{syntax:"*";inherits:false}@property --un-backdrop-sepia{syntax:"*";inherits:false}@property --un-placeholder-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}:root,:host{--spacing:.25rem;--radius-md:.375rem;--fontWeight-medium:500;--default-transition-timingFunction:cubic-bezier(.4, 0, .2, 1);--default-transition-duration:.15s;--radius-lg:.5rem;--radius-DEFAULT:.25rem;--container-md:28rem;--container-lg:32rem;--container-2xl:42rem;--container-4xl:56rem;--colors-black:#000;--fontWeight-semibold:600;--colors-gray-500:#6a7282;--colors-amber-600:#dd7400;--colors-red-600:#e40014;--colors-blue-600:#155dfc;--colors-white:#fff;--colors-gray-200:#e5e7eb;--colors-gray-900:#101828;--colors-gray-700:#364153;--colors-gray-300:#d1d5dc;--colors-gray-100:#f3f4f6;--colors-red-500:#fb2c36;--colors-gray-600:#4a5565;--colors-yellow-500:#edb200;--colors-blue-500:#3080ff;--colors-gray-400:#99a1af;--text-xs-fontSize:.75rem;--text-xs-lineHeight:1rem;--text-sm-fontSize:.875rem;--text-sm-lineHeight:1.25rem;--text-base-fontSize:1rem;--text-base-lineHeight:1.5rem;--text-lg-fontSize:1.125rem;--text-lg-lineHeight:1.75rem;--colors-blue-700:#1447e6;--colors-gray-50:#f9fafb;--colors-red-700:#bf000f;--colors-red-50:#fef2f2;--colors-gray-800:#1e2939;--colors-amber-400:#fcbb00;--colors-red-400:#ff6568;--colors-blue-400:#54a2ff;--colors-red-900:#82181a;--font-sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",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;--default-font-family:var(--font-sans);--default-monoFont-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--colors-gray-500:lab(47.7841% -.393182 -10.0268);--colors-amber-600:lab(60.3514% 40.5624 87.1228);--colors-red-600:lab(48.4493% 77.4328 61.5452);--colors-blue-600:lab(44.0605% 29.0279 -86.0352);--colors-gray-200:lab(91.6229% -.159115 -2.26791);--colors-gray-900:lab(8.11897% .811279 -12.254);--colors-gray-700:lab(27.1134% -.956401 -12.3224);--colors-gray-300:lab(85.1236% -.612259 -3.7138);--colors-gray-100:lab(96.1596% -.0823438 -1.13575);--colors-red-500:lab(55.4814% 75.0732 48.8528);--colors-gray-600:lab(35.6337% -1.58697 -10.8425);--colors-yellow-500:lab(76.3898% 14.5258 98.4589);--colors-blue-500:lab(54.1736% 13.3369 -74.6839);--colors-gray-400:lab(65.9269% -.832707 -8.17473);--colors-blue-700:lab(36.9089% 35.0961 -85.6872);--colors-gray-50:lab(98.2596% -.247031 -.706708);--colors-red-700:lab(40.4273% 67.2623 53.7441);--colors-red-50:lab(96.5005% 4.18508 1.52328);--colors-gray-800:lab(16.1051% -1.18239 -11.7533);--colors-amber-400:lab(80.1641% 16.6016 99.2089);--colors-red-400:lab(63.7053% 60.745 31.3109);--colors-blue-400:lab(65.0361% -1.42065 -56.9802);--colors-red-900:lab(28.5139% 44.5539 29.0463)}}*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;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-feature-settings:var(--default-font-featureSettings,normal);font-variation-settings:var(--default-font-variationSettings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}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;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-monoFont-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-monoFont-featureSettings,normal);font-variation-settings:var(--default-monoFont-variationSettings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}: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}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{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{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden~=until-found])){display:none!important}.i-mdi-close{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12z'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;color:inherit;background-color:currentColor;width:1em;height:1em;-webkit-mask-size:100% 100%;mask-size:100% 100%}.i-tabler-device-desktop{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 5a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1zm4 15h10m-8-4v4m6-4v4'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;color:inherit;background-color:currentColor;width:1em;height:1em;-webkit-mask-size:100% 100%;mask-size:100% 100%}.i-tabler-moon-stars{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 3h.393a7.5 7.5 0 0 0 7.92 12.446A9 9 0 1 1 12 2.992zm5 1a2 2 0 0 0 2 2a2 2 0 0 0-2 2a2 2 0 0 0-2-2a2 2 0 0 0 2-2m2 7h2m-1-1v2'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;color:inherit;background-color:currentColor;width:1em;height:1em;-webkit-mask-size:100% 100%;mask-size:100% 100%}.i-tabler-sun{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 12a4 4 0 1 0 8 0a4 4 0 1 0-8 0m-5 0h1m8-9v1m8 8h1m-9 8v1M5.6 5.6l.7.7m12.1-.7l-.7.7m0 11.4l.7.7m-12.1-.7l-.7.7'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;color:inherit;background-color:currentColor;width:1em;height:1em;-webkit-mask-size:100% 100%;mask-size:100% 100%}.text-base{font-size:var(--text-base-fontSize);line-height:var(--un-leading,var(--text-base-lineHeight))}.text-lg{font-size:var(--text-lg-fontSize);line-height:var(--un-leading,var(--text-lg-lineHeight))}.text-sm{font-size:var(--text-sm-fontSize);line-height:var(--un-leading,var(--text-sm-lineHeight))}.text-xs{font-size:var(--text-xs-fontSize);line-height:var(--un-leading,var(--text-xs-lineHeight))}.dark .dark\:text-amber-400{color:color-mix(in srgb, var(--colors-amber-400) var(--un-text-opacity), transparent) }.dark .dark\:text-blue-400{color:color-mix(in srgb, var(--colors-blue-400) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-100{color:color-mix(in srgb, var(--colors-gray-100) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-300{color:color-mix(in srgb, var(--colors-gray-300) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-400,.text-gray-400{color:color-mix(in srgb, var(--colors-gray-400) var(--un-text-opacity), transparent) }.dark .dark\:text-red-400{color:color-mix(in srgb, var(--colors-red-400) var(--un-text-opacity), transparent) }.dark .dark\:text-yellow-500,.text-yellow-500{color:color-mix(in srgb, var(--colors-yellow-500) var(--un-text-opacity), transparent) }.text-amber-600{color:color-mix(in srgb, var(--colors-amber-600) var(--un-text-opacity), transparent) }.text-blue-500{color:color-mix(in srgb, var(--colors-blue-500) var(--un-text-opacity), transparent) }.text-blue-600{color:color-mix(in srgb, var(--colors-blue-600) var(--un-text-opacity), transparent) }.text-gray-500{color:color-mix(in srgb, var(--colors-gray-500) var(--un-text-opacity), transparent) }.text-gray-600{color:color-mix(in srgb, var(--colors-gray-600) var(--un-text-opacity), transparent) }.text-gray-700{color:color-mix(in srgb, var(--colors-gray-700) var(--un-text-opacity), transparent) }.text-gray-900{color:color-mix(in srgb, var(--colors-gray-900) var(--un-text-opacity), transparent) }.text-red-600{color:color-mix(in srgb, var(--colors-red-600) var(--un-text-opacity), transparent) }.text-white{color:color-mix(in srgb, var(--colors-white) var(--un-text-opacity), transparent) }.dark .dark\:hover\:text-gray-200:hover{color:color-mix(in srgb, var(--colors-gray-200) var(--un-text-opacity), transparent) }.dark .dark\:hover\:text-gray-300:hover{color:color-mix(in srgb, var(--colors-gray-300) var(--un-text-opacity), transparent) }.hover\:text-gray-600:hover{color:color-mix(in srgb, var(--colors-gray-600) var(--un-text-opacity), transparent) }.hover\:text-gray-900:hover{color:color-mix(in srgb, var(--colors-gray-900) var(--un-text-opacity), transparent) }.font-medium{--un-font-weight:var(--fontWeight-medium);font-weight:var(--fontWeight-medium)}.font-semibold{--un-font-weight:var(--fontWeight-semibold);font-weight:var(--fontWeight-semibold)}.tab{tab-size:4}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mr-1{margin-right:calc(var(--spacing) * 1)}.mt-1{margin-top:calc(var(--spacing) * 1)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-32{margin-top:calc(var(--spacing) * 32)}.p-1{padding:calc(var(--spacing) * 1)}.p-2{padding:calc(var(--spacing) * 2)}.p-2\.5{padding:calc(var(--spacing) * 2.5)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.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-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.text-right{text-align:right}.outline{outline-style:var(--un-outline-style);outline-width:1px}.focus\:outline-none:focus{--un-outline-style:none;outline-style:none}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-gray-200{border-color:color-mix(in srgb, var(--colors-gray-200) var(--un-border-opacity), transparent) }.border-gray-300{border-color:color-mix(in srgb, var(--colors-gray-300) var(--un-border-opacity), transparent) }.border-red-500{border-color:color-mix(in srgb, var(--colors-red-500) var(--un-border-opacity), transparent) }.border-transparent{border-color:#0000}.dark .dark\:border-gray-600{border-color:color-mix(in srgb, var(--colors-gray-600) var(--un-border-opacity), transparent) }.dark .dark\:border-gray-700{border-color:color-mix(in srgb, var(--colors-gray-700) var(--un-border-opacity), transparent) }.dark .dark\:border-red-400{border-color:color-mix(in srgb, var(--colors-red-400) var(--un-border-opacity), transparent) }.focus\:border-transparent:focus{border-color:#0000}.rounded{border-radius:var(--radius-DEFAULT)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.bg-black\/50{background-color:color-mix(in srgb, var(--colors-black) 50%, transparent) }.bg-blue-600{background-color:color-mix(in srgb, var(--colors-blue-600) var(--un-bg-opacity), transparent) }.bg-gray-100{background-color:color-mix(in srgb, var(--colors-gray-100) var(--un-bg-opacity), transparent) }.bg-gray-200{background-color:color-mix(in srgb, var(--colors-gray-200) var(--un-bg-opacity), transparent) }.bg-red-600{background-color:color-mix(in srgb, var(--colors-red-600) var(--un-bg-opacity), transparent) }.bg-transparent{background-color:#0000}.bg-white{background-color:color-mix(in srgb, var(--colors-white) var(--un-bg-opacity), transparent) }.dark .dark\:bg-blue-500{background-color:color-mix(in srgb, var(--colors-blue-500) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-600{background-color:color-mix(in srgb, var(--colors-gray-600) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-700{background-color:color-mix(in srgb, var(--colors-gray-700) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-700\/50{background-color:color-mix(in srgb, var(--colors-gray-700) 50%, transparent) }.dark .dark\:bg-gray-800{background-color:color-mix(in srgb, var(--colors-gray-800) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-800\/50{background-color:color-mix(in srgb, var(--colors-gray-800) 50%, transparent) }.dark .dark\:bg-red-500{background-color:color-mix(in srgb, var(--colors-red-500) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-blue-600:hover{background-color:color-mix(in srgb, var(--colors-blue-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-500:hover{background-color:color-mix(in srgb, var(--colors-gray-500) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-600:hover{background-color:color-mix(in srgb, var(--colors-gray-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-600\/50:hover{background-color:color-mix(in srgb, var(--colors-gray-600) 50%, transparent) }.dark .dark\:hover\:bg-gray-700\/50:hover{background-color:color-mix(in srgb, var(--colors-gray-700) 50%, transparent) }.dark .dark\:hover\:bg-gray-800:hover{background-color:color-mix(in srgb, var(--colors-gray-800) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-800\/50:hover{background-color:color-mix(in srgb, var(--colors-gray-800) 50%, transparent) }.dark .dark\:hover\:bg-red-600:hover{background-color:color-mix(in srgb, var(--colors-red-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-red-900\/20:hover{background-color:color-mix(in srgb, var(--colors-red-900) 20%, transparent) }.hover\:bg-blue-700:hover{background-color:color-mix(in srgb, var(--colors-blue-700) var(--un-bg-opacity), transparent) }.hover\:bg-gray-100:hover{background-color:color-mix(in srgb, var(--colors-gray-100) var(--un-bg-opacity), transparent) }.hover\:bg-gray-200:hover{background-color:color-mix(in srgb, var(--colors-gray-200) var(--un-bg-opacity), transparent) }.hover\:bg-gray-200\/50:hover{background-color:color-mix(in srgb, var(--colors-gray-200) 50%, transparent) }.hover\:bg-gray-300:hover{background-color:color-mix(in srgb, var(--colors-gray-300) var(--un-bg-opacity), transparent) }.hover\:bg-gray-50:hover{background-color:color-mix(in srgb, var(--colors-gray-50) var(--un-bg-opacity), transparent) }.hover\:bg-red-50:hover{background-color:color-mix(in srgb, var(--colors-red-50) var(--un-bg-opacity), transparent) }.hover\:bg-red-700:hover{background-color:color-mix(in srgb, var(--colors-red-700) var(--un-bg-opacity), transparent) }.hover\:bg-white\/50:hover{background-color:color-mix(in srgb, var(--colors-white) 50%, transparent) }.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-50,.disabled\:opacity-50:disabled{opacity:.5}.flex{display:flex}.inline-flex{display:inline-flex}.flex-1{flex:1}.shrink-0{flex-shrink:0}.flex-col{flex-direction:column}.gap-1{gap:calc(var(--spacing) * 1)}.gap-2{gap:calc(var(--spacing) * 2)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-fit{height:fit-content}.max-h-\[90vh\]{max-height:90vh}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-lg{max-width:var(--container-lg)}.max-w-md{max-width:var(--container-md)}.min-h-\[80px\]{min-height:80px}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-full{width:100%}.block{display:block}.hidden{display:none}.cursor-pointer{cursor:pointer}.cursor-not-allowed,.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.resize-y{resize:vertical}.focus\:ring-2:focus{--un-ring-shadow:var(--un-ring-inset,) 0 0 0 calc(2px + var(--un-ring-offset-width)) var(--un-ring-color,currentColor);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)}.focus\:ring-blue-500:focus{--un-ring-color:color-mix(in srgb, var(--colors-blue-500) var(--un-ring-opacity), transparent) }.focus\:ring-red-500:focus{--un-ring-color:color-mix(in srgb, var(--colors-red-500) var(--un-ring-opacity), transparent) }.focus\:ring-offset-2:focus{--un-ring-offset-width:2px;--un-ring-offset-shadow:var(--un-ring-inset,) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color)}.dark .dark\:focus\:ring-offset-gray-900:focus{--un-ring-offset-color:color-mix(in srgb, var(--colors-gray-900) var(--un-ring-offset-opacity), transparent) }.shadow-sm{--un-shadow:0 1px 3px 0 var(--un-shadow-color,#0000001a),0 1px 2px -1px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)}.shadow-xl{--un-shadow:0 20px 25px -5px var(--un-shadow-color,#0000001a),0 8px 10px -6px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)}.translate-y-0{--un-translate-y:calc(var(--spacing) * 0);translate:var(--un-translate-x) var(--un-translate-y)}.translate-y-2{--un-translate-y:calc(var(--spacing) * 2);translate:var(--un-translate-x) var(--un-translate-y)}.scale-100{--un-scale-x:100%;--un-scale-y:100%;scale:var(--un-scale-x) var(--un-scale-y)}.scale-95{--un-scale-x:95%;--un-scale-y:95%;scale:var(--un-scale-x) var(--un-scale-y)}.transition-all{transition-property:all;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.duration-200{--un-duration:.2s;transition-duration:.2s}.items-center{align-items:center}.inset-0{inset:calc(var(--spacing) * 0)}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.fixed{position:fixed}.relative{position:relative}.z-50{z-index:50}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.backdrop-blur-sm{--un-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--un-backdrop-blur,) var(--un-backdrop-brightness,) var(--un-backdrop-contrast,) var(--un-backdrop-grayscale,) var(--un-backdrop-hue-rotate,) var(--un-backdrop-invert,) var(--un-backdrop-opacity,) var(--un-backdrop-saturate,) var(--un-backdrop-sepia,);backdrop-filter:var(--un-backdrop-blur,) var(--un-backdrop-brightness,) var(--un-backdrop-contrast,) var(--un-backdrop-grayscale,) var(--un-backdrop-hue-rotate,) var(--un-backdrop-invert,) var(--un-backdrop-opacity,) var(--un-backdrop-saturate,) var(--un-backdrop-sepia,)}.dark .dark\:placeholder-gray-400::placeholder{color:color-mix(in srgb, var(--colors-gray-400) var(--un-placeholder-opacity), transparent) }.placeholder-gray-500::placeholder{color:color-mix(in srgb, var(--colors-gray-500) var(--un-placeholder-opacity), transparent) }@supports (color:color-mix(in lab, red, red)){.dark .dark\:text-amber-400{color:color-mix(in oklab, var(--colors-amber-400) var(--un-text-opacity), transparent) }.dark .dark\:text-blue-400{color:color-mix(in oklab, var(--colors-blue-400) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-100{color:color-mix(in oklab, var(--colors-gray-100) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-300{color:color-mix(in oklab, var(--colors-gray-300) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-400{color:color-mix(in oklab, var(--colors-gray-400) var(--un-text-opacity), transparent) }.dark .dark\:text-red-400{color:color-mix(in oklab, var(--colors-red-400) var(--un-text-opacity), transparent) }.dark .dark\:text-yellow-500{color:color-mix(in oklab, var(--colors-yellow-500) var(--un-text-opacity), transparent) }.text-amber-600{color:color-mix(in oklab, var(--colors-amber-600) var(--un-text-opacity), transparent) }.text-blue-500{color:color-mix(in oklab, var(--colors-blue-500) var(--un-text-opacity), transparent) }.text-blue-600{color:color-mix(in oklab, var(--colors-blue-600) var(--un-text-opacity), transparent) }.text-gray-400{color:color-mix(in oklab, var(--colors-gray-400) var(--un-text-opacity), transparent) }.text-gray-500{color:color-mix(in oklab, var(--colors-gray-500) var(--un-text-opacity), transparent) }.text-gray-600{color:color-mix(in oklab, var(--colors-gray-600) var(--un-text-opacity), transparent) }.text-gray-700{color:color-mix(in oklab, var(--colors-gray-700) var(--un-text-opacity), transparent) }.text-gray-900{color:color-mix(in oklab, var(--colors-gray-900) var(--un-text-opacity), transparent) }.text-red-600{color:color-mix(in oklab, var(--colors-red-600) var(--un-text-opacity), transparent) }.text-white{color:color-mix(in oklab, var(--colors-white) var(--un-text-opacity), transparent) }.text-yellow-500{color:color-mix(in oklab, var(--colors-yellow-500) var(--un-text-opacity), transparent) }.dark .dark\:hover\:text-gray-200:hover{color:color-mix(in oklab, var(--colors-gray-200) var(--un-text-opacity), transparent) }.dark .dark\:hover\:text-gray-300:hover{color:color-mix(in oklab, var(--colors-gray-300) var(--un-text-opacity), transparent) }.hover\:text-gray-600:hover{color:color-mix(in oklab, var(--colors-gray-600) var(--un-text-opacity), transparent) }.hover\:text-gray-900:hover{color:color-mix(in oklab, var(--colors-gray-900) var(--un-text-opacity), transparent) }.border-gray-200{border-color:color-mix(in oklab, var(--colors-gray-200) var(--un-border-opacity), transparent) }.border-gray-300{border-color:color-mix(in oklab, var(--colors-gray-300) var(--un-border-opacity), transparent) }.border-red-500{border-color:color-mix(in oklab, var(--colors-red-500) var(--un-border-opacity), transparent) }.dark .dark\:border-gray-600{border-color:color-mix(in oklab, var(--colors-gray-600) var(--un-border-opacity), transparent) }.dark .dark\:border-gray-700{border-color:color-mix(in oklab, var(--colors-gray-700) var(--un-border-opacity), transparent) }.dark .dark\:border-red-400{border-color:color-mix(in oklab, var(--colors-red-400) var(--un-border-opacity), transparent) }.bg-black\/50{background-color:color-mix(in oklab, var(--colors-black) 50%, transparent) }.bg-blue-600{background-color:color-mix(in oklab, var(--colors-blue-600) var(--un-bg-opacity), transparent) }.bg-gray-100{background-color:color-mix(in oklab, var(--colors-gray-100) var(--un-bg-opacity), transparent) }.bg-gray-200{background-color:color-mix(in oklab, var(--colors-gray-200) var(--un-bg-opacity), transparent) }.bg-red-600{background-color:color-mix(in oklab, var(--colors-red-600) var(--un-bg-opacity), transparent) }.bg-white{background-color:color-mix(in oklab, var(--colors-white) var(--un-bg-opacity), transparent) }.dark .dark\:bg-blue-500{background-color:color-mix(in oklab, var(--colors-blue-500) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-600{background-color:color-mix(in oklab, var(--colors-gray-600) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-700{background-color:color-mix(in oklab, var(--colors-gray-700) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-700\/50{background-color:color-mix(in oklab, var(--colors-gray-700) 50%, transparent) }.dark .dark\:bg-gray-800{background-color:color-mix(in oklab, var(--colors-gray-800) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-800\/50{background-color:color-mix(in oklab, var(--colors-gray-800) 50%, transparent) }.dark .dark\:bg-red-500{background-color:color-mix(in oklab, var(--colors-red-500) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-blue-600:hover{background-color:color-mix(in oklab, var(--colors-blue-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-500:hover{background-color:color-mix(in oklab, var(--colors-gray-500) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-600:hover{background-color:color-mix(in oklab, var(--colors-gray-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-600\/50:hover{background-color:color-mix(in oklab, var(--colors-gray-600) 50%, transparent) }.dark .dark\:hover\:bg-gray-700\/50:hover{background-color:color-mix(in oklab, var(--colors-gray-700) 50%, transparent) }.dark .dark\:hover\:bg-gray-800:hover{background-color:color-mix(in oklab, var(--colors-gray-800) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-800\/50:hover{background-color:color-mix(in oklab, var(--colors-gray-800) 50%, transparent) }.dark .dark\:hover\:bg-red-600:hover{background-color:color-mix(in oklab, var(--colors-red-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-red-900\/20:hover{background-color:color-mix(in oklab, var(--colors-red-900) 20%, transparent) }.hover\:bg-blue-700:hover{background-color:color-mix(in oklab, var(--colors-blue-700) var(--un-bg-opacity), transparent) }.hover\:bg-gray-100:hover{background-color:color-mix(in oklab, var(--colors-gray-100) var(--un-bg-opacity), transparent) }.hover\:bg-gray-200:hover{background-color:color-mix(in oklab, var(--colors-gray-200) var(--un-bg-opacity), transparent) }.hover\:bg-gray-200\/50:hover{background-color:color-mix(in oklab, var(--colors-gray-200) 50%, transparent) }.hover\:bg-gray-300:hover{background-color:color-mix(in oklab, var(--colors-gray-300) var(--un-bg-opacity), transparent) }.hover\:bg-gray-50:hover{background-color:color-mix(in oklab, var(--colors-gray-50) var(--un-bg-opacity), transparent) }.hover\:bg-red-50:hover{background-color:color-mix(in oklab, var(--colors-red-50) var(--un-bg-opacity), transparent) }.hover\:bg-red-700:hover{background-color:color-mix(in oklab, var(--colors-red-700) var(--un-bg-opacity), transparent) }.hover\:bg-white\/50:hover{background-color:color-mix(in oklab, var(--colors-white) 50%, transparent) }.focus\:ring-blue-500:focus{--un-ring-color:color-mix(in oklab, var(--colors-blue-500) var(--un-ring-opacity), transparent) }.focus\:ring-red-500:focus{--un-ring-color:color-mix(in oklab, var(--colors-red-500) var(--un-ring-opacity), transparent) }.dark .dark\:focus\:ring-offset-gray-900:focus{--un-ring-offset-color:color-mix(in oklab, var(--colors-gray-900) var(--un-ring-offset-opacity), transparent) }.dark .dark\:placeholder-gray-400::placeholder{color:color-mix(in oklab, var(--colors-gray-400) var(--un-placeholder-opacity), transparent) }.placeholder-gray-500::placeholder{color:color-mix(in oklab, var(--colors-gray-500) var(--un-placeholder-opacity), transparent) }}@keyframes tabs-panel-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.tabs-panel-inner{animation:.25s ease-out tabs-panel-in}
1
+ @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{--un-bg-opacity:100%;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-translate-x:initial;--un-translate-y:initial;--un-translate-z:initial;--un-ease:initial;--un-ring-opacity:100%;--un-text-opacity:100%;--un-border-opacity:100%;--un-ring-offset-opacity:100%;--un-placeholder-opacity:100%}}@property --un-text-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --un-border-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-bg-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-ring-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-ring-offset-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-inset-ring-color{syntax:"*";inherits:false}@property --un-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow-color{syntax:"*";inherits:false}@property --un-ring-color{syntax:"*";inherits:false}@property --un-ring-inset{syntax:"*";inherits:false}@property --un-ring-offset-color{syntax:"*";inherits:false}@property --un-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --un-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow-color{syntax:"*";inherits:false}@property --un-translate-x{syntax:"*";inherits:false;initial-value:0}@property --un-translate-y{syntax:"*";inherits:false;initial-value:0}@property --un-translate-z{syntax:"*";inherits:false;initial-value:0}@property --un-scale-x{syntax:"*";inherits:false;initial-value:1}@property --un-scale-y{syntax:"*";inherits:false;initial-value:1}@property --un-scale-z{syntax:"*";inherits:false;initial-value:1}@property --un-ease{syntax:"*";inherits:false}@property --un-backdrop-blur{syntax:"*";inherits:false}@property --un-backdrop-brightness{syntax:"*";inherits:false}@property --un-backdrop-contrast{syntax:"*";inherits:false}@property --un-backdrop-grayscale{syntax:"*";inherits:false}@property --un-backdrop-hue-rotate{syntax:"*";inherits:false}@property --un-backdrop-invert{syntax:"*";inherits:false}@property --un-backdrop-opacity{syntax:"*";inherits:false}@property --un-backdrop-saturate{syntax:"*";inherits:false}@property --un-backdrop-sepia{syntax:"*";inherits:false}@property --un-placeholder-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}:root,:host{--spacing:.25rem;--radius-md:.375rem;--fontWeight-medium:500;--default-transition-timingFunction:cubic-bezier(.4, 0, .2, 1);--default-transition-duration:.15s;--radius-lg:.5rem;--radius-DEFAULT:.25rem;--container-md:28rem;--container-lg:32rem;--container-2xl:42rem;--container-4xl:56rem;--colors-black:#000;--fontWeight-semibold:600;--ease-in-out:cubic-bezier(.4, 0, .2, 1);--colors-red-500:#fb2c36;--colors-gray-500:#6a7282;--colors-amber-600:#dd7400;--colors-red-600:#e40014;--colors-blue-600:#155dfc;--colors-white:#fff;--colors-gray-200:#e5e7eb;--colors-gray-900:#101828;--colors-gray-700:#364153;--colors-gray-300:#d1d5dc;--colors-gray-100:#f3f4f6;--colors-yellow-500:#edb200;--colors-blue-500:#3080ff;--colors-gray-400:#99a1af;--colors-gray-600:#4a5565;--text-xs-fontSize:.75rem;--text-xs-lineHeight:1rem;--text-sm-fontSize:.875rem;--text-sm-lineHeight:1.25rem;--text-base-fontSize:1rem;--text-base-lineHeight:1.5rem;--text-lg-fontSize:1.125rem;--text-lg-lineHeight:1.75rem;--colors-gray-50:#f9fafb;--colors-blue-700:#1447e6;--colors-red-700:#bf000f;--colors-red-50:#fef2f2;--colors-gray-800:#1e2939;--colors-red-400:#ff6568;--colors-amber-400:#fcbb00;--colors-blue-400:#54a2ff;--colors-red-900:#82181a;--font-sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",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;--default-font-family:var(--font-sans);--default-monoFont-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--colors-red-500:lab(55.4814% 75.0732 48.8528);--colors-gray-500:lab(47.7841% -.393182 -10.0268);--colors-amber-600:lab(60.3514% 40.5624 87.1228);--colors-red-600:lab(48.4493% 77.4328 61.5452);--colors-blue-600:lab(44.0605% 29.0279 -86.0352);--colors-gray-200:lab(91.6229% -.159115 -2.26791);--colors-gray-900:lab(8.11897% .811279 -12.254);--colors-gray-700:lab(27.1134% -.956401 -12.3224);--colors-gray-300:lab(85.1236% -.612259 -3.7138);--colors-gray-100:lab(96.1596% -.0823438 -1.13575);--colors-yellow-500:lab(76.3898% 14.5258 98.4589);--colors-blue-500:lab(54.1736% 13.3369 -74.6839);--colors-gray-400:lab(65.9269% -.832707 -8.17473);--colors-gray-600:lab(35.6337% -1.58697 -10.8425);--colors-gray-50:lab(98.2596% -.247031 -.706708);--colors-blue-700:lab(36.9089% 35.0961 -85.6872);--colors-red-700:lab(40.4273% 67.2623 53.7441);--colors-red-50:lab(96.5005% 4.18508 1.52328);--colors-gray-800:lab(16.1051% -1.18239 -11.7533);--colors-red-400:lab(63.7053% 60.745 31.3109);--colors-amber-400:lab(80.1641% 16.6016 99.2089);--colors-blue-400:lab(65.0361% -1.42065 -56.9802);--colors-red-900:lab(28.5139% 44.5539 29.0463)}}*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;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-feature-settings:var(--default-font-featureSettings,normal);font-variation-settings:var(--default-font-variationSettings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}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;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-monoFont-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-monoFont-featureSettings,normal);font-variation-settings:var(--default-monoFont-variationSettings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}: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}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{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{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden~=until-found])){display:none!important}.i-mdi-close{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12z'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;color:inherit;background-color:currentColor;width:1em;height:1em;-webkit-mask-size:100% 100%;mask-size:100% 100%}.i-svg-spinners-3-dots-fade{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Ccircle cx='4' cy='12' r='3' fill='currentColor'%3E%3Canimate id='SVG7x14Dcom' fill='freeze' attributeName='opacity' begin='0;SVGqSjG0dUp.end-0.25s' dur='0.75s' values='1;.2'/%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='3' fill='currentColor' opacity='.4'%3E%3Canimate fill='freeze' attributeName='opacity' begin='SVG7x14Dcom.begin+0.15s' dur='0.75s' values='1;.2'/%3E%3C/circle%3E%3Ccircle cx='20' cy='12' r='3' fill='currentColor' opacity='.3'%3E%3Canimate id='SVGqSjG0dUp' fill='freeze' attributeName='opacity' begin='SVG7x14Dcom.begin+0.3s' dur='0.75s' values='1;.2'/%3E%3C/circle%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;color:inherit;background-color:currentColor;width:1em;height:1em;-webkit-mask-size:100% 100%;mask-size:100% 100%}.i-tabler-device-desktop{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 5a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1zm4 15h10m-8-4v4m6-4v4'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;color:inherit;background-color:currentColor;width:1em;height:1em;-webkit-mask-size:100% 100%;mask-size:100% 100%}.i-tabler-moon-stars{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 3h.393a7.5 7.5 0 0 0 7.92 12.446A9 9 0 1 1 12 2.992zm5 1a2 2 0 0 0 2 2a2 2 0 0 0-2 2a2 2 0 0 0-2-2a2 2 0 0 0 2-2m2 7h2m-1-1v2'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;color:inherit;background-color:currentColor;width:1em;height:1em;-webkit-mask-size:100% 100%;mask-size:100% 100%}.i-tabler-sun{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 12a4 4 0 1 0 8 0a4 4 0 1 0-8 0m-5 0h1m8-9v1m8 8h1m-9 8v1M5.6 5.6l.7.7m12.1-.7l-.7.7m0 11.4l.7.7m-12.1-.7l-.7.7'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;color:inherit;background-color:currentColor;width:1em;height:1em;-webkit-mask-size:100% 100%;mask-size:100% 100%}.text-base{font-size:var(--text-base-fontSize);line-height:var(--un-leading,var(--text-base-lineHeight))}.text-lg{font-size:var(--text-lg-fontSize);line-height:var(--un-leading,var(--text-lg-lineHeight))}.text-sm{font-size:var(--text-sm-fontSize);line-height:var(--un-leading,var(--text-sm-lineHeight))}.text-xs{font-size:var(--text-xs-fontSize);line-height:var(--un-leading,var(--text-xs-lineHeight))}.dark .dark\:text-amber-400{color:color-mix(in srgb, var(--colors-amber-400) var(--un-text-opacity), transparent) }.dark .dark\:text-blue-400{color:color-mix(in srgb, var(--colors-blue-400) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-100{color:color-mix(in srgb, var(--colors-gray-100) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-300{color:color-mix(in srgb, var(--colors-gray-300) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-400,.text-gray-400{color:color-mix(in srgb, var(--colors-gray-400) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-500,.text-gray-500{color:color-mix(in srgb, var(--colors-gray-500) var(--un-text-opacity), transparent) }.dark .dark\:text-red-400{color:color-mix(in srgb, var(--colors-red-400) var(--un-text-opacity), transparent) }.dark .dark\:text-yellow-500,.text-yellow-500{color:color-mix(in srgb, var(--colors-yellow-500) var(--un-text-opacity), transparent) }.text-amber-600{color:color-mix(in srgb, var(--colors-amber-600) var(--un-text-opacity), transparent) }.text-blue-500{color:color-mix(in srgb, var(--colors-blue-500) var(--un-text-opacity), transparent) }.text-blue-600{color:color-mix(in srgb, var(--colors-blue-600) var(--un-text-opacity), transparent) }.text-gray-600{color:color-mix(in srgb, var(--colors-gray-600) var(--un-text-opacity), transparent) }.text-gray-700{color:color-mix(in srgb, var(--colors-gray-700) var(--un-text-opacity), transparent) }.text-gray-900{color:color-mix(in srgb, var(--colors-gray-900) var(--un-text-opacity), transparent) }.text-red-500{color:color-mix(in srgb, var(--colors-red-500) var(--un-text-opacity), transparent) }.text-red-600{color:color-mix(in srgb, var(--colors-red-600) var(--un-text-opacity), transparent) }.text-white{color:color-mix(in srgb, var(--colors-white) var(--un-text-opacity), transparent) }.dark .dark\:hover\:text-gray-200:hover{color:color-mix(in srgb, var(--colors-gray-200) var(--un-text-opacity), transparent) }.dark .dark\:hover\:text-gray-300:hover{color:color-mix(in srgb, var(--colors-gray-300) var(--un-text-opacity), transparent) }.hover\:text-gray-600:hover{color:color-mix(in srgb, var(--colors-gray-600) var(--un-text-opacity), transparent) }.hover\:text-gray-700:hover{color:color-mix(in srgb, var(--colors-gray-700) var(--un-text-opacity), transparent) }.hover\:text-gray-900:hover{color:color-mix(in srgb, var(--colors-gray-900) var(--un-text-opacity), transparent) }.font-medium{--un-font-weight:var(--fontWeight-medium);font-weight:var(--fontWeight-medium)}.font-semibold{--un-font-weight:var(--fontWeight-semibold);font-weight:var(--fontWeight-semibold)}.tab{tab-size:4}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.ml-1{margin-left:calc(var(--spacing) * 1)}.ml-14{margin-left:calc(var(--spacing) * 14)}.ml-8{margin-left:calc(var(--spacing) * 8)}.mr-1{margin-right:calc(var(--spacing) * 1)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:calc(var(--spacing) * 1)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-32{margin-top:calc(var(--spacing) * 32)}.p-1{padding:calc(var(--spacing) * 1)}.p-2{padding:calc(var(--spacing) * 2)}.p-2\.5{padding:calc(var(--spacing) * 2.5)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.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-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pr-8{padding-right:calc(var(--spacing) * 8)}.text-right{text-align:right}.appearance-none{appearance:none}.outline{outline-style:var(--un-outline-style);outline-width:1px}.focus-within\:outline-none:focus-within,.focus\:outline-none:focus{--un-outline-style:none;outline-style:none}.border{border-width:1px}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-blue-600{border-color:color-mix(in srgb, var(--colors-blue-600) var(--un-border-opacity), transparent) }.border-gray-200{border-color:color-mix(in srgb, var(--colors-gray-200) var(--un-border-opacity), transparent) }.border-gray-300{border-color:color-mix(in srgb, var(--colors-gray-300) var(--un-border-opacity), transparent) }.border-red-500{border-color:color-mix(in srgb, var(--colors-red-500) var(--un-border-opacity), transparent) }.border-transparent{border-color:#0000}.dark .dark\:border-blue-500{border-color:color-mix(in srgb, var(--colors-blue-500) var(--un-border-opacity), transparent) }.dark .dark\:border-gray-600{border-color:color-mix(in srgb, var(--colors-gray-600) var(--un-border-opacity), transparent) }.dark .dark\:border-gray-700{border-color:color-mix(in srgb, var(--colors-gray-700) var(--un-border-opacity), transparent) }.dark .dark\:border-red-400{border-color:color-mix(in srgb, var(--colors-red-400) var(--un-border-opacity), transparent) }.focus\:border-transparent:focus{border-color:#0000}.rounded{border-radius:var(--radius-DEFAULT)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.bg-\[length\:1rem_1rem\]{background-size:1rem 1rem}.bg-\[position\:right_0\.5rem_center\]{background-position:right .5rem center}.bg-\[url\(\"data\:image\/svg\+xml\,\%3csvg\ xmlns\=\%27http\:\/\/www\.w3\.org\/2000\/svg\%27\ fill\=\%27none\%27\ viewBox\=\%270\ 0\ 20\ 20\%27\%3e\%3cpath\ stroke\=\%27\%236b7280\%27\ stroke-linecap\=\%27round\%27\ stroke-linejoin\=\%27round\%27\ stroke-width\=\%271\.5\%27\ d\=\%27M6\ 8l4\ 4\ 4-4\%27\/\%3e\%3c\/svg\%3e\"\)\]{--un-url:url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27M6 8l4 4 4-4%27/%3e%3c/svg%3e");background-image:var(--un-url)}.bg-black\/50{background-color:color-mix(in srgb, var(--colors-black) 50%, transparent) }.bg-blue-600{background-color:color-mix(in srgb, var(--colors-blue-600) var(--un-bg-opacity), transparent) }.bg-gray-100{background-color:color-mix(in srgb, var(--colors-gray-100) var(--un-bg-opacity), transparent) }.bg-gray-200{background-color:color-mix(in srgb, var(--colors-gray-200) var(--un-bg-opacity), transparent) }.bg-red-600{background-color:color-mix(in srgb, var(--colors-red-600) var(--un-bg-opacity), transparent) }.bg-transparent{background-color:#0000}.bg-white{background-color:color-mix(in srgb, var(--colors-white) var(--un-bg-opacity), transparent) }.dark .dark\:bg-blue-500{background-color:color-mix(in srgb, var(--colors-blue-500) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-600{background-color:color-mix(in srgb, var(--colors-gray-600) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-700{background-color:color-mix(in srgb, var(--colors-gray-700) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-700\/50{background-color:color-mix(in srgb, var(--colors-gray-700) 50%, transparent) }.dark .dark\:bg-gray-800{background-color:color-mix(in srgb, var(--colors-gray-800) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-800\/50{background-color:color-mix(in srgb, var(--colors-gray-800) 50%, transparent) }.dark .dark\:bg-red-500{background-color:color-mix(in srgb, var(--colors-red-500) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-blue-600:hover{background-color:color-mix(in srgb, var(--colors-blue-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-500:hover{background-color:color-mix(in srgb, var(--colors-gray-500) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-600:hover{background-color:color-mix(in srgb, var(--colors-gray-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-600\/50:hover{background-color:color-mix(in srgb, var(--colors-gray-600) 50%, transparent) }.dark .dark\:hover\:bg-gray-700\/50:hover{background-color:color-mix(in srgb, var(--colors-gray-700) 50%, transparent) }.dark .dark\:hover\:bg-gray-800:hover{background-color:color-mix(in srgb, var(--colors-gray-800) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-800\/30:hover{background-color:color-mix(in srgb, var(--colors-gray-800) 30%, transparent) }.dark .dark\:hover\:bg-gray-800\/50:hover{background-color:color-mix(in srgb, var(--colors-gray-800) 50%, transparent) }.dark .dark\:hover\:bg-red-600:hover{background-color:color-mix(in srgb, var(--colors-red-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-red-900\/20:hover{background-color:color-mix(in srgb, var(--colors-red-900) 20%, transparent) }.hover\:bg-blue-700:hover{background-color:color-mix(in srgb, var(--colors-blue-700) var(--un-bg-opacity), transparent) }.hover\:bg-gray-100:hover{background-color:color-mix(in srgb, var(--colors-gray-100) var(--un-bg-opacity), transparent) }.hover\:bg-gray-200:hover{background-color:color-mix(in srgb, var(--colors-gray-200) var(--un-bg-opacity), transparent) }.hover\:bg-gray-200\/50:hover{background-color:color-mix(in srgb, var(--colors-gray-200) 50%, transparent) }.hover\:bg-gray-300:hover{background-color:color-mix(in srgb, var(--colors-gray-300) var(--un-bg-opacity), transparent) }.hover\:bg-gray-50:hover{background-color:color-mix(in srgb, var(--colors-gray-50) var(--un-bg-opacity), transparent) }.hover\:bg-gray-50\/50:hover{background-color:color-mix(in srgb, var(--colors-gray-50) 50%, transparent) }.hover\:bg-red-50:hover{background-color:color-mix(in srgb, var(--colors-red-50) var(--un-bg-opacity), transparent) }.hover\:bg-red-700:hover{background-color:color-mix(in srgb, var(--colors-red-700) var(--un-bg-opacity), transparent) }.hover\:bg-white\/50:hover{background-color:color-mix(in srgb, var(--colors-white) 50%, transparent) }.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-50,.disabled\:opacity-50:disabled{opacity:.5}.flex{display:flex}.inline-flex{display:inline-flex}.flex-1{flex:1}.shrink-0{flex-shrink:0}.flex-col{flex-direction:column}.gap-1{gap:calc(var(--spacing) * 1)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.h-3{height:calc(var(--spacing) * 3)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-fit{height:fit-content}.max-h-\[90vh\]{max-height:90vh}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-lg{max-width:var(--container-lg)}.max-w-md{max-width:var(--container-md)}.min-h-\[80px\]{min-height:80px}.w-11{width:calc(var(--spacing) * 11)}.w-3{width:calc(var(--spacing) * 3)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-full{width:100%}.block{display:block}.inline-block{display:inline-block}.hidden{display:none}.cursor-pointer{cursor:pointer}.cursor-not-allowed,.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.pointer-events-none{pointer-events:none}.resize-y{resize:vertical}.select-none{-webkit-user-select:none;user-select:none}.ring-0{--un-ring-shadow:var(--un-ring-inset,) 0 0 0 calc(0px + var(--un-ring-offset-width)) var(--un-ring-color,currentColor);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)}.ring-2,.focus-within\:ring-2:focus-within,.focus\:ring-2:focus{--un-ring-shadow:var(--un-ring-inset,) 0 0 0 calc(2px + var(--un-ring-offset-width)) var(--un-ring-color,currentColor);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)}.dark .dark\:ring-red-400{--un-ring-color:color-mix(in srgb, var(--colors-red-400) var(--un-ring-opacity), transparent) }.ring-red-500{--un-ring-color:color-mix(in srgb, var(--colors-red-500) var(--un-ring-opacity), transparent) }.focus-within\:ring-blue-500:focus-within{--un-ring-color:color-mix(in srgb, var(--colors-blue-500) var(--un-ring-opacity), transparent) }.focus-within\:ring-red-500:focus-within{--un-ring-color:color-mix(in srgb, var(--colors-red-500) var(--un-ring-opacity), transparent) }.focus\:ring-blue-500:focus{--un-ring-color:color-mix(in srgb, var(--colors-blue-500) var(--un-ring-opacity), transparent) }.focus\:ring-red-500:focus{--un-ring-color:color-mix(in srgb, var(--colors-red-500) var(--un-ring-opacity), transparent) }.focus-within\:ring-offset-2:focus-within,.focus\:ring-offset-2:focus{--un-ring-offset-width:2px;--un-ring-offset-shadow:var(--un-ring-inset,) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color)}.dark .dark\:focus-within\:ring-offset-gray-900:focus-within{--un-ring-offset-color:color-mix(in srgb, var(--colors-gray-900) var(--un-ring-offset-opacity), transparent) }.focus-within\:ring-offset-white:focus-within{--un-ring-offset-color:color-mix(in srgb, var(--colors-white) var(--un-ring-offset-opacity), transparent) }.dark .dark\:focus\:ring-offset-gray-900:focus{--un-ring-offset-color:color-mix(in srgb, var(--colors-gray-900) var(--un-ring-offset-opacity), transparent) }.shadow,.shadow-sm{--un-shadow:0 1px 3px 0 var(--un-shadow-color,#0000001a),0 1px 2px -1px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)}.shadow-xl{--un-shadow:0 20px 25px -5px var(--un-shadow-color,#0000001a),0 8px 10px -6px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow)}.translate-x-0{--un-translate-x:calc(var(--spacing) * 0);translate:var(--un-translate-x) var(--un-translate-y)}.translate-x-5\.25{--un-translate-x:calc(var(--spacing) * 5.25);translate:var(--un-translate-x) var(--un-translate-y)}.translate-y-0{--un-translate-y:calc(var(--spacing) * 0);translate:var(--un-translate-x) var(--un-translate-y)}.translate-y-2{--un-translate-y:calc(var(--spacing) * 2);translate:var(--un-translate-x) var(--un-translate-y)}.scale-100{--un-scale-x:100%;--un-scale-y:100%;scale:var(--un-scale-x) var(--un-scale-y)}.scale-95{--un-scale-x:95%;--un-scale-y:95%;scale:var(--un-scale-x) var(--un-scale-y)}.transform{transform:var(--un-rotate-x) var(--un-rotate-y) var(--un-rotate-z) var(--un-skew-x) var(--un-skew-y)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.duration-200{--un-duration:.2s;transition-duration:.2s}.ease-in-out{--un-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.items-start{align-items:flex-start}.items-center{align-items:center}.inset-0{inset:calc(var(--spacing) * 0)}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.fixed{position:fixed}.relative{position:relative}.z-50{z-index:50}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.bg-no-repeat{background-repeat:no-repeat}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.backdrop-blur-sm{--un-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--un-backdrop-blur,) var(--un-backdrop-brightness,) var(--un-backdrop-contrast,) var(--un-backdrop-grayscale,) var(--un-backdrop-hue-rotate,) var(--un-backdrop-invert,) var(--un-backdrop-opacity,) var(--un-backdrop-saturate,) var(--un-backdrop-sepia,);backdrop-filter:var(--un-backdrop-blur,) var(--un-backdrop-brightness,) var(--un-backdrop-contrast,) var(--un-backdrop-grayscale,) var(--un-backdrop-hue-rotate,) var(--un-backdrop-invert,) var(--un-backdrop-opacity,) var(--un-backdrop-saturate,) var(--un-backdrop-sepia,)}.dark .dark\:placeholder-gray-400::placeholder{color:color-mix(in srgb, var(--colors-gray-400) var(--un-placeholder-opacity), transparent) }.placeholder-gray-500::placeholder{color:color-mix(in srgb, var(--colors-gray-500) var(--un-placeholder-opacity), transparent) }@supports (color:color-mix(in lab, red, red)){.dark .dark\:text-amber-400{color:color-mix(in oklab, var(--colors-amber-400) var(--un-text-opacity), transparent) }.dark .dark\:text-blue-400{color:color-mix(in oklab, var(--colors-blue-400) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-100{color:color-mix(in oklab, var(--colors-gray-100) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-300{color:color-mix(in oklab, var(--colors-gray-300) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-400{color:color-mix(in oklab, var(--colors-gray-400) var(--un-text-opacity), transparent) }.dark .dark\:text-gray-500{color:color-mix(in oklab, var(--colors-gray-500) var(--un-text-opacity), transparent) }.dark .dark\:text-red-400{color:color-mix(in oklab, var(--colors-red-400) var(--un-text-opacity), transparent) }.dark .dark\:text-yellow-500{color:color-mix(in oklab, var(--colors-yellow-500) var(--un-text-opacity), transparent) }.text-amber-600{color:color-mix(in oklab, var(--colors-amber-600) var(--un-text-opacity), transparent) }.text-blue-500{color:color-mix(in oklab, var(--colors-blue-500) var(--un-text-opacity), transparent) }.text-blue-600{color:color-mix(in oklab, var(--colors-blue-600) var(--un-text-opacity), transparent) }.text-gray-400{color:color-mix(in oklab, var(--colors-gray-400) var(--un-text-opacity), transparent) }.text-gray-500{color:color-mix(in oklab, var(--colors-gray-500) var(--un-text-opacity), transparent) }.text-gray-600{color:color-mix(in oklab, var(--colors-gray-600) var(--un-text-opacity), transparent) }.text-gray-700{color:color-mix(in oklab, var(--colors-gray-700) var(--un-text-opacity), transparent) }.text-gray-900{color:color-mix(in oklab, var(--colors-gray-900) var(--un-text-opacity), transparent) }.text-red-500{color:color-mix(in oklab, var(--colors-red-500) var(--un-text-opacity), transparent) }.text-red-600{color:color-mix(in oklab, var(--colors-red-600) var(--un-text-opacity), transparent) }.text-white{color:color-mix(in oklab, var(--colors-white) var(--un-text-opacity), transparent) }.text-yellow-500{color:color-mix(in oklab, var(--colors-yellow-500) var(--un-text-opacity), transparent) }.dark .dark\:hover\:text-gray-200:hover{color:color-mix(in oklab, var(--colors-gray-200) var(--un-text-opacity), transparent) }.dark .dark\:hover\:text-gray-300:hover{color:color-mix(in oklab, var(--colors-gray-300) var(--un-text-opacity), transparent) }.hover\:text-gray-600:hover{color:color-mix(in oklab, var(--colors-gray-600) var(--un-text-opacity), transparent) }.hover\:text-gray-700:hover{color:color-mix(in oklab, var(--colors-gray-700) var(--un-text-opacity), transparent) }.hover\:text-gray-900:hover{color:color-mix(in oklab, var(--colors-gray-900) var(--un-text-opacity), transparent) }.border-blue-600{border-color:color-mix(in oklab, var(--colors-blue-600) var(--un-border-opacity), transparent) }.border-gray-200{border-color:color-mix(in oklab, var(--colors-gray-200) var(--un-border-opacity), transparent) }.border-gray-300{border-color:color-mix(in oklab, var(--colors-gray-300) var(--un-border-opacity), transparent) }.border-red-500{border-color:color-mix(in oklab, var(--colors-red-500) var(--un-border-opacity), transparent) }.dark .dark\:border-blue-500{border-color:color-mix(in oklab, var(--colors-blue-500) var(--un-border-opacity), transparent) }.dark .dark\:border-gray-600{border-color:color-mix(in oklab, var(--colors-gray-600) var(--un-border-opacity), transparent) }.dark .dark\:border-gray-700{border-color:color-mix(in oklab, var(--colors-gray-700) var(--un-border-opacity), transparent) }.dark .dark\:border-red-400{border-color:color-mix(in oklab, var(--colors-red-400) var(--un-border-opacity), transparent) }.bg-black\/50{background-color:color-mix(in oklab, var(--colors-black) 50%, transparent) }.bg-blue-600{background-color:color-mix(in oklab, var(--colors-blue-600) var(--un-bg-opacity), transparent) }.bg-gray-100{background-color:color-mix(in oklab, var(--colors-gray-100) var(--un-bg-opacity), transparent) }.bg-gray-200{background-color:color-mix(in oklab, var(--colors-gray-200) var(--un-bg-opacity), transparent) }.bg-red-600{background-color:color-mix(in oklab, var(--colors-red-600) var(--un-bg-opacity), transparent) }.bg-white{background-color:color-mix(in oklab, var(--colors-white) var(--un-bg-opacity), transparent) }.dark .dark\:bg-blue-500{background-color:color-mix(in oklab, var(--colors-blue-500) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-600{background-color:color-mix(in oklab, var(--colors-gray-600) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-700{background-color:color-mix(in oklab, var(--colors-gray-700) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-700\/50{background-color:color-mix(in oklab, var(--colors-gray-700) 50%, transparent) }.dark .dark\:bg-gray-800{background-color:color-mix(in oklab, var(--colors-gray-800) var(--un-bg-opacity), transparent) }.dark .dark\:bg-gray-800\/50{background-color:color-mix(in oklab, var(--colors-gray-800) 50%, transparent) }.dark .dark\:bg-red-500{background-color:color-mix(in oklab, var(--colors-red-500) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-blue-600:hover{background-color:color-mix(in oklab, var(--colors-blue-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-500:hover{background-color:color-mix(in oklab, var(--colors-gray-500) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-600:hover{background-color:color-mix(in oklab, var(--colors-gray-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-600\/50:hover{background-color:color-mix(in oklab, var(--colors-gray-600) 50%, transparent) }.dark .dark\:hover\:bg-gray-700\/50:hover{background-color:color-mix(in oklab, var(--colors-gray-700) 50%, transparent) }.dark .dark\:hover\:bg-gray-800:hover{background-color:color-mix(in oklab, var(--colors-gray-800) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-gray-800\/30:hover{background-color:color-mix(in oklab, var(--colors-gray-800) 30%, transparent) }.dark .dark\:hover\:bg-gray-800\/50:hover{background-color:color-mix(in oklab, var(--colors-gray-800) 50%, transparent) }.dark .dark\:hover\:bg-red-600:hover{background-color:color-mix(in oklab, var(--colors-red-600) var(--un-bg-opacity), transparent) }.dark .dark\:hover\:bg-red-900\/20:hover{background-color:color-mix(in oklab, var(--colors-red-900) 20%, transparent) }.hover\:bg-blue-700:hover{background-color:color-mix(in oklab, var(--colors-blue-700) var(--un-bg-opacity), transparent) }.hover\:bg-gray-100:hover{background-color:color-mix(in oklab, var(--colors-gray-100) var(--un-bg-opacity), transparent) }.hover\:bg-gray-200:hover{background-color:color-mix(in oklab, var(--colors-gray-200) var(--un-bg-opacity), transparent) }.hover\:bg-gray-200\/50:hover{background-color:color-mix(in oklab, var(--colors-gray-200) 50%, transparent) }.hover\:bg-gray-300:hover{background-color:color-mix(in oklab, var(--colors-gray-300) var(--un-bg-opacity), transparent) }.hover\:bg-gray-50:hover{background-color:color-mix(in oklab, var(--colors-gray-50) var(--un-bg-opacity), transparent) }.hover\:bg-gray-50\/50:hover{background-color:color-mix(in oklab, var(--colors-gray-50) 50%, transparent) }.hover\:bg-red-50:hover{background-color:color-mix(in oklab, var(--colors-red-50) var(--un-bg-opacity), transparent) }.hover\:bg-red-700:hover{background-color:color-mix(in oklab, var(--colors-red-700) var(--un-bg-opacity), transparent) }.hover\:bg-white\/50:hover{background-color:color-mix(in oklab, var(--colors-white) 50%, transparent) }.dark .dark\:ring-red-400{--un-ring-color:color-mix(in oklab, var(--colors-red-400) var(--un-ring-opacity), transparent) }.ring-red-500{--un-ring-color:color-mix(in oklab, var(--colors-red-500) var(--un-ring-opacity), transparent) }.focus-within\:ring-blue-500:focus-within{--un-ring-color:color-mix(in oklab, var(--colors-blue-500) var(--un-ring-opacity), transparent) }.focus-within\:ring-red-500:focus-within{--un-ring-color:color-mix(in oklab, var(--colors-red-500) var(--un-ring-opacity), transparent) }.focus\:ring-blue-500:focus{--un-ring-color:color-mix(in oklab, var(--colors-blue-500) var(--un-ring-opacity), transparent) }.focus\:ring-red-500:focus{--un-ring-color:color-mix(in oklab, var(--colors-red-500) var(--un-ring-opacity), transparent) }.dark .dark\:focus-within\:ring-offset-gray-900:focus-within{--un-ring-offset-color:color-mix(in oklab, var(--colors-gray-900) var(--un-ring-offset-opacity), transparent) }.focus-within\:ring-offset-white:focus-within{--un-ring-offset-color:color-mix(in oklab, var(--colors-white) var(--un-ring-offset-opacity), transparent) }.dark .dark\:focus\:ring-offset-gray-900:focus{--un-ring-offset-color:color-mix(in oklab, var(--colors-gray-900) var(--un-ring-offset-opacity), transparent) }.dark .dark\:placeholder-gray-400::placeholder{color:color-mix(in oklab, var(--colors-gray-400) var(--un-placeholder-opacity), transparent) }.placeholder-gray-500::placeholder{color:color-mix(in oklab, var(--colors-gray-500) var(--un-placeholder-opacity), transparent) }}@keyframes tabs-panel-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.tabs-panel-inner{animation:.25s ease-out tabs-panel-in}
2
2
  /*$vite$:1*/
package/dist/minimalstuff-ui.js CHANGED
@@ -2,17 +2,17 @@ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { Fragment, createElement, useCallback, useEffect, useId, useState } from "react";
3
3
  import { createPortal } from "react-dom";
4
4
  function r(e) {
5
- var g, _, v = "";
6
- if (typeof e == "string" || typeof e == "number") v += e;
5
+ var y, b, x = "";
6
+ if (typeof e == "string" || typeof e == "number") x += e;
7
7
  else if (typeof e == "object") if (Array.isArray(e)) {
8
- var y = e.length;
9
- for (g = 0; g < y; g++) e[g] && (_ = r(e[g])) && (v && (v += " "), v += _);
10
- } else for (_ in e) e[_] && (v && (v += " "), v += _);
11
- return v;
8
+ var S = e.length;
9
+ for (y = 0; y < S; y++) e[y] && (b = r(e[y])) && (x && (x += " "), x += b);
10
+ } else for (b in e) e[b] && (x && (x += " "), x += b);
11
+ return x;
12
12
  }
13
13
  function clsx() {
14
- for (var e, g, _ = 0, v = "", y = arguments.length; _ < y; _++) (e = arguments[_]) && (g = r(e)) && (v && (v += " "), v += g);
15
- return v;
14
+ for (var e, y, b = 0, x = "", S = arguments.length; b < S; b++) (e = arguments[b]) && (y = r(e)) && (x && (x += " "), x += y);
15
+ return x;
16
16
  }
17
17
  var clsx_default = clsx, VARIANT_CLASSES$1 = {
18
18
  primary: "bg-blue-600 text-white hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 border-transparent",
@@ -27,74 +27,128 @@ var clsx_default = clsx, VARIANT_CLASSES$1 = {
27
27
  md: "px-4 py-2 text-sm",
28
28
  lg: "px-4 py-3 text-base"
29
29
  };
30
- const Button = ({ variant: g = "primary", size: _ = "md", children: v, className: y, fullWidth: b = !1, disabled: x, ...S }) => /* @__PURE__ */ jsx("button", {
30
+ const Button = ({ variant: b = "primary", size: x = "md", children: S, className: C, fullWidth: w = !1, loading: T = !1, disabled: E, ...D }) => /* @__PURE__ */ jsxs("button", {
31
31
  type: "button",
32
- className: clsx_default("cursor-pointer inline-flex items-center justify-center gap-2 rounded-md font-medium transition-all duration-200 border focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-900 disabled:opacity-50 disabled:cursor-not-allowed", VARIANT_CLASSES$1[g], SIZE_CLASSES$2[_], b && "w-full", y),
33
- disabled: x,
34
- ...S,
35
- children: v
32
+ className: clsx_default("cursor-pointer inline-flex items-center justify-center gap-2 rounded-md font-medium transition-all duration-200 border focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:focus:ring-offset-gray-900 disabled:opacity-50 disabled:cursor-not-allowed", VARIANT_CLASSES$1[b], SIZE_CLASSES$2[x], w && "w-full", C),
33
+ disabled: E ?? T,
34
+ ...D,
35
+ children: [T && /* @__PURE__ */ jsx("span", {
36
+ className: "i-svg-spinners-3-dots-fade w-4 h-4",
37
+ "aria-hidden": "true"
38
+ }), S]
36
39
  });
37
40
  var CHARACTER_COUNT_STYLES = "text-xs text-gray-500 dark:text-gray-400 mt-1 text-right";
38
- function CharacterCount({ current: e, min: _, max: v, showMin: y, showMax: b }) {
39
- let x = _ !== void 0 && e <= _, S = v !== void 0 && e >= v, C = v !== void 0 && e > v;
41
+ function CharacterCount({ current: e, min: b, max: x, showMin: S, showMax: C }) {
42
+ let w = b !== void 0 && e <= b, T = x !== void 0 && e >= x, E = x !== void 0 && e > x;
40
43
  return /* @__PURE__ */ jsxs("div", {
41
44
  className: CHARACTER_COUNT_STYLES,
42
45
  children: [
43
- y && _ !== void 0 && /* @__PURE__ */ jsxs("span", {
44
- className: x ? "text-amber-600 dark:text-amber-400" : "",
46
+ S && b !== void 0 && /* @__PURE__ */ jsxs("span", {
47
+ className: w ? "text-amber-600 dark:text-amber-400" : "",
45
48
  children: [
46
49
  e,
47
50
  "/",
48
- _,
51
+ b,
49
52
  " min"
50
53
  ]
51
54
  }),
52
- y && b && " · ",
53
- b && v !== void 0 && /* @__PURE__ */ jsxs("span", {
54
- className: C ? "text-red-600 dark:text-red-400" : S ? "text-amber-600 dark:text-amber-400" : "",
55
+ S && C && " · ",
56
+ C && x !== void 0 && /* @__PURE__ */ jsxs("span", {
57
+ className: E ? "text-red-600 dark:text-red-400" : T ? "text-amber-600 dark:text-amber-400" : "",
55
58
  children: [
56
59
  e,
57
60
  "/",
58
- v,
61
+ x,
59
62
  " max"
60
63
  ]
61
64
  }),
62
- !y && !b && v !== void 0 && /* @__PURE__ */ jsxs("span", {
63
- className: C ? "text-red-600 dark:text-red-400" : S ? "text-amber-600 dark:text-amber-400" : "",
65
+ !S && !C && x !== void 0 && /* @__PURE__ */ jsxs("span", {
66
+ className: E ? "text-red-600 dark:text-red-400" : T ? "text-amber-600 dark:text-amber-400" : "",
64
67
  children: [
65
68
  e,
66
69
  "/",
67
- v
70
+ x
68
71
  ]
69
72
  }),
70
- !y && !b && _ !== void 0 && v === void 0 && /* @__PURE__ */ jsxs("span", {
71
- className: x ? "text-amber-600 dark:text-amber-400" : "",
73
+ !S && !C && b !== void 0 && x === void 0 && /* @__PURE__ */ jsxs("span", {
74
+ className: w ? "text-amber-600 dark:text-amber-400" : "",
72
75
  children: [
73
76
  e,
74
77
  " (min ",
75
- _,
78
+ b,
76
79
  ")"
77
80
  ]
78
81
  })
79
82
  ]
80
83
  });
81
84
  }
85
+ function Checkbox({ label: b, error: x, className: S, wrapperClassName: C, checked: E, defaultChecked: D = !1, onChange: O, id: k = "checkbox", ...A }) {
86
+ let j = `${k}-${useId()}`, [M, N] = useState(D), P = E !== void 0, F = P ? E : M;
87
+ return /* @__PURE__ */ jsxs("div", {
88
+ className: clsx_default("w-full", C),
89
+ children: [/* @__PURE__ */ jsxs("label", {
90
+ htmlFor: j,
91
+ className: clsx_default("flex items-start gap-3 cursor-pointer", A.disabled && "cursor-not-allowed opacity-50"),
92
+ children: [/* @__PURE__ */ jsxs("span", {
93
+ className: clsx_default("relative mt-0.5 shrink-0 rounded", "focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-offset-white dark:focus-within:ring-offset-gray-900", x ? "focus-within:ring-red-500" : "focus-within:ring-blue-500"),
94
+ children: [/* @__PURE__ */ jsx("input", {
95
+ type: "checkbox",
96
+ id: j,
97
+ className: "sr-only",
98
+ checked: E,
99
+ defaultChecked: D,
100
+ onChange: (e) => {
101
+ P || N(e.target.checked), O?.(e);
102
+ },
103
+ "aria-invalid": !!x,
104
+ "aria-describedby": x ? `${j}-error` : void 0,
105
+ ...A
106
+ }), /* @__PURE__ */ jsx("span", {
107
+ className: clsx_default("flex h-5 w-5 items-center justify-center rounded border-2 transition-all duration-200", F ? "border-blue-600 bg-blue-600 dark:border-blue-500 dark:bg-blue-500" : "border-gray-300 bg-white dark:border-gray-600 dark:bg-gray-800", x && "border-red-500 dark:border-red-400", S),
108
+ "aria-hidden": !0,
109
+ children: F && /* @__PURE__ */ jsx("svg", {
110
+ className: "h-3 w-3 text-white",
111
+ viewBox: "0 0 12 12",
112
+ fill: "none",
113
+ stroke: "currentColor",
114
+ strokeWidth: "2.5",
115
+ strokeLinecap: "round",
116
+ strokeLinejoin: "round",
117
+ children: /* @__PURE__ */ jsx("polyline", { points: "2 6 5 9 10 3" })
118
+ })
119
+ })]
120
+ }), b && /* @__PURE__ */ jsxs("span", {
121
+ className: "text-sm font-medium text-gray-700 dark:text-gray-300 select-none",
122
+ children: [b, A.required && /* @__PURE__ */ jsx("span", {
123
+ className: "text-red-500 dark:text-red-400 ml-1",
124
+ children: "*"
125
+ })]
126
+ })]
127
+ }), x && /* @__PURE__ */ jsx("p", {
128
+ id: `${j}-error`,
129
+ className: "text-xs text-red-600 dark:text-red-400 mt-1 ml-8",
130
+ role: "alert",
131
+ children: x
132
+ })]
133
+ });
134
+ }
82
135
  const useClientOnly = () => {
83
- let [e, g] = useState(!1);
136
+ let [e, y] = useState(!1);
84
137
  return useEffect(() => {
85
138
  requestAnimationFrame(() => {
86
- g(!0);
139
+ y(!0);
87
140
  });
88
141
  }, []), e;
89
- }, withClientOnly = (g) => (_) => useClientOnly() ? /* @__PURE__ */ jsx(g, { ..._ }) : null;
90
- function ClientOnly({ children: e, fallback: g }) {
91
- return useClientOnly() ? createElement(Fragment, { children: e }) : g ?? null;
142
+ }, withClientOnly = (y) => (b) => useClientOnly() ? /* @__PURE__ */ jsx(y, { ...b }) : null;
143
+ function ClientOnly({ children: e, fallback: y }) {
144
+ return useClientOnly() ? createElement(Fragment, { children: e }) : y ?? null;
92
145
  }
93
146
  var VARIANT_CLASSES = {
94
147
  default: "text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800",
95
148
  ghost: "text-gray-600 dark:text-gray-400 hover:bg-white/50 dark:hover:bg-gray-800/50",
96
149
  danger: "text-red-600 dark:text-red-400 hover:bg-red-50 dark:hover:bg-red-900/20",
97
- outline: "text-gray-600 dark:text-gray-400 border border-gray-300 dark:border-gray-600 hover:bg-white/50 dark:hover:bg-gray-800/50"
150
+ outline: "text-gray-600 dark:text-gray-400 border border-gray-300 dark:border-gray-600 hover:bg-white/50 dark:hover:bg-gray-800/50",
151
+ subtle: "text-gray-500 dark:text-gray-500 hover:text-gray-700 dark:hover:text-gray-300 hover:bg-gray-50/50 dark:hover:bg-gray-800/30"
98
152
  }, SIZE_CLASSES$1 = {
99
153
  sm: "p-1",
100
154
  md: "p-2",
@@ -104,54 +158,57 @@ var VARIANT_CLASSES = {
104
158
  md: "w-5 h-5",
105
159
  lg: "w-6 h-6"
106
160
  };
107
- const IconButton = ({ icon: _, "aria-label": v, variant: y = "default", size: b = "md", className: x, children: S, ref: C, ...w }) => /* @__PURE__ */ jsxs("button", {
108
- ref: C,
161
+ const IconButton = ({ icon: b, "aria-label": x, variant: S = "default", size: C = "md", className: w, children: T, ref: E, ...D }) => /* @__PURE__ */ jsxs("button", {
162
+ ref: E,
109
163
  type: "button",
110
- "aria-label": v,
111
- className: clsx_default("cursor-pointer inline-flex items-center justify-center rounded transition-colors", "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500", VARIANT_CLASSES[y], SIZE_CLASSES$1[b], x),
112
- ...w,
113
- children: [/* @__PURE__ */ jsx("div", { className: clsx_default(_, ICON_SIZE_CLASSES[b], S && "mr-1") }), S]
164
+ "aria-label": x,
165
+ className: clsx_default("cursor-pointer inline-flex items-center justify-center rounded transition-colors", "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500", VARIANT_CLASSES[S], SIZE_CLASSES$1[C], w),
166
+ ...D,
167
+ children: [/* @__PURE__ */ jsx("div", { className: clsx_default(b, ICON_SIZE_CLASSES[C], T && "mr-1") }), T]
114
168
  }), BASE_INPUT_STYLES = "w-full rounded-md border border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed";
115
- function Input({ label: _, error: v, showCharCount: y = !1, minLength: b, maxLength: C, className: w, wrapperClassName: T, value: E, defaultValue: D, onChange: O, id: k = "input", ...j }) {
116
- let M = `${k}-${useId()}`, [N, P] = useState(typeof D == "string" ? D.length : 0), F = typeof E == "string" ? E.length : E === void 0 ? N : 0, I = y && (b !== void 0 || C !== void 0);
169
+ function Input({ label: b, error: x, showCharCount: S = !1, minLength: C, maxLength: E, className: D, wrapperClassName: O, value: k, defaultValue: A, onChange: j, id: M = "input", ...P }) {
170
+ let F = `${M}-${useId()}`, [I, L] = useState(typeof A == "string" ? A.length : 0), R = typeof k == "string" ? k.length : k === void 0 ? I : 0, z = S && (C !== void 0 || E !== void 0);
117
171
  return /* @__PURE__ */ jsxs("div", {
118
- className: clsx_default("w-full", T),
172
+ className: clsx_default("w-full", O),
119
173
  children: [
120
- _ && /* @__PURE__ */ jsx("label", {
174
+ b && /* @__PURE__ */ jsxs("label", {
121
175
  className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",
122
- htmlFor: M,
123
- children: _
176
+ htmlFor: F,
177
+ children: [b, P.required && /* @__PURE__ */ jsx("span", {
178
+ className: "text-red-500 dark:text-red-400 ml-1",
179
+ children: "*"
180
+ })]
124
181
  }),
125
182
  /* @__PURE__ */ jsx("input", {
126
- id: M,
127
- className: clsx_default(BASE_INPUT_STYLES, "px-3 py-2 text-sm", v && "border-red-500 dark:border-red-400 focus:ring-red-500", w),
128
- value: E,
129
- defaultValue: D,
130
- minLength: b,
131
- maxLength: C,
183
+ id: F,
184
+ className: clsx_default(BASE_INPUT_STYLES, "px-3 py-2 text-sm", x && "border-red-500 dark:border-red-400 focus:ring-red-500", D),
185
+ value: k,
186
+ defaultValue: A,
187
+ minLength: C,
188
+ maxLength: E,
132
189
  onChange: (e) => {
133
- E === void 0 && P(e.target.value.length), O?.(e);
190
+ k === void 0 && L(e.target.value.length), j?.(e);
134
191
  },
135
- ...j
192
+ ...P
136
193
  }),
137
- I && /* @__PURE__ */ jsx(CharacterCount, {
138
- current: F,
139
- min: b,
140
- max: C,
141
- showMin: b !== void 0,
142
- showMax: C !== void 0
194
+ z && /* @__PURE__ */ jsx(CharacterCount, {
195
+ current: R,
196
+ min: C,
197
+ max: E,
198
+ showMin: C !== void 0,
199
+ showMax: E !== void 0
143
200
  }),
144
- v && /* @__PURE__ */ jsx("p", {
201
+ x && /* @__PURE__ */ jsx("p", {
145
202
  className: "text-xs text-red-600 dark:text-red-400 mt-1",
146
- children: v
203
+ children: x
147
204
  })
148
205
  ]
149
206
  });
150
207
  }
151
208
  function useRunAfterAnimation(e) {
152
- return useCallback((g) => {
153
- let _ = setTimeout(g, e);
154
- return () => clearTimeout(_);
209
+ return useCallback((y) => {
210
+ let b = setTimeout(y, e);
211
+ return () => clearTimeout(b);
155
212
  }, [e]);
156
213
  }
157
214
  var ANIMATION_DURATION_MS = 200, SIZE_CLASSES = {
@@ -160,160 +217,243 @@ var ANIMATION_DURATION_MS = 200, SIZE_CLASSES = {
160
217
  lg: "max-w-2xl",
161
218
  xl: "max-w-4xl"
162
219
  };
163
- function Modal({ isOpen: _ = !1, onClose: v, title: y, children: x, size: w = "md", className: T }) {
164
- let [E, D] = useState(!1), [O, k] = useState(!1), [A, j] = useState(!1), M = useRunAfterAnimation(ANIMATION_DURATION_MS);
220
+ function Modal({ isOpen: b = !1, onClose: x, title: S, children: w, size: D = "md", className: O }) {
221
+ let [k, A] = useState(!1), [j, M] = useState(!1), [N, P] = useState(!1), F = useRunAfterAnimation(ANIMATION_DURATION_MS);
165
222
  useEffect(() => {
166
- if (_ && !O) {
223
+ if (b && !j) {
167
224
  document.body.style.overflow = "hidden";
168
225
  let e = setTimeout(() => {
169
- k(!0), D(!1), requestAnimationFrame(() => {
170
- requestAnimationFrame(() => j(!0));
226
+ M(!0), A(!1), requestAnimationFrame(() => {
227
+ requestAnimationFrame(() => P(!0));
171
228
  });
172
229
  }, 0);
173
230
  return () => clearTimeout(e);
174
231
  }
175
- if (!_ && O) {
232
+ if (!b && j) {
176
233
  let e = setTimeout(() => {
177
- D(!0), j(!1);
178
- }, 0), g = M(() => {
179
- k(!1), D(!1), document.body.style.overflow = "";
234
+ A(!0), P(!1);
235
+ }, 0), y = F(() => {
236
+ M(!1), A(!1), document.body.style.overflow = "";
180
237
  });
181
238
  return () => {
182
- clearTimeout(e), g();
239
+ clearTimeout(e), y();
183
240
  };
184
241
  }
185
242
  }, [
186
- _,
187
- O,
188
- M
243
+ b,
244
+ j,
245
+ F
189
246
  ]), useEffect(() => {
190
- if (!_ || E) return;
247
+ if (!b || k) return;
191
248
  let e = (e) => {
192
- e.key === "Escape" && v?.();
249
+ e.key === "Escape" && x?.();
193
250
  };
194
251
  return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
195
252
  }, [
196
- _,
197
- E,
198
- v
253
+ b,
254
+ k,
255
+ x
199
256
  ]);
200
- let N = () => {
201
- E || v?.();
257
+ let I = () => {
258
+ k || x?.();
202
259
  };
203
- if (!O) return null;
204
- let P = A && !E;
260
+ if (!j) return null;
261
+ let L = N && !k;
205
262
  return createPortal(/* @__PURE__ */ jsxs("div", {
206
- className: clsx_default("fixed inset-0 z-50 h-fit flex justify-center p-4 mt-32", "transition-opacity duration-200", P ? "opacity-100" : "opacity-0"),
207
- onClick: N,
263
+ className: clsx_default("fixed inset-0 z-50 h-fit flex justify-center p-4 mt-32", "transition-opacity duration-200", L ? "opacity-100" : "opacity-0"),
264
+ onClick: I,
208
265
  children: [/* @__PURE__ */ jsx("div", {
209
- className: clsx_default("fixed inset-0 bg-black/50 backdrop-blur-sm", "transition-opacity duration-200", P ? "opacity-100" : "opacity-0"),
266
+ className: clsx_default("fixed inset-0 bg-black/50 backdrop-blur-sm", "transition-opacity duration-200", L ? "opacity-100" : "opacity-0"),
210
267
  "aria-hidden": "true"
211
268
  }), /* @__PURE__ */ jsxs("div", {
212
- className: clsx_default("relative w-full", SIZE_CLASSES[w], "bg-white dark:bg-gray-800 rounded-lg shadow-xl", "max-h-[90vh] overflow-hidden flex flex-col", "transition-all duration-200", P ? "opacity-100 scale-100 translate-y-0" : "opacity-0 scale-95 translate-y-2"),
269
+ className: clsx_default("relative w-full", SIZE_CLASSES[D], "bg-white dark:bg-gray-800 rounded-lg shadow-xl", "max-h-[90vh] overflow-hidden flex flex-col", "transition-all duration-200", L ? "opacity-100 scale-100 translate-y-0" : "opacity-0 scale-95 translate-y-2"),
213
270
  onClick: (e) => e.stopPropagation(),
214
- children: [y && /* @__PURE__ */ jsxs("div", {
271
+ children: [S && /* @__PURE__ */ jsxs("div", {
215
272
  className: "flex items-center justify-between px-6 py-4 border-b border-gray-200 dark:border-gray-700",
216
273
  children: [/* @__PURE__ */ jsx("h2", {
217
274
  className: "text-lg font-semibold text-gray-900 dark:text-gray-100",
218
- children: y
275
+ children: S
219
276
  }), /* @__PURE__ */ jsx(IconButton, {
220
277
  icon: "i-mdi-close",
221
- onClick: v?.bind(null),
278
+ onClick: x?.bind(null),
222
279
  "aria-label": "Close",
223
280
  variant: "ghost",
224
281
  className: "text-gray-400 hover:text-gray-600 dark:hover:text-gray-300"
225
282
  })]
226
283
  }), /* @__PURE__ */ jsx("div", {
227
- className: clsx_default("flex-1 overflow-y-auto px-6 py-4 text-gray-600 dark:text-gray-400", T),
228
- children: x
284
+ className: clsx_default("flex-1 overflow-y-auto px-6 py-4 text-gray-600 dark:text-gray-400", O),
285
+ children: w
229
286
  })]
230
287
  })]
231
288
  }), document.body);
232
289
  }
233
- function Tabs({ items: _, defaultIndex: v = 0, className: y, tabListClassName: b, panelClassName: x, onChange: C }) {
234
- let [w, T] = useState(v), E = (e) => {
235
- _[e]?.disabled || (T(e), C?.(e));
236
- }, D = _[w];
290
+ function Select({ options: b, label: x, error: S, placeholder: C, className: T, wrapperClassName: E, value: D, defaultValue: O, onChange: k, id: A = "select", ...j }) {
291
+ let M = `${A}-${useId()}`;
292
+ return /* @__PURE__ */ jsxs("div", {
293
+ className: clsx_default("w-full", E),
294
+ children: [
295
+ x && /* @__PURE__ */ jsxs("label", {
296
+ className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",
297
+ htmlFor: M,
298
+ children: [x, j.required && /* @__PURE__ */ jsx("span", {
299
+ className: "text-red-500 dark:text-red-400 ml-1",
300
+ children: "*"
301
+ })]
302
+ }),
303
+ /* @__PURE__ */ jsxs("select", {
304
+ id: M,
305
+ className: clsx_default(BASE_INPUT_STYLES, "pl-3 pr-8 py-2 text-sm appearance-none bg-[length:1rem_1rem] bg-[position:right_0.5rem_center] bg-no-repeat", "bg-[url(\"data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%236b7280%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27M6 8l4 4 4-4%27/%3e%3c/svg%3e\")]", S && "border-red-500 dark:border-red-400 focus:ring-red-500", T),
306
+ value: D,
307
+ defaultValue: O,
308
+ onChange: k,
309
+ "aria-invalid": !!S,
310
+ "aria-describedby": S ? `${M}-error` : void 0,
311
+ ...j,
312
+ children: [C !== void 0 && /* @__PURE__ */ jsx("option", {
313
+ value: "",
314
+ children: C
315
+ }), b.map((y) => /* @__PURE__ */ jsx("option", {
316
+ value: y.value,
317
+ children: y.label
318
+ }, y.value))]
319
+ }),
320
+ S && /* @__PURE__ */ jsx("p", {
321
+ id: `${M}-error`,
322
+ className: "text-xs text-red-600 dark:text-red-400 mt-1",
323
+ role: "alert",
324
+ children: S
325
+ })
326
+ ]
327
+ });
328
+ }
329
+ function Switch({ label: b, error: x, className: S, wrapperClassName: C, checked: E, defaultChecked: D = !1, onChange: O, id: k = "switch", ...A }) {
330
+ let j = `${k}-${useId()}`, [M, N] = useState(D), P = E !== void 0, F = P ? E : M;
331
+ return /* @__PURE__ */ jsxs("div", {
332
+ className: clsx_default("w-full", C),
333
+ children: [/* @__PURE__ */ jsxs("label", {
334
+ htmlFor: j,
335
+ className: clsx_default("flex items-center gap-3 cursor-pointer", A.disabled && "cursor-not-allowed opacity-50"),
336
+ children: [/* @__PURE__ */ jsxs("span", {
337
+ className: clsx_default("relative inline-flex w-11 shrink-0 rounded-full border-2 border-transparent", "transition-colors duration-200 ease-in-out", "focus-within:outline-none focus-within:ring-2 focus-within:ring-blue-500 focus-within:ring-offset-2", "disabled:opacity-50", F ? "bg-blue-600 dark:bg-blue-500" : "bg-gray-200 dark:bg-gray-600", x && "ring-2 ring-red-500 dark:ring-red-400", S),
338
+ children: [/* @__PURE__ */ jsx("input", {
339
+ type: "checkbox",
340
+ role: "switch",
341
+ id: j,
342
+ className: "sr-only",
343
+ checked: E,
344
+ defaultChecked: D,
345
+ onChange: (e) => {
346
+ P || N(e.target.checked), O?.(e);
347
+ },
348
+ "aria-invalid": !!x,
349
+ "aria-describedby": x ? `${j}-error` : void 0,
350
+ ...A
351
+ }), /* @__PURE__ */ jsx("span", {
352
+ className: clsx_default("pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0", "transition duration-200 ease-in-out", F ? "translate-x-5.25" : "translate-x-0"),
353
+ "aria-hidden": !0
354
+ })]
355
+ }), b && /* @__PURE__ */ jsxs("span", {
356
+ className: "text-sm font-medium text-gray-700 dark:text-gray-300 select-none",
357
+ children: [b, A.required && /* @__PURE__ */ jsx("span", {
358
+ className: "text-red-500 dark:text-red-400 ml-1",
359
+ children: "*"
360
+ })]
361
+ })]
362
+ }), x && /* @__PURE__ */ jsx("p", {
363
+ id: `${j}-error`,
364
+ className: "text-xs text-red-600 dark:text-red-400 mt-1 ml-14",
365
+ role: "alert",
366
+ children: x
367
+ })]
368
+ });
369
+ }
370
+ function Tabs({ items: b, defaultIndex: x = 0, className: S, tabListClassName: C, panelClassName: w, onChange: E }) {
371
+ let [D, O] = useState(x), k = (e) => {
372
+ b[e]?.disabled || (O(e), E?.(e));
373
+ }, A = b[D];
237
374
  return /* @__PURE__ */ jsxs("div", {
238
- className: clsx_default("w-full", y),
375
+ className: clsx_default("w-full", S),
239
376
  children: [/* @__PURE__ */ jsx("div", {
240
377
  role: "tablist",
241
- className: clsx_default("flex gap-1 p-1 rounded-md bg-gray-100 dark:bg-gray-800/50 border border-gray-200 dark:border-gray-700", b),
242
- children: _.map((_, v) => /* @__PURE__ */ jsxs("button", {
378
+ className: clsx_default("flex gap-1 p-1 rounded-md bg-gray-100 dark:bg-gray-800/50 border border-gray-200 dark:border-gray-700", C),
379
+ children: b.map((b, x) => /* @__PURE__ */ jsxs("button", {
243
380
  role: "tab",
244
381
  type: "button",
245
- "aria-selected": w === v,
246
- "aria-disabled": _.disabled,
247
- disabled: _.disabled,
248
- onClick: () => E(v),
249
- className: clsx_default("flex items-center gap-2 px-4 py-2.5 rounded-md text-sm font-medium", w === v ? "bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm border border-gray-200 dark:border-gray-600" : clsx_default("text-gray-600 dark:text-gray-400 border border-transparent", _.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer hover:text-gray-900 dark:hover:text-gray-200 hover:bg-gray-200/50 dark:hover:bg-gray-700/50")),
250
- children: [_.icon && /* @__PURE__ */ jsx("span", { className: clsx_default("w-4 h-4 block shrink-0", _.icon, w === v ? "text-blue-600 dark:text-blue-400" : "text-gray-500 dark:text-gray-400") }), _.title]
251
- }, v))
382
+ "aria-selected": D === x,
383
+ "aria-disabled": b.disabled,
384
+ disabled: b.disabled,
385
+ onClick: () => k(x),
386
+ className: clsx_default("flex items-center gap-2 px-4 py-2.5 rounded-md text-sm font-medium", D === x ? "bg-white dark:bg-gray-700 text-blue-600 dark:text-blue-400 shadow-sm border border-gray-200 dark:border-gray-600" : clsx_default("text-gray-600 dark:text-gray-400 border border-transparent", b.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer hover:text-gray-900 dark:hover:text-gray-200 hover:bg-gray-200/50 dark:hover:bg-gray-700/50")),
387
+ children: [b.icon && /* @__PURE__ */ jsx("span", { className: clsx_default("w-4 h-4 block shrink-0", b.icon, D === x ? "text-blue-600 dark:text-blue-400" : "text-gray-500 dark:text-gray-400") }), b.title]
388
+ }, x))
252
389
  }), /* @__PURE__ */ jsx("div", {
253
390
  role: "tabpanel",
254
- className: clsx_default("mt-3 rounded-md border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800/50 p-4 overflow-hidden", x),
391
+ className: clsx_default("mt-3 rounded-md border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800/50 p-4 overflow-hidden", w),
255
392
  children: /* @__PURE__ */ jsx("div", {
256
393
  className: "tabs-panel-inner",
257
- children: D?.content
258
- }, w)
394
+ children: A?.content
395
+ }, D)
259
396
  })]
260
397
  });
261
398
  }
262
- function Textarea({ label: _, error: v, showCharCount: y = !1, minLength: b, maxLength: C, className: w, wrapperClassName: T, value: E, defaultValue: D, onChange: O, id: k = "textarea", ...j }) {
263
- let M = `${k}-${useId()}`, [N, P] = useState(typeof D == "string" ? D.length : 0), F = typeof E == "string" ? E.length : E === void 0 ? N : 0, I = y && (b !== void 0 || C !== void 0);
399
+ function Textarea({ label: b, error: x, showCharCount: S = !1, minLength: C, maxLength: E, className: D, wrapperClassName: O, value: k, defaultValue: A, onChange: j, id: M = "textarea", ...P }) {
400
+ let F = `${M}-${useId()}`, [I, L] = useState(typeof A == "string" ? A.length : 0), R = typeof k == "string" ? k.length : k === void 0 ? I : 0, z = S && (C !== void 0 || E !== void 0);
264
401
  return /* @__PURE__ */ jsxs("div", {
265
- className: clsx_default("w-full", T),
402
+ className: clsx_default("w-full", O),
266
403
  children: [
267
- _ && /* @__PURE__ */ jsx("label", {
404
+ b && /* @__PURE__ */ jsxs("label", {
268
405
  className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",
269
- htmlFor: M,
270
- children: _
406
+ htmlFor: F,
407
+ children: [b, P.required && /* @__PURE__ */ jsx("span", {
408
+ className: "text-red-500 dark:text-red-400 ml-1",
409
+ children: "*"
410
+ })]
271
411
  }),
272
412
  /* @__PURE__ */ jsx("textarea", {
273
- id: M,
274
- className: clsx_default(BASE_INPUT_STYLES, "px-3 py-2 text-sm min-h-[80px] resize-y", v && "border-red-500 dark:border-red-400 focus:ring-red-500", w),
275
- value: E,
276
- defaultValue: D,
277
- minLength: b,
278
- maxLength: C,
413
+ id: F,
414
+ className: clsx_default(BASE_INPUT_STYLES, "px-3 py-2 text-sm min-h-[80px] resize-y", x && "border-red-500 dark:border-red-400 focus:ring-red-500", D),
415
+ value: k,
416
+ defaultValue: A,
417
+ minLength: C,
418
+ maxLength: E,
279
419
  onChange: (e) => {
280
- E === void 0 && P(e.target.value.length), O?.(e);
420
+ k === void 0 && L(e.target.value.length), j?.(e);
281
421
  },
282
- ...j
422
+ ...P
283
423
  }),
284
- I && /* @__PURE__ */ jsx(CharacterCount, {
285
- current: F,
286
- min: b,
287
- max: C,
288
- showMin: b !== void 0,
289
- showMax: C !== void 0
424
+ z && /* @__PURE__ */ jsx(CharacterCount, {
425
+ current: R,
426
+ min: C,
427
+ max: E,
428
+ showMin: C !== void 0,
429
+ showMax: E !== void 0
290
430
  }),
291
- v && /* @__PURE__ */ jsx("p", {
431
+ x && /* @__PURE__ */ jsx("p", {
292
432
  className: "text-xs text-red-600 dark:text-red-400 mt-1",
293
- children: v
433
+ children: x
294
434
  })
295
435
  ]
296
436
  });
297
437
  }
298
438
  const useIsClient = () => {
299
- let [e, g] = useState(!1);
439
+ let [e, y] = useState(!1);
300
440
  return useEffect(() => {
301
441
  requestAnimationFrame(() => {
302
- g(!0);
442
+ y(!0);
303
443
  });
304
444
  }, []), e;
305
445
  };
306
446
  function applyTheme(e) {
307
- let g = document.documentElement;
308
- e === "system" ? window.matchMedia("(prefers-color-scheme: dark)").matches ? g.classList.add("dark") : g.classList.remove("dark") : e === "dark" ? g.classList.add("dark") : g.classList.remove("dark");
447
+ let y = document.documentElement;
448
+ e === "system" ? window.matchMedia("(prefers-color-scheme: dark)").matches ? y.classList.add("dark") : y.classList.remove("dark") : e === "dark" ? y.classList.add("dark") : y.classList.remove("dark");
309
449
  }
310
- function getIcon(g) {
450
+ function getIcon(y) {
311
451
  return /* @__PURE__ */ jsx("div", {
312
452
  className: clsx_default({
313
453
  light: "i-tabler-sun text-yellow-500",
314
454
  dark: "i-tabler-moon-stars text-gray-700 dark:text-yellow-500",
315
455
  system: "i-tabler-device-desktop text-blue-500"
316
- }[g], "w-5 h-5"),
456
+ }[y], "w-5 h-5"),
317
457
  style: {
318
458
  width: 20,
319
459
  height: 20
@@ -321,29 +461,29 @@ function getIcon(g) {
321
461
  });
322
462
  }
323
463
  function ThemeToggle() {
324
- let [g, _] = useState("system"), v = useIsClient();
464
+ let [y, b] = useState("system"), x = useIsClient();
325
465
  return useEffect(() => {
326
466
  let e = localStorage.getItem("theme");
327
467
  requestAnimationFrame(() => {
328
- e ? (_(e), applyTheme(e)) : (_("system"), applyTheme("system"));
468
+ e ? (b(e), applyTheme(e)) : (b("system"), applyTheme("system"));
329
469
  });
330
470
  }, []), useEffect(() => {
331
- let e = window.matchMedia("(prefers-color-scheme: dark)"), _ = () => {
332
- g === "system" && applyTheme("system");
471
+ let e = window.matchMedia("(prefers-color-scheme: dark)"), b = () => {
472
+ y === "system" && applyTheme("system");
333
473
  };
334
- return e.addEventListener("change", _), () => {
335
- e.removeEventListener("change", _);
474
+ return e.addEventListener("change", b), () => {
475
+ e.removeEventListener("change", b);
336
476
  };
337
- }, [g]), /* @__PURE__ */ jsx("button", {
477
+ }, [y]), /* @__PURE__ */ jsx("button", {
338
478
  onClick: useCallback(() => {
339
- _((e) => {
340
- let g;
341
- return g = e === "light" ? "dark" : e === "dark" ? "system" : "light", applyTheme(g), localStorage.setItem("theme", g), g;
479
+ b((e) => {
480
+ let y;
481
+ return y = e === "light" ? "dark" : e === "dark" ? "system" : "light", applyTheme(y), localStorage.setItem("theme", y), y;
342
482
  });
343
483
  }, []),
344
484
  className: "p-2.5 rounded-lg bg-gray-100 dark:bg-gray-700/50 border border-gray-200 dark:border-gray-600 hover:bg-gray-200 dark:hover:bg-gray-600 transition-all duration-200 cursor-pointer",
345
- "aria-label": `Thème actuel: ${g}`,
346
- children: v ? getIcon(g) : /* @__PURE__ */ jsx("div", {
485
+ "aria-label": `Thème actuel: ${y}`,
486
+ children: x ? getIcon(y) : /* @__PURE__ */ jsx("div", {
347
487
  className: "i-tabler-device-desktop w-5 h-5 text-gray-400",
348
488
  style: {
349
489
  width: "20px",
@@ -352,4 +492,4 @@ function ThemeToggle() {
352
492
  })
353
493
  });
354
494
  }
355
- export { BASE_INPUT_STYLES, Button, CharacterCount, ClientOnly, IconButton, Input, Modal, Tabs, Textarea, ThemeToggle, applyTheme, useClientOnly, useIsClient, useRunAfterAnimation, withClientOnly };
495
+ export { BASE_INPUT_STYLES, Button, CharacterCount, Checkbox, ClientOnly, IconButton, Input, Modal, Select, Switch, Tabs, Textarea, ThemeToggle, applyTheme, useClientOnly, useIsClient, useRunAfterAnimation, withClientOnly };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@minimalstuff/ui",
3
- "version": "1.0.0",
3
+ "version": "1.1.1",
4
4
  "type": "module",
5
5
  "main": "./dist/minimalstuff-ui.js",
6
6
  "module": "./dist/minimalstuff-ui.js",
@@ -39,58 +39,61 @@
39
39
  "#components/*": "./src/components/*.js",
40
40
  "#hooks/*": "./src/hooks/*.js",
41
41
  "#types/*": "./src/types/*.js",
42
- "#utils/*": "./src/utils/*.js"
42
+ "#utils/*": "./src/utils/*.js",
43
+ "#stores/*": "./src/stores/*.js"
43
44
  },
44
45
  "peerDependencies": {
45
46
  "react": "^18.0.0 || ^19.0.0",
46
47
  "react-dom": "^18.0.0 || ^19.0.0"
47
48
  },
48
49
  "dependencies": {
49
- "clsx": "^2.1.1"
50
+ "clsx": "^2.1.1",
51
+ "zustand": "^5.0.11"
50
52
  },
51
53
  "devDependencies": {
52
54
  "@chromatic-com/storybook": "^5.0.0",
53
- "@eslint/js": "^9.39.1",
54
- "@storybook/addon-a11y": "^10.2.3",
55
- "@storybook/addon-docs": "^10.2.3",
56
- "@storybook/addon-onboarding": "^10.2.3",
57
- "@storybook/addon-vitest": "^10.2.3",
58
- "@storybook/react-vite": "^10.2.3",
55
+ "@eslint/js": "^9.39.2",
56
+ "@storybook/addon-a11y": "^10.2.4",
57
+ "@storybook/addon-docs": "^10.2.4",
58
+ "@storybook/addon-onboarding": "^10.2.4",
59
+ "@storybook/addon-vitest": "^10.2.4",
60
+ "@storybook/react-vite": "^10.2.4",
59
61
  "@testing-library/jest-dom": "^6.9.1",
60
62
  "@testing-library/react": "^16.3.2",
61
63
  "@types/node": "^24.10.1",
62
- "@types/react": "^19.2.5",
64
+ "@types/react": "^19.2.10",
63
65
  "@types/react-dom": "^19.2.3",
64
66
  "@unocss/preset-icons": "^66.6.0",
65
67
  "@unocss/preset-web-fonts": "^66.6.0",
66
- "@vitejs/plugin-react-swc": "^4.2.2",
68
+ "@vitejs/plugin-react-swc": "^4.2.3",
67
69
  "@vitest/browser-playwright": "^4.0.18",
68
70
  "@vitest/coverage-v8": "^4.0.18",
69
- "eslint": "^9.39.1",
71
+ "eslint": "^9.39.2",
70
72
  "eslint-plugin-react-hooks": "^7.0.1",
71
- "eslint-plugin-react-refresh": "^0.4.24",
72
- "eslint-plugin-storybook": "^10.2.3",
73
+ "eslint-plugin-react-refresh": "^0.5.0",
74
+ "eslint-plugin-storybook": "^10.2.4",
73
75
  "globals": "^16.5.0",
74
76
  "happy-dom": "^20.4.0",
75
- "playwright": "^1.58.0",
77
+ "playwright": "^1.58.1",
76
78
  "prettier": "3.8.1",
77
- "react": "^19.2.0",
78
- "react-dom": "^19.2.0",
79
+ "react": "^19.2.4",
80
+ "react-dom": "^19.2.4",
79
81
  "release-it": "^19.2.4",
80
- "storybook": "^10.2.3",
82
+ "storybook": "^10.2.4",
81
83
  "typescript": "~5.9.3",
82
- "typescript-eslint": "^8.46.4",
84
+ "typescript-eslint": "^8.54.0",
83
85
  "unocss": "^66.6.0",
84
- "vite": "npm:rolldown-vite@7.2.5",
86
+ "vite": "npm:rolldown-vite@7.3.1",
85
87
  "vite-plugin-dts": "^4.5.4",
86
88
  "vitest": "^4.0.18"
87
89
  },
88
90
  "pnpm": {
89
91
  "overrides": {
90
- "vite": "npm:rolldown-vite@7.2.5"
92
+ "vite": "npm:rolldown-vite@7.3.1"
91
93
  },
92
94
  "onlyBuiltDependencies": [
93
- "@swc/core"
95
+ "@swc/core",
96
+ "esbuild"
94
97
  ]
95
98
  },
96
99
  "prettier": {