@kjaniec-dev/ui 0.9.2 → 0.9.3

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
@@ -94,20 +94,17 @@ var Badge = React52.forwardRef(
94
94
  ] })
95
95
  );
96
96
  Badge.displayName = "Badge";
97
- var alertVariants = cva(
98
- "flex gap-3 items-start p-[0.9rem_1.1rem] rounded-kj-md border text-sm",
99
- {
100
- variants: {
101
- variant: {
102
- info: "bg-info-surface border-info/30",
103
- success: "bg-success-surface border-success/30",
104
- warning: "bg-warning-surface border-warning/30",
105
- danger: "bg-danger-surface border-danger/30"
106
- }
107
- },
108
- defaultVariants: { variant: "info" }
109
- }
110
- );
97
+ var alertVariants = cva("flex gap-3 items-start p-[0.9rem_1.1rem] rounded-kj-md border text-sm", {
98
+ variants: {
99
+ variant: {
100
+ info: "bg-info-surface border-info/30",
101
+ success: "bg-success-surface border-success/30",
102
+ warning: "bg-warning-surface border-warning/30",
103
+ danger: "bg-danger-surface border-danger/30"
104
+ }
105
+ },
106
+ defaultVariants: { variant: "info" }
107
+ });
111
108
  var iconColor = {
112
109
  info: "text-info",
113
110
  success: "text-success",
@@ -116,7 +113,16 @@ var iconColor = {
116
113
  };
117
114
  var Alert = React52.forwardRef(
118
115
  ({ className, variant = "info", icon, title, children, ...props }, ref) => /* @__PURE__ */ jsxs("div", { ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props, children: [
119
- icon && /* @__PURE__ */ jsx("span", { className: cn("shrink-0 mt-0.5 [&_svg]:h-[1.15rem] [&_svg]:w-[1.15rem]", iconColor[variant ?? "info"]), children: icon }),
116
+ icon && /* @__PURE__ */ jsx(
117
+ "span",
118
+ {
119
+ className: cn(
120
+ "shrink-0 mt-0.5 [&_svg]:h-[1.15rem] [&_svg]:w-[1.15rem]",
121
+ iconColor[variant ?? "info"]
122
+ ),
123
+ children: icon
124
+ }
125
+ ),
120
126
  /* @__PURE__ */ jsxs("div", { className: "text-foreground", children: [
121
127
  title && /* @__PURE__ */ jsx("p", { className: "font-bold m-0 mb-0.5 text-sm", children: title }),
122
128
  children && /* @__PURE__ */ jsx("p", { className: "m-0 opacity-85", children })
@@ -172,10 +178,18 @@ var Progress = React52.forwardRef(
172
178
  );
173
179
  Progress.displayName = "Progress";
174
180
  var Label = React52.forwardRef(
175
- ({ className, required, children, ...props }, ref) => /* @__PURE__ */ jsxs("label", { ref, className: cn("text-[0.8rem] font-semibold text-foreground", className), ...props, children: [
176
- children,
177
- required && /* @__PURE__ */ jsx("span", { className: "text-danger", children: " *" })
178
- ] })
181
+ ({ className, required, children, ...props }, ref) => /* @__PURE__ */ jsxs(
182
+ "label",
183
+ {
184
+ ref,
185
+ className: cn("text-[0.8rem] font-semibold text-foreground", className),
186
+ ...props,
187
+ children: [
188
+ children,
189
+ required && /* @__PURE__ */ jsx("span", { className: "text-danger", children: " *" })
190
+ ]
191
+ }
192
+ )
179
193
  );
180
194
  Label.displayName = "Label";
181
195
  var Hint = React52.forwardRef(
@@ -201,11 +215,7 @@ var FormField = React52.forwardRef(
201
215
  const child = React52.Children.only(children);
202
216
  const clonedChild = React52.cloneElement(child, {
203
217
  id: child.props.id ?? id,
204
- "aria-describedby": cn(
205
- hint && hintId,
206
- error && errorId,
207
- child.props["aria-describedby"]
208
- ) || void 0,
218
+ "aria-describedby": cn(hint && hintId, error && errorId, child.props["aria-describedby"]) || void 0,
209
219
  "aria-invalid": error ? "true" : void 0,
210
220
  required: child.props.required ?? required
211
221
  });
@@ -341,11 +351,21 @@ var ProgressRing = React52.forwardRef(
341
351
  ProgressRing.displayName = "ProgressRing";
342
352
  var ProgressRingField = React52.forwardRef(
343
353
  ({ label, hint, error, required, fieldClassName, ...ringProps }, ref) => {
344
- return /* @__PURE__ */ jsx(FormField, { label, hint, error, required, className: fieldClassName, children: /* @__PURE__ */ jsx(ProgressRing, { ref, "aria-label": ringProps["aria-label"] ?? label, ...ringProps }) });
354
+ return /* @__PURE__ */ jsx(
355
+ FormField,
356
+ {
357
+ label,
358
+ hint,
359
+ error,
360
+ required,
361
+ className: fieldClassName,
362
+ children: /* @__PURE__ */ jsx(ProgressRing, { ref, "aria-label": ringProps["aria-label"] ?? label, ...ringProps })
363
+ }
364
+ );
345
365
  }
346
366
  );
347
367
  ProgressRingField.displayName = "ProgressRingField";
348
- var baseField = "w-full font-sans text-sm text-foreground bg-surface border rounded-kj-md px-[0.85rem] transition-[border-color,box-shadow] duration-150 placeholder:text-muted-foreground focus:outline-none focus:border-ring focus:ring-[3px] focus:ring-ring/30 disabled:bg-muted disabled:text-muted-foreground disabled:cursor-not-allowed";
368
+ var baseField = "w-full font-sans text-sm text-foreground bg-surface border rounded-kj-md px-[0.85rem] transition-[border-color,box-shadow] duration-150 placeholder:text-muted-foreground hover:border-control-border-hover focus:outline-none focus:border-ring focus:ring-[3px] focus:ring-ring/30 disabled:bg-muted disabled:text-muted-foreground disabled:cursor-not-allowed";
349
369
  var Input = React52.forwardRef(
350
370
  ({ className, error, leadingIcon, ...props }, ref) => {
351
371
  const field = /* @__PURE__ */ jsx(
@@ -433,11 +453,33 @@ var Checkbox = React52.forwardRef(
433
453
  ({ className, label, id, ...props }, ref) => {
434
454
  const autoId = React52.useId();
435
455
  const inputId = id ?? autoId;
436
- return /* @__PURE__ */ jsxs("label", { htmlFor: inputId, className: cn("inline-flex items-center gap-2.5 cursor-pointer text-sm select-none", className), children: [
437
- /* @__PURE__ */ jsx("input", { ref, id: inputId, type: "checkbox", className: "peer sr-only", ...props }),
438
- /* @__PURE__ */ jsx("span", { className: "grid place-items-center h-[1.15rem] w-[1.15rem] shrink-0 rounded-[0.4rem] border-[1.5px] border-input bg-surface transition-all duration-150 peer-checked:bg-primary peer-checked:border-primary peer-focus-visible:ring-[3px] peer-focus-visible:ring-ring/35 peer-checked:[&_svg]:opacity-100 peer-checked:[&_svg]:scale-100", children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 3, strokeLinecap: "round", strokeLinejoin: "round", className: "h-3 w-3 text-primary-foreground opacity-0 scale-50 transition-all duration-150", children: /* @__PURE__ */ jsx("path", { d: "M20 6 9 17l-5-5" }) }) }),
439
- label
440
- ] });
456
+ return /* @__PURE__ */ jsxs(
457
+ "label",
458
+ {
459
+ htmlFor: inputId,
460
+ className: cn(
461
+ "inline-flex items-center gap-2.5 cursor-pointer text-sm select-none",
462
+ className
463
+ ),
464
+ children: [
465
+ /* @__PURE__ */ jsx("input", { ref, id: inputId, type: "checkbox", className: "peer sr-only", ...props }),
466
+ /* @__PURE__ */ jsx("span", { className: "grid place-items-center h-[1.15rem] w-[1.15rem] shrink-0 rounded-[0.4rem] border-[1.5px] border-input bg-surface transition-all duration-150 peer-checked:bg-primary peer-checked:border-primary peer-focus-visible:ring-[3px] peer-focus-visible:ring-ring/35 peer-checked:[&_svg]:opacity-100 peer-checked:[&_svg]:scale-100", children: /* @__PURE__ */ jsx(
467
+ "svg",
468
+ {
469
+ viewBox: "0 0 24 24",
470
+ fill: "none",
471
+ stroke: "currentColor",
472
+ strokeWidth: 3,
473
+ strokeLinecap: "round",
474
+ strokeLinejoin: "round",
475
+ className: "h-3 w-3 text-primary-foreground opacity-0 scale-50 transition-all duration-150",
476
+ children: /* @__PURE__ */ jsx("path", { d: "M20 6 9 17l-5-5" })
477
+ }
478
+ ) }),
479
+ label
480
+ ]
481
+ }
482
+ );
441
483
  }
442
484
  );
443
485
  Checkbox.displayName = "Checkbox";
@@ -445,11 +487,21 @@ var Radio = React52.forwardRef(
445
487
  ({ className, label, id, ...props }, ref) => {
446
488
  const autoId = React52.useId();
447
489
  const inputId = id ?? autoId;
448
- return /* @__PURE__ */ jsxs("label", { htmlFor: inputId, className: cn("inline-flex items-center gap-2.5 cursor-pointer text-sm select-none", className), children: [
449
- /* @__PURE__ */ jsx("input", { ref, id: inputId, type: "radio", className: "peer sr-only", ...props }),
450
- /* @__PURE__ */ jsx("span", { className: "grid place-items-center h-[1.15rem] w-[1.15rem] shrink-0 rounded-full border-[1.5px] border-input bg-surface transition-all duration-150 peer-checked:bg-primary peer-checked:border-primary peer-focus-visible:ring-[3px] peer-focus-visible:ring-ring/35 peer-checked:[&>span]:opacity-100 peer-checked:[&>span]:scale-100", children: /* @__PURE__ */ jsx("span", { className: "h-2 w-2 rounded-full bg-primary-foreground opacity-0 scale-[0.4] transition-all duration-150" }) }),
451
- label
452
- ] });
490
+ return /* @__PURE__ */ jsxs(
491
+ "label",
492
+ {
493
+ htmlFor: inputId,
494
+ className: cn(
495
+ "inline-flex items-center gap-2.5 cursor-pointer text-sm select-none",
496
+ className
497
+ ),
498
+ children: [
499
+ /* @__PURE__ */ jsx("input", { ref, id: inputId, type: "radio", className: "peer sr-only", ...props }),
500
+ /* @__PURE__ */ jsx("span", { className: "grid place-items-center h-[1.15rem] w-[1.15rem] shrink-0 rounded-full border-[1.5px] border-input bg-surface transition-all duration-150 peer-checked:bg-primary peer-checked:border-primary peer-focus-visible:ring-[3px] peer-focus-visible:ring-ring/35 peer-checked:[&>span]:opacity-100 peer-checked:[&>span]:scale-100", children: /* @__PURE__ */ jsx("span", { className: "h-2 w-2 rounded-full bg-primary-foreground opacity-0 scale-[0.4] transition-all duration-150" }) }),
501
+ label
502
+ ]
503
+ }
504
+ );
453
505
  }
454
506
  );
455
507
  Radio.displayName = "Radio";
@@ -480,19 +532,37 @@ var Switch = React52.forwardRef(
480
532
  ({ className, label, id, ...props }, ref) => {
481
533
  const autoId = React52.useId();
482
534
  const inputId = id ?? autoId;
483
- return /* @__PURE__ */ jsxs("label", { htmlFor: inputId, className: cn("inline-flex items-center gap-2.5 cursor-pointer text-sm select-none", className), children: [
484
- /* @__PURE__ */ jsx("input", { ref, id: inputId, type: "checkbox", role: "switch", className: "peer sr-only", ...props }),
485
- /* @__PURE__ */ jsx("span", { className: "relative h-[1.45rem] w-[2.6rem] shrink-0 rounded-full bg-input transition-colors duration-200 peer-checked:bg-primary peer-focus-visible:ring-[3px] peer-focus-visible:ring-ring/35 after:content-[''] after:absolute after:top-0.5 after:left-0.5 after:h-[calc(1.45rem-4px)] after:w-[calc(1.45rem-4px)] after:rounded-full after:bg-white after:shadow-kj-sm after:transition-transform after:duration-200 peer-checked:after:translate-x-[1.15rem]" }),
486
- label
487
- ] });
535
+ return /* @__PURE__ */ jsxs(
536
+ "label",
537
+ {
538
+ htmlFor: inputId,
539
+ className: cn(
540
+ "inline-flex items-center gap-2.5 cursor-pointer text-sm select-none",
541
+ className
542
+ ),
543
+ children: [
544
+ /* @__PURE__ */ jsx(
545
+ "input",
546
+ {
547
+ ref,
548
+ id: inputId,
549
+ type: "checkbox",
550
+ role: "switch",
551
+ className: "peer sr-only",
552
+ ...props
553
+ }
554
+ ),
555
+ /* @__PURE__ */ jsx("span", { className: "relative h-[1.45rem] w-[2.6rem] shrink-0 rounded-full bg-input transition-colors duration-200 peer-checked:bg-primary peer-focus-visible:ring-[3px] peer-focus-visible:ring-ring/35 after:content-[''] after:absolute after:top-0.5 after:left-0.5 after:h-[calc(1.45rem-4px)] after:w-[calc(1.45rem-4px)] after:rounded-full after:bg-white after:shadow-kj-sm after:transition-transform after:duration-200 peer-checked:after:translate-x-[1.15rem]" }),
556
+ label
557
+ ]
558
+ }
559
+ );
488
560
  }
489
561
  );
490
562
  Switch.displayName = "Switch";
491
563
  var Slider = React52.forwardRef(
492
564
  ({ className, style, value, defaultValue, min = 0, max = 100, onChange, ...props }, ref) => {
493
- const [localValue, setLocalValue] = React52.useState(
494
- Number(defaultValue ?? value ?? 50)
495
- );
565
+ const [localValue, setLocalValue] = React52.useState(Number(defaultValue ?? value ?? 50));
496
566
  const isControlled = value !== void 0;
497
567
  const currentVal = isControlled ? Number(value) : localValue;
498
568
  const numMin = Number(min);
@@ -629,13 +699,9 @@ var CardHeader = React52.forwardRef(
629
699
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-[1.35rem] flex flex-col gap-1", className), ...props })
630
700
  );
631
701
  CardHeader.displayName = "CardHeader";
632
- var CardTitle = React52.forwardRef(
633
- ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("h3", { ref, className: cn("m-0 text-base font-bold tracking-[-0.01em]", className), ...props, children })
634
- );
702
+ var CardTitle = React52.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("h3", { ref, className: cn("m-0 text-base font-bold tracking-[-0.01em]", className), ...props, children }));
635
703
  CardTitle.displayName = "CardTitle";
636
- var CardDescription = React52.forwardRef(
637
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: cn("m-0 text-[0.85rem] text-muted-foreground", className), ...props })
638
- );
704
+ var CardDescription = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: cn("m-0 text-[0.85rem] text-muted-foreground", className), ...props }));
639
705
  CardDescription.displayName = "CardDescription";
640
706
  var CardContent = React52.forwardRef(
641
707
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("px-[1.35rem] pb-[1.35rem]", className), ...props })
@@ -646,7 +712,10 @@ var CardFooter = React52.forwardRef(
646
712
  "div",
647
713
  {
648
714
  ref,
649
- className: cn("flex gap-2.5 px-[1.35rem] py-[1.1rem] border-t border-border bg-muted/40", className),
715
+ className: cn(
716
+ "flex gap-2.5 px-[1.35rem] py-[1.1rem] border-t border-border bg-muted/40",
717
+ className
718
+ ),
650
719
  ...props
651
720
  }
652
721
  )
@@ -694,7 +763,15 @@ var avatarVariants = cva(
694
763
  );
695
764
  var Avatar = React52.forwardRef(
696
765
  ({ className, size, tone, src, alt, status, children, ...props }, ref) => {
697
- const node = /* @__PURE__ */ jsx("span", { ref, className: cn(avatarVariants({ size, tone }), "overflow-hidden", className), ...props, children: src ? /* @__PURE__ */ jsx("img", { src, alt, className: "h-full w-full object-cover" }) : children });
766
+ const node = /* @__PURE__ */ jsx(
767
+ "span",
768
+ {
769
+ ref,
770
+ className: cn(avatarVariants({ size, tone }), "overflow-hidden", className),
771
+ ...props,
772
+ children: src ? /* @__PURE__ */ jsx("img", { src, alt, className: "h-full w-full object-cover" }) : children
773
+ }
774
+ );
698
775
  if (!status) return node;
699
776
  return /* @__PURE__ */ jsxs("span", { className: "relative inline-flex", children: [
700
777
  node,
@@ -713,7 +790,14 @@ function useTabs() {
713
790
  if (!ctx) throw new Error("Tabs.* must be used within <Tabs>");
714
791
  return ctx;
715
792
  }
716
- function Tabs({ value, defaultValue, onValueChange, className, children, ...props }) {
793
+ function Tabs({
794
+ value,
795
+ defaultValue,
796
+ onValueChange,
797
+ className,
798
+ children,
799
+ ...props
800
+ }) {
717
801
  const [internal, setInternal] = React52.useState(defaultValue ?? "");
718
802
  const uid = React52.useId();
719
803
  const current = value ?? internal;
@@ -823,7 +907,13 @@ var TabsContent = React52.forwardRef(
823
907
  );
824
908
  TabsContent.displayName = "TabsContent";
825
909
  var AccordionContext = React52.createContext(null);
826
- function Accordion({ type = "single", defaultValue = [], className, children, ...props }) {
910
+ function Accordion({
911
+ type = "single",
912
+ defaultValue = [],
913
+ className,
914
+ children,
915
+ ...props
916
+ }) {
827
917
  const [open, setOpen] = React52.useState(defaultValue);
828
918
  const toggle = React52.useCallback(
829
919
  (v) => {
@@ -835,72 +925,97 @@ function Accordion({ type = "single", defaultValue = [], className, children, ..
835
925
  },
836
926
  [type]
837
927
  );
838
- return /* @__PURE__ */ jsx(AccordionContext.Provider, { value: { open, toggle }, children: /* @__PURE__ */ jsx("div", { className: cn("border border-border rounded-kj-lg overflow-hidden", className), ...props, children }) });
928
+ return /* @__PURE__ */ jsx(AccordionContext.Provider, { value: { open, toggle }, children: /* @__PURE__ */ jsx(
929
+ "div",
930
+ {
931
+ className: cn("border border-border rounded-kj-lg overflow-hidden", className),
932
+ ...props,
933
+ children
934
+ }
935
+ ) });
839
936
  }
840
937
  var ItemContext = React52.createContext("");
841
938
  var AccordionItem = React52.forwardRef(
842
- ({ className, value, ...props }, ref) => /* @__PURE__ */ jsx(ItemContext.Provider, { value, children: /* @__PURE__ */ jsx("div", { ref, className: cn("border-t border-border first:border-t-0", className), ...props }) })
939
+ ({ className, value, ...props }, ref) => /* @__PURE__ */ jsx(ItemContext.Provider, { value, children: /* @__PURE__ */ jsx(
940
+ "div",
941
+ {
942
+ ref,
943
+ className: cn("border-t border-border first:border-t-0", className),
944
+ ...props
945
+ }
946
+ ) })
843
947
  );
844
948
  AccordionItem.displayName = "AccordionItem";
845
- var AccordionTrigger = React52.forwardRef(
846
- ({ className, children, ...props }, ref) => {
847
- const ctx = React52.useContext(AccordionContext);
848
- const value = React52.useContext(ItemContext);
849
- const isOpen = ctx.open.includes(value);
850
- return /* @__PURE__ */ jsxs(
851
- "button",
852
- {
853
- ref,
854
- type: "button",
855
- "aria-expanded": isOpen,
856
- onClick: () => ctx.toggle(value),
857
- className: cn(
858
- "w-full flex justify-between items-center gap-4 text-left px-[1.2rem] py-4 bg-card text-foreground text-[0.9rem] font-semibold cursor-pointer hover:bg-muted transition-colors",
859
- className
860
- ),
861
- ...props,
862
- children: [
863
- children,
864
- /* @__PURE__ */ jsx(
865
- "svg",
866
- {
867
- className: cn("shrink-0 text-muted-foreground transition-transform duration-200", isOpen && "rotate-180"),
868
- width: 18,
869
- height: 18,
870
- viewBox: "0 0 24 24",
871
- fill: "none",
872
- stroke: "currentColor",
873
- strokeWidth: 2,
874
- strokeLinecap: "round",
875
- strokeLinejoin: "round",
876
- children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
877
- }
878
- )
879
- ]
880
- }
881
- );
882
- }
883
- );
949
+ var AccordionTrigger = React52.forwardRef(({ className, children, ...props }, ref) => {
950
+ const ctx = React52.useContext(AccordionContext);
951
+ const value = React52.useContext(ItemContext);
952
+ const isOpen = ctx.open.includes(value);
953
+ return /* @__PURE__ */ jsxs(
954
+ "button",
955
+ {
956
+ ref,
957
+ type: "button",
958
+ "aria-expanded": isOpen,
959
+ onClick: () => ctx.toggle(value),
960
+ className: cn(
961
+ "w-full flex justify-between items-center gap-4 text-left px-[1.2rem] py-4 bg-card text-foreground text-[0.9rem] font-semibold cursor-pointer hover:bg-muted transition-colors",
962
+ className
963
+ ),
964
+ ...props,
965
+ children: [
966
+ children,
967
+ /* @__PURE__ */ jsx(
968
+ "svg",
969
+ {
970
+ className: cn(
971
+ "shrink-0 text-muted-foreground transition-transform duration-200",
972
+ isOpen && "rotate-180"
973
+ ),
974
+ width: 18,
975
+ height: 18,
976
+ viewBox: "0 0 24 24",
977
+ fill: "none",
978
+ stroke: "currentColor",
979
+ strokeWidth: 2,
980
+ strokeLinecap: "round",
981
+ strokeLinejoin: "round",
982
+ children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
983
+ }
984
+ )
985
+ ]
986
+ }
987
+ );
988
+ });
884
989
  AccordionTrigger.displayName = "AccordionTrigger";
885
- var AccordionContent = React52.forwardRef(
886
- ({ className, children, ...props }, ref) => {
887
- const ctx = React52.useContext(AccordionContext);
888
- const value = React52.useContext(ItemContext);
889
- const isOpen = ctx.open.includes(value);
890
- return /* @__PURE__ */ jsx(
891
- "div",
892
- {
893
- ref,
894
- className: cn("grid transition-[grid-template-rows] duration-200 ease-out", isOpen ? "[grid-template-rows:1fr]" : "[grid-template-rows:0fr]"),
895
- ...props,
896
- children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: cn("px-[1.2rem] pt-3 pb-4 text-[0.85rem] text-muted-foreground", className), children }) })
897
- }
898
- );
899
- }
900
- );
990
+ var AccordionContent = React52.forwardRef(({ className, children, ...props }, ref) => {
991
+ const ctx = React52.useContext(AccordionContext);
992
+ const value = React52.useContext(ItemContext);
993
+ const isOpen = ctx.open.includes(value);
994
+ return /* @__PURE__ */ jsx(
995
+ "div",
996
+ {
997
+ ref,
998
+ className: cn(
999
+ "grid transition-[grid-template-rows] duration-200 ease-out",
1000
+ isOpen ? "[grid-template-rows:1fr]" : "[grid-template-rows:0fr]"
1001
+ ),
1002
+ ...props,
1003
+ children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx(
1004
+ "div",
1005
+ {
1006
+ className: cn("px-[1.2rem] pt-3 pb-4 text-[0.85rem] text-muted-foreground", className),
1007
+ children
1008
+ }
1009
+ ) })
1010
+ }
1011
+ );
1012
+ });
901
1013
  AccordionContent.displayName = "AccordionContent";
902
1014
  var MenuContext = React52.createContext(null);
903
- function DropdownMenu({ children, className }) {
1015
+ function DropdownMenu({
1016
+ children,
1017
+ className
1018
+ }) {
904
1019
  const [open, setOpen] = React52.useState(false);
905
1020
  const ref = React52.useRef(null);
906
1021
  React52.useEffect(() => {
@@ -951,14 +1066,21 @@ var DropdownMenuTrigger = React52.forwardRef(({ onClick, asChild, ...props }, re
951
1066
  );
952
1067
  });
953
1068
  DropdownMenuTrigger.displayName = "DropdownMenuTrigger";
954
- function DropdownMenuContent({ className, align = "start", children, ...props }) {
1069
+ function DropdownMenuContent({
1070
+ className,
1071
+ align = "start",
1072
+ children,
1073
+ ...props
1074
+ }) {
955
1075
  const ctx = React52.useContext(MenuContext);
956
1076
  const ref = React52.useRef(null);
957
1077
  React52.useEffect(() => {
958
1078
  if (!ctx.open) return;
959
1079
  const container = ref.current;
960
1080
  if (container) {
961
- const items = Array.from(container.querySelectorAll('[role="menuitem"]'));
1081
+ const items = Array.from(
1082
+ container.querySelectorAll('[role="menuitem"]')
1083
+ );
962
1084
  if (items.length > 0) {
963
1085
  setTimeout(() => items[0].focus(), 50);
964
1086
  }
@@ -1034,7 +1156,16 @@ function DropdownMenuSeparator({ className }) {
1034
1156
  return /* @__PURE__ */ jsx("div", { className: cn("h-px bg-border my-1.5", className), role: "separator" });
1035
1157
  }
1036
1158
  var Breadcrumb = React52.forwardRef(
1037
- ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("nav", { ref, "aria-label": "Breadcrumb", className: cn("flex items-center gap-1.5 text-[0.85rem] text-muted-foreground", className), ...props, children })
1159
+ ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
1160
+ "nav",
1161
+ {
1162
+ ref,
1163
+ "aria-label": "Breadcrumb",
1164
+ className: cn("flex items-center gap-1.5 text-[0.85rem] text-muted-foreground", className),
1165
+ ...props,
1166
+ children
1167
+ }
1168
+ )
1038
1169
  );
1039
1170
  Breadcrumb.displayName = "Breadcrumb";
1040
1171
  var BreadcrumbItem = React52.forwardRef(
@@ -1042,7 +1173,18 @@ var BreadcrumbItem = React52.forwardRef(
1042
1173
  if (current) {
1043
1174
  return /* @__PURE__ */ jsx("span", { "aria-current": "page", className: cn("text-foreground font-semibold", className), children });
1044
1175
  }
1045
- return /* @__PURE__ */ jsx("a", { ref, className: cn("text-inherit no-underline hover:text-foreground transition-colors", className), ...props, children });
1176
+ return /* @__PURE__ */ jsx(
1177
+ "a",
1178
+ {
1179
+ ref,
1180
+ className: cn(
1181
+ "text-inherit no-underline hover:text-foreground transition-colors",
1182
+ className
1183
+ ),
1184
+ ...props,
1185
+ children
1186
+ }
1187
+ );
1046
1188
  }
1047
1189
  );
1048
1190
  BreadcrumbItem.displayName = "BreadcrumbItem";
@@ -1063,11 +1205,34 @@ function paginate(page, pageCount) {
1063
1205
  items.push(pageCount);
1064
1206
  return items;
1065
1207
  }
1066
- var Chevron = ({ dir }) => /* @__PURE__ */ jsx("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("polyline", { points: dir === "left" ? "15 18 9 12 15 6" : "9 18 15 12 9 6" }) });
1208
+ var Chevron = ({ dir }) => /* @__PURE__ */ jsx(
1209
+ "svg",
1210
+ {
1211
+ width: 16,
1212
+ height: 16,
1213
+ viewBox: "0 0 24 24",
1214
+ fill: "none",
1215
+ stroke: "currentColor",
1216
+ strokeWidth: 2,
1217
+ strokeLinecap: "round",
1218
+ strokeLinejoin: "round",
1219
+ children: /* @__PURE__ */ jsx("polyline", { points: dir === "left" ? "15 18 9 12 15 6" : "9 18 15 12 9 6" })
1220
+ }
1221
+ );
1067
1222
  function Pagination({ page, pageCount, onPageChange, className }) {
1068
1223
  const items = paginate(page, pageCount);
1069
1224
  return /* @__PURE__ */ jsxs("nav", { "aria-label": "Paginacja", className: cn("flex items-center gap-1", className), children: [
1070
- /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon-sm", "aria-label": "Previous", disabled: page <= 1, onClick: () => onPageChange(page - 1), children: /* @__PURE__ */ jsx(Chevron, { dir: "left" }) }),
1225
+ /* @__PURE__ */ jsx(
1226
+ Button,
1227
+ {
1228
+ variant: "ghost",
1229
+ size: "icon-sm",
1230
+ "aria-label": "Previous",
1231
+ disabled: page <= 1,
1232
+ onClick: () => onPageChange(page - 1),
1233
+ children: /* @__PURE__ */ jsx(Chevron, { dir: "left" })
1234
+ }
1235
+ ),
1071
1236
  items.map(
1072
1237
  (it, i) => it === "\u2026" ? /* @__PURE__ */ jsx("span", { className: "px-1 text-muted-foreground select-none", children: "\u2026" }, `e${i}`) : /* @__PURE__ */ jsx(
1073
1238
  Button,
@@ -1081,7 +1246,17 @@ function Pagination({ page, pageCount, onPageChange, className }) {
1081
1246
  it
1082
1247
  )
1083
1248
  ),
1084
- /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon-sm", "aria-label": "Next", disabled: page >= pageCount, onClick: () => onPageChange(page + 1), children: /* @__PURE__ */ jsx(Chevron, { dir: "right" }) })
1249
+ /* @__PURE__ */ jsx(
1250
+ Button,
1251
+ {
1252
+ variant: "ghost",
1253
+ size: "icon-sm",
1254
+ "aria-label": "Next",
1255
+ disabled: page >= pageCount,
1256
+ onClick: () => onPageChange(page + 1),
1257
+ children: /* @__PURE__ */ jsx(Chevron, { dir: "right" })
1258
+ }
1259
+ )
1085
1260
  ] });
1086
1261
  }
1087
1262
  var BottomNavigation = React52.forwardRef(
@@ -1157,24 +1332,26 @@ var BottomNavigation = React52.forwardRef(
1157
1332
  );
1158
1333
  BottomNavigation.displayName = "BottomNavigation";
1159
1334
  var TableWrap = React52.forwardRef(
1160
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("w-full max-w-full overflow-x-auto border border-border rounded-kj-lg", className), ...props })
1335
+ ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
1336
+ "div",
1337
+ {
1338
+ ref,
1339
+ className: cn(
1340
+ "w-full max-w-full overflow-x-auto border border-border rounded-kj-lg",
1341
+ className
1342
+ ),
1343
+ ...props
1344
+ }
1345
+ )
1161
1346
  );
1162
1347
  TableWrap.displayName = "TableWrap";
1163
- var Table = React52.forwardRef(
1164
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("table", { ref, className: cn("w-full border-collapse text-[0.85rem]", className), ...props })
1165
- );
1348
+ var Table = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("table", { ref, className: cn("w-full border-collapse text-[0.85rem]", className), ...props }));
1166
1349
  Table.displayName = "Table";
1167
- var TableHeader = React52.forwardRef(
1168
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className, ...props })
1169
- );
1350
+ var TableHeader = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className, ...props }));
1170
1351
  TableHeader.displayName = "TableHeader";
1171
- var TableBody = React52.forwardRef(
1172
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("tbody", { ref, className, ...props })
1173
- );
1352
+ var TableBody = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("tbody", { ref, className, ...props }));
1174
1353
  TableBody.displayName = "TableBody";
1175
- var TableRow = React52.forwardRef(
1176
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("tr", { ref, className: cn("transition-colors hover:bg-muted/50", className), ...props })
1177
- );
1354
+ var TableRow = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("tr", { ref, className: cn("transition-colors hover:bg-muted/50", className), ...props }));
1178
1355
  TableRow.displayName = "TableRow";
1179
1356
  var TableHead = React52.forwardRef(
1180
1357
  ({ className, numeric, ...props }, ref) => /* @__PURE__ */ jsx(
@@ -1228,7 +1405,14 @@ function Tooltip({ content, children, className }) {
1228
1405
  );
1229
1406
  }
1230
1407
  var ModalContext = React52.createContext(null);
1231
- function Modal({ open, onClose, children, width = 440, className, showClose = true }) {
1408
+ function Modal({
1409
+ open,
1410
+ onClose,
1411
+ children,
1412
+ width = 440,
1413
+ className,
1414
+ showClose = true
1415
+ }) {
1232
1416
  const titleId = React52.useId();
1233
1417
  const descId = React52.useId();
1234
1418
  const containerRef = React52.useRef(null);
@@ -1324,7 +1508,20 @@ function Modal({ open, onClose, children, width = 440, className, showClose = tr
1324
1508
  onClick: onClose,
1325
1509
  "aria-label": "Close",
1326
1510
  className: "absolute top-4 right-4 p-1.5 rounded-kj-sm text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer",
1327
- children: /* @__PURE__ */ jsx("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) })
1511
+ children: /* @__PURE__ */ jsx(
1512
+ "svg",
1513
+ {
1514
+ width: 16,
1515
+ height: 16,
1516
+ viewBox: "0 0 24 24",
1517
+ fill: "none",
1518
+ stroke: "currentColor",
1519
+ strokeWidth: 2.5,
1520
+ strokeLinecap: "round",
1521
+ strokeLinejoin: "round",
1522
+ children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" })
1523
+ }
1524
+ )
1328
1525
  }
1329
1526
  ),
1330
1527
  children
@@ -1334,33 +1531,102 @@ function Modal({ open, onClose, children, width = 440, className, showClose = tr
1334
1531
  }
1335
1532
  );
1336
1533
  }
1337
- function ModalTitle({ className, id, children, ...props }) {
1338
- const ctx = React52.useContext(ModalContext);
1339
- return /* @__PURE__ */ jsx("h3", { id: id ?? ctx?.titleId, className: cn("m-0 mb-2 text-[1.15rem] font-bold tracking-[-0.01em] text-foreground", className), ...props, children });
1340
- }
1341
- function ModalDescription({ className, id, ...props }) {
1534
+ function ModalTitle({
1535
+ className,
1536
+ id,
1537
+ children,
1538
+ ...props
1539
+ }) {
1342
1540
  const ctx = React52.useContext(ModalContext);
1343
- return /* @__PURE__ */ jsx("p", { id: id ?? ctx?.descId, className: cn("m-0 text-[0.9rem] text-muted-foreground", className), ...props });
1344
- }
1345
- function ModalActions({ className, ...props }) {
1346
- return /* @__PURE__ */ jsx("div", { className: cn("flex gap-2.5 justify-end mt-6", className), ...props });
1347
- }
1348
- var ToastContext = React52.createContext(null);
1541
+ return /* @__PURE__ */ jsx(
1542
+ "h3",
1543
+ {
1544
+ id: id ?? ctx?.titleId,
1545
+ className: cn(
1546
+ "m-0 mb-2 text-[1.15rem] font-bold tracking-[-0.01em] text-foreground",
1547
+ className
1548
+ ),
1549
+ ...props,
1550
+ children
1551
+ }
1552
+ );
1553
+ }
1554
+ function ModalDescription({
1555
+ className,
1556
+ id,
1557
+ ...props
1558
+ }) {
1559
+ const ctx = React52.useContext(ModalContext);
1560
+ return /* @__PURE__ */ jsx(
1561
+ "p",
1562
+ {
1563
+ id: id ?? ctx?.descId,
1564
+ className: cn("m-0 text-[0.9rem] text-muted-foreground", className),
1565
+ ...props
1566
+ }
1567
+ );
1568
+ }
1569
+ function ModalActions({ className, ...props }) {
1570
+ return /* @__PURE__ */ jsx("div", { className: cn("flex gap-2.5 justify-end mt-6", className), ...props });
1571
+ }
1572
+ var ToastContext = React52.createContext(null);
1349
1573
  function useToast() {
1350
1574
  const ctx = React52.useContext(ToastContext);
1351
1575
  if (!ctx) throw new Error("useToast must be used within <ToastProvider>");
1352
1576
  return ctx;
1353
1577
  }
1354
1578
  var icons = {
1355
- default: /* @__PURE__ */ jsxs("svg", { width: 18, height: 18, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", className: "text-primary", children: [
1356
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
1357
- /* @__PURE__ */ jsx("path", { d: "M12 16v-4M12 8h.01" })
1358
- ] }),
1359
- success: /* @__PURE__ */ jsx("svg", { width: 18, height: 18, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", className: "text-success", children: /* @__PURE__ */ jsx("path", { d: "M20 6 9 17l-5-5" }) }),
1360
- danger: /* @__PURE__ */ jsxs("svg", { width: 18, height: 18, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", className: "text-danger", children: [
1361
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
1362
- /* @__PURE__ */ jsx("path", { d: "m15 9-6 6M9 9l6 6" })
1363
- ] })
1579
+ default: /* @__PURE__ */ jsxs(
1580
+ "svg",
1581
+ {
1582
+ width: 18,
1583
+ height: 18,
1584
+ viewBox: "0 0 24 24",
1585
+ fill: "none",
1586
+ stroke: "currentColor",
1587
+ strokeWidth: 2,
1588
+ strokeLinecap: "round",
1589
+ strokeLinejoin: "round",
1590
+ className: "text-primary",
1591
+ children: [
1592
+ /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
1593
+ /* @__PURE__ */ jsx("path", { d: "M12 16v-4M12 8h.01" })
1594
+ ]
1595
+ }
1596
+ ),
1597
+ success: /* @__PURE__ */ jsx(
1598
+ "svg",
1599
+ {
1600
+ width: 18,
1601
+ height: 18,
1602
+ viewBox: "0 0 24 24",
1603
+ fill: "none",
1604
+ stroke: "currentColor",
1605
+ strokeWidth: 2,
1606
+ strokeLinecap: "round",
1607
+ strokeLinejoin: "round",
1608
+ className: "text-success",
1609
+ children: /* @__PURE__ */ jsx("path", { d: "M20 6 9 17l-5-5" })
1610
+ }
1611
+ ),
1612
+ danger: /* @__PURE__ */ jsxs(
1613
+ "svg",
1614
+ {
1615
+ width: 18,
1616
+ height: 18,
1617
+ viewBox: "0 0 24 24",
1618
+ fill: "none",
1619
+ stroke: "currentColor",
1620
+ strokeWidth: 2,
1621
+ strokeLinecap: "round",
1622
+ strokeLinejoin: "round",
1623
+ className: "text-danger",
1624
+ children: [
1625
+ /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
1626
+ /* @__PURE__ */ jsx("path", { d: "m15 9-6 6M9 9l6 6" })
1627
+ ]
1628
+ }
1629
+ )
1364
1630
  };
1365
1631
  var toneBorder = {
1366
1632
  default: "border-l-primary",
@@ -1494,20 +1760,11 @@ var SectionHeader = React52.forwardRef(
1494
1760
  ),
1495
1761
  ...props,
1496
1762
  children: children ? children : /* @__PURE__ */ jsxs(Fragment, { children: [
1497
- /* @__PURE__ */ jsxs(
1498
- "div",
1499
- {
1500
- className: cn(
1501
- "space-y-2",
1502
- isCentered && "flex flex-col items-center"
1503
- ),
1504
- children: [
1505
- kicker && /* @__PURE__ */ jsx(SectionHeaderKicker, { children: kicker }),
1506
- title && /* @__PURE__ */ jsx(SectionHeaderTitle, { as: headingLevel, children: title }),
1507
- description && /* @__PURE__ */ jsx(SectionHeaderDescription, { children: description })
1508
- ]
1509
- }
1510
- ),
1763
+ /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", isCentered && "flex flex-col items-center"), children: [
1764
+ kicker && /* @__PURE__ */ jsx(SectionHeaderKicker, { children: kicker }),
1765
+ title && /* @__PURE__ */ jsx(SectionHeaderTitle, { as: headingLevel, children: title }),
1766
+ description && /* @__PURE__ */ jsx(SectionHeaderDescription, { children: description })
1767
+ ] }),
1511
1768
  actions && /* @__PURE__ */ jsx(SectionHeaderActions, { className: cn(isCentered && "justify-center mt-4"), children: actions })
1512
1769
  ] })
1513
1770
  }
@@ -1553,7 +1810,13 @@ var MetricCard = React52.forwardRef(
1553
1810
  ] }),
1554
1811
  /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-2.5 mb-1.5", children: [
1555
1812
  /* @__PURE__ */ jsx("span", { className: "text-3xl font-bold tracking-tight text-foreground", children: value }),
1556
- trend && /* @__PURE__ */ jsx("span", { className: cn("text-[0.75rem] font-bold px-2 py-0.5 rounded-full border", trendColor), children: trend })
1813
+ trend && /* @__PURE__ */ jsx(
1814
+ "span",
1815
+ {
1816
+ className: cn("text-[0.75rem] font-bold px-2 py-0.5 rounded-full border", trendColor),
1817
+ children: trend
1818
+ }
1819
+ )
1557
1820
  ] }),
1558
1821
  description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: description })
1559
1822
  ] });
