clxx 2.1.8 → 3.0.0

package/build/DatePicker/Column.js

@@ -0,0 +1,330 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Column = Column;
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+const react_1 = require("react");
+// === 物理参数（统一阻尼-弹簧模型）===
+// 释放后整段运动是「单一连续 ODE」：摩擦 + 弹簧（朝预测落点），由 rAF 步进。
+// 既无双阶段切换，也不存在「等惯性停 → 启动吸附」的间隙。
+// 单位：位置 px、时间 ms、速度 px/ms、加速度 px/ms²
+// 摩擦系数：用于「预测最终落点」。指数衰减下 v(t)=v0·e^(-kt)，落点 = offset0 + v0/k
+const FRICTION_K = 0.005;
+// 弹簧刚度：朝目标项的回正力度。ω = sqrt(STIFF) ≈ 0.0134 rad/ms ≈ 470ms 周期
+const STIFF = 0.00018;
+// 阻尼比 1.0 = 临界阻尼（无超调，最快稳态）
+const DAMP_RATIO = 1.0;
+const DAMPING = 2 * Math.sqrt(STIFF) * DAMP_RATIO;
+// 边界橡皮筋：手指拖到边界外，offset 实际变化按此比例（iOS 风格）
+const RUBBER = 0.45;
+// 越界回弹：边界吸引到内边的强弹簧
+const EDGE_STIFF = 0.0006;
+const EDGE_DAMP = 2 * Math.sqrt(EDGE_STIFF);
+// 终止阈值
+const EPS_V = 0.02; // px/ms
+const EPS_X = 0.5; // px
+function Column(props) {
+    const { items, value, onChange, format, style } = props;
+    const containerRef = (0, react_1.useRef)(null);
+    const innerRef = (0, react_1.useRef)(null);
+    const [itemHeight, setItemHeight] = (0, react_1.useState)(0);
+    const [activeIndex, setActiveIndex] = (0, react_1.useState)(() => Math.max(0, items.indexOf(value)));
+    // refs 让 rAF 闭包始终读到最新值
+    const offsetRef = (0, react_1.useRef)(0);
+    const velocityRef = (0, react_1.useRef)(0);
+    const targetRef = (0, react_1.useRef)(0);
+    const animRef = (0, react_1.useRef)(0);
+    const lastFrameRef = (0, react_1.useRef)(0);
+    // 缓存上一次 activeIndex，避免每帧 setState 调度开销
+    const lastActiveRef = (0, react_1.useRef)(-1);
+    const valueRef = (0, react_1.useRef)(value);
+    valueRef.current = value;
+    const itemsRef = (0, react_1.useRef)(items);
+    itemsRef.current = items;
+    const onChangeRef = (0, react_1.useRef)(onChange);
+    onChangeRef.current = onChange;
+    const itemHeightRef = (0, react_1.useRef)(itemHeight);
+    itemHeightRef.current = itemHeight;
+    // === 测量 itemHeight（随 rem 变化）===
+    (0, react_1.useLayoutEffect)(() => {
+        const el = innerRef.current;
+        if (!el)
+            return;
+        const measure = () => {
+            const first = el.querySelector("[data-pick-item]");
+            if (first) {
+                const h = first.getBoundingClientRect().height;
+                if (h > 0)
+                    setItemHeight(h);
+            }
+        };
+        measure();
+        if (typeof ResizeObserver !== "undefined") {
+            const ro = new ResizeObserver(measure);
+            ro.observe(el);
+            return () => ro.disconnect();
+        }
+    }, []);
+    // === 渲染辅助 ===
+    const applyTransform = (offset) => {
+        const inner = innerRef.current;
+        if (inner)
+            inner.style.transform = `translate3d(0,${-offset}px,0)`;
+    };
+    const updateActive = (offset) => {
+        const ih = itemHeightRef.current;
+        if (ih === 0)
+            return;
+        const list = itemsRef.current;
+        const idx = Math.max(0, Math.min(list.length - 1, Math.round(offset / ih)));
+        if (lastActiveRef.current === idx)
+            return;
+        lastActiveRef.current = idx;
+        setActiveIndex(idx);
+    };
+    const setOffsetImmediate = (offset) => {
+        offsetRef.current = offset;
+        applyTransform(offset);
+        updateActive(offset);
+    };
+    const stopAnimation = () => {
+        if (animRef.current) {
+            cancelAnimationFrame(animRef.current);
+            animRef.current = 0;
+        }
+    };
+    // === 物理动画循环 ===
+    const startAnimation = () => {
+        stopAnimation();
+        lastFrameRef.current = performance.now();
+        const step = (now) => {
+            // dt 上限 32ms：防止页面切回时大跳，导致一帧位移过大
+            const dt = Math.min(32, now - lastFrameRef.current);
+            lastFrameRef.current = now;
+            const ih = itemHeightRef.current;
+            const list = itemsRef.current;
+            if (ih === 0 || list.length === 0) {
+                animRef.current = 0;
+                return;
+            }
+            const maxOffset = (list.length - 1) * ih;
+            let offset = offsetRef.current;
+            let velocity = velocityRef.current;
+            const target = targetRef.current;
+            // 越界判断：使用边界弹簧把 offset 拉回 [0, maxOffset]
+            let outOfBound = 0;
+            if (offset < 0)
+                outOfBound = offset;
+            else if (offset > maxOffset)
+                outOfBound = offset - maxOffset;
+            let acc;
+            if (outOfBound !== 0) {
+                // 越界期间用更强的边界弹簧；忽略原 target，先回到合法范围
+                acc = -EDGE_STIFF * outOfBound - EDGE_DAMP * velocity;
+            }
+            else {
+                acc = -STIFF * (offset - target) - DAMPING * velocity;
+            }
+            velocity += acc * dt;
+            offset += velocity * dt;
+            offsetRef.current = offset;
+            velocityRef.current = velocity;
+            applyTransform(offset);
+            updateActive(offset);
+            const settled = Math.abs(velocity) < EPS_V &&
+                Math.abs(offset - target) < EPS_X &&
+                outOfBound === 0;
+            if (settled) {
+                // 精确对齐到 target（target 已是 itemH 整数倍）
+                offsetRef.current = target;
+                velocityRef.current = 0;
+                applyTransform(target);
+                updateActive(target);
+                const idx = Math.round(target / ih);
+                const v = list[idx];
+                if (v !== valueRef.current)
+                    onChangeRef.current(v);
+                animRef.current = 0;
+                return;
+            }
+            animRef.current = requestAnimationFrame(step);
+        };
+        animRef.current = requestAnimationFrame(step);
+    };
+    // 释放：用速度预测落点 → 吸附到最近 item → 启动物理动画
+    const releaseWithVelocity = (v) => {
+        const ih = itemHeightRef.current;
+        const list = itemsRef.current;
+        if (ih === 0 || list.length === 0)
+            return;
+        const maxOffset = (list.length - 1) * ih;
+        // 摩擦预测：落点 = 当前 + v / k（指数衰减积分）
+        const projected = offsetRef.current + v / FRICTION_K;
+        const clamped = Math.max(0, Math.min(maxOffset, projected));
+        const idx = Math.max(0, Math.min(list.length - 1, Math.round(clamped / ih)));
+        targetRef.current = idx * ih;
+        velocityRef.current = v;
+        startAnimation();
+    };
+    // === 手势处理 ===
+    (0, react_1.useEffect)(() => {
+        const el = containerRef.current;
+        if (!el || itemHeight === 0)
+            return;
+        let dragging = false;
+        let lastY = 0;
+        let lastTime = 0;
+        // 手势起点：用「起点 offset + 累计位移」重算每帧位置，
+        // 避免越界橡皮筋反馈振荡（上一帧衰减后的 offset 不能再作为下一帧起点）
+        let startOffset = 0;
+        let totalDelta = 0;
+        // 速度采样：保留最近若干帧用于释放速度估算
+        let samples = [];
+        const onDown = (clientY) => {
+            stopAnimation();
+            dragging = true;
+            lastY = clientY;
+            lastTime = performance.now();
+            startOffset = offsetRef.current;
+            totalDelta = 0;
+            samples = [];
+            velocityRef.current = 0;
+        };
+        const onMove = (clientY) => {
+            if (!dragging)
+                return;
+            const ih = itemHeightRef.current;
+            const list = itemsRef.current;
+            if (ih === 0)
+                return;
+            const maxOffset = (list.length - 1) * ih;
+            const now = performance.now();
+            // 屏幕向下拖（dy>0）== 列表向下平移 == offset 减少
+            const dy = clientY - lastY;
+            const delta = -dy;
+            totalDelta += delta;
+            // 「原始位置」不受衰减影响：始终 = 起点 + 累计位移
+            const rawPos = startOffset + totalDelta;
+            // 只对越界部分衰减，避免衰减后的值反馈到下一帧产生振荡
+            let next;
+            if (rawPos < 0) {
+                next = rawPos * RUBBER;
+            }
+            else if (rawPos > maxOffset) {
+                next = maxOffset + (rawPos - maxOffset) * RUBBER;
+            }
+            else {
+                next = rawPos;
+            }
+            offsetRef.current = next;
+            applyTransform(next);
+            updateActive(next);
+            const dt = Math.max(1, now - lastTime);
+            samples.push({ dy: delta, dt, t: now });
+            // 只保留最近 100ms 的样本
+            const cutoff = now - 100;
+            while (samples.length > 0 && samples[0].t < cutoff)
+                samples.shift();
+            lastY = clientY;
+            lastTime = now;
+        };
+        const onUp = () => {
+            if (!dragging)
+                return;
+            dragging = false;
+            // 释放速度：最近 100ms 样本的总位移 / 总时间（px/ms）
+            // 等价于近 100ms 的平均速度，比单帧速度更稳，能滤掉手指最后一瞬的抖动
+            let totalDy = 0;
+            let totalDt = 0;
+            for (const s of samples) {
+                totalDy += s.dy;
+                totalDt += s.dt;
+            }
+            const v = totalDt > 0 ? totalDy / totalDt : 0;
+            releaseWithVelocity(v);
+        };
+        // touch
+        const onTouchStart = (e) => {
+            if (e.touches.length !== 1)
+                return;
+            onDown(e.touches[0].clientY);
+        };
+        const onTouchMove = (e) => {
+            if (e.touches.length !== 1)
+                return;
+            // 阻止页面滚动（touch-action: none 已防大部分，再保险）
+            if (e.cancelable)
+                e.preventDefault();
+            onMove(e.touches[0].clientY);
+        };
+        const onTouchEnd = () => onUp();
+        // mouse（document 级监听 move/up，避免拖出元素丢事件）
+        const onMouseDown = (e) => {
+            e.preventDefault();
+            onDown(e.clientY);
+        };
+        const onMouseMove = (e) => onMove(e.clientY);
+        const onMouseUp = () => onUp();
+        // wheel：直接累加到 offset，停止后启动 0 速度回弹（=纯弹簧吸附最近项）
+        let wheelTimer = 0;
+        const onWheel = (e) => {
+            e.preventDefault();
+            stopAnimation();
+            const ih = itemHeightRef.current;
+            const list = itemsRef.current;
+            if (ih === 0)
+                return;
+            const maxOffset = (list.length - 1) * ih;
+            let next = offsetRef.current + e.deltaY;
+            // 滚轮不做橡皮筋（多余），直接夹到合法范围
+            next = Math.max(0, Math.min(maxOffset, next));
+            offsetRef.current = next;
+            velocityRef.current = 0;
+            applyTransform(next);
+            updateActive(next);
+            if (wheelTimer)
+                clearTimeout(wheelTimer);
+            wheelTimer = setTimeout(() => {
+                wheelTimer = 0;
+                releaseWithVelocity(0);
+            }, 80);
+        };
+        el.addEventListener("touchstart", onTouchStart, { passive: false });
+        el.addEventListener("touchmove", onTouchMove, { passive: false });
+        el.addEventListener("touchend", onTouchEnd);
+        el.addEventListener("touchcancel", onTouchEnd);
+        el.addEventListener("mousedown", onMouseDown);
+        document.addEventListener("mousemove", onMouseMove);
+        document.addEventListener("mouseup", onMouseUp);
+        el.addEventListener("wheel", onWheel, { passive: false });
+        return () => {
+            el.removeEventListener("touchstart", onTouchStart);
+            el.removeEventListener("touchmove", onTouchMove);
+            el.removeEventListener("touchend", onTouchEnd);
+            el.removeEventListener("touchcancel", onTouchEnd);
+            el.removeEventListener("mousedown", onMouseDown);
+            document.removeEventListener("mousemove", onMouseMove);
+            document.removeEventListener("mouseup", onMouseUp);
+            el.removeEventListener("wheel", onWheel);
+            if (wheelTimer)
+                clearTimeout(wheelTimer);
+            stopAnimation();
+        };
+    }, [itemHeight]);
+    // === 同步外部 value（含首次 itemHeight 测量） ===
+    // 用 useLayoutEffect 避免首帧闪烁（在浏览器绘制前同步 transform）
+    (0, react_1.useLayoutEffect)(() => {
+        const ih = itemHeightRef.current;
+        if (ih === 0)
+            return;
+        const idx = items.indexOf(value);
+        if (idx < 0)
+            return;
+        const target = idx * ih;
+        if (Math.abs(offsetRef.current - target) > 0.5) {
+            stopAnimation();
+            velocityRef.current = 0;
+            setOffsetImmediate(target);
+        }
+    }, [value, items, itemHeight]);
+    return ((0, jsx_runtime_1.jsx)("div", { ref: containerRef, css: style.column, children: (0, jsx_runtime_1.jsxs)("div", { ref: innerRef, css: style.columnInner, children: [(0, jsx_runtime_1.jsx)("div", { css: style.spacer }), items.map((v, i) => ((0, jsx_runtime_1.jsx)("div", { "data-pick-item": true, css: [style.item, i === activeIndex && style.itemActive], children: format ? format(v) : v }, v))), (0, jsx_runtime_1.jsx)("div", { css: style.spacer })] }) }));
+}

