@doscientos/ui 0.1.8 → 0.1.10

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
@@ -184,32 +184,106 @@ function AlertAction({ className, children, ...props }) {
184
184
 
185
185
  // src/ui/app-shell/app-shell.tsx
186
186
  import { jsx as jsx3 } from "react/jsx-runtime";
187
- function AppShell({ className, ...props }) {
188
- return /* @__PURE__ */ jsx3("div", { "data-slot": "app-shell", className: cn("flex min-h-screen w-full bg-muted/30 text-foreground", className), ...props });
187
+ function AppShell({
188
+ className,
189
+ sidebarBreakpoint = "md",
190
+ ...props
191
+ }) {
192
+ return /* @__PURE__ */ jsx3(
193
+ "div",
194
+ {
195
+ "data-slot": "app-shell",
196
+ "data-sidebar-breakpoint": sidebarBreakpoint,
197
+ className: cn("bg-background text-foreground", className),
198
+ ...props
199
+ }
200
+ );
201
+ }
202
+ function AppShellSidebar({ className, ...props }) {
203
+ return /* @__PURE__ */ jsx3(
204
+ "aside",
205
+ {
206
+ "data-slot": "app-shell-sidebar",
207
+ className: cn("w-56 shrink-0 border-r border-border bg-card text-foreground", className),
208
+ ...props
209
+ }
210
+ );
189
211
  }
190
212
  function AppShellMain({ className, ...props }) {
191
- return /* @__PURE__ */ jsx3("main", { "data-slot": "app-shell-main", className: cn("min-w-0 flex-1", className), ...props });
213
+ return /* @__PURE__ */ jsx3("main", { "data-slot": "app-shell-main", className: cn("bg-background", className), ...props });
192
214
  }
193
215
  function AppShellHeader({ className, ...props }) {
194
- return /* @__PURE__ */ jsx3("header", { "data-slot": "app-shell-header", className: cn("sticky top-0 z-10 flex min-h-14 items-center border-b border-border bg-background/85 px-4 backdrop-blur-md supports-[backdrop-filter]:bg-background/70", className), ...props });
216
+ return /* @__PURE__ */ jsx3(
217
+ "header",
218
+ {
219
+ "data-slot": "app-shell-header",
220
+ className: cn("border-b border-border bg-background px-4", className),
221
+ ...props
222
+ }
223
+ );
224
+ }
225
+ function AppShellMobileHeader({
226
+ className,
227
+ ...props
228
+ }) {
229
+ return /* @__PURE__ */ jsx3(
230
+ "header",
231
+ {
232
+ "data-slot": "app-shell-mobile-header",
233
+ className: cn("h-14 shrink-0 items-center gap-2 border-b border-border bg-background px-3", className),
234
+ ...props
235
+ }
236
+ );
195
237
  }
196
- function AppShellContent({ className, ...props }) {
197
- return /* @__PURE__ */ jsx3("div", { "data-slot": "app-shell-content", className: cn("mx-auto w-full max-w-[1600px] p-4 md:p-6", className), ...props });
238
+ function AppShellContent({
239
+ className,
240
+ size = "wide",
241
+ padded = true,
242
+ scrollable = true,
243
+ ...props
244
+ }) {
245
+ return /* @__PURE__ */ jsx3(
246
+ "div",
247
+ {
248
+ "data-slot": "app-shell-content",
249
+ "data-size": size,
250
+ "data-padded": padded || void 0,
251
+ "data-scrollable": scrollable || void 0,
252
+ className,
253
+ ...props
254
+ }
255
+ );
198
256
  }
199
257
 
200
258
  // src/ui/avatar/avatar.tsx
201
- import { useState as useState4 } from "react";
259
+ import { createContext, useContext, useEffect as useEffect3, useState as useState4 } from "react";
202
260
  import { jsx as jsx4 } from "react/jsx-runtime";
203
261
  var sizes = { xs: "size-5 text-[10px]", sm: "size-6 text-xs", default: "size-8 text-sm", lg: "size-10 text-base" };
204
- function Avatar({ className, size = "default", ...props }) {
205
- return /* @__PURE__ */ jsx4("div", { "data-slot": "avatar", "data-size": size, className: cn("group/avatar relative flex shrink-0 overflow-hidden rounded-full bg-muted text-muted-foreground", sizes[size], className), ...props });
262
+ var AvatarContext = createContext(null);
263
+ function Avatar({ className, size = "default", children, ...props }) {
264
+ const [status, setStatus] = useState4("idle");
265
+ return /* @__PURE__ */ jsx4(AvatarContext.Provider, { value: { status, setStatus }, children: /* @__PURE__ */ jsx4("div", { "data-slot": "avatar", "data-size": size, className: cn("group/avatar relative flex shrink-0 overflow-hidden rounded-full bg-muted text-muted-foreground", sizes[size], className), ...props, children }) });
206
266
  }
207
- function AvatarImage({ className, ...props }) {
267
+ function AvatarImage({ className, src, onError, onLoad, ...props }) {
268
+ const avatar = useContext(AvatarContext);
208
269
  const [failed, setFailed] = useState4(false);
209
- if (failed) return null;
210
- return /* @__PURE__ */ jsx4("img", { "data-slot": "avatar-image", className: cn("aspect-square size-full object-cover", className), onError: () => setFailed(true), ...props });
270
+ useEffect3(() => {
271
+ setFailed(false);
272
+ avatar?.setStatus(src ? "loading" : "idle");
273
+ }, [avatar?.setStatus, src]);
274
+ if (failed || avatar?.status === "error") return null;
275
+ return /* @__PURE__ */ jsx4("img", { "data-slot": "avatar-image", src, className: cn("aspect-square size-full object-cover", className), onLoad: (event) => {
276
+ avatar?.setStatus("loaded");
277
+ onLoad?.(event);
278
+ }, onError: (event) => {
279
+ setFailed(true);
280
+ avatar?.setStatus("error");
281
+ onError?.(event);
282
+ }, ...props });
211
283
  }
212
284
  function AvatarFallback({ className, ...props }) {
285
+ const avatar = useContext(AvatarContext);
286
+ if (avatar?.status === "loaded") return null;
213
287
  return /* @__PURE__ */ jsx4("span", { "data-slot": "avatar-fallback", className: cn("flex size-full items-center justify-center font-medium", className), ...props });
214
288
  }
215
289
  function AvatarBadge({ className, ...props }) {
@@ -262,10 +336,19 @@ function BreadcrumbSeparator({ children = "/", className, ...props }) {
262
336
  return /* @__PURE__ */ jsx6("span", { "data-slot": "breadcrumb-separator", "aria-hidden": "true", className: cn("text-muted-foreground/60", className), ...props, children });
263
337
  }
264
338
 
339
+ // src/ui/button-group/button-group.tsx
340
+ import { jsx as jsx7 } from "react/jsx-runtime";
341
+ function ButtonGroup({ className, ...props }) {
342
+ return /* @__PURE__ */ jsx7("div", { role: "group", "data-slot": "button-group", className: cn("inline-flex items-center gap-2", className), ...props });
343
+ }
344
+ function ButtonGroupText({ className, ...props }) {
345
+ return /* @__PURE__ */ jsx7("span", { "data-slot": "button-group-text", className: cn("text-sm text-muted-foreground", className), ...props });
346
+ }
347
+
265
348
  // src/ui/button/button.tsx
266
349
  import { cva as cva2 } from "class-variance-authority";
267
350
  import { Button as AriaButton } from "react-aria-components";
268
- import { jsx as jsx7 } from "react/jsx-runtime";
351
+ import { jsx as jsx8 } from "react/jsx-runtime";
269
352
  var buttonVariants = cva2(
270
353
  "inline-flex shrink-0 cursor-pointer items-center justify-center gap-1.5 rounded-lg border border-transparent text-sm font-medium whitespace-nowrap transition-[background-color,border-color,color,box-shadow,transform] duration-150 outline-none focus-visible:ring-3 focus-visible:ring-ring/50 data-pressed:scale-[0.98] disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none motion-reduce:data-pressed:transform-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
271
354
  {
@@ -290,16 +373,7 @@ var buttonVariants = cva2(
290
373
  }
291
374
  );
292
375
  function Button2({ className, variant, size, ...props }) {
293
- return /* @__PURE__ */ jsx7(AriaButton, { "data-slot": "button", className: cn(buttonVariants({ variant, size }), className), ...props });
294
- }
295
-
296
- // src/ui/button-group/button-group.tsx
297
- import { jsx as jsx8 } from "react/jsx-runtime";
298
- function ButtonGroup({ className, ...props }) {
299
- return /* @__PURE__ */ jsx8("div", { role: "group", "data-slot": "button-group", className: cn("inline-flex items-center gap-2", className), ...props });
300
- }
301
- function ButtonGroupText({ className, ...props }) {
302
- return /* @__PURE__ */ jsx8("span", { "data-slot": "button-group-text", className: cn("text-sm text-muted-foreground", className), ...props });
376
+ return /* @__PURE__ */ jsx8(AriaButton, { "data-slot": "button", className: cn(buttonVariants({ variant, size }), className), ...props });
303
377
  }
304
378
 
305
379
  // src/ui/card/card.tsx
@@ -414,8 +488,7 @@ function CommandItem({ className, ...props }) {
414
488
  return /* @__PURE__ */ jsx12(ListBoxItem2, { "data-slot": "command-item", className: cn("flex cursor-default items-center rounded-md px-2 py-1.5 text-sm outline-none data-focused:bg-muted data-disabled:pointer-events-none data-disabled:opacity-50", className), ...props });
415
489
  }
416
490
 
417
- // src/ui/dialog/dialog.tsx
418
- import { createContext, useContext } from "react";
491
+ // src/ui/modal-dialog/modal-dialog.tsx
419
492
  import { X } from "lucide-react";
420
493
  import {
421
494
  Dialog as AriaDialog,
@@ -424,50 +497,114 @@ import {
424
497
  ModalOverlay,
425
498
  Text as Text2
426
499
  } from "react-aria-components";
427
- import { jsx as jsx13, jsxs as jsxs4 } from "react/jsx-runtime";
428
- var DialogCloseContext = createContext(null);
429
- function Dialog({ open, children, ...props }) {
430
- return /* @__PURE__ */ jsx13(ModalOverlay, { isOpen: open, className: "fixed inset-0 z-50 grid place-items-center bg-black/20 p-4 backdrop-blur-[1px] motion-safe:data-entering:animate-ui-overlay-in motion-safe:data-exiting:animate-ui-overlay-out", ...props, children });
431
- }
432
- function DialogClose({ onPress, ...props }) {
433
- const close = useContext(DialogCloseContext);
434
- return /* @__PURE__ */ jsx13(Button2, { onPress: (event) => {
435
- onPress?.(event);
436
- close?.();
437
- }, ...props });
438
- }
439
- function DialogContent({ className, children, showCloseButton = true, ...props }) {
440
- return /* @__PURE__ */ jsx13(Modal, { className: "w-full max-w-md outline-none motion-safe:data-entering:animate-ui-surface-in motion-safe:data-exiting:animate-ui-surface-out", children: /* @__PURE__ */ jsx13(AriaDialog, { "data-slot": "dialog-content", className: cn("relative grid max-h-[calc(100dvh-2rem)] gap-4 overflow-y-auto rounded-xl bg-background p-5 text-foreground shadow-xl outline-none", className), ...props, children: ({ close }) => /* @__PURE__ */ jsxs4(DialogCloseContext.Provider, { value: close, children: [
441
- typeof children === "function" ? children({ close }) : children,
442
- showCloseButton && /* @__PURE__ */ jsx13(DialogClose, { "aria-label": "Cerrar di\xE1logo", variant: "ghost", size: "icon", className: "absolute top-2 right-2", children: /* @__PURE__ */ jsx13(X, { "aria-hidden": "true", className: "size-4" }) })
443
- ] }) }) });
444
- }
445
- function DialogHeader({ className, ...props }) {
446
- return /* @__PURE__ */ jsx13("div", { "data-slot": "dialog-header", className: cn("flex flex-col gap-2", className), ...props });
447
- }
448
- function DialogFooter({ className, ...props }) {
449
- return /* @__PURE__ */ jsx13("div", { "data-slot": "dialog-footer", className: cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className), ...props });
450
- }
451
- function DialogTitle({ className, ...props }) {
452
- return /* @__PURE__ */ jsx13(Heading, { slot: "title", className: cn("text-base font-semibold", className), ...props });
453
- }
454
- function DialogDescription({ className, ...props }) {
455
- return /* @__PURE__ */ jsx13(Text2, { slot: "description", className: cn("text-sm text-muted-foreground", className), ...props });
500
+ import { Fragment as Fragment4, jsx as jsx13, jsxs as jsxs4 } from "react/jsx-runtime";
501
+ var sizeClasses = {
502
+ sm: "w-[min(calc(100dvw-2rem),24rem)]",
503
+ md: "w-[min(calc(100dvw-2rem),28rem)]",
504
+ lg: "w-[min(calc(100dvw-2rem),36rem)]"
505
+ };
506
+ function ModalDialog({
507
+ open,
508
+ onOpenChange,
509
+ title,
510
+ description,
511
+ children,
512
+ footer,
513
+ size = "sm",
514
+ showCloseButton = true,
515
+ className,
516
+ footerClassName,
517
+ ...props
518
+ }) {
519
+ const layoutClass = children ? footer ? "grid-rows-[auto_minmax(0,1fr)_auto]" : "grid-rows-[auto_minmax(0,1fr)]" : "grid-rows-[auto_auto]";
520
+ return /* @__PURE__ */ jsx13(
521
+ ModalOverlay,
522
+ {
523
+ isOpen: open,
524
+ onOpenChange,
525
+ className: "fixed inset-0 z-50 grid place-items-center bg-black/20 p-4 backdrop-blur-[1px] motion-safe:data-entering:animate-ui-overlay-in motion-safe:data-exiting:animate-ui-overlay-out",
526
+ ...props,
527
+ children: /* @__PURE__ */ jsx13(
528
+ Modal,
529
+ {
530
+ className: cn(
531
+ "max-h-[calc(100dvh-2rem)] outline-none motion-safe:data-entering:animate-ui-surface-in motion-safe:data-exiting:animate-ui-surface-out",
532
+ sizeClasses[size],
533
+ className
534
+ ),
535
+ children: /* @__PURE__ */ jsx13(
536
+ AriaDialog,
537
+ {
538
+ className: cn(
539
+ "grid max-h-[calc(100dvh-2rem)] overflow-hidden rounded-xl bg-background text-foreground shadow-xl outline-none",
540
+ layoutClass
541
+ ),
542
+ children: ({ close }) => /* @__PURE__ */ jsxs4(Fragment4, { children: [
543
+ /* @__PURE__ */ jsxs4("header", { "data-slot": "modal-dialog-header", className: "flex items-start gap-3 border-b border-border px-5 py-4", children: [
544
+ /* @__PURE__ */ jsxs4("div", { className: "min-w-0 flex-1", children: [
545
+ /* @__PURE__ */ jsx13(Heading, { slot: "title", className: "font-heading text-base leading-none font-medium", children: title }),
546
+ description ? /* @__PURE__ */ jsx13(Text2, { slot: "description", className: "mt-2 text-sm text-muted-foreground", children: description }) : null
547
+ ] }),
548
+ showCloseButton ? /* @__PURE__ */ jsx13(
549
+ Button2,
550
+ {
551
+ "aria-label": "Cerrar di\xE1logo",
552
+ variant: "ghost",
553
+ size: "icon",
554
+ className: "-mr-2 -mt-1",
555
+ onPress: close,
556
+ children: /* @__PURE__ */ jsx13(X, { "aria-hidden": "true", className: "size-4" })
557
+ }
558
+ ) : null
559
+ ] }),
560
+ children ? /* @__PURE__ */ jsx13("div", { "data-slot": "modal-dialog-body", className: "min-h-0 overflow-y-auto px-5 py-4", children }) : null,
561
+ footer ? /* @__PURE__ */ jsx13(
562
+ "footer",
563
+ {
564
+ "data-slot": "modal-dialog-footer",
565
+ className: cn(
566
+ "flex flex-col-reverse gap-2 border-t border-border bg-muted/50 px-5 py-4 sm:flex-row sm:flex-wrap sm:justify-end",
567
+ footerClassName
568
+ ),
569
+ children: footer
570
+ }
571
+ ) : null
572
+ ] })
573
+ }
574
+ )
575
+ }
576
+ )
577
+ }
578
+ );
456
579
  }
457
580
 
458
581
  // src/ui/confirm-dialog/confirm-dialog.tsx
459
- import { jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
460
- function ConfirmDialog({ open, onOpenChange, title, description, confirmLabel = "Confirmar", cancelLabel = "Cancelar", destructive = false, pending = false, onConfirm }) {
461
- return /* @__PURE__ */ jsx14(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs5(DialogContent, { showCloseButton: false, children: [
462
- /* @__PURE__ */ jsxs5(DialogHeader, { children: [
463
- /* @__PURE__ */ jsx14(DialogTitle, { children: title }),
464
- description && /* @__PURE__ */ jsx14(DialogDescription, { children: description })
465
- ] }),
466
- /* @__PURE__ */ jsxs5(DialogFooter, { children: [
467
- /* @__PURE__ */ jsx14(Button2, { variant: "outline", isDisabled: pending, onPress: () => onOpenChange(false), children: cancelLabel }),
468
- /* @__PURE__ */ jsx14(Button2, { variant: destructive ? "destructive" : "default", isDisabled: pending, onPress: onConfirm, children: confirmLabel })
469
- ] })
470
- ] }) });
582
+ import { Fragment as Fragment5, jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
583
+ function ConfirmDialog({
584
+ open,
585
+ onOpenChange,
586
+ title,
587
+ description,
588
+ confirmLabel = "Confirmar",
589
+ cancelLabel = "Cancelar",
590
+ destructive = false,
591
+ pending = false,
592
+ onConfirm
593
+ }) {
594
+ return /* @__PURE__ */ jsx14(
595
+ ModalDialog,
596
+ {
597
+ open,
598
+ onOpenChange,
599
+ title,
600
+ description,
601
+ showCloseButton: false,
602
+ footer: /* @__PURE__ */ jsxs5(Fragment5, { children: [
603
+ /* @__PURE__ */ jsx14(Button2, { variant: "outline", isDisabled: pending, onPress: () => onOpenChange(false), children: cancelLabel }),
604
+ /* @__PURE__ */ jsx14(Button2, { variant: destructive ? "destructive" : "default", isDisabled: pending, onPress: onConfirm, children: confirmLabel })
605
+ ] })
606
+ }
607
+ );
471
608
  }
472
609
 
473
610
  // src/ui/drawer/drawer.tsx
@@ -542,7 +679,7 @@ function FieldError2({ className, children, ...props }) {
542
679
  }
543
680
 
544
681
  // src/ui/form-feedback/form-feedback.tsx
545
- import { useCallback as useCallback3, useEffect as useEffect3, useRef as useRef3, useState as useState6 } from "react";
682
+ import { useCallback as useCallback3, useEffect as useEffect4, useRef as useRef3, useState as useState6 } from "react";
546
683
  import { CheckCircle, LoaderCircle, CircleAlert } from "lucide-react";
547
684
  import { jsx as jsx20, jsxs as jsxs6 } from "react/jsx-runtime";
548
685
  function useFormFeedback(options) {
@@ -553,7 +690,7 @@ function useFormFeedback(options) {
553
690
  if (timer.current) clearTimeout(timer.current);
554
691
  timer.current = null;
555
692
  }, []);
556
- useEffect3(() => () => clearTimer(), [clearTimer]);
693
+ useEffect4(() => () => clearTimer(), [clearTimer]);
557
694
  const setPending = useCallback3(() => {
558
695
  clearTimer();
559
696
  setState({ status: "pending" });
@@ -586,14 +723,14 @@ function FormFeedback({ state, className, pendingLabel = "Guardando\u2026", succ
586
723
  }
587
724
 
588
725
  // src/ui/form-row/form-row.tsx
589
- import { Fragment as Fragment4, jsx as jsx21, jsxs as jsxs7 } from "react/jsx-runtime";
726
+ import { Fragment as Fragment6, jsx as jsx21, jsxs as jsxs7 } from "react/jsx-runtime";
590
727
  function FormRow({ label, htmlFor, required, hint, error, className, children }) {
591
728
  const hintId = hint ? `${htmlFor}-hint` : void 0;
592
729
  const errorId = error ? `${htmlFor}-error` : void 0;
593
730
  return /* @__PURE__ */ jsxs7("div", { "data-slot": "form-row", className: cn("flex flex-col gap-1.5", className), children: [
594
731
  /* @__PURE__ */ jsxs7("label", { htmlFor, className: "text-sm font-medium text-foreground", children: [
595
732
  label,
596
- required && /* @__PURE__ */ jsxs7(Fragment4, { children: [
733
+ required && /* @__PURE__ */ jsxs7(Fragment6, { children: [
597
734
  /* @__PURE__ */ jsx21("span", { "aria-hidden": "true", className: "ml-0.5 text-destructive", children: "*" }),
598
735
  /* @__PURE__ */ jsx21("span", { className: "sr-only", children: " (obligatorio)" })
599
736
  ] })
@@ -659,6 +796,9 @@ function IconButton({
659
796
  ] });
660
797
  }
661
798
 
799
+ // src/ui/input-group/input-group.tsx
800
+ import { cva as cva3 } from "class-variance-authority";
801
+
662
802
  // src/ui/input/input.tsx
663
803
  import { forwardRef as forwardRef2 } from "react";
664
804
  import { Input as AriaInput2 } from "react-aria-components";
@@ -668,9 +808,6 @@ var InputImpl = forwardRef2(function Input2({ className, type, ...props }, ref)
668
808
  });
669
809
  var Input3 = InputImpl;
670
810
 
671
- // src/ui/input-group/input-group.tsx
672
- import { cva as cva3 } from "class-variance-authority";
673
-
674
811
  // src/ui/textarea/textarea.tsx
675
812
  import { forwardRef as forwardRef3 } from "react";
676
813
  import { TextArea as AriaTextArea } from "react-aria-components";
@@ -858,10 +995,10 @@ import {
858
995
  Popover as Popover5
859
996
  } from "react-aria-components";
860
997
  import { ChevronDown as ChevronDown2 } from "lucide-react";
861
- import { Fragment as Fragment5, jsx as jsx35, jsxs as jsxs12 } from "react/jsx-runtime";
998
+ import { Fragment as Fragment7, jsx as jsx35, jsxs as jsxs12 } from "react/jsx-runtime";
862
999
  var Select = AriaSelect;
863
1000
  function SelectTrigger({ className, children, ...props }) {
864
- return /* @__PURE__ */ jsx35(AriaButton3, { "data-slot": "select-trigger", className: cn("group/select-trigger flex h-8 w-full min-w-36 items-center gap-2 rounded-lg border border-border bg-background px-2.5 text-left text-sm text-foreground outline-none data-focus-visible:ring-3 data-focus-visible:ring-ring/50 data-disabled:cursor-not-allowed data-disabled:opacity-50", className), ...props, children: (state) => /* @__PURE__ */ jsxs12(Fragment5, { children: [
1001
+ return /* @__PURE__ */ jsx35(AriaButton3, { "data-slot": "select-trigger", className: cn("group/select-trigger flex h-8 w-full min-w-36 items-center gap-2 rounded-lg border border-border bg-background px-2.5 text-left text-sm text-foreground outline-none data-focus-visible:ring-3 data-focus-visible:ring-ring/50 data-disabled:cursor-not-allowed data-disabled:opacity-50", className), ...props, children: (state) => /* @__PURE__ */ jsxs12(Fragment7, { children: [
865
1002
  typeof children === "function" ? children(state) : children,
866
1003
  /* @__PURE__ */ jsx35(ChevronDown2, { "aria-hidden": "true", className: "ml-auto size-4 text-muted-foreground transition-transform group-data-pressed/select-trigger:rotate-180 motion-reduce:transition-none" })
867
1004
  ] }) });
@@ -900,7 +1037,7 @@ import {
900
1037
  useState as useState7
901
1038
  } from "react";
902
1039
  import { Link as Link2 } from "react-aria-components";
903
- import { Fragment as Fragment6, jsx as jsx37, jsxs as jsxs13 } from "react/jsx-runtime";
1040
+ import { Fragment as Fragment8, jsx as jsx37, jsxs as jsxs13 } from "react/jsx-runtime";
904
1041
  var SidebarContext = createContext2(null);
905
1042
  function useSidebar() {
906
1043
  const context = useContext2(SidebarContext);
@@ -1060,7 +1197,7 @@ function SidebarItem({
1060
1197
  typeof className === "function" ? className : className
1061
1198
  ),
1062
1199
  ...props,
1063
- children: (values) => /* @__PURE__ */ jsxs13(Fragment6, { children: [
1200
+ children: (values) => /* @__PURE__ */ jsxs13(Fragment8, { children: [
1064
1201
  /* @__PURE__ */ jsx37("span", { className: "flex size-4 shrink-0 items-center justify-center", children: icon }),
1065
1202
  /* @__PURE__ */ jsx37(
1066
1203
  "span",
@@ -1144,11 +1281,11 @@ function Skeleton({ className, ...props }) {
1144
1281
  // src/ui/submit-button/submit-button.tsx
1145
1282
  import { useFormStatus } from "react-dom";
1146
1283
  import { LoaderCircle as LoaderCircle3 } from "lucide-react";
1147
- import { Fragment as Fragment7, jsx as jsx39, jsxs as jsxs14 } from "react/jsx-runtime";
1284
+ import { Fragment as Fragment9, jsx as jsx39, jsxs as jsxs14 } from "react/jsx-runtime";
1148
1285
  function SubmitButton({ pendingLabel = "Guardando\u2026", loading = false, children, isDisabled, size = "sm", ...props }) {
1149
1286
  const { pending } = useFormStatus();
1150
1287
  const busy = pending || loading;
1151
- return /* @__PURE__ */ jsx39(Button2, { type: "submit", size, isDisabled: busy || isDisabled, "aria-busy": busy || void 0, ...props, children: busy ? /* @__PURE__ */ jsxs14(Fragment7, { children: [
1288
+ return /* @__PURE__ */ jsx39(Button2, { type: "submit", size, isDisabled: busy || isDisabled, "aria-busy": busy || void 0, ...props, children: busy ? /* @__PURE__ */ jsxs14(Fragment9, { children: [
1152
1289
  /* @__PURE__ */ jsx39(LoaderCircle3, { "aria-hidden": "true", className: "size-3.5 animate-spin" }),
1153
1290
  pendingLabel
1154
1291
  ] }) : children });
@@ -1159,7 +1296,7 @@ import {
1159
1296
  SwitchButton as AriaSwitchButton,
1160
1297
  SwitchField as AriaSwitchField
1161
1298
  } from "react-aria-components";
1162
- import { Fragment as Fragment8, jsx as jsx40, jsxs as jsxs15 } from "react/jsx-runtime";
1299
+ import { Fragment as Fragment10, jsx as jsx40, jsxs as jsxs15 } from "react/jsx-runtime";
1163
1300
  var sizeStyles = {
1164
1301
  sm: { track: "h-5 w-9 p-0.5", thumb: "size-4", travel: "group-data-selected/switch:translate-x-4" },
1165
1302
  md: { track: "h-6 w-11 p-0.5", thumb: "size-5", travel: "group-data-selected/switch:translate-x-5" }
@@ -1176,7 +1313,7 @@ function Switch({ className, children, size = "sm", ...props }) {
1176
1313
  "data-disabled:cursor-not-allowed data-disabled:opacity-50",
1177
1314
  typeof className === "function" ? className(state) : className
1178
1315
  ),
1179
- children: (state) => /* @__PURE__ */ jsxs15(Fragment8, { children: [
1316
+ children: (state) => /* @__PURE__ */ jsxs15(Fragment10, { children: [
1180
1317
  /* @__PURE__ */ jsx40(
1181
1318
  "span",
1182
1319
  {
@@ -1264,9 +1401,9 @@ function TabsContent({ className, ...props }) {
1264
1401
  }
1265
1402
 
1266
1403
  // src/ui/toast/toast.tsx
1267
- import { useEffect as useEffect4, useSyncExternalStore } from "react";
1404
+ import { useEffect as useEffect5, useSyncExternalStore } from "react";
1268
1405
  import { CheckCircle as CheckCircle2, Info, CircleAlert as CircleAlert2, XCircle, X as X3 } from "lucide-react";
1269
- import { Fragment as Fragment9, jsx as jsx43, jsxs as jsxs16 } from "react/jsx-runtime";
1406
+ import { Fragment as Fragment11, jsx as jsx43, jsxs as jsxs16 } from "react/jsx-runtime";
1270
1407
  var records = [];
1271
1408
  var listeners = /* @__PURE__ */ new Set();
1272
1409
  var snapshot = () => records;
@@ -1311,7 +1448,7 @@ function useToast() {
1311
1448
  return toast;
1312
1449
  }
1313
1450
  function ToastProvider({ children }) {
1314
- return /* @__PURE__ */ jsxs16(Fragment9, { children: [
1451
+ return /* @__PURE__ */ jsxs16(Fragment11, { children: [
1315
1452
  children,
1316
1453
  /* @__PURE__ */ jsx43(Toaster, {})
1317
1454
  ] });
@@ -1325,7 +1462,7 @@ var positionClasses = {
1325
1462
  "bottom-right": "bottom-4 right-4 items-end"
1326
1463
  };
1327
1464
  function Toaster({ position = "bottom-right" }) {
1328
- return /* @__PURE__ */ jsx43(Fragment9, { children: Object.keys(positionClasses).map((item) => /* @__PURE__ */ jsx43(ToastViewport, { position: item, visiblePosition: position }, item)) });
1465
+ return /* @__PURE__ */ jsx43(Fragment11, { children: Object.keys(positionClasses).map((item) => /* @__PURE__ */ jsx43(ToastViewport, { position: item, visiblePosition: position }, item)) });
1329
1466
  }
1330
1467
  function ToastViewport({ position, visiblePosition, className }) {
1331
1468
  const toasts = useSyncExternalStore(subscribe, snapshot, snapshot).filter((item) => item.position === position);
@@ -1333,7 +1470,7 @@ function ToastViewport({ position, visiblePosition, className }) {
1333
1470
  return /* @__PURE__ */ jsx43("div", { "aria-label": `Notificaciones ${position}`, className: cn("pointer-events-none fixed z-50 flex w-[min(24rem,calc(100vw-2rem))] flex-col gap-2", positionClasses[position], className), children: toasts.map((item) => /* @__PURE__ */ jsx43(Toast, { ...item, onDismiss: () => dismiss(item.id) }, item.id)) });
1334
1471
  }
1335
1472
  function Toast({ id, title, description, variant = "default", action, state = "open", duration = 0, onDismiss }) {
1336
- useEffect4(() => {
1473
+ useEffect5(() => {
1337
1474
  if (state !== "open" || duration <= 0) return;
1338
1475
  const timeout = window.setTimeout(() => dismiss(id), duration);
1339
1476
  return () => window.clearTimeout(timeout);
@@ -1374,6 +1511,8 @@ export {
1374
1511
  AppShellContent,
1375
1512
  AppShellHeader,
1376
1513
  AppShellMain,
1514
+ AppShellMobileHeader,
1515
+ AppShellSidebar,
1377
1516
  AutocompleteCombobox,
1378
1517
  Avatar,
1379
1518
  AvatarBadge,
@@ -1409,13 +1548,6 @@ export {
1409
1548
  CommandItem,
1410
1549
  CommandList,
1411
1550
  ConfirmDialog,
1412
- Dialog,
1413
- DialogClose,
1414
- DialogContent,
1415
- DialogDescription,
1416
- DialogFooter,
1417
- DialogHeader,
1418
- DialogTitle,
1419
1551
  Drawer,
1420
1552
  DrawerDescription,
1421
1553
  DrawerFooter,
@@ -1452,6 +1584,7 @@ export {
1452
1584
  MenuContent,
1453
1585
  MenuItem,
1454
1586
  MenuTrigger,
1587
+ ModalDialog,
1455
1588
  PageHeader,
1456
1589
  PageHeaderActions,
1457
1590
  PageHeaderDescription,