@wisdomgarden/torque 0.1.0

package/dist/components/date-picker/components/range/range-panel.js

@@ -0,0 +1,101 @@
+"use client";
+import { jsxs as z, jsx as o } from "react/jsx-runtime";
+import { clsx as B } from "clsx";
+import "../../../../provider/ui-context.js";
+import "react";
+import { useLocale as D } from "../../../../provider/hooks.js";
+import { Button as F } from "../../../button/button.js";
+import { toDayjs as n } from "../../hooks/use-date-parser.js";
+import l from "../../styles/range-panel.module.css.js";
+import { CalendarPanel as H } from "../common/calendar-panel.js";
+import { PickerFooter as L } from "../common/picker-footer.js";
+import { TimeInputRow as M } from "../common/time-input-row.js";
+const X = ({
+  currentRange: t,
+  hover: s,
+  viewMonth: c,
+  minDate: f,
+  maxDate: p,
+  shouldDisableDate: d,
+  classNames: r,
+  withTime: h = !0,
+  withSeconds: u = !1,
+  use12Hours: v = !1,
+  hourStep: g,
+  minuteStep: b,
+  secondStep: S,
+  disabledTimeStart: T,
+  disabledTimeEnd: j,
+  presets: m,
+  onViewMonthChange: C,
+  onSelect: P,
+  onHover: k,
+  onTimeChange: y,
+  onCommitPreset: E,
+  onCancel: I,
+  onConfirm: N,
+  confirmDisabled: w
+}) => {
+  const i = D();
+  return /* @__PURE__ */ z("div", { className: l.root, children: [
+    /* @__PURE__ */ o(
+      H,
+      {
+        rangeStart: t[0],
+        rangeEnd: t[1],
+        rangeHover: s,
+        numberOfMonths: 1,
+        viewMonth: c,
+        onViewMonthChange: C,
+        onSelect: P,
+        onHover: k,
+        minDate: f,
+        maxDate: p,
+        shouldDisableDate: d,
+        classNames: r
+      }
+    ),
+    h && /* @__PURE__ */ o("div", { className: l.timeSection, children: [0, 1].map((e) => /* @__PURE__ */ o(
+      M,
+      {
+        label: e === 0 ? i.startTime || "Start time" : i.endTime || "End time",
+        d: t[e],
+        withSeconds: u,
+        use12Hours: v,
+        hourStep: g,
+        minuteStep: b,
+        secondStep: S,
+        ...e === 0 ? T : j,
+        onTimeChange: (a) => y?.(e, a)
+      },
+      e
+    )) }),
+    m && m.length > 0 && /* @__PURE__ */ o("div", { className: B(r?.presets, l.presetSection), children: m.map((e) => /* @__PURE__ */ o(
+      F,
+      {
+        variant: "light",
+        color: "regular",
+        size: "xs",
+        className: r?.presetItem,
+        onClick: () => {
+          const a = n(e.value[0]), x = n(e.value[1]);
+          E([a, x]);
+        },
+        children: e.label
+      },
+      e.label
+    )) }),
+    /* @__PURE__ */ o(
+      L,
+      {
+        className: r?.footer,
+        confirmDisabled: w,
+        onCancel: I,
+        onConfirm: N
+      }
+    )
+  ] });
+};
+export {
+  X as RangePanel
+};

package/dist/components/date-picker/components/range/range-shell.d.ts

@@ -0,0 +1,6 @@
+import type { RangeShellProps } from '../../date-picker.types';
+/**
+ * 范围选择器外壳。
+ * 共享一个只读的输入框展示「起始 `separator` 结束」格式。
+ */
+export declare const RangeShell: ({ id, opened, onOpenChange, values, canClear, defaultIconName, placeholder, clearable, disabled, readOnly, withinPortal, error, leftSection, rightSection, className, classNames, separator, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, "aria-describedby": ariaDescribedby, onClear, renderPanel, }: RangeShellProps) => import("react").JSX.Element;

package/dist/components/date-picker/components/range/range-shell.js

