@pdg/react-form 1.0.51 → 1.0.53

package/dist/FormItemTextFieldBase/FormCompanyNo/FormCompanyNo.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { FormValueItemBaseCommands } from '../../@types';
+declare const FormCompanyNo: React.ForwardRefExoticComponent<Omit<import("../FormText").FormTextProps, "type" | "value" | "maxLength"> & {
+    value?: string | undefined;
+} & React.RefAttributes<FormValueItemBaseCommands<any>>>;
+export default FormCompanyNo;

package/dist/FormItemTextFieldBase/FormCompanyNo/FormCompanyNo.types.d.ts

@@ -0,0 +1,5 @@
+import { FormTextProps } from '../FormText';
+export declare type FormCompanyNoProps = Omit<FormTextProps, 'type' | 'value' | 'maxLength'> & {
+    value?: string;
+};
+export declare const FormCompanyNoDefaultProps: Pick<FormTextProps, 'validPattern'>;

package/dist/FormItemTextFieldBase/FormCompanyNo/index.d.ts

@@ -0,0 +1,4 @@
+import FormCompanyNo from './FormCompanyNo';
+export default FormCompanyNo;
+export { FormCompanyNo };
+export * from './FormCompanyNo.types';

package/dist/FormItemTextFieldBase/FormPersonalNo/FormPersonalNo.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { FormValueItemBaseCommands } from '../../@types';
+declare const FormPersonalNo: React.ForwardRefExoticComponent<Omit<import("../FormText").FormTextProps, "type" | "value" | "maxLength"> & {
+    value?: string | undefined;
+} & React.RefAttributes<FormValueItemBaseCommands<any>>>;
+export default FormPersonalNo;

package/dist/FormItemTextFieldBase/FormPersonalNo/FormPersonalNo.types.d.ts

@@ -0,0 +1,5 @@
+import { FormTextProps } from '../FormText';
+export declare type FormPersonalNoProps = Omit<FormTextProps, 'type' | 'value' | 'maxLength'> & {
+    value?: string;
+};
+export declare const FormPersonalNoDefaultProps: Pick<FormTextProps, 'validPattern'>;

package/dist/FormItemTextFieldBase/FormPersonalNo/index.d.ts

@@ -0,0 +1,4 @@
+import FormPersonalNo from './FormPersonalNo';
+export default FormPersonalNo;
+export { FormPersonalNo };
+export * from './FormPersonalNo.types';

package/dist/FormItemTextFieldBase/index.d.ts

@@ -11,3 +11,5 @@ export * from './FormSearch';
 export * from './FormTextarea';
 export * from './FormUrl';
 export * from './FormSelect';
+export * from './FormCompanyNo';
+export * from './FormPersonalNo';

package/dist/index.esm.js

@@ -2683,7 +2683,7 @@ var templateObject_1;var FormTelDefaultProps = __assign$6(__assign$6({}, FormTex
         if (newValue && notEmpty(newValue)) {
             newValue = newValue.replace(/[^0-9]/gi, '');
         }
-        newValue = getTelAutoDash(newValue);
+        newValue = autoDash$2(newValue);
         return onValue ? onValue(newValue) : newValue;
     }, [onValue]);
     // Render ----------------------------------------------------------------------------------------------------------
@@ -2691,7 +2691,7 @@ var templateObject_1;var FormTelDefaultProps = __assign$6(__assign$6({}, FormTex
 });
 FormTel.displayName = 'FormTel';
 FormTel.defaultProps = FormTelDefaultProps;
-function getTelAutoDash(tel) {
+function autoDash$2(tel) {
     if (tel == null)
         return undefined;
     var str = tel.replace(/[^0-9*]/g, '');
@@ -4449,7 +4449,92 @@ styleInject(css_248z$d);var FormSelect = React__default.forwardRef(function (_a,
             })) : (React__default.createElement(MenuItem, { value: '' })))));
 });
 FormSelect.displayName = 'FormSelect';
