shad-m 1.0.0 → 1.0.2

package/dist/common/interactive/table/table-pagination.mjs

@@ -1,10 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { Pagination } from '../pagination';
-
-const TablePagination = ({ config }) => {
-  return /* @__PURE__ */ jsx("div", { className: "border-t px-4 py-3 md:px-6", children: /* @__PURE__ */ jsx(Pagination, { ...config }) });
-};
-
-export { TablePagination };
-//# sourceMappingURL=table-pagination.mjs.map
-//# sourceMappingURL=table-pagination.mjs.map

package/dist/common/interactive/table/table-pagination.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/common/interactive/table/table-pagination.tsx"],"names":[],"mappings":";;;AAGO,MAAM,eAAA,GAAkB,CAAC,EAAE,MAAA,EAAO,KAAyC;AAChF,EAAA,uBACE,GAAA,CAAC,SAAI,SAAA,EAAU,4BAAA,EACb,8BAAC,UAAA,EAAA,EAAY,GAAG,QAAQ,CAAA,EAC1B,CAAA;AAEJ","file":"table-pagination.mjs","sourcesContent":["import { Pagination } from '../pagination';\nimport { TablePaginationConfig } from './types';\n\nexport const TablePagination = ({ config }: { config: TablePaginationConfig }) => {\n  return (\n    <div className=\"border-t px-4 py-3 md:px-6\">\n      <Pagination {...config} />\n    </div>\n  );\n};\n"]}

package/dist/common/interactive/table/types.js

@@ -1,4 +0,0 @@
-'use strict';
-
-//# sourceMappingURL=types.js.map
-//# sourceMappingURL=types.js.map

package/dist/common/interactive/table/types.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"types.js"}

package/dist/common/interactive/table/types.mjs

@@ -1,3 +0,0 @@
-
-//# sourceMappingURL=types.mjs.map
-//# sourceMappingURL=types.mjs.map

package/dist/common/interactive/table/types.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"types.mjs"}

package/dist/common/interactive/time-picker.js