@@ -0,0 +1,110 @@
+"use client";
+import { jsxs as V, jsx as o } from "react/jsx-runtime";
+import { clsx as i } from "clsx";
+import { useRef as m, useMemo as d } from "react";
+import { Popover as n } from "../../../popover/index.js";
+import c from "../../styles/picker-shell.module.css.js";
+import { PickerRightSection as q } from "../common/picker-sections.js";
+import { PickerTargetInput as v } from "../common/picker-target-input.js";
+import { PickerFocusContext as z } from "../picker-focus-context.js";
+const O = ({
+  id: s,
+  opened: b,
+  onOpenChange: h,
+  values: r,
+  canClear: x,
+  defaultIconName: g = "calendar",
+  placeholder: R,
+  clearable: w = !0,
+  disabled: t,
+  readOnly: u,
+  withinPortal: y = !0,
+  error: P,
+  leftSection: S,
+  rightSection: F,
+  className: k,
+  classNames: e,
+  separator: p = "~",
+  "aria-label": $,
+  "aria-labelledby": l,
+  "aria-describedby": j,
+  onClear: C,
+  renderPanel: I
+}) => {
+  const a = m(null), f = m(null), T = d(
+    () => ({
+      register: (M) => {
+        a.current = M;
+      }
+    }),
+    []
+  ), D = d(() => !r[0] && !r[1] ? "" : `${r[0] || ""} ${p} ${r[1] || ""}`, [r, p]);
+  return /* @__PURE__ */ V(
+    n,
+    {
+      opened: b,
+      onOpenChange: h,
+      position: "bottom-start",
+      offset: 4,
+      disabled: t || u,
+      trapFocus: !0,
+      initialFocusRef: a,
+      restoreFocus: () => f.current?.focus(),
+      "aria-labelledby": l,
+      children: [
+        /* @__PURE__ */ o(n.Target, { role: "combobox", children: /* @__PURE__ */ o(
+          v,
+          {
+            inputRef: f,
+            id: s,
+            imeSafe: !1,
+            value: D,
+            readOnly: !0,
+            placeholder: R,
+            disabled: t,
+            error: P,
+            pointer: !0,
+            "aria-label": $,
+            "aria-labelledby": l,
+            "aria-describedby": j,
+            renderLeftSection: S,
+            leftIconName: g,
+            renderRightSection: /* @__PURE__ */ o(
+              q,
+              {
+                rightSection: F,
+                clearable: w,
+                canClear: x,
+                disabled: t,
+                readOnly: u,
+                onClear: C
+              }
+            ),
+            classNames: {
+              ...e?.input,
+              wrapper: i(
+                c.root,
+                e?.root,
+                k,
+                e?.input?.wrapper
+              ),
+              input: i(c.input, e?.input?.input)
+            }
+          }
+        ) }),
+        /* @__PURE__ */ o(
+          n.Dropdown,
+          {
+            className: i(c.dropdown, e?.dropdown),
+            radius: "sm",
+            withinPortal: y,
+            children: /* @__PURE__ */ o(z.Provider, { value: T, children: I() })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  O as RangeShell
+};

package/dist/components/date-picker/components/single/picker-shell.d.ts

@@ -0,0 +1,6 @@
+import type { PickerShellProps } from '../../date-picker.types';
+/**
+ * 单值选择器外壳。
+ * 提供输入框及 Popover 容器。
+ */
+export declare const PickerShell: ({ id, opened, onOpenChange, value, canClear, defaultIconName, placeholder, clearable, disabled, readOnly, withinPortal, error, leftSection, rightSection, className, classNames, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, "aria-describedby": ariaDescribedby, onClear, renderPanel, }: PickerShellProps) => import("react").JSX.Element;

package/dist/components/date-picker/components/single/picker-shell.js

@@ -0,0 +1,109 @@
+"use client";
+import { jsxs as T, jsx as e } from "react/jsx-runtime";
+import { clsx as t } from "clsx";
+import { useRef as a, useMemo as D } from "react";
+import { Popover as i } from "../../../popover/index.js";
+import n from "../../styles/picker-shell.module.css.js";
+import { PickerRightSection as M } from "../common/picker-sections.js";
+import { PickerTargetInput as q } from "../common/picker-target-input.js";
+import { PickerFocusContext as z } from "../picker-focus-context.js";
+const O = ({
+  id: s,
+  opened: m,
+  onOpenChange: f,
+  value: d,
+  canClear: b,
+  defaultIconName: h = "calendar",
+  placeholder: x,
+  clearable: P = !0,
+  disabled: o,
+  readOnly: c,
+  withinPortal: g = !0,
+  error: w,
+  leftSection: R,
+  rightSection: S,
+  className: k,
+  classNames: r,
+  "aria-label": y,
+  "aria-labelledby": u,
+  "aria-describedby": F,
+  onClear: v,
+  renderPanel: j
+}) => {
+  const p = a(null), l = a(null), C = D(
+    () => ({
+      register: (I) => {
+        p.current = I;
+      }
+    }),
+    []
+  );
+  return /* @__PURE__ */ T(
+    i,
+    {
+      opened: m,
+      onOpenChange: f,
+      position: "bottom-start",
+      offset: 4,
+      disabled: o || c,
+      trapFocus: !0,
+      initialFocusRef: p,
+      restoreFocus: () => l.current?.focus(),
+      "aria-labelledby": u,
+      children: [
+        /* @__PURE__ */ e(i.Target, { role: "combobox", children: /* @__PURE__ */ e(
+          q,
+          {
+            inputRef: l,
+            id: s,
+            imeSafe: !1,
+            value: d,
+            readOnly: !0,
+            placeholder: x,
+            disabled: o,
+            error: w,
+            pointer: !0,
+            "aria-label": y,
+            "aria-labelledby": u,
+            "aria-describedby": F,
+            renderLeftSection: R,
+            leftIconName: h,
+            renderRightSection: /* @__PURE__ */ e(
+              M,
+              {
+                rightSection: S,
+                clearable: P,
+                canClear: b,
+                disabled: o,
+                readOnly: c,
+                onClear: v
+              }
+            ),
+            classNames: {
+              ...r?.input,
+              wrapper: t(
+                n.root,
+                r?.root,
+                k,
+                r?.input?.wrapper
+              ),
+              input: t(n.input, r?.input?.input)
+            }
+          }
+        ) }),
+        /* @__PURE__ */ e(
+          i.Dropdown,
+          {
+            className: t(n.dropdown, r?.dropdown),
+            radius: "sm",
+            withinPortal: g,
+            children: /* @__PURE__ */ e(z.Provider, { value: C, children: j() })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  O as PickerShell
+};

package/dist/components/date-picker/date-picker.d.ts

@@ -0,0 +1,6 @@
+import type { DatePickerProps } from './date-picker.types';
+/**
+ * 单日期选择器。
+ * 支持受控 / 非受控、表单集成以及 `minDate` / `maxDate` 等日期限制。
+ */
+export declare const DatePicker: (props: DatePickerProps) => import("react").JSX.Element;

package/dist/components/date-picker/date-picker.js

@@ -0,0 +1,76 @@
+"use client";
+import { jsx as d } from "react/jsx-runtime";
+import { useId as E, useUncontrolled as I } from "@mantine/hooks";
+import { useState as h } from "react";
+import { dayjs as a } from "../../common/dayjs.js";
+import { useFormWrapperProps as j } from "../../common/use-form-wrapper-props.js";
+import { FormItemWrapper as k } from "../form-wrapper/form-item-wrapper.js";
+import { CalendarPanel as q } from "./components/common/calendar-panel.js";
+import { PickerShell as x } from "./components/single/picker-shell.js";
+import { formatOrEmpty as p, toDate as b } from "./hooks/use-date-parser.js";
+const T = (o) => {
+  const n = E(o.id), { wrapProps: i, rest: C, outerDescribedBy: D, formProps: l } = j(
+    o,
+    n
+  ), {
+    value: F,
+    onChange: N,
+    error: R,
+    defaultValue: g,
+    format: s = "YYYY-MM-DD",
+    minDate: V,
+    maxDate: P,
+    shouldDisableDate: v,
+    closeOnSelect: y = !0,
+    required: W,
+    borderRadius: B,
+    ...t
+  } = C, m = l ? l.value : o.value, S = l?.error ?? o.error, [M, c] = h(!1), [e, u] = I({
+    value: m !== void 0 ? b(m) : void 0,
+    defaultValue: b(g ?? null),
+    finalValue: null,
+    onChange: (r) => {
+      l?.onChange?.(r), o.onChange?.(r, p(r, s));
+    }
+  }), [O, f] = h(
+    () => e ? a(e) : a()
+  ), _ = p(e, s), w = (r) => {
+    r && f(e ? a(e) : a()), c(r);
+  }, Y = (r) => {
+    u(r.toDate()), y && c(!1);
+  };
+  return /* @__PURE__ */ d(k, { ...i, id: n, children: /* @__PURE__ */ d(
+    x,
+    {
+      ...t,
+      id: n,
+      opened: M,
+      onOpenChange: w,
+      value: _,
+      canClear: !!e,
+      placeholder: t.placeholder ?? s,
+      error: S,
+      "aria-describedby": D,
+      "aria-labelledby": i.labelId ?? t["aria-labelledby"],
+      onClear: () => {
+        u(null);
+      },
+      renderPanel: () => /* @__PURE__ */ d(
+        q,
+        {
+          selectedDate: e ? a(e) : null,
+          viewMonth: O,
+          onViewMonthChange: f,
+          onSelect: Y,
+          minDate: V,
+          maxDate: P,
+          shouldDisableDate: v,
+          classNames: t.classNames
+        }
+      )
+    }
+  ) });
+};
+export {
+  T as DatePicker
+};