@onesaz/ui 0.1.9 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -146,30 +146,28 @@ function cn(...inputs) {
146
146
 
147
147
  // src/components/button.tsx
148
148
  import * as React2 from "react";
149
- import { Slot } from "@radix-ui/react-slot";
150
149
  import { jsx as jsx2 } from "react/jsx-runtime";
151
150
  var Button = React2.forwardRef(
152
- ({ className, variant = "default", size = "default", asChild = false, ...props }, ref) => {
153
- const Comp = asChild ? Slot : "button";
151
+ ({ className, variant = "default", size = "default", ...props }, ref) => {
154
152
  return /* @__PURE__ */ jsx2(
155
- Comp,
153
+ "button",
156
154
  {
157
155
  className: cn(
158
- "inline-flex items-center justify-center whitespace-nowrap rounded-[var(--radius)] text-sm font-medium transition-colors",
159
- "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
156
+ "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors",
157
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
160
158
  "disabled:pointer-events-none disabled:opacity-50",
161
159
  {
162
- "bg-[var(--accent)] text-[var(--accent-foreground)] hover:bg-[var(--accent-hover)]": variant === "default",
163
- "bg-[var(--destructive)] text-[var(--destructive-foreground)] hover:bg-[var(--destructive)]/90": variant === "destructive",
164
- "border border-[var(--input)] bg-[var(--background)] hover:bg-[var(--muted)] hover:text-[var(--foreground)]": variant === "outline",
165
- "bg-[var(--muted)] text-[var(--foreground)] hover:bg-[var(--muted)]/80": variant === "secondary",
166
- "hover:bg-[var(--muted)] hover:text-[var(--foreground)]": variant === "ghost",
167
- "text-[var(--accent)] underline-offset-4 hover:underline": variant === "link"
160
+ "bg-accent text-accent-foreground hover:bg-accent-hover": variant === "default",
161
+ "bg-destructive text-destructive-foreground hover:bg-destructive/90": variant === "destructive",
162
+ "border border-input bg-background hover:bg-muted hover:text-foreground": variant === "outline",
163
+ "bg-muted text-foreground hover:bg-muted/80": variant === "secondary",
164
+ "hover:bg-muted hover:text-foreground": variant === "ghost",
165
+ "text-accent underline-offset-4 hover:underline": variant === "link"
168
166
  },
169
167
  {
170
168
  "h-10 px-4 py-2": size === "default",
171
- "h-9 rounded-[var(--radius)] px-3": size === "sm",
172
- "h-11 rounded-[var(--radius)] px-8": size === "lg",
169
+ "h-9 rounded-md px-3": size === "sm",
170
+ "h-11 rounded-md px-8": size === "lg",
173
171
  "h-10 w-10": size === "icon"
174
172
  },
175
173
  className
@@ -192,10 +190,10 @@ var Input = React3.forwardRef(
192
190
  {
193
191
  type,
194
192
  className: cn(
195
- "flex h-10 w-full rounded-[var(--radius)] border border-[var(--input)] bg-[var(--background)] px-3 py-2 text-sm",
196
- "ring-offset-[var(--background)] file:border-0 file:bg-transparent file:text-sm file:font-medium",
197
- "placeholder:text-[var(--muted-foreground)]",
198
- "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
193
+ "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
194
+ "ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium",
195
+ "placeholder:text-muted-foreground",
196
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
199
197
  "disabled:cursor-not-allowed disabled:opacity-50",
200
198
  className
201
199
  ),
@@ -216,10 +214,10 @@ var Textarea = React4.forwardRef(
216
214
  "textarea",
217
215
  {
218
216
  className: cn(
219
- "flex min-h-[80px] w-full rounded-[var(--radius)] border border-[var(--input)] bg-[var(--background)] px-3 py-2 text-sm",
220
- "ring-offset-[var(--background)]",
221
- "placeholder:text-[var(--muted-foreground)]",
222
- "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
217
+ "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
218
+ "ring-offset-background",
219
+ "placeholder:text-muted-foreground",
220
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
223
221
  "disabled:cursor-not-allowed disabled:opacity-50",
224
222
  className
225
223
  ),
@@ -240,7 +238,7 @@ var Card = React5.forwardRef(
240
238
  {
241
239
  ref,
242
240
  className: cn(
243
- "rounded-[var(--radius-lg)] border border-[var(--border)] bg-[var(--card)] text-[var(--card-foreground)] shadow-sm",
241
+ "rounded-lg border border-border bg-card text-card-foreground shadow-sm",
244
242
  className
245
243
  ),
246
244
  ...props
@@ -275,7 +273,7 @@ var CardDescription = React5.forwardRef(
275
273
  "p",
276
274
  {
277
275
  ref,
278
- className: cn("text-sm text-[var(--muted-foreground)]", className),
276
+ className: cn("text-sm text-muted-foreground", className),
279
277
  ...props
280
278
  }
281
279
  )
@@ -308,12 +306,12 @@ var Badge = React6.forwardRef(
308
306
  ref,
309
307
  className: cn(
310
308
  "inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-semibold transition-colors",
311
- "focus:outline-none focus:ring-2 focus:ring-[var(--ring)] focus:ring-offset-2",
309
+ "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
312
310
  {
313
- "border-transparent bg-[var(--accent)] text-[var(--accent-foreground)]": variant === "default",
314
- "border-transparent bg-[var(--muted)] text-[var(--foreground)]": variant === "secondary",
315
- "border-transparent bg-[var(--destructive)] text-[var(--destructive-foreground)]": variant === "destructive",
316
- "border border-[var(--border)] text-[var(--foreground)]": variant === "outline"
311
+ "border-transparent bg-accent text-accent-foreground": variant === "default",
312
+ "border-transparent bg-muted text-foreground": variant === "secondary",
313
+ "border-transparent bg-destructive text-destructive-foreground": variant === "destructive",
314
+ "border border-border text-foreground": variant === "outline"
317
315
  },
318
316
  className
319
317
  ),
@@ -326,395 +324,252 @@ Badge.displayName = "Badge";
326
324
 
327
325
  // src/components/label.tsx
328
326
  import * as React7 from "react";
329
- import * as LabelPrimitive from "@radix-ui/react-label";
330
327
  import { jsx as jsx7 } from "react/jsx-runtime";
331
- var Label = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
332
- LabelPrimitive.Root,
333
- {
334
- ref,
335
- className: cn(
336
- "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
337
- className
338
- ),
339
- ...props
340
- }
341
- ));
342
- Label.displayName = LabelPrimitive.Root.displayName;
328
+ var Label = React7.forwardRef(
329
+ ({ className, ...props }, ref) => /* @__PURE__ */ jsx7(
330
+ "label",
331
+ {
332
+ ref,
333
+ className: cn(
334
+ "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
335
+ className
336
+ ),
337
+ ...props
338
+ }
339
+ )
340
+ );
341
+ Label.displayName = "Label";
343
342
 
344
343
  // src/components/checkbox.tsx
345
344
  import * as React8 from "react";
346
- import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
347
345
  import { jsx as jsx8 } from "react/jsx-runtime";
348
- var Checkbox = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
349
- CheckboxPrimitive.Root,
350
- {
351
- ref,
352
- className: cn(
353
- "peer h-4 w-4 shrink-0 rounded-sm border border-[var(--accent)]",
354
- "ring-offset-[var(--background)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2",
355
- "disabled:cursor-not-allowed disabled:opacity-50",
356
- "data-[state=checked]:bg-[var(--accent)] data-[state=checked]:text-[var(--accent-foreground)]",
357
- className
358
- ),
359
- ...props,
360
- children: /* @__PURE__ */ jsx8(CheckboxPrimitive.Indicator, { className: cn("flex items-center justify-center text-current"), children: /* @__PURE__ */ jsx8(
361
- "svg",
362
- {
363
- xmlns: "http://www.w3.org/2000/svg",
364
- viewBox: "0 0 24 24",
365
- fill: "none",
366
- stroke: "currentColor",
367
- strokeWidth: "3",
368
- strokeLinecap: "round",
369
- strokeLinejoin: "round",
370
- className: "h-3 w-3",
371
- children: /* @__PURE__ */ jsx8("polyline", { points: "20 6 9 17 4 12" })
372
- }
373
- ) })
374
- }
375
- ));
376
- Checkbox.displayName = CheckboxPrimitive.Root.displayName;
346
+ var Checkbox = React8.forwardRef(
347
+ ({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
348
+ "input",
349
+ {
350
+ type: "checkbox",
351
+ ref,
352
+ className: cn(
353
+ "h-4 w-4 shrink-0 rounded-sm border border-accent cursor-pointer",
354
+ "ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
355
+ "disabled:cursor-not-allowed disabled:opacity-50",
356
+ "accent-accent",
357
+ className
358
+ ),
359
+ ...props
360
+ }
361
+ )
362
+ );
363
+ Checkbox.displayName = "Checkbox";
377
364
 
378
365
  // src/components/switch.tsx
379
366
  import * as React9 from "react";
380
- import * as SwitchPrimitives from "@radix-ui/react-switch";
381
- import { jsx as jsx9 } from "react/jsx-runtime";
382
- var Switch = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
383
- SwitchPrimitives.Root,
384
- {
385
- className: cn(
386
- "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
387
- "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--background)]",
388
- "disabled:cursor-not-allowed disabled:opacity-50",
389
- "data-[state=checked]:bg-[var(--accent)] data-[state=unchecked]:bg-[var(--input)]",
390
- className
367
+ import { jsx as jsx9, jsxs } from "react/jsx-runtime";
368
+ var Switch = React9.forwardRef(
369
+ ({ className, ...props }, ref) => /* @__PURE__ */ jsxs("label", { className: cn("relative inline-flex items-center cursor-pointer", className), children: [
370
+ /* @__PURE__ */ jsx9(
371
+ "input",
372
+ {
373
+ type: "checkbox",
374
+ ref,
375
+ className: "sr-only peer",
376
+ ...props
377
+ }
391
378
  ),
392
- ...props,
393
- ref,
394
- children: /* @__PURE__ */ jsx9(
395
- SwitchPrimitives.Thumb,
379
+ /* @__PURE__ */ jsx9(
380
+ "div",
396
381
  {
397
382
  className: cn(
398
- "pointer-events-none block h-5 w-5 rounded-full bg-[var(--background)] shadow-lg ring-0 transition-transform",
399
- "data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
383
+ "w-11 h-6 rounded-full transition-colors",
384
+ "bg-input peer-checked:bg-accent",
385
+ "peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-ring peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-background",
386
+ "peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
387
+ 'after:content-[""] after:absolute after:top-[2px] after:left-[2px]',
388
+ "after:bg-background after:rounded-full after:h-5 after:w-5",
389
+ "after:transition-transform after:shadow-lg",
390
+ "peer-checked:after:translate-x-5"
400
391
  )
401
392
  }
402
393
  )
403
- }
404
- ));
405
- Switch.displayName = SwitchPrimitives.Root.displayName;
394
+ ] })
395
+ );
396
+ Switch.displayName = "Switch";
406
397
 
407
398
  // src/components/separator.tsx
408
399
  import * as React10 from "react";
409
- import * as SeparatorPrimitive from "@radix-ui/react-separator";
410
400
  import { jsx as jsx10 } from "react/jsx-runtime";
411
- var Separator = React10.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx10(
412
- SeparatorPrimitive.Root,
413
- {
414
- ref,
415
- decorative,
416
- orientation,
417
- className: cn(
418
- "shrink-0 bg-[var(--border)]",
419
- orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
420
- className
421
- ),
422
- ...props
423
- }
424
- ));
425
- Separator.displayName = SeparatorPrimitive.Root.displayName;
401
+ var Separator = React10.forwardRef(
402
+ ({ className, orientation = "horizontal", ...props }, ref) => /* @__PURE__ */ jsx10(
403
+ "div",
404
+ {
405
+ ref,
406
+ role: "separator",
407
+ "aria-orientation": orientation,
408
+ className: cn(
409
+ "shrink-0 bg-border",
410
+ orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
411
+ className
412
+ ),
413
+ ...props
414
+ }
415
+ )
416
+ );
417
+ Separator.displayName = "Separator";
426
418
 
427
419
  // src/components/select/index.tsx
428
420
  import * as React11 from "react";
429
- import * as SelectPrimitive from "@radix-ui/react-select";
430
- import { jsx as jsx11, jsxs } from "react/jsx-runtime";
431
- var Select = SelectPrimitive.Root;
432
- var SelectGroup = SelectPrimitive.Group;
433
- var SelectValue = SelectPrimitive.Value;
434
- var SelectTrigger = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
435
- SelectPrimitive.Trigger,
436
- {
437
- ref,
438
- className: cn(
439
- "flex h-10 w-full items-center justify-between rounded-[var(--radius)] border border-[var(--input)] bg-[var(--background)] px-3 py-2 text-sm",
440
- "ring-offset-[var(--background)] placeholder:text-[var(--muted-foreground)]",
441
- "focus:outline-none focus:ring-2 focus:ring-[var(--ring)] focus:ring-offset-2",
442
- "disabled:cursor-not-allowed disabled:opacity-50",
443
- "[&>span]:line-clamp-1",
444
- className
445
- ),
446
- ...props,
447
- children: [
448
- children,
449
- /* @__PURE__ */ jsx11(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx11(
450
- "svg",
451
- {
452
- xmlns: "http://www.w3.org/2000/svg",
453
- width: "24",
454
- height: "24",
455
- viewBox: "0 0 24 24",
456
- fill: "none",
457
- stroke: "currentColor",
458
- strokeWidth: "2",
459
- strokeLinecap: "round",
460
- strokeLinejoin: "round",
461
- className: "h-4 w-4 opacity-50",
462
- children: /* @__PURE__ */ jsx11("path", { d: "m6 9 6 6 6-6" })
463
- }
464
- ) })
465
- ]
466
- }
467
- ));
468
- SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
469
- var SelectScrollUpButton = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
470
- SelectPrimitive.ScrollUpButton,
471
- {
472
- ref,
473
- className: cn("flex cursor-default items-center justify-center py-1", className),
474
- ...props,
475
- children: /* @__PURE__ */ jsx11(
476
- "svg",
477
- {
478
- xmlns: "http://www.w3.org/2000/svg",
479
- width: "24",
480
- height: "24",
481
- viewBox: "0 0 24 24",
482
- fill: "none",
483
- stroke: "currentColor",
484
- strokeWidth: "2",
485
- strokeLinecap: "round",
486
- strokeLinejoin: "round",
487
- className: "h-4 w-4",
488
- children: /* @__PURE__ */ jsx11("path", { d: "m18 15-6-6-6 6" })
489
- }
490
- )
491
- }
492
- ));
493
- SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
494
- var SelectScrollDownButton = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
495
- SelectPrimitive.ScrollDownButton,
496
- {
497
- ref,
498
- className: cn("flex cursor-default items-center justify-center py-1", className),
499
- ...props,
500
- children: /* @__PURE__ */ jsx11(
501
- "svg",
502
- {
503
- xmlns: "http://www.w3.org/2000/svg",
504
- width: "24",
505
- height: "24",
506
- viewBox: "0 0 24 24",
507
- fill: "none",
508
- stroke: "currentColor",
509
- strokeWidth: "2",
510
- strokeLinecap: "round",
511
- strokeLinejoin: "round",
512
- className: "h-4 w-4",
513
- children: /* @__PURE__ */ jsx11("path", { d: "m6 9 6 6 6-6" })
514
- }
515
- )
516
- }
517
- ));
518
- SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
519
- var SelectContent = React11.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx11(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
520
- SelectPrimitive.Content,
521
- {
522
- ref,
523
- className: cn(
524
- "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-[var(--radius)] border border-[var(--border)] bg-[var(--popover)] text-[var(--popover-foreground)] shadow-md",
525
- "data-[state=open]:animate-in data-[state=closed]:animate-out",
526
- "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
527
- "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
528
- "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
529
- "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
530
- position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
531
- className
532
- ),
533
- position,
534
- ...props,
535
- children: [
536
- /* @__PURE__ */ jsx11(SelectScrollUpButton, {}),
537
- /* @__PURE__ */ jsx11(
538
- SelectPrimitive.Viewport,
539
- {
540
- className: cn(
541
- "p-1",
542
- position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
543
- ),
544
- children
545
- }
421
+ import { jsx as jsx11 } from "react/jsx-runtime";
422
+ var Select = React11.forwardRef(
423
+ ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx11(
424
+ "select",
425
+ {
426
+ ref,
427
+ className: cn(
428
+ "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm",
429
+ "ring-offset-background",
430
+ "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
431
+ "disabled:cursor-not-allowed disabled:opacity-50",
432
+ className
546
433
  ),
547
- /* @__PURE__ */ jsx11(SelectScrollDownButton, {})
548
- ]
549
- }
550
- ) }));
551
- SelectContent.displayName = SelectPrimitive.Content.displayName;
552
- var SelectLabel = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
553
- SelectPrimitive.Label,
554
- {
555
- ref,
556
- className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className),
557
- ...props
558
- }
559
- ));
560
- SelectLabel.displayName = SelectPrimitive.Label.displayName;
561
- var SelectItem = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
562
- SelectPrimitive.Item,
563
- {
564
- ref,
565
- className: cn(
566
- "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none",
567
- "focus:bg-[var(--muted)] focus:text-[var(--foreground)]",
568
- "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
569
- className
570
- ),
571
- ...props,
572
- children: [
573
- /* @__PURE__ */ jsx11("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx11(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx11(
574
- "svg",
575
- {
576
- xmlns: "http://www.w3.org/2000/svg",
577
- width: "24",
578
- height: "24",
579
- viewBox: "0 0 24 24",
580
- fill: "none",
581
- stroke: "currentColor",
582
- strokeWidth: "2",
583
- strokeLinecap: "round",
584
- strokeLinejoin: "round",
585
- className: "h-4 w-4",
586
- children: /* @__PURE__ */ jsx11("polyline", { points: "20 6 9 17 4 12" })
587
- }
588
- ) }) }),
589
- /* @__PURE__ */ jsx11(SelectPrimitive.ItemText, { children })
590
- ]
591
- }
592
- ));
593
- SelectItem.displayName = SelectPrimitive.Item.displayName;
594
- var SelectSeparator = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
595
- SelectPrimitive.Separator,
596
- {
597
- ref,
598
- className: cn("-mx-1 my-1 h-px bg-[var(--muted)]", className),
599
- ...props
600
- }
601
- ));
602
- SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
434
+ ...props,
435
+ children
436
+ }
437
+ )
438
+ );
439
+ Select.displayName = "Select";
440
+ var SelectOption = React11.forwardRef(
441
+ ({ className, ...props }, ref) => /* @__PURE__ */ jsx11("option", { ref, className: cn("py-1.5", className), ...props })
442
+ );
443
+ SelectOption.displayName = "SelectOption";
444
+ var SelectGroup = React11.forwardRef(
445
+ ({ className, ...props }, ref) => /* @__PURE__ */ jsx11("optgroup", { ref, className: cn("font-semibold", className), ...props })
446
+ );
447
+ SelectGroup.displayName = "SelectGroup";
603
448
  var SelectNamespace = Object.assign(Select, {
604
- Group: SelectGroup,
605
- Value: SelectValue,
606
- Trigger: SelectTrigger,
607
- Content: SelectContent,
608
- Label: SelectLabel,
609
- Item: SelectItem,
610
- Separator: SelectSeparator,
611
- ScrollUpButton: SelectScrollUpButton,
612
- ScrollDownButton: SelectScrollDownButton
449
+ Option: SelectOption,
450
+ Group: SelectGroup
613
451
  });