@@ -1627,130 +1890,160 @@ function DataTable({
1627
1890
  };
1628
1891
  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-4 w-full", className), children: [
1629
1892
  toolbar && /* @__PURE__ */ jsx("div", { className: "flex flex-col sm:flex-row items-stretch sm:items-center justify-between gap-3", children: toolbar }),
1630
- /* @__PURE__ */ jsxs(TableWrap, { className: "relative overflow-x-auto overflow-y-hidden [scroll-behavior:smooth] [-webkit-overflow-scrolling:touch]", ...props, children: [
1631
- /* @__PURE__ */ jsxs(Table, { children: [
1632
- /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
1633
- isSelectionActive && /* @__PURE__ */ jsx(TableHead, { className: "w-12 px-4 text-center", children: /* @__PURE__ */ jsx("div", { className: "inline-flex items-center justify-center", children: /* @__PURE__ */ jsx(
1634
- "input",
1635
- {
1636
- type: "checkbox",
1637
- ref: headerCheckboxRef,
1638
- checked: allSelected,
1639
- onChange: handleSelectAll,
1640
- "aria-label": "Select all rows",
1641
- className: "h-4 w-4 rounded border-input text-primary focus:ring-ring"
1642
- }
1643
- ) }) }),
1644
- columns.map((col, idx) => {
1645
- const alignClass = {
1646
- left: "text-left",
1647
- center: "text-center",
1648
- right: "text-right"
1649
- }[col.align || "left"];
1650
- const isSortable = col.sortable && onSort && col.sortKey;
1651
- const isSortedActive = sortBy && col.sortKey === sortBy;
1652
- const ariaSort = isSortable ? isSortedActive ? sortDirection === "asc" ? "ascending" : "descending" : "none" : void 0;
1653
- return /* @__PURE__ */ jsx(
1654
- TableHead,
1655
- {
1656
- className: cn(
1657
- alignClass,
1658
- isSortable && "p-0 hover:bg-muted/30 transition-colors",
1659
- col.className
1660
- ),
1661
- "aria-sort": ariaSort,
1662
- children: isSortable ? /* @__PURE__ */ jsxs(
1663
- "button",
1893
+ /* @__PURE__ */ jsxs(
1894
+ TableWrap,
1895
+ {
1896
+ className: "relative overflow-x-auto overflow-y-hidden [scroll-behavior:smooth] [-webkit-overflow-scrolling:touch]",
1897
+ ...props,
1898
+ children: [
1899
+ /* @__PURE__ */ jsxs(Table, { children: [
1900
+ /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
1901
+ isSelectionActive && /* @__PURE__ */ jsx(TableHead, { className: "w-12 px-4 text-center", children: /* @__PURE__ */ jsx("div", { className: "inline-flex items-center justify-center", children: /* @__PURE__ */ jsx(
1902
+ "input",
1903
+ {
1904
+ type: "checkbox",
1905
+ ref: headerCheckboxRef,
1906
+ checked: allSelected,
1907
+ onChange: handleSelectAll,
1908
+ "aria-label": "Select all rows",
1909
+ className: "h-4 w-4 rounded border-input text-primary focus:ring-ring"
1910
+ }
1911
+ ) }) }),
1912
+ columns.map((col, idx) => {
1913
+ const alignClass = {
1914
+ left: "text-left",
1915
+ center: "text-center",
1916
+ right: "text-right"
1917
+ }[col.align || "left"];
1918
+ const isSortable = col.sortable && onSort && col.sortKey;
1919
+ const isSortedActive = sortBy && col.sortKey === sortBy;
1920
+ const ariaSort = isSortable ? isSortedActive ? sortDirection === "asc" ? "ascending" : "descending" : "none" : void 0;
1921
+ return /* @__PURE__ */ jsx(
1922
+ TableHead,
1664
1923
  {
1665
- type: "button",
1666
- onClick: () => {
1667
- if (!col.sortKey) return;
1668
- const nextDirection = isSortedActive && sortDirection === "asc" ? "desc" : "asc";
1669
- onSort(col.sortKey, nextDirection);
1670
- },
1671
1924
  className: cn(
1672
- "w-full px-4 py-3 flex items-center gap-1.5 font-semibold text-[0.72rem] uppercase tracking-[0.05em] text-muted-foreground hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 transition-colors cursor-pointer",
1925
+ alignClass,
1926
+ isSortable && "p-0 hover:bg-muted/30 transition-colors",
1927
+ col.className
1928
+ ),
1929
+ "aria-sort": ariaSort,
1930
+ children: isSortable ? /* @__PURE__ */ jsxs(
1931
+ "button",
1673
1932
  {
1674
- "justify-start text-left": col.align === "left" || !col.align,
1675
- "justify-center text-center": col.align === "center",
1676
- "justify-end text-right": col.align === "right"
1933
+ type: "button",
1934
+ onClick: () => {
1935
+ if (!col.sortKey) return;
1936
+ const nextDirection = isSortedActive && sortDirection === "asc" ? "desc" : "asc";
1937
+ onSort(col.sortKey, nextDirection);
1938
+ },
1939
+ className: cn(
1940
+ "w-full px-4 py-3 flex items-center gap-1.5 font-semibold text-[0.72rem] uppercase tracking-[0.05em] text-muted-foreground hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 transition-colors cursor-pointer",
1941
+ {
1942
+ "justify-start text-left": col.align === "left" || !col.align,
1943
+ "justify-center text-center": col.align === "center",
1944
+ "justify-end text-right": col.align === "right"
1945
+ }
1946
+ ),
1947
+ children: [
1948
+ /* @__PURE__ */ jsx("span", { children: col.header }),
1949
+ /* @__PURE__ */ jsx("span", { className: "text-[10px] text-muted-foreground shrink-0 select-none", children: isSortedActive ? sortDirection === "asc" ? "\u25B2" : "\u25BC" : "\u21C5" })
1950
+ ]
1677
1951
  }
1678
- ),
1679
- children: [
1680
- /* @__PURE__ */ jsx("span", { children: col.header }),
1681
- /* @__PURE__ */ jsx("span", { className: "text-[10px] text-muted-foreground shrink-0 select-none", children: isSortedActive ? sortDirection === "asc" ? "\u25B2" : "\u25BC" : "\u21C5" })
1682
- ]
1683
- }
1684
- ) : /* @__PURE__ */ jsx("div", { className: cn("inline-flex items-center gap-1.5", alignClass === "text-right" && "justify-end w-full"), children: col.header })
1685
- },
1686
- idx
1687
- );
1688
- })
1689
- ] }) }),
1690
- /* @__PURE__ */ jsx(TableBody, { children: loading && data.length === 0 ? /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: columns.length + (isSelectionActive ? 1 : 0), className: "h-64 text-center", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center gap-3", children: [
1691
- /* @__PURE__ */ jsx(Spinner, { size: 32 }),
1692
- /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "Loading dataset..." })
1693
- ] }) }) }) : error ? /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: columns.length + (isSelectionActive ? 1 : 0), className: "p-8", children: /* @__PURE__ */ jsx(Alert, { variant: "danger", title: "Error loading data", children: error }) }) }) : data.length === 0 ? /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: columns.length + (isSelectionActive ? 1 : 0), className: "p-0", children: /* @__PURE__ */ jsx(
1694
- EmptyState,
1695
- {
1696
- title: emptyTitle,
1697
- description: emptyDescription,
1698
- action: emptyAction,
1699
- className: "border-none bg-transparent rounded-none py-16"
1700
- }
1701
- ) }) }) : data.map((row, rowIdx) => {
1702
- const rowKey = getRowId(row, rowIdx);
1703
- const isSelected = isSelectionActive && selectedRows.has(rowKey);
1704
- return /* @__PURE__ */ jsxs(
1705
- TableRow,
1706
- {
1707
- onClick: () => onRowClick && onRowClick(row),
1708
- className: cn(
1709
- onRowClick && "cursor-pointer hover:bg-muted/40 transition-colors",
1710
- isSelected && "bg-primary/5 hover:bg-primary/10"
1711
- ),
1712
- children: [
1713
- isSelectionActive && /* @__PURE__ */ jsx(
1714
- TableCell,
1715
- {
1716
- className: "w-12 px-4 text-center",
1717
- onClick: (e) => {
1718
- e.stopPropagation();
1719
- },
1720
- children: /* @__PURE__ */ jsx("div", { className: "inline-flex items-center justify-center", children: /* @__PURE__ */ jsx(
1721
- "input",
1952
+ ) : /* @__PURE__ */ jsx(
1953
+ "div",
1722
1954
  {
1723
- type: "checkbox",
1724
- checked: isSelected,
1725
- onChange: (e) => handleSelectRow(row, rowIdx, e.target.checked),
1726
- "aria-label": `Select row ${rowIdx + 1}`,
1727
- className: "h-4 w-4 rounded border-input text-primary focus:ring-ring"
1955
+ className: cn(
1956
+ "inline-flex items-center gap-1.5",
1957
+ alignClass === "text-right" && "justify-end w-full"
1958
+ ),
1959
+ children: col.header
1728
1960
  }
1729
- ) })
1730
- }
1731
- ),
1732
- columns.map((col, colIdx) => {
1733
- const alignClass = {
1734
- left: "text-left",
1735
- center: "text-center",
1736
- right: "text-right"
1737
- }[col.align || "left"];
1738
- return /* @__PURE__ */ jsx(TableCell, { className: cn(alignClass, col.className), children: col.accessor(row) }, colIdx);
1739
- })
1740
- ]
1741
- },
1742
- rowKey
1743
- );
1744
- }) })
1745
- ] }),
1746
- loading && data.length > 0 && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-background/50 backdrop-blur-[1px] grid place-items-center z-10 transition-opacity duration-150", children: /* @__PURE__ */ jsx(Spinner, { size: 36 }) })
1747
- ] }),
1961
+ )
1962
+ },
1963
+ idx
1964
+ );
1965
+ })
1966
+ ] }) }),
1967
+ /* @__PURE__ */ jsx(TableBody, { children: loading && data.length === 0 ? /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(
1968
+ TableCell,
1969
+ {
1970
+ colSpan: columns.length + (isSelectionActive ? 1 : 0),
1971
+ className: "h-64 text-center",
1972
+ children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center gap-3", children: [
1973
+ /* @__PURE__ */ jsx(Spinner, { size: 32 }),
1974
+ /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "Loading dataset..." })
1975
+ ] })
1976
+ }
1977
+ ) }) : error ? /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: columns.length + (isSelectionActive ? 1 : 0), className: "p-8", children: /* @__PURE__ */ jsx(Alert, { variant: "danger", title: "Error loading data", children: error }) }) }) : data.length === 0 ? /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: columns.length + (isSelectionActive ? 1 : 0), className: "p-0", children: /* @__PURE__ */ jsx(
1978
+ EmptyState,
1979
+ {
1980
+ title: emptyTitle,
1981
+ description: emptyDescription,
1982
+ action: emptyAction,
1983
+ className: "border-none bg-transparent rounded-none py-16"
1984
+ }
1985
+ ) }) }) : data.map((row, rowIdx) => {
1986
+ const rowKey = getRowId(row, rowIdx);
1987
+ const isSelected = isSelectionActive && selectedRows.has(rowKey);
1988
+ return /* @__PURE__ */ jsxs(
1989
+ TableRow,
1990
+ {
1991
+ onClick: () => onRowClick && onRowClick(row),
1992
+ className: cn(
1993
+ onRowClick && "cursor-pointer hover:bg-muted/40 transition-colors",
1994
+ isSelected && "bg-primary/5 hover:bg-primary/10"
1995
+ ),
1996
+ children: [
1997
+ isSelectionActive && /* @__PURE__ */ jsx(
1998
+ TableCell,
1999
+ {
2000
+ className: "w-12 px-4 text-center",
2001
+ onClick: (e) => {
2002
+ e.stopPropagation();
2003
+ },
2004
+ children: /* @__PURE__ */ jsx("div", { className: "inline-flex items-center justify-center", children: /* @__PURE__ */ jsx(
2005
+ "input",
2006
+ {
2007
+ type: "checkbox",
2008
+ checked: isSelected,
2009
+ onChange: (e) => handleSelectRow(row, rowIdx, e.target.checked),
2010
+ "aria-label": `Select row ${rowIdx + 1}`,
2011
+ className: "h-4 w-4 rounded border-input text-primary focus:ring-ring"
2012
+ }
2013
+ ) })
2014
+ }
2015
+ ),
2016
+ columns.map((col, colIdx) => {
2017
+ const alignClass = {
2018
+ left: "text-left",
2019
+ center: "text-center",
2020
+ right: "text-right"
2021
+ }[col.align || "left"];
2022
+ return /* @__PURE__ */ jsx(TableCell, { className: cn(alignClass, col.className), children: col.accessor(row) }, colIdx);
2023
+ })
2024
+ ]
2025
+ },
2026
+ rowKey
2027
+ );
2028
+ }) })
2029
+ ] }),
2030
+ loading && data.length > 0 && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-background/50 backdrop-blur-[1px] grid place-items-center z-10 transition-opacity duration-150", children: /* @__PURE__ */ jsx(Spinner, { size: 36 }) })
2031
+ ]
2032
+ }
2033
+ ),
1748
2034
  pagination && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end w-full", children: pagination })
