trotl-filter 1.0.39 → 1.0.40
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/dist/index.cjs.js +27 -112
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +27 -112
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -9033,29 +9033,6 @@ function DateTimeInput({
|
|
|
9033
9033
|
className = "",
|
|
9034
9034
|
style = {},
|
|
9035
9035
|
predefinedRanges = ["today", "yesterday"],
|
|
9036
|
-
presets = [{
|
|
9037
|
-
label: "Clear",
|
|
9038
|
-
type: "clear"
|
|
9039
|
-
}, {
|
|
9040
|
-
label: "Today",
|
|
9041
|
-
type: "today"
|
|
9042
|
-
}, {
|
|
9043
|
-
label: "+1 Week",
|
|
9044
|
-
type: "days",
|
|
9045
|
-
value: 7
|
|
9046
|
-
}, {
|
|
9047
|
-
label: "+10 Days",
|
|
9048
|
-
type: "days",
|
|
9049
|
-
value: 10
|
|
9050
|
-
}, {
|
|
9051
|
-
label: "+1 Month",
|
|
9052
|
-
type: "months",
|
|
9053
|
-
value: 1
|
|
9054
|
-
}, {
|
|
9055
|
-
label: "+1 Year",
|
|
9056
|
-
type: "years",
|
|
9057
|
-
value: 1
|
|
9058
|
-
}],
|
|
9059
9036
|
startWith = "sunday",
|
|
9060
9037
|
...rest
|
|
9061
9038
|
}) {
|
|
@@ -9073,11 +9050,12 @@ function DateTimeInput({
|
|
|
9073
9050
|
};
|
|
9074
9051
|
}
|
|
9075
9052
|
const paramKey = pushUrlParamObj || null;
|
|
9053
|
+
|
|
9054
|
+
// Refs to stabilize callbacks and prevent re-entrant URL updates
|
|
9076
9055
|
const onChangeRef = React.useRef(onChange);
|
|
9077
9056
|
const controlledValueRef = React.useRef(controlledValue);
|
|
9078
|
-
const lastUrlValueRef = React.useRef(null);
|
|
9079
9057
|
const isUpdatingFromComponentRef = React.useRef(false);
|
|
9080
|
-
const
|
|
9058
|
+
const lastUrlValueRef = React.useRef(null);
|
|
9081
9059
|
React.useEffect(() => {
|
|
9082
9060
|
onChangeRef.current = onChange;
|
|
9083
9061
|
}, [onChange]);
|
|
@@ -9122,10 +9100,6 @@ function DateTimeInput({
|
|
|
9122
9100
|
}
|
|
9123
9101
|
return toInputString(d.getTime());
|
|
9124
9102
|
});
|
|
9125
|
-
const valueRef = React.useRef(value);
|
|
9126
|
-
React.useEffect(() => {
|
|
9127
|
-
valueRef.current = value;
|
|
9128
|
-
}, [value]);
|
|
9129
9103
|
|
|
9130
9104
|
// Dropdown state & positioning
|
|
9131
9105
|
const [open, setOpen] = React.useState(false);
|
|
@@ -9312,10 +9286,9 @@ function DateTimeInput({
|
|
|
9312
9286
|
const d = new Date(val);
|
|
9313
9287
|
ts = d.getTime();
|
|
9314
9288
|
}
|
|
9315
|
-
|
|
9316
|
-
lastUrlValueRef.current = nextVal;
|
|
9317
|
-
if (nextVal) params.set(paramKey, nextVal);else params.delete(paramKey);
|
|
9289
|
+
if (ts && String(ts).length > 0 && !isNaN(Number(ts))) params.set(paramKey, String(ts));else params.delete(paramKey);
|
|
9318
9290
|
const newUrl = window.location.pathname + (params.toString() ? `?${params.toString()}` : "");
|
|
9291
|
+
lastUrlValueRef.current = params.get(paramKey) || null;
|
|
9319
9292
|
window.history.replaceState({}, "", newUrl);
|
|
9320
9293
|
setTimeout(() => {
|
|
9321
9294
|
isUpdatingFromComponentRef.current = false;
|
|
@@ -9329,33 +9302,32 @@ function DateTimeInput({
|
|
|
9329
9302
|
if (isUpdatingFromComponentRef.current) return;
|
|
9330
9303
|
const params = new URLSearchParams(window.location.search);
|
|
9331
9304
|
const urlVal = params.get(paramKey);
|
|
9332
|
-
if (urlVal) {
|
|
9333
|
-
if (lastUrlValueRef.current === urlVal && valueRef.current === toInputString(urlVal)) return;
|
|
9305
|
+
if (urlVal && urlVal !== lastUrlValueRef.current) {
|
|
9334
9306
|
const str = toInputString(urlVal);
|
|
9335
|
-
|
|
9336
|
-
|
|
9337
|
-
|
|
9338
|
-
|
|
9307
|
+
setValue(prev => prev !== str ? str : prev);
|
|
9308
|
+
if (onChangeRef.current && str !== controlledValueRef.current) onChangeRef.current(urlVal);
|
|
9309
|
+
lastUrlValueRef.current = urlVal;
|
|
9310
|
+
} else if (!urlVal && lastUrlValueRef.current !== null) {
|
|
9311
|
+
setValue("");
|
|
9312
|
+
if (onChangeRef.current) onChangeRef.current("");
|
|
9313
|
+
lastUrlValueRef.current = null;
|
|
9339
9314
|
}
|
|
9340
9315
|
};
|
|
9341
9316
|
syncFromUrl();
|
|
9342
9317
|
window.addEventListener('popstate', syncFromUrl);
|
|
9343
|
-
|
|
9344
|
-
|
|
9345
|
-
|
|
9346
|
-
const
|
|
9347
|
-
|
|
9348
|
-
|
|
9349
|
-
|
|
9350
|
-
|
|
9351
|
-
|
|
9352
|
-
|
|
9353
|
-
window.history.replaceState = function () {
|
|
9354
|
-
const rv = origReplaceState.apply(this, arguments);
|
|
9355
|
-
window.dispatchEvent(new Event('replaceState'));
|
|
9356
|
-
return rv;
|
|
9318
|
+
// Patch history methods only once globally
|
|
9319
|
+
if (!window.__historyPatched) {
|
|
9320
|
+
window.__historyPatched = true;
|
|
9321
|
+
const patchHistory = type => {
|
|
9322
|
+
const orig = window.history[type];
|
|
9323
|
+
window.history[type] = function () {
|
|
9324
|
+
const rv = orig.apply(this, arguments);
|
|
9325
|
+
window.dispatchEvent(new Event(type));
|
|
9326
|
+
return rv;
|
|
9327
|
+
};
|
|
9357
9328
|
};
|
|
9358
|
-
|
|
9329
|
+
patchHistory('pushState');
|
|
9330
|
+
patchHistory('replaceState');
|
|
9359
9331
|
}
|
|
9360
9332
|
window.addEventListener('pushState', syncFromUrl);
|
|
9361
9333
|
window.addEventListener('replaceState', syncFromUrl);
|
|
@@ -9432,41 +9404,6 @@ function DateTimeInput({
|
|
|
9432
9404
|
onChange?.("");
|
|
9433
9405
|
};
|
|
9434
9406
|
|
|
9435
|
-
// Presets (custom actions like clear, today, +N days/months/years)
|
|
9436
|
-
const handlePresetClick = React.useCallback(p => {
|
|
9437
|
-
if (!p || disabled) return;
|
|
9438
|
-
const type = String(p.type || '').toLowerCase();
|
|
9439
|
-
if (type === 'clear') {
|
|
9440
|
-
handleClear();
|
|
9441
|
-
return;
|
|
9442
|
-
}
|
|
9443
|
-
let d = new Date();
|
|
9444
|
-
if (type === 'today') {
|
|
9445
|
-
d = new Date();
|
|
9446
|
-
d.setHours(0, 0, 0, 0);
|
|
9447
|
-
} else if (type === 'days') {
|
|
9448
|
-
const v = Number(p.value) || 0;
|
|
9449
|
-
d.setHours(0, 0, 0, 0);
|
|
9450
|
-
d.setDate(d.getDate() + v);
|
|
9451
|
-
} else if (type === 'months') {
|
|
9452
|
-
const v = Number(p.value) || 0;
|
|
9453
|
-
d.setHours(0, 0, 0, 0);
|
|
9454
|
-
d.setMonth(d.getMonth() + v);
|
|
9455
|
-
} else if (type === 'years') {
|
|
9456
|
-
const v = Number(p.value) || 0;
|
|
9457
|
-
d.setHours(0, 0, 0, 0);
|
|
9458
|
-
d.setFullYear(d.getFullYear() + v);
|
|
9459
|
-
} else {
|
|
9460
|
-
// unknown type: ignore
|
|
9461
|
-
return;
|
|
9462
|
-
}
|
|
9463
|
-
if (time && timeStart) {
|
|
9464
|
-
const [h, m] = (timeStart || '00:00').split(':');
|
|
9465
|
-
d.setHours(Number(h), Number(m), 0, 0);
|
|
9466
|
-
}
|
|
9467
|
-
applySelection(d);
|
|
9468
|
-
}, [disabled, time, timeStart, applySelection, handleClear]);
|
|
9469
|
-
|
|
9470
9407
|
// Outside click close
|
|
9471
9408
|
React.useEffect(() => {
|
|
9472
9409
|
if (!open) return;
|
|
@@ -9553,28 +9490,7 @@ function DateTimeInput({
|
|
|
9553
9490
|
cursor: disabled ? 'not-allowed' : 'pointer'
|
|
9554
9491
|
}
|
|
9555
9492
|
}, p.label);
|
|
9556
|
-
})),
|
|
9557
|
-
style: {
|
|
9558
|
-
display: 'flex',
|
|
9559
|
-
flexWrap: 'wrap',
|
|
9560
|
-
gap: 6,
|
|
9561
|
-
marginBottom: 8
|
|
9562
|
-
}
|
|
9563
|
-
}, presets.map((ps, idx) => /*#__PURE__*/React.createElement("button", {
|
|
9564
|
-
key: `preset_${idx}`,
|
|
9565
|
-
type: "button",
|
|
9566
|
-
onClick: () => handlePresetClick(ps),
|
|
9567
|
-
disabled: disabled,
|
|
9568
|
-
className: "basic-btn",
|
|
9569
|
-
style: {
|
|
9570
|
-
padding: '4px 8px',
|
|
9571
|
-
fontSize: 12,
|
|
9572
|
-
background: disabled ? '#f9fafb' : '#fff',
|
|
9573
|
-
color: disabled ? '#9ca3af' : '#000',
|
|
9574
|
-
border: disabled ? '1px solid #e5e7eb' : '1px solid #d9d9d9',
|
|
9575
|
-
cursor: disabled ? 'not-allowed' : 'pointer'
|
|
9576
|
-
}
|
|
9577
|
-
}, ps.label))), /*#__PURE__*/React.createElement("div", {
|
|
9493
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
9578
9494
|
style: {
|
|
9579
9495
|
display: 'flex',
|
|
9580
9496
|
justifyContent: 'space-between',
|
|
@@ -9735,8 +9651,7 @@ DateTimeInput.propTypes = {
|
|
|
9735
9651
|
disabled: PropTypes.bool,
|
|
9736
9652
|
className: PropTypes.string,
|
|
9737
9653
|
style: PropTypes.object,
|
|
9738
|
-
predefinedRanges: PropTypes.array
|
|
9739
|
-
presets: PropTypes.array
|
|
9654
|
+
predefinedRanges: PropTypes.array
|
|
9740
9655
|
};
|
|
9741
9656
|
const buttonStyle = {
|
|
9742
9657
|
padding: '6px 16px',
|