@sunggang/ui-lib 0.4.29 → 0.4.30
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/Form.cjs.js +69 -6
- package/Form.esm.js +69 -6
- package/package.json +1 -1
package/Form.cjs.js
CHANGED
|
@@ -7142,6 +7142,75 @@ var FlatpickrInput = /*#__PURE__*/ React.forwardRef(function(param, ref) {
|
|
|
7142
7142
|
// Single mode: 返回單一日期，預設行為會自動關閉
|
|
7143
7143
|
onChange(selectedDates.length > 0 ? selectedDates[0] : null);
|
|
7144
7144
|
}
|
|
7145
|
+
},
|
|
7146
|
+
// 在 flatpickr 準備就緒後設置時間選擇器的即時監聽
|
|
7147
|
+
onReady: function(selectedDates, dateStr, instance) {
|
|
7148
|
+
if ((item === null || item === void 0 ? void 0 : item.flatpickrType) === "time") {
|
|
7149
|
+
// 使用 setTimeout 確保 DOM 完全渲染
|
|
7150
|
+
setTimeout(function() {
|
|
7151
|
+
var timeContainer = instance.timeContainer;
|
|
7152
|
+
if (timeContainer) {
|
|
7153
|
+
// 尋找所有可能的時間相關輸入元素
|
|
7154
|
+
var hourInput = timeContainer.querySelector("input.flatpickr-hour");
|
|
7155
|
+
var minuteInput = timeContainer.querySelector("input.flatpickr-minute");
|
|
7156
|
+
// 創建即時更新函數
|
|
7157
|
+
var updateTimeState = function() {
|
|
7158
|
+
// 直接從輸入框獲取值並構建時間
|
|
7159
|
+
var hourValue = hourInput ? hourInput.value : "0";
|
|
7160
|
+
var minuteValue = minuteInput ? minuteInput.value : "0";
|
|
7161
|
+
if (hourValue && minuteValue) {
|
|
7162
|
+
// 創建今天的日期並設置時間
|
|
7163
|
+
var today = new Date();
|
|
7164
|
+
today.setHours(parseInt(hourValue, 10), parseInt(minuteValue, 10), 0, 0);
|
|
7165
|
+
onChange([
|
|
7166
|
+
today
|
|
7167
|
+
]);
|
|
7168
|
+
}
|
|
7169
|
+
};
|
|
7170
|
+
// 綁定多種事件以確保即時性
|
|
7171
|
+
var events = [
|
|
7172
|
+
"input",
|
|
7173
|
+
"change",
|
|
7174
|
+
"keyup",
|
|
7175
|
+
"click"
|
|
7176
|
+
];
|
|
7177
|
+
if (hourInput) {
|
|
7178
|
+
events.forEach(function(eventType) {
|
|
7179
|
+
hourInput.addEventListener(eventType, updateTimeState);
|
|
7180
|
+
});
|
|
7181
|
+
}
|
|
7182
|
+
if (minuteInput) {
|
|
7183
|
+
events.forEach(function(eventType) {
|
|
7184
|
+
minuteInput.addEventListener(eventType, updateTimeState);
|
|
7185
|
+
});
|
|
7186
|
+
}
|
|
7187
|
+
// 監聽時間容器內的所有變化（包括按鈕點擊）
|
|
7188
|
+
var observer = new MutationObserver(function(mutations) {
|
|
7189
|
+
var shouldUpdate = false;
|
|
7190
|
+
mutations.forEach(function(mutation) {
|
|
7191
|
+
if (mutation.type === "attributes" || mutation.type === "childList") {
|
|
7192
|
+
shouldUpdate = true;
|
|
7193
|
+
}
|
|
7194
|
+
});
|
|
7195
|
+
if (shouldUpdate) {
|
|
7196
|
+
setTimeout(updateTimeState, 10); // 短延遲確保值已更新
|
|
7197
|
+
}
|
|
7198
|
+
});
|
|
7199
|
+
observer.observe(timeContainer, {
|
|
7200
|
+
attributes: true,
|
|
7201
|
+
childList: true,
|
|
7202
|
+
subtree: true,
|
|
7203
|
+
attributeFilter: [
|
|
7204
|
+
"value"
|
|
7205
|
+
]
|
|
7206
|
+
});
|
|
7207
|
+
// 也監聽整個時間容器的點擊事件（箭頭按鈕）
|
|
7208
|
+
timeContainer.addEventListener("click", function() {
|
|
7209
|
+
setTimeout(updateTimeState, 10);
|
|
7210
|
+
});
|
|
7211
|
+
}
|
|
7212
|
+
}, 100);
|
|
7213
|
+
}
|
|
7145
7214
|
}
|
|
7146
7215
|
}));
|
|
7147
7216
|
}
|
|
@@ -7153,12 +7222,6 @@ var FlatpickrInput = /*#__PURE__*/ React.forwardRef(function(param, ref) {
|
|
|
7153
7222
|
item === null || item === void 0 ? void 0 : item.flatpickrType,
|
|
7154
7223
|
onChange
|
|
7155
7224
|
]);
|
|
7156
|
-
// const destroyFlatpickr = useCallback(() => {
|
|
7157
|
-
// if (flatpickrInstance.current) {
|
|
7158
|
-
// flatpickrInstance.current.destroy();
|
|
7159
|
-
// flatpickrInstance.current = null;
|
|
7160
|
-
// }
|
|
7161
|
-
// }, []);
|
|
7162
7225
|
var updateFlatpickr = React.useCallback(function(newValue) {
|
|
7163
7226
|
if (flatpickrInstance.current) {
|
|
7164
7227
|
// 如果值為 null 或 undefined，清除選擇
|
package/Form.esm.js
CHANGED
|
@@ -7114,6 +7114,75 @@ var FlatpickrInput = /*#__PURE__*/ forwardRef(function(param, ref) {
|
|
|
7114
7114
|
// Single mode: 返回單一日期，預設行為會自動關閉
|
|
7115
7115
|
onChange(selectedDates.length > 0 ? selectedDates[0] : null);
|
|
7116
7116
|
}
|
|
7117
|
+
},
|
|
7118
|
+
// 在 flatpickr 準備就緒後設置時間選擇器的即時監聽
|
|
7119
|
+
onReady: function(selectedDates, dateStr, instance) {
|
|
7120
|
+
if ((item === null || item === void 0 ? void 0 : item.flatpickrType) === "time") {
|
|
7121
|
+
// 使用 setTimeout 確保 DOM 完全渲染
|
|
7122
|
+
setTimeout(function() {
|
|
7123
|
+
var timeContainer = instance.timeContainer;
|
|
7124
|
+
if (timeContainer) {
|
|
7125
|
+
// 尋找所有可能的時間相關輸入元素
|
|
7126
|
+
var hourInput = timeContainer.querySelector("input.flatpickr-hour");
|
|
7127
|
+
var minuteInput = timeContainer.querySelector("input.flatpickr-minute");
|
|
7128
|
+
// 創建即時更新函數
|
|
7129
|
+
var updateTimeState = function() {
|
|
7130
|
+
// 直接從輸入框獲取值並構建時間
|
|
7131
|
+
var hourValue = hourInput ? hourInput.value : "0";
|
|
7132
|
+
var minuteValue = minuteInput ? minuteInput.value : "0";
|
|
7133
|
+
if (hourValue && minuteValue) {
|
|
7134
|
+
// 創建今天的日期並設置時間
|
|
7135
|
+
var today = new Date();
|
|
7136
|
+
today.setHours(parseInt(hourValue, 10), parseInt(minuteValue, 10), 0, 0);
|
|
7137
|
+
onChange([
|
|
7138
|
+
today
|
|
7139
|
+
]);
|
|
7140
|
+
}
|
|
7141
|
+
};
|
|
7142
|
+
// 綁定多種事件以確保即時性
|
|
7143
|
+
var events = [
|
|
7144
|
+
"input",
|
|
7145
|
+
"change",
|
|
7146
|
+
"keyup",
|
|
7147
|
+
"click"
|
|
7148
|
+
];
|
|
7149
|
+
if (hourInput) {
|
|
7150
|
+
events.forEach(function(eventType) {
|
|
7151
|
+
hourInput.addEventListener(eventType, updateTimeState);
|
|
7152
|
+
});
|
|
7153
|
+
}
|
|
7154
|
+
if (minuteInput) {
|
|
7155
|
+
events.forEach(function(eventType) {
|
|
7156
|
+
minuteInput.addEventListener(eventType, updateTimeState);
|
|
7157
|
+
});
|
|
7158
|
+
}
|
|
7159
|
+
// 監聽時間容器內的所有變化（包括按鈕點擊）
|
|
7160
|
+
var observer = new MutationObserver(function(mutations) {
|
|
7161
|
+
var shouldUpdate = false;
|
|
7162
|
+
mutations.forEach(function(mutation) {
|
|
7163
|
+
if (mutation.type === "attributes" || mutation.type === "childList") {
|
|
7164
|
+
shouldUpdate = true;
|
|
7165
|
+
}
|
|
7166
|
+
});
|
|
7167
|
+
if (shouldUpdate) {
|
|
7168
|
+
setTimeout(updateTimeState, 10); // 短延遲確保值已更新
|
|
7169
|
+
}
|
|
7170
|
+
});
|
|
7171
|
+
observer.observe(timeContainer, {
|
|
7172
|
+
attributes: true,
|
|
7173
|
+
childList: true,
|
|
7174
|
+
subtree: true,
|
|
7175
|
+
attributeFilter: [
|
|
7176
|
+
"value"
|
|
7177
|
+
]
|
|
7178
|
+
});
|
|
7179
|
+
// 也監聽整個時間容器的點擊事件（箭頭按鈕）
|
|
7180
|
+
timeContainer.addEventListener("click", function() {
|
|
7181
|
+
setTimeout(updateTimeState, 10);
|
|
7182
|
+
});
|
|
7183
|
+
}
|
|
7184
|
+
}, 100);
|
|
7185
|
+
}
|
|
7117
7186
|
}
|
|
7118
7187
|
}));
|
|
7119
7188
|
}
|
|
@@ -7125,12 +7194,6 @@ var FlatpickrInput = /*#__PURE__*/ forwardRef(function(param, ref) {
|
|
|
7125
7194
|
item === null || item === void 0 ? void 0 : item.flatpickrType,
|
|
7126
7195
|
onChange
|
|
7127
7196
|
]);
|
|
7128
|
-
// const destroyFlatpickr = useCallback(() => {
|
|
7129
|
-
// if (flatpickrInstance.current) {
|
|
7130
|
-
// flatpickrInstance.current.destroy();
|
|
7131
|
-
// flatpickrInstance.current = null;
|
|
7132
|
-
// }
|
|
7133
|
-
// }, []);
|
|
7134
7197
|
var updateFlatpickr = useCallback(function(newValue) {
|
|
7135
7198
|
if (flatpickrInstance.current) {
|
|
7136
7199
|
// 如果值為 null 或 undefined，清除選擇
|