1749
2035
  ] });
1750
2036
  }
1751
2037
  DataTable.displayName = "DataTable";
1752
2038
  var ErrorState = React52.forwardRef(
1753
- ({ className, title = "Wyst\u0105pi\u0142 b\u0142\u0105d", message, onRetry, retryLabel = "Spr\xF3buj ponownie", ...props }, ref) => /* @__PURE__ */ jsxs(
2039
+ ({
2040
+ className,
2041
+ title = "Wyst\u0105pi\u0142 b\u0142\u0105d",
2042
+ message,
2043
+ onRetry,
2044
+ retryLabel = "Spr\xF3buj ponownie",
2045
+ ...props
2046
+ }, ref) => /* @__PURE__ */ jsxs(
1754
2047
  "div",
1755
2048
  {
1756
2049
  ref,
@@ -1760,7 +2053,24 @@ var ErrorState = React52.forwardRef(
1760
2053
  ),
1761
2054
  ...props,
1762
2055
  children: [
1763
- /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-danger-surface border border-danger/30 text-danger mb-4", children: /* @__PURE__ */ jsx("svg", { fill: "none", stroke: "currentColor", strokeWidth: 2.5, viewBox: "0 0 24 24", className: "h-6 w-6", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z" }) }) }),
2056
+ /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-danger-surface border border-danger/30 text-danger mb-4", children: /* @__PURE__ */ jsx(
2057
+ "svg",
2058
+ {
2059
+ fill: "none",
2060
+ stroke: "currentColor",
2061
+ strokeWidth: 2.5,
2062
+ viewBox: "0 0 24 24",
2063
+ className: "h-6 w-6",
2064
+ children: /* @__PURE__ */ jsx(
2065
+ "path",
2066
+ {
2067
+ strokeLinecap: "round",
2068
+ strokeLinejoin: "round",
2069
+ d: "M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z"
2070
+ }
2071
+ )
2072
+ }
2073
+ ) }),
1764
2074
  /* @__PURE__ */ jsx("h3", { className: "text-base font-bold text-foreground mb-1", children: title }),
1765
2075
  /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground max-w-sm mb-6 leading-relaxed", children: message }),
1766
2076
  onRetry && /* @__PURE__ */ jsx(Button, { size: "sm", variant: "danger", onClick: onRetry, children: retryLabel })
@@ -1770,12 +2080,14 @@ var ErrorState = React52.forwardRef(
1770
2080
  );
1771
2081
  ErrorState.displayName = "ErrorState";
1772
2082
  var Skeleton = React52.forwardRef(
1773
- ({ className, variant = "rectangular", width, height, style, ...props }, ref) => /* @__PURE__ */ jsx(
2083
+ ({ className, variant = "rectangular", animation = "shimmer", width, height, style, ...props }, ref) => /* @__PURE__ */ jsx(
1774
2084
  "div",
1775
2085
  {
1776
2086
  ref,
1777
2087
  className: cn(
1778
- "animate-pulse bg-muted/40",
2088
+ "bg-muted-foreground/15 dark:bg-muted-foreground/20",
2089
+ animation === "pulse" && "animate-pulse",
2090
+ animation === "shimmer" && "relative overflow-hidden after:absolute after:inset-0 after:-translate-x-full after:animate-[kjshimmer_2s_ease-in-out_infinite_alternate] after:bg-gradient-to-r after:from-transparent after:via-foreground/10 after:to-transparent",
1779
2091
  variant === "text" && "h-3 w-4/5 rounded-sm my-1.5",
1780
2092
  variant === "circular" && "rounded-full",
1781
2093
  variant === "rectangular" && "rounded-kj-md",
@@ -1827,7 +2139,16 @@ var DashboardShell = React52.forwardRef(
1827
2139
  mobileSidebar ? "hidden md:flex" : "w-full md:flex",
1828
2140
  sidebarWidth
1829
2141
  ),
1830
- children: /* @__PURE__ */ jsx("div", { className: cn("sticky top-0 w-full flex flex-col", mobileSidebar ? "h-screen" : "h-auto md:h-screen"), children: sidebar })
2142
+ children: /* @__PURE__ */ jsx(
2143
+ "div",
2144
+ {
2145
+ className: cn(
2146
+ "sticky top-0 w-full flex flex-col",
2147
+ mobileSidebar ? "h-screen" : "h-auto md:h-screen"
2148
+ ),
2149
+ children: sidebar
2150
+ }
2151
+ )
1831
2152
  }
1832
2153
  ),
1833
2154
  mobileSidebar && mobileOpen && /* @__PURE__ */ jsx(
@@ -1849,7 +2170,20 @@ var DashboardShell = React52.forwardRef(
1849
2170
  type: "button",
1850
2171
  onClick: () => setMobileOpen(false),
1851
2172
  className: "p-1 rounded text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer",
1852
- children: /* @__PURE__ */ jsx("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) })
2173
+ children: /* @__PURE__ */ jsx(
2174
+ "svg",
2175
+ {
2176
+ width: 16,
2177
+ height: 16,
2178
+ viewBox: "0 0 24 24",
2179
+ fill: "none",
2180
+ stroke: "currentColor",
2181
+ strokeWidth: 2.5,
2182
+ strokeLinecap: "round",
2183
+ strokeLinejoin: "round",
2184
+ children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" })
2185
+ }
2186
+ )
1853
2187
  }
1854
2188
  )
1855
2189
  ] }),
@@ -1875,11 +2209,24 @@ var DashboardShell = React52.forwardRef(
1875
2209
  onClick: () => setMobileOpen(true),
1876
2210
  className: "md:hidden p-1.5 -ml-1.5 rounded-kj-sm text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer",
1877
2211
  "aria-label": "Open navigation",
1878
- children: /* @__PURE__ */ jsxs("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: [
1879
- /* @__PURE__ */ jsx("line", { x1: "3", y1: "12", x2: "21", y2: "12" }),
1880
- /* @__PURE__ */ jsx("line", { x1: "3", y1: "6", x2: "21", y2: "6" }),
1881
- /* @__PURE__ */ jsx("line", { x1: "3", y1: "18", x2: "21", y2: "18" })
1882
- ] })
2212
+ children: /* @__PURE__ */ jsxs(
2213
+ "svg",
2214
+ {
2215
+ width: 20,
2216
+ height: 20,
2217
+ viewBox: "0 0 24 24",
2218
+ fill: "none",
2219
+ stroke: "currentColor",
2220
+ strokeWidth: 2.5,
2221
+ strokeLinecap: "round",
2222
+ strokeLinejoin: "round",
2223
+ children: [
2224
+ /* @__PURE__ */ jsx("line", { x1: "3", y1: "12", x2: "21", y2: "12" }),
2225
+ /* @__PURE__ */ jsx("line", { x1: "3", y1: "6", x2: "21", y2: "6" }),
2226
+ /* @__PURE__ */ jsx("line", { x1: "3", y1: "18", x2: "21", y2: "18" })
2227
+ ]
2228
+ }
2229
+ )
1883
2230
  }
1884
2231
  ),
1885
2232
  topbar
@@ -1910,7 +2257,18 @@ var SettingsLayout = React52.forwardRef(
1910
2257
  );
1911
2258
  SettingsLayout.displayName = "SettingsLayout";
1912
2259
  var DetailPageLayout = React52.forwardRef(
1913
- ({ className, title, description, backHref, backLabel = "Back", onBackClick, actions, aside, children, ...props }, ref) => {
2260
+ ({
2261
+ className,
2262
+ title,
2263
+ description,
2264
+ backHref,
2265
+ backLabel = "Back",
2266
+ onBackClick,
2267
+ actions,
2268
+ aside,
2269
+ children,
2270
+ ...props
2271
+ }, ref) => {
1914
2272
  return /* @__PURE__ */ jsxs("div", { ref, className: cn("space-y-6 w-full", className), ...props, children: [
1915
2273
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
1916
2274
  (backHref || onBackClick) && /* @__PURE__ */ jsx("div", { children: backHref ? /* @__PURE__ */ jsxs(
@@ -1922,7 +2280,24 @@ var DetailPageLayout = React52.forwardRef(
1922
2280
  "-ml-3 h-8 text-muted-foreground hover:text-foreground inline-flex items-center gap-1.5"
1923
2281
  ),
1924
2282
  children: [
1925
- /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", className: "h-4 w-4", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15.75 19.5 8.25 12l7.5-7.5" }) }),
2283
+ /* @__PURE__ */ jsx(
2284
+ "svg",
2285
+ {
2286
+ viewBox: "0 0 24 24",
2287
+ fill: "none",
2288
+ stroke: "currentColor",
2289
+ strokeWidth: "2.5",
2290
+ className: "h-4 w-4",
2291
+ children: /* @__PURE__ */ jsx(
2292
+ "path",
2293
+ {
2294
+ strokeLinecap: "round",
2295
+ strokeLinejoin: "round",
2296
+ d: "M15.75 19.5 8.25 12l7.5-7.5"
2297
+ }
2298
+ )
2299
+ }
2300
+ ),
1926
2301
  backLabel
1927
2302
  ]
1928
2303
  }
@@ -1934,7 +2309,24 @@ var DetailPageLayout = React52.forwardRef(
1934
2309
  className: "-ml-3 h-8 text-muted-foreground hover:text-foreground",
1935
2310
  onClick: onBackClick,
1936
2311
  children: [
1937
- /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", className: "h-4 w-4 mr-1.5", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15.75 19.5 8.25 12l7.5-7.5" }) }),
2312
+ /* @__PURE__ */ jsx(
2313
+ "svg",
2314
+ {
2315
+ viewBox: "0 0 24 24",
2316
+ fill: "none",
2317
+ stroke: "currentColor",
2318
+ strokeWidth: "2.5",
2319
+ className: "h-4 w-4 mr-1.5",
2320
+ children: /* @__PURE__ */ jsx(
2321
+ "path",
2322
+ {
2323
+ strokeLinecap: "round",
2324
+ strokeLinejoin: "round",
2325
+ d: "M15.75 19.5 8.25 12l7.5-7.5"
2326
+ }
2327
+ )
2328
+ }
2329
+ ),
1938
2330
  backLabel
1939
2331
  ]
1940
2332
  }
@@ -1956,7 +2348,15 @@ var DetailPageLayout = React52.forwardRef(
1956
2348
  );
1957
2349
  DetailPageLayout.displayName = "DetailPageLayout";
1958
2350
  var TableToolbar = React52.forwardRef(
1959
- ({ className, searchQuery, onSearchChange, searchPlaceholder = "Search...", actions, filters, ...props }, ref) => {
2351
+ ({
2352
+ className,
2353
+ searchQuery,
2354
+ onSearchChange,
2355
+ searchPlaceholder = "Search...",
2356
+ actions,
2357
+ filters,
2358
+ ...props
2359
+ }, ref) => {
1960
2360
  return /* @__PURE__ */ jsxs(
1961
2361
  "div",
1962
2362
  {
@@ -1976,7 +2376,24 @@ var TableToolbar = React52.forwardRef(
1976
2376
  value: searchQuery,
1977
2377
  onChange: (e) => onSearchChange(e.target.value),
1978
2378
  className: "sm:w-64",
1979
- leadingIcon: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", className: "h-4 w-4", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" }) })
2379
+ leadingIcon: /* @__PURE__ */ jsx(
2380
+ "svg",
2381
+ {
2382
+ viewBox: "0 0 24 24",
2383
+ fill: "none",
2384
+ stroke: "currentColor",
2385
+ strokeWidth: "2.5",
2386
+ className: "h-4 w-4",
2387
+ children: /* @__PURE__ */ jsx(
2388
+ "path",
2389
+ {
2390
+ strokeLinecap: "round",
2391
+ strokeLinejoin: "round",
2392
+ d: "m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"
2393
+ }
2394
+ )
2395
+ }
2396
+ )
1980
2397
  }
1981
2398
  ),
1982
2399
  filters && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: filters })
@@ -2086,14 +2503,8 @@ function Drawer({
2086
2503
  };
2087
2504
  }, [open, onClose]);
2088
2505
  const sideClasses = {
2089
- right: cn(
2090
- "right-0 h-full border-l",
2091
- open ? "translate-x-0" : "translate-x-full"
2092
- ),
2093
- left: cn(
2094
- "left-0 h-full border-r",
2095
- open ? "translate-x-0" : "-translate-x-full"
2096
- )
2506
+ right: cn("right-0 h-full border-l", open ? "translate-x-0" : "translate-x-full"),
2507
+ left: cn("left-0 h-full border-r", open ? "translate-x-0" : "-translate-x-full")
2097
2508
  }[side];
2098
2509
  return /* @__PURE__ */ jsx(
2099
2510
  "div",
@@ -2132,7 +2543,20 @@ function Drawer({
2132
2543
  onClick: onClose,
2133
2544
  "aria-label": "Close",
2134
2545
  className: "p-1.5 rounded-kj-sm text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer",
2135
- children: /* @__PURE__ */ jsx("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) })
2546
+ children: /* @__PURE__ */ jsx(
2547
+ "svg",
2548
+ {
2549
+ width: 16,
2550
+ height: 16,
2551
+ viewBox: "0 0 24 24",
2552
+ fill: "none",
2553
+ stroke: "currentColor",
2554
+ strokeWidth: 2.5,
2555
+ strokeLinecap: "round",
2556
+ strokeLinejoin: "round",
2557
+ children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" })
2558
+ }
2559
+ )
2136
2560
  }
2137
2561
  )
2138
2562
  ] }),
@@ -2144,7 +2568,12 @@ function Drawer({
2144
2568
  );
2145
2569
  }
2146
2570
  Drawer.displayName = "Drawer";