614
452
 
615
453
  // src/components/dialog/index.tsx
616
454
  import * as React12 from "react";
617
- import * as DialogPrimitive from "@radix-ui/react-dialog";
618
- import { jsx as jsx12, jsxs as jsxs2 } from "react/jsx-runtime";
619
- var Dialog = DialogPrimitive.Root;
620
- var DialogTrigger = DialogPrimitive.Trigger;
621
- var DialogPortal = DialogPrimitive.Portal;
622
- var DialogClose = DialogPrimitive.Close;
623
- var DialogOverlay = React12.forwardRef(({ className, style, ...props }, ref) => /* @__PURE__ */ jsx12(
624
- DialogPrimitive.Overlay,
625
- {
626
- ref,
627
- className: cn(
628
- "fixed inset-0 bg-black/80",
629
- "data-[state=open]:animate-in data-[state=closed]:animate-out",
630
- "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
631
- className
455
+ import { Fragment, jsx as jsx12, jsxs as jsxs2 } from "react/jsx-runtime";
456
+ var Dialog = ({ open, onOpenChange, children }) => {
457
+ React12.useEffect(() => {
458
+ const handleEscape = (e) => {
459
+ if (e.key === "Escape" && open) {
460
+ onOpenChange?.(false);
461
+ }
462
+ };
463
+ document.addEventListener("keydown", handleEscape);
464
+ return () => document.removeEventListener("keydown", handleEscape);
465
+ }, [open, onOpenChange]);
466
+ if (!open) return null;
467
+ return /* @__PURE__ */ jsx12(Fragment, { children });
468
+ };
469
+ Dialog.displayName = "Dialog";
470
+ var DialogContent = React12.forwardRef(
471
+ ({ className, children, onClose, ...props }, ref) => /* @__PURE__ */ jsxs2(Fragment, { children: [
472
+ /* @__PURE__ */ jsx12(
473
+ "div",
474
+ {
475
+ className: "fixed inset-0 z-50 bg-black/80",
476
+ onClick: onClose
477
+ }
632
478
  ),
633
- style: { zIndex: 99999, ...style },
634
- ...props
635
- }
636
- ));
637
- DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
638
- var DialogContent = React12.forwardRef(({ className, children, style, ...props }, ref) => /* @__PURE__ */ jsxs2(DialogPortal, { children: [
639
- /* @__PURE__ */ jsx12(DialogOverlay, {}),
640
- /* @__PURE__ */ jsxs2(
641
- DialogPrimitive.Content,
642
- {
643
- ref,
644
- className: cn(
645
- "fixed left-1/2 top-1/2 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 p-6 shadow-lg duration-200",
646
- "bg-white border border-slate-200 text-slate-900",
647
- "dark:bg-slate-900 dark:border-slate-700 dark:text-slate-50",
648
- "data-[state=open]:animate-in data-[state=closed]:animate-out",
649
- "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
650
- "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
651
- "sm:rounded-lg",
652
- className
653
- ),
654
- style: { zIndex: 99999, ...style },
655
- ...props,
656
- children: [
657
- children,
658
- /* @__PURE__ */ jsxs2(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-white transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-purple-500 focus:ring-offset-2 disabled:pointer-events-none dark:ring-offset-slate-900", children: [
659
- /* @__PURE__ */ jsxs2(
660
- "svg",
479
+ /* @__PURE__ */ jsxs2(
480
+ "div",
481
+ {
482
+ ref,
483
+ className: cn(
484
+ "fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 p-6 shadow-lg",
485
+ "bg-popover border border-border text-popover-foreground",
486
+ "rounded-lg",
487
+ className
488
+ ),
489
+ ...props,
490
+ children: [
491
+ children,
492
+ onClose && /* @__PURE__ */ jsxs2(
493
+ "button",
661
494
  {
662
- xmlns: "http://www.w3.org/2000/svg",
663
- width: "24",
664
- height: "24",
665
- viewBox: "0 0 24 24",
666
- fill: "none",
667
- stroke: "currentColor",
668
- strokeWidth: "2",
669
- strokeLinecap: "round",
670
- strokeLinejoin: "round",
671
- className: "h-4 w-4",
495
+ type: "button",
496
+ onClick: onClose,
497
+ className: "absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
672
498
  children: [
673
- /* @__PURE__ */ jsx12("path", { d: "M18 6 6 18" }),
674
- /* @__PURE__ */ jsx12("path", { d: "m6 6 12 12" })
499
+ /* @__PURE__ */ jsxs2(
500
+ "svg",
501
+ {
502
+ xmlns: "http://www.w3.org/2000/svg",
503
+ width: "24",
504
+ height: "24",
505
+ viewBox: "0 0 24 24",
506
+ fill: "none",
507
+ stroke: "currentColor",
508
+ strokeWidth: "2",
509
+ strokeLinecap: "round",
510
+ strokeLinejoin: "round",
511
+ className: "h-4 w-4",
512
+ children: [
513
+ /* @__PURE__ */ jsx12("path", { d: "M18 6 6 18" }),
514
+ /* @__PURE__ */ jsx12("path", { d: "m6 6 12 12" })
515
+ ]
516
+ }
517
+ ),
518
+ /* @__PURE__ */ jsx12("span", { className: "sr-only", children: "Close" })
675
519
  ]
676
520
  }
677
- ),
678
- /* @__PURE__ */ jsx12("span", { className: "sr-only", children: "Close" })
679
- ] })
680
- ]
681
- }
682
- )
683
- ] }));
684
- DialogContent.displayName = DialogPrimitive.Content.displayName;
685
- var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx12("div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
686
- DialogHeader.displayName = "DialogHeader";
687
- var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx12(
521
+ )
522
+ ]
523
+ }
524
+ )
525
+ ] })
526
+ );
527
+ DialogContent.displayName = "DialogContent";
528
+ var DialogHeader = ({
529
+ className,
530
+ ...props
531
+ }) => /* @__PURE__ */ jsx12(
688
532
  "div",
689
533
  {
690
- className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
534
+ className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className),
691
535
  ...props
692
536
  }
693
537
  );