@@ -1,313 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var dateFns = require('date-fns');
-var React = require('react');
-var icons = require('@/icons');
-var button = require('../../components/button');
-var input = require('../../components/input');
-var popover = require('../../components/popover');
-var scrollArea = require('../../components/scroll-area');
-var utils = require('../../lib/utils');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-const AM_VALUE = 0;
-const PM_VALUE = 1;
-function buildTime({
-  use12HourFormat,
-  value,
-  hour,
-  minute,
-  ampm
-}) {
-  try {
-    if (isNaN(value.getTime())) {
-      throw new Error("Invalid base date");
-    }
-    const newTime = new Date(value);
-    if (use12HourFormat) {
-      if (hour === 12) {
-        newTime.setHours(ampm === AM_VALUE ? 0 : 12, minute, 0, 0);
-      } else {
-        newTime.setHours(hour + ampm * 12, minute, 0, 0);
-      }
-    } else {
-      newTime.setHours(hour, minute, 0, 0);
-    }
-    return newTime;
-  } catch (error) {
-    return null;
-  }
-}
-function TimePicker({
-  value,
-  onChange,
-  use12HourFormat = false,
-  min,
-  max,
-  minuteStep = 1,
-  disabled,
-  modal,
-  label = "Ch\u1ECDn th\u1EDDi gian",
-  className,
-  error,
-  helperText,
-  helperTextClass,
-  size = "default",
-  hasRemoveIcon = true,
-  onClearValue,
-  ...props
-}) {
-  const internalValue = React.useMemo(() => {
-    const today = /* @__PURE__ */ new Date();
-    if (!value) {
-      today.setHours(0, 0, 0, 0);
-      return today;
-    }
-    try {
-      const parts = value.split(":");
-      if (parts.length !== 2 || !parts[0] || !parts[1]) {
-        today.setHours(0, 0, 0, 0);
-        return today;
-      }
-      const hours2 = parseInt(parts[0], 10);
-      const minutes2 = parseInt(parts[1], 10);
-      if (isNaN(hours2) || isNaN(minutes2) || hours2 < 0 || hours2 > 23 || minutes2 < 0 || minutes2 > 59) {
-        today.setHours(0, 0, 0, 0);
-        return today;
-      }
-      today.setHours(hours2, minutes2, 0, 0);
-      return today;
-    } catch {
-      today.setHours(0, 0, 0, 0);
-      return today;
-    }
-  }, [value]);
-  const getAmPm = React.useCallback(() => {
-    return internalValue.getHours() >= 12 ? PM_VALUE : AM_VALUE;
-  }, [internalValue]);
-  const getHour = React.useCallback(() => {
-    if (use12HourFormat) {
-      const hour2 = internalValue.getHours();
-      if (hour2 === 0) return 12;
-      if (hour2 > 12) return hour2 - 12;
-      return hour2;
-    }
-    return internalValue.getHours();
-  }, [internalValue, use12HourFormat]);
-  const getMinute = React.useCallback(() => {
-    return internalValue.getMinutes();
-  }, [internalValue]);
-  const [ampm, setAmpm] = React.useState(() => getAmPm());
-  const [hour, setHour] = React.useState(() => getHour());
-  const [minute, setMinute] = React.useState(() => getMinute());
-  const [open, setOpen] = React__default.default.useState(false);
-  const handleTimeChange = React.useCallback(
-    (newHour, newMinute, newAmpm) => {
-      try {
-        const newTime = buildTime({
-          use12HourFormat,
-          value: internalValue,
-          hour: newHour,
-          minute: newMinute,
-          ampm: newAmpm
-        });
-        if (newTime) {
-          onChange(dateFns.format(newTime, "HH:mm"));
-        }
-      } catch (error2) {
-      }
-    },
-    [use12HourFormat, internalValue, onChange]
-  );
-  const handleClockIconClick = (e) => {
-    e.stopPropagation();
-    setOpen(true);
-  };
-  const hasValue = !!value;
-  const iconSizeClasses = {
-    default: "h-5 w-5",
-    lg: "h-5 w-5"
-  };
-  const hours = React.useMemo(() => {
-    const _hours = [];
-    const startHour = use12HourFormat ? 1 : 0;
-    const endHour = use12HourFormat ? 12 : 23;
-    for (let i = startHour; i <= endHour; i++) {
-      const testDate = new Date(internalValue);
-      const hourIn24 = use12HourFormat ? i === 12 ? ampm === AM_VALUE ? 0 : 12 : i + ampm * 12 : i;
-      testDate.setHours(hourIn24, minute, 0, 0);
-      const disabled2 = min && dateFns.isBefore(testDate, dateFns.startOfMinute(min)) || max && dateFns.isAfter(testDate, dateFns.startOfMinute(max));
-      _hours.push({
-        value: i,
-        label: use12HourFormat ? i.toString() : i.toString().padStart(2, "0"),
-        disabled: disabled2 || false
-      });
-    }
-    return _hours;
-  }, [use12HourFormat, ampm, internalValue, minute, min, max]);
-  const minutes = React.useMemo(() => {
-    const _minutes = [];
-    const _hourIn24h = use12HourFormat ? hour === 12 ? ampm === AM_VALUE ? 0 : 12 : hour + ampm * 12 : hour;
-    for (let i = 0; i < 60; i += minuteStep) {
-      const testDate = new Date(internalValue);
-      testDate.setHours(_hourIn24h, i, 0, 0);
-      const disabled2 = min && dateFns.isBefore(testDate, min) || max && dateFns.isAfter(testDate, max);
-      _minutes.push({
-        value: i,
-        label: i.toString().padStart(2, "0"),
-        disabled: disabled2 || false
-      });
-    }
-    return _minutes;
-  }, [hour, ampm, use12HourFormat, internalValue, min, max, minuteStep]);
-  const ampmOptions = React.useMemo(() => {
-    if (!use12HourFormat) return [];
-    const testAM = new Date(internalValue);
-    const testPM = new Date(internalValue);
-    testAM.setHours(hour === 12 ? 0 : hour, minute, 0, 0);
-    testPM.setHours(hour === 12 ? 12 : hour + 12, minute, 0, 0);
-    return [
-      {
-        value: AM_VALUE,
-        label: "AM",
-        disabled: max && dateFns.isAfter(testAM, max) || min && dateFns.isBefore(testAM, min)
-      },
-      {
-        value: PM_VALUE,
-        label: "PM",
-        disabled: max && dateFns.isAfter(testPM, max) || min && dateFns.isBefore(testPM, min)
-      }
-    ];
-  }, [use12HourFormat, internalValue, hour, minute, min, max]);
-  const displayTime = () => {
-    if (!value) return "";
-    try {
-      return use12HourFormat ? dateFns.format(internalValue, "hh:mm a") : value;
-    } catch {
-      return "";
-    }
-  };
-  const handleClearValue = () => {
-    onChange("");
-    onClearValue?.();
-  };
-  const buttonIcon = React.useMemo(
-    () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mr-1 flex h-5 w-5 items-center justify-center", children: hasRemoveIcon && hasValue && !disabled && /* @__PURE__ */ jsxRuntime.jsx(
-        icons.CloseCircleFilledIcon,
-        {
-          className: "input-remove-icon cursor-pointer hover:opacity-70",
-          onClick: handleClearValue
-        }
-      ) }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        icons.ClockOutlinedIcon,
-        {
-          className: utils.cn("cursor-pointer opacity-50 hover:opacity-70", iconSizeClasses[size]),
-          onClick: handleClockIconClick
-        }
-      )
-    ] }),
-    [
-      hasRemoveIcon,
-      hasValue,
-      disabled,
-      handleClearValue,
-      iconSizeClasses,
-      size,
-      handleClockIconClick
-    ]
-  );
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsxs(
-    popover.Popover,
-    {
-      modal: false,
-      open: disabled ? false : open,
-      onOpenChange: disabled ? void 0 : setOpen,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(popover.PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsx(
-          input.Input,
-          {
-            value: displayTime(),
-            placeholder: label,
-            disabled,
-            isError: error,
-            label: hasValue ? label : void 0,
-            helpText: helperText,
-            helpTextClassName: helperTextClass,
-            size,
-            showRemoveIcon: false,
-            onClearValue: handleClearValue,
-            buttonIcon,
-            readOnly: true,
-            className: utils.cn(
-              "border-input bg-background focus:border-primary rounded-md border focus:outline-none",
-              {
-                "border-destructive": error,
-                "cursor-pointer": !disabled
-              },
-              className
-            ),
-            onClick: () => setOpen(true),
-            ...props
-          }
-        ) }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(popover.PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(scrollArea.ScrollArea, { className: "h-48", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-1 p-2 pr-3", children: hours.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
-            button.Button,
-            {
-              size: "sm",
-              variant: hour === option.value ? "default" : "ghost",
-              className: "shrink-0 basis-auto",
-              disabled: option.disabled,
-              onClick: () => {
-                setHour(option.value);
-                handleTimeChange(option.value, minute, ampm);
-              },
-              children: option.label
-            },
-            option.value
-          )) }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(scrollArea.ScrollArea, { className: "h-48", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-1 p-2 pr-3", children: minutes.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
-            button.Button,
-            {
-              size: "sm",
-              variant: minute === option.value ? "default" : "ghost",
-              className: "shrink-0 basis-auto",
-              disabled: option.disabled,
-              onClick: () => {
-                setMinute(option.value);
-                handleTimeChange(hour, option.value, ampm);
-              },
-              children: option.label
-            },
-            option.value
-          )) }) }),
-          use12HourFormat && /* @__PURE__ */ jsxRuntime.jsx(scrollArea.ScrollArea, { className: "h-48", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-1 p-2 pr-3", children: ampmOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
-            button.Button,
-            {
-              size: "sm",
-              variant: ampm === option.value ? "default" : "ghost",
-              className: "shrink-0 basis-auto",
-              disabled: option.disabled,
-              onClick: () => {
-                setAmpm(option.value);
-                handleTimeChange(hour, minute, option.value);
-              },
-              children: option.label
-            },
-            option.value
-          )) }) })
-        ] }) })
-      ]
-    }
-  ) });
-}
-
-exports.TimePicker = TimePicker;
-//# sourceMappingURL=time-picker.js.map
-//# sourceMappingURL=time-picker.js.map