2147
- function CommandPalette({ open, onClose, items, placeholder = "Type a command or search..." }) {
2571
+ function CommandPalette({
2572
+ open,
2573
+ onClose,
2574
+ items,
2575
+ placeholder = "Type a command or search..."
2576
+ }) {
2148
2577
  const [search, setSearch] = React52.useState("");
2149
2578
  const [activeIndex, setActiveIndex] = React52.useState(0);
2150
2579
  const containerRef = React52.useRef(null);
@@ -2177,10 +2606,14 @@ function CommandPalette({ open, onClose, items, placeholder = "Type a command or
2177
2606
  }
2178
2607
  if (e.key === "ArrowDown") {
2179
2608
  e.preventDefault();
2180
- setActiveIndex((prev) => filteredItems.length === 0 ? 0 : (prev + 1) % filteredItems.length);
2609
+ setActiveIndex(
2610
+ (prev) => filteredItems.length === 0 ? 0 : (prev + 1) % filteredItems.length
2611
+ );
2181
2612
  } else if (e.key === "ArrowUp") {
2182
2613
  e.preventDefault();
2183
- setActiveIndex((prev) => filteredItems.length === 0 ? 0 : (prev - 1 + filteredItems.length) % filteredItems.length);
2614
+ setActiveIndex(
2615
+ (prev) => filteredItems.length === 0 ? 0 : (prev - 1 + filteredItems.length) % filteredItems.length
2616
+ );
2184
2617
  } else if (e.key === "Enter") {
2185
2618
  e.preventDefault();
2186
2619
  if (filteredItems[activeIndex]) {
@@ -2223,7 +2656,24 @@ function CommandPalette({ open, onClose, items, placeholder = "Type a command or
2223
2656
  className: "w-[95vw] max-w-lg bg-surface border border-border rounded-kj-xl shadow-kj-lg flex flex-col overflow-hidden max-h-[500px]",
2224
2657
  children: [
2225
2658
  /* @__PURE__ */ jsxs("div", { className: "p-4 border-b border-border flex items-center gap-2", children: [
2226
- /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", className: "h-5 w-5 text-muted-foreground shrink-0 ml-1", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" }) }),
2659
+ /* @__PURE__ */ jsx(
2660
+ "svg",
2661
+ {
2662
+ viewBox: "0 0 24 24",
2663
+ fill: "none",
2664
+ stroke: "currentColor",
2665
+ strokeWidth: "2.5",
2666
+ className: "h-5 w-5 text-muted-foreground shrink-0 ml-1",
2667
+ children: /* @__PURE__ */ jsx(
2668
+ "path",
2669
+ {
2670
+ strokeLinecap: "round",
2671
+ strokeLinejoin: "round",
2672
+ d: "m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"
2673
+ }
2674
+ )
2675
+ }
2676
+ ),
2227
2677
  /* @__PURE__ */ jsx(
2228
2678
  "input",
2229
2679
  {
@@ -2253,54 +2703,72 @@ function CommandPalette({ open, onClose, items, placeholder = "Type a command or
2253
2703
  role: "listbox",
2254
2704
  "aria-label": "Commands",
2255
2705
  className: "space-y-4",
2256
- children: Object.entries(groups).map(([cat, itemsInCat]) => /* @__PURE__ */ jsxs("div", { role: "group", "aria-labelledby": `cmd-cat-${cat}`, className: "space-y-1", children: [
2257
- /* @__PURE__ */ jsx(
2258
- "div",
2259
- {
2260
- id: `cmd-cat-${cat}`,
2261
- className: "px-3 py-1 text-[0.65rem] font-bold uppercase tracking-wider text-muted-foreground",
2262
- children: cat
2263
- }
2264
- ),
2265
- itemsInCat.map((item) => {
2266
- const currentIdx = absoluteItemIndex++;
2267
- const isActive = currentIdx === activeIndex;
2268
- return /* @__PURE__ */ jsxs(
2269
- "div",
2270
- {
2271
- id: `cmd-item-${currentIdx}`,
2272
- role: "option",
2273
- "aria-selected": isActive,
2274
- onClick: () => {
2275
- item.action();
2276
- onClose();
2277
- },
2278
- className: cn(
2279
- "flex items-center justify-between gap-3 px-3 py-2.5 rounded-kj-md cursor-pointer select-none transition-colors",
2280
- isActive ? "bg-primary/10 text-foreground" : "text-muted-foreground hover:bg-muted hover:text-foreground"
2281
- ),
2282
- children: [
2283
- /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 min-w-0", children: [
2284
- item.icon && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground [&_svg]:h-[1.1rem] [&_svg]:w-[1.1rem]", children: item.icon }),
2285
- /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex flex-col", children: [
2286
- /* @__PURE__ */ jsx("span", { className: cn("text-[0.85rem] font-semibold", isActive ? "text-primary" : "text-foreground"), children: item.title }),
2287
- item.subtitle && /* @__PURE__ */ jsx("span", { className: "text-[0.75rem] text-muted-foreground truncate", children: item.subtitle })
2288
- ] })
2289
- ] }),
2290
- item.shortcut && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: item.shortcut.map((sc, scIdx) => /* @__PURE__ */ jsx(
2291
- "kbd",
2292
- {
2293
- className: "px-1.5 py-0.5 rounded border border-border bg-subtle text-[10px] font-mono leading-none shadow-kj-xs text-muted-foreground",
2294
- children: sc
2706
+ children: Object.entries(groups).map(([cat, itemsInCat]) => /* @__PURE__ */ jsxs(
2707
+ "div",
2708
+ {
2709
+ role: "group",
2710
+ "aria-labelledby": `cmd-cat-${cat}`,
2711
+ className: "space-y-1",
2712
+ children: [
2713
+ /* @__PURE__ */ jsx(
2714
+ "div",
2715
+ {
2716
+ id: `cmd-cat-${cat}`,
2717
+ className: "px-3 py-1 text-[0.65rem] font-bold uppercase tracking-wider text-muted-foreground",
2718
+ children: cat
2719
+ }
2720
+ ),
2721
+ itemsInCat.map((item) => {
2722
+ const currentIdx = absoluteItemIndex++;
2723
+ const isActive = currentIdx === activeIndex;
2724
+ return /* @__PURE__ */ jsxs(
2725
+ "div",
2726
+ {
2727
+ id: `cmd-item-${currentIdx}`,
2728
+ role: "option",
2729
+ "aria-selected": isActive,
2730
+ onClick: () => {
2731
+ item.action();
2732
+ onClose();
2295
2733
  },
2296
- scIdx
2297
- )) })
2298
- ]
2299
- },
2300
- item.id
2301
- );
2302
- })
2303
- ] }, cat))
2734
+ className: cn(
2735
+ "flex items-center justify-between gap-3 px-3 py-2.5 rounded-kj-md cursor-pointer select-none transition-colors",
2736
+ isActive ? "bg-primary/10 text-foreground" : "text-muted-foreground hover:bg-muted hover:text-foreground"
2737
+ ),
2738
+ children: [
2739
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 min-w-0", children: [
2740
+ item.icon && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground [&_svg]:h-[1.1rem] [&_svg]:w-[1.1rem]", children: item.icon }),
2741
+ /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex flex-col", children: [
2742
+ /* @__PURE__ */ jsx(
2743
+ "span",
2744
+ {
2745
+ className: cn(
2746
+ "text-[0.85rem] font-semibold",
2747
+ isActive ? "text-primary" : "text-foreground"
2748
+ ),
2749
+ children: item.title
2750
+ }
2751
+ ),
2752
+ item.subtitle && /* @__PURE__ */ jsx("span", { className: "text-[0.75rem] text-muted-foreground truncate", children: item.subtitle })
2753
+ ] })
2754
+ ] }),
2755
+ item.shortcut && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: item.shortcut.map((sc, scIdx) => /* @__PURE__ */ jsx(
2756
+ "kbd",
2757
+ {
2758
+ className: "px-1.5 py-0.5 rounded border border-border bg-subtle text-[10px] font-mono leading-none shadow-kj-xs text-muted-foreground",
2759
+ children: sc
2760
+ },
2761
+ scIdx
2762
+ )) })
2763
+ ]
2764
+ },
2765
+ item.id
2766
+ );
2767
+ })
2768
+ ]
2769
+ },
2770
+ cat
2771
+ ))
2304
2772
  }
2305
2773
  ) }),
2306
2774
  /* @__PURE__ */ jsxs("div", { className: "px-4 py-2.5 border-t border-border bg-subtle flex items-center justify-between text-[11px] text-muted-foreground font-medium", children: [
@@ -2311,7 +2779,8 @@ function CommandPalette({ open, onClose, items, placeholder = "Type a command or
2311
2779
  ] }),
2312
2780
  /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1", children: [
2313
2781
  /* @__PURE__ */ jsx("kbd", { className: "font-mono text-[9px] px-1 border rounded bg-surface", children: "Enter" }),
2314
- " Select"
2782
+ " ",
2783
+ "Select"
2315
2784
  ] })
2316
2785
  ] }),
2317
2786
  /* @__PURE__ */ jsxs("div", { children: [
@@ -2333,10 +2802,16 @@ function SidebarNav({ className, groups, currentHref, ...props }) {
2333
2802
  const isActive = item.active || item.href && currentHref && currentHref === item.href;
2334
2803
  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
2335
2804
  /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2.5 min-w-0", children: [
2336
- item.icon && /* @__PURE__ */ jsx("span", { className: cn(
2337
- "[&_svg]:h-[1.1rem] [&_svg]:w-[1.1rem] shrink-0",
2338
- isActive ? "text-primary" : "text-muted-foreground group-hover:text-foreground"
2339
- ), children: item.icon }),
2805
+ item.icon && /* @__PURE__ */ jsx(
2806
+ "span",
2807
+ {
2808
+ className: cn(
2809
+ "[&_svg]:h-[1.1rem] [&_svg]:w-[1.1rem] shrink-0",
2810
+ isActive ? "text-primary" : "text-muted-foreground group-hover:text-foreground"
2811
+ ),
2812
+ children: item.icon
2813
+ }
2814
+ ),
2340
2815
  /* @__PURE__ */ jsx("span", { className: "truncate", children: item.label })
2341
2816
  ] }),
2342
2817
  item.badge && /* @__PURE__ */ jsx("span", { className: "shrink-0 flex items-center justify-center", children: item.badge })
@@ -2348,16 +2823,7 @@ function SidebarNav({ className, groups, currentHref, ...props }) {
2348
2823
  if (item.href) {
2349
2824
  return /* @__PURE__ */ jsx("a", { href: item.href, className: itemClass, children: content }, item.id);
2350
2825
  }
2351
- return /* @__PURE__ */ jsx(
2352
- "button",
2353
- {
2354
- type: "button",
2355
- onClick: item.onClick,
2356
- className: itemClass,
2357
- children: content
2358
- },
2359
- item.id
2360
- );
2826
+ return /* @__PURE__ */ jsx("button", { type: "button", onClick: item.onClick, className: itemClass, children: content }, item.id);
2361
2827
  }) })
2362
2828
  ] }, groupIdx)) });
2363
2829
  }
@@ -2553,7 +3019,20 @@ function BottomSheet({
2553
3019
  onClick: onClose,
2554
3020
  "aria-label": "Close",
2555
3021
  className: "absolute top-4 right-4 p-1.5 rounded-kj-sm text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer z-10",
2556
- children: /* @__PURE__ */ jsx("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) })
3022
+ children: /* @__PURE__ */ jsx(
3023
+ "svg",
3024
+ {
3025
+ width: 16,
3026
+ height: 16,
3027
+ viewBox: "0 0 24 24",
3028
+ fill: "none",
3029
+ stroke: "currentColor",
3030
+ strokeWidth: 2.5,
3031
+ strokeLinecap: "round",
3032
+ strokeLinejoin: "round",
3033
+ children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" })
3034
+ }
3035
+ )
2557
3036
  }
2558
3037
  ),
2559
3038
  children
@@ -2566,19 +3045,49 @@ function BottomSheet({
2566
3045
  function BottomSheetHeader({ className, ...props }) {
2567
3046
  return /* @__PURE__ */ jsx("div", { className: cn("p-6 flex flex-col gap-1.5 border-b border-border", className), ...props });
2568
3047
  }
2569
- function BottomSheetTitle({ className, id, children, ...props }) {
3048
+ function BottomSheetTitle({
3049
+ className,
3050
+ id,
3051
+ children,
3052
+ ...props
3053
+ }) {
2570
3054
  const ctx = React52.useContext(BottomSheetContext);
2571
- return /* @__PURE__ */ jsx("h2", { id: id ?? ctx?.titleId, className: cn("m-0 text-[1.15rem] font-bold tracking-[-0.01em]", className), ...props, children });
3055
+ return /* @__PURE__ */ jsx(
3056
+ "h2",
3057
+ {
3058
+ id: id ?? ctx?.titleId,
3059
+ className: cn("m-0 text-[1.15rem] font-bold tracking-[-0.01em]", className),
3060
+ ...props,
3061
+ children
3062
+ }
3063
+ );
2572
3064
  }
2573
- function BottomSheetDescription({ className, id, ...props }) {
3065
+ function BottomSheetDescription({
3066
+ className,
3067
+ id,
3068
+ ...props
3069
+ }) {
2574
3070
  const ctx = React52.useContext(BottomSheetContext);
2575
- return /* @__PURE__ */ jsx("p", { id: id ?? ctx?.descId, className: cn("m-0 text-[0.9rem] text-muted-foreground", className), ...props });
2576
- }
2577
- function BottomSheetContent({ className, ...props }) {
3071
+ return /* @__PURE__ */ jsx(
3072
+ "p",
3073
+ {
3074
+ id: id ?? ctx?.descId,
3075
+ className: cn("m-0 text-[0.9rem] text-muted-foreground", className),
3076
+ ...props
3077
+ }
3078
+ );
3079
+ }
3080
+ function BottomSheetContent({ className, ...props }) {
2578
3081
  return /* @__PURE__ */ jsx("div", { className: cn("p-6 overflow-y-auto flex-1", className), ...props });
2579
3082
  }
2580
3083
  function BottomSheetFooter({ className, ...props }) {
2581
- return /* @__PURE__ */ jsx("div", { className: cn("p-6 border-t border-border flex gap-2.5 justify-end mt-auto", className), ...props });
3084
+ return /* @__PURE__ */ jsx(
3085
+ "div",
3086
+ {
3087
+ className: cn("p-6 border-t border-border flex gap-2.5 justify-end mt-auto", className),
3088
+ ...props
3089
+ }
3090
+ );
2582
3091
  }
2583
3092
  var kbdVariants = cva(
2584
3093
  "inline-flex items-center justify-center font-mono font-medium text-muted-foreground bg-muted border border-border border-b-2 rounded-kj-sm select-none",
@@ -2657,7 +3166,11 @@ var CodeBlock = React52.forwardRef(
2657
3166
  }
2658
3167
  );
2659
3168
  CodeBlock.displayName = "CodeBlock";
2660
- function Separator({ orientation = "horizontal", decorative = true, className }) {
3169
+ function Separator({
3170
+ orientation = "horizontal",
3171
+ decorative = true,
3172
+ className
3173
+ }) {
2661
3174
  const semanticProps = decorative ? { role: "none", "aria-hidden": true } : { role: "separator", "aria-orientation": orientation };
2662
3175
  return /* @__PURE__ */ jsx(
2663
3176
  "div",
@@ -2975,7 +3488,18 @@ var Combobox = React52.forwardRef(
2975
3488
  removeValue(value);
2976
3489
  },
2977
3490
  className: "rounded-full p-0.5 leading-none hover:bg-primary/20",
2978
- children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-3 w-3", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", children: /* @__PURE__ */ jsx("path", { d: "M6 6l12 12M18 6L6 18" }) })
3491
+ children: /* @__PURE__ */ jsx(
3492
+ "svg",
3493
+ {
3494
+ viewBox: "0 0 24 24",
3495
+ className: "h-3 w-3",
3496
+ fill: "none",
3497
+ stroke: "currentColor",
3498
+ strokeWidth: "2.5",
3499
+ strokeLinecap: "round",
3500
+ children: /* @__PURE__ */ jsx("path", { d: "M6 6l12 12M18 6L6 18" })
3501
+ }
3502
+ )
2979
3503
  }
2980
3504
  )
2981
3505
  ]
@@ -3006,7 +3530,19 @@ var Combobox = React52.forwardRef(
3006
3530
  ),
3007
3531
  name && multiple && selected.map((v) => /* @__PURE__ */ jsx("input", { type: "hidden", name, value: v }, v)),
3008
3532
  name && !multiple && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: selected[0] ?? "" }),
3009
- /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground", children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-4 w-4", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" }) }) })
3533
+ /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground", children: /* @__PURE__ */ jsx(
3534
+ "svg",
3535
+ {
3536
+ viewBox: "0 0 24 24",
3537
+ className: "h-4 w-4",
3538
+ fill: "none",
3539
+ stroke: "currentColor",
3540
+ strokeWidth: "2.5",
3541
+ strokeLinecap: "round",
3542
+ strokeLinejoin: "round",
3543
+ children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" })
3544
+ }
3545
+ ) })
3010
3546
  ]
3011
3547
  }
3012
3548
  ),
@@ -3059,7 +3595,19 @@ var Combobox = React52.forwardRef(
3059
3595
  ),
3060
3596
  children: [
3061
3597
  /* @__PURE__ */ jsx("span", { children: opt.label }),
3062
- isSelected && /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-4 w-4 text-primary shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "m5 12 5 5L20 7" }) })
3598
+ isSelected && /* @__PURE__ */ jsx(
3599
+ "svg",
3600
+ {
3601
+ viewBox: "0 0 24 24",
3602
+ className: "h-4 w-4 text-primary shrink-0",
3603
+ fill: "none",
3604
+ stroke: "currentColor",
3605
+ strokeWidth: "2.5",
3606
+ strokeLinecap: "round",
3607
+ strokeLinejoin: "round",
3608
+ children: /* @__PURE__ */ jsx("path", { d: "m5 12 5 5L20 7" })
3609
+ }
3610
+ )
3063
3611
  ]
3064
3612
  },
3065
3613
  opt.value
@@ -3127,7 +3675,10 @@ function toISODateString(d) {
3127
3675
  const day = String(d.getDate()).padStart(2, "0");
3128
3676
  return `${y}-${m}-${day}`;
3129
3677
  }
3130
- var monthLabelFormat = new Intl.DateTimeFormat(void 0, { month: "long", year: "numeric" });
3678
+ var monthLabelFormat = new Intl.DateTimeFormat(void 0, {
3679
+ month: "long",
3680
+ year: "numeric"
3681
+ });
3131
3682
  var fullDateFormat = new Intl.DateTimeFormat(void 0, { dateStyle: "full" });
3132
3683
  var weekdayShortFormat = new Intl.DateTimeFormat(void 0, { weekday: "short" });
3133
3684
  var weekdayLongFormat = new Intl.DateTimeFormat(void 0, { weekday: "long" });
@@ -3135,146 +3686,421 @@ var weekdayLabels = Array.from({ length: 7 }, (_, i) => {
3135
3686
  const d = addDays(startOfWeek(/* @__PURE__ */ new Date()), i);
3136
3687
  return { key: i, short: weekdayShortFormat.format(d), long: weekdayLongFormat.format(d) };
3137
3688
  });
