@sunggang/ui-lib 0.4.59 → 0.4.61

package/Form.cjs.js

@@ -8030,6 +8030,233 @@ var Textarea = function(param) {
         ]
     });
 };
+var FieldArray = function(param) {
+    var item = param.item;
+    var _useFormContext = index_esm.useFormContext(), control = _useFormContext.control, errors = _useFormContext.formState.errors, getValues = _useFormContext.getValues;
+    var _useFieldArray = index_esm.useFieldArray({
+        control: control,
+        name: item.name
+    }), fields = _useFieldArray.fields, append = _useFieldArray.append, remove = _useFieldArray.remove;
+    var config = item === null || item === void 0 ? void 0 : item.fieldArrayConfig;
+    var fieldConfigs = (config === null || config === void 0 ? void 0 : config.fields) || [];
+    var addButtonText = (config === null || config === void 0 ? void 0 : config.addButtonText) || "新增";
+    var removeButtonText = (config === null || config === void 0 ? void 0 : config.removeButtonText) || "刪除";
+    var maxItems = config === null || config === void 0 ? void 0 : config.maxItems;
+    var minItems = (config === null || config === void 0 ? void 0 : config.minItems) || 0;
+    var defaultItemCount = (config === null || config === void 0 ? void 0 : config.defaultItemCount) || 1;
+    var addButtonPosition = (config === null || config === void 0 ? void 0 : config.addButtonPosition) || "bottom";
+    var canAdd = !maxItems || fields.length < maxItems;
+    var canRemove = fields.length > minItems;
+    // 初始化：確保至少有 defaultItemCount 個項目
+    React__default["default"].useEffect(function() {
+        var currentValues = getValues(item.name);
+        if (!currentValues || currentValues.length === 0) {
+            var _loop = function(i) {
+                var newItem = {};
+                fieldConfigs.forEach(function(field) {
+                    newItem[field.name] = "";
+                });
+                append(newItem);
+            };
+            var itemsToAdd = defaultItemCount;
+            for(var i = 0; i < itemsToAdd; i++)_loop(i);
+        }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    var handleAdd = function() {
+        if (canAdd) {
+            var newItem = {};
+            fieldConfigs.forEach(function(field) {
+                newItem[field.name] = "";
+            });
+            append(newItem);
+        }
+    };
+    var handleRemove = function(index) {
+        if (canRemove) {
+            remove(index);
+        }
+    };
+    var getFieldError = function(index, fieldName) {
+        var fieldPath = "".concat(item.name, ".").concat(index, ".").concat(fieldName);
+        var pathParts = fieldPath.split(".");
+        var error = errors;
+        var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
+        try {
+            for(var _iterator = pathParts[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true){
+                var part = _step.value;
+                if (error && error[part]) {
+                    error = error[part];
+                } else {
+                    return null;
+                }
+            }
+        } catch (err) {
+            _didIteratorError = true;
+            _iteratorError = err;
+        } finally{
+            try {
+                if (!_iteratorNormalCompletion && _iterator.return != null) {
+                    _iterator.return();
+                }
+            } finally{
+                if (_didIteratorError) {
+                    throw _iteratorError;
+                }
+            }
+        }
+        return error;
+    };
+    return /*#__PURE__*/ jsxRuntime.jsxs("div", {
+        className: [
+            (item === null || item === void 0 ? void 0 : item.className) || "w-full"
+        ].join(" "),
+        children: [
+            /*#__PURE__*/ jsxRuntime.jsx(FieldLabel.FieldLabel, {
+                item: item
+            }),
+            /*#__PURE__*/ jsxRuntime.jsxs("div", {
+                className: "space-y-4",
+                children: [
+                    fields.map(function(field, index) {
+                        return /*#__PURE__*/ jsxRuntime.jsx("div", {
+                            className: "border border-[#C8C8C8] rounded-xl p-4 bg-white overflow-scroll",
+                            children: /*#__PURE__*/ jsxRuntime.jsxs("div", {
+                                className: "flex items-start gap-2 flex-wrap lg:flex-nowrap",
+                                children: [
+                                    fieldConfigs.map(function(fieldConfig, fieldIndex) {
+                                        var _fieldConfig_validateOption;
+                                        var fieldName = "".concat(item.name, ".").concat(index, ".").concat(fieldConfig.name);
+                                        var fieldError = getFieldError(index, fieldConfig.name);
+                                        return /*#__PURE__*/ jsxRuntime.jsxs("div", {
+                                            className: "flex-1 min-w-[200px]",
+                                            children: [
+                                                /*#__PURE__*/ jsxRuntime.jsxs("div", {
+                                                    className: "font-medium mb-2 text-sm",
+                                                    children: [
+                                                        fieldConfig.label,
+                                                        (fieldConfig === null || fieldConfig === void 0 ? void 0 : (_fieldConfig_validateOption = fieldConfig.validateOption) === null || _fieldConfig_validateOption === void 0 ? void 0 : _fieldConfig_validateOption.required) && /*#__PURE__*/ jsxRuntime.jsx("span", {
+                                                            className: "pl-1 text-[#EF5533] font-bold",
+                                                            children: "*"
+                                                        })
+                                                    ]
+                                                }),
+                                                /*#__PURE__*/ jsxRuntime.jsx(index_esm.Controller, {
+                                                    name: fieldName,
+                                                    control: control,
+                                                    rules: fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.validateOption,
+                                                    render: function(param) {
+                                                        var controllerField = param.field;
+                                                        return /*#__PURE__*/ jsxRuntime.jsxs("div", {
+                                                            className: "relative",
+                                                            children: [
+                                                                /*#__PURE__*/ jsxRuntime.jsx("input", _object_spread_props(_object_spread({}, controllerField), {
+                                                                    list: "".concat(fieldName, "-datalist"),
+                                                                    type: "text",
+                                                                    className: [
+                                                                        (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] cursor-not-allowed" : "bg-white text-[#6f6f6f]",
+                                                                        "w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
+                                                                    ].join(" "),
+                                                                    placeholder: fieldConfig.placeholder || fieldConfig.label,
+                                                                    disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled)
+                                                                })),
+                                                                fieldConfig.options && fieldConfig.options.length > 0 && /*#__PURE__*/ jsxRuntime.jsx("datalist", {
+                                                                    id: "".concat(fieldName, "-datalist"),
+                                                                    children: fieldConfig.options.map(function(option, optIndex) {
+                                                                        return /*#__PURE__*/ jsxRuntime.jsx("option", {
+                                                                            value: option.value || option.name,
+                                                                            children: option.name
+                                                                        }, optIndex);
+                                                                    })
+                                                                })
+                                                            ]
+                                                        });
+                                                    }
+                                                }),
+                                                (fieldError === null || fieldError === void 0 ? void 0 : fieldError.message) && /*#__PURE__*/ jsxRuntime.jsxs("div", {
+                                                    className: "pt-1 text-xs text-[#EF5533]",
+                                                    children: [
+                                                        "*",
+                                                        String(fieldError.message)
+                                                    ]
+                                                })
+                                            ]
+                                        }, fieldIndex);
+                                    }),
+                                    addButtonPosition === "inline" && canAdd && index === fields.length - 1 && /*#__PURE__*/ jsxRuntime.jsxs("button", {
+                                        type: "button",
+                                        onClick: handleAdd,
+                                        className: [
+                                            "h-11 px-4 rounded-2xl border border-solid border-[#6f6f6f]",
+                                            "text-[#6f6f6f] bg-white hover:bg-[#F5F5F5]",
+                                            "transition-colors duration-200",
+                                            "flex items-center gap-2 whitespace-nowrap",
+                                            "mt-[30px]"
+                                        ].join(" "),
+                                        children: [
+                                            /*#__PURE__*/ jsxRuntime.jsx(react$1.Icon, {
+                                                icon: "mdi:plus",
+                                                className: "w-5 h-5"
+                                            }),
+                                            addButtonText
+                                        ]
+                                    }),
+                                    canRemove && /*#__PURE__*/ jsxRuntime.jsxs("button", {
+                                        type: "button",
+                                        onClick: function() {
+                                            return handleRemove(index);
+                                        },
+                                        className: [
+                                            "h-11 px-4 rounded-2xl border border-solid border-[#EF5533]",
+                                            "text-[#EF5533] bg-white hover:bg-[#FFF5F3]",
+                                            "transition-colors duration-200",
+                                            "flex items-center gap-2 whitespace-nowrap",
+                                            "mt-[30px]"
+                                        ].join(" "),
+                                        children: [
+                                            /*#__PURE__*/ jsxRuntime.jsx(react$1.Icon, {
+                                                icon: "mdi:delete-outline",
+                                                className: "w-5 h-5"
+                                            }),
+                                            removeButtonText
+                                        ]
+                                    })
+                                ]
+                            })
+                        }, field.id);
+                    }),
+                    addButtonPosition === "bottom" && canAdd && /*#__PURE__*/ jsxRuntime.jsxs("button", {
+                        type: "button",
+                        onClick: handleAdd,
+                        className: [
+                            "h-11 px-6 rounded-2xl border border-solid border-[#6f6f6f]",
+                            "text-[#6f6f6f] bg-white hover:bg-[#F5F5F5]",
+                            "transition-colors duration-200",
+                            "flex items-center gap-2"
+                        ].join(" "),
+                        children: [
+                            /*#__PURE__*/ jsxRuntime.jsx(react$1.Icon, {
+                                icon: "mdi:plus",
+                                className: "w-5 h-5"
+                            }),
+                            addButtonText
+                        ]
+                    }),
+                    maxItems && /*#__PURE__*/ jsxRuntime.jsxs("div", {
+                        className: "text-xs text-[#777777]",
+                        children: [
+                            "已新增 ",
+                            fields.length,
+                            " / ",
+                            maxItems,
+                            " 項"
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+};
 var Fields = function(param) {
     var formConfig = param.formConfig, _param_fieldsClass = param.fieldsClass, fieldsClass = _param_fieldsClass === void 0 ? "gap-2" : _param_fieldsClass;
     return !!(formConfig === null || formConfig === void 0 ? void 0 : formConfig.length) && (formConfig === null || formConfig === void 0 ? void 0 : formConfig.map(function(item, index) {
@@ -8160,6 +8387,10 @@ var Row = function(param) {
                 return /*#__PURE__*/ React.createElement(FlatpickrField, _object_spread_props(_object_spread({}, baseConfig), {
                     key: "rowField-".concat(index)
                 }));
+            case "fieldArray":
+                return /*#__PURE__*/ React.createElement(FieldArray, _object_spread_props(_object_spread({}, baseConfig), {
+                    key: "rowField-".concat(index)
+                }));
             default:
                 return null;
         }
@@ -8180,7 +8411,8 @@ var Form = {
     CheckboxField: CheckboxField,
     BaseCkeditor: BaseCkeditor,
     Dropdown: DropdownList,
-    FlatpickrField: FlatpickrField
+    FlatpickrField: FlatpickrField,
+    FieldArray: FieldArray
 };
 
 function _array_like_to_array$1(arr, len) {

package/Form.esm.js

@@ -7,7 +7,7 @@ import { keyframes, jsx, css as css$2 } from '@emotion/react';
 import { createPortal } from 'react-dom';
 import { Icon } from '@iconify/react';
 import { Checkbox, RadioGroup, FormControlLabel, Radio } from '@mui/material';
-import { a as useFormContext, C as Controller } from './index.esm.esm.js';
+import { a as useFormContext, C as Controller, c as useFieldArray } from './index.esm.esm.js';
 import { d as dt } from './styled-components.esm.esm.js';
 import { _, v as validateMsg } from './common.esm.js';
 import { F as FieldLabel } from './FieldLabel.esm.js';
@@ -8003,6 +8003,233 @@ var Textarea = function(param) {
         ]
     });
 };
+var FieldArray = function(param) {
+    var item = param.item;
+    var _useFormContext = useFormContext(), control = _useFormContext.control, errors = _useFormContext.formState.errors, getValues = _useFormContext.getValues;
+    var _useFieldArray = useFieldArray({
+        control: control,
+        name: item.name
+    }), fields = _useFieldArray.fields, append = _useFieldArray.append, remove = _useFieldArray.remove;
+    var config = item === null || item === void 0 ? void 0 : item.fieldArrayConfig;
+    var fieldConfigs = (config === null || config === void 0 ? void 0 : config.fields) || [];
+    var addButtonText = (config === null || config === void 0 ? void 0 : config.addButtonText) || "新增";
+    var removeButtonText = (config === null || config === void 0 ? void 0 : config.removeButtonText) || "刪除";
+    var maxItems = config === null || config === void 0 ? void 0 : config.maxItems;
+    var minItems = (config === null || config === void 0 ? void 0 : config.minItems) || 0;
+    var defaultItemCount = (config === null || config === void 0 ? void 0 : config.defaultItemCount) || 1;
+    var addButtonPosition = (config === null || config === void 0 ? void 0 : config.addButtonPosition) || "bottom";
+    var canAdd = !maxItems || fields.length < maxItems;
+    var canRemove = fields.length > minItems;
+    // 初始化：確保至少有 defaultItemCount 個項目
+    React__default.useEffect(function() {
+        var currentValues = getValues(item.name);
+        if (!currentValues || currentValues.length === 0) {
+            var _loop = function(i) {
+                var newItem = {};
+                fieldConfigs.forEach(function(field) {
+                    newItem[field.name] = "";
+                });
+                append(newItem);
+            };
+            var itemsToAdd = defaultItemCount;
+            for(var i = 0; i < itemsToAdd; i++)_loop(i);
+        }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    var handleAdd = function() {
+        if (canAdd) {
+            var newItem = {};
+            fieldConfigs.forEach(function(field) {
+                newItem[field.name] = "";
+            });
+            append(newItem);
+        }
+    };
+    var handleRemove = function(index) {
+        if (canRemove) {
+            remove(index);
+        }
+    };
+    var getFieldError = function(index, fieldName) {
+        var fieldPath = "".concat(item.name, ".").concat(index, ".").concat(fieldName);
+        var pathParts = fieldPath.split(".");
+        var error = errors;
+        var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
+        try {
+            for(var _iterator = pathParts[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true){
+                var part = _step.value;
+                if (error && error[part]) {
+                    error = error[part];
+                } else {
+                    return null;
+                }
+            }
+        } catch (err) {
+            _didIteratorError = true;
+            _iteratorError = err;
+        } finally{
+            try {
+                if (!_iteratorNormalCompletion && _iterator.return != null) {
+                    _iterator.return();
+                }
+            } finally{
+                if (_didIteratorError) {
+                    throw _iteratorError;
+                }
+            }
+        }
+        return error;
+    };
+    return /*#__PURE__*/ jsxs("div", {
+        className: [
+            (item === null || item === void 0 ? void 0 : item.className) || "w-full"
+        ].join(" "),
+        children: [
+            /*#__PURE__*/ jsx$1(FieldLabel, {
+                item: item
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                className: "space-y-4",
+                children: [
+                    fields.map(function(field, index) {
+                        return /*#__PURE__*/ jsx$1("div", {
+                            className: "border border-[#C8C8C8] rounded-xl p-4 bg-white overflow-scroll",
+                            children: /*#__PURE__*/ jsxs("div", {
+                                className: "flex items-start gap-2 flex-wrap lg:flex-nowrap",
+                                children: [
+                                    fieldConfigs.map(function(fieldConfig, fieldIndex) {
+                                        var _fieldConfig_validateOption;
+                                        var fieldName = "".concat(item.name, ".").concat(index, ".").concat(fieldConfig.name);
+                                        var fieldError = getFieldError(index, fieldConfig.name);
+                                        return /*#__PURE__*/ jsxs("div", {
+                                            className: "flex-1 min-w-[200px]",
+                                            children: [
+                                                /*#__PURE__*/ jsxs("div", {
+                                                    className: "font-medium mb-2 text-sm",
+                                                    children: [
+                                                        fieldConfig.label,
+                                                        (fieldConfig === null || fieldConfig === void 0 ? void 0 : (_fieldConfig_validateOption = fieldConfig.validateOption) === null || _fieldConfig_validateOption === void 0 ? void 0 : _fieldConfig_validateOption.required) && /*#__PURE__*/ jsx$1("span", {
+                                                            className: "pl-1 text-[#EF5533] font-bold",
+                                                            children: "*"
+                                                        })
+                                                    ]
+                                                }),
+                                                /*#__PURE__*/ jsx$1(Controller, {
+                                                    name: fieldName,
+                                                    control: control,
+                                                    rules: fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.validateOption,
+                                                    render: function(param) {
+                                                        var controllerField = param.field;
+                                                        return /*#__PURE__*/ jsxs("div", {
+                                                            className: "relative",
+                                                            children: [
+                                                                /*#__PURE__*/ jsx$1("input", _object_spread_props(_object_spread({}, controllerField), {
+                                                                    list: "".concat(fieldName, "-datalist"),
+                                                                    type: "text",
+                                                                    className: [
+                                                                        (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] cursor-not-allowed" : "bg-white text-[#6f6f6f]",
+                                                                        "w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
+                                                                    ].join(" "),
+                                                                    placeholder: fieldConfig.placeholder || fieldConfig.label,
+                                                                    disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled)
+                                                                })),
+                                                                fieldConfig.options && fieldConfig.options.length > 0 && /*#__PURE__*/ jsx$1("datalist", {
+                                                                    id: "".concat(fieldName, "-datalist"),
+                                                                    children: fieldConfig.options.map(function(option, optIndex) {
+                                                                        return /*#__PURE__*/ jsx$1("option", {
+                                                                            value: option.value || option.name,
+                                                                            children: option.name
+                                                                        }, optIndex);
+                                                                    })
+                                                                })
+                                                            ]
+                                                        });
+                                                    }
+                                                }),
+                                                (fieldError === null || fieldError === void 0 ? void 0 : fieldError.message) && /*#__PURE__*/ jsxs("div", {
+                                                    className: "pt-1 text-xs text-[#EF5533]",
+                                                    children: [
+                                                        "*",
+                                                        String(fieldError.message)
+                                                    ]
+                                                })
+                                            ]
+                                        }, fieldIndex);
+                                    }),
+                                    addButtonPosition === "inline" && canAdd && index === fields.length - 1 && /*#__PURE__*/ jsxs("button", {
+                                        type: "button",
+                                        onClick: handleAdd,
+                                        className: [
+                                            "h-11 px-4 rounded-2xl border border-solid border-[#6f6f6f]",
+                                            "text-[#6f6f6f] bg-white hover:bg-[#F5F5F5]",
+                                            "transition-colors duration-200",
+                                            "flex items-center gap-2 whitespace-nowrap",
+                                            "mt-[30px]"
+                                        ].join(" "),
+                                        children: [
+                                            /*#__PURE__*/ jsx$1(Icon, {
+                                                icon: "mdi:plus",
+                                                className: "w-5 h-5"
+                                            }),
+                                            addButtonText
+                                        ]
+                                    }),
+                                    canRemove && /*#__PURE__*/ jsxs("button", {
+                                        type: "button",
+                                        onClick: function() {
+                                            return handleRemove(index);
+                                        },
+                                        className: [
+                                            "h-11 px-4 rounded-2xl border border-solid border-[#EF5533]",
+                                            "text-[#EF5533] bg-white hover:bg-[#FFF5F3]",
+                                            "transition-colors duration-200",
+                                            "flex items-center gap-2 whitespace-nowrap",
+                                            "mt-[30px]"
+                                        ].join(" "),
+                                        children: [
+                                            /*#__PURE__*/ jsx$1(Icon, {
+                                                icon: "mdi:delete-outline",
+                                                className: "w-5 h-5"
+                                            }),
+                                            removeButtonText
+                                        ]
+                                    })
+                                ]
+                            })
+                        }, field.id);
+                    }),
+                    addButtonPosition === "bottom" && canAdd && /*#__PURE__*/ jsxs("button", {
+                        type: "button",
+                        onClick: handleAdd,
+                        className: [
+                            "h-11 px-6 rounded-2xl border border-solid border-[#6f6f6f]",
+                            "text-[#6f6f6f] bg-white hover:bg-[#F5F5F5]",
+                            "transition-colors duration-200",
+                            "flex items-center gap-2"
+                        ].join(" "),
+                        children: [
+                            /*#__PURE__*/ jsx$1(Icon, {
+                                icon: "mdi:plus",
+                                className: "w-5 h-5"
+                            }),
+                            addButtonText
+                        ]
+                    }),
+                    maxItems && /*#__PURE__*/ jsxs("div", {
+                        className: "text-xs text-[#777777]",
+                        children: [
+                            "已新增 ",
+                            fields.length,
+                            " / ",
+                            maxItems,
+                            " 項"
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+};
 var Fields = function(param) {
     var formConfig = param.formConfig, _param_fieldsClass = param.fieldsClass, fieldsClass = _param_fieldsClass === void 0 ? "gap-2" : _param_fieldsClass;
     return !!(formConfig === null || formConfig === void 0 ? void 0 : formConfig.length) && (formConfig === null || formConfig === void 0 ? void 0 : formConfig.map(function(item, index) {
@@ -8133,6 +8360,10 @@ var Row = function(param) {
                 return /*#__PURE__*/ createElement(FlatpickrField, _object_spread_props(_object_spread({}, baseConfig), {
                     key: "rowField-".concat(index)
                 }));
+            case "fieldArray":
+                return /*#__PURE__*/ createElement(FieldArray, _object_spread_props(_object_spread({}, baseConfig), {
+                    key: "rowField-".concat(index)
+                }));
             default:
                 return null;
         }
@@ -8153,7 +8384,8 @@ var Form = {
     CheckboxField: CheckboxField,
     BaseCkeditor: BaseCkeditor,
     Dropdown: DropdownList,
-    FlatpickrField: FlatpickrField
+    FlatpickrField: FlatpickrField,
+    FieldArray: FieldArray
 };
 
 function _array_like_to_array$1(arr, len) {

package/LiffProvider.cjs.js

@@ -574,76 +574,8 @@ var LiffProvider = function(param) {
     var _useState7 = _sliced_to_array(React.useState(null), 2), loginType = _useState7[0], setLoginType = _useState7[1];
     // userInfo 的 localStorage key
     var userInfoStorageKey = "".concat(localStorageKey, "-userInfo");
-    // liff profile 的 localStorage key
-    var liffUserInfoStorageKey = "".concat(localStorageKey, "-liffUserInfo");
-    // 從 localStorage 載入 userInfo
-    var loadUserInfoFromStorage = function() {
-        try {
-            var storedUserInfo = window.localStorage.getItem(userInfoStorageKey);
-            if (storedUserInfo) {
-                var parsedUserInfo = JSON.parse(storedUserInfo);
-                setUserInfo(parsedUserInfo);
-                return parsedUserInfo;
-            }
-        } catch (err) {
-            console.error("載入 userInfo 失敗:", err);
-        }
-        return null;
-    };
-    // 儲存 userInfo 到 localStorage
-    var saveUserInfoToStorage = function(info) {
-        try {
-            window.localStorage.setItem(userInfoStorageKey, JSON.stringify(info));
-        } catch (err) {
-            console.error("儲存 userInfo 失敗:", err);
-        }
-    };
-    // 從 localStorage 載入 LIFF profile
-    var loadLiffUserInfoFromStorage = function() {
-        try {
-            var stored = window.localStorage.getItem(liffUserInfoStorageKey);
-            if (stored) {
-                var parsed = JSON.parse(stored);
-                setLiffProfile(parsed);
-                return parsed;
-            }
-        } catch (err) {
-            console.error("載入 liffUserInfo 失敗:", err);
-        }
-        return null;
-    };
-    // 儲存 LIFF profile 到 localStorage
-    var saveLiffUserInfoToStorage = function(info) {
-        try {
-            window.localStorage.setItem(liffUserInfoStorageKey, JSON.stringify(info));
-        } catch (err) {
-            console.error("儲存 liffUserInfo 失敗:", err);
-        }
-    };
-    // 移除 LIFF profile 的 localStorage
-    var removeLiffUserInfoFromStorage = function() {
-        try {
-            window.localStorage.removeItem(liffUserInfoStorageKey);
-        } catch (err) {
-        // ignore
-        }
-    };
-    // 移除 LIFF initialized flag
-    var removeLiffInitializedFromStorage = function() {
-        try {
-            window.localStorage.removeItem("".concat(localStorageKey, "-liffInitialized"));
-        } catch (err) {
-        // ignore
-        }
-    };
     // 清除 LIFF 相關快取與狀態（暴露給外部 as needed）
     var clearLiffData = function() {
-        try {
-            removeLiffUserInfoFromStorage();
-            removeLiffInitializedFromStorage();
-        } catch (e) {
-        // ignore
-        }
         setLiffProfile(null);
         setLiffObject(null);
     };
@@ -673,7 +605,6 @@ var LiffProvider = function(param) {
                     case 2:
                         response = _state.sent();
                         setUserInfo(response);
-                        saveUserInfoToStorage(response);
                         return [
                             3,
                             4
@@ -842,7 +773,6 @@ var LiffProvider = function(param) {
                     case 5:
                         // 登入沒有回傳 token，視為登入失敗 — 清除 LIFF 快取
                         setUserInfo(response);
-                        saveUserInfoToStorage(response);
                         try {
                             clearLiffData();
                         } catch (e) {
@@ -903,9 +833,6 @@ var LiffProvider = function(param) {
                         originalFetch = window.fetch;
                         window.fetch = customFetch;
                         if (openInApp && !(liff === null || liff === void 0 ? void 0 : liff.isInClient()) && (liff === null || liff === void 0 ? void 0 : liff.getOS()) !== "web") window.location.href = "line://app/".concat(liffId);
-                        if (isValid) return [
-                            2
-                        ];
                         return [
                             4,
                             liff.init({
@@ -952,7 +879,6 @@ var LiffProvider = function(param) {
                     case 4:
                         profile = _state.sent();
                         setLiffProfile(profile);
-                        saveLiffUserInfoToStorage(profile);
                         return [
                             3,
                             6
@@ -1205,62 +1131,7 @@ var LiffProvider = function(param) {
         var trimmed = token.trim();
         return trimmed.toLowerCase().startsWith("bearer ") ? trimmed : "Bearer ".concat(trimmed);
     };
-    // 提供給 context 的 lazy-load 函式（會嘗試回傳已存在的 liffObject，否則 dynamic import）
-    var getLiff = React.useCallback(/*#__PURE__*/ _async_to_generator(function() {
-        var mod, sdk, e;
-        return _ts_generator(this, function(_state) {
-            switch(_state.label){
-                case 0:
-                    if (liffObject) return [
-                        2,
-                        liffObject
-                    ];
-                    if (typeof window === "undefined") return [
-                        2,
-                        null
-                    ];
-                    _state.label = 1;
-                case 1:
-                    _state.trys.push([
-                        1,
-                        3,
-                        ,
-                        4
-                    ]);
-                    return [
-                        4,
-                        Promise.resolve().then(function () { return require('./index.cjs3.js'); })
-                    ];
-                case 2:
-                    mod = _state.sent();
-                    sdk = mod && (mod.default || mod.liff) ? mod.default || mod.liff : mod;
-                    if (sdk) setLiffObject(sdk);
-                    return [
-                        2,
-                        sdk || null
-                    ];
-                case 3:
-                    e = _state.sent();
-                    console.error("lazy import @line/liff failed", e);
-                    return [
-                        2,
-                        null
-                    ];
-                case 4:
-                    return [
-                        2
-                    ];
-            }
-        });
-    }), [
-        liffObject
-    ]);
     var searchParams = typeof window !== "undefined" ? new URLSearchParams(window.location.search) : null;
-    // 初始載入時從 localStorage 載入
-    React.useEffect(function() {
-        loadUserInfoFromStorage();
-        loadLiffUserInfoFromStorage();
-    }, []);
     // 客戶端初始化 LIFF
     React.useEffect(function() {
         var checkAndInitialize = function() {
@@ -1340,8 +1211,6 @@ var LiffProvider = function(param) {
     var contextValue = React.useMemo(function() {
         return {
             liffObject: liffObject,
-            // 非同步取得 LIFF SDK 的 helper（lazy-load），使用時可以呼叫 `await getLiff()`
-            getLiff: getLiff,
             // helper：透過 fetchLiffSdk 執行更完整的 fetch + optional init
             fetchLiffSdk: function(liffId) {
                 return fetchLiffSdk(liffId);

package/LiffProvider.esm.js

@@ -570,76 +570,8 @@ var LiffProvider = function(param) {
     var _useState7 = _sliced_to_array(useState(null), 2), loginType = _useState7[0], setLoginType = _useState7[1];
     // userInfo 的 localStorage key
     var userInfoStorageKey = "".concat(localStorageKey, "-userInfo");
-    // liff profile 的 localStorage key
-    var liffUserInfoStorageKey = "".concat(localStorageKey, "-liffUserInfo");
-    // 從 localStorage 載入 userInfo
-    var loadUserInfoFromStorage = function() {
-        try {
-            var storedUserInfo = window.localStorage.getItem(userInfoStorageKey);
-            if (storedUserInfo) {
-                var parsedUserInfo = JSON.parse(storedUserInfo);
-                setUserInfo(parsedUserInfo);
-                return parsedUserInfo;
-            }
-        } catch (err) {
-            console.error("載入 userInfo 失敗:", err);
-        }
-        return null;
-    };
-    // 儲存 userInfo 到 localStorage
-    var saveUserInfoToStorage = function(info) {
-        try {
-            window.localStorage.setItem(userInfoStorageKey, JSON.stringify(info));
-        } catch (err) {
-            console.error("儲存 userInfo 失敗:", err);
-        }
-    };
-    // 從 localStorage 載入 LIFF profile
-    var loadLiffUserInfoFromStorage = function() {
-        try {
-            var stored = window.localStorage.getItem(liffUserInfoStorageKey);
-            if (stored) {
-                var parsed = JSON.parse(stored);
-                setLiffProfile(parsed);
-                return parsed;
-            }
-        } catch (err) {
-            console.error("載入 liffUserInfo 失敗:", err);
-        }
-        return null;
-    };
-    // 儲存 LIFF profile 到 localStorage
-    var saveLiffUserInfoToStorage = function(info) {
-        try {
-            window.localStorage.setItem(liffUserInfoStorageKey, JSON.stringify(info));
-        } catch (err) {
-            console.error("儲存 liffUserInfo 失敗:", err);
-        }
-    };
-    // 移除 LIFF profile 的 localStorage
-    var removeLiffUserInfoFromStorage = function() {
-        try {
-            window.localStorage.removeItem(liffUserInfoStorageKey);
-        } catch (err) {
-        // ignore
-        }
-    };
-    // 移除 LIFF initialized flag
-    var removeLiffInitializedFromStorage = function() {
-        try {
-            window.localStorage.removeItem("".concat(localStorageKey, "-liffInitialized"));
-        } catch (err) {
-        // ignore
-        }
-    };
     // 清除 LIFF 相關快取與狀態（暴露給外部 as needed）
     var clearLiffData = function() {
-        try {
-            removeLiffUserInfoFromStorage();
-            removeLiffInitializedFromStorage();
-        } catch (e) {
-        // ignore
-        }
         setLiffProfile(null);
         setLiffObject(null);
     };
@@ -669,7 +601,6 @@ var LiffProvider = function(param) {
                     case 2:
                         response = _state.sent();
                         setUserInfo(response);
-                        saveUserInfoToStorage(response);
                         return [
                             3,
                             4
@@ -838,7 +769,6 @@ var LiffProvider = function(param) {
                     case 5:
                         // 登入沒有回傳 token，視為登入失敗 — 清除 LIFF 快取
                         setUserInfo(response);
-                        saveUserInfoToStorage(response);
                         try {
                             clearLiffData();
                         } catch (e) {
@@ -899,9 +829,6 @@ var LiffProvider = function(param) {
                         originalFetch = window.fetch;
                         window.fetch = customFetch;
                         if (openInApp && !(liff === null || liff === void 0 ? void 0 : liff.isInClient()) && (liff === null || liff === void 0 ? void 0 : liff.getOS()) !== "web") window.location.href = "line://app/".concat(liffId);
-                        if (isValid) return [
-                            2
-                        ];
                         return [
                             4,
                             liff.init({
@@ -948,7 +875,6 @@ var LiffProvider = function(param) {
                     case 4:
                         profile = _state.sent();
                         setLiffProfile(profile);
-                        saveLiffUserInfoToStorage(profile);
                         return [
                             3,
                             6
@@ -1201,62 +1127,7 @@ var LiffProvider = function(param) {
         var trimmed = token.trim();
         return trimmed.toLowerCase().startsWith("bearer ") ? trimmed : "Bearer ".concat(trimmed);
     };
-    // 提供給 context 的 lazy-load 函式（會嘗試回傳已存在的 liffObject，否則 dynamic import）
-    var getLiff = useCallback(/*#__PURE__*/ _async_to_generator(function() {
-        var mod, sdk, e;
-        return _ts_generator(this, function(_state) {
-            switch(_state.label){
-                case 0:
-                    if (liffObject) return [
-                        2,
-                        liffObject
-                    ];
-                    if (typeof window === "undefined") return [
-                        2,
-                        null
-                    ];
-                    _state.label = 1;
-                case 1:
-                    _state.trys.push([
-                        1,
-                        3,
-                        ,
-                        4
-                    ]);
-                    return [
-                        4,
-                        import('./index.esm3.js')
-                    ];
-                case 2:
-                    mod = _state.sent();
-                    sdk = mod && (mod.default || mod.liff) ? mod.default || mod.liff : mod;
-                    if (sdk) setLiffObject(sdk);
-                    return [
-                        2,
-                        sdk || null
-                    ];
-                case 3:
-                    e = _state.sent();
-                    console.error("lazy import @line/liff failed", e);
-                    return [
-                        2,
-                        null
-                    ];
-                case 4:
-                    return [
-                        2
-                    ];
-            }
-        });
-    }), [
-        liffObject
-    ]);
     var searchParams = typeof window !== "undefined" ? new URLSearchParams(window.location.search) : null;
-    // 初始載入時從 localStorage 載入
-    useEffect(function() {
-        loadUserInfoFromStorage();
-        loadLiffUserInfoFromStorage();
-    }, []);
     // 客戶端初始化 LIFF
     useEffect(function() {
         var checkAndInitialize = function() {
@@ -1336,8 +1207,6 @@ var LiffProvider = function(param) {
     var contextValue = useMemo(function() {
         return {
             liffObject: liffObject,
-            // 非同步取得 LIFF SDK 的 helper（lazy-load），使用時可以呼叫 `await getLiff()`
-            getLiff: getLiff,
             // helper：透過 fetchLiffSdk 執行更完整的 fetch + optional init
             fetchLiffSdk: function(liffId) {
                 return fetchLiffSdk(liffId);

package/index.cjs.css

@@ -1635,6 +1635,9 @@ video {
 .mt-5 {
   margin-top: 1.25rem;
 }
+.mt-\[30px\] {
+  margin-top: 30px;
+}
 .\!block {
   display: block !important;
 }
@@ -1902,6 +1905,9 @@ video {
 .min-w-\[16rem\] {
   min-width: 16rem;
 }
+.min-w-\[200px\] {
+  min-width: 200px;
+}
 .min-w-\[2rem\] {
   min-width: 2rem;
 }
@@ -2184,6 +2190,11 @@ video {
   margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
   margin-bottom: calc(1rem * var(--tw-space-y-reverse));
 }
+.space-y-6 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
+}
 .space-y-8 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 0;
   margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
@@ -2198,6 +2209,9 @@ video {
 .overflow-hidden {
   overflow: hidden;
 }
+.overflow-scroll {
+  overflow: scroll;
+}
 .overflow-y-auto {
   overflow-y: auto;
 }
@@ -2313,6 +2327,10 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(101 101 101 / var(--tw-border-opacity, 1));
 }
+.border-\[\#6f6f6f\] {
+  --tw-border-opacity: 1;
+  border-color: rgb(111 111 111 / var(--tw-border-opacity, 1));
+}
 .border-\[\#777777\] {
   --tw-border-opacity: 1;
   border-color: rgb(119 119 119 / var(--tw-border-opacity, 1));
@@ -2337,6 +2355,10 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(217 217 217 / var(--tw-border-opacity, 1));
 }
+.border-\[\#EF5533\] {
+  --tw-border-opacity: 1;
+  border-color: rgb(239 85 51 / var(--tw-border-opacity, 1));
+}
 .border-\[\#ccc\] {
   --tw-border-opacity: 1;
   border-color: rgb(204 204 204 / var(--tw-border-opacity, 1));
@@ -2478,6 +2500,10 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1));
 }
+.bg-blue-600 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
+}
 .bg-cyan-500 {
   --tw-bg-opacity: 1;
   background-color: rgb(6 182 212 / var(--tw-bg-opacity, 1));
@@ -3565,6 +3591,14 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(217 217 217 / var(--tw-bg-opacity, 1));
 }
+.hover\:bg-\[\#F5F5F5\]:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
+}
+.hover\:bg-\[\#FFF5F3\]:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 245 243 / var(--tw-bg-opacity, 1));
+}
 .hover\:bg-\[\#d9d9e2\]:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(217 217 226 / var(--tw-bg-opacity, 1));
@@ -3584,6 +3618,10 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
 }
+.hover\:bg-blue-700:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(29 78 216 / var(--tw-bg-opacity, 1));
+}
 .hover\:bg-cyan-100:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(207 250 254 / var(--tw-bg-opacity, 1));

package/index.esm.css

@@ -1635,6 +1635,9 @@ video {
 .mt-5 {
   margin-top: 1.25rem;
 }
+.mt-\[30px\] {
+  margin-top: 30px;
+}
 .\!block {
   display: block !important;
 }
@@ -1902,6 +1905,9 @@ video {
 .min-w-\[16rem\] {
   min-width: 16rem;
 }
+.min-w-\[200px\] {
+  min-width: 200px;
+}
 .min-w-\[2rem\] {
   min-width: 2rem;
 }
@@ -2184,6 +2190,11 @@ video {
   margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
   margin-bottom: calc(1rem * var(--tw-space-y-reverse));
 }
+.space-y-6 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
+}
 .space-y-8 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 0;
   margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
@@ -2198,6 +2209,9 @@ video {
 .overflow-hidden {
   overflow: hidden;
 }
+.overflow-scroll {
+  overflow: scroll;
+}
 .overflow-y-auto {
   overflow-y: auto;
 }
@@ -2313,6 +2327,10 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(101 101 101 / var(--tw-border-opacity, 1));
 }
+.border-\[\#6f6f6f\] {
+  --tw-border-opacity: 1;
+  border-color: rgb(111 111 111 / var(--tw-border-opacity, 1));
+}
 .border-\[\#777777\] {
   --tw-border-opacity: 1;
   border-color: rgb(119 119 119 / var(--tw-border-opacity, 1));
@@ -2337,6 +2355,10 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(217 217 217 / var(--tw-border-opacity, 1));
 }
+.border-\[\#EF5533\] {
+  --tw-border-opacity: 1;
+  border-color: rgb(239 85 51 / var(--tw-border-opacity, 1));
+}
 .border-\[\#ccc\] {
   --tw-border-opacity: 1;
   border-color: rgb(204 204 204 / var(--tw-border-opacity, 1));
@@ -2478,6 +2500,10 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1));
 }
+.bg-blue-600 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
+}
 .bg-cyan-500 {
   --tw-bg-opacity: 1;
   background-color: rgb(6 182 212 / var(--tw-bg-opacity, 1));
@@ -3565,6 +3591,14 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(217 217 217 / var(--tw-bg-opacity, 1));
 }
+.hover\:bg-\[\#F5F5F5\]:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
+}
+.hover\:bg-\[\#FFF5F3\]:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 245 243 / var(--tw-bg-opacity, 1));
+}
 .hover\:bg-\[\#d9d9e2\]:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(217 217 226 / var(--tw-bg-opacity, 1));
@@ -3584,6 +3618,10 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
 }
+.hover\:bg-blue-700:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(29 78 216 / var(--tw-bg-opacity, 1));
+}
 .hover\:bg-cyan-100:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(207 250 254 / var(--tw-bg-opacity, 1));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sunggang/ui-lib",
-  "version": "0.4.59",
+  "version": "0.4.61",
   "sideEffects": [
     "*.css",
     "./src/style.css",

package/src/lib/Form/index.d.ts

@@ -1,4 +1,5 @@
 import type { FC } from 'react';
+import React from 'react';
 import { FormItem, FormType } from './types';
 interface CkEditorConfig {
     uploadUrl?: string;
@@ -54,6 +55,9 @@ export interface FormModule {
     FlatpickrField: FC<{
         item: FormItem;
     }>;
+    FieldArray: FC<{
+        item: FormItem;
+    }>;
 }
 export declare const City: React.FC<FormType>;
 export declare const Textarea: React.FC<FormType>;

package/src/lib/Form/types.d.ts

@@ -9,6 +9,37 @@ export interface OptionGroup {
     value?: string;
     name?: string;
 }
+export interface FieldArrayField {
+    name: string;
+    label: string;
+    placeholder?: string;
+    options?: Option[];
+    validateOption?: {
+        pattern?: RegExp | {
+            value: RegExp;
+            message: string;
+        };
+        validateMsg?: string;
+        required?: boolean | string;
+        validate?: any;
+        min?: number | {
+            value: number;
+            message: string;
+        };
+        max?: number | {
+            value: number;
+            message: string;
+        };
+        minLength?: number | {
+            value: number;
+            message: string;
+        };
+        maxLength?: number | {
+            value: number;
+            message: string;
+        };
+    };
+}
 interface RadioOption {
     label?: string;
     value?: string;
@@ -137,6 +168,15 @@ export interface FormItem {
     flatpickrOptions?: FlatpickrOptions;
     flatpickrType?: 'time';
     onChange?: (value: any) => void;
+    fieldArrayConfig?: {
+        fields: FieldArrayField[];
+        addButtonText?: string;
+        removeButtonText?: string;
+        maxItems?: number;
+        minItems?: number;
+        defaultItemCount?: number;
+        addButtonPosition?: 'inline' | 'bottom';
+    };
 }
 export interface FormType {
     item: FormItem;

package/src/lib/Provider/LiffProvider.d.ts

@@ -1,7 +1,9 @@
 import React from 'react';
 type LiffContextType = {
-    getLiff: () => Promise<any>;
-    fetchLiffSdk?: (liffId: string) => Promise<any>;
+    fetchLiffSdk?: (liffId?: string) => Promise<{
+        sdk: any;
+        isLoggedIn: boolean | null;
+    } | null>;
     liffObject: any;
     loginData: any;
     userInfo?: any;