cynx-ui 1.2.40 → 1.2.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/DatePicker.jsx +21 -3
- package/package.json +1 -1
|
@@ -42,15 +42,32 @@ function isSameDay(a, b) {
|
|
|
42
42
|
}
|
|
43
43
|
function isToday(y, m, d) { const t = new Date(); return t.getFullYear()===y && t.getMonth()===m && t.getDate()===d; }
|
|
44
44
|
|
|
45
|
-
export function DatePicker({ value, onChange, placeholder = 'Select date', badges = {}, minDate, maxDate, disabled, showStepper = true, stepperPosition
|
|
45
|
+
export function DatePicker({ value, onChange, placeholder = 'Select date', badges = {}, minDate, maxDate, disabled, showStepper = true, stepperPosition, style }) {
|
|
46
46
|
const [open, setOpen] = useState(false);
|
|
47
47
|
const [view, setView] = useState('day'); // 'day' | 'month' | 'year'
|
|
48
48
|
const [cursor, setCursor] = useState(() => toDate(value) || new Date());
|
|
49
49
|
const [pos, setPos] = useState({ top: 0, left: 0, width: 0 });
|
|
50
|
+
const [localStepperPos, setLocalStepperPos] = useState(() => {
|
|
51
|
+
return typeof window !== 'undefined' ? (localStorage.getItem('datepicker_stepper_position') || 'around') : 'around';
|
|
52
|
+
});
|
|
50
53
|
const ref = useRef(null);
|
|
51
54
|
const btnRef = useRef(null);
|
|
52
55
|
const dropRef = useRef(null);
|
|
53
56
|
|
|
57
|
+
useEffect(() => {
|
|
58
|
+
function syncPos() {
|
|
59
|
+
if (typeof window !== 'undefined') {
|
|
60
|
+
setLocalStepperPos(localStorage.getItem('datepicker_stepper_position') || 'around');
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
window.addEventListener('storage', syncPos);
|
|
64
|
+
window.addEventListener('datepicker-pos-changed', syncPos);
|
|
65
|
+
return () => {
|
|
66
|
+
window.removeEventListener('storage', syncPos);
|
|
67
|
+
window.removeEventListener('datepicker-pos-changed', syncPos);
|
|
68
|
+
};
|
|
69
|
+
}, []);
|
|
70
|
+
|
|
54
71
|
const changeDay = (delta) => {
|
|
55
72
|
if (disabled) return;
|
|
56
73
|
const current = toDate(value) || new Date();
|
|
@@ -358,8 +375,9 @@ export function DatePicker({ value, onChange, placeholder = 'Select date', badge
|
|
|
358
375
|
</button>
|
|
359
376
|
);
|
|
360
377
|
|
|
361
|
-
const
|
|
362
|
-
|
|
378
|
+
const actualPos = stepperPosition || localStepperPos || 'around';
|
|
379
|
+
const posMode = actualPos === 'left' || actualPos === 'start' ? 'left'
|
|
380
|
+
: actualPos === 'right' || actualPos === 'end' ? 'right'
|
|
363
381
|
: 'around';
|
|
364
382
|
|
|
365
383
|
return (
|