package/build/DatePicker/index.d.ts

@@ -0,0 +1,32 @@
+import { ReactNode } from "react";
+import { Dayjs } from "dayjs";
+export type DatePickerPrecision = "day" | "hour" | "minute" | "second";
+export type DateInput = Date | string | number | Dayjs;
+export interface DatePickerUnits {
+    year?: string;
+    month?: string;
+    day?: string;
+    hour?: string;
+    minute?: string;
+    second?: string;
+}
+export declare const DEFAULT_UNITS: Required<DatePickerUnits>;
+export interface DatePickerProps {
+    value?: DateInput;
+    precision?: DatePickerPrecision;
+    title?: ReactNode;
+    cancelText?: ReactNode;
+    confirmText?: ReactNode;
+    maskClosable?: boolean;
+    primary?: string;
+    rounded?: boolean;
+    showUnit?: boolean;
+    units?: DatePickerUnits;
+    minDate?: DateInput;
+    maxDate?: DateInput;
+    onClose?: () => void;
+    onCancel?: () => void;
+    onConfirm?: (date: Dayjs) => void;
+}
+export declare function DatePicker(props: DatePickerProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export declare function showDatePicker(options?: Pick<DatePickerProps, "value" | "precision" | "title" | "cancelText" | "confirmText" | "maskClosable" | "primary" | "rounded" | "showUnit" | "units" | "minDate" | "maxDate" | "onCancel" | "onConfirm">): void;

package/build/DatePicker/index.js

@@ -0,0 +1,230 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_UNITS = void 0;
+exports.DatePicker = DatePicker;
+exports.showDatePicker = showDatePicker;
+const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+const react_1 = require("react");
+const dayjs_1 = __importDefault(require("dayjs"));
+const Dialog_1 = require("../Dialog");
+const Clickable_1 = require("../Clickable");
+const style_1 = require("./style");
+const Column_1 = require("./Column");
+exports.DEFAULT_UNITS = {
+    year: "年",
+    month: "月",
+    day: "日",
+    hour: "时",
+    minute: "分",
+    second: "秒",
+};
+// ----------------- 主组件 -----------------
+function toDayjs(v) {
+    if (v === undefined)
+        return (0, dayjs_1.default)();
+    // dayjs 可以接收 Date/string/number/Dayjs
+    const d = (0, dayjs_1.default)(v);
+    return d.isValid() ? d : (0, dayjs_1.default)();
+}
+function range(start, end) {
+    const arr = [];
+    for (let i = start; i <= end; i++)
+        arr.push(i);
+    return arr;
+}
+const pad2 = (n) => (n < 10 ? "0" + n : "" + n);
+function DatePicker(props) {
+    const { value, precision = "day", title = "请选择", cancelText = "取消", confirmText = "确定", primary = style_1.DEFAULT_PRIMARY, rounded = true, showUnit = true, units, minDate, maxDate, onClose, onCancel, onConfirm, } = props;
+    const style = (0, react_1.useMemo)(() => (0, style_1.createStyle)(primary, rounded), [primary, rounded]);
+    // 合并单位配置：用户部分覆盖 + 默认中文
+    const u = (0, react_1.useMemo)(() => (Object.assign(Object.assign({}, exports.DEFAULT_UNITS), units)), [units]);
+    // showUnit=false 时不追加单位后缀
+    const suffix = (key) => (showUnit ? u[key] : "");
+    const minD = (0, react_1.useMemo)(() => (minDate !== undefined ? toDayjs(minDate) : (0, dayjs_1.default)("1900-01-01")), [minDate]);
+    const maxD = (0, react_1.useMemo)(() => maxDate !== undefined ? toDayjs(maxDate) : (0, dayjs_1.default)("2100-12-31 23:59:59"), [maxDate]);
+    // 初始值限制在 [minD, maxD] 范围内
+    const initial = (0, react_1.useMemo)(() => {
+        let d = toDayjs(value);
+        if (d.isBefore(minD))
+            d = minD;
+        if (d.isAfter(maxD))
+            d = maxD;
+        return d;
+    }, [value, minD, maxD]);
+    const [year, setYear] = (0, react_1.useState)(initial.year());
+    const [month, setMonth] = (0, react_1.useState)(initial.month() + 1); // 1-12
+    const [day, setDay] = (0, react_1.useState)(initial.date());
+    const [hour, setHour] = (0, react_1.useState)(initial.hour());
+    const [minute, setMinute] = (0, react_1.useState)(initial.minute());
+    const [second, setSecond] = (0, react_1.useState)(initial.second());
+    const showHour = precision !== "day";
+    const showMinute = precision === "minute" || precision === "second";
+    const showSecond = precision === "second";
+    // 各列范围计算（考虑 min/max）
+    const years = (0, react_1.useMemo)(() => range(minD.year(), maxD.year()), [minD, maxD]);
+    const months = (0, react_1.useMemo)(() => {
+        let s = 1;
+        let e = 12;
+        if (year === minD.year())
+            s = minD.month() + 1;
+        if (year === maxD.year())
+            e = maxD.month() + 1;
+        if (s > e) {
+            // 不应发生；兜底返回单月
+            return [s];
+        }
+        return range(s, e);
+    }, [year, minD, maxD]);
+    const days = (0, react_1.useMemo)(() => {
+        const daysInMonth = (0, dayjs_1.default)(`${year}-${pad2(month)}-01`).daysInMonth();
+        let s = 1;
+        let e = daysInMonth;
+        if (year === minD.year() && month === minD.month() + 1)
+            s = minD.date();
+        if (year === maxD.year() && month === maxD.month() + 1)
+            e = maxD.date();
+        if (s > e)
+            return [s];
+        return range(s, e);
+    }, [year, month, minD, maxD]);
+    const hours = (0, react_1.useMemo)(() => {
+        let s = 0;
+        let e = 23;
+        if (year === minD.year() &&
+            month === minD.month() + 1 &&
+            day === minD.date())
+            s = minD.hour();
+        if (year === maxD.year() &&
+            month === maxD.month() + 1 &&
+            day === maxD.date())
+            e = maxD.hour();
+        if (s > e)
+            return [s];
+        return range(s, e);
+    }, [year, month, day, minD, maxD]);
+    const minutes = (0, react_1.useMemo)(() => {
+        let s = 0;
+        let e = 59;
+        if (year === minD.year() &&
+            month === minD.month() + 1 &&
+            day === minD.date() &&
+            hour === minD.hour())
+            s = minD.minute();
+        if (year === maxD.year() &&
+            month === maxD.month() + 1 &&
+            day === maxD.date() &&
+            hour === maxD.hour())
+            e = maxD.minute();
+        if (s > e)
+            return [s];
+        return range(s, e);
+    }, [year, month, day, hour, minD, maxD]);
+    const seconds = (0, react_1.useMemo)(() => {
+        let s = 0;
+        let e = 59;
+        if (year === minD.year() &&
+            month === minD.month() + 1 &&
+            day === minD.date() &&
+            hour === minD.hour() &&
+            minute === minD.minute())
+            s = minD.second();
+        if (year === maxD.year() &&
+            month === maxD.month() + 1 &&
+            day === maxD.date() &&
+            hour === maxD.hour() &&
+            minute === maxD.minute())
+            e = maxD.second();
+        if (s > e)
+            return [s];
+        return range(s, e);
+    }, [year, month, day, hour, minute, minD, maxD]);
+    // 联动夹取：超出范围 → 夹到最近边界（小于 min 取首；大于 max 取尾）
+    const clampToList = (v, list) => {
+        if (list.includes(v))
+            return v;
+        if (v < list[0])
+            return list[0];
+        return list[list.length - 1];
+    };
+    (0, react_1.useEffect)(() => {
+        const next = clampToList(month, months);
+        if (next !== month)
+            setMonth(next);
+    }, [months, month]);
+    (0, react_1.useEffect)(() => {
+        const next = clampToList(day, days);
+        if (next !== day)
+            setDay(next);
+    }, [days, day]);
+    (0, react_1.useEffect)(() => {
+        if (!showHour)
+            return;
+        const next = clampToList(hour, hours);
+        if (next !== hour)
+            setHour(next);
+    }, [hours, hour, showHour]);
+    (0, react_1.useEffect)(() => {
+        if (!showMinute)
+            return;
+        const next = clampToList(minute, minutes);
+        if (next !== minute)
+            setMinute(next);
+    }, [minutes, minute, showMinute]);
+    (0, react_1.useEffect)(() => {
+        if (!showSecond)
+            return;
+        const next = clampToList(second, seconds);
+        if (next !== second)
+            setSecond(next);
+    }, [seconds, second, showSecond]);
+    // 关闭：动画与卸载交由 Dialog 处理
+    const handleCancel = () => {
+        onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+        onClose === null || onClose === void 0 ? void 0 : onClose();
+    };
+    const handleConfirm = () => {
+        const hh = showHour ? hour : 0;
+        const mm = showMinute ? minute : 0;
+        const ss = showSecond ? second : 0;
+        // 用 ISO 字符串构造，避免链式 set 时的月份溢出问题
+        const d = (0, dayjs_1.default)(`${year}-${pad2(month)}-${pad2(day)}T${pad2(hh)}:${pad2(mm)}:${pad2(ss)}`);
+        onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(d);
+        onClose === null || onClose === void 0 ? void 0 : onClose();
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { css: style.sheet, children: [(0, jsx_runtime_1.jsxs)("div", { css: style.header, children: [(0, jsx_runtime_1.jsx)(Clickable_1.Clickable, { css: [style.btn, style.btnCancel], onClick: handleCancel, children: cancelText }), (0, jsx_runtime_1.jsx)("div", { css: style.title, children: title }), (0, jsx_runtime_1.jsx)(Clickable_1.Clickable, { css: [style.btn, style.btnConfirm], onClick: handleConfirm, children: confirmText })] }), (0, jsx_runtime_1.jsxs)("div", { css: style.body, children: [(0, jsx_runtime_1.jsx)("div", { css: style.indicator }), (0, jsx_runtime_1.jsx)(Column_1.Column, { items: years, value: year, onChange: setYear, format: (n) => `${n}${suffix("year")}`, style: style }), (0, jsx_runtime_1.jsx)(Column_1.Column, { items: months, value: month, onChange: setMonth, format: (n) => `${pad2(n)}${suffix("month")}`, style: style }), (0, jsx_runtime_1.jsx)(Column_1.Column, { items: days, value: day, onChange: setDay, format: (n) => `${pad2(n)}${suffix("day")}`, style: style }), showHour && ((0, jsx_runtime_1.jsx)(Column_1.Column, { items: hours, value: hour, onChange: setHour, format: (n) => `${pad2(n)}${suffix("hour")}`, style: style })), showMinute && ((0, jsx_runtime_1.jsx)(Column_1.Column, { items: minutes, value: minute, onChange: setMinute, format: (n) => `${pad2(n)}${suffix("minute")}`, style: style })), showSecond && ((0, jsx_runtime_1.jsx)(Column_1.Column, { items: seconds, value: second, onChange: setSecond, format: (n) => `${pad2(n)}${suffix("second")}`, style: style }))] })] }));
+}
+function showDatePicker(options = {}) {
+    const { maskClosable = true, onCancel } = options, rest = __rest(options, ["maskClosable", "onCancel"]);
+    // 防止动画结束前重复触发 close（双击确认/取消、close 后再点遮罩等场景）
+    let closing = false;
+    let close;
+    const requestClose = () => {
+        if (closing)
+            return;
+        closing = true;
+        close === null || close === void 0 ? void 0 : close();
+    };
+    close = (0, Dialog_1.showDialog)({
+        type: "pullUp",
+        blankClosable: maskClosable,
+        // 点击空白时同步补发 onCancel 通知（关闭动画并行进行）
+        onBlankClick: () => {
+            onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+        },
+        content: ((0, jsx_runtime_1.jsx)(DatePicker, Object.assign({}, rest, { onCancel: onCancel, onClose: requestClose }))),
+    });
+}

package/build/DatePicker/style.d.ts

@@ -0,0 +1,6 @@
+import { Interpolation, Theme } from "@emotion/react";
+export declare const ITEM_HEIGHT_REM = 0.8;
+export declare const VISIBLE_ROWS = 5;
+export type DatePickerStyle = Record<string, Interpolation<Theme>>;
+export declare function createStyle(primary: string, rounded?: boolean): DatePickerStyle;
+export declare const DEFAULT_PRIMARY = "#2f7dff";