package/dist/common/interactive/time-picker.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/common/interactive/time-picker.tsx"],"names":["useMemo","hours","minutes","useCallback","hour","useState","React","format","error","disabled","isBefore","startOfMinute","isAfter","jsxs","jsx","CloseCircleFilledIcon","ClockOutlinedIcon","cn","Popover","PopoverTrigger","Input","PopoverContent","ScrollArea","Button"],"mappings":"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","file":"time-picker.js","sourcesContent":["'use client';\n\nimport { format, isAfter, isBefore, startOfMinute } from 'date-fns';\nimport React, { useCallback, useMemo, useState } from 'react';\n\nimport { ClockOutlinedIcon, CloseCircleFilledIcon } from '@/icons';\nimport { Button } from '../../components/button';\nimport { Input } from '../../components/input';\nimport { Popover, PopoverContent, PopoverTrigger } from '../../components/popover';\nimport { ScrollArea } from '../../components/scroll-area';\nimport { cn } from '../../lib/utils';\n\ninterface TimeOption {\n  value: number;\n  label: string;\n  disabled: boolean;\n}\n\nconst AM_VALUE = 0;\nconst PM_VALUE = 1;\n\nfunction buildTime({\n  use12HourFormat,\n  value,\n  hour,\n  minute,\n  ampm,\n}: {\n  use12HourFormat?: boolean;\n  value: Date;\n  hour: number;\n  minute: number;\n  ampm: number;\n}): Date | null {\n  try {\n    if (isNaN(value.getTime())) {\n      throw new Error('Invalid base date');\n    }\n\n    const newTime = new Date(value);\n\n    // Handle 12 AM (midnight) and 12 PM (noon) in 12-hour format\n    if (use12HourFormat) {\n      if (hour === 12) {\n        newTime.setHours(ampm === AM_VALUE ? 0 : 12, minute, 0, 0);\n      } else {\n        newTime.setHours(hour + ampm * 12, minute, 0, 0);\n      }\n    } else {\n      newTime.setHours(hour, minute, 0, 0);\n    }\n\n    return newTime;\n  } catch (error) {\n    // Error building time - return null to indicate failure\n    return null;\n  }\n}\n\nexport interface TimePickerProps {\n  /**\n   * The selected time value in HH:mm format (24-hour)\n   */\n  value?: string;\n  /**\n   * Callback when time is selected\n   * Returns time string in HH:mm format\n   */\n  onChange: (time: string) => void;\n  /**\n   * Use 12-hour format with AM/PM\n   */\n  use12HourFormat?: boolean;\n  /**\n   * Minimum selectable time\n   */\n  min?: Date;\n  /**\n   * Maximum selectable time\n   */\n  max?: Date;\n  /**\n   * Step interval for minutes (e.g., 15 for 15-minute intervals)\n   * Default is 1 (show all minutes)\n   */\n  minuteStep?: number;\n  /**\n   * Whether the time picker is disabled\n   */\n  disabled?: boolean;\n  /**\n   * Custom className for the component\n   */\n  className?: string;\n  /**\n   * Whether to render the popover as a modal\n   */\n  modal?: boolean;\n  /**\n   * Placeholder text for the input\n   */\n  placeholder?: string;\n  /**\n   * Error state\n   */\n  error?: boolean;\n  /**\n   * Label for the input\n   */\n  label?: string;\n  /**\n   * Helper text below the input\n   */\n  helperText?: string;\n  /**\n   * Custom className for helper text\n   */\n  helperTextClass?: string;\n  /**\n   * Size variant of the input\n   */\n  size?: 'default' | 'lg';\n  /**\n   * Whether to show remove icon when there's a value\n   */\n  hasRemoveIcon?: boolean;\n  /**\n   * Callback when clear button is clicked\n   */\n  onClearValue?: () => void;\n}\n\nexport function TimePicker({\n  value,\n  onChange,\n  use12HourFormat = false,\n  min,\n  max,\n  minuteStep = 1,\n  disabled,\n  modal,\n  label = 'Chọn thời gian',\n  className,\n  error,\n  helperText,\n  helperTextClass,\n  size = 'default',\n  hasRemoveIcon = true,\n  onClearValue,\n  ...props\n}: TimePickerProps) {\n  // Convert string value to Date for internal processing\n  const internalValue = useMemo(() => {\n    const today = new Date();\n    if (!value) {\n      today.setHours(0, 0, 0, 0);\n      return today;\n    }\n\n    try {\n      const parts = value.split(':');\n      if (parts.length !== 2 || !parts[0] || !parts[1]) {\n        today.setHours(0, 0, 0, 0);\n        return today;\n      }\n\n      const hours = parseInt(parts[0], 10);\n      const minutes = parseInt(parts[1], 10);\n\n      if (\n        isNaN(hours) ||\n        isNaN(minutes) ||\n        hours < 0 ||\n        hours > 23 ||\n        minutes < 0 ||\n        minutes > 59\n      ) {\n        today.setHours(0, 0, 0, 0);\n        return today;\n      }\n      today.setHours(hours, minutes, 0, 0);\n      return today;\n    } catch {\n      today.setHours(0, 0, 0, 0);\n      return today;\n    }\n  }, [value]);\n\n  const getAmPm = useCallback(() => {\n    return internalValue.getHours() >= 12 ? PM_VALUE : AM_VALUE;\n  }, [internalValue]);\n\n  const getHour = useCallback(() => {\n    if (use12HourFormat) {\n      const hour = internalValue.getHours();\n      if (hour === 0) return 12;\n      if (hour > 12) return hour - 12;\n      return hour;\n    }\n    return internalValue.getHours();\n  }, [internalValue, use12HourFormat]);\n\n  const getMinute = useCallback(() => {\n    return internalValue.getMinutes();\n  }, [internalValue]);\n\n  const [ampm, setAmpm] = useState<number>(() => getAmPm());\n  const [hour, setHour] = useState<number>(() => getHour());\n  const [minute, setMinute] = useState<number>(() => getMinute());\n\n  const [open, setOpen] = React.useState(false);\n\n  const handleTimeChange = useCallback(\n    (newHour: number, newMinute: number, newAmpm: number) => {\n      try {\n        const newTime = buildTime({\n          use12HourFormat,\n          value: internalValue,\n          hour: newHour,\n          minute: newMinute,\n          ampm: newAmpm,\n        });\n        if (newTime) {\n          onChange(format(newTime, 'HH:mm'));\n        }\n      } catch (error) {\n        // Error updating time - ignore silently\n      }\n    },\n    [use12HourFormat, internalValue, onChange],\n  );\n\n  const handleClockIconClick = (e: React.MouseEvent) => {\n    e.stopPropagation();\n    setOpen(true);\n  };\n\n  const hasValue = !!value;\n\n  const iconSizeClasses = {\n    default: 'h-5 w-5',\n    lg: 'h-5 w-5',\n  };\n\n  // Generate hour options\n  const hours = useMemo(() => {\n    const _hours: TimeOption[] = [];\n    const startHour = use12HourFormat ? 1 : 0;\n    const endHour = use12HourFormat ? 12 : 23;\n\n    for (let i = startHour; i <= endHour; i++) {\n      const testDate = new Date(internalValue);\n      const hourIn24 = use12HourFormat\n        ? i === 12\n          ? ampm === AM_VALUE\n            ? 0\n            : 12\n          : i + ampm * 12\n        : i;\n      testDate.setHours(hourIn24, minute, 0, 0);\n\n      const disabled =\n        (min && isBefore(testDate, startOfMinute(min))) ||\n        (max && isAfter(testDate, startOfMinute(max)));\n\n      _hours.push({\n        value: i,\n        label: use12HourFormat ? i.toString() : i.toString().padStart(2, '0'),\n        disabled: disabled || false,\n      });\n    }\n    return _hours;\n  }, [use12HourFormat, ampm, internalValue, minute, min, max]);\n\n  // Generate minute options\n  const minutes = useMemo(() => {\n    const _minutes: TimeOption[] = [];\n    const _hourIn24h = use12HourFormat\n      ? hour === 12\n        ? ampm === AM_VALUE\n          ? 0\n          : 12\n        : hour + ampm * 12\n      : hour;\n\n    for (let i = 0; i < 60; i += minuteStep) {\n      const testDate = new Date(internalValue);\n      testDate.setHours(_hourIn24h, i, 0, 0);\n\n      const disabled = (min && isBefore(testDate, min)) || (max && isAfter(testDate, max));\n\n      _minutes.push({\n        value: i,\n        label: i.toString().padStart(2, '0'),\n        disabled: disabled || false,\n      });\n    }\n    return _minutes;\n  }, [hour, ampm, use12HourFormat, internalValue, min, max, minuteStep]);\n\n  // Generate AM/PM options\n  const ampmOptions = useMemo(() => {\n    if (!use12HourFormat) return [];\n\n    const testAM = new Date(internalValue);\n    const testPM = new Date(internalValue);\n    testAM.setHours(hour === 12 ? 0 : hour, minute, 0, 0);\n    testPM.setHours(hour === 12 ? 12 : hour + 12, minute, 0, 0);\n\n    return [\n      {\n        value: AM_VALUE,\n        label: 'AM',\n        disabled: (max && isAfter(testAM, max)) || (min && isBefore(testAM, min)),\n      },\n      {\n        value: PM_VALUE,\n        label: 'PM',\n        disabled: (max && isAfter(testPM, max)) || (min && isBefore(testPM, min)),\n      },\n    ];\n  }, [use12HourFormat, internalValue, hour, minute, min, max]);\n\n  const displayTime = () => {\n    if (!value) return '';\n    try {\n      return use12HourFormat ? format(internalValue, 'hh:mm a') : value;\n    } catch {\n      return '';\n    }\n  };\n\n  const handleClearValue = () => {\n    onChange('');\n    onClearValue?.();\n  };\n\n  const buttonIcon = useMemo(\n    () => (\n      <div className=\"flex items-center\">\n        {/* Always reserve space for remove icon to maintain consistent width */}\n        <div className=\"mr-1 flex h-5 w-5 items-center justify-center\">\n          {hasRemoveIcon && hasValue && !disabled && (\n            <CloseCircleFilledIcon\n              className=\"input-remove-icon cursor-pointer hover:opacity-70\"\n              onClick={handleClearValue}\n            />\n          )}\n        </div>\n        <ClockOutlinedIcon\n          className={cn('cursor-pointer opacity-50 hover:opacity-70', iconSizeClasses[size])}\n          onClick={handleClockIconClick}\n        />\n      </div>\n    ),\n    [\n      hasRemoveIcon,\n      hasValue,\n      disabled,\n      handleClearValue,\n      iconSizeClasses,\n      size,\n      handleClockIconClick,\n    ],\n  );\n\n  return (\n    <div className=\"w-full\">\n      <Popover\n        modal={false}\n        open={disabled ? false : open}\n        onOpenChange={disabled ? undefined : setOpen}\n      >\n        <PopoverTrigger asChild>\n          <div className=\"w-full\">\n            <Input\n              value={displayTime()}\n              placeholder={label}\n              disabled={disabled}\n              isError={error}\n              label={hasValue ? label : undefined}\n              helpText={helperText}\n              helpTextClassName={helperTextClass}\n              size={size}\n              showRemoveIcon={false}\n              onClearValue={handleClearValue}\n              buttonIcon={buttonIcon}\n              readOnly\n              className={cn(\n                'border-input bg-background focus:border-primary rounded-md border focus:outline-none',\n                {\n                  'border-destructive': error,\n                  'cursor-pointer': !disabled,\n                },\n                className,\n              )}\n              onClick={() => setOpen(true)}\n              {...props}\n            />\n          </div>\n        </PopoverTrigger>\n        <PopoverContent className=\"w-auto p-0\" align=\"start\">\n          <div className=\"flex\">\n            <ScrollArea className=\"h-48\">\n              <div className=\"flex flex-col gap-1 p-2 pr-3\">\n                {hours.map((option) => (\n                  <Button\n                    key={option.value}\n                    size=\"sm\"\n                    variant={hour === option.value ? 'default' : 'ghost'}\n                    className=\"shrink-0 basis-auto\"\n                    disabled={option.disabled}\n                    onClick={() => {\n                      setHour(option.value);\n                      handleTimeChange(option.value, minute, ampm);\n                    }}\n                  >\n                    {option.label}\n                  </Button>\n                ))}\n              </div>\n            </ScrollArea>\n            <ScrollArea className=\"h-48\">\n              <div className=\"flex flex-col gap-1 p-2 pr-3\">\n                {minutes.map((option) => (\n                  <Button\n                    key={option.value}\n                    size=\"sm\"\n                    variant={minute === option.value ? 'default' : 'ghost'}\n                    className=\"shrink-0 basis-auto\"\n                    disabled={option.disabled}\n                    onClick={() => {\n                      setMinute(option.value);\n                      handleTimeChange(hour, option.value, ampm);\n                    }}\n                  >\n                    {option.label}\n                  </Button>\n                ))}\n              </div>\n            </ScrollArea>\n            {use12HourFormat && (\n              <ScrollArea className=\"h-48\">\n                <div className=\"flex flex-col gap-1 p-2 pr-3\">\n                  {ampmOptions.map((option) => (\n                    <Button\n                      key={option.value}\n                      size=\"sm\"\n                      variant={ampm === option.value ? 'default' : 'ghost'}\n                      className=\"shrink-0 basis-auto\"\n                      disabled={option.disabled}\n                      onClick={() => {\n                        setAmpm(option.value);\n                        handleTimeChange(hour, minute, option.value);\n                      }}\n                    >\n                      {option.label}\n                    </Button>\n                  ))}\n                </div>\n              </ScrollArea>\n            )}\n          </div>\n        </PopoverContent>\n      </Popover>\n    </div>\n  );\n}\n"]}