3138
- var CalendarGrid = React52.forwardRef(function CalendarGrid2({ viewMonth, isDayDisabled, cellState, onSelectDay, onFocusDay, initialFocusDate, className }, ref) {
3139
- const gridDays = React52.useMemo(() => buildGridDays(viewMonth), [viewMonth]);
3689
+ var CalendarGrid = React52.forwardRef(
3690
+ function CalendarGrid2({ viewMonth, isDayDisabled, cellState, onSelectDay, onFocusDay, initialFocusDate, className }, ref) {
3691
+ const gridDays = React52.useMemo(() => buildGridDays(viewMonth), [viewMonth]);
3692
+ const inViewMonth = (d) => d.getMonth() === viewMonth.getMonth() && d.getFullYear() === viewMonth.getFullYear();
3693
+ const [focusedDate, setFocusedDate] = React52.useState(() => startOfDay(initialFocusDate));
3694
+ const pendingFocusRef = React52.useRef(false);
3695
+ const gridRef = React52.useRef(null);
3696
+ const rovingTarget = inViewMonth(focusedDate) && !isDayDisabled(focusedDate) ? focusedDate : gridDays.find((d) => inViewMonth(d) && !isDayDisabled(d)) ?? gridDays.find((d) => inViewMonth(d)) ?? gridDays[0];
3697
+ const moveFocusTo = (next, viaKeyboard) => {
3698
+ pendingFocusRef.current = viaKeyboard;
3699
+ setFocusedDate(next);
3700
+ onFocusDay?.(next);
3701
+ };
3702
+ React52.useEffect(() => {
3703
+ if (!pendingFocusRef.current) return;
3704
+ pendingFocusRef.current = false;
3705
+ const el = gridRef.current?.querySelector(
3706
+ `[data-date="${dateKey(rovingTarget)}"]`
3707
+ );
3708
+ el?.focus();
3709
+ }, [rovingTarget]);
3710
+ const step = (from, delta) => {
3711
+ let next = addDays(from, delta);
3712
+ let guard = 0;
3713
+ while (isDayDisabled(next) && guard < 1e3) {
3714
+ next = addDays(next, delta);
3715
+ guard++;
3716
+ }
3717
+ return isDayDisabled(next) ? from : next;
3718
+ };
3719
+ const selectDay = (d) => {
3720
+ if (isDayDisabled(d)) return;
3721
+ moveFocusTo(d, false);
3722
+ onSelectDay(d);
3723
+ };
3724
+ const onGridKeyDown = (e) => {
3725
+ switch (e.key) {
3726
+ case "ArrowRight":
3727
+ e.preventDefault();
3728
+ moveFocusTo(step(rovingTarget, 1), true);
3729
+ break;
3730
+ case "ArrowLeft":
3731
+ e.preventDefault();
3732
+ moveFocusTo(step(rovingTarget, -1), true);
3733
+ break;
3734
+ case "ArrowDown":
3735
+ e.preventDefault();
3736
+ moveFocusTo(step(rovingTarget, 7), true);
3737
+ break;
3738
+ case "ArrowUp":
3739
+ e.preventDefault();
3740
+ moveFocusTo(step(rovingTarget, -7), true);
3741
+ break;
3742
+ case "Home": {
3743
+ e.preventDefault();
3744
+ const target = startOfWeek(rovingTarget);
3745
+ moveFocusTo(isDayDisabled(target) ? step(target, 1) : target, true);
3746
+ break;
3747
+ }
3748
+ case "End": {
3749
+ e.preventDefault();
3750
+ const target = addDays(startOfWeek(rovingTarget), 6);
3751
+ moveFocusTo(isDayDisabled(target) ? step(target, -1) : target, true);
3752
+ break;
3753
+ }
3754
+ case "PageUp": {
3755
+ e.preventDefault();
3756
+ const target = e.shiftKey ? addYearsClamped(rovingTarget, -1) : addMonthsClamped(rovingTarget, -1);
3757
+ moveFocusTo(isDayDisabled(target) ? step(target, -1) : target, true);
3758
+ break;
3759
+ }
3760
+ case "PageDown": {
3761
+ e.preventDefault();
3762
+ const target = e.shiftKey ? addYearsClamped(rovingTarget, 1) : addMonthsClamped(rovingTarget, 1);
3763
+ moveFocusTo(isDayDisabled(target) ? step(target, 1) : target, true);
3764
+ break;
3765
+ }
3766
+ case "Enter":
3767
+ case " ":
3768
+ e.preventDefault();
3769
+ selectDay(rovingTarget);
3770
+ break;
3771
+ }
3772
+ };
3773
+ return /* @__PURE__ */ jsx("div", { ref, className: cn(className), children: /* @__PURE__ */ jsxs(
3774
+ "div",
3775
+ {
3776
+ ref: gridRef,
3777
+ role: "grid",
3778
+ "aria-label": monthLabelFormat.format(viewMonth),
3779
+ onKeyDown: onGridKeyDown,
3780
+ children: [
3781
+ /* @__PURE__ */ jsx("div", { role: "row", className: "grid grid-cols-7", children: weekdayLabels.map((w) => /* @__PURE__ */ jsx(
3782
+ "div",
3783
+ {
3784
+ role: "columnheader",
3785
+ "aria-label": w.long,
3786
+ className: "h-8 flex items-center justify-center text-xs font-medium text-muted-foreground",
3787
+ children: w.short
3788
+ },
3789
+ w.key
3790
+ )) }),
3791
+ Array.from({ length: 6 }, (_, week) => /* @__PURE__ */ jsx("div", { role: "row", className: "grid grid-cols-7", children: gridDays.slice(week * 7, week * 7 + 7).map((day) => {
3792
+ if (!inViewMonth(day)) {
3793
+ return /* @__PURE__ */ jsx("div", { role: "gridcell", "aria-hidden": "true", className: "h-9" }, dateKey(day));
3794
+ }
3795
+ const disabled = isDayDisabled(day);
3796
+ const state = cellState(day);
3797
+ const isRoving = isSameDay(day, rovingTarget);
3798
+ const isEndpoint = !!(state.selected || state.rangeStart || state.rangeEnd);
3799
+ return /* @__PURE__ */ jsx(
3800
+ "button",
3801
+ {
3802
+ type: "button",
3803
+ role: "gridcell",
3804
+ "data-date": dateKey(day),
3805
+ tabIndex: isRoving ? 0 : -1,
3806
+ "aria-selected": isEndpoint,
3807
+ "aria-disabled": disabled || void 0,
3808
+ "aria-label": fullDateFormat.format(day),
3809
+ onMouseEnter: () => onFocusDay?.(day),
3810
+ onClick: () => selectDay(day),
3811
+ className: cn(
3812
+ "h-9 w-9 mx-auto flex items-center justify-center text-sm",
3813
+ state.inRange && !isEndpoint ? "rounded-none" : "rounded-full",
3814
+ "focus:outline-none focus:ring-[3px] focus:ring-ring/30",
3815
+ disabled && "text-muted-foreground opacity-40 cursor-not-allowed",
3816
+ !disabled && isEndpoint && "bg-primary text-primary-foreground",
3817
+ !disabled && state.inRange && !isEndpoint && "bg-primary/15 text-foreground",
3818
+ !disabled && !isEndpoint && !state.inRange && state.today && "ring-1 ring-primary text-primary font-medium",
3819
+ !disabled && !isEndpoint && !state.inRange && !state.today && "text-foreground hover:bg-muted"
3820
+ ),
3821
+ children: day.getDate()
3822
+ },
3823
+ dateKey(day)
3824
+ );
3825
+ }) }, week))
3826
+ ]
3827
+ }
3828
+ ) });
3829
+ }
3830
+ );
3831
+ CalendarGrid.displayName = "CalendarGrid";
3832
+ var Calendar = React52.forwardRef(function Calendar2({
3833
+ value,
3834
+ defaultValue,
3835
+ onChange,
3836
+ month,
3837
+ defaultMonth,
3838
+ onMonthChange,
3839
+ min,
3840
+ max,
3841
+ disabledDates,
3842
+ className
3843
+ }, ref) {
3844
+ const controlled = value !== void 0;
3845
+ const [internalValue, setInternalValue] = React52.useState(defaultValue);
3846
+ const selected = controlled ? value : internalValue;
3847
+ const monthControlled = month !== void 0;
3848
+ const [internalMonth, setInternalMonth] = React52.useState(
3849
+ () => startOfMonth(month ?? defaultMonth ?? selected ?? /* @__PURE__ */ new Date())
3850
+ );
3851
+ const viewMonth = monthControlled ? startOfMonth(month) : internalMonth;
3852
+ const setViewMonth = (next) => {
3853
+ const normalized = startOfMonth(next);
3854
+ if (!monthControlled) setInternalMonth(normalized);
3855
+ onMonthChange?.(normalized);
3856
+ };
3857
+ const isDayDisabled = React52.useCallback(
3858
+ (d) => {
3859
+ if (min && d < startOfDay(min)) return true;
3860
+ if (max && d > startOfDay(max)) return true;
3861
+ return disabledDates?.(d) ?? false;
3862
+ },
3863
+ [min, max, disabledDates]
3864
+ );
3865
+ const commitValue = (d) => {
3866
+ if (!controlled) setInternalValue(d);
3867
+ onChange?.(d);
3868
+ };
3869
+ const today = /* @__PURE__ */ new Date();
3870
+ const cellState = (d) => ({
3871
+ selected: selected ? isSameDay(d, selected) : false,
3872
+ today: isSameDay(d, today)
3873
+ });
3140
3874
  const inViewMonth = (d) => d.getMonth() === viewMonth.getMonth() && d.getFullYear() === viewMonth.getFullYear();
3141
- const [focusedDate, setFocusedDate] = React52.useState(() => startOfDay(initialFocusDate));
3142
- const pendingFocusRef = React52.useRef(false);
3143
- const gridRef = React52.useRef(null);
3144
- const rovingTarget = inViewMonth(focusedDate) && !isDayDisabled(focusedDate) ? focusedDate : gridDays.find((d) => inViewMonth(d) && !isDayDisabled(d)) ?? gridDays.find((d) => inViewMonth(d)) ?? gridDays[0];
3145
- const moveFocusTo = (next, viaKeyboard) => {
3146
- pendingFocusRef.current = viaKeyboard;
3147
- setFocusedDate(next);
3148
- onFocusDay?.(next);
3875
+ const handleFocusDay = (d) => {
3876
+ if (!inViewMonth(d)) setViewMonth(d);
3877
+ };
3878
+ return /* @__PURE__ */ jsxs("div", { ref, className: cn("w-[280px] select-none", className), children: [
3879
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
3880
+ /* @__PURE__ */ jsx(
3881
+ "button",
3882
+ {
3883
+ type: "button",
3884
+ "aria-label": "Previous month",
3885
+ onClick: () => setViewMonth(addMonths(viewMonth, -1)),
3886
+ className: "p-1.5 rounded-kj-sm text-muted-foreground hover:bg-muted hover:text-foreground",
3887
+ children: /* @__PURE__ */ jsx(
3888
+ "svg",
3889
+ {
3890
+ viewBox: "0 0 24 24",
3891
+ className: "h-4 w-4",
3892
+ fill: "none",
3893
+ stroke: "currentColor",
3894
+ strokeWidth: "2.5",
3895
+ strokeLinecap: "round",
3896
+ strokeLinejoin: "round",
3897
+ children: /* @__PURE__ */ jsx("path", { d: "m15 18-6-6 6-6" })
3898
+ }
3899
+ )
3900
+ }
3901
+ ),
3902
+ /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: monthLabelFormat.format(viewMonth) }),
3903
+ /* @__PURE__ */ jsx(
3904
+ "button",
3905
+ {
3906
+ type: "button",
3907
+ "aria-label": "Next month",
3908
+ onClick: () => setViewMonth(addMonths(viewMonth, 1)),
3909
+ className: "p-1.5 rounded-kj-sm text-muted-foreground hover:bg-muted hover:text-foreground",
3910
+ children: /* @__PURE__ */ jsx(
3911
+ "svg",
3912
+ {
3913
+ viewBox: "0 0 24 24",
3914
+ className: "h-4 w-4",
3915
+ fill: "none",
3916
+ stroke: "currentColor",
3917
+ strokeWidth: "2.5",
3918
+ strokeLinecap: "round",
3919
+ strokeLinejoin: "round",
3920
+ children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" })
3921
+ }
3922
+ )
3923
+ }
3924
+ )
3925
+ ] }),
3926
+ /* @__PURE__ */ jsx(
3927
+ CalendarGrid,
3928
+ {
3929
+ viewMonth,
3930
+ isDayDisabled,
3931
+ cellState,
3932
+ onSelectDay: commitValue,
3933
+ onFocusDay: handleFocusDay,
3934
+ initialFocusDate: selected ?? /* @__PURE__ */ new Date()
3935
+ }
3936
+ )
3937
+ ] });
3938
+ });
3939
+ Calendar.displayName = "Calendar";
3940
+ var displayFormat = new Intl.DateTimeFormat(void 0, { dateStyle: "medium" });
3941
+ var DatePicker = React52.forwardRef(function DatePicker2({
3942
+ value,
3943
+ defaultValue,
3944
+ onChange,
3945
+ min,
3946
+ max,
3947
+ disabledDates,
3948
+ placeholder = "Pick a date\u2026",
3949
+ disabled = false,
3950
+ error = false,
3951
+ required = false,
3952
+ className,
3953
+ id,
3954
+ name,
3955
+ "aria-describedby": describedBy
3956
+ }, ref) {
3957
+ const controlled = value !== void 0;
3958
+ const [internalValue, setInternalValue] = React52.useState(defaultValue);
3959
+ const selected = controlled ? value : internalValue;
3960
+ const [open, setOpen] = React52.useState(false);
3961
+ const containerRef = React52.useRef(null);
3962
+ const triggerRef = React52.useRef(null);
3963
+ const setTriggerRef = (node) => {
3964
+ triggerRef.current = node;
3965
+ if (typeof ref === "function") ref(node);
3966
+ else if (ref) ref.current = node;
3967
+ };
3968
+ const commitValue = (d) => {
3969
+ if (!controlled) setInternalValue(d);
3970
+ onChange?.(d);
3971
+ };
3972
+ const closePopup = React52.useCallback(() => setOpen(false), []);
3973
+ const openPopup = () => {
3974
+ if (!disabled) setOpen(true);
3975
+ };
3976
+ const handleCalendarChange = (d) => {
3977
+ commitValue(d);
3978
+ closePopup();
3979
+ triggerRef.current?.focus();
3149
3980
  };
3150
3981
  React52.useEffect(() => {
3151
- if (!pendingFocusRef.current) return;
3152
- pendingFocusRef.current = false;
3153
- const el = gridRef.current?.querySelector(`[data-date="${dateKey(rovingTarget)}"]`);
3154
- el?.focus();
3155
- }, [rovingTarget]);
3156
- const step = (from, delta) => {
3157
- let next = addDays(from, delta);
3158
- let guard = 0;
3159
- while (isDayDisabled(next) && guard < 1e3) {
3160
- next = addDays(next, delta);
3161
- guard++;
3982
+ if (!open) return;
3983
+ const onDown = (e) => {
3984
+ if (containerRef.current && !containerRef.current.contains(e.target)) closePopup();
3985
+ };
3986
+ document.addEventListener("mousedown", onDown);
3987
+ return () => document.removeEventListener("mousedown", onDown);
3988
+ }, [open, closePopup]);
3989
+ const onTriggerKeyDown = (e) => {
3990
+ if (e.key === "ArrowDown" || e.key === "Enter" || e.key === " ") {
3991
+ e.preventDefault();
3992
+ openPopup();
3993
+ } else if (e.key === "Escape" && open) {
3994
+ e.preventDefault();
3995
+ closePopup();
3162
3996
  }
3163
- return isDayDisabled(next) ? from : next;
3164
3997
  };
3165
- const selectDay = (d) => {
3166
- if (isDayDisabled(d)) return;
3167
- moveFocusTo(d, false);
3168
- onSelectDay(d);
3169
- };
3170
- const onGridKeyDown = (e) => {
3171
- switch (e.key) {
3172
- case "ArrowRight":
3173
- e.preventDefault();
3174
- moveFocusTo(step(rovingTarget, 1), true);
3175
- break;
3176
- case "ArrowLeft":
3177
- e.preventDefault();
3178
- moveFocusTo(step(rovingTarget, -1), true);
3179
- break;
3180
- case "ArrowDown":
3181
- e.preventDefault();
3182
- moveFocusTo(step(rovingTarget, 7), true);
3183
- break;
3184
- case "ArrowUp":
3185
- e.preventDefault();
3186
- moveFocusTo(step(rovingTarget, -7), true);
3187
- break;
3188
- case "Home": {
3189
- e.preventDefault();
3190
- const target = startOfWeek(rovingTarget);
3191
- moveFocusTo(isDayDisabled(target) ? step(target, 1) : target, true);
3192
- break;
3193
- }
3194
- case "End": {
3195
- e.preventDefault();
3196
- const target = addDays(startOfWeek(rovingTarget), 6);
3197
- moveFocusTo(isDayDisabled(target) ? step(target, -1) : target, true);
3198
- break;
3199
- }
3200
- case "PageUp": {
3201
- e.preventDefault();
3202
- const target = e.shiftKey ? addYearsClamped(rovingTarget, -1) : addMonthsClamped(rovingTarget, -1);
3203
- moveFocusTo(isDayDisabled(target) ? step(target, -1) : target, true);
3204
- break;
3205
- }
3206
- case "PageDown": {
3207
- e.preventDefault();
3208
- const target = e.shiftKey ? addYearsClamped(rovingTarget, 1) : addMonthsClamped(rovingTarget, 1);
3209
- moveFocusTo(isDayDisabled(target) ? step(target, 1) : target, true);
3210
- break;
3211
- }
3212
- case "Enter":
3213
- case " ":
3214
- e.preventDefault();
3215
- selectDay(rovingTarget);
3216
- break;
3998
+ const onPanelKeyDown = (e) => {
3999
+ if (e.key === "Escape") {
4000
+ e.preventDefault();
4001
+ closePopup();
4002
+ triggerRef.current?.focus();
3217
4003
  }
3218
4004
  };
3219
- return /* @__PURE__ */ jsx("div", { ref, className: cn(className), children: /* @__PURE__ */ jsxs("div", { ref: gridRef, role: "grid", "aria-label": monthLabelFormat.format(viewMonth), onKeyDown: onGridKeyDown, children: [
3220
- /* @__PURE__ */ jsx("div", { role: "row", className: "grid grid-cols-7", children: weekdayLabels.map((w) => /* @__PURE__ */ jsx(
4005
+ return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: cn("relative inline-block w-full", className), children: [
4006
+ /* @__PURE__ */ jsxs(
4007
+ "button",
4008
+ {
4009
+ ref: setTriggerRef,
4010
+ type: "button",
4011
+ id,
4012
+ disabled,
4013
+ "aria-haspopup": "grid",
4014
+ "aria-expanded": open,
4015
+ "aria-invalid": error || void 0,
4016
+ "aria-required": required || void 0,
4017
+ "aria-describedby": describedBy,
4018
+ onClick: () => open ? closePopup() : openPopup(),
4019
+ onKeyDown: onTriggerKeyDown,
4020
+ className: cn(
4021
+ "w-full flex items-center justify-between gap-2 border rounded-kj-md bg-surface text-left text-sm",
4022
+ "pl-[0.85rem] pr-3 py-[calc(0.6rem*var(--kj-density,1))]",
4023
+ "transition-[border-color,box-shadow] duration-150",
4024
+ "focus:outline-none focus:border-ring focus:ring-[3px] focus:ring-ring/30",
4025
+ disabled && "bg-muted text-muted-foreground cursor-not-allowed",
4026
+ error ? "border-danger" : "border-input",
4027
+ !selected && "text-muted-foreground"
4028
+ ),
4029
+ children: [
4030
+ /* @__PURE__ */ jsx("span", { children: selected ? displayFormat.format(selected) : placeholder }),
4031
+ /* @__PURE__ */ jsxs(
4032
+ "svg",
4033
+ {
4034
+ viewBox: "0 0 24 24",
4035
+ className: "h-4 w-4 text-muted-foreground shrink-0",
4036
+ fill: "none",
4037
+ stroke: "currentColor",
4038
+ strokeWidth: "2",
4039
+ strokeLinecap: "round",
4040
+ strokeLinejoin: "round",
4041
+ children: [
4042
+ /* @__PURE__ */ jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }),
4043
+ /* @__PURE__ */ jsx("path", { d: "M3 10h18M8 2v4M16 2v4" })
4044
+ ]
4045
+ }
4046
+ )
4047
+ ]
4048
+ }
4049
+ ),
4050
+ name && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: selected ? toISODateString(selected) : "" }),
4051
+ open && /* @__PURE__ */ jsx(
3221
4052
  "div",
3222
4053
  {
3223
- role: "columnheader",
3224
- "aria-label": w.long,
3225
- className: "h-8 flex items-center justify-center text-xs font-medium text-muted-foreground",
3226
- children: w.short
3227
- },
3228
- w.key
3229
- )) }),
3230
- Array.from({ length: 6 }, (_, week) => /* @__PURE__ */ jsx("div", { role: "row", className: "grid grid-cols-7", children: gridDays.slice(week * 7, week * 7 + 7).map((day) => {
3231
- if (!inViewMonth(day)) {
3232
- return /* @__PURE__ */ jsx("div", { role: "gridcell", "aria-hidden": "true", className: "h-9" }, dateKey(day));
4054
+ onKeyDown: onPanelKeyDown,
4055
+ className: "absolute z-40 top-[calc(100%+6px)] left-0 bg-surface border border-border rounded-kj-md shadow-kj-lg p-3 animate-[kjpop_.12s_ease]",
4056
+ children: /* @__PURE__ */ jsx(
4057
+ Calendar,
4058
+ {
4059
+ value: selected,
4060
+ onChange: handleCalendarChange,
4061
+ min,
4062
+ max,
4063
+ disabledDates
4064
+ }
4065
+ )
3233
4066
  }
3234
- const disabled = isDayDisabled(day);
3235
- const state = cellState(day);
3236
- const isRoving = isSameDay(day, rovingTarget);
3237
- const isEndpoint = !!(state.selected || state.rangeStart || state.rangeEnd);
3238
- return /* @__PURE__ */ jsx(
3239
- "button",
3240
- {
3241
- type: "button",
3242
- role: "gridcell",
3243
- "data-date": dateKey(day),
3244
- tabIndex: isRoving ? 0 : -1,
3245
- "aria-selected": isEndpoint,
3246
- "aria-disabled": disabled || void 0,
3247
- "aria-label": fullDateFormat.format(day),
3248
- onMouseEnter: () => onFocusDay?.(day),
3249
- onClick: () => selectDay(day),
3250
- className: cn(
3251
- "h-9 w-9 mx-auto flex items-center justify-center text-sm",
3252
- state.inRange && !isEndpoint ? "rounded-none" : "rounded-full",
3253
- "focus:outline-none focus:ring-[3px] focus:ring-ring/30",
3254
- disabled && "text-muted-foreground opacity-40 cursor-not-allowed",
3255
- !disabled && isEndpoint && "bg-primary text-primary-foreground",
3256
- !disabled && state.inRange && !isEndpoint && "bg-primary/15 text-foreground",
3257
- !disabled && !isEndpoint && !state.inRange && state.today && "ring-1 ring-primary text-primary font-medium",
3258
- !disabled && !isEndpoint && !state.inRange && !state.today && "text-foreground hover:bg-muted"
3259
- ),
3260
- children: day.getDate()
3261
- },
3262
- dateKey(day)
3263
- );
3264
- }) }, week))
3265
- ] }) });
4067
+ )
4068
+ ] });
3266
4069
  });
