@deepnoid/ui 0.1.206 → 0.1.207

package/dist/components/picker/timePicker/Panel.js

@@ -0,0 +1,740 @@
+"use client";
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// ../../node_modules/tailwindcss/lib/util/createPlugin.js
+var require_createPlugin = __commonJS({
+  "../../node_modules/tailwindcss/lib/util/createPlugin.js"(exports2) {
+    "use strict";
+    Object.defineProperty(exports2, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports2, "default", {
+      enumerable: true,
+      get: function() {
+        return _default;
+      }
+    });
+    function createPlugin(plugin2, config) {
+      return {
+        handler: plugin2,
+        config
+      };
+    }
+    createPlugin.withOptions = function(pluginFunction, configFunction = () => ({})) {
+      const optionsFunction = function(options) {
+        return {
+          __options: options,
+          handler: pluginFunction(options),
+          config: configFunction(options)
+        };
+      };
+      optionsFunction.__isOptionsFunction = true;
+      optionsFunction.__pluginFunction = pluginFunction;
+      optionsFunction.__configFunction = configFunction;
+      return optionsFunction;
+    };
+    var _default = createPlugin;
+  }
+});
+
+// ../../node_modules/tailwindcss/lib/public/create-plugin.js
+var require_create_plugin = __commonJS({
+  "../../node_modules/tailwindcss/lib/public/create-plugin.js"(exports2) {
+    "use strict";
+    Object.defineProperty(exports2, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports2, "default", {
+      enumerable: true,
+      get: function() {
+        return _default;
+      }
+    });
+    var _createPlugin = /* @__PURE__ */ _interop_require_default(require_createPlugin());
+    function _interop_require_default(obj) {
+      return obj && obj.__esModule ? obj : {
+        default: obj
+      };
+    }
+    var _default = _createPlugin.default;
+  }
+});
+
+// ../../node_modules/tailwindcss/plugin.js
+var require_plugin = __commonJS({
+  "../../node_modules/tailwindcss/plugin.js"(exports2, module2) {
+    "use strict";
+    var createPlugin = require_create_plugin();
+    module2.exports = (createPlugin.__esModule ? createPlugin : { default: createPlugin }).default;
+  }
+});
+
+// src/components/picker/timePicker/Panel.tsx
+var Panel_exports = {};
+__export(Panel_exports, {
+  TimePickerPanel: () => TimePickerPanel,
+  default: () => Panel_default
+});
+module.exports = __toCommonJS(Panel_exports);
+var import_react3 = require("react");
+
+// src/components/picker/timePicker/WheelColumn.tsx
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var ITEM_HEIGHT = 30;
+var ACTIVE_HEIGHT = 34;
+function WheelColumn({ list, value, onChange }) {
+  const ref = (0, import_react.useRef)(null);
+  const internalChangeRef = (0, import_react.useRef)(false);
+  const [currentIndex, setCurrentIndex] = (0, import_react.useState)(0);
+  const scrollToIndex = (index, behavior = "smooth") => {
+    if (!ref.current) return;
+    const diff = ACTIVE_HEIGHT - ITEM_HEIGHT;
+    let centerOffset = index > 0 && behavior === "auto" ? diff : 0;
+    if (behavior === "auto" && currentIndex !== 0) centerOffset -= 4;
+    const top = index * ITEM_HEIGHT + centerOffset;
+    ref.current.scrollTo({ top, behavior });
+  };
+  const finalizeScroll = (index) => {
+    internalChangeRef.current = true;
+    const v = list[index];
+    setCurrentIndex(index);
+    scrollToIndex(index, "smooth");
+    if (v) onChange(v);
+  };
+  const handleClick = (index) => finalizeScroll(index);
+  (0, import_react.useEffect)(() => {
+    if (!ref.current || !value) return;
+    const idx = list.indexOf(value);
+    if (idx < 0) return;
+    if (internalChangeRef.current) {
+      internalChangeRef.current = false;
+      return;
+    }
+    setCurrentIndex(idx);
+    scrollToIndex(idx, "auto");
+  }, [value]);
+  (0, import_react.useEffect)(() => {
+    const el = ref.current;
+    if (!el) return;
+    const handleWheel = (e) => {
+      e.preventDefault();
+      let newIndex = currentIndex;
+      if (e.deltaY > 0) {
+        newIndex = Math.min(currentIndex + 1, list.length - 1);
+      } else if (e.deltaY < 0) {
+        newIndex = Math.max(currentIndex - 1, 0);
+      }
+      finalizeScroll(newIndex);
+    };
+    el.addEventListener("wheel", handleWheel, { passive: false });
+    return () => el.removeEventListener("wheel", handleWheel);
+  }, [currentIndex, list, onChange]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative h-[94px] w-[40px]", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pointer-events-none absolute left-1/2 top-[30px] h-[34px] w-[40px] -translate-x-1/2 rounded-[10px] shadow-[inset_0_0_0_1.5px_var(--dn-primary-light)]" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { ref, className: "scrollbar-none relative h-full select-none overflow-y-scroll py-[0]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { height: ITEM_HEIGHT } }),
+      list.map((v, i) => {
+        const isActive = i === currentIndex;
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "div",
+          {
+            onClick: () => handleClick(i),
+            className: `flex items-center justify-center text-sm font-bold transition-all ${isActive ? "text-body-foreground" : "text-neutral-light"}`,
+            style: { height: isActive ? ACTIVE_HEIGHT : ITEM_HEIGHT },
+            children: v
+          },
+          i
+        );
+      }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { height: list.length >= 3 ? ITEM_HEIGHT + 4 : ITEM_HEIGHT } })
+    ] })
+  ] });
+}
+
+// src/utils/tailwind-variants.ts
+var import_tailwind_variants = require("tailwind-variants");
+
+// ../tailwind-config/src/plugin.ts
+var import_plugin = __toESM(require_plugin());
+
+// ../tailwind-config/src/typography/font.ts
+var fontSize = {
+  h1: [
+    "40px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h2: [
+    "34px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h3: [
+    "28px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h4: [
+    "24px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h5: [
+    "20px",
+    {
+      fontWeight: "600"
+    }
+  ],
+  sm: [
+    "12px",
+    {
+      lineHeight: "18px",
+      fontWeight: "400"
+    }
+  ],
+  md: [
+    "14px",
+    {
+      lineHeight: "21px",
+      fontWeight: "400"
+    }
+  ],
+  lg: [
+    "16px",
+    {
+      lineHeight: "24px",
+      fontWeight: "400"
+    }
+  ],
+  xl: [
+    "18px",
+    {
+      lineHeight: "27px",
+      fontWeight: "400"
+    }
+  ],
+  "2xl": [
+    "24px",
+    {
+      lineHeight: "36px",
+      fontWeight: "400"
+    }
+  ]
+};
+
+// ../tailwind-config/src/animation/bar.ts
+var barAnimation = {
+  "indeterminate-bar": "indeterminate-bar 1.5s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite normal none running"
+};
+var barKeyframe = {
+  "indeterminate-bar": {
+    "0%": {
+      transform: "translateX(-50%) scaleX(0.2)"
+    },
+    "100%": {
+      transform: "translateX(100%) scaleX(1)"
+    }
+  }
+};
+
+// ../tailwind-config/src/animation/slide.ts
+var sliceAnimation = {
+  slideInFromTop: "slideInFromTop 0.5s ease-out",
+  slideInFromBottom: "slideInFromBottom 0.5s ease-out",
+  slideInFromLeft: "slideInFromLeft 0.5s ease-out",
+  slideInFromRight: "slideInFromRight 0.5s ease-out",
+  slideOutToTop: "slideOutToTop 0.5s ease-in",
+  slideOutToBottom: "slideOutToBottom 0.5s ease-in",
+  slideOutToLeft: "slideOutToLeft 0.5s ease-in",
+  slideOutToRight: "slideOutToRight 0.5s ease-in"
+};
+var sliceKeyframe = {
+  slideInFromTop: {
+    "0%": {
+      transform: "translateY(-10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    }
+  },
+  slideInFromBottom: {
+    "0%": {
+      transform: "translateY(10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    }
+  },
+  slideInFromLeft: {
+    "0%": {
+      transform: "translateX(-10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    }
+  },
+  slideInFromRight: {
+    "0%": {
+      transform: "translateX(10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    }
+  },
+  slideOutToTop: {
+    "0%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateY(-10px)",
+      opacity: "0"
+    }
+  },
+  slideOutToBottom: {
+    "0%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateY(10px)",
+      opacity: "0"
+    }
+  },
+  slideOutToLeft: {
+    "0%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateX(-10px)",
+      opacity: "0"
+    }
+  },
+  slideOutToRight: {
+    "0%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateX(10px)",
+      opacity: "0"
+    }
+  }
+};
+
+// ../tailwind-config/src/animation/index.ts
+var animation = { ...sliceAnimation, ...barAnimation };
+var keyframes = { ...sliceKeyframe, ...barKeyframe };
+
+// ../tailwind-config/src/shadow/index.ts
+var boxShadow = {
+  "border-1": "inner 0 0 0 1px inset",
+  "border-2": "inner 0 0 0 2px inset",
+  "border-3": "inner 0 0 0 3px inset",
+  "border-4": "inner 0 0 0 4px inset",
+  "border-5": "inner 0 0 0 5px inset",
+  "border-6": "inner 0 0 0 6px inset",
+  "border-7": "inner 0 0 0 7px inset",
+  "border-8": "inner 0 0 0 8px inset",
+  "border-9": "inner 0 0 0 9px inset",
+  "border-10": "inner 0 0 0 10px inset",
+  inner: "inset 0 4px 8px 0 rgba(36, 39, 44, 0.2)",
+  "inner-sm": "inset 0 4px 8px 0 rgba(0, 0, 0, 0.2)",
+  "inner-md": "inset 0 6px 12px 0 rgba(0, 0, 0, 0.2)",
+  "inner-lg": "inset 0 8px 16px 0 rgba(0, 0, 0, 0.2)",
+  "inner-xl": "inset 0 10px 20px 0 rgba(0, 0, 0, 0.2)",
+  drop: "0 20px 40px 0 rgba(36, 39, 44, 0.2)",
+  "drop-sm": "0 4px 12px 0 rgba(0, 0, 0, 0.1)",
+  "drop-md": "0 6px 18px 0 rgba(0, 0, 0, 0.1)",
+  "drop-lg": "0 8px 24px 0 rgba(0, 0, 0, 0.1)",
+  "drop-xl": "0 10px 30px 0 rgba(0, 0, 0, 0.1)"
+};
+
+// ../tailwind-config/src/border/radius.ts
+var borderRadius = {
+  sm: "4px",
+  md: "6px",
+  lg: "8px",
+  xl: "10px",
+  none: "0",
+  full: "9999px"
+};
+
+// ../tailwind-config/src/space/gap.ts
+var gap = {
+  sm: "4px",
+  md: "6px",
+  lg: "8px",
+  xl: "10px"
+};
+
+// src/utils/tailwind-variants.ts
+function typedKeys(obj) {
+  return Object.keys(obj);
+}
+var COMMON_SIZE = ["sm", "md", "lg", "xl"];
+var tv = (0, import_tailwind_variants.createTV)({
+  twMergeConfig: {
+    classGroups: {
+      fontSize: [{ text: [...typedKeys(fontSize)] }],
+      borderRadius: [{ rounded: [...typedKeys(borderRadius)] }],
+      boxShadow: [{ shadow: [...typedKeys(boxShadow)] }],
+      padding: [{ p: [...COMMON_SIZE] }],
+      gap: [{ gap: [...typedKeys(gap)] }]
+    }
+  }
+});
+
+// src/utils/props.ts
+var mapPropsVariants = (props, variantKeys, removeVariantProps = true) => {
+  if (!variantKeys) {
+    return [props, {}];
+  }
+  const picked = variantKeys.reduce((acc, key) => {
+    if (key in props) {
+      return { ...acc, [key]: props[key] };
+    } else {
+      return acc;
+    }
+  }, {});
+  if (removeVariantProps) {
+    const omitted = Object.keys(props).filter((key) => !variantKeys.includes(key)).reduce((acc, key) => ({ ...acc, [key]: props[key] }), {});
+    return [omitted, picked];
+  } else {
+    return [props, picked];
+  }
+};
+
+// src/components/button/text-button.tsx
+var import_react2 = require("react");
+
+// src/utils/clsx.ts
+function clsx(...args) {
+  var i = 0, tmp, x, str = "";
+  while (i < args.length) {
+    if (tmp = args[i++]) {
+      if (x = toVal(tmp)) {
+        str && (str += " ");
+        str += x;
+      }
+    }
+  }
+  return str;
+}
+function toVal(mix) {
+  var k, y, str = "";
+  if (typeof mix === "string" || typeof mix === "number") {
+    str += mix;
+  } else if (typeof mix === "object") {
+    if (Array.isArray(mix)) {
+      var len = mix.length;
+      for (k = 0; k < len; k++) {
+        if (mix[k]) {
+          if (y = toVal(mix[k])) {
+            str && (str += " ");
+            str += y;
+          }
+        }
+      }
+    } else {
+      for (y in mix) {
+        if (mix[y]) {
+          str && (str += " ");
+          str += y;
+        }
+      }
+    }
+  }
+  return str;
+}
+
+// src/components/button/text-button.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var TextButton = (0, import_react2.forwardRef)((originalProps, ref) => {
+  const [props, variantProps] = mapPropsVariants(originalProps, textButtonStyle.variantKeys);
+  const { children, startContent, endContent, classNames, variant, disabled, size, ...buttonProps } = {
+    ...props,
+    ...variantProps
+  };
+  const slots = (0, import_react2.useMemo)(() => textButtonStyle({ ...variantProps }), [variantProps]);
+  const getContentProps = (0, import_react2.useCallback)(() => {
+    const className = slots.content({ class: classNames == null ? void 0 : classNames.content });
+    return { className, size };
+  }, [slots, classNames, size]);
+  const renderContent = (content) => {
+    const contentProps = getContentProps();
+    if ((0, import_react2.isValidElement)(content)) {
+      const _content = content;
+      const contentProps2 = getContentProps();
+      const mergedProps = {
+        ...contentProps2,
+        ...typeof _content.props.className === "string" && {
+          className: clsx(contentProps2.className, _content.props.className)
+        }
+      };
+      return (0, import_react2.cloneElement)(_content, mergedProps);
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { ...contentProps, children: content });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "button",
+    {
+      ...buttonProps,
+      ref,
+      disabled,
+      className: clsx(
+        slots.base({ class: classNames == null ? void 0 : classNames.base }),
+        variant === "underline" && slots.underline({ class: classNames == null ? void 0 : classNames.underline })
+      ),
+      children: [
+        startContent && renderContent(startContent),
+        children,
+        endContent && renderContent(endContent)
+      ]
+    }
+  );
+});
+TextButton.displayName = "TextButton";
+var text_button_default = TextButton;
+var textButtonStyle = tv({
+  slots: {
+    base: ["flex", "items-center", "justify-center", "whitespace-nowrap", "overflow-hidden"],
+    content: [],
+    underline: ["underline", "decoration-skip-ink", "underline-offset-auto"]
+  },
+  variants: {
+    variant: {
+      "non-under": [],
+      underline: []
+    },
+    color: {
+      primary: [],
+      secondary: [],
+      neutral: [],
+      info: [],
+      success: [],
+      warning: [],
+      danger: []
+    },
+    size: {
+      sm: {
+        base: ["text-sm"],
+        underline: ["decoration-[1px]"]
+      },
+      md: {
+        base: ["text-md"],
+        underline: ["decoration-[1.25px]"]
+      },
+      lg: {
+        base: ["text-lg"],
+        underline: ["decoration-[1.5px]"]
+      },
+      xl: {
+        base: ["text-xl"],
+        underline: ["decoration-[1.75px]"]
+      }
+    },
+    disabled: {
+      true: {
+        base: ["!text-neutral-light", "pointer-events-none"]
+      }
+    },
+    isInGroup: {
+      true: {
+        base: [
+          "[&:not(:first-child):not(:last-child)]:rounded-none",
+          "first:rounded-r-none",
+          "last:rounded-l-none",
+          "[&:not(:first-child)]:border-l-0"
+        ]
+      }
+    }
+  },
+  compoundVariants: [
+    {
+      color: "primary",
+      class: {
+        base: ["text-primary-main", "hover:text-primary-dark", "active:text-primary-strong"]
+      }
+    },
+    {
+      color: "secondary",
+      class: {
+        base: ["text-secondary-main", "hover:text-secondary-dark", "active:text-secondary-strong"]
+      }
+    },
+    {
+      color: "neutral",
+      class: {
+        base: ["text-neutral-main", "hover:text-neutral-dark", "active:text-neutral-strong"]
+      }
+    },
+    {
+      color: "info",
+      class: {
+        base: ["text-info-main", "hover:text-info-dark", "active:text-info-strong"]
+      }
+    },
+    {
+      color: "success",
+      class: {
+        base: ["text-success-main", "hover:text-success-dark", "active:text-success-strong"]
+      }
+    },
+    {
+      color: "warning",
+      class: {
+        base: ["text-warning-main", "hover:text-warning-dark", "active:text-warning-strong"]
+      }
+    },
+    {
+      color: "danger",
+      class: {
+        base: ["text-danger-main", "hover:text-danger-dark", "active:text-danger-strong"]
+      }
+    }
+  ],
+  defaultVariants: {
+    size: "md",
+    color: "primary",
+    variant: "non-under",
+    disabled: false,
+    isInGroup: false
+  }
+});
+
+// src/components/picker/utils.ts
+var convert24To12 = (time24) => {
+  const [HH, MM] = time24.split(":");
+  let h = Number(HH);
+  const minute = MM || "";
+  const meridiem = h >= 12 ? "PM" : "AM";
+  let hour12 = h % 12;
+  if (hour12 === 0) hour12 = 12;
+  const hour = String(hour12).padStart(2, "0");
+  return { hour, minute, meridiem };
+};
+var getCurrent12Hour = () => {
+  const now = /* @__PURE__ */ new Date();
+  let hour = now.getHours();
+  const minute = String(now.getMinutes()).padStart(2, "0");
+  const meridiem = hour >= 12 ? "PM" : "AM";
+  hour = hour % 12 || 12;
+  return {
+    hour: String(hour).padStart(2, "0"),
+    minute,
+    meridiem
+  };
+};
+
+// src/components/picker/timePicker/Panel.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var hours = [...Array(12)].map((_, i) => String(i + 1).padStart(2, "0"));
+var minutes = [...Array(60)].map((_, i) => String(i).padStart(2, "0"));
+var meridiemList = ["AM", "PM"];
+var TimePickerPanel = (0, import_react3.forwardRef)(
+  ({ value, onChange, nowTitle, confirmTitle }, ref) => {
+    const [time, setTime] = (0, import_react3.useState)({ hour: "", minute: "", meridiem: "" });
+    const handleNow = () => {
+      setTime(getCurrent12Hour());
+    };
+    const handleConfirm = (time2) => {
+      const { hour, minute, meridiem } = time2;
+      let h = Number(hour);
+      if (meridiem === "AM") {
+        if (h === 12) h = 0;
+      } else {
+        if (h !== 12) h += 12;
+      }
+      const HH = String(h).padStart(2, "0");
+      const MM = minute.padStart(2, "0");
+      const SS = "00";
+      onChange(`${HH}:${MM}:${SS}`);
+    };
+    (0, import_react3.useEffect)(() => {
+      setTime(value ? convert24To12(value) : getCurrent12Hour());
+    }, [value]);
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { ref, className: "flex gap-[10px]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center justify-center gap-[5px]", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(WheelColumn, { list: hours, value: time.hour, onChange: (v) => setTime({ ...time, hour: v }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "w-[5px] text-sm font-bold", children: ":" }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(WheelColumn, { list: minutes, value: time.minute, onChange: (v) => setTime({ ...time, minute: v }) })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(WheelColumn, { list: meridiemList, value: time.meridiem, onChange: (v) => setTime({ ...time, meridiem: v }) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex justify-between px-1 text-sm", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          text_button_default,
+          {
+            variant: "underline",
+            color: "neutral",
+            size: "sm",
+            classNames: { base: "font-bold" },
+            onClick: handleNow,
+            children: nowTitle
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          text_button_default,
+          {
+            variant: "underline",
+            size: "sm",
+            classNames: { base: "font-bold" },
+            onClick: () => handleConfirm(time),
+            children: confirmTitle
+          }
+        )
+      ] })
+    ] });
+  }
+);
+var Panel_default = TimePickerPanel;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TimePickerPanel
+});