@etus/ui 0.4.0-beta.1 → 0.4.0-beta.3

package/dist/chunk-HAEZLC7V.js

@@ -0,0 +1,122 @@
+import { cn } from './chunk-HRNDJU7D.js';
+import * as SwitchPrimitive from '@radix-ui/react-switch';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var switchVariants = cva(
+  [
+    "peer inline-flex shrink-0 items-center border border-transparent transition-all outline-none",
+    "rounded-[var(--switch-track-radius)] shadow-[var(--switch-track-shadow)]",
+    "bg-[color:var(--switch-track-bg-off)] data-[state=checked]:bg-[color:var(--switch-track-bg-on)]",
+    "dark:bg-input dark:data-[state=checked]:bg-primary",
+    "focus-visible:border-[color:var(--switch-track-ring-primary)] focus-visible:ring-[color:var(--switch-track-ring-primary)]/50 focus-visible:ring-[length:var(--switch-track-ring-width)]",
+    "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+    "disabled:cursor-not-allowed disabled:bg-[color:var(--switch-track-bg-disabled)] disabled:opacity-50"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-[var(--switch-size-sm-h)] w-[var(--switch-size-sm-w)]",
+        md: "h-[var(--switch-size-md-h)] w-[var(--switch-size-md-w)]",
+        lg: "h-[var(--switch-size-lg-h)] w-[var(--switch-size-lg-w)]"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var switchThumbVariants = cva(
+  [
+    "pointer-events-none block ring-0 transition-transform",
+    "rounded-[var(--switch-thumb-radius)] bg-[color:var(--switch-thumb-bg)]",
+    "dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground",
+    "data-[state=unchecked]:translate-x-0"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "size-[var(--switch-thumb-size-sm)] data-[state=checked]:translate-x-3",
+        md: "size-[var(--switch-thumb-size-md)] data-[state=checked]:translate-x-4",
+        lg: "size-[var(--switch-thumb-size-lg)] data-[state=checked]:translate-x-5"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+function Switch({
+  className,
+  size = "md",
+  type = "default",
+  switchText,
+  descriptionText,
+  showText,
+  showDescription,
+  id,
+  ...props
+}) {
+  const generatedId = React.useId();
+  const switchId = id ?? generatedId;
+  const shouldShowText = (showText ?? Boolean(switchText)) && Boolean(switchText);
+  const shouldShowDescription = (showDescription ?? Boolean(descriptionText)) && Boolean(descriptionText);
+  const hasComposition = shouldShowText || shouldShowDescription;
+  const switchEl = /* @__PURE__ */ jsx(
+    SwitchPrimitive.Root,
+    {
+      className: cn(switchVariants({ size }), className),
+      "data-slot": "switch",
+      id: switchId,
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        SwitchPrimitive.Thumb,
+        {
+          className: switchThumbVariants({ size }),
+          "data-slot": "switch-thumb"
+        }
+      )
+    }
+  );
+  if (!hasComposition) {
+    return switchEl;
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-start gap-3",
+        type === "box" && "rounded-md border border-input p-4"
+      ),
+      "data-slot": "switch-composition",
+      "data-type": type,
+      children: [
+        switchEl,
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", "data-slot": "switch-text-content", children: [
+          shouldShowText && /* @__PURE__ */ jsx(
+            "label",
+            {
+              className: "text-sm font-medium leading-none",
+              "data-slot": "switch-text",
+              htmlFor: switchId,
+              children: switchText
+            }
+          ),
+          shouldShowDescription && /* @__PURE__ */ jsx(
+            "p",
+            {
+              className: "text-xs text-muted-foreground leading-normal",
+              "data-slot": "switch-description",
+              children: descriptionText
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+export { Switch, switchThumbVariants, switchVariants };
+//# sourceMappingURL=chunk-HAEZLC7V.js.map
+//# sourceMappingURL=chunk-HAEZLC7V.js.map

package/dist/chunk-HAEZLC7V.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/forms/Switch/Switch.variants.ts","../src/components/forms/Switch/Switch.tsx"],"names":[],"mappings":"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","file":"chunk-HAEZLC7V.js","sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\"\n\nexport const switchVariants = cva(\n  [\n    \"peer inline-flex shrink-0 items-center border border-transparent transition-all outline-none\",\n    \"rounded-[var(--switch-track-radius)] shadow-[var(--switch-track-shadow)]\",\n    \"bg-[color:var(--switch-track-bg-off)] data-[state=checked]:bg-[color:var(--switch-track-bg-on)]\",\n    \"dark:bg-input dark:data-[state=checked]:bg-primary\",\n    \"focus-visible:border-[color:var(--switch-track-ring-primary)] focus-visible:ring-[color:var(--switch-track-ring-primary)]/50 focus-visible:ring-[length:var(--switch-track-ring-width)]\",\n    \"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n    \"disabled:cursor-not-allowed disabled:bg-[color:var(--switch-track-bg-disabled)] disabled:opacity-50\",\n  ],\n  {\n    variants: {\n      size: {\n        sm: \"h-[var(--switch-size-sm-h)] w-[var(--switch-size-sm-w)]\",\n        md: \"h-[var(--switch-size-md-h)] w-[var(--switch-size-md-w)]\",\n        lg: \"h-[var(--switch-size-lg-h)] w-[var(--switch-size-lg-w)]\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n)\n\nexport const switchThumbVariants = cva(\n  [\n    \"pointer-events-none block ring-0 transition-transform\",\n    \"rounded-[var(--switch-thumb-radius)] bg-[color:var(--switch-thumb-bg)]\",\n    \"dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground\",\n    \"data-[state=unchecked]:translate-x-0\",\n  ],\n  {\n    variants: {\n      size: {\n        sm: \"size-[var(--switch-thumb-size-sm)] data-[state=checked]:translate-x-3\",\n        md: \"size-[var(--switch-thumb-size-md)] data-[state=checked]:translate-x-4\",\n        lg: \"size-[var(--switch-thumb-size-lg)] data-[state=checked]:translate-x-5\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n)\n\nexport type SwitchVariantProps = VariantProps<typeof switchVariants>\nexport type SwitchThumbVariantProps = VariantProps<typeof switchThumbVariants>\n","import type { SwitchProps } from \"./Switch.types\"\n\nimport * as SwitchPrimitive from \"@radix-ui/react-switch\"\nimport * as React from \"react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport { switchThumbVariants, switchVariants } from \"./Switch.variants\"\n\nfunction Switch({\n  className,\n  size = \"md\",\n  type = \"default\",\n  switchText,\n  descriptionText,\n  showText,\n  showDescription,\n  id,\n  ...props\n}: SwitchProps) {\n  const generatedId = React.useId()\n  const switchId = id ?? generatedId\n\n  const shouldShowText =\n    (showText ?? Boolean(switchText)) && Boolean(switchText)\n  const shouldShowDescription =\n    (showDescription ?? Boolean(descriptionText)) && Boolean(descriptionText)\n  const hasComposition = shouldShowText || shouldShowDescription\n\n  const switchEl = (\n    <SwitchPrimitive.Root\n      className={cn(switchVariants({ size }), className)}\n      data-slot=\"switch\"\n      id={switchId}\n      {...props}\n    >\n      <SwitchPrimitive.Thumb\n        className={switchThumbVariants({ size })}\n        data-slot=\"switch-thumb\"\n      />\n    </SwitchPrimitive.Root>\n  )\n\n  if (!hasComposition) {\n    return switchEl\n  }\n\n  return (\n    <div\n      className={cn(\n        \"flex items-start gap-3\",\n        type === \"box\" && \"rounded-md border border-input p-4\"\n      )}\n      data-slot=\"switch-composition\"\n      data-type={type}\n    >\n      {switchEl}\n      <div className=\"flex flex-col gap-1\" data-slot=\"switch-text-content\">\n        {shouldShowText && (\n          <label\n            className=\"text-sm font-medium leading-none\"\n            data-slot=\"switch-text\"\n            htmlFor={switchId}\n          >\n            {switchText}\n          </label>\n        )}\n        {shouldShowDescription && (\n          <p\n            className=\"text-xs text-muted-foreground leading-normal\"\n            data-slot=\"switch-description\"\n          >\n            {descriptionText}\n          </p>\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport { Switch }\n"]}

package/dist/chunk-HIEOL77G.js

@@ -0,0 +1,460 @@
+import { ScrollArea } from './chunk-CNRV2IGH.js';
+import { Calendar } from './chunk-7QDWREVG.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-AFCSDND5.js';
+import { Button } from './chunk-RPV77BCQ.js';
+import { cn } from './chunk-HRNDJU7D.js';
+import { format, startOfDay, isBefore, isAfter, setMinutes, setHours } from 'date-fns';
+import { XIcon, CalendarIcon } from 'lucide-react';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var datePickerTriggerVariants = cva(
+  // Base styles
+  [
+    "inline-flex w-full items-center justify-between gap-2 rounded-[var(--date-picker-trigger-radius)] border bg-transparent font-normal transition-[color,box-shadow] outline-none",
+    "text-left",
+    "placeholder:text-muted-foreground",
+    "disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-[color:var(--date-picker-trigger-disabled-bg)] disabled:text-[color:var(--date-picker-trigger-disabled-fg)] disabled:border-[color:var(--date-picker-trigger-disabled-border)]",
+    "focus-visible:border-[color:var(--date-picker-trigger-border-focus)] focus-visible:ring-[color:var(--date-picker-trigger-ring-primary)]/50 focus-visible:ring-[length:var(--date-picker-trigger-ring-width)]",
+    "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+    "data-[state=open]:border-ring data-[state=open]:ring-ring/50 data-[state=open]:ring-[3px]",
+    "min-w-[var(--date-picker-trigger-min-width)]"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-[var(--date-picker-trigger-height-sm)] px-[var(--date-picker-trigger-padding-x-sm)] py-[var(--date-picker-trigger-padding-y-sm)] text-[length:var(--date-picker-trigger-text-sm)]",
+        md: "h-[var(--date-picker-trigger-height-md)] px-[var(--date-picker-trigger-padding-x-md)] py-[var(--date-picker-trigger-padding-y-md)] text-[length:var(--date-picker-trigger-text-md)]",
+        lg: "h-[var(--date-picker-trigger-height-lg)] px-[var(--date-picker-trigger-padding-x-lg)] py-[var(--date-picker-trigger-padding-y-lg)] text-[length:var(--date-picker-trigger-text-lg)]"
+      },
+      variant: {
+        default: "border-input shadow-xs dark:bg-input/30",
+        filled: "border-transparent bg-muted",
+        flushed: "rounded-none border-x-0 border-t-0 border-b-input px-0"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      variant: "default"
+    }
+  }
+);
+function to12Hour(hours) {
+  const period = hours >= 12 ? "PM" : "AM";
+  let hour12 = hours % 12;
+  if (hour12 === 0) hour12 = 12;
+  return { hour12, period };
+}
+function to24Hour(hour12, period) {
+  if (period === "AM") {
+    return hour12 === 12 ? 0 : hour12;
+  }
+  return hour12 === 12 ? 12 : hour12 + 12;
+}
+function getHourOptions(use12Hour) {
+  if (use12Hour) {
+    return [12, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
+  }
+  return Array.from({ length: 24 }, (_, i) => i);
+}
+function getMinuteOptions(step) {
+  const options = [];
+  for (let i = 0; i < 60; i += step) {
+    options.push(i);
+  }
+  return options;
+}
+function DatePicker({
+  ref,
+  className,
+  value,
+  defaultValue,
+  placeholder = "Select date",
+  disabled = false,
+  disabledDates,
+  readOnly = false,
+  showTimePicker = false,
+  showToday = false,
+  timeLabel = "Time",
+  timeMinuteStep = 1,
+  timeUse12Hour = false,
+  todayLabel = "Today",
+  minDate,
+  maxDate,
+  format: format$1 = "PPP",
+  locale,
+  onChange,
+  onOpenChange,
+  onClear,
+  size = "md",
+  variant = "default",
+  required = false,
+  invalid = false,
+  clearable = false,
+  calendarProps,
+  id,
+  name,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledby,
+  "aria-describedby": ariaDescribedby,
+  ...props
+}) {
+  const [open, setOpen] = React.useState(false);
+  const [internalDate, setInternalDate] = React.useState(defaultValue);
+  const [internalHours, setInternalHours] = React.useState(
+    defaultValue ? defaultValue.getHours() : 0
+  );
+  const [internalMinutes, setInternalMinutes] = React.useState(
+    defaultValue ? defaultValue.getMinutes() : 0
+  );
+  const [internalPeriod, setInternalPeriod] = React.useState(
+    () => defaultValue ? to12Hour(defaultValue.getHours()).period : "AM"
+  );
+  const hourListRef = React.useRef(null);
+  const minuteListRef = React.useRef(null);
+  const selectedDate = value ?? internalDate;
+  const currentHours = selectedDate ? selectedDate.getHours() : internalHours;
+  const currentMinutes = selectedDate ? selectedDate.getMinutes() : internalMinutes;
+  const currentPeriod = selectedDate ? to12Hour(selectedDate.getHours()).period : internalPeriod;
+  const defaultMonth = selectedDate ?? minDate;
+  React.useEffect(() => {
+    if (!open || !showTimePicker) return;
+    const timeoutId = setTimeout(() => {
+      const selectedHour = hourListRef.current?.querySelector('[data-selected="true"]');
+      selectedHour?.scrollIntoView({ block: "center", behavior: "instant" });
+      const selectedMinute = minuteListRef.current?.querySelector('[data-selected="true"]');
+      selectedMinute?.scrollIntoView({ block: "center", behavior: "instant" });
+    }, 0);
+    return () => {
+      clearTimeout(timeoutId);
+    };
+  }, [open, showTimePicker, currentHours, currentMinutes]);
+  const applyTimeToDate = (date, hours, minutes) => {
+    if (!date) return void 0;
+    return setMinutes(setHours(date, hours), minutes);
+  };
+  const handleSelect = (date) => {
+    let finalDate = date;
+    if (showTimePicker && date) {
+      finalDate = applyTimeToDate(date, currentHours, currentMinutes);
+    }
+    if (value === void 0) {
+      setInternalDate(finalDate);
+    }
+    onChange?.(finalDate);
+    if (!showTimePicker) {
+      setOpen(false);
+    }
+  };
+  const handleTimeChange = (hours, minutes) => {
+    if (value === void 0) {
+      setInternalHours(hours);
+      setInternalMinutes(minutes);
+    }
+    if (selectedDate) {
+      const newDate = applyTimeToDate(selectedDate, hours, minutes);
+      if (value === void 0) {
+        setInternalDate(newDate);
+      }
+      onChange?.(newDate);
+    }
+  };
+  const handleHourSelect = (hour) => {
+    let newHours = hour;
+    if (timeUse12Hour) {
+      newHours = to24Hour(hour, currentPeriod);
+    }
+    if (value === void 0) {
+      setInternalHours(newHours);
+    }
+    handleTimeChange(newHours, currentMinutes);
+  };
+  const handleMinuteSelect = (minute) => {
+    if (value === void 0) {
+      setInternalMinutes(minute);
+    }
+    handleTimeChange(currentHours, minute);
+  };
+  const handlePeriodSelect = (period) => {
+    if (value === void 0) {
+      setInternalPeriod(period);
+    }
+    const hour12 = timeUse12Hour ? currentHours % 12 || 12 : to12Hour(currentHours).hour12;
+    const newHours = to24Hour(hour12, period);
+    if (value === void 0) {
+      setInternalHours(newHours);
+    }
+    handleTimeChange(newHours, currentMinutes);
+  };
+  const handleOpenChange = (isOpen) => {
+    if (readOnly && isOpen) return;
+    setOpen(isOpen);
+    onOpenChange?.(isOpen);
+  };
+  const handleClear = (event) => {
+    event.stopPropagation();
+    if (value === void 0) {
+      setInternalDate(void 0);
+    }
+    onChange?.();
+    onClear?.();
+  };
+  const displayValue = React.useMemo(() => {
+    if (!selectedDate) return null;
+    const dateStr = format(selectedDate, format$1, locale ? { locale } : void 0);
+    if (showTimePicker) {
+      const timeStr = timeUse12Hour ? `${String(to12Hour(currentHours).hour12)}:${currentMinutes.toString().padStart(2, "0")} ${currentPeriod}` : `${currentHours.toString().padStart(2, "0")}:${currentMinutes.toString().padStart(2, "0")}`;
+      return `${dateStr} ${timeStr}`;
+    }
+    return dateStr;
+  }, [selectedDate, format$1, locale, showTimePicker, timeUse12Hour, currentHours, currentMinutes, currentPeriod]);
+  const hourOptions = React.useMemo(() => getHourOptions(timeUse12Hour), [timeUse12Hour]);
+  const minuteOptions = React.useMemo(() => getMinuteOptions(timeMinuteStep), [timeMinuteStep]);
+  const displayHour = timeUse12Hour ? to12Hour(currentHours).hour12 : currentHours;
+  const showClearButton = clearable && selectedDate && !disabled && !readOnly;
+  const isDateDisabled = React.useCallback(
+    (date) => {
+      const normalizedDate = startOfDay(date);
+      if (minDate && isBefore(normalizedDate, startOfDay(minDate))) return true;
+      if (maxDate && isAfter(normalizedDate, startOfDay(maxDate))) return true;
+      if (disabledDates?.(date)) return true;
+      return false;
+    },
+    [minDate, maxDate, disabledDates]
+  );
+  const isTodayDisabled = React.useMemo(() => {
+    return isDateDisabled(/* @__PURE__ */ new Date());
+  }, [isDateDisabled]);
+  const handleSelectToday = () => {
+    const today = startOfDay(/* @__PURE__ */ new Date());
+    if (!isDateDisabled(today)) {
+      handleSelect(today);
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn("relative", className), "data-slot": "date-picker", ...props, children: [
+    /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
+      /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+        "button",
+        {
+          ref,
+          className: cn(
+            datePickerTriggerVariants({ size, variant }),
+            !displayValue && "text-muted-foreground"
+          ),
+          "aria-describedby": ariaDescribedby,
+          "aria-expanded": open,
+          "aria-haspopup": "dialog",
+          "aria-invalid": invalid,
+          "aria-label": ariaLabel,
+          "aria-labelledby": ariaLabelledby,
+          "aria-readonly": readOnly,
+          "aria-required": required,
+          "data-readonly": readOnly || void 0,
+          "data-size": size,
+          "data-slot": "date-picker-trigger",
+          "data-state": open ? "open" : "closed",
+          "data-variant": variant,
+          disabled,
+          id,
+          role: "combobox",
+          type: "button",
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", children: displayValue ?? placeholder }),
+            /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 items-center gap-1", children: [
+              showClearButton && /* @__PURE__ */ jsx(
+                "span",
+                {
+                  "aria-label": "Clear date",
+                  className: "rounded-sm opacity-50 hover:opacity-100 focus:outline-none",
+                  "data-slot": "date-picker-clear",
+                  role: "button",
+                  tabIndex: 0,
+                  onClick: handleClear,
+                  onKeyDown: (e) => {
+                    if (e.key === "Enter" || e.key === " ") {
+                      e.preventDefault();
+                      handleClear(e);
+                    }
+                  },
+                  children: /* @__PURE__ */ jsx(XIcon, { className: "size-4" })
+                }
+              ),
+              /* @__PURE__ */ jsx(CalendarIcon, { className: "size-4 opacity-50" })
+            ] })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsxs(
+        PopoverContent,
+        {
+          align: "start",
+          className: "w-auto p-0",
+          "data-slot": "date-picker-calendar",
+          children: [
+            /* @__PURE__ */ jsx(
+              Calendar,
+              {
+                autoFocus: true,
+                footer: showToday ? /* @__PURE__ */ jsx("div", { className: "border-t border-border p-2", "data-slot": "date-picker-footer", children: /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    className: "w-full",
+                    disabled: isTodayDisabled,
+                    size: "sm",
+                    variant: "ghost",
+                    onClick: handleSelectToday,
+                    children: todayLabel
+                  }
+                ) }) : void 0,
+                defaultMonth,
+                disabled: isDateDisabled,
+                locale,
+                mode: "single",
+                selected: selectedDate,
+                onSelect: handleSelect,
+                ...calendarProps
+              }
+            ),
+            showTimePicker && /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: "border-t border-border",
+                "data-slot": "date-picker-time",
+                children: [
+                  /* @__PURE__ */ jsx("div", { className: "px-3 py-2 text-xs font-medium text-muted-foreground", children: timeLabel }),
+                  /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      "aria-label": "Time selection",
+                      className: "flex divide-x border-t border-border",
+                      role: "listbox",
+                      children: [
+                        /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                          /* @__PURE__ */ jsx("div", { className: "px-2 py-1.5 text-xs font-medium text-muted-foreground text-center border-b", children: timeUse12Hour ? "Hour" : "Hours" }),
+                          /* @__PURE__ */ jsx(ScrollArea, { className: "h-36", children: /* @__PURE__ */ jsx(
+                            "div",
+                            {
+                              ref: hourListRef,
+                              "aria-label": "Hours",
+                              className: "flex flex-col items-stretch p-1",
+                              role: "group",
+                              children: hourOptions.map((hour) => {
+                                const isSelected = displayHour === hour;
+                                return /* @__PURE__ */ jsx(
+                                  "button",
+                                  {
+                                    className: cn(
+                                      "flex h-8 w-12 items-center justify-center rounded-sm text-sm",
+                                      "hover:bg-accent hover:text-accent-foreground",
+                                      "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                                      isSelected && "bg-primary text-primary-foreground"
+                                    ),
+                                    "aria-selected": isSelected,
+                                    "data-selected": isSelected,
+                                    role: "option",
+                                    type: "button",
+                                    onClick: () => {
+                                      handleHourSelect(hour);
+                                    },
+                                    children: timeUse12Hour ? hour : hour.toString().padStart(2, "0")
+                                  },
+                                  hour
+                                );
+                              })
+                            }
+                          ) })
+                        ] }),
+                        /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                          /* @__PURE__ */ jsx("div", { className: "px-2 py-1.5 text-xs font-medium text-muted-foreground text-center border-b", children: "Min" }),
+                          /* @__PURE__ */ jsx(ScrollArea, { className: "h-36", children: /* @__PURE__ */ jsx(
+                            "div",
+                            {
+                              ref: minuteListRef,
+                              "aria-label": "Minutes",
+                              className: "flex flex-col items-stretch p-1",
+                              role: "group",
+                              children: minuteOptions.map((minute) => {
+                                const isSelected = currentMinutes === minute;
+                                return /* @__PURE__ */ jsx(
+                                  "button",
+                                  {
+                                    className: cn(
+                                      "flex h-8 w-12 items-center justify-center rounded-sm text-sm",
+                                      "hover:bg-accent hover:text-accent-foreground",
+                                      "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                                      isSelected && "bg-primary text-primary-foreground"
+                                    ),
+                                    "aria-selected": isSelected,
+                                    "data-selected": isSelected,
+                                    role: "option",
+                                    type: "button",
+                                    onClick: () => {
+                                      handleMinuteSelect(minute);
+                                    },
+                                    children: minute.toString().padStart(2, "0")
+                                  },
+                                  minute
+                                );
+                              })
+                            }
+                          ) })
+                        ] }),
+                        timeUse12Hour && /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                          /* @__PURE__ */ jsx("div", { className: "px-2 py-1.5 text-xs font-medium text-muted-foreground text-center border-b", children: "\xA0" }),
+                          /* @__PURE__ */ jsx(
+                            "div",
+                            {
+                              "aria-label": "Period",
+                              className: "flex flex-col items-stretch p-1",
+                              role: "group",
+                              children: ["AM", "PM"].map((period) => {
+                                const isSelected = currentPeriod === period;
+                                return /* @__PURE__ */ jsx(
+                                  "button",
+                                  {
+                                    className: cn(
+                                      "flex h-8 w-12 items-center justify-center rounded-sm text-sm",
+                                      "hover:bg-accent hover:text-accent-foreground",
+                                      "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                                      isSelected && "bg-primary text-primary-foreground"
+                                    ),
+                                    "aria-selected": isSelected,
+                                    "data-selected": isSelected,
+                                    role: "option",
+                                    type: "button",
+                                    onClick: () => {
+                                      handlePeriodSelect(period);
+                                    },
+                                    children: period
+                                  },
+                                  period
+                                );
+                              })
+                            }
+                          )
+                        ] })
+                      ]
+                    }
+                  )
+                ]
+              }
+            )
+          ]
+        }
+      )
+    ] }),
+    name && /* @__PURE__ */ jsx(
+      "input",
+      {
+        name,
+        type: "hidden",
+        value: selectedDate?.toISOString() ?? ""
+      }
+    )
+  ] });
+}
+
+export { DatePicker, datePickerTriggerVariants };
+//# sourceMappingURL=chunk-HIEOL77G.js.map
+//# sourceMappingURL=chunk-HIEOL77G.js.map