694
- DialogFooter.displayName = "DialogFooter";
695
- var DialogTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
696
- DialogPrimitive.Title,
697
- {
698
- ref,
699
- className: cn("text-lg font-semibold leading-none tracking-tight", className),
700
- ...props
701
- }
702
- ));
703
- DialogTitle.displayName = DialogPrimitive.Title.displayName;
704
- var DialogDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
705
- DialogPrimitive.Description,
538
+ DialogHeader.displayName = "DialogHeader";
539
+ var DialogFooter = ({
540
+ className,
541
+ ...props
542
+ }) => /* @__PURE__ */ jsx12(
543
+ "div",
706
544
  {
707
- ref,
708
- className: cn("text-sm text-slate-500 dark:text-slate-400", className),
545
+ className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
709
546
  ...props
710
547
  }
711
- ));
712
- DialogDescription.displayName = DialogPrimitive.Description.displayName;
548
+ );
549
+ DialogFooter.displayName = "DialogFooter";
550
+ var DialogTitle = React12.forwardRef(
551
+ ({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
552
+ "h2",
553
+ {
554
+ ref,
555
+ className: cn("text-lg font-semibold leading-none tracking-tight", className),
556
+ ...props
557
+ }
558
+ )
559
+ );
560
+ DialogTitle.displayName = "DialogTitle";
561
+ var DialogDescription = React12.forwardRef(
562
+ ({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
563
+ "p",
564
+ {
565
+ ref,
566
+ className: cn("text-sm text-muted-foreground", className),
567
+ ...props
568
+ }
569
+ )
570
+ );
571
+ DialogDescription.displayName = "DialogDescription";
713
572
  var DialogNamespace = Object.assign(Dialog, {
714
- Portal: DialogPortal,
715
- Overlay: DialogOverlay,
716
- Close: DialogClose,
717
- Trigger: DialogTrigger,
718
573
  Content: DialogContent,
719
574
  Header: DialogHeader,
720
575
  Footer: DialogFooter,
@@ -740,7 +595,7 @@ var Spinner = React13.forwardRef(
740
595
  "h-6 w-6": size === "default",
741
596
  "h-8 w-8": size === "lg"
742
597
  },
743
- "text-[var(--accent)]",
598
+ "text-accent",
744
599
  className
745
600
  ),
746
601
  ...props,
@@ -779,7 +634,7 @@ var TableFooter = React14.forwardRef(({ className, ...props }, ref) => /* @__PUR
779
634
  {
780
635
  ref,
781
636
  className: cn(
782
- "border-t bg-[var(--muted)]/50 font-medium [&>tr]:last:border-b-0",
637
+ "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
783
638
  className
784
639
  ),
785
640
  ...props
@@ -791,9 +646,9 @@ var TableRow = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__
791
646
  {
792
647
  ref,
793
648
  className: cn(
794
- "border-b border-[var(--border)] transition-colors",
795
- "hover:bg-[var(--muted)]/50",
796
- "data-[state=selected]:bg-[var(--muted)]",
649
+ "border-b border-border transition-colors",
650
+ "hover:bg-muted/50",
651
+ "data-[state=selected]:bg-muted",
797
652
  className
798
653
  ),
799
654
  ...props
@@ -805,7 +660,7 @@ var TableHead = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE_
805
660
  {
806
661
  ref,
807
662
  className: cn(
808
- "h-12 px-4 text-left align-middle font-medium text-[var(--muted-foreground)]",
663
+ "h-12 px-4 text-left align-middle font-medium text-muted-foreground",
809
664
  "[&:has([role=checkbox])]:pr-0",
810
665
  className
811
666
  ),
@@ -829,7 +684,7 @@ var TableCaption = React14.forwardRef(({ className, ...props }, ref) => /* @__PU
829
684
  "caption",
830
685
  {
831
686
  ref,
832
- className: cn("mt-4 text-sm text-[var(--muted-foreground)]", className),
687
+ className: cn("mt-4 text-sm text-muted-foreground", className),
833
688
  ...props
834
689
  }
835
690
  ));
@@ -988,7 +843,6 @@ var PaginationNamespace = Object.assign(Pagination, {
988
843
 
989
844
  // src/components/combobox/index.tsx
990
845
  import * as React16 from "react";
991
- import * as PopoverPrimitive from "@radix-ui/react-popover";
992
846
  import { jsx as jsx16, jsxs as jsxs4 } from "react/jsx-runtime";
993
847
  var Combobox = React16.forwardRef(
994
848
  ({
@@ -1005,6 +859,7 @@ var Combobox = React16.forwardRef(
1005
859
  const [open, setOpen] = React16.useState(false);
1006
860
  const [search, setSearch] = React16.useState("");
1007
861
  const [internalValue, setInternalValue] = React16.useState(defaultValue ?? "");
862
+ const containerRef = React16.useRef(null);
1008
863
  const value = controlledValue !== void 0 ? controlledValue : internalValue;
1009
864
  const filteredOptions = React16.useMemo(() => {
1010
865
  if (!search) return options;
@@ -1021,25 +876,33 @@ var Combobox = React16.forwardRef(
1021
876
  setOpen(false);
1022
877
  setSearch("");
1023
878
  };
1024
- return /* @__PURE__ */ jsxs4(PopoverPrimitive.Root, { open, onOpenChange: setOpen, children: [
1025
- /* @__PURE__ */ jsx16(PopoverPrimitive.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs4(
879
+ React16.useEffect(() => {
880
+ const handleClickOutside = (event) => {
881
+ if (containerRef.current && !containerRef.current.contains(event.target)) {
882
+ setOpen(false);
883
+ }
884
+ };
885
+ document.addEventListener("mousedown", handleClickOutside);
886
+ return () => document.removeEventListener("mousedown", handleClickOutside);
887
+ }, []);
888
+ return /* @__PURE__ */ jsxs4("div", { ref: containerRef, className: "relative", children: [
889
+ /* @__PURE__ */ jsxs4(
1026
890
  "button",
1027
891
  {
1028
- ref,
1029
892
  type: "button",
1030
893
  role: "combobox",
1031
894
  "aria-expanded": open,
1032
895
  disabled,
896
+ onClick: () => setOpen(!open),
1033
897
  className: cn(
1034
- "flex h-10 w-full items-center justify-between rounded-[var(--radius)] border border-[var(--input)] bg-[var(--background)] px-3 py-2 text-sm",
1035
- "ring-offset-[var(--background)]",
1036
- "placeholder:text-[var(--muted-foreground)]",
1037
- "focus:outline-none focus:ring-2 focus:ring-[var(--ring)] focus:ring-offset-2",
898
+ "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm",
899
+ "ring-offset-background",
900
+ "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
1038
901
  "disabled:cursor-not-allowed disabled:opacity-50",
1039
902
  className
1040
903
  ),
1041
904
  children: [
1042
- /* @__PURE__ */ jsx16("span", { className: cn(!selectedOption && "text-[var(--muted-foreground)]"), children: selectedOption?.label ?? placeholder }),
905
+ /* @__PURE__ */ jsx16("span", { className: cn(!selectedOption && "text-muted-foreground"), children: selectedOption?.label ?? placeholder }),
1043
906
  /* @__PURE__ */ jsx16(
1044
907
  "svg",
1045
908
  {
@@ -1061,21 +924,54 @@ var Combobox = React16.forwardRef(
1061
924
  )
1062
925
  ]
1063
926
  }
1064
- ) }),
1065
- /* @__PURE__ */ jsx16(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsxs4(
1066
- PopoverPrimitive.Content,
1067
- {
1068
- className: cn(
1069
- "z-50 w-[var(--radix-popover-trigger-width)] overflow-hidden rounded-[var(--radius)] border border-[var(--border)] bg-[var(--popover)] text-[var(--popover-foreground)] shadow-md",
1070
- "data-[state=open]:animate-in data-[state=closed]:animate-out",
1071
- "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
1072
- "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
1073
- "data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2"
927
+ ),
928
+ open && /* @__PURE__ */ jsxs4("div", { className: "absolute z-50 mt-1 w-full overflow-hidden rounded-md border border-border bg-popover text-popover-foreground shadow-md", children: [
929
+ /* @__PURE__ */ jsxs4("div", { className: "flex items-center border-b border-border px-3", children: [
930
+ /* @__PURE__ */ jsxs4(
931
+ "svg",
932
+ {
933
+ xmlns: "http://www.w3.org/2000/svg",
934
+ width: "24",
935
+ height: "24",
936
+ viewBox: "0 0 24 24",
937
+ fill: "none",
938
+ stroke: "currentColor",
939
+ strokeWidth: "2",
940
+ strokeLinecap: "round",
941
+ strokeLinejoin: "round",
942
+ className: "mr-2 h-4 w-4 shrink-0 opacity-50",
943
+ children: [
944
+ /* @__PURE__ */ jsx16("circle", { cx: "11", cy: "11", r: "8" }),
945
+ /* @__PURE__ */ jsx16("path", { d: "m21 21-4.3-4.3" })
946
+ ]
947
+ }
1074
948
  ),
1075
- sideOffset: 4,
1076
- children: [
1077
- /* @__PURE__ */ jsxs4("div", { className: "flex items-center border-b border-[var(--border)] px-3", children: [
1078
- /* @__PURE__ */ jsxs4(
949
+ /* @__PURE__ */ jsx16(
950
+ "input",
951
+ {
952
+ ref,
953
+ className: "flex h-10 w-full bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground",
954
+ placeholder: searchPlaceholder,
955
+ value: search,
956
+ onChange: (e) => setSearch(e.target.value)
957
+ }
958
+ )
959
+ ] }),
960
+ /* @__PURE__ */ jsx16("div", { className: "max-h-[300px] overflow-y-auto p-1", children: filteredOptions.length === 0 ? /* @__PURE__ */ jsx16("div", { className: "py-6 text-center text-sm text-muted-foreground", children: emptyMessage }) : filteredOptions.map((option) => /* @__PURE__ */ jsxs4(
961
+ "button",
962
+ {
963
+ type: "button",
964
+ disabled: option.disabled,
965
+ onClick: () => handleSelect(option.value),
966
+ className: cn(
967
+ "relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none",
968
+ "hover:bg-muted hover:text-foreground",
969
+ "focus:bg-muted focus:text-foreground",
970
+ "disabled:pointer-events-none disabled:opacity-50",
971
+ option.value === value && "bg-muted"
972
+ ),
973
+ children: [
974
+ /* @__PURE__ */ jsx16("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: option.value === value && /* @__PURE__ */ jsx16(
1079
975
  "svg",
1080
976
  {
1081
977
  xmlns: "http://www.w3.org/2000/svg",
@@ -1087,61 +983,16 @@ var Combobox = React16.forwardRef(
1087
983
  strokeWidth: "2",
1088
984
  strokeLinecap: "round",
1089
985
  strokeLinejoin: "round",
1090
- className: "mr-2 h-4 w-4 shrink-0 opacity-50",
1091
- children: [
1092
- /* @__PURE__ */ jsx16("circle", { cx: "11", cy: "11", r: "8" }),
1093
- /* @__PURE__ */ jsx16("path", { d: "m21 21-4.3-4.3" })
1094
- ]
986
+ className: "h-4 w-4",
987
+ children: /* @__PURE__ */ jsx16("polyline", { points: "20 6 9 17 4 12" })
1095
988
  }
1096
- ),
1097
- /* @__PURE__ */ jsx16(
1098
- "input",
1099
- {
1100
- className: "flex h-10 w-full bg-transparent py-3 text-sm outline-none placeholder:text-[var(--muted-foreground)]",
1101
- placeholder: searchPlaceholder,
1102
- value: search,
1103
- onChange: (e) => setSearch(e.target.value)
1104
- }
1105
- )
1106
- ] }),
1107
- /* @__PURE__ */ jsx16("div", { className: "max-h-[300px] overflow-y-auto p-1", children: filteredOptions.length === 0 ? /* @__PURE__ */ jsx16("div", { className: "py-6 text-center text-sm text-[var(--muted-foreground)]", children: emptyMessage }) : filteredOptions.map((option) => /* @__PURE__ */ jsxs4(
1108
- "button",
1109
- {
1110
- type: "button",
1111
- disabled: option.disabled,
1112
- onClick: () => handleSelect(option.value),
1113
- className: cn(
1114
- "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none",
1115
- "hover:bg-[var(--muted)] hover:text-[var(--foreground)]",
1116
- "focus:bg-[var(--muted)] focus:text-[var(--foreground)]",
1117
- "disabled:pointer-events-none disabled:opacity-50",
1118
- option.value === value && "bg-[var(--muted)]"
1119
- ),
1120
- children: [
1121
- /* @__PURE__ */ jsx16("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: option.value === value && /* @__PURE__ */ jsx16(
1122
- "svg",
1123
- {
1124
- xmlns: "http://www.w3.org/2000/svg",
1125
- width: "24",
1126
- height: "24",
1127
- viewBox: "0 0 24 24",
1128
- fill: "none",
1129
- stroke: "currentColor",
1130
- strokeWidth: "2",
1131
- strokeLinecap: "round",
1132
- strokeLinejoin: "round",
1133
- className: "h-4 w-4",
1134
- children: /* @__PURE__ */ jsx16("polyline", { points: "20 6 9 17 4 12" })
1135
- }
1136
- ) }),
1137
- option.label
1138
- ]
1139
- },
1140
- option.value
1141
- )) })
1142
- ]
1143
- }
1144
- ) })
989
+ ) }),
990
+ option.label
991
+ ]
992
+ },
993
+ option.value
994
+ )) })
995
+ ] })
1145
996
  ] });
1146
997
  }
1147
998
  );
@@ -1158,15 +1009,11 @@ export {
1158
1009
  Checkbox,
1159
1010
  Combobox,
1160
1011
  DialogNamespace as Dialog,
1161
- DialogClose,
1162
1012
  DialogContent,
1163
1013
  DialogDescription,
1164
1014
  DialogFooter,
1165
1015
  DialogHeader,
1166
- DialogOverlay,
1167
- DialogPortal,
1168
1016
  DialogTitle,
1169
- DialogTrigger,
1170
1017
  Input,
1171
1018
  Label,
1172
1019
  PaginationNamespace as Pagination,
@@ -1177,15 +1024,8 @@ export {
1177
1024
  PaginationNext,
1178
1025
  PaginationPrevious,
1179
1026
  SelectNamespace as Select,
1180
- SelectContent,
1181
1027
  SelectGroup,
1182
- SelectItem,
1183
- SelectLabel,
1184
- SelectScrollDownButton,
1185
- SelectScrollUpButton,
1186
- SelectSeparator,
1187
- SelectTrigger,
1188
- SelectValue,
1028
+ SelectOption,
1189
1029
  Separator,
1190
1030
  Spinner,
1191
1031
  Switch,