3267
- CalendarGrid.displayName = "CalendarGrid";
3268
- var Calendar = React52.forwardRef(
3269
- function Calendar2({ value, defaultValue, onChange, month, defaultMonth, onMonthChange, min, max, disabledDates, className }, ref) {
4070
+ DatePicker.displayName = "DatePicker";
4071
+ var DatePickerField = React52.forwardRef(
4072
+ function DatePickerField2({ label, hint, error, required, className, ...props }, ref) {
4073
+ return /* @__PURE__ */ jsx(FormField, { label, hint, error, required, className, children: /* @__PURE__ */ jsx(DatePicker, { ref, error: !!error, ...props }) });
4074
+ }
4075
+ );
4076
+ DatePickerField.displayName = "DatePickerField";
4077
+ function isBetweenExclusive(d, lo, hi) {
4078
+ const t = startOfDay(d).getTime();
4079
+ return t > startOfDay(lo).getTime() && t < startOfDay(hi).getTime();
4080
+ }
4081
+ var RangeCalendar = React52.forwardRef(
4082
+ function RangeCalendar2({
4083
+ value,
4084
+ defaultValue,
4085
+ onChange,
4086
+ month,
4087
+ defaultMonth,
4088
+ onMonthChange,
4089
+ min,
4090
+ max,
4091
+ disabledDates,
4092
+ singleMonth,
4093
+ className
4094
+ }, ref) {
3270
4095
  const controlled = value !== void 0;
3271
- const [internalValue, setInternalValue] = React52.useState(defaultValue);
3272
- const selected = controlled ? value : internalValue;
4096
+ const [internalValue, setInternalValue] = React52.useState(defaultValue ?? {});
4097
+ const range2 = controlled ? value : internalValue;
3273
4098
  const monthControlled = month !== void 0;
3274
4099
  const [internalMonth, setInternalMonth] = React52.useState(
3275
- () => startOfMonth(month ?? defaultMonth ?? selected ?? /* @__PURE__ */ new Date())
4100
+ () => startOfMonth(month ?? defaultMonth ?? range2.start ?? /* @__PURE__ */ new Date())
3276
4101
  );
3277
- const viewMonth = monthControlled ? startOfMonth(month) : internalMonth;
4102
+ const leftMonth = monthControlled ? startOfMonth(month) : internalMonth;
4103
+ const rightMonth = addMonths(leftMonth, 1);
3278
4104
  const setViewMonth = (next) => {
3279
4105
  const normalized = startOfMonth(next);
3280
4106
  if (!monthControlled) setInternalMonth(normalized);
@@ -3288,221 +4114,11 @@ var Calendar = React52.forwardRef(
3288
4114
  },
3289
4115
  [min, max, disabledDates]
3290
4116
  );
3291
- const commitValue = (d) => {
3292
- if (!controlled) setInternalValue(d);
3293
- onChange?.(d);
3294
- };
3295
- const today = /* @__PURE__ */ new Date();
3296
- const cellState = (d) => ({
3297
- selected: selected ? isSameDay(d, selected) : false,
3298
- today: isSameDay(d, today)
3299
- });
3300
- const inViewMonth = (d) => d.getMonth() === viewMonth.getMonth() && d.getFullYear() === viewMonth.getFullYear();
3301
- const handleFocusDay = (d) => {
3302
- if (!inViewMonth(d)) setViewMonth(d);
3303
- };
3304
- return /* @__PURE__ */ jsxs("div", { ref, className: cn("w-[280px] select-none", className), children: [
3305
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
3306
- /* @__PURE__ */ jsx(
3307
- "button",
3308
- {
3309
- type: "button",
3310
- "aria-label": "Previous month",
3311
- onClick: () => setViewMonth(addMonths(viewMonth, -1)),
3312
- className: "p-1.5 rounded-kj-sm text-muted-foreground hover:bg-muted hover:text-foreground",
3313
- children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-4 w-4", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "m15 18-6-6 6-6" }) })
3314
- }
3315
- ),
3316
- /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: monthLabelFormat.format(viewMonth) }),
3317
- /* @__PURE__ */ jsx(
3318
- "button",
3319
- {
3320
- type: "button",
3321
- "aria-label": "Next month",
3322
- onClick: () => setViewMonth(addMonths(viewMonth, 1)),
3323
- className: "p-1.5 rounded-kj-sm text-muted-foreground hover:bg-muted hover:text-foreground",
3324
- children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-4 w-4", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" }) })
3325
- }
3326
- )
3327
- ] }),
3328
- /* @__PURE__ */ jsx(
3329
- CalendarGrid,
3330
- {
3331
- viewMonth,
3332
- isDayDisabled,
3333
- cellState,
3334
- onSelectDay: commitValue,
3335
- onFocusDay: handleFocusDay,
3336
- initialFocusDate: selected ?? /* @__PURE__ */ new Date()
3337
- }
3338
- )
3339
- ] });
3340
- }
3341
- );
3342
- Calendar.displayName = "Calendar";
3343
- var displayFormat = new Intl.DateTimeFormat(void 0, { dateStyle: "medium" });
3344
- var DatePicker = React52.forwardRef(
3345
- function DatePicker2({
3346
- value,
3347
- defaultValue,
3348
- onChange,
3349
- min,
3350
- max,
3351
- disabledDates,
3352
- placeholder = "Pick a date\u2026",
3353
- disabled = false,
3354
- error = false,
3355
- required = false,
3356
- className,
3357
- id,
3358
- name,
3359
- "aria-describedby": describedBy
3360
- }, ref) {
3361
- const controlled = value !== void 0;
3362
- const [internalValue, setInternalValue] = React52.useState(defaultValue);
3363
- const selected = controlled ? value : internalValue;
3364
- const [open, setOpen] = React52.useState(false);
3365
- const containerRef = React52.useRef(null);
3366
- const triggerRef = React52.useRef(null);
3367
- const setTriggerRef = (node) => {
3368
- triggerRef.current = node;
3369
- if (typeof ref === "function") ref(node);
3370
- else if (ref) ref.current = node;
3371
- };
3372
- const commitValue = (d) => {
3373
- if (!controlled) setInternalValue(d);
3374
- onChange?.(d);
3375
- };
3376
- const closePopup = React52.useCallback(() => setOpen(false), []);
3377
- const openPopup = () => {
3378
- if (!disabled) setOpen(true);
3379
- };
3380
- const handleCalendarChange = (d) => {
3381
- commitValue(d);
3382
- closePopup();
3383
- triggerRef.current?.focus();
3384
- };
3385
- React52.useEffect(() => {
3386
- if (!open) return;
3387
- const onDown = (e) => {
3388
- if (containerRef.current && !containerRef.current.contains(e.target)) closePopup();
3389
- };
3390
- document.addEventListener("mousedown", onDown);
3391
- return () => document.removeEventListener("mousedown", onDown);
3392
- }, [open, closePopup]);
3393
- const onTriggerKeyDown = (e) => {
3394
- if (e.key === "ArrowDown" || e.key === "Enter" || e.key === " ") {
3395
- e.preventDefault();
3396
- openPopup();
3397
- } else if (e.key === "Escape" && open) {
3398
- e.preventDefault();
3399
- closePopup();
3400
- }
3401
- };
3402
- const onPanelKeyDown = (e) => {
3403
- if (e.key === "Escape") {
3404
- e.preventDefault();
3405
- closePopup();
3406
- triggerRef.current?.focus();
3407
- }
3408
- };
3409
- return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: cn("relative inline-block w-full", className), children: [
3410
- /* @__PURE__ */ jsxs(
3411
- "button",
3412
- {
3413
- ref: setTriggerRef,
3414
- type: "button",
3415
- id,
3416
- disabled,
3417
- "aria-haspopup": "grid",
3418
- "aria-expanded": open,
3419
- "aria-invalid": error || void 0,
3420
- "aria-required": required || void 0,
3421
- "aria-describedby": describedBy,
3422
- onClick: () => open ? closePopup() : openPopup(),
3423
- onKeyDown: onTriggerKeyDown,
3424
- className: cn(
3425
- "w-full flex items-center justify-between gap-2 border rounded-kj-md bg-surface text-left text-sm",
3426
- "pl-[0.85rem] pr-3 py-[calc(0.6rem*var(--kj-density,1))]",
3427
- "transition-[border-color,box-shadow] duration-150",
3428
- "focus:outline-none focus:border-ring focus:ring-[3px] focus:ring-ring/30",
3429
- disabled && "bg-muted text-muted-foreground cursor-not-allowed",
3430
- error ? "border-danger" : "border-input",
3431
- !selected && "text-muted-foreground"
3432
- ),
3433
- children: [
3434
- /* @__PURE__ */ jsx("span", { children: selected ? displayFormat.format(selected) : placeholder }),
3435
- /* @__PURE__ */ jsxs(
3436
- "svg",
3437
- {
3438
- viewBox: "0 0 24 24",
3439
- className: "h-4 w-4 text-muted-foreground shrink-0",
3440
- fill: "none",
3441
- stroke: "currentColor",
3442
- strokeWidth: "2",
3443
- strokeLinecap: "round",
3444
- strokeLinejoin: "round",
3445
- children: [
3446
- /* @__PURE__ */ jsx("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }),
3447
- /* @__PURE__ */ jsx("path", { d: "M3 10h18M8 2v4M16 2v4" })
3448
- ]
3449
- }
3450
- )
3451
- ]
3452
- }
3453
- ),
3454
- name && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: selected ? toISODateString(selected) : "" }),
3455
- open && /* @__PURE__ */ jsx(
3456
- "div",
3457
- {
3458
- onKeyDown: onPanelKeyDown,
3459
- className: "absolute z-40 top-[calc(100%+6px)] left-0 bg-surface border border-border rounded-kj-md shadow-kj-lg p-3 animate-[kjpop_.12s_ease]",
3460
- children: /* @__PURE__ */ jsx(Calendar, { value: selected, onChange: handleCalendarChange, min, max, disabledDates })
3461
- }
3462
- )
3463
- ] });
3464
- }
3465
- );
3466
- DatePicker.displayName = "DatePicker";
3467
- var DatePickerField = React52.forwardRef(
3468
- function DatePickerField2({ label, hint, error, required, className, ...props }, ref) {
3469
- return /* @__PURE__ */ jsx(FormField, { label, hint, error, required, className, children: /* @__PURE__ */ jsx(DatePicker, { ref, error: !!error, ...props }) });
3470
- }
3471
- );
3472
- DatePickerField.displayName = "DatePickerField";
3473
- function isBetweenExclusive(d, lo, hi) {
3474
- const t = startOfDay(d).getTime();
3475
- return t > startOfDay(lo).getTime() && t < startOfDay(hi).getTime();
3476
- }
3477
- var RangeCalendar = React52.forwardRef(
3478
- function RangeCalendar2({ value, defaultValue, onChange, month, defaultMonth, onMonthChange, min, max, disabledDates, singleMonth, className }, ref) {
3479
- const controlled = value !== void 0;
3480
- const [internalValue, setInternalValue] = React52.useState(defaultValue ?? {});
3481
- const range2 = controlled ? value : internalValue;
3482
- const monthControlled = month !== void 0;
3483
- const [internalMonth, setInternalMonth] = React52.useState(
3484
- () => startOfMonth(month ?? defaultMonth ?? range2.start ?? /* @__PURE__ */ new Date())
3485
- );
3486
- const leftMonth = monthControlled ? startOfMonth(month) : internalMonth;
3487
- const rightMonth = addMonths(leftMonth, 1);
3488
- const setViewMonth = (next) => {
3489
- const normalized = startOfMonth(next);
3490
- if (!monthControlled) setInternalMonth(normalized);
3491
- onMonthChange?.(normalized);
3492
- };
3493
- const isDayDisabled = React52.useCallback(
3494
- (d) => {
3495
- if (min && d < startOfDay(min)) return true;
3496
- if (max && d > startOfDay(max)) return true;
3497
- return disabledDates?.(d) ?? false;
3498
- },
3499
- [min, max, disabledDates]
3500
- );
3501
- const [pendingStart, setPendingStart] = React52.useState(void 0);
3502
- const [hoverDate, setHoverDate] = React52.useState(void 0);
3503
- const commitRange = (next) => {
3504
- if (!controlled) setInternalValue(next);
3505
- onChange?.(next);
4117
+ const [pendingStart, setPendingStart] = React52.useState(void 0);
4118
+ const [hoverDate, setHoverDate] = React52.useState(void 0);
4119
+ const commitRange = (next) => {
4120
+ if (!controlled) setInternalValue(next);
4121
+ onChange?.(next);
3506
4122
  };
3507
4123
  const handleSelectDay = (d) => {
3508
4124
  const day = startOfDay(d);
@@ -3560,48 +4176,70 @@ var RangeCalendar = React52.forwardRef(
3560
4176
  "aria-label": direction === "prev" ? "Previous month" : "Next month",
3561
4177
  onClick: () => setViewMonth(addMonths(leftMonth, direction === "prev" ? -1 : 1)),
3562
4178
  className: "p-1.5 rounded-kj-sm text-muted-foreground hover:bg-muted hover:text-foreground",
3563
- children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-4 w-4", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: direction === "prev" ? /* @__PURE__ */ jsx("path", { d: "m15 18-6-6 6-6" }) : /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" }) })
3564
- }
3565
- );
3566
- const showSingleMonth = singleMonth;
3567
- return /* @__PURE__ */ jsxs("div", { ref, className: cn("flex flex-col sm:flex-row gap-4 sm:gap-6 select-none max-w-full overflow-hidden", className), children: [
3568
- /* @__PURE__ */ jsxs("div", { className: "w-full sm:w-[280px]", children: [
3569
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
3570
- navButton("prev"),
3571
- /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: monthLabelFormat.format(leftMonth) }),
3572
- /* @__PURE__ */ jsx("span", { className: showSingleMonth ? "" : "sm:hidden", children: navButton("next") })
3573
- ] }),
3574
- /* @__PURE__ */ jsx(
3575
- CalendarGrid,
3576
- {
3577
- viewMonth: leftMonth,
3578
- isDayDisabled,
3579
- cellState,
3580
- onSelectDay: handleSelectDay,
3581
- onFocusDay: handleFocusDay,
3582
- initialFocusDate: pendingStart ?? range2.start ?? /* @__PURE__ */ new Date()
3583
- }
3584
- )
3585
- ] }),
3586
- !showSingleMonth && /* @__PURE__ */ jsxs("div", { className: "hidden sm:block w-[280px]", children: [
3587
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
3588
- /* @__PURE__ */ jsx("span", { className: "w-[26px]", "aria-hidden": "true" }),
3589
- /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: monthLabelFormat.format(rightMonth) }),
3590
- navButton("next")
3591
- ] }),
3592
- /* @__PURE__ */ jsx(
3593
- CalendarGrid,
4179
+ children: /* @__PURE__ */ jsx(
4180
+ "svg",
3594
4181
  {
3595
- viewMonth: rightMonth,
3596
- isDayDisabled,
3597
- cellState,
3598
- onSelectDay: handleSelectDay,
3599
- onFocusDay: handleFocusDay,
3600
- initialFocusDate: pendingStart ?? range2.start ?? /* @__PURE__ */ new Date()
4182
+ viewBox: "0 0 24 24",
4183
+ className: "h-4 w-4",
4184
+ fill: "none",
4185
+ stroke: "currentColor",
4186
+ strokeWidth: "2.5",
4187
+ strokeLinecap: "round",
4188
+ strokeLinejoin: "round",
4189
+ children: direction === "prev" ? /* @__PURE__ */ jsx("path", { d: "m15 18-6-6 6-6" }) : /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" })
3601
4190
  }
3602
4191
  )
3603
- ] })
3604
- ] });
4192
+ }
4193
+ );
4194
+ const showSingleMonth = singleMonth;
4195
+ return /* @__PURE__ */ jsxs(
4196
+ "div",
4197
+ {
4198
+ ref,
4199
+ className: cn(
4200
+ "flex flex-col sm:flex-row gap-4 sm:gap-6 select-none max-w-full overflow-hidden",
4201
+ className
4202
+ ),
4203
+ children: [
4204
+ /* @__PURE__ */ jsxs("div", { className: "w-full sm:w-[280px]", children: [
4205
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
4206
+ navButton("prev"),
4207
+ /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: monthLabelFormat.format(leftMonth) }),
4208
+ /* @__PURE__ */ jsx("span", { className: showSingleMonth ? "" : "sm:hidden", children: navButton("next") })
4209
+ ] }),
4210
+ /* @__PURE__ */ jsx(
4211
+ CalendarGrid,
4212
+ {
4213
+ viewMonth: leftMonth,
4214
+ isDayDisabled,
4215
+ cellState,
4216
+ onSelectDay: handleSelectDay,
4217
+ onFocusDay: handleFocusDay,
4218
+ initialFocusDate: pendingStart ?? range2.start ?? /* @__PURE__ */ new Date()
4219
+ }
4220
+ )
4221
+ ] }),
4222
+ !showSingleMonth && /* @__PURE__ */ jsxs("div", { className: "hidden sm:block w-[280px]", children: [
4223
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
4224
+ /* @__PURE__ */ jsx("span", { className: "w-[26px]", "aria-hidden": "true" }),
4225
+ /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-foreground", children: monthLabelFormat.format(rightMonth) }),
4226
+ navButton("next")
4227
+ ] }),
4228
+ /* @__PURE__ */ jsx(
4229
+ CalendarGrid,
4230
+ {
4231
+ viewMonth: rightMonth,
4232
+ isDayDisabled,
4233
+ cellState,
4234
+ onSelectDay: handleSelectDay,
4235
+ onFocusDay: handleFocusDay,
4236
+ initialFocusDate: pendingStart ?? range2.start ?? /* @__PURE__ */ new Date()
4237
+ }
4238
+ )
4239
+ ] })
4240
+ ]
4241
+ }
4242
+ );
3605
4243
  }
3606
4244
  );
3607
4245
  RangeCalendar.displayName = "RangeCalendar";
@@ -3723,15 +4361,38 @@ var DateRangePicker = React52.forwardRef(
3723
4361
  }
3724
4362
  ),
3725
4363
  name && /* @__PURE__ */ jsxs(Fragment, { children: [
3726
- /* @__PURE__ */ jsx("input", { type: "hidden", name: `${name}Start`, value: selected.start ? toISODateString(selected.start) : "" }),
3727
- /* @__PURE__ */ jsx("input", { type: "hidden", name: `${name}End`, value: selected.end ? toISODateString(selected.end) : "" })
4364
+ /* @__PURE__ */ jsx(
4365
+ "input",
4366
+ {
4367
+ type: "hidden",
4368
+ name: `${name}Start`,
4369
+ value: selected.start ? toISODateString(selected.start) : ""
4370
+ }
4371
+ ),
4372
+ /* @__PURE__ */ jsx(
4373
+ "input",
4374
+ {
4375
+ type: "hidden",
4376
+ name: `${name}End`,
4377
+ value: selected.end ? toISODateString(selected.end) : ""
4378
+ }
4379
+ )
3728
4380
  ] }),
3729
4381
  open && /* @__PURE__ */ jsx(
3730
4382
  "div",
3731
4383
  {
3732
4384
  onKeyDown: onPanelKeyDown,
3733
4385
  className: "absolute z-40 top-[calc(100%+6px)] left-0 sm:left-auto right-0 sm:right-auto max-w-[calc(100vw-2rem)] bg-surface border border-border rounded-kj-md shadow-kj-lg p-3 animate-[kjpop_.12s_ease]",
3734
- children: /* @__PURE__ */ jsx(RangeCalendar, { value: selected, onChange: handleRangeChange, min, max, disabledDates })
4386
+ children: /* @__PURE__ */ jsx(
4387
+ RangeCalendar,
4388
+ {
4389
+ value: selected,
4390
+ onChange: handleRangeChange,
4391
+ min,
4392
+ max,
4393
+ disabledDates
4394
+ }
4395
+ )
3735
4396
  }
3736
4397
  )
3737
4398
  ] });
@@ -3744,108 +4405,118 @@ var DateRangePickerField = React52.forwardRef(
3744
4405
  }
3745
4406
  );
3746
4407
  DateRangePickerField.displayName = "DateRangePickerField";
3747
- var Dropzone = React52.forwardRef(
3748
- function Dropzone2({
3749
- onFiles,
3750
- accept,
3751
- multiple = true,
3752
- disabled = false,
3753
- className,
3754
- children,
3755
- id,
3756
- "aria-describedby": describedBy,
3757
- "aria-invalid": ariaInvalid,
3758
- "aria-required": ariaRequired
3759
- }, ref) {
3760
- const inputRef = React52.useRef(null);
3761
- const [dragActive, setDragActive] = React52.useState(false);
3762
- const dragCounter = React52.useRef(0);
3763
- const invalid = ariaInvalid === true || ariaInvalid === "true";
3764
- const openPicker = () => {
3765
- if (!disabled) inputRef.current?.click();
3766
- };
3767
- const handleInputChange = (e) => {
3768
- const files = e.target.files ? Array.from(e.target.files) : [];
3769
- if (files.length > 0) onFiles(files);
3770
- e.target.value = "";
3771
- };
3772
- const handleDragEnter = (e) => {
3773
- e.preventDefault();
3774
- if (disabled) return;
3775
- dragCounter.current += 1;
3776
- setDragActive(true);
3777
- };
3778
- const handleDragOver = (e) => {
3779
- e.preventDefault();
3780
- };
3781
- const handleDragLeave = (e) => {
3782
- e.preventDefault();
3783
- if (disabled) return;
3784
- dragCounter.current -= 1;
3785
- if (dragCounter.current <= 0) {
3786
- dragCounter.current = 0;
3787
- setDragActive(false);
3788
- }
3789
- };
3790
- const handleDrop = (e) => {
3791
- e.preventDefault();
4408
+ var Dropzone = React52.forwardRef(function Dropzone2({
4409
+ onFiles,
4410
+ accept,
4411
+ multiple = true,
4412
+ disabled = false,
4413
+ className,
4414
+ children,
4415
+ id,
4416
+ "aria-describedby": describedBy,
4417
+ "aria-invalid": ariaInvalid,
4418
+ "aria-required": ariaRequired
4419
+ }, ref) {
4420
+ const inputRef = React52.useRef(null);
4421
+ const [dragActive, setDragActive] = React52.useState(false);
4422
+ const dragCounter = React52.useRef(0);
4423
+ const invalid = ariaInvalid === true || ariaInvalid === "true";
4424
+ const openPicker = () => {
4425
+ if (!disabled) inputRef.current?.click();
4426
+ };
4427
+ const handleInputChange = (e) => {
4428
+ const files = e.target.files ? Array.from(e.target.files) : [];
4429
+ if (files.length > 0) onFiles(files);
4430
+ e.target.value = "";
4431
+ };
4432
+ const handleDragEnter = (e) => {
4433
+ e.preventDefault();
4434
+ if (disabled) return;
4435
+ dragCounter.current += 1;
4436
+ setDragActive(true);
4437
+ };
4438
+ const handleDragOver = (e) => {
4439
+ e.preventDefault();
4440
+ };
4441
+ const handleDragLeave = (e) => {
4442
+ e.preventDefault();
4443
+ if (disabled) return;
4444
+ dragCounter.current -= 1;
4445
+ if (dragCounter.current <= 0) {
3792
4446
  dragCounter.current = 0;
3793
4447
  setDragActive(false);
3794
- if (disabled) return;
3795
- const files = e.dataTransfer?.files ? Array.from(e.dataTransfer.files) : [];
3796
- if (files.length > 0) onFiles(files);
3797
- };
3798
- return /* @__PURE__ */ jsxs("div", { className: cn("w-full", className), children: [
3799
- /* @__PURE__ */ jsx(
3800
- "button",
3801
- {
3802
- ref,
3803
- type: "button",
3804
- id,
3805
- disabled,
3806
- "aria-describedby": describedBy,
3807
- "aria-invalid": ariaInvalid,
3808
- "aria-required": ariaRequired,
3809
- "data-drag-active": dragActive || void 0,
3810
- onClick: openPicker,
3811
- onDragEnter: handleDragEnter,
3812
- onDragOver: handleDragOver,
3813
- onDragLeave: handleDragLeave,
3814
- onDrop: handleDrop,
3815
- className: cn(
3816
- "w-full flex flex-col items-center justify-center gap-2 rounded-kj-md border-2 border-dashed px-6 py-8 text-center text-sm transition-colors",
3817
- "focus:outline-none focus:ring-[3px] focus:ring-ring/30",
3818
- disabled ? "border-input bg-muted text-muted-foreground cursor-not-allowed" : dragActive ? "border-primary bg-primary/5 text-foreground cursor-pointer" : invalid ? "border-danger bg-surface text-muted-foreground hover:text-foreground cursor-pointer" : "border-input bg-surface text-muted-foreground hover:border-primary hover:text-foreground cursor-pointer"
4448
+ }
4449
+ };
4450
+ const handleDrop = (e) => {
4451
+ e.preventDefault();
4452
+ dragCounter.current = 0;
4453
+ setDragActive(false);
4454
+ if (disabled) return;
4455
+ const files = e.dataTransfer?.files ? Array.from(e.dataTransfer.files) : [];
4456
+ if (files.length > 0) onFiles(files);
4457
+ };
4458
+ return /* @__PURE__ */ jsxs("div", { className: cn("w-full", className), children: [
4459
+ /* @__PURE__ */ jsx(
4460
+ "button",
4461
+ {
4462
+ ref,
4463
+ type: "button",
4464
+ id,
4465
+ disabled,
4466
+ "aria-describedby": describedBy,
4467
+ "aria-invalid": ariaInvalid,
4468
+ "aria-required": ariaRequired,
4469
+ "data-drag-active": dragActive || void 0,
4470
+ onClick: openPicker,
4471
+ onDragEnter: handleDragEnter,
4472
+ onDragOver: handleDragOver,
4473
+ onDragLeave: handleDragLeave,
4474
+ onDrop: handleDrop,
4475
+ className: cn(
4476
+ "w-full flex flex-col items-center justify-center gap-2 rounded-kj-md border-2 border-dashed px-6 py-8 text-center text-sm transition-colors",
4477
+ "focus:outline-none focus:ring-[3px] focus:ring-ring/30",
4478
+ disabled ? "border-input bg-muted text-muted-foreground cursor-not-allowed" : dragActive ? "border-primary bg-primary/5 text-foreground cursor-pointer" : invalid ? "border-danger bg-surface text-muted-foreground hover:text-foreground cursor-pointer" : "border-input bg-surface text-muted-foreground hover:border-primary hover:text-foreground cursor-pointer"
4479
+ ),
4480
+ children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
4481
+ /* @__PURE__ */ jsxs(
4482
+ "svg",
4483
+ {
4484
+ viewBox: "0 0 24 24",
4485
+ className: "h-7 w-7",
4486
+ fill: "none",
4487
+ stroke: "currentColor",
4488
+ strokeWidth: "1.5",
4489
+ strokeLinecap: "round",
4490
+ strokeLinejoin: "round",
4491
+ children: [
4492
+ /* @__PURE__ */ jsx("path", { d: "M12 16V4M7 9l5-5 5 5" }),
4493
+ /* @__PURE__ */ jsx("path", { d: "M20 16v3a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-3" })
4494
+ ]
4495
+ }
3819
4496
  ),
3820
- children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
3821
- /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", className: "h-7 w-7", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
3822
- /* @__PURE__ */ jsx("path", { d: "M12 16V4M7 9l5-5 5 5" }),
3823
- /* @__PURE__ */ jsx("path", { d: "M20 16v3a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-3" })
3824
- ] }),
3825
- /* @__PURE__ */ jsxs("span", { children: [
3826
- /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: "Drag and drop files here" }),
3827
- ", or click to browse"
3828
- ] })
4497
+ /* @__PURE__ */ jsxs("span", { children: [
4498
+ /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: "Drag and drop files here" }),
4499
+ ", or click to browse"
3829
4500
  ] })
3830
- }
3831
- ),
3832
- /* @__PURE__ */ jsx(
3833
- "input",
3834
- {
3835
- ref: inputRef,
3836
- type: "file",
3837
- accept,
3838
- multiple,
3839
- disabled,
3840
- onChange: handleInputChange,
3841
- className: "sr-only",
3842
- tabIndex: -1,
3843
- "aria-hidden": "true"
3844
- }
3845
- )
3846
- ] });
3847
- }
3848
- );
4501
+ ] })
4502
+ }
4503
+ ),
4504
+ /* @__PURE__ */ jsx(
4505
+ "input",
4506
+ {
4507
+ ref: inputRef,
4508
+ type: "file",
4509
+ accept,
4510
+ multiple,
4511
+ disabled,
4512
+ onChange: handleInputChange,
4513
+ className: "sr-only",
4514
+ tabIndex: -1,
4515
+ "aria-hidden": "true"
4516
+ }
4517
+ )
4518
+ ] });
4519
+ });
3849
4520
  Dropzone.displayName = "Dropzone";
3850
4521
 
3851
4522
  // src/components/file-upload-internals.ts
