@canlooks/can-ui 0.0.184 → 0.0.185

package/dist/cjs/components/autocomplete/autocomplete.js

@@ -94,8 +94,7 @@ exports.Autocomplete = (0, react_1.memo)(({ children, loading, options, loadOpti
             css: popper_style_1.popperStyle,
             open: open.current,
             popperRef,
-            onOpenChange: setOpen,
-            onPointerDown: e => e.preventDefault()
+            onOpenChange: setOpen
         }), children: renderInput
             ? renderInput(inputProps)
             : (0, jsx_runtime_1.jsx)(input_1.Input, { ...inputProps }) }));

package/dist/cjs/components/calendar/calendar.js

@@ -13,7 +13,21 @@ const panelMonth_1 = require("./panelMonth");
 const Calendar = ({ viewLevel = 'date', showToday = true, dateButtonProps, todayButtonText = '回今天', todayButtonProps, size = 'medium', defaultValue = null, min, max, disabledDates, value, onChange, _defaultNull, ...props }) => {
     const [innerValue, setInnerValue] = (0, utils_1.useControlled)(defaultValue, value, onChange);
     const [viewType, setViewType] = (0, utils_1.useDerivedState)(viewLevel);
-    const [innerD, setInnerD] = (0, utils_1.useDerivedState)(() => innerValue.current ?? (0, dayjs_1.default)().startOf('date'), [innerValue.current]);
+    const [innerD, setInnerD] = (0, utils_1.useDerivedState)(() => {
+        if (innerValue.current) {
+            return innerValue.current;
+        }
+        const today = (0, dayjs_1.default)().startOf('date');
+        const _min = min?.add(1, 'day');
+        if (_min?.isAfter(today, 'month')) {
+            return _min;
+        }
+        const _max = max?.subtract(1, 'day');
+        if (_max?.isBefore(today, 'month')) {
+            return _max;
+        }
+        return today;
+    }, [innerValue.current, min, max]);
     const commonProps = {
         value: innerValue.current,
         setValue: setInnerValue,

package/dist/cjs/components/clickAway/clickAway.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ClickAway = ClickAway;
 const react_1 = require("react");
 const utils_1 = require("../../utils");
-function ClickAway({ ref, container = self, eventType = 'click', onClickAway, disabled, children, targets, ...props }) {
+function ClickAway({ ref, container = self, eventType = 'pointerdown', onClickAway, disabled, children, targets, ...props }) {
     const syncOnClickAway = (0, utils_1.useSync)(onClickAway);
     const childRef = (0, react_1.useRef)(null);
     const targetsArr = (0, react_1.useRef)([]);

package/dist/cjs/components/dateTimePicker/dateTimePicker.js

@@ -2,11 +2,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DateTimePicker = void 0;
 exports.useDateTimePickerContext = useDateTimePickerContext;
-const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("react");
 const dateTimePicker_style_1 = require("./dateTimePicker.style");
-const dayjs_1 = tslib_1.__importDefault(require("dayjs"));
 const inputBase_1 = require("../inputBase");
 const utils_1 = require("../../utils");
 const popper_1 = require("../popper");
@@ -21,9 +19,9 @@ function useDateTimePickerContext() {
 }
 exports.DateTimePicker = (0, react_1.memo)(({ inputProps, popperProps, min, max, disabledDates, disabledHours, disabledMinutes, disabledSeconds, format = 'YYYY-MM-DD', defaultValue = null, value, onChange, defaultOpen = false, open, onOpenChange, autoClose = !/[Hms]/.test(format), ...props }) => {
     const [innerOpen, setInnerOpen] = (0, utils_1.useControlled)(defaultOpen, open, onOpenChange);
-    const [dateValue, _setDateValue] = (0, utils_1.useControlled)(defaultValue, value, onChange);
-    const setDateValue = (date) => {
-        _setDateValue(date);
+    const [innerValue, _setInnerValue] = (0, utils_1.useControlled)(defaultValue, value, onChange);
+    const setInnerValue = (date) => {
+        _setInnerValue(date);
         autoClose && setInnerOpen(false);
     };
     const contextValue = (0, react_1.useMemo)(() => ({
@@ -33,8 +31,6 @@ exports.DateTimePicker = (0, react_1.memo)(({ inputProps, popperProps, min, max,
     ]);
     const showCalendar = /[YMD]/.test(format);
     const showTimer = /[Hms]/.test(format);
-    // 若外部没有值，内部需要“现在”作为默认值
-    const innerValue = dateValue.current || (0, dayjs_1.default)();
     return ((0, jsx_runtime_1.jsx)(popper_1.Popper, { ...(0, utils_1.mergeComponentProps)({
             css: dateTimePicker_style_1.datePickerPopperStyle,
             open: innerOpen.current,
@@ -44,21 +40,20 @@ exports.DateTimePicker = (0, react_1.memo)(({ inputProps, popperProps, min, max,
             content: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [showCalendar &&
                         (0, jsx_runtime_1.jsx)(calendar_1.Calendar, { viewLevel: format.includes('D') ? 'date'
                                 : format.includes('M') ? 'month'
-                                    : 'year', _defaultNull: !dateValue.current, value: innerValue, onChange: setDateValue, min: min, max: max, disabledDates: disabledDates, todayButtonText: showTimer ? '现在' : void 0 }), showTimer &&
-                        (0, jsx_runtime_1.jsx)(DateTimePickerContext, { value: contextValue, children: (0, jsx_runtime_1.jsx)(timer_1.Timer, { showHours: format.includes('H'), showMinutes: format.includes('m'), showSeconds: format.includes('s'), value: dateValue.current, onChange: setDateValue }) })] }))
+                                    : 'year', _defaultNull: !innerValue.current, value: innerValue.current, onChange: setInnerValue, min: min, max: max, disabledDates: disabledDates, todayButtonText: showTimer ? '现在' : void 0 }), showTimer &&
+                        (0, jsx_runtime_1.jsx)(DateTimePickerContext, { value: contextValue, children: (0, jsx_runtime_1.jsx)(timer_1.Timer, { showHours: format.includes('H'), showMinutes: format.includes('m'), showSeconds: format.includes('s'), value: innerValue.current, onChange: setInnerValue }) })] }))
         }, popperProps, {
-            onOpenChange: setInnerOpen,
-            onPointerDown: e => e.preventDefault()
+            onOpenChange: setInnerOpen
         }), children: (0, jsx_runtime_1.jsx)(inputBase_1.InputBase, { ...(0, utils_1.mergeComponentProps)(props, {
                 css: dateTimePicker_style_1.style,
                 className: dateTimePicker_style_1.classes.root,
-                value: dateValue.current,
+                value: innerValue.current,
                 onClear() {
-                    setDateValue(null);
+                    setInnerValue(null);
                 }
-            }), "data-focused": innerOpen.current, children: inputBaseProps => (0, jsx_runtime_1.jsxs)("div", { className: dateTimePicker_style_1.classes.container, children: [!dateValue.current
+            }), "data-focused": innerOpen.current, children: inputBaseProps => (0, jsx_runtime_1.jsxs)("div", { className: dateTimePicker_style_1.classes.container, children: [!innerValue.current
                         ? (0, jsx_runtime_1.jsx)("div", { className: dateTimePicker_style_1.classes.placeholder, children: props.placeholder ?? '请选择' })
-                        : (0, jsx_runtime_1.jsx)("div", { className: dateTimePicker_style_1.classes.backfill, children: dateValue.current.format(format) }), (0, jsx_runtime_1.jsx)("input", { size: 1, ...(0, utils_1.mergeComponentProps)(inputBaseProps, inputProps), "data-hidden": "true" }), (0, jsx_runtime_1.jsx)("div", { className: dateTimePicker_style_1.classes.dateTimeIcon, children: showTimer && !showCalendar
+                        : (0, jsx_runtime_1.jsx)("div", { className: dateTimePicker_style_1.classes.backfill, children: innerValue.current.format(format) }), (0, jsx_runtime_1.jsx)("input", { size: 1, ...(0, utils_1.mergeComponentProps)(inputBaseProps, inputProps), "data-hidden": "true" }), (0, jsx_runtime_1.jsx)("div", { className: dateTimePicker_style_1.classes.dateTimeIcon, children: showTimer && !showCalendar
                             ? (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faClock_1.faClock })
                             : (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCalendar_1.faCalendar }) })] }) }) }));
 });

package/dist/cjs/components/dateTimeRangePicker/dateTimeRangePicker.js

@@ -23,11 +23,10 @@ variant, size, color, disabled, readOnly, autoFocus, ...props }) => {
                     autoFocus,
                     autoClose: false,
                     placeholder: showTimer ? '开始时间' : '开始日期',
-                    max: innerValue.current?.[1] || void 0,
                     open: innerOpen.current === 'start'
                 }
                 : {
-                    autoClose,
+                    autoClose: false,
                     placeholder: showTimer ? '结束时间' : '结束日期',
                     min: innerValue.current?.[0] || void 0,
                     open: innerOpen.current === 'end'
@@ -37,12 +36,22 @@ variant, size, color, disabled, readOnly, autoFocus, ...props }) => {
                 ? {
                     onOpenChange: open => setInnerOpen(open ? 'start' : 'closed'),
                     value: innerValue.current?.[0],
-                    onChange: value => {
-                        setInnerValue(o => [value, o?.[1] || null]);
-                        if (value && !showTimer) {
+                    onChange: start => {
+                        setInnerValue(o => {
+                            const end = o?.[1]
+                                ? start?.isAfter(o[1], 'date') ? null : o[1]
+                                : null;
+                            return [start, end];
+                        });
+                        if (start && !showTimer) {
                             requestAnimationFrame(() => {
-                                endPickerInputRef.current.focus();
-                                innerOpen.current === 'start' && setInnerOpen('end');
+                                if (!innerValue.current?.[1]) {
+                                    endPickerInputRef.current.focus();
+                                    innerOpen.current === 'start' && setInnerOpen('end');
+                                }
+                                else {
+                                    setInnerOpen('closed');
+                                }
                             });
                         }
                     }

package/dist/cjs/components/popper/popper.js

@@ -559,5 +559,8 @@ function Popper({ ref, popperRef, anchorElement, container, effectContainer, con
                                 transform: 'scale(1)'
                             },
                             ...props.style
-                        }, "data-open": innerOpen.current, "data-variant": variant, "data-place-a": placeA.current, "data-place-b": placeB.current, "data-animation": animation, onTransitionEnd: onTransitionEnd, children: (0, jsx_runtime_1.jsx)(popperContext_1.PopperContext, { value: contextValue, children: content }) }) }) }), containerEl.current)] }));
+                        }, "data-open": innerOpen.current, "data-variant": variant, "data-place-a": placeA.current, "data-place-b": placeB.current, "data-animation": animation, onPointerDown: e => {
+                            props.onPointerDown?.(e);
+                            e.preventDefault();
+                        }, onTransitionEnd: onTransitionEnd, children: (0, jsx_runtime_1.jsx)(popperContext_1.PopperContext, { value: contextValue, children: content }) }) }) }), containerEl.current)] }));
 }