-FormSelect.defaultProps = FormSelectDefaultProps;var FormCheckboxDefaultProps = {
+FormSelect.defaultProps = FormSelectDefaultProps;var FormCompanyNoDefaultProps = __assign$6(__assign$6({}, FormTextDefaultProps), { validPattern: /(([0-9]{3})([0-9]{2})([0-9]{5}))|(([0-9]{3})-([0-9]{2})-([0-9]{5}))/ });var FormCompanyNo = React__default.forwardRef(function (_a, ref) {
+    // Event Handler ---------------------------------------------------------------------------------------------------
+    var className = _a.className, onValue = _a.onValue, props = __rest$3(_a, ["className", "onValue"]);
+    var handleOnValue = useCallback(function (value) {
+        var newValue = value;
+        if (newValue && notEmpty(newValue)) {
+            newValue = newValue.replace(/[^0-9]/gi, '');
+        }
+        newValue = autoDash$1(newValue);
+        return onValue ? onValue(newValue) : newValue;
+    }, [onValue]);
+    // Render ----------------------------------------------------------------------------------------------------------
+    return (React__default.createElement(FormText, __assign$6({ ref: ref, className: classNames$1(className, 'FormCompanyNo'), onValue: handleOnValue, maxLength: 12 }, props)));
+});
+FormCompanyNo.displayName = 'FormCompanyNo';
+FormCompanyNo.defaultProps = FormCompanyNoDefaultProps;
+function autoDash$1(companyNo) {
+    if (companyNo == null)
+        return undefined;
+    var str = companyNo.replace(/[^0-9]/g, '');
+    var tmp = '';
+    for (var i = 0; i < str.length; i += 1) {
+        if (i === 3 || i === 5) {
+            tmp += '-';
+        }
+        tmp += str[i];
+    }
+    return tmp;
+}var FormPersonalNoDefaultProps = __assign$6(__assign$6({}, FormTextDefaultProps), { validPattern: /(([0-9]{6})([0-9]{7}))|(([0-9]{6})-([0-9]{7}))/ });var FormPersonalNo = React__default.forwardRef(function (_a, ref) {
+    // Event Handler ---------------------------------------------------------------------------------------------------
+    var className = _a.className, onValue = _a.onValue, onValidate = _a.onValidate, props = __rest$3(_a, ["className", "onValue", "onValidate"]);
+    var handleOnValue = useCallback(function (value) {
+        var newValue = value;
+        if (newValue && notEmpty(newValue)) {
+            newValue = newValue.replace(/[^0-9]/gi, '');
+        }
+        newValue = autoDash(newValue);
+        return onValue ? onValue(newValue) : newValue;
+    }, [onValue]);
+    var handleValidate = useCallback(function (value) {
+        if (notEmpty(value) && value.length === 14 && value.includes('-')) {
+            var jumin = value
+                .replaceAll('-', '')
+                .split('')
+                .map(function (v) { return Number(v); });
+            var ckarr = [2, 3, 4, 5, 6, 7, 8, 9, 2, 3, 4, 5];
+            for (var i = 0; i < jumin.length - 1; i += 1) {
+                jumin[i] = jumin[i] * ckarr[i];
+            }
+            var juminlast = jumin[jumin.length - 1];
+            var sum = 0;
+            for (var i = 0; i < jumin.length - 1; i += 1) {
+                sum += jumin[i];
+            }
+            sum = sum % 11;
+            sum = 11 - sum;
+            if (sum > 9) {
+                sum = sum % 10;
+            }
+            if (sum != juminlast && juminlast != undefined) {
+                return '유효하지 않은 값입니다.';
+            }
+            return onValidate ? onValidate(value) : true;
+        }
+        else {
+            return '유효하지 않은 값입니다.';
+        }
+    }, [onValidate]);
+    // Render ----------------------------------------------------------------------------------------------------------
+    return (React__default.createElement(FormText, __assign$6({ ref: ref, className: classNames$1(className, 'FormPersonalNo'), onValue: handleOnValue, maxLength: 14, onValidate: handleValidate }, props)));
+});
+FormPersonalNo.displayName = 'FormPersonalNo';
+FormPersonalNo.defaultProps = FormPersonalNoDefaultProps;
+function autoDash(personalNo) {
+    if (personalNo == null)
+        return undefined;
+    var str = personalNo.replace(/[^0-9]/g, '');
+    var tmp = '';
+    for (var i = 0; i < str.length; i += 1) {
+        if (i === 6) {
+            tmp += '-';
+        }
+        tmp += str[i];
+    }
+    return tmp;
+}var FormCheckboxDefaultProps = {
     checked: false,
     value: 1,
     uncheckedValue: 0,
@@ -12101,20 +12186,15 @@ FormFile.defaultProps = FormFileDefaultProps;var FormImageFileDefaultProps = __a
 styleInject(css_248z);var FormImageFile = React__default.forwardRef(function (_a, ref) {
     var className = _a.className, imageSize = _a.imageSize, preview = _a.preview, previewMaxHeight = _a.previewMaxHeight, initValue = _a.value, onChange = _a.onChange, onFile = _a.onFile, onLink = _a.onLink, props = __rest$3(_a, ["className", "imageSize", "preview", "previewMaxHeight", "value", "onChange", "onFile", "onLink"]);
     var _b = useAutoUpdateState$1(initValue), value = _b[0], setValue = _b[1];
-    var _c = useState(), previewNode = _c[0], setPreviewNode = _c[1];
-    var _d = useState({
+    var _c = useState({
         open: false,
-    }), alertDialogProps = _d[0], setAlertDialogProps = _d[1];
+    }), alertDialogProps = _c[0], setAlertDialogProps = _c[1];
     var urlKit = useState(function () {
         if (window.URL)
             return window.URL;
         else if (window.webkitURL)
             return window.webkitURL;
     })[0];
-    // Effect ----------------------------------------------------------------------------------------------------------
-    useEffect(function () {
-        setPreviewNode(preview && value ? (React__default.createElement("img", { className: 'preview-img', src: value, style: { maxHeight: previewMaxHeight || undefined }, alt: '' })) : undefined);
-    }, [value, preview, previewMaxHeight]);
     // Function --------------------------------------------------------------------------------------------------------
     var imageSizeCheck = useCallback(function (file) {
         if (imageSize && urlKit) {
@@ -12218,6 +12298,15 @@ styleInject(css_248z);var FormImageFile = React__default.forwardRef(function (_a
             });
         });
     }, [onLink, imageSizeCheck]);
+    // Memo --------------------------------------------------------------------------------------------------------------
+    var previewNode = useMemo(function () {
+        if (preview && value) {
+            return (React__default.createElement("a", { href: value, target: '_blank' },
+                React__default.createElement(Tooltip, { title: React__default.createElement("div", { style: { paddingTop: 3, paddingBottom: 3 } },
+                        React__default.createElement("img", { src: value, style: { maxWidth: '100%', verticalAlign: 'middle' } })) },
+                    React__default.createElement("img", { className: 'preview-img', src: value, style: { maxHeight: previewMaxHeight || undefined }, alt: '' }))));
+        }
+    }, [preview, previewMaxHeight, value]);
     // Render ----------------------------------------------------------------------------------------------------------
     return (React__default.createElement(React__default.Fragment, null,
         React__default.createElement(FormFile, __assign$6({ ref: ref, className: classNames$1(className, 'FormImageFile'), value: value, preview: previewNode, onChange: handleChange, onFile: handleFile, onLink: handleLink }, props)),
@@ -12461,4 +12550,4 @@ SearchButton.defaultProps = SearchButtonDefaultProps;var SearchMenuButtonDefault
 };
 SearchMenuButton.defaultProps = SearchMenuButtonDefaultProps;dayjs.extend(dayjsIsSameOrAfter);
 dayjs.extend(dayjsIsSameOrBefore);
-dayjs.extend(dayjsIsBetween);export{Form,FormAutocomplete,FormAutocompleteDefaultProps,FormBlock,FormBlockDefaultProps,FormBody,FormBodyDefaultProps,FormButton,FormButtonDefaultProps,FormCheckbox,FormCheckboxDefaultProps,FormCol,FormColDefaultProps,FormContext,FormContextDefaultValue,FormContextProvider,FormDatePicker,FormDatePickerDefaultProps,FormDateRangePicker,FormDateRangePickerDefaultProps,FormDateTimePicker,FormDateTimePickerDefaultProps,FormDefaultProps,FormDivider,FormDividerDefaultProps,FormEmail,FormEmailDefaultProps,FormFile,FormFileDefaultProps,FormFooter,FormFooterDefaultProps,FormHidden,FormHiddenDefaultProps,FormIcon,FormIconDefaultProps,FormImageFile,FormImageFileDefaultProps,FormLabel,FormLabelDefaultProps,FormMobile,FormMobileDefaultProps,FormNumber,FormNumberDefaultProps,FormPassword,FormPasswordDefaultProps,FormRadioGroup,FormRadioGroupDefaultProps,FormRating,FormRatingDefaultProps,FormRow,FormRowDefaultProps,FormSearch,FormSearchDefaultProps,FormSelect,FormSelectDefaultProps,FormTag,FormTagDefaultProps,FormTel,FormTelDefaultProps,FormText,FormTextDefaultProps,FormTextEditor,FormTextEditorDefaultProps,FormTextField,FormTextFieldDefaultProps,FormTextarea,FormTextareaDefaultProps,FormTimePicker,FormTimePickerDefaultProps,FormToggleButtonGroup,FormToggleButtonGroupDefaultProps,FormUrl,FormUrlDefaultProps,Search,SearchButton,SearchButtonDefaultProps,SearchDefaultProps,SearchGroup,SearchGroupDefaultProps,SearchGroupRow,SearchGroupRowDefaultProps,SearchMenuButton,SearchMenuButtonDefaultProps,useFormState};//# sourceMappingURL=index.esm.js.map
+dayjs.extend(dayjsIsBetween);export{Form,FormAutocomplete,FormAutocompleteDefaultProps,FormBlock,FormBlockDefaultProps,FormBody,FormBodyDefaultProps,FormButton,FormButtonDefaultProps,FormCheckbox,FormCheckboxDefaultProps,FormCol,FormColDefaultProps,FormCompanyNo,FormCompanyNoDefaultProps,FormContext,FormContextDefaultValue,FormContextProvider,FormDatePicker,FormDatePickerDefaultProps,FormDateRangePicker,FormDateRangePickerDefaultProps,FormDateTimePicker,FormDateTimePickerDefaultProps,FormDefaultProps,FormDivider,FormDividerDefaultProps,FormEmail,FormEmailDefaultProps,FormFile,FormFileDefaultProps,FormFooter,FormFooterDefaultProps,FormHidden,FormHiddenDefaultProps,FormIcon,FormIconDefaultProps,FormImageFile,FormImageFileDefaultProps,FormLabel,FormLabelDefaultProps,FormMobile,FormMobileDefaultProps,FormNumber,FormNumberDefaultProps,FormPassword,FormPasswordDefaultProps,FormPersonalNo,FormPersonalNoDefaultProps,FormRadioGroup,FormRadioGroupDefaultProps,FormRating,FormRatingDefaultProps,FormRow,FormRowDefaultProps,FormSearch,FormSearchDefaultProps,FormSelect,FormSelectDefaultProps,FormTag,FormTagDefaultProps,FormTel,FormTelDefaultProps,FormText,FormTextDefaultProps,FormTextEditor,FormTextEditorDefaultProps,FormTextField,FormTextFieldDefaultProps,FormTextarea,FormTextareaDefaultProps,FormTimePicker,FormTimePickerDefaultProps,FormToggleButtonGroup,FormToggleButtonGroupDefaultProps,FormUrl,FormUrlDefaultProps,Search,SearchButton,SearchButtonDefaultProps,SearchDefaultProps,SearchGroup,SearchGroupDefaultProps,SearchGroupRow,SearchGroupRowDefaultProps,SearchMenuButton,SearchMenuButtonDefaultProps,useFormState};//# sourceMappingURL=index.esm.js.map