@farmzone/fz-react-ui 1.0.4 → 1.0.5
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 +190 -10
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +22 -1
- package/dist/index.d.ts +22 -1
- package/dist/index.js +190 -11
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -5019,7 +5019,7 @@ function Table(props) {
|
|
|
5019
5019
|
id: `${col.key}-body`,
|
|
5020
5020
|
"data-row-cell": "true",
|
|
5021
5021
|
"data-col-key": col.key,
|
|
5022
|
-
className: `${isCheckbox ? "p-0" : "px-2 py-
|
|
5022
|
+
className: `${isCheckbox ? "p-0" : "px-2 py-3"} whitespace-nowrap text-sm text-gray-900 border-r border-b border-gray-200 last:border-r-0 bg-inherit group-hover:bg-gray-100 transition-all`,
|
|
5023
5023
|
style: {
|
|
5024
5024
|
width,
|
|
5025
5025
|
minWidth: minWidth || width,
|
|
@@ -6147,14 +6147,53 @@ function resolveValueColSpan(colspan) {
|
|
|
6147
6147
|
const span = colspan ?? 10;
|
|
6148
6148
|
return COL_SPAN_CLASS[span] ?? COL_SPAN_CLASS[10];
|
|
6149
6149
|
}
|
|
6150
|
+
var THREE_DIGIT_AREA_CODES = /* @__PURE__ */ new Set([
|
|
6151
|
+
"031",
|
|
6152
|
+
"032",
|
|
6153
|
+
"033",
|
|
6154
|
+
"041",
|
|
6155
|
+
"042",
|
|
6156
|
+
"043",
|
|
6157
|
+
"051",
|
|
6158
|
+
"052",
|
|
6159
|
+
"053",
|
|
6160
|
+
"054",
|
|
6161
|
+
"055",
|
|
6162
|
+
"061",
|
|
6163
|
+
"062",
|
|
6164
|
+
"063"
|
|
6165
|
+
]);
|
|
6150
6166
|
function formatPhoneNumber(value) {
|
|
6151
|
-
|
|
6152
|
-
if (
|
|
6153
|
-
|
|
6154
|
-
|
|
6155
|
-
|
|
6167
|
+
let digits = value.replace(/\D/g, "");
|
|
6168
|
+
if (digits.startsWith("02")) {
|
|
6169
|
+
if (digits.length > 2 && digits.length <= 6) {
|
|
6170
|
+
return `${digits.slice(0, 2)}-${digits.slice(2)}`;
|
|
6171
|
+
}
|
|
6172
|
+
if (digits.length > 6) {
|
|
6173
|
+
return `${digits.slice(0, 2)}-${digits.slice(2, 6)}-${digits.slice(6)}`;
|
|
6174
|
+
}
|
|
6175
|
+
} else if (THREE_DIGIT_AREA_CODES.has(digits.slice(0, 3))) {
|
|
6176
|
+
if (digits.length > 3 && digits.length <= 6) {
|
|
6177
|
+
return `${digits.slice(0, 3)}-${digits.slice(3)}`;
|
|
6178
|
+
}
|
|
6179
|
+
if (digits.length > 6) {
|
|
6180
|
+
return `${digits.slice(0, 3)}-${digits.slice(3, 6)}-${digits.slice(6)}`;
|
|
6181
|
+
}
|
|
6182
|
+
} else {
|
|
6183
|
+
if (digits.length > 3 && digits.length <= 7) {
|
|
6184
|
+
return `${digits.slice(0, 3)}-${digits.slice(3)}`;
|
|
6185
|
+
}
|
|
6186
|
+
if (digits.length > 7) {
|
|
6187
|
+
return `${digits.slice(0, 3)}-${digits.slice(3, 7)}-${digits.slice(7)}`;
|
|
6188
|
+
}
|
|
6189
|
+
}
|
|
6190
|
+
return digits;
|
|
6191
|
+
}
|
|
6192
|
+
function resolvePhoneMaxLength(formattedValue) {
|
|
6193
|
+
if (formattedValue.startsWith("02") || THREE_DIGIT_AREA_CODES.has(formattedValue.slice(0, 3))) {
|
|
6194
|
+
return 12;
|
|
6156
6195
|
}
|
|
6157
|
-
return
|
|
6196
|
+
return 13;
|
|
6158
6197
|
}
|
|
6159
6198
|
function formatNumberWithCommas(value) {
|
|
6160
6199
|
const numStr = String(value).replace(/,/g, "");
|
|
@@ -6978,11 +7017,13 @@ function PhoneField(props) {
|
|
|
6978
7017
|
hasError = false
|
|
6979
7018
|
} = props;
|
|
6980
7019
|
const { placeholder = "010-0000-0000", disabled = false, readOnly = false, className = "" } = config;
|
|
7020
|
+
const phoneValue = String(value ?? "");
|
|
7021
|
+
const phoneMaxLength = resolvePhoneMaxLength(phoneValue);
|
|
6981
7022
|
const handleChange = (e) => {
|
|
6982
7023
|
onChange(formatPhoneNumber(e.target.value));
|
|
6983
7024
|
};
|
|
6984
7025
|
if (readOnly) {
|
|
6985
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: fieldControlWrapClass(className), children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: FIELD_READONLY_TEXT_CLASS, children:
|
|
7026
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: fieldControlWrapClass(className), children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: FIELD_READONLY_TEXT_CLASS, children: phoneValue || "\u2014" }) });
|
|
6986
7027
|
}
|
|
6987
7028
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: fieldControlWrapClass(className), children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
6988
7029
|
Input2,
|
|
@@ -6990,12 +7031,12 @@ function PhoneField(props) {
|
|
|
6990
7031
|
name,
|
|
6991
7032
|
ref,
|
|
6992
7033
|
onBlur,
|
|
6993
|
-
value:
|
|
7034
|
+
value: phoneValue,
|
|
6994
7035
|
type: "text",
|
|
6995
7036
|
placeholder,
|
|
6996
7037
|
disabled,
|
|
6997
7038
|
readOnly,
|
|
6998
|
-
maxLength:
|
|
7039
|
+
maxLength: phoneMaxLength,
|
|
6999
7040
|
status: "default",
|
|
7000
7041
|
className: formControlClass(hasError),
|
|
7001
7042
|
bare: true,
|
|
@@ -9841,6 +9882,144 @@ function useScrollToTop(containerId) {
|
|
|
9841
9882
|
return scrollToTop;
|
|
9842
9883
|
}
|
|
9843
9884
|
|
|
9885
|
+
// src/hooks/useParams/config/utils.ts
|
|
9886
|
+
function paramsToSearchParams(params) {
|
|
9887
|
+
const searchParams = new URLSearchParams();
|
|
9888
|
+
Object.entries(params).forEach(([key, value]) => {
|
|
9889
|
+
if (value === null || value === void 0) {
|
|
9890
|
+
return;
|
|
9891
|
+
}
|
|
9892
|
+
if (Array.isArray(value)) {
|
|
9893
|
+
value.forEach((item) => searchParams.append(key, String(item)));
|
|
9894
|
+
} else if (value !== "") {
|
|
9895
|
+
searchParams.set(key, String(value));
|
|
9896
|
+
}
|
|
9897
|
+
});
|
|
9898
|
+
return searchParams;
|
|
9899
|
+
}
|
|
9900
|
+
function useParams(initialParams) {
|
|
9901
|
+
if (!initialParams) {
|
|
9902
|
+
throw new Error("initialParams is required");
|
|
9903
|
+
}
|
|
9904
|
+
const [params, setParams] = React6.useState(initialParams);
|
|
9905
|
+
const [localParams, setLocalParams] = React6.useState(initialParams);
|
|
9906
|
+
const [searchParams, setSearchParams] = reactRouter.useSearchParams();
|
|
9907
|
+
const isInitializedRef = React6.useRef(false);
|
|
9908
|
+
const getInitialState = React6.useCallback(() => {
|
|
9909
|
+
const result = { ...initialParams };
|
|
9910
|
+
Object.keys(initialParams).forEach((key) => {
|
|
9911
|
+
const initialValue = initialParams[key];
|
|
9912
|
+
if (Array.isArray(initialValue)) {
|
|
9913
|
+
const urlValue = searchParams.getAll(key);
|
|
9914
|
+
if (urlValue.length > 0) {
|
|
9915
|
+
result[key] = urlValue;
|
|
9916
|
+
}
|
|
9917
|
+
} else {
|
|
9918
|
+
const urlValue = searchParams.get(key);
|
|
9919
|
+
if (urlValue !== null) {
|
|
9920
|
+
if (urlValue === "null") {
|
|
9921
|
+
result[key] = null;
|
|
9922
|
+
} else if (urlValue === "undefined") {
|
|
9923
|
+
result[key] = void 0;
|
|
9924
|
+
} else {
|
|
9925
|
+
result[key] = urlValue;
|
|
9926
|
+
}
|
|
9927
|
+
}
|
|
9928
|
+
}
|
|
9929
|
+
});
|
|
9930
|
+
return result;
|
|
9931
|
+
}, [initialParams, searchParams]);
|
|
9932
|
+
React6.useEffect(() => {
|
|
9933
|
+
if (!isInitializedRef.current) {
|
|
9934
|
+
const initialState = getInitialState();
|
|
9935
|
+
setLocalParams(initialState);
|
|
9936
|
+
setParams(initialState);
|
|
9937
|
+
if (!searchParams.toString()) {
|
|
9938
|
+
const newSearchParams = paramsToSearchParams(initialParams);
|
|
9939
|
+
setSearchParams(newSearchParams, { replace: true });
|
|
9940
|
+
}
|
|
9941
|
+
isInitializedRef.current = true;
|
|
9942
|
+
}
|
|
9943
|
+
}, [getInitialState, initialParams, searchParams, setSearchParams]);
|
|
9944
|
+
const updateLocalParam = React6.useCallback(
|
|
9945
|
+
(key, value) => {
|
|
9946
|
+
setLocalParams((prev) => ({
|
|
9947
|
+
...prev,
|
|
9948
|
+
[key]: value
|
|
9949
|
+
}));
|
|
9950
|
+
},
|
|
9951
|
+
[setLocalParams]
|
|
9952
|
+
);
|
|
9953
|
+
const updateParams = React6.useCallback(
|
|
9954
|
+
(updatedParams) => {
|
|
9955
|
+
const newParams = {
|
|
9956
|
+
...params,
|
|
9957
|
+
...updatedParams
|
|
9958
|
+
};
|
|
9959
|
+
setParams(newParams);
|
|
9960
|
+
setLocalParams(newParams);
|
|
9961
|
+
setSearchParams(paramsToSearchParams(newParams));
|
|
9962
|
+
},
|
|
9963
|
+
[params, setSearchParams]
|
|
9964
|
+
);
|
|
9965
|
+
const updateParam = React6.useCallback(
|
|
9966
|
+
(key, value) => {
|
|
9967
|
+
const newParams = {
|
|
9968
|
+
...params,
|
|
9969
|
+
[key]: value
|
|
9970
|
+
};
|
|
9971
|
+
setParams(newParams);
|
|
9972
|
+
setLocalParams(newParams);
|
|
9973
|
+
setSearchParams(paramsToSearchParams(newParams));
|
|
9974
|
+
},
|
|
9975
|
+
[params, setSearchParams]
|
|
9976
|
+
);
|
|
9977
|
+
const update = React6.useCallback(() => {
|
|
9978
|
+
const paramsWithResetPage = {
|
|
9979
|
+
...localParams,
|
|
9980
|
+
page: 0
|
|
9981
|
+
};
|
|
9982
|
+
const newSearchParams = paramsToSearchParams(paramsWithResetPage);
|
|
9983
|
+
setSearchParams(newSearchParams);
|
|
9984
|
+
setParams(paramsWithResetPage);
|
|
9985
|
+
setLocalParams(paramsWithResetPage);
|
|
9986
|
+
}, [localParams, setSearchParams]);
|
|
9987
|
+
const reset = React6.useCallback(() => {
|
|
9988
|
+
setLocalParams(initialParams);
|
|
9989
|
+
setParams(initialParams);
|
|
9990
|
+
const newSearchParams = paramsToSearchParams(initialParams);
|
|
9991
|
+
setSearchParams(newSearchParams);
|
|
9992
|
+
}, [initialParams, setSearchParams]);
|
|
9993
|
+
const handleSortChange = React6.useCallback(
|
|
9994
|
+
(sortKey, sortOrder) => {
|
|
9995
|
+
const newParams = {
|
|
9996
|
+
...params,
|
|
9997
|
+
sortBy: sortKey,
|
|
9998
|
+
sortOrder
|
|
9999
|
+
};
|
|
10000
|
+
updateParams(newParams);
|
|
10001
|
+
},
|
|
10002
|
+
[updateParams, params]
|
|
10003
|
+
);
|
|
10004
|
+
const sortOption = React6.useMemo(() => {
|
|
10005
|
+
if (!params.sortBy || !params.sortOrder) return void 0;
|
|
10006
|
+
return {
|
|
10007
|
+
sortKey: params.sortBy,
|
|
10008
|
+
sortOrder: params.sortOrder
|
|
10009
|
+
};
|
|
10010
|
+
}, [params.sortBy, params.sortOrder]);
|
|
10011
|
+
return {
|
|
10012
|
+
localParams,
|
|
10013
|
+
params,
|
|
10014
|
+
updateParam,
|
|
10015
|
+
updateLocalParam,
|
|
10016
|
+
update,
|
|
10017
|
+
reset,
|
|
10018
|
+
handleSortChange,
|
|
10019
|
+
sortOption
|
|
10020
|
+
};
|
|
10021
|
+
}
|
|
10022
|
+
|
|
9844
10023
|
exports.ArrowIcon = ArrowIcon;
|
|
9845
10024
|
exports.Badge = Badge;
|
|
9846
10025
|
exports.BaseUploader = BaseUploader;
|
|
@@ -9931,6 +10110,7 @@ exports.useDetailController = useDetailController;
|
|
|
9931
10110
|
exports.useFilePreviewViewer = useFilePreviewViewer;
|
|
9932
10111
|
exports.useModal = useModal;
|
|
9933
10112
|
exports.useMultiTabStore = useMultiTabStore;
|
|
10113
|
+
exports.useParams = useParams;
|
|
9934
10114
|
exports.useScrollToTop = useScrollToTop;
|
|
9935
10115
|
exports.useStableImageSrc = useStableImageSrc;
|
|
9936
10116
|
exports.useToast = useToast;
|