package/dist/cjs/components/selectBase/selectBase.js

@@ -84,8 +84,7 @@ multiple = false, renderBackfill, _internalProps: { labelKey, optionsMap, innerV
         }, popperProps, {
             popperRef,
             onOpenChange: openChangeHandler,
-            onOpenChangeEnd: openChangeEnd,
-            onPointerDown: e => e.preventDefault()
+            onOpenChangeEnd: openChangeEnd
         }), children: (0, jsx_runtime_1.jsx)(inputBase_1.InputBase, { clearable: multiple, ...(0, utils_1.mergeComponentProps)(props, {
                 css: selectBase_style_1.style,
                 className: selectBase_style_1.classes.root,

package/dist/esm/components/autocomplete/autocomplete.js

@@ -91,8 +91,7 @@ export const Autocomplete = memo(({ children, loading, options, loadOptions, pri
             css: popperStyle,
             open: open.current,
             popperRef,
-            onOpenChange: setOpen,
-            onPointerDown: e => e.preventDefault()
+            onOpenChange: setOpen
         }), children: renderInput
             ? renderInput(inputProps)
             : _jsx(Input, { ...inputProps }) }));

package/dist/esm/components/calendar/calendar.js

@@ -9,7 +9,21 @@ import { PanelMonth } from './panelMonth.js';
 export const Calendar = ({ viewLevel = 'date', showToday = true, dateButtonProps, todayButtonText = '回今天', todayButtonProps, size = 'medium', defaultValue = null, min, max, disabledDates, value, onChange, _defaultNull, ...props }) => {
     const [innerValue, setInnerValue] = useControlled(defaultValue, value, onChange);
     const [viewType, setViewType] = useDerivedState(viewLevel);
-    const [innerD, setInnerD] = useDerivedState(() => innerValue.current ?? dayjs().startOf('date'), [innerValue.current]);
+    const [innerD, setInnerD] = useDerivedState(() => {
+        if (innerValue.current) {
+            return innerValue.current;
+        }
+        const today = dayjs().startOf('date');
+        const _min = min?.add(1, 'day');
+        if (_min?.isAfter(today, 'month')) {
+            return _min;
+        }
+        const _max = max?.subtract(1, 'day');
+        if (_max?.isBefore(today, 'month')) {
+            return _max;
+        }
+        return today;
+    }, [innerValue.current, min, max]);
     const commonProps = {
         value: innerValue.current,
         setValue: setInnerValue,

package/dist/esm/components/clickAway/clickAway.js

@@ -1,6 +1,6 @@
 import { cloneElement, isValidElement, useEffect, useRef } from 'react';
 import { cloneRef, isChildOf, toArray, useSync } from '../../utils/index.js';
-export function ClickAway({ ref, container = self, eventType = 'click', onClickAway, disabled, children, targets, ...props }) {
+export function ClickAway({ ref, container = self, eventType = 'pointerdown', onClickAway, disabled, children, targets, ...props }) {
     const syncOnClickAway = useSync(onClickAway);
     const childRef = useRef(null);
     const targetsArr = useRef([]);

package/dist/esm/components/dateTimePicker/dateTimePicker.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
 import { createContext, memo, useContext, useMemo } from 'react';
 import { classes, datePickerPopperStyle, style } from './dateTimePicker.style.js';
-import dayjs from 'dayjs';
 import { InputBase } from '../inputBase/index.js';
 import { mergeComponentProps, useControlled } from '../../utils/index.js';
 import { Popper } from '../popper/index.js';
@@ -16,9 +15,9 @@ export function useDateTimePickerContext() {
 }
 export const DateTimePicker = memo(({ inputProps, popperProps, min, max, disabledDates, disabledHours, disabledMinutes, disabledSeconds, format = 'YYYY-MM-DD', defaultValue = null, value, onChange, defaultOpen = false, open, onOpenChange, autoClose = !/[Hms]/.test(format), ...props }) => {
     const [innerOpen, setInnerOpen] = useControlled(defaultOpen, open, onOpenChange);
-    const [dateValue, _setDateValue] = useControlled(defaultValue, value, onChange);
-    const setDateValue = (date) => {
-        _setDateValue(date);
+    const [innerValue, _setInnerValue] = useControlled(defaultValue, value, onChange);
+    const setInnerValue = (date) => {
+        _setInnerValue(date);
         autoClose && setInnerOpen(false);
     };
     const contextValue = useMemo(() => ({
@@ -28,8 +27,6 @@ export const DateTimePicker = memo(({ inputProps, popperProps, min, max, disable
     ]);
     const showCalendar = /[YMD]/.test(format);
     const showTimer = /[Hms]/.test(format);
-    // 若外部没有值，内部需要“现在”作为默认值
-    const innerValue = dateValue.current || dayjs();
     return (_jsx(Popper, { ...mergeComponentProps({
             css: datePickerPopperStyle,
             open: innerOpen.current,
@@ -39,21 +36,20 @@ export const DateTimePicker = memo(({ inputProps, popperProps, min, max, disable
             content: (_jsxs(_Fragment, { children: [showCalendar &&
                         _jsx(Calendar, { viewLevel: format.includes('D') ? 'date'
                                 : format.includes('M') ? 'month'
-                                    : 'year', _defaultNull: !dateValue.current, value: innerValue, onChange: setDateValue, min: min, max: max, disabledDates: disabledDates, todayButtonText: showTimer ? '现在' : void 0 }), showTimer &&
-                        _jsx(DateTimePickerContext, { value: contextValue, children: _jsx(Timer, { showHours: format.includes('H'), showMinutes: format.includes('m'), showSeconds: format.includes('s'), value: dateValue.current, onChange: setDateValue }) })] }))
+                                    : 'year', _defaultNull: !innerValue.current, value: innerValue.current, onChange: setInnerValue, min: min, max: max, disabledDates: disabledDates, todayButtonText: showTimer ? '现在' : void 0 }), showTimer &&
+                        _jsx(DateTimePickerContext, { value: contextValue, children: _jsx(Timer, { showHours: format.includes('H'), showMinutes: format.includes('m'), showSeconds: format.includes('s'), value: innerValue.current, onChange: setInnerValue }) })] }))
         }, popperProps, {
-            onOpenChange: setInnerOpen,
-            onPointerDown: e => e.preventDefault()
+            onOpenChange: setInnerOpen
         }), children: _jsx(InputBase, { ...mergeComponentProps(props, {
                 css: style,
                 className: classes.root,
-                value: dateValue.current,
+                value: innerValue.current,
                 onClear() {
-                    setDateValue(null);
+                    setInnerValue(null);
                 }
-            }), "data-focused": innerOpen.current, children: inputBaseProps => _jsxs("div", { className: classes.container, children: [!dateValue.current
+            }), "data-focused": innerOpen.current, children: inputBaseProps => _jsxs("div", { className: classes.container, children: [!innerValue.current
                         ? _jsx("div", { className: classes.placeholder, children: props.placeholder ?? '请选择' })
-                        : _jsx("div", { className: classes.backfill, children: dateValue.current.format(format) }), _jsx("input", { size: 1, ...mergeComponentProps(inputBaseProps, inputProps), "data-hidden": "true" }), _jsx("div", { className: classes.dateTimeIcon, children: showTimer && !showCalendar
+                        : _jsx("div", { className: classes.backfill, children: innerValue.current.format(format) }), _jsx("input", { size: 1, ...mergeComponentProps(inputBaseProps, inputProps), "data-hidden": "true" }), _jsx("div", { className: classes.dateTimeIcon, children: showTimer && !showCalendar
                             ? _jsx(Icon, { icon: faClock })
                             : _jsx(Icon, { icon: faCalendar }) })] }) }) }));
 });

package/dist/esm/components/dateTimeRangePicker/dateTimeRangePicker.js

@@ -20,11 +20,10 @@ variant, size, color, disabled, readOnly, autoFocus, ...props }) => {
                     autoFocus,
                     autoClose: false,
                     placeholder: showTimer ? '开始时间' : '开始日期',
-                    max: innerValue.current?.[1] || void 0,
                     open: innerOpen.current === 'start'
                 }
                 : {
-                    autoClose,
+                    autoClose: false,
                     placeholder: showTimer ? '结束时间' : '结束日期',
                     min: innerValue.current?.[0] || void 0,
                     open: innerOpen.current === 'end'
@@ -34,12 +33,22 @@ variant, size, color, disabled, readOnly, autoFocus, ...props }) => {
                 ? {
                     onOpenChange: open => setInnerOpen(open ? 'start' : 'closed'),
                     value: innerValue.current?.[0],
-                    onChange: value => {
-                        setInnerValue(o => [value, o?.[1] || null]);
-                        if (value && !showTimer) {
+                    onChange: start => {
+                        setInnerValue(o => {
+                            const end = o?.[1]
+                                ? start?.isAfter(o[1], 'date') ? null : o[1]
+                                : null;
+                            return [start, end];
+                        });
+                        if (start && !showTimer) {
                             requestAnimationFrame(() => {
-                                endPickerInputRef.current.focus();
-                                innerOpen.current === 'start' && setInnerOpen('end');
+                                if (!innerValue.current?.[1]) {
+                                    endPickerInputRef.current.focus();
+                                    innerOpen.current === 'start' && setInnerOpen('end');
+                                }
+                                else {
+                                    setInnerOpen('closed');
+                                }
                             });
                         }
                     }

package/dist/esm/components/popper/popper.js

@@ -556,5 +556,8 @@ export function Popper({ ref, popperRef, anchorElement, container, effectContain
                                 transform: 'scale(1)'
                             },
                             ...props.style
-                        }, "data-open": innerOpen.current, "data-variant": variant, "data-place-a": placeA.current, "data-place-b": placeB.current, "data-animation": animation, onTransitionEnd: onTransitionEnd, children: _jsx(PopperContext, { value: contextValue, children: content }) }) }) }), containerEl.current)] }));
+                        }, "data-open": innerOpen.current, "data-variant": variant, "data-place-a": placeA.current, "data-place-b": placeB.current, "data-animation": animation, onPointerDown: e => {
+                            props.onPointerDown?.(e);
+                            e.preventDefault();
+                        }, onTransitionEnd: onTransitionEnd, children: _jsx(PopperContext, { value: contextValue, children: content }) }) }) }), containerEl.current)] }));
 }

package/dist/esm/components/selectBase/selectBase.js

@@ -81,8 +81,7 @@ multiple = false, renderBackfill, _internalProps: { labelKey, optionsMap, innerV
         }, popperProps, {
             popperRef,
             onOpenChange: openChangeHandler,
-            onOpenChangeEnd: openChangeEnd,
-            onPointerDown: e => e.preventDefault()
+            onOpenChangeEnd: openChangeEnd
         }), children: _jsx(InputBase, { clearable: multiple, ...mergeComponentProps(props, {
                 css: style,
                 className: classes.root,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canlooks/can-ui",
-  "version": "0.0.184",
+  "version": "0.0.185",
   "author": "C.CanLiang <canlooks@gmail.com>",
   "description": "My ui framework",
   "license": "MIT",