@@ -3910,108 +4581,130 @@ function validateFiles(files, { accept, maxSize, maxFiles, existingCount = 0, mu
3910
4581
  return { accepted, rejected };
3911
4582
  }
3912
4583
  function FileIcon({ className }) {
3913
- return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", className, fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
3914
- /* @__PURE__ */ jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
3915
- /* @__PURE__ */ jsx("path", { d: "M14 2v6h6" })
3916
- ] });
3917
- }
3918
- var FileUpload = React52.forwardRef(
3919
- function FileUpload2({
3920
- value,
3921
- defaultValue,
3922
- onChange,
3923
- onReject,
3924
- accept,
3925
- maxSize,
3926
- maxFiles,
3927
- multiple = true,
3928
- disabled = false,
3929
- error = false,
3930
- required = false,
3931
- className,
3932
- id,
3933
- "aria-describedby": describedBy
3934
- }, ref) {
3935
- const controlled = value !== void 0;
3936
- const [internalItems, setInternalItems] = React52.useState(defaultValue ?? []);
3937
- const items = controlled ? value : internalItems;
3938
- const commit = (next) => {
3939
- if (!controlled) setInternalItems(next);
3940
- onChange?.(next);
3941
- };
3942
- const handleFiles = (files) => {
3943
- const { accepted, rejected } = validateFiles(files, {
4584
+ return /* @__PURE__ */ jsxs(
4585
+ "svg",
4586
+ {
4587
+ viewBox: "0 0 24 24",
4588
+ className,
4589
+ fill: "none",
4590
+ stroke: "currentColor",
4591
+ strokeWidth: "1.5",
4592
+ strokeLinecap: "round",
4593
+ strokeLinejoin: "round",
4594
+ children: [
4595
+ /* @__PURE__ */ jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
4596
+ /* @__PURE__ */ jsx("path", { d: "M14 2v6h6" })
4597
+ ]
4598
+ }
4599
+ );
4600
+ }
4601
+ var FileUpload = React52.forwardRef(function FileUpload2({
4602
+ value,
4603
+ defaultValue,
4604
+ onChange,
4605
+ onReject,
4606
+ accept,
4607
+ maxSize,
4608
+ maxFiles,
4609
+ multiple = true,
4610
+ disabled = false,
4611
+ error = false,
4612
+ required = false,
4613
+ className,
4614
+ id,
4615
+ "aria-describedby": describedBy
4616
+ }, ref) {
4617
+ const controlled = value !== void 0;
4618
+ const [internalItems, setInternalItems] = React52.useState(defaultValue ?? []);
4619
+ const items = controlled ? value : internalItems;
4620
+ const commit = (next) => {
4621
+ if (!controlled) setInternalItems(next);
4622
+ onChange?.(next);
4623
+ };
4624
+ const handleFiles = (files) => {
4625
+ const { accepted, rejected } = validateFiles(files, {
4626
+ accept,
4627
+ maxSize,
4628
+ maxFiles,
4629
+ existingCount: items.length,
4630
+ multiple
4631
+ });
4632
+ if (rejected.length > 0) onReject?.(rejected);
4633
+ if (accepted.length === 0) return;
4634
+ const newItems = accepted.map((file) => ({
4635
+ id: generateId(),
4636
+ file,
4637
+ status: "pending"
4638
+ }));
4639
+ commit(multiple ? [...items, ...newItems] : newItems.slice(0, 1));
4640
+ };
4641
+ const removeItem = (itemId) => {
4642
+ commit(items.filter((it) => it.id !== itemId));
4643
+ };
4644
+ return /* @__PURE__ */ jsxs("div", { className: cn("w-full flex flex-col gap-3", className), children: [
4645
+ /* @__PURE__ */ jsx(
4646
+ Dropzone,
4647
+ {
4648
+ ref,
4649
+ onFiles: handleFiles,
3944
4650
  accept,
3945
- maxSize,
3946
- maxFiles,
3947
- existingCount: items.length,
3948
- multiple
3949
- });
3950
- if (rejected.length > 0) onReject?.(rejected);
3951
- if (accepted.length === 0) return;
3952
- const newItems = accepted.map((file) => ({
3953
- id: generateId(),
3954
- file,
3955
- status: "pending"
3956
- }));
3957
- commit(multiple ? [...items, ...newItems] : newItems.slice(0, 1));
3958
- };
3959
- const removeItem = (itemId) => {
3960
- commit(items.filter((it) => it.id !== itemId));
3961
- };
3962
- return /* @__PURE__ */ jsxs("div", { className: cn("w-full flex flex-col gap-3", className), children: [
3963
- /* @__PURE__ */ jsx(
3964
- Dropzone,
3965
- {
3966
- ref,
3967
- onFiles: handleFiles,
3968
- accept,
3969
- multiple,
3970
- disabled,
3971
- id,
3972
- "aria-describedby": describedBy,
3973
- "aria-invalid": error || void 0,
3974
- "aria-required": required || void 0
3975
- }
3976
- ),
3977
- items.length > 0 && /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-2", children: items.map((item) => /* @__PURE__ */ jsxs(
3978
- "li",
3979
- {
3980
- className: "flex items-center gap-3 rounded-kj-md border border-border bg-surface px-3 py-2",
3981
- children: [
3982
- /* @__PURE__ */ jsx(FileIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" }),
3983
- /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
3984
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
3985
- /* @__PURE__ */ jsx("span", { className: "truncate text-sm text-foreground", children: item.file.name }),
3986
- /* @__PURE__ */ jsx("span", { className: "shrink-0 text-xs text-muted-foreground", children: formatBytes(item.file.size) })
3987
- ] }),
3988
- item.status === "uploading" && item.progress != null && /* @__PURE__ */ jsxs("div", { className: "mt-1.5 flex items-center gap-2", children: [
3989
- /* @__PURE__ */ jsx(Progress, { value: item.progress, className: "h-1.5" }),
3990
- /* @__PURE__ */ jsxs("span", { className: "shrink-0 text-xs text-muted-foreground", children: [
3991
- Math.round(item.progress),
3992
- "%"
3993
- ] })
3994
- ] }),
3995
- item.status === "success" && /* @__PURE__ */ jsx("span", { className: "mt-0.5 block text-xs text-success", children: "Uploaded" }),
3996
- item.status === "error" && /* @__PURE__ */ jsx("span", { className: "mt-0.5 block text-xs text-danger", children: item.error ?? "Upload failed" })
4651
+ multiple,
4652
+ disabled,
4653
+ id,
4654
+ "aria-describedby": describedBy,
4655
+ "aria-invalid": error || void 0,
4656
+ "aria-required": required || void 0
4657
+ }
4658
+ ),
4659
+ items.length > 0 && /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-2", children: items.map((item) => /* @__PURE__ */ jsxs(
4660
+ "li",
4661
+ {
4662
+ className: "flex items-center gap-3 rounded-kj-md border border-border bg-surface px-3 py-2",
4663
+ children: [
4664
+ /* @__PURE__ */ jsx(FileIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" }),
4665
+ /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
4666
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
4667
+ /* @__PURE__ */ jsx("span", { className: "truncate text-sm text-foreground", children: item.file.name }),
4668
+ /* @__PURE__ */ jsx("span", { className: "shrink-0 text-xs text-muted-foreground", children: formatBytes(item.file.size) })
3997
4669
  ] }),
3998
- !disabled && /* @__PURE__ */ jsx(
3999
- "button",
4000
- {
4001
- type: "button",
4002
- "aria-label": `Remove ${item.file.name}`,
4003
- onClick: () => removeItem(item.id),
4004
- className: "shrink-0 rounded-kj-sm p-1 text-muted-foreground hover:bg-muted hover:text-foreground",
4005
- children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", className: "h-4 w-4", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) })
4006
- }
4007
- )
4008
- ]
4009
- },
4010
- item.id
4011
- )) })
4012
- ] });
4013
- }
4014
- );
4670
+ item.status === "uploading" && item.progress != null && /* @__PURE__ */ jsxs("div", { className: "mt-1.5 flex items-center gap-2", children: [
4671
+ /* @__PURE__ */ jsx(Progress, { value: item.progress, className: "h-1.5" }),
4672
+ /* @__PURE__ */ jsxs("span", { className: "shrink-0 text-xs text-muted-foreground", children: [
4673
+ Math.round(item.progress),
4674
+ "%"
4675
+ ] })
4676
+ ] }),
4677
+ item.status === "success" && /* @__PURE__ */ jsx("span", { className: "mt-0.5 block text-xs text-success", children: "Uploaded" }),
4678
+ item.status === "error" && /* @__PURE__ */ jsx("span", { className: "mt-0.5 block text-xs text-danger", children: item.error ?? "Upload failed" })
4679
+ ] }),
4680
+ !disabled && /* @__PURE__ */ jsx(
4681
+ "button",
4682
+ {
4683
+ type: "button",
4684
+ "aria-label": `Remove ${item.file.name}`,
4685
+ onClick: () => removeItem(item.id),
4686
+ className: "shrink-0 rounded-kj-sm p-1 text-muted-foreground hover:bg-muted hover:text-foreground",
4687
+ children: /* @__PURE__ */ jsx(
4688
+ "svg",
4689
+ {
4690
+ viewBox: "0 0 24 24",
4691
+ className: "h-4 w-4",
4692
+ fill: "none",
4693
+ stroke: "currentColor",
4694
+ strokeWidth: "2",
4695
+ strokeLinecap: "round",
4696
+ strokeLinejoin: "round",
4697
+ children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" })
4698
+ }
4699
+ )
4700
+ }
4701
+ )
4702
+ ]
4703
+ },
4704
+ item.id
4705
+ )) })
4706
+ ] });
4707
+ });
4015
4708
  FileUpload.displayName = "FileUpload";
4016
4709
  var FileUploadField = React52.forwardRef(
4017
4710
  function FileUploadField2({ label, hint, error, required, className, ...props }, ref) {
@@ -4056,16 +4749,7 @@ var TimelineItem = React52.forwardRef(
4056
4749
  align === "right" && "grid-cols-[1fr_auto] text-right",
4057
4750
  align === "alternate" && "md:grid-cols-[1fr_auto_1fr] grid-cols-[auto_1fr]"
4058
4751
  );
4059
- return /* @__PURE__ */ jsx(TimelineItemContext.Provider, { value: { isEven, align, isLast }, children: /* @__PURE__ */ jsx(
4060
- "div",
4061
- {
4062
- ref,
4063
- role: "listitem",
4064
- className: cn(gridClass, className),
4065
- ...props,
4066
- children
4067
- }
4068
- ) });
4752
+ return /* @__PURE__ */ jsx(TimelineItemContext.Provider, { value: { isEven, align, isLast }, children: /* @__PURE__ */ jsx("div", { ref, role: "listitem", className: cn(gridClass, className), ...props, children }) });
4069
4753
  }
4070
4754
  );
4071
4755
  TimelineItem.displayName = "TimelineItem";
@@ -4145,51 +4829,53 @@ var TimelineContent = React52.forwardRef(
4145
4829
  }
4146
4830
  );
4147
4831
  TimelineContent.displayName = "TimelineContent";
4148
- var TimelineTitle = React52.forwardRef(
4149
- ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
4150
- "h4",
4151
- {
4152
- ref,
4153
- className: cn("m-0 text-sm font-semibold tracking-[-0.01em] text-foreground", className),
4154
- ...props,
4155
- children
4156
- }
4157
- )
4158
- );
4832
+ var TimelineTitle = React52.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
4833
+ "h4",
4834
+ {
4835
+ ref,
4836
+ className: cn("m-0 text-sm font-semibold tracking-[-0.01em] text-foreground", className),
4837
+ ...props,
4838
+ children
4839
+ }
4840
+ ));
4159
4841
  TimelineTitle.displayName = "TimelineTitle";
4160
- var TimelineTime = React52.forwardRef(
4161
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
4162
- "time",
4163
- {
4164
- ref,
4165
- className: cn("text-[0.75rem] text-muted-foreground font-normal", className),
4166
- ...props
4167
- }
4168
- )
4169
- );
4842
+ var TimelineTime = React52.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
4843
+ "time",
4844
+ {
4845
+ ref,
4846
+ className: cn("text-[0.75rem] text-muted-foreground font-normal", className),
4847
+ ...props
4848
+ }
4849
+ ));
4170
4850
  TimelineTime.displayName = "TimelineTime";
4171
4851
  function useStepper({ initialStep = 0, stepsCount }) {
4172
4852
  const safeStepsCount = Math.max(1, stepsCount);
4173
4853
  const [activeStep, setActiveStep] = React52.useState(initialStep);
4174
4854
  const [completedSteps, setCompletedSteps] = React52.useState([]);
4175
- const setStep = React52.useCallback((step) => {
4176
- if (step >= 0 && step < safeStepsCount) {
4177
- setActiveStep(step);
4178
- }
4179
- }, [safeStepsCount]);
4855
+ const setStep = React52.useCallback(
4856
+ (step) => {
4857
+ if (step >= 0 && step < safeStepsCount) {
4858
+ setActiveStep(step);
4859
+ }
4860
+ },
4861
+ [safeStepsCount]
4862
+ );
4180
4863
  const nextStep = React52.useCallback(() => {
4181
4864
  setActiveStep((prev) => Math.min(prev + 1, safeStepsCount - 1));
4182
4865
  }, [safeStepsCount]);
4183
4866
  const prevStep = React52.useCallback(() => {
4184
4867
  setActiveStep((prev) => Math.max(prev - 1, 0));
4185
4868
  }, []);
4186
- const completeStep = React52.useCallback((step) => {
4187
- setCompletedSteps((prev) => {
4188
- if (step < 0 || step >= safeStepsCount) return prev;
4189
- if (prev.includes(step)) return prev;
4190
- return [...prev, step].sort((a, b) => a - b);
4191
- });
4192
- }, [safeStepsCount]);
4869
+ const completeStep = React52.useCallback(
4870
+ (step) => {
4871
+ setCompletedSteps((prev) => {
4872
+ if (step < 0 || step >= safeStepsCount) return prev;
4873
+ if (prev.includes(step)) return prev;
4874
+ return [...prev, step].sort((a, b) => a - b);
4875
+ });
4876
+ },
4877
+ [safeStepsCount]
4878
+ );
4193
4879
  const uncompleteStep = React52.useCallback((step) => {
4194
4880
  setCompletedSteps((prev) => prev.filter((s) => s !== step));
4195
4881
  }, []);
@@ -4213,7 +4899,17 @@ function useStepper({ initialStep = 0, stepsCount }) {
4213
4899
  var StepperContext = React52.createContext(null);
4214
4900
  var StepperItemContext = React52.createContext(null);
4215
4901
  var Stepper = React52.forwardRef(
4216
- ({ value, defaultValue, onValueChange, orientation = "horizontal", responsive = true, linear = true, children, className, ...props }, ref) => {
4902
+ ({
4903
+ value,
4904
+ defaultValue,
4905
+ onValueChange,
4906
+ orientation = "horizontal",
4907
+ responsive = true,
4908
+ linear = true,
4909
+ children,
4910
+ className,
4911
+ ...props
4912
+ }, ref) => {
4217
4913
  const [localValue, setLocalValue] = React52.useState(defaultValue ?? 0);
4218
4914
  const isControlled = value !== void 0;
4219
4915
  const activeStep = isControlled ? value : localValue;
@@ -4234,7 +4930,9 @@ var Stepper = React52.forwardRef(
4234
4930
  if (linear) {
4235
4931
  setCompletedSteps((prev) => {
4236
4932
  const priorSteps = steps.filter((s) => s < step);
4237
- const nextCompleted = Array.from(/* @__PURE__ */ new Set([...prev, ...priorSteps])).sort((a, b) => a - b);
4933
+ const nextCompleted = Array.from(/* @__PURE__ */ new Set([...prev, ...priorSteps])).sort(
4934
+ (a, b) => a - b
4935
+ );
4238
4936
  return nextCompleted;
4239
4937
  });
4240
4938
  }
@@ -4253,7 +4951,17 @@ var Stepper = React52.forwardRef(
4253
4951
  unregisterStep,
4254
4952
  steps
4255
4953
  }),
4256
- [activeStep, orientation, responsive, linear, setStep, completedSteps, registerStep, unregisterStep, steps]
4954
+ [
4955
+ activeStep,
4956
+ orientation,
4957
+ responsive,
4958
+ linear,
4959
+ setStep,
4960
+ completedSteps,
4961
+ registerStep,
4962
+ unregisterStep,
4963
+ steps
4964
+ ]
4257
4965
  );
4258
4966
  return /* @__PURE__ */ jsx(StepperContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
4259
4967
  "div",
@@ -4491,7 +5199,11 @@ var AppShellBanner = React52.forwardRef(
4491
5199
  "div",
4492
5200
  {
4493
5201
  ref,
4494
- className: cn("px-4 py-2 text-sm font-medium text-center flex items-center justify-center relative z-30", variantClass, className),
5202
+ className: cn(
5203
+ "px-4 py-2 text-sm font-medium text-center flex items-center justify-center relative z-30",
5204
+ variantClass,
5205
+ className
5206
+ ),
4495
5207
  ...props,
4496
5208
  children: [
4497
5209
  /* @__PURE__ */ jsx("div", { className: "flex-1", children }),
@@ -4502,7 +5214,20 @@ var AppShellBanner = React52.forwardRef(
4502
5214
  onClick: onClose,
4503
5215
  className: "p-1 rounded opacity-80 hover:opacity-100 transition-opacity ml-2 cursor-pointer",
4504
5216
  "aria-label": "Close banner",
4505
- children: /* @__PURE__ */ jsx("svg", { width: 14, height: 14, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) })
5217
+ children: /* @__PURE__ */ jsx(
5218
+ "svg",
5219
+ {
5220
+ width: 14,
5221
+ height: 14,
5222
+ viewBox: "0 0 24 24",
5223
+ fill: "none",
5224
+ stroke: "currentColor",
5225
+ strokeWidth: 2.5,
5226
+ strokeLinecap: "round",
5227
+ strokeLinejoin: "round",
5228
+ children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" })
5229
+ }
5230
+ )
4506
5231
  }
4507
5232
  )
4508
5233
  ]
@@ -4572,11 +5297,24 @@ var AppShellHeader = React52.forwardRef(
4572
5297
  onClick: () => setMobileOpen(true),
4573
5298
  className: "md:hidden p-2 -ml-2 rounded-lg text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer",
4574
5299
  "aria-label": "Open navigation",
4575
- children: /* @__PURE__ */ jsxs("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: [
4576
- /* @__PURE__ */ jsx("line", { x1: "3", y1: "12", x2: "21", y2: "12" }),
4577
- /* @__PURE__ */ jsx("line", { x1: "3", y1: "6", x2: "21", y2: "6" }),
4578
- /* @__PURE__ */ jsx("line", { x1: "3", y1: "18", x2: "21", y2: "18" })
4579
- ] })
5300
+ children: /* @__PURE__ */ jsxs(
5301
+ "svg",
5302
+ {
5303
+ width: 20,
5304
+ height: 20,
5305
+ viewBox: "0 0 24 24",
5306
+ fill: "none",
5307
+ stroke: "currentColor",
5308
+ strokeWidth: 2.5,
5309
+ strokeLinecap: "round",
5310
+ strokeLinejoin: "round",
5311
+ children: [
5312
+ /* @__PURE__ */ jsx("line", { x1: "3", y1: "12", x2: "21", y2: "12" }),
5313
+ /* @__PURE__ */ jsx("line", { x1: "3", y1: "6", x2: "21", y2: "6" }),
5314
+ /* @__PURE__ */ jsx("line", { x1: "3", y1: "18", x2: "21", y2: "18" })
5315
+ ]
5316
+ }
5317
+ )
4580
5318
  }
4581
5319
  ),
4582
5320
  children
@@ -4609,7 +5347,20 @@ var AppShellHeader = React52.forwardRef(
4609
5347
  onClick: () => setMobileOpen(false),
4610
5348
  className: "p-1 rounded text-muted-foreground hover:text-foreground hover:bg-muted transition-colors cursor-pointer",
4611
5349
  "aria-label": "Close navigation",
4612
- children: /* @__PURE__ */ jsx("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) })
5350
+ children: /* @__PURE__ */ jsx(
5351
+ "svg",
5352
+ {
5353
+ width: 16,
5354
+ height: 16,
5355
+ viewBox: "0 0 24 24",
5356
+ fill: "none",
5357
+ stroke: "currentColor",
5358
+ strokeWidth: 2.5,
5359
+ strokeLinecap: "round",
5360
+ strokeLinejoin: "round",
5361
+ children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" })
5362
+ }
5363
+ )
4613
5364
  }
4614
5365
  )
4615
5366
  ] }),
@@ -4634,7 +5385,12 @@ var AppShellMain = React52.forwardRef(
4634
5385
  "main",
4635
5386
  {
4636
5387
  ref,
4637
- className: cn("flex-1", padded && "px-4 sm:px-6 lg:px-8 py-4 sm:py-6 md:py-12", widthClass, className),
5388
+ className: cn(
5389
+ "flex-1",
5390
+ padded && "px-4 sm:px-6 lg:px-8 py-4 sm:py-6 md:py-12",
5391
+ widthClass,
5392
+ className
5393
+ ),
4638
5394
  ...props,
4639
5395
  children
4640
5396
  }
@@ -4679,7 +5435,10 @@ var AppShell = React52.forwardRef(
4679
5435
  "div",
4680
5436
  {
4681
5437
  ref,
4682
- className: cn("min-h-screen bg-canvas text-foreground flex flex-col antialiased", className),
5438
+ className: cn(
5439
+ "min-h-screen bg-canvas text-foreground flex flex-col antialiased",
5440
+ className
5441
+ ),
4683
5442
  ...props,
4684
5443
  children: [
4685
5444
  banner && /* @__PURE__ */ jsx(AppShellBanner, { children: banner }),
@@ -4835,9 +5594,6 @@ var Rating = React52.forwardRef(
4835
5594
  ref,
4836
5595
  role: readOnly ? "img" : "radiogroup",
4837
5596
  tabIndex: disabled || readOnly ? -1 : 0,
4838
- "aria-valuenow": displayValue,
4839
- "aria-valuemin": 0,
4840
- "aria-valuemax": max,
4841
5597
  "aria-disabled": disabled || void 0,
4842
5598
  "aria-readonly": readOnly || void 0,
4843
5599
  "aria-label": ariaLabel || (readOnly ? `Rated ${displayValue} out of ${max}` : "Rating"),
@@ -4856,10 +5612,7 @@ var Rating = React52.forwardRef(
4856
5612
  name && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: currentValue }),
4857
5613
  /* @__PURE__ */ jsx("div", { className: "inline-flex items-center gap-0.5", children: Array.from({ length: max }, (_, index) => {
4858
5614
  const starIndex = index + 1;
4859
- const fillFraction = Math.max(
4860
- 0,
4861
- Math.min(1, displayValue - index)
4862
- );
5615
+ const fillFraction = Math.max(0, Math.min(1, displayValue - index));
4863
5616
  const gradientId = `rating-grad-${instanceId}-${index}-${Math.round(
4864
5617
  fillFraction * 100
4865
5618
  )}`;
@@ -4898,46 +5651,24 @@ var Rating = React52.forwardRef(
4898
5651
  className: "w-full h-full",
4899
5652
  xmlns: "http://www.w3.org/2000/svg",
4900
5653
  children: [
4901
- fillFraction > 0 && fillFraction < 1 && /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
4902
- "linearGradient",
4903
- {
4904
- id: gradientId,
4905
- x1: "0%",
4906
- y1: "0%",
4907
- x2: "100%",
4908
- y2: "0%",
4909
- children: [
4910
- isCssColor(color) ? /* @__PURE__ */ jsx(
4911
- "stop",
4912
- {
4913
- offset: `${fillFraction * 100}%`,
4914
- stopColor: color
4915
- }
4916
- ) : /* @__PURE__ */ jsx(
4917
- "stop",
4918
- {
4919
- offset: `${fillFraction * 100}%`,
4920
- stopColor: "currentColor",
4921
- className: color
4922
- }
4923
- ),
4924
- isCssColor(emptyColor) ? /* @__PURE__ */ jsx(
4925
- "stop",
4926
- {
4927
- offset: `${fillFraction * 100}%`,
4928
- stopColor: emptyColor
4929
- }
4930
- ) : /* @__PURE__ */ jsx(
4931
- "stop",
4932
- {
4933
- offset: `${fillFraction * 100}%`,
4934
- stopColor: "currentColor",
4935
- className: emptyColor
4936
- }
4937
- )
4938
- ]
4939
- }
4940
- ) }),
5654
+ fillFraction > 0 && fillFraction < 1 && /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: gradientId, x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
5655
+ isCssColor(color) ? /* @__PURE__ */ jsx("stop", { offset: `${fillFraction * 100}%`, stopColor: color }) : /* @__PURE__ */ jsx(
5656
+ "stop",
5657
+ {
5658
+ offset: `${fillFraction * 100}%`,
5659
+ stopColor: "currentColor",
5660
+ className: color
5661
+ }
5662
+ ),
5663
+ isCssColor(emptyColor) ? /* @__PURE__ */ jsx("stop", { offset: `${fillFraction * 100}%`, stopColor: emptyColor }) : /* @__PURE__ */ jsx(
5664
+ "stop",
5665
+ {
5666
+ offset: `${fillFraction * 100}%`,
5667
+ stopColor: "currentColor",
5668
+ className: emptyColor
5669
+ }
5670
+ )
5671
+ ] }) }),
4941
5672
  /* @__PURE__ */ jsx(
4942
5673
  "path",
4943
5674
  {
@@ -5002,16 +5733,7 @@ var RatingField = React52.forwardRef(
5002
5733
  );
5003
5734
  RatingField.displayName = "RatingField";
5004
5735
  var RatingSummary = React52.forwardRef(
5005
- ({
5006
- average,
5007
- totalCount,
5008
- distribution,
5009
- max = 5,
5010
- size = "md",
5011
- icon = "star",
5012
- className,
5013
- ...props
5014
- }, ref) => {
5736
+ ({ average, totalCount, distribution, max = 5, size = "md", icon = "star", className, ...props }, ref) => {
5015
5737
  const formattedAverage = Number.isInteger(average) ? average.toString() : average.toFixed(1);
5016
5738
  const formattedTotalCount = totalCount.toLocaleString();
5017
5739
  return /* @__PURE__ */ jsxs(
@@ -5124,7 +5846,15 @@ var PricingCard = React52.forwardRef(
5124
5846
  children: included ? "\u2713" : "\u2715"
5125
5847
  }
5126
5848
  ),
5127
- /* @__PURE__ */ jsx("span", { className: cn(included ? "text-foreground" : "text-muted-foreground line-through opacity-70"), children: text })
5849
+ /* @__PURE__ */ jsx(
5850
+ "span",
5851
+ {
5852
+ className: cn(
5853
+ included ? "text-foreground" : "text-muted-foreground line-through opacity-70"
5854
+ ),
5855
+ children: text
5856
+ }
5857
+ )
5128
5858
  ] }, idx);
5129
5859
  }) }),
5130
5860
  /* @__PURE__ */ jsx("div", { className: "mt-auto pt-2", children: cta ? cta : ctaHref ? (
@@ -5320,9 +6050,7 @@ function useInboxState(initial) {
5320
6050
  const [items, setItems] = React52.useState(initial);
5321
6051
  const unreadCount = items.filter((i) => !i.read).length;
5322
6052
  const markRead = React52.useCallback((id) => {
5323
- setItems(
5324
- (prev) => prev.map((item) => item.id === id ? { ...item, read: true } : item)
5325
- );
6053
+ setItems((prev) => prev.map((item) => item.id === id ? { ...item, read: true } : item));
5326
6054
  }, []);
5327
6055
  const markAllRead = React52.useCallback(() => {
5328
6056
  setItems((prev) => prev.map((item) => ({ ...item, read: true })));
@@ -5455,7 +6183,16 @@ function NotificationItem({ item, onDismiss, className }) {
5455
6183
  }
5456
6184
  ) : item.avatarFallback ? /* @__PURE__ */ jsx("span", { className: "w-7 h-7 rounded-full bg-primary/20 text-primary text-[10px] font-bold flex items-center justify-center flex-shrink-0 select-none", children: item.avatarFallback }) : item.icon ? /* @__PURE__ */ jsx("span", { className: "w-7 h-7 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0 text-primary", children: item.icon }) : null;
5457
6185
  const textBlock = /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
5458
- /* @__PURE__ */ jsx("p", { className: cn("text-sm leading-snug", item.read ? "text-muted-foreground" : "text-foreground"), children: item.title }),
6186
+ /* @__PURE__ */ jsx(
6187
+ "p",
6188
+ {
6189
+ className: cn(
6190
+ "text-sm leading-snug",
6191
+ item.read ? "text-muted-foreground" : "text-foreground"
6192
+ ),
6193
+ children: item.title
6194
+ }
6195
+ ),
5459
6196
  item.body && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-0.5 truncate", children: item.body }),
5460
6197
  /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-1", children: formatRelativeTime(item.timestamp) })
5461
6198
  ] });
@@ -5542,10 +6279,24 @@ function InboxContent({
5542
6279
  if (!ctx.open) return null;
5543
6280
  const allRead = items.length === 0 || items.every((i) => i.read);
5544
6281
  const defaultEmptyState = /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-10 px-5 text-center", children: [
5545
- /* @__PURE__ */ jsx("span", { className: "w-10 h-10 rounded-full bg-muted flex items-center justify-center mb-3 text-muted-foreground", children: /* @__PURE__ */ jsxs("svg", { width: 18, height: 18, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
5546
- /* @__PURE__ */ jsx("path", { d: "M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9" }),
5547
- /* @__PURE__ */ jsx("path", { d: "M13.73 21a2 2 0 0 1-3.46 0" })
5548
- ] }) }),
6282
+ /* @__PURE__ */ jsx("span", { className: "w-10 h-10 rounded-full bg-muted flex items-center justify-center mb-3 text-muted-foreground", children: /* @__PURE__ */ jsxs(
6283
+ "svg",
6284
+ {
6285
+ width: 18,
6286
+ height: 18,
6287
+ viewBox: "0 0 24 24",
6288
+ fill: "none",
6289
+ stroke: "currentColor",
6290
+ strokeWidth: 1.5,
6291
+ strokeLinecap: "round",
6292
+ strokeLinejoin: "round",
6293
+ "aria-hidden": "true",
6294
+ children: [
6295
+ /* @__PURE__ */ jsx("path", { d: "M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9" }),
6296
+ /* @__PURE__ */ jsx("path", { d: "M13.73 21a2 2 0 0 1-3.46 0" })
6297
+ ]
6298
+ }
6299
+ ) }),
5549
6300
  /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-foreground", children: "All caught up" }),
5550
6301
  /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-0.5", children: "No new notifications" })
5551
6302
  ] });
@@ -5587,21 +6338,7 @@ function InboxContent({
5587
6338
  }
5588
6339
  )
5589
6340
  ] }),
5590
- items.length === 0 ? emptyState ?? defaultEmptyState : /* @__PURE__ */ jsx(
5591
- "div",
5592
- {
5593
- className: "overflow-y-auto",
5594
- style: { maxHeight },
5595
- children: items.map((item) => /* @__PURE__ */ jsx(
5596
- NotificationItem,
5597
- {
5598
- item,
5599
- onDismiss
5600
- },
5601
- item.id
5602
- ))
5603
- }
5604
- ),
6341
+ items.length === 0 ? emptyState ?? defaultEmptyState : /* @__PURE__ */ jsx("div", { className: "overflow-y-auto", style: { maxHeight }, children: items.map((item) => /* @__PURE__ */ jsx(NotificationItem, { item, onDismiss }, item.id)) }),
5605
6342
  items.length > 0 && viewAllHref && /* @__PURE__ */ jsx("div", { className: "border-t border-border px-3.5 py-2.5 text-center", children: /* @__PURE__ */ jsxs(
5606
6343
  "a",
5607
6344
  {
@@ -5730,30 +6467,32 @@ function hslToHex(h, s, l) {
5730
6467
  };
5731
6468
  return `#${toHex(r)}${toHex(g)}${toHex(b)}`.toUpperCase();
5732
6469
  }
5733
- var ColorPickerSwatch = React52.forwardRef(({ color, selected = false, size = "md", className, style, ...props }, ref) => {
5734
- const sizeClasses2 = {
5735
- sm: "w-5 h-5",
5736
- md: "w-7 h-7",
5737
- lg: "w-9 h-9"
5738
- };
5739
- return /* @__PURE__ */ jsx(
5740
- "button",
5741
- {
5742
- ref,
5743
- type: "button",
5744
- "aria-pressed": selected,
5745
- style: { backgroundColor: color, ...style },
5746
- className: cn(
5747
- "relative shrink-0 rounded-full border border-border/50 shadow-sm transition-transform hover:scale-110 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary flex items-center justify-center text-white text-xs font-bold",
5748
- sizeClasses2[size],
5749
- selected && "ring-2 ring-primary ring-offset-2 ring-offset-surface",
5750
- className
5751
- ),
5752
- ...props,
5753
- children: selected && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u2713" })
5754
- }
5755
- );
5756
- });
6470
+ var ColorPickerSwatch = React52.forwardRef(
6471
+ ({ color, selected = false, size = "md", className, style, ...props }, ref) => {
6472
+ const sizeClasses2 = {
6473
+ sm: "w-5 h-5",
6474
+ md: "w-7 h-7",
6475
+ lg: "w-9 h-9"
6476
+ };
6477
+ return /* @__PURE__ */ jsx(
6478
+ "button",
6479
+ {
6480
+ ref,
6481
+ type: "button",
6482
+ "aria-pressed": selected,
6483
+ style: { backgroundColor: color, ...style },
6484
+ className: cn(
6485
+ "relative shrink-0 rounded-full border border-border/50 shadow-sm transition-transform hover:scale-110 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary flex items-center justify-center text-white text-xs font-bold",
6486
+ sizeClasses2[size],
6487
+ selected && "ring-2 ring-primary ring-offset-2 ring-offset-surface",
6488
+ className
6489
+ ),
6490
+ ...props,
6491
+ children: selected && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u2713" })
6492
+ }
6493
+ );
6494
+ }
6495
+ );
5757
6496
  ColorPickerSwatch.displayName = "ColorPickerSwatch";
5758
6497
  var ColorPicker = React52.forwardRef(
5759
6498
  ({
@@ -5767,9 +6506,7 @@ var ColorPicker = React52.forwardRef(
5767
6506
  ...props
5768
6507
  }, ref) => {
5769
6508
  const isControlled = value !== void 0;
5770
- const [localColor, setLocalColor] = React52.useState(
5771
- normalizeHex(defaultValue)
5772
- );
6509
+ const [localColor, setLocalColor] = React52.useState(normalizeHex(defaultValue));
5773
6510
  const color = isControlled ? normalizeHex(value) : localColor;
5774
6511
  const [hexInputValue, setHexInputValue] = React52.useState(color);
5775
6512
  React52.useEffect(() => {
@@ -5907,14 +6644,16 @@ var ColorPicker = React52.forwardRef(
5907
6644
  }
5908
6645
  );
5909
6646
  ColorPicker.displayName = "ColorPicker";
5910
- var ColorPickerField = React52.forwardRef(({ label, hint, error, required, ...props }, ref) => {
5911
- return /* @__PURE__ */ jsxs(Field, { children: [
5912
- label && /* @__PURE__ */ jsx(Label, { required, children: label }),
5913
- /* @__PURE__ */ jsx(ColorPicker, { ref, ...props }),
5914
- hint && /* @__PURE__ */ jsx(Hint, { children: hint }),
5915
- error && /* @__PURE__ */ jsx(Hint, { error: true, children: error })
5916
- ] });
5917
- });
6647
+ var ColorPickerField = React52.forwardRef(
6648
+ ({ label, hint, error, required, ...props }, ref) => {
6649
+ return /* @__PURE__ */ jsxs(Field, { children: [
6650
+ label && /* @__PURE__ */ jsx(Label, { required, children: label }),
6651
+ /* @__PURE__ */ jsx(ColorPicker, { ref, ...props }),
6652
+ hint && /* @__PURE__ */ jsx(Hint, { children: hint }),
6653
+ error && /* @__PURE__ */ jsx(Hint, { error: true, children: error })
6654
+ ] });
6655
+ }
6656
+ );
5918
6657
  ColorPickerField.displayName = "ColorPickerField";
5919
6658
  var COLUMN_CLASSES = {
5920
6659
  2: "grid-cols-2",
@@ -6039,7 +6778,20 @@ function ImageGallery({
6039
6778
  onClick: handleClose,
6040
6779
  "aria-label": "Close",
6041
6780
  className: "p-2 rounded-full text-white/80 hover:text-white hover:bg-white/10 transition-colors cursor-pointer",
6042
- children: /* @__PURE__ */ jsx("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" }) })
6781
+ children: /* @__PURE__ */ jsx(
6782
+ "svg",
6783
+ {
6784
+ width: 20,
6785
+ height: 20,
6786
+ viewBox: "0 0 24 24",
6787
+ fill: "none",
6788
+ stroke: "currentColor",
6789
+ strokeWidth: 2.5,
6790
+ strokeLinecap: "round",
6791
+ strokeLinejoin: "round",
6792
+ children: /* @__PURE__ */ jsx("path", { d: "M18 6 6 18M6 6l12 12" })
6793
+ }
6794
+ )
6043
6795
  }
6044
6796
  )
6045
6797
  ] }),
@@ -6051,7 +6803,20 @@ function ImageGallery({
6051
6803
  onClick: handlePrev,
6052
6804
  "aria-label": "Previous image",
6053
6805
  className: "p-3 rounded-full text-white/80 hover:text-white hover:bg-white/10 transition-colors cursor-pointer z-10 shrink-0",
6054
- children: /* @__PURE__ */ jsx("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "m15 18-6-6 6-6" }) })
6806
+ children: /* @__PURE__ */ jsx(
6807
+ "svg",
6808
+ {
6809
+ width: 24,
6810
+ height: 24,
6811
+ viewBox: "0 0 24 24",
6812
+ fill: "none",
6813
+ stroke: "currentColor",
6814
+ strokeWidth: 2.5,
6815
+ strokeLinecap: "round",
6816
+ strokeLinejoin: "round",
6817
+ children: /* @__PURE__ */ jsx("path", { d: "m15 18-6-6 6-6" })
6818
+ }
6819
+ )
6055
6820
  }
6056
6821
  ),
6057
6822
  /* @__PURE__ */ jsx("div", { className: "flex-1 flex flex-col items-center justify-center h-full min-h-0 px-2 select-none", children: /* @__PURE__ */ jsx(
@@ -6069,7 +6834,20 @@ function ImageGallery({
6069
6834
  onClick: handleNext,
6070
6835
  "aria-label": "Next image",
6071
6836
  className: "p-3 rounded-full text-white/80 hover:text-white hover:bg-white/10 transition-colors cursor-pointer z-10 shrink-0",
6072
- children: /* @__PURE__ */ jsx("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" }) })
6837
+ children: /* @__PURE__ */ jsx(
6838
+ "svg",
6839
+ {
6840
+ width: 24,
6841
+ height: 24,
6842
+ viewBox: "0 0 24 24",
6843
+ fill: "none",
6844
+ stroke: "currentColor",
6845
+ strokeWidth: 2.5,
6846
+ strokeLinecap: "round",
6847
+ strokeLinejoin: "round",
6848
+ children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" })
6849
+ }
6850
+ )
6073
6851
  }
6074
6852
  )
6075
6853
  ] }),
@@ -6108,7 +6886,9 @@ function useInPostScript(options = {}) {
6108
6886
  }
6109
6887
  if (!scriptPromise) {
6110
6888
  scriptPromise = new Promise((resolve, reject) => {
6111
- let scriptTag = document.querySelector(`script[src="${scriptUrl}"]`);
6889
+ let scriptTag = document.querySelector(
6890
+ `script[src="${scriptUrl}"]`
6891
+ );
6112
6892
  if (!scriptTag) {
6113
6893
  scriptTag = document.createElement("script");
6114
6894
  scriptTag.src = scriptUrl;
@@ -6118,7 +6898,9 @@ function useInPostScript(options = {}) {
6118
6898
  scriptTag.addEventListener("load", () => resolve());
6119
6899
  scriptTag.addEventListener(
6120
6900
  "error",
6121
- (err) => reject(err instanceof Error ? err : new Error("Failed to load InPost GeoWidget SDK script"))
6901
+ (err) => reject(
6902
+ err instanceof Error ? err : new Error("Failed to load InPost GeoWidget SDK script")
6903
+ )
6122
6904
  );
6123
6905
  });
6124
6906
  }
@@ -6143,7 +6925,12 @@ var MOCK_POINTS = [
6143
6925
  {
6144
6926
  name: "WAW01M",
6145
6927
  address: { line1: "ul. Towarowa 5", line2: "00-838 Warszawa" },
6146
- address_details: { city: "Warszawa", street: "Towarowa", building_number: "5", post_code: "00-838" },
6928
+ address_details: {
6929
+ city: "Warszawa",
6930
+ street: "Towarowa",
6931
+ building_number: "5",
6932
+ post_code: "00-838"
6933
+ },
6147
6934
  location: { latitude: 52.2297, longitude: 21.0122 },
6148
6935
  type: ["parcel_locker"],
6149
6936
  status: "Operating",
@@ -6152,7 +6939,12 @@ var MOCK_POINTS = [
6152
6939
  {
6153
6940
  name: "KRA02N",
6154
6941
  address: { line1: "ul. Floria\u0144ska 12", line2: "31-021 Krak\xF3w" },
6155
- address_details: { city: "Krak\xF3w", street: "Floria\u0144ska", building_number: "12", post_code: "31-021" },
6942
+ address_details: {
6943
+ city: "Krak\xF3w",
6944
+ street: "Floria\u0144ska",
6945
+ building_number: "12",
6946
+ post_code: "31-021"
6947
+ },
6156
6948
  location: { latitude: 50.0647, longitude: 19.945 },
6157
6949
  type: ["parcel_locker"],
6158
6950
  status: "Operating",
@@ -6170,7 +6962,12 @@ var MOCK_POINTS = [
6170
6962
  {
6171
6963
  name: "POZ04S",
6172
6964
  address: { line1: "ul. P\xF3\u0142wiejska 42", line2: "61-888 Pozna\u0144" },
6173
- address_details: { city: "Pozna\u0144", street: "P\xF3\u0142wiejska", building_number: "42", post_code: "61-888" },
6965
+ address_details: {
6966
+ city: "Pozna\u0144",
6967
+ street: "P\xF3\u0142wiejska",
6968
+ building_number: "42",
6969
+ post_code: "61-888"
6970
+ },
6174
6971
  location: { latitude: 52.4064, longitude: 16.9252 },
6175
6972
  type: ["parcel_locker"],
6176
6973
  status: "Operating",
@@ -6270,7 +7067,8 @@ var InPostGeowidget = ({
6270
7067
  /* @__PURE__ */ jsx("span", { className: "text-[0.7rem] font-black bg-slate-950 text-amber-400 px-2.5 py-0.5 rounded-md uppercase tracking-wider shadow-sm", children: "Tryb Pokazowy" })
6271
7068
  ] }),
6272
7069
  /* @__PURE__ */ jsxs("p", { className: "text-xs text-slate-950 font-bold leading-relaxed opacity-95", children: [
6273
- "Wybierz punkt z listy poni\u017Cej. Do za\u0142adowania produkcyjnej mapy przeka\u017C prop ",
7070
+ "Wybierz punkt z listy poni\u017Cej. Do za\u0142adowania produkcyjnej mapy przeka\u017C prop",
7071
+ " ",
6274
7072
  /* @__PURE__ */ jsx("code", { className: "bg-slate-950 text-amber-400 px-1.5 py-0.5 rounded font-mono text-[0.72rem] font-black", children: 'token="TWOJ_TOKEN"' }),
6275
7073
  "."
6276
7074
  ] })
@@ -6300,17 +7098,35 @@ var InPostGeowidget = ({
6300
7098
  children: [
6301
7099
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 min-w-0", children: [
6302
7100
  /* @__PURE__ */ jsxs("div", { className: "font-black text-base flex items-center gap-2", children: [
6303
- /* @__PURE__ */ jsxs("span", { className: isSelected ? "text-primary-foreground font-black" : "text-foreground font-black", children: [
6304
- "Paczkomat\xAE ",
6305
- p.name
6306
- ] }),
6307
- p.location_description && /* @__PURE__ */ jsx("span", { className: `text-[0.72rem] px-2.5 py-0.5 rounded-full font-bold ${isSelected ? "bg-primary-hover text-primary-foreground" : "bg-muted text-primary"}`, children: p.location_description })
7101
+ /* @__PURE__ */ jsxs(
7102
+ "span",
7103
+ {
7104
+ className: isSelected ? "text-primary-foreground font-black" : "text-foreground font-black",
7105
+ children: [
7106
+ "Paczkomat\xAE ",
7107
+ p.name
7108
+ ]
7109
+ }
7110
+ ),
7111
+ p.location_description && /* @__PURE__ */ jsx(
7112
+ "span",
7113
+ {
7114
+ className: `text-[0.72rem] px-2.5 py-0.5 rounded-full font-bold ${isSelected ? "bg-primary-hover text-primary-foreground" : "bg-muted text-primary"}`,
7115
+ children: p.location_description
7116
+ }
7117
+ )
6308
7118
  ] }),
6309
- /* @__PURE__ */ jsxs("div", { className: `text-xs font-bold ${isSelected ? "text-primary-foreground/90" : "text-muted-foreground"}`, children: [
6310
- p.address.line1,
6311
- ", ",
6312
- p.address.line2
6313
- ] })
7119
+ /* @__PURE__ */ jsxs(
7120
+ "div",
7121
+ {
7122
+ className: `text-xs font-bold ${isSelected ? "text-primary-foreground/90" : "text-muted-foreground"}`,
7123
+ children: [
7124
+ p.address.line1,
7125
+ ", ",
7126
+ p.address.line2
7127
+ ]
7128
+ }
7129
+ )
6314
7130
  ] }),
6315
7131
  /* @__PURE__ */ jsx(
6316
7132
  "button",
@@ -6416,7 +7232,13 @@ var InPostGeowidgetModal = ({
6416
7232
  children: [
6417
7233
  /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2.5 min-w-0", children: [
6418
7234
  /* @__PURE__ */ jsx("span", { className: "font-black text-[0.7rem] bg-amber-400 text-slate-950 px-2.5 py-1 rounded-md shadow-sm tracking-tight uppercase border border-amber-500/40 shrink-0 group-hover:scale-105 transition-transform", children: "InPost" }),
6419
- /* @__PURE__ */ jsx("span", { className: `truncate font-bold text-sm ${isOutline ? "text-foreground group-hover:text-primary" : ""}`, children: selectedCode ? `Paczkomat\xAE ${selectedCode}` : triggerText })
7235
+ /* @__PURE__ */ jsx(
7236
+ "span",
7237
+ {
7238
+ className: `truncate font-bold text-sm ${isOutline ? "text-foreground group-hover:text-primary" : ""}`,
7239
+ children: selectedCode ? `Paczkomat\xAE ${selectedCode}` : triggerText
7240
+ }
7241
+ )
6420
7242
  ] }),
6421
7243
  /* @__PURE__ */ jsx(
6422
7244
  "span",