@pdg/react-form 1.0.91 → 1.0.93

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.
@@ -1,3 +1,3 @@
1
1
  /// <reference types="react" />
2
- export declare const IconFormIcon: import("@emotion/styled").StyledComponent<import("../FormIcon").FormIconProps & import("react").RefAttributes<HTMLAnchorElement> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
2
+ export declare const IconPdgIcon: import("@emotion/styled").StyledComponent<import("@pdg/react-component").PdgIconProps & import("react").RefAttributes<HTMLAnchorElement> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
3
3
  export declare const ChildrenSpan: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
@@ -1,3 +1,2 @@
1
1
  export * from './FormButton';
2
2
  export * from './FormLabel';
3
- export * from './FormIcon';
@@ -1,11 +1,11 @@
1
1
  import { ReactNode } from 'react';
2
2
  import { CommonSxProps } from '../../@types';
3
3
  import { FormProps } from '../../Form';
4
- import { FormIconProps } from '../../FormCommon';
4
+ import { PdgIconProps } from '@pdg/react-component';
5
5
  export interface FormDividerProps extends CommonSxProps {
6
6
  size?: FormProps['size'];
7
7
  color?: FormProps['color'];
8
- icon?: FormIconProps['children'];
8
+ icon?: PdgIconProps['children'];
9
9
  label?: ReactNode;
10
10
  line?: boolean;
11
11
  lineVerticalMargin?: string | number;
package/dist/index.esm.js CHANGED
@@ -1,4 +1,4 @@
1
- import React,{createContext,useContext,useMemo,useRef,useState,useCallback,useLayoutEffect,useEffect,useId}from'react';import classNames from'classnames';import {Box,Icon,Button,styled,useTheme,InputLabel,Grid,Collapse,FormHelperText,InputAdornment,IconButton,TextField,Chip,Autocomplete,CircularProgress,MenuItem,Checkbox,FormControl,Input,OutlinedInput,FilledInput,FormControlLabel,Typography,RadioGroup,Radio,ToggleButton,ToggleButtonGroup,Rating,Skeleton,darken,Tooltip,tooltipClasses,ClickAwayListener,Dialog,DialogTitle,DialogContent,DialogActions,Switch,Paper,Menu}from'@mui/material';import {empty,nextTick,notEmpty,equal,telAutoDash,companyNoAutoDash,personalNoAutoDash}from'@pdg/util';import dayjs from'dayjs';import {useAutoUpdateState,useFirstSkipEffect}from'@pdg/react-hook';import {useResizeDetector}from'react-resize-detector';import {NumericFormat}from'react-number-format';import {CheckBox,CheckBoxOutlineBlank,RadioButtonUnchecked,RadioButtonChecked}from'@mui/icons-material';import {Editor}from'@tinymce/tinymce-react';import CircularProgress$1 from'@mui/material/CircularProgress';import {AdapterDayjs}from'@mui/x-date-pickers/AdapterDayjs';import {PickersDay,StaticDatePicker,LocalizationProvider,DesktopDatePicker,StaticDateTimePicker,DesktopDateTimePicker}from'@mui/x-date-pickers';import {PdgIconText}from'@pdg/react-component';import SimpleBar from'simplebar-react';import'dayjs/locale/ko';/******************************************************************************
1
+ import React,{createContext,useContext,useMemo,useRef,useState,useCallback,useLayoutEffect,useEffect,useId}from'react';import classNames from'classnames';import {Box,Button,styled,useTheme,InputLabel,Grid,Collapse,FormHelperText,InputAdornment,IconButton,TextField,Chip,Autocomplete,Icon,CircularProgress,MenuItem,Checkbox,FormControl,Input,OutlinedInput,FilledInput,FormControlLabel,Typography,RadioGroup,Radio,ToggleButton,ToggleButtonGroup,Rating,Skeleton,darken,Tooltip,tooltipClasses,ClickAwayListener,Dialog,DialogTitle,DialogContent,DialogActions,Switch,Paper,Menu}from'@mui/material';import {empty,nextTick,notEmpty,equal,telNoAutoDash,companyNoAutoDash,personalNoAutoDash}from'@pdg/util';import dayjs from'dayjs';import {PdgIcon,PdgIconText}from'@pdg/react-component';import {useAutoUpdateState,useFirstSkipEffect}from'@pdg/react-hook';import {useResizeDetector}from'react-resize-detector';import {NumericFormat}from'react-number-format';import {CheckBox,CheckBoxOutlineBlank,RadioButtonUnchecked,RadioButtonChecked}from'@mui/icons-material';import {Editor}from'@tinymce/tinymce-react';import CircularProgress$1 from'@mui/material/CircularProgress';import {AdapterDayjs}from'@mui/x-date-pickers/AdapterDayjs';import {PickersDay,StaticDatePicker,LocalizationProvider,DesktopDatePicker,StaticDateTimePicker,DesktopDateTimePicker}from'@mui/x-date-pickers';import SimpleBar from'simplebar-react';import'dayjs/locale/ko';/******************************************************************************
2
2
  Copyright (c) Microsoft Corporation.
3
3
 
4
4
  Permission to use, copy, modify, and/or distribute this software for any
@@ -557,15 +557,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
557
557
  Form.displayName = 'Form';
558
558
  Form.defaultProps = FormDefaultProps;var FormButtonDefaultProps = {
559
559
  type: 'button',
560
- };var FormIconDefaultProps = {};var FormIcon = React.forwardRef(function (_a, ref) {
561
- var className = _a.className, InitChildren = _a.children, props = __rest(_a, ["className", "children"]);
562
- return useMemo(function () {
563
- var iconProps = __assign(__assign({}, props), { className: classNames('FormIcon', className) });
564
- return typeof InitChildren === 'string' ? (React.createElement(Icon, __assign({ ref: ref }, iconProps), InitChildren.replace(/[A-Z]/g, function (letter, idx) { return "".concat(idx > 0 ? '_' : '').concat(letter.toLowerCase()); }))) : (React.createElement(InitChildren, __assign({}, iconProps)));
565
- }, [InitChildren, className, props, ref]);
566
- });
567
- FormIcon.displayName = 'FormIcon';
568
- FormIcon.defaultProps = FormIconDefaultProps;var FormButton = React.forwardRef(function (_a, ref) {
560
+ };var FormButton = React.forwardRef(function (_a, ref) {
569
561
  /********************************************************************************************************************
570
562
  * FormState
571
563
  * ******************************************************************************************************************/
@@ -596,12 +588,14 @@ FormIcon.defaultProps = FormIconDefaultProps;var FormButton = React.forwardRef(f
596
588
  /********************************************************************************************************************
597
589
  * Render
598
590
  * ******************************************************************************************************************/
599
- return (React.createElement(Button, __assign({ ref: ref, className: classNames(className, 'FormButton'), type: type, variant: variant, size: size, color: color, fullWidth: fullWidth, onClick: onClick, startIcon: startIcon ? React.createElement(FormIcon, { sx: { mr: -0.5 } }, startIcon) : undefined, endIcon: endIcon ? React.createElement(FormIcon, { sx: { ml: -0.5 } }, endIcon) : undefined }, props),
600
- icon && (React.createElement(FormIcon, { fontSize: size, color: 'inherit', sx: { mr: children ? 0.5 : undefined } }, icon)),
601
- children));
591
+ return (React.createElement(Button, __assign({ ref: ref, className: classNames(className, 'FormButton'), type: type, variant: variant, size: size, color: color, fullWidth: fullWidth, onClick: onClick }, props),
592
+ React.createElement(Box, { display: 'inline-flex', flexDirection: 'row', alignItems: 'center' },
593
+ (icon || startIcon) && (React.createElement(PdgIcon, { fontSize: size, color: 'inherit', sx: { mr: children ? 0.5 : undefined } }, icon || startIcon)),
594
+ children,
595
+ endIcon && (React.createElement(PdgIcon, { fontSize: size, color: 'inherit', sx: { ml: children ? 0.5 : undefined } }, endIcon)))));
602
596
  });
603
597
  FormButton.displayName = 'FormButton';
604
- FormButton.defaultProps = FormButtonDefaultProps;var FormLabelDefaultProps = {};var IconFormIcon = styled(FormIcon)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n vertical-align: middle;\n margin-right: 3px;\n margin-top: -4px;\n margin-bottom: -2px;\n"], ["\n vertical-align: middle;\n margin-right: 3px;\n margin-top: -4px;\n margin-bottom: -2px;\n"])));
598
+ FormButton.defaultProps = FormButtonDefaultProps;var FormLabelDefaultProps = {};var IconPdgIcon = styled(PdgIcon)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n vertical-align: middle;\n margin-right: 3px;\n margin-top: -4px;\n margin-bottom: -2px;\n"], ["\n vertical-align: middle;\n margin-right: 3px;\n margin-top: -4px;\n margin-bottom: -2px;\n"])));
605
599
  var ChildrenSpan = styled('span')(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n vertical-align: middle;\n"], ["\n vertical-align: middle;\n"])));
606
600
  var templateObject_1$g, templateObject_2$8;var FormLabel = React.forwardRef(function (_a, ref) {
607
601
  /********************************************************************************************************************
@@ -623,7 +617,7 @@ var templateObject_1$g, templateObject_2$8;var FormLabel = React.forwardRef(func
623
617
  * Render
624
618
  * ******************************************************************************************************************/
625
619
  return (React.createElement(InputLabel, __assign({ ref: ref }, finalProps), icon ? (React.createElement(React.Fragment, null,
626
- React.createElement(IconFormIcon, null, icon),
620
+ React.createElement(IconPdgIcon, null, icon),
627
621
  React.createElement(ChildrenSpan, null, children))) : (children)));
628
622
  });
629
623
  FormLabel.displayName = 'FormLabel';
@@ -706,7 +700,7 @@ var FormDivider = React.forwardRef(function (_a, ref) {
706
700
  padding: 0,
707
701
  cursor: collapse ? 'pointer' : undefined,
708
702
  }, onClick: handleClick },
709
- icon && (React.createElement(FormIcon, { style: { opacity: 0.54, marginRight: 5 }, color: error ? 'error' : warning ? 'warning' : undefined, fontSize: size }, icon)),
703
+ icon && (React.createElement(PdgIcon, { style: { opacity: 0.54, marginRight: 5 }, color: error ? 'error' : warning ? 'warning' : undefined, fontSize: size }, icon)),
710
704
  label && (React.createElement(Box, { sx: {
711
705
  paddingRight: '10px',
712
706
  color: error ? 'error.main' : warning ? 'warning.main' : 'text.secondary',
@@ -714,7 +708,7 @@ var FormDivider = React.forwardRef(function (_a, ref) {
714
708
  fontSize: size === 'small' ? '11.5px' : '12px',
715
709
  } }, label)),
716
710
  (line || collapse) && (React.createElement("div", { style: lineStyle }, error ? React.createElement(StyledErrorLineBox, null) : warning ? React.createElement(StyledWarningLineBox, null) : React.createElement(StyledLineBox, null))),
717
- collapse && (React.createElement(FormIcon, { sx: { opacity: 0.6, ml: 1 }, color: error ? 'error' : warning ? 'warning' : undefined }, collapseIn ? 'KeyboardDoubleArrowUp' : 'KeyboardDoubleArrowDown')))));
711
+ collapse && (React.createElement(PdgIcon, { sx: { opacity: 0.6, ml: 1 }, color: error ? 'error' : warning ? 'warning' : undefined }, collapseIn ? 'KeyboardDoubleArrowUp' : 'KeyboardDoubleArrowDown')))));
718
712
  });
719
713
  FormDivider.displayName = 'FormDivider.';
720
714
  FormDivider.defaultProps = FormDividerDefaultProps;var StyledWrapGrid$1 = styled(Grid)(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
@@ -1122,7 +1116,7 @@ styleInject(css_248z$l);var FormTextField = React.forwardRef(function (_a, ref)
1122
1116
  * ******************************************************************************************************************/
1123
1117
  var label = useMemo(function () {
1124
1118
  return labelIcon ? (React.createElement(React.Fragment, null,
1125
- React.createElement(FormIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
1119
+ React.createElement(PdgIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
1126
1120
  React.createElement("span", { style: { verticalAlign: 'middle' } }, initLabel))) : (initLabel);
1127
1121
  }, [initLabel, labelIcon]);
1128
1122
  /********************************************************************************************************************
@@ -1205,7 +1199,7 @@ styleInject(css_248z$l);var FormTextField = React.forwardRef(function (_a, ref)
1205
1199
  if (startAdornment || icon || muiInputProps.startAdornment) {
1206
1200
  muiInputProps.startAdornment = (React.createElement(React.Fragment, null,
1207
1201
  icon && (React.createElement(InputAdornment, { position: 'start' },
1208
- React.createElement(FormIcon, { fontSize: 'small' }, icon))),
1202
+ React.createElement(PdgIcon, { fontSize: 'small' }, icon))),
1209
1203
  startAdornment && React.createElement(InputAdornment, { position: 'start' }, startAdornment),
1210
1204
  muiInputProps.startAdornment));
1211
1205
  }
@@ -1223,7 +1217,7 @@ styleInject(css_248z$l);var FormTextField = React.forwardRef(function (_a, ref)
1223
1217
  });
1224
1218
  }
1225
1219
  } },
1226
- React.createElement(FormIcon, { fontSize: 'inherit' }, "ClearRounded")))),
1220
+ React.createElement(PdgIcon, { fontSize: 'inherit' }, "ClearRounded")))),
1227
1221
  muiInputProps.endAdornment,
1228
1222
  endAdornment && React.createElement(InputAdornment, { position: 'end' }, endAdornment)));
1229
1223
  }
@@ -1676,7 +1670,7 @@ var templateObject_1$b;var FormTelDefaultProps = __assign(__assign({}, FormTextD
1676
1670
  * ******************************************************************************************************************/
1677
1671
  var className = _a.className, onValue = _a.onValue, props = __rest(_a, ["className", "onValue"]);
1678
1672
  var handleValue = useCallback(function (value) {
1679
- var newValue = telAutoDash(value.replace(/[^0-9]/gi, ''));
1673
+ var newValue = telNoAutoDash(value.replace(/[^0-9]/gi, ''));
1680
1674
  return onValue ? onValue(newValue) : newValue;
1681
1675
  }, [onValue]);
1682
1676
  /********************************************************************************************************************
@@ -2568,7 +2562,7 @@ styleInject(css_248z$e);var FormItemBase = React.forwardRef(function (_a, ref) {
2568
2562
  return (React.createElement("div", { style: wrapStyle },
2569
2563
  React.createElement(FormControl, { ref: ref, variant: 'standard', className: classNames(className, 'FormItemBase', !!label && 'with-label', "variant-".concat(variant), controlVerticalCenter && 'control-vertical-center', !!error && 'error'), style: style, color: color, error: error, focused: focused, sx: sx },
2570
2564
  !formColWithLabel && label && (React.createElement(InputLabel, { shrink: true, className: 'FormItemBase-InputLabel', size: size === 'medium' ? 'normal' : size, required: required }, labelIcon ? (React.createElement(React.Fragment, null,
2571
- React.createElement(FormIcon, { style: { verticalAlign: 'middle', marginRight: 3, marginTop: -4, marginBottom: -2 } }, labelIcon),
2565
+ React.createElement(PdgIcon, { style: { verticalAlign: 'middle', marginRight: 3, marginTop: -4, marginBottom: -2 } }, labelIcon),
2572
2566
  React.createElement("span", { style: { verticalAlign: 'middle' } }, label))) : (label))),
2573
2567
  React.createElement("div", { className: 'FormItemBase-Control-wrap', style: { display: 'grid', marginTop: hideLabel ? 0 : undefined } }, autoSize ? (React.createElement(React.Fragment, null,
2574
2568
  variant === 'standard' && (React.createElement(Input, { ref: inputRef, size: size, fullWidth: true, disabled: true, style: { visibility: 'hidden' } })),
@@ -3867,7 +3861,7 @@ FormToggleButtonGroup.defaultProps = FormToggleButtonGroupDefaultProps;var FormR
3867
3861
  /********************************************************************************************************************
3868
3862
  * Render
3869
3863
  * ******************************************************************************************************************/
3870
- return (React.createElement(FormItemBase, { variant: variant, size: size, color: color, focused: focused, className: classNames(className, 'FormValueItem', 'FormRating'), labelIcon: labelIcon, label: label, error: error, fullWidth: false, required: required, helperText: error ? errorHelperText : helperText, helperTextProps: { style: { marginLeft: 5 } }, style: style, sx: sx, hidden: hidden, autoSize: true, controlHeight: height || (size === 'small' ? 21 : 26), controlVerticalCenter: true, control: React.createElement(Rating, { ref: ratingRef, size: size === 'medium' ? 'large' : 'medium', name: name, precision: precision, highlightSelectedOnly: highlightSelectedOnly, value: value, disabled: disabled || readOnly, max: max, icon: React.createElement(FormIcon, { color: color, fontSize: 'inherit' }, icon ? icon : 'Star'), emptyIcon: React.createElement(FormIcon, { fontSize: 'inherit' }, emptyIcon ? emptyIcon : 'StarBorder'), onChange: handleChange, onFocus: function () { return setFocused(initFocused || true); }, onBlur: function () { return setFocused(initFocused || false); } }) }));
3864
+ return (React.createElement(FormItemBase, { variant: variant, size: size, color: color, focused: focused, className: classNames(className, 'FormValueItem', 'FormRating'), labelIcon: labelIcon, label: label, error: error, fullWidth: false, required: required, helperText: error ? errorHelperText : helperText, helperTextProps: { style: { marginLeft: 5 } }, style: style, sx: sx, hidden: hidden, autoSize: true, controlHeight: height || (size === 'small' ? 21 : 26), controlVerticalCenter: true, control: React.createElement(Rating, { ref: ratingRef, size: size === 'medium' ? 'large' : 'medium', name: name, precision: precision, highlightSelectedOnly: highlightSelectedOnly, value: value, disabled: disabled || readOnly, max: max, icon: React.createElement(PdgIcon, { color: color, fontSize: 'inherit' }, icon ? icon : 'Star'), emptyIcon: React.createElement(PdgIcon, { fontSize: 'inherit' }, emptyIcon ? emptyIcon : 'StarBorder'), onChange: handleChange, onFocus: function () { return setFocused(initFocused || true); }, onBlur: function () { return setFocused(initFocused || false); } }) }));
3871
3865
  });
3872
3866
  FormRating.displayName = 'FormRating';
3873
3867
  FormRating.defaultProps = FormRatingDefaultProps;var FormTextEditorDefaultProps = {
@@ -5539,7 +5533,7 @@ styleInject(css_248z$7);var PrivateDatePicker = React.forwardRef(function (_a, r
5539
5533
  if (startAdornment || icon || muiInputProps.startAdornment) {
5540
5534
  muiInputProps.startAdornment = (React.createElement(React.Fragment, null,
5541
5535
  icon && (React.createElement(InputAdornment, { position: 'start' },
5542
- React.createElement(FormIcon, { fontSize: 'small' }, icon))),
5536
+ React.createElement(PdgIcon, { fontSize: 'small' }, icon))),
5543
5537
  startAdornment && React.createElement(InputAdornment, { position: 'start' }, startAdornment),
5544
5538
  muiInputProps.startAdornment));
5545
5539
  }
@@ -6324,7 +6318,7 @@ PrivateStaticDateTimePicker.defaultProps = PrivateStaticDateTimePickerDefaultPro
6324
6318
  if (startAdornment || icon || muiInputProps.startAdornment) {
6325
6319
  muiInputProps.startAdornment = (React.createElement(React.Fragment, null,
6326
6320
  icon && (React.createElement(InputAdornment, { position: 'start' },
6327
- React.createElement(FormIcon, { fontSize: 'small' }, icon))),
6321
+ React.createElement(PdgIcon, { fontSize: 'small' }, icon))),
6328
6322
  startAdornment && React.createElement(InputAdornment, { position: 'start' }, startAdornment),
6329
6323
  muiInputProps.startAdornment));
6330
6324
  }
@@ -6427,7 +6421,7 @@ styleInject(css_248z$4);var PrivateInputDatePicker = React.forwardRef(function (
6427
6421
  * ******************************************************************************************************************/
6428
6422
  var label = useMemo(function () {
6429
6423
  return labelIcon ? (React.createElement(React.Fragment, null,
6430
- React.createElement(FormIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
6424
+ React.createElement(PdgIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
6431
6425
  React.createElement("span", { style: { verticalAlign: 'middle' } }, initLabel))) : (initLabel);
6432
6426
  }, [initLabel, labelIcon]);
6433
6427
  var inputLabelProps = useMemo(function () {
@@ -6444,7 +6438,7 @@ styleInject(css_248z$4);var PrivateInputDatePicker = React.forwardRef(function (
6444
6438
  if (startAdornment || icon || muiInputProps.startAdornment) {
6445
6439
  muiInputProps.startAdornment = (React.createElement(React.Fragment, null,
6446
6440
  icon && (React.createElement(InputAdornment, { position: 'start' },
6447
- React.createElement(FormIcon, { fontSize: 'small' }, icon))),
6441
+ React.createElement(PdgIcon, { fontSize: 'small' }, icon))),
6448
6442
  startAdornment && React.createElement(InputAdornment, { position: 'start' }, startAdornment),
6449
6443
  muiInputProps.startAdornment));
6450
6444
  }
@@ -7060,14 +7054,14 @@ var templateObject_1$5, templateObject_2$3, templateObject_3$2, templateObject_4
7060
7054
  return (React.createElement("div", { className: 'PrivateYearPicker' },
7061
7055
  !hideHeader && (React.createElement(StyledTitleContainer, null,
7062
7056
  React.createElement(StyledIconButton$1, { disabled: prevBtnDisabled, onClick: handlePrevClick },
7063
- React.createElement(FormIcon, null, "KeyboardArrowLeft")),
7057
+ React.createElement(PdgIcon, null, "KeyboardArrowLeft")),
7064
7058
  displayError ? (React.createElement(StyledYearMonthError$1, null,
7065
7059
  displayYear,
7066
7060
  "\uB144")) : (React.createElement(StyledYearMonth$1, null,
7067
7061
  displayYear,
7068
7062
  "\uB144")),
7069
7063
  React.createElement(StyledIconButton$1, { disabled: nextBtnDisabled, onClick: handleNextClick },
7070
- React.createElement(FormIcon, null, "KeyboardArrowRight")))),
7064
+ React.createElement(PdgIcon, null, "KeyboardArrowRight")))),
7071
7065
  React.createElement("div", null,
7072
7066
  React.createElement(PrivateYearPickerYearList, { value: value, minYear: minYear, maxYear: maxYear, disablePast: disablePast, disableFuture: disableFuture, selectFromYear: selectFromYear, selectToYear: selectToYear, onChange: handleYearChange }))));
7073
7067
  };
@@ -7290,7 +7284,7 @@ var templateObject_1$2, templateObject_2$1, templateObject_3$1, templateObject_4
7290
7284
  return (React.createElement(StyledContainer, { className: 'PrivateMonthPicker' },
7291
7285
  React.createElement(TitleContainer, null,
7292
7286
  React.createElement(StyledIconButton, { disabled: prevBtnDisabled, onClick: handlePrevClick },
7293
- React.createElement(FormIcon, null, "KeyboardArrowLeft")),
7287
+ React.createElement(PdgIcon, null, "KeyboardArrowLeft")),
7294
7288
  displayValueError ? (React.createElement(StyledYearMonthError, null,
7295
7289
  displayValue.year,
7296
7290
  "\uB144 ",
@@ -7301,7 +7295,7 @@ var templateObject_1$2, templateObject_2$1, templateObject_3$1, templateObject_4
7301
7295
  displayValue.month,
7302
7296
  "\uC6D4")),
7303
7297
  React.createElement(StyledIconButton, { disabled: nextBtnDisabled, onClick: handleNextClick },
7304
- React.createElement(FormIcon, null, "KeyboardArrowRight"))),
7298
+ React.createElement(PdgIcon, null, "KeyboardArrowRight"))),
7305
7299
  React.createElement("div", null,
7306
7300
  React.createElement(PrivateYearPicker, { value: (value === null || value === void 0 ? void 0 : value.year) || null, minYear: minValue.year, maxYear: maxValue.year, disablePast: disablePast, disableFuture: disableFuture, onChange: handleYearChange, hideHeader: true, selectFromYear: selectFromYear, selectToYear: selectToYear })),
7307
7301
  React.createElement("div", { style: { borderTop: '1px solid #efefef' } },
@@ -8651,7 +8645,7 @@ FormDateRangePicker.defaultProps = FormDateRangePickerDefaultProps;var FormFileD
8651
8645
  React.createElement(Button, { variant: 'text', onClick: handleSubmit }, "\uD655\uC778"))));
8652
8646
  };
8653
8647
  LinkDialog.displayName = 'LinkDialog';
8654
- LinkDialog.defaultProps = LinkDialogDefaultProps;var css_248z$1 = ".FormFile .control-wrap {\n display: inline-flex;\n}\n.FormFile .control-wrap .file-name-wrap .file-name {\n min-width: 350px;\n}\n.FormFile .control-wrap .file-name-wrap .file-name .MuiInputBase-root {\n padding-right: 7px;\n}\n.FormFile .control-wrap .input-file {\n display: none;\n}\n.FormFile .control-wrap .form-file-btn {\n min-width: 0;\n padding: 0;\n}\n.FormFile .control-wrap .form-file-btn label {\n cursor: pointer;\n display: flex;\n width: 100%;\n height: 100%;\n justify-content: center;\n align-items: center;\n padding: 0 10px;\n}\n.FormFile .control-wrap .form-file-btn label .FormIcon {\n margin-right: 5px;\n}\n.FormFile .control-wrap .form-file-btn.hidden-label label .FormIcon {\n margin-left: 0;\n margin-right: 0;\n}\n.FormFile .control-wrap .input-file-wrap {\n display: flex;\n}\n.FormFile .control-wrap .input-file-wrap .input-file-btn .FormIcon {\n margin-left: -3px;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:first-of-type:not(:last-of-type) {\n border-right: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:last-of-type:not(:first-of-type) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:not(:first-of-type):not(:last-of-type) {\n border-right: 0;\n border-radius: 0;\n}\n.FormFile.full-width .control-wrap {\n display: flex;\n}\n.FormFile.full-width .control-wrap .file-name-wrap {\n flex: 1;\n}\n.FormFile.variant-standard .file-name-wrap .file-name .MuiInputBase-root {\n padding-right: 0;\n}\n\n.FormFile:not(.hide-file-name).variant-outlined .form-file-btn label, .FormFile:not(.hide-file-name).variant-filled .form-file-btn label {\n padding-top: 10px;\n padding-bottom: 10px;\n}\n.FormFile:not(.hide-file-name).variant-standard .form-file-btn label {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n.FormFile:not(.hide-file-name).size-small .form-file-btn label {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n\n.FormFile.hide-file-name:not(.with-label).variant-outlined .form-file-btn {\n height: 52px;\n}\n.FormFile.hide-file-name:not(.with-label).variant-filled .form-file-btn {\n height: 52px;\n}\n.FormFile.hide-file-name:not(.with-label).variant-standard .form-file-btn {\n height: 28px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-outlined .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-filled .form-file-btn {\n height: 44px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-standard .form-file-btn {\n height: 26px;\n}\n.FormFile.hide-file-name.with-label.variant-outlined .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name.with-label.variant-filled .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name.with-label.variant-standard .form-file-btn {\n height: 28px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-outlined .form-file-btn {\n height: 24px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-filled .form-file-btn {\n height: 31px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-standard .form-file-btn {\n height: 26px;\n}\n\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-outlined .form-file-btn {\n height: 37px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-filled .form-file-btn {\n height: 37px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-standard .form-file-btn {\n height: 28px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-outlined .form-file-btn {\n height: 24px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-filled .form-file-btn {\n height: 31px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-standard .form-file-btn {\n height: 26px;\n}";
8648
+ LinkDialog.defaultProps = LinkDialogDefaultProps;var css_248z$1 = ".FormFile .control-wrap {\n display: inline-flex;\n}\n.FormFile .control-wrap .file-name-wrap .file-name {\n min-width: 350px;\n}\n.FormFile .control-wrap .file-name-wrap .file-name .MuiInputBase-root {\n padding-right: 7px;\n}\n.FormFile .control-wrap .input-file {\n display: none;\n}\n.FormFile .control-wrap .form-file-btn {\n min-width: 0;\n padding: 0;\n}\n.FormFile .control-wrap .form-file-btn label {\n cursor: pointer;\n display: flex;\n width: 100%;\n height: 100%;\n justify-content: center;\n align-items: center;\n padding: 0 10px;\n}\n.FormFile .control-wrap .form-file-btn label .PdgIcon {\n margin-right: 5px;\n}\n.FormFile .control-wrap .form-file-btn.hidden-label label .PdgIcon {\n margin-left: 0;\n margin-right: 0;\n}\n.FormFile .control-wrap .input-file-wrap {\n display: flex;\n}\n.FormFile .control-wrap .input-file-wrap .input-file-btn .PdgIcon {\n margin-left: -3px;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:first-of-type:not(:last-of-type) {\n border-right: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:last-of-type:not(:first-of-type) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:not(:first-of-type):not(:last-of-type) {\n border-right: 0;\n border-radius: 0;\n}\n.FormFile.full-width .control-wrap {\n display: flex;\n}\n.FormFile.full-width .control-wrap .file-name-wrap {\n flex: 1;\n}\n.FormFile.variant-standard .file-name-wrap .file-name .MuiInputBase-root {\n padding-right: 0;\n}\n\n.FormFile:not(.hide-file-name).variant-outlined .form-file-btn label, .FormFile:not(.hide-file-name).variant-filled .form-file-btn label {\n padding-top: 10px;\n padding-bottom: 10px;\n}\n.FormFile:not(.hide-file-name).variant-standard .form-file-btn label {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n.FormFile:not(.hide-file-name).size-small .form-file-btn label {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n\n.FormFile.hide-file-name:not(.with-label).variant-outlined .form-file-btn {\n height: 52px;\n}\n.FormFile.hide-file-name:not(.with-label).variant-filled .form-file-btn {\n height: 52px;\n}\n.FormFile.hide-file-name:not(.with-label).variant-standard .form-file-btn {\n height: 28px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-outlined .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-filled .form-file-btn {\n height: 44px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-standard .form-file-btn {\n height: 26px;\n}\n.FormFile.hide-file-name.with-label.variant-outlined .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name.with-label.variant-filled .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name.with-label.variant-standard .form-file-btn {\n height: 28px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-outlined .form-file-btn {\n height: 24px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-filled .form-file-btn {\n height: 31px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-standard .form-file-btn {\n height: 26px;\n}\n\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-outlined .form-file-btn {\n height: 37px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-filled .form-file-btn {\n height: 37px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-standard .form-file-btn {\n height: 28px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-outlined .form-file-btn {\n height: 24px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-filled .form-file-btn {\n height: 31px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-standard .form-file-btn {\n height: 26px;\n}";
8655
8649
  styleInject(css_248z$1);var FormFile = React.forwardRef(function (_a, ref) {
8656
8650
  /********************************************************************************************************************
8657
8651
  * ID
@@ -8710,7 +8704,7 @@ styleInject(css_248z$1);var FormFile = React.forwardRef(function (_a, ref) {
8710
8704
  * ******************************************************************************************************************/
8711
8705
  var label = useMemo(function () {
8712
8706
  return labelIcon ? (React.createElement(React.Fragment, null,
8713
- React.createElement(FormIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
8707
+ React.createElement(PdgIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
8714
8708
  React.createElement("span", { style: { verticalAlign: 'middle' } }, initLabel))) : (initLabel);
8715
8709
  }, [initLabel, labelIcon]);
8716
8710
  /********************************************************************************************************************
@@ -8947,32 +8941,32 @@ styleInject(css_248z$1);var FormFile = React.forwardRef(function (_a, ref) {
8947
8941
  !hideUpload && (React.createElement(React.Fragment, null,
8948
8942
  React.createElement(Button, { variant: 'text', tabIndex: uploadTabIndex == null ? -1 : uploadTabIndex, className: classNames('input-file-btn form-file-btn', !!hideUploadLabel && 'hidden-label'), color: error ? 'error' : color, disabled: readOnly || disabled, ref: fileUploadBtnRef },
8949
8943
  React.createElement("label", { htmlFor: id },
8950
- React.createElement(FormIcon, null, "upload"),
8944
+ React.createElement(PdgIcon, null, "upload"),
8951
8945
  !hideUploadLabel && (uploadLabel || '파일 업로드'))),
8952
8946
  React.createElement("input", { type: 'file', accept: accept, id: id, value: fileValue, className: 'input-file', onChange: handleFileChange }))),
8953
8947
  !hideLink && (React.createElement(Button, { variant: 'text', tabIndex: linkTabIndex == null ? -1 : linkTabIndex, className: classNames('link-btn form-file-btn', !!hideLinkLabel && 'hidden-label'), color: error ? 'error' : color, disabled: readOnly || disabled, ref: linkBtnRef, onClick: handleLinkClick },
8954
8948
  React.createElement("label", null,
8955
- React.createElement(FormIcon, null, "link"),
8949
+ React.createElement(PdgIcon, null, "link"),
8956
8950
  !hideLinkLabel && (linkLabel || '링크')))),
8957
8951
  !hideRemove && notEmpty(value) && (React.createElement(Button, { variant: 'text', tabIndex: removeTabIndex == null ? -1 : removeTabIndex, className: classNames('remove-btn form-file-btn', !!hideRemoveLabel && 'hidden-label'), color: error ? 'error' : color, disabled: readOnly || disabled, onClick: handleRemoveClick },
8958
8952
  React.createElement("label", null,
8959
- React.createElement(FormIcon, null, "Close"),
8953
+ React.createElement(PdgIcon, null, "Close"),
8960
8954
  !hideRemoveLabel && (removeLabel || '삭제'))))))),
8961
8955
  }, placeholder: '\uD30C\uC77C\uC744 \uC120\uD0DD\uD558\uC138\uC694' }))),
8962
8956
  !!hideUrl && (React.createElement("div", { className: 'input-file-wrap' },
8963
8957
  !hideUpload && (React.createElement(React.Fragment, null,
8964
8958
  React.createElement(Button, { variant: 'outlined', tabIndex: uploadTabIndex, className: classNames('input-file-btn form-file-btn', !!hideUploadLabel && 'hidden-label'), color: error ? 'error' : color, ref: fileUploadBtnRef, disabled: disabled },
8965
8959
  React.createElement("label", { htmlFor: id },
8966
- React.createElement(FormIcon, null, "upload"),
8960
+ React.createElement(PdgIcon, null, "upload"),
8967
8961
  !hideUploadLabel && (uploadLabel || '파일 업로드'))),
8968
8962
  React.createElement("input", { type: 'file', accept: accept, id: id, value: fileValue, className: 'input-file', onChange: handleFileChange }))),
8969
8963
  !hideLink && (React.createElement(Button, { variant: 'outlined', tabIndex: linkTabIndex, className: classNames('link-btn form-file-btn', !!hideLinkLabel && 'hidden-label'), color: error ? 'error' : color, onClick: handleLinkClick, disabled: disabled, ref: linkBtnRef },
8970
8964
  React.createElement("label", null,
8971
- React.createElement(FormIcon, null, "link"),
8965
+ React.createElement(PdgIcon, null, "link"),
8972
8966
  !hideLinkLabel && (linkLabel || '링크')))),
8973
8967
  !hideRemove && notEmpty(value) && (React.createElement(Button, { variant: 'outlined', tabIndex: removeTabIndex, className: classNames('remove-btn form-file-btn', !!hideRemoveLabel && 'hidden-label'), color: error ? 'error' : color, disabled: disabled, onClick: handleRemoveClick },
8974
8968
  React.createElement("label", null,
8975
- React.createElement(FormIcon, null, "Close"),
8969
+ React.createElement(PdgIcon, null, "Close"),
8976
8970
  !hideRemoveLabel && (removeLabel || '삭제')))))),
8977
8971
  React.createElement(PrivateAlertDialog, __assign({}, alertDialogProps, { onClose: function () { return setAlertDialogProps({ open: false }); } })),
8978
8972
  React.createElement(LinkDialog, { open: isOpenLinkDialog, onConfirm: handleLinkDialogConfirm, onClose: function () { return setIsOpenLinkDialog(false); } })) }));
@@ -11233,4 +11227,4 @@ SearchButton.defaultProps = SearchButtonDefaultProps;var SearchMenuButtonDefault
11233
11227
  React.createElement(FormButton, __assign({ className: classNames(className, 'SearchMenuButton'), size: 'medium', sx: sx, fullWidth: false, startIcon: startIcon, icon: icon }, props, { id: buttonId, "aria-controls": open ? menuId : undefined, "aria-haspopup": 'true', "aria-expanded": open ? 'true' : undefined, endIcon: endIcon, onClick: handleClick }), children),
11234
11228
  React.createElement(Menu, { id: menuId, "aria-labelledby": buttonId, anchorEl: anchorEl, open: open, onClose: handleClose, onClick: handleClose, anchorOrigin: anchorOrigin, transformOrigin: transformOrigin }, menuList)));
11235
11229
  };
11236
- SearchMenuButton.defaultProps = SearchMenuButtonDefaultProps;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,FormMonthPicker,FormMonthPickerDefaultProps,FormMonthRangePicker,FormMonthRangePickerDefaultProps,FormNumber,FormNumberDefaultProps,FormPassword,FormPasswordDefaultProps,FormPersonalNo,FormPersonalNoDefaultProps,FormRadioGroup,FormRadioGroupDefaultProps,FormRating,FormRatingDefaultProps,FormRow,FormRowDefaultProps,FormSearch,FormSearchDefaultProps,FormSelect,FormSelectDefaultProps,FormSwitch,FormSwitchDefaultProps,FormTag,FormTagDefaultProps,FormTel,FormTelDefaultProps,FormText,FormTextDefaultProps,FormTextEditor,FormTextEditorDefaultProps,FormTextField,FormTextFieldDefaultProps,FormTextarea,FormTextareaDefaultProps,FormTimePicker,FormTimePickerDefaultProps,FormToggleButtonGroup,FormToggleButtonGroupDefaultProps,FormUrl,FormUrlDefaultProps,FormYearPicker,FormYearPickerDefaultProps,FormYearRangePicker,FormYearRangePickerDefaultProps,Search,SearchButton,SearchButtonDefaultProps,SearchDefaultProps,SearchGroup,SearchGroupDefaultProps,SearchGroupRow,SearchGroupRowDefaultProps,SearchMenuButton,SearchMenuButtonDefaultProps,useFormState};
11230
+ SearchMenuButton.defaultProps = SearchMenuButtonDefaultProps;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,FormImageFile,FormImageFileDefaultProps,FormLabel,FormLabelDefaultProps,FormMobile,FormMobileDefaultProps,FormMonthPicker,FormMonthPickerDefaultProps,FormMonthRangePicker,FormMonthRangePickerDefaultProps,FormNumber,FormNumberDefaultProps,FormPassword,FormPasswordDefaultProps,FormPersonalNo,FormPersonalNoDefaultProps,FormRadioGroup,FormRadioGroupDefaultProps,FormRating,FormRatingDefaultProps,FormRow,FormRowDefaultProps,FormSearch,FormSearchDefaultProps,FormSelect,FormSelectDefaultProps,FormSwitch,FormSwitchDefaultProps,FormTag,FormTagDefaultProps,FormTel,FormTelDefaultProps,FormText,FormTextDefaultProps,FormTextEditor,FormTextEditorDefaultProps,FormTextField,FormTextFieldDefaultProps,FormTextarea,FormTextareaDefaultProps,FormTimePicker,FormTimePickerDefaultProps,FormToggleButtonGroup,FormToggleButtonGroupDefaultProps,FormUrl,FormUrlDefaultProps,FormYearPicker,FormYearPickerDefaultProps,FormYearRangePicker,FormYearRangePickerDefaultProps,Search,SearchButton,SearchButtonDefaultProps,SearchDefaultProps,SearchGroup,SearchGroupDefaultProps,SearchGroupRow,SearchGroupRowDefaultProps,SearchMenuButton,SearchMenuButtonDefaultProps,useFormState};
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- 'use strict';var React=require('react'),classNames=require('classnames'),material=require('@mui/material'),util=require('@pdg/util'),dayjs=require('dayjs'),reactHook=require('@pdg/react-hook'),reactResizeDetector=require('react-resize-detector'),reactNumberFormat=require('react-number-format'),iconsMaterial=require('@mui/icons-material'),tinymceReact=require('@tinymce/tinymce-react'),CircularProgress=require('@mui/material/CircularProgress'),AdapterDayjs=require('@mui/x-date-pickers/AdapterDayjs'),xDatePickers=require('@mui/x-date-pickers'),reactComponent=require('@pdg/react-component'),SimpleBar=require('simplebar-react');require('dayjs/locale/ko');/******************************************************************************
1
+ 'use strict';var React=require('react'),classNames=require('classnames'),material=require('@mui/material'),util=require('@pdg/util'),dayjs=require('dayjs'),reactComponent=require('@pdg/react-component'),reactHook=require('@pdg/react-hook'),reactResizeDetector=require('react-resize-detector'),reactNumberFormat=require('react-number-format'),iconsMaterial=require('@mui/icons-material'),tinymceReact=require('@tinymce/tinymce-react'),CircularProgress=require('@mui/material/CircularProgress'),AdapterDayjs=require('@mui/x-date-pickers/AdapterDayjs'),xDatePickers=require('@mui/x-date-pickers'),SimpleBar=require('simplebar-react');require('dayjs/locale/ko');/******************************************************************************
2
2
  Copyright (c) Microsoft Corporation.
3
3
 
4
4
  Permission to use, copy, modify, and/or distribute this software for any
@@ -557,15 +557,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
557
557
  Form.displayName = 'Form';
558
558
  Form.defaultProps = FormDefaultProps;var FormButtonDefaultProps = {
559
559
  type: 'button',
560
- };var FormIconDefaultProps = {};var FormIcon = React.forwardRef(function (_a, ref) {
561
- var className = _a.className, InitChildren = _a.children, props = __rest(_a, ["className", "children"]);
562
- return React.useMemo(function () {
563
- var iconProps = __assign(__assign({}, props), { className: classNames('FormIcon', className) });
564
- return typeof InitChildren === 'string' ? (React.createElement(material.Icon, __assign({ ref: ref }, iconProps), InitChildren.replace(/[A-Z]/g, function (letter, idx) { return "".concat(idx > 0 ? '_' : '').concat(letter.toLowerCase()); }))) : (React.createElement(InitChildren, __assign({}, iconProps)));
565
- }, [InitChildren, className, props, ref]);
566
- });
567
- FormIcon.displayName = 'FormIcon';
568
- FormIcon.defaultProps = FormIconDefaultProps;var FormButton = React.forwardRef(function (_a, ref) {
560
+ };var FormButton = React.forwardRef(function (_a, ref) {
569
561
  /********************************************************************************************************************
570
562
  * FormState
571
563
  * ******************************************************************************************************************/
@@ -596,12 +588,14 @@ FormIcon.defaultProps = FormIconDefaultProps;var FormButton = React.forwardRef(f
596
588
  /********************************************************************************************************************
597
589
  * Render
598
590
  * ******************************************************************************************************************/
599
- return (React.createElement(material.Button, __assign({ ref: ref, className: classNames(className, 'FormButton'), type: type, variant: variant, size: size, color: color, fullWidth: fullWidth, onClick: onClick, startIcon: startIcon ? React.createElement(FormIcon, { sx: { mr: -0.5 } }, startIcon) : undefined, endIcon: endIcon ? React.createElement(FormIcon, { sx: { ml: -0.5 } }, endIcon) : undefined }, props),
600
- icon && (React.createElement(FormIcon, { fontSize: size, color: 'inherit', sx: { mr: children ? 0.5 : undefined } }, icon)),
601
- children));
591
+ return (React.createElement(material.Button, __assign({ ref: ref, className: classNames(className, 'FormButton'), type: type, variant: variant, size: size, color: color, fullWidth: fullWidth, onClick: onClick }, props),
592
+ React.createElement(material.Box, { display: 'inline-flex', flexDirection: 'row', alignItems: 'center' },
593
+ (icon || startIcon) && (React.createElement(reactComponent.PdgIcon, { fontSize: size, color: 'inherit', sx: { mr: children ? 0.5 : undefined } }, icon || startIcon)),
594
+ children,
595
+ endIcon && (React.createElement(reactComponent.PdgIcon, { fontSize: size, color: 'inherit', sx: { ml: children ? 0.5 : undefined } }, endIcon)))));
602
596
  });
603
597
  FormButton.displayName = 'FormButton';
604
- FormButton.defaultProps = FormButtonDefaultProps;var FormLabelDefaultProps = {};var IconFormIcon = material.styled(FormIcon)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n vertical-align: middle;\n margin-right: 3px;\n margin-top: -4px;\n margin-bottom: -2px;\n"], ["\n vertical-align: middle;\n margin-right: 3px;\n margin-top: -4px;\n margin-bottom: -2px;\n"])));
598
+ FormButton.defaultProps = FormButtonDefaultProps;var FormLabelDefaultProps = {};var IconPdgIcon = material.styled(reactComponent.PdgIcon)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n vertical-align: middle;\n margin-right: 3px;\n margin-top: -4px;\n margin-bottom: -2px;\n"], ["\n vertical-align: middle;\n margin-right: 3px;\n margin-top: -4px;\n margin-bottom: -2px;\n"])));
605
599
  var ChildrenSpan = material.styled('span')(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n vertical-align: middle;\n"], ["\n vertical-align: middle;\n"])));
606
600
  var templateObject_1$g, templateObject_2$8;var FormLabel = React.forwardRef(function (_a, ref) {
607
601
  /********************************************************************************************************************
@@ -623,7 +617,7 @@ var templateObject_1$g, templateObject_2$8;var FormLabel = React.forwardRef(func
623
617
  * Render
624
618
  * ******************************************************************************************************************/
625
619
  return (React.createElement(material.InputLabel, __assign({ ref: ref }, finalProps), icon ? (React.createElement(React.Fragment, null,
626
- React.createElement(IconFormIcon, null, icon),
620
+ React.createElement(IconPdgIcon, null, icon),
627
621
  React.createElement(ChildrenSpan, null, children))) : (children)));
628
622
  });
629
623
  FormLabel.displayName = 'FormLabel';
@@ -706,7 +700,7 @@ var FormDivider = React.forwardRef(function (_a, ref) {
706
700
  padding: 0,
707
701
  cursor: collapse ? 'pointer' : undefined,
708
702
  }, onClick: handleClick },
709
- icon && (React.createElement(FormIcon, { style: { opacity: 0.54, marginRight: 5 }, color: error ? 'error' : warning ? 'warning' : undefined, fontSize: size }, icon)),
703
+ icon && (React.createElement(reactComponent.PdgIcon, { style: { opacity: 0.54, marginRight: 5 }, color: error ? 'error' : warning ? 'warning' : undefined, fontSize: size }, icon)),
710
704
  label && (React.createElement(material.Box, { sx: {
711
705
  paddingRight: '10px',
712
706
  color: error ? 'error.main' : warning ? 'warning.main' : 'text.secondary',
@@ -714,7 +708,7 @@ var FormDivider = React.forwardRef(function (_a, ref) {
714
708
  fontSize: size === 'small' ? '11.5px' : '12px',
715
709
  } }, label)),
716
710
  (line || collapse) && (React.createElement("div", { style: lineStyle }, error ? React.createElement(StyledErrorLineBox, null) : warning ? React.createElement(StyledWarningLineBox, null) : React.createElement(StyledLineBox, null))),
717
- collapse && (React.createElement(FormIcon, { sx: { opacity: 0.6, ml: 1 }, color: error ? 'error' : warning ? 'warning' : undefined }, collapseIn ? 'KeyboardDoubleArrowUp' : 'KeyboardDoubleArrowDown')))));
711
+ collapse && (React.createElement(reactComponent.PdgIcon, { sx: { opacity: 0.6, ml: 1 }, color: error ? 'error' : warning ? 'warning' : undefined }, collapseIn ? 'KeyboardDoubleArrowUp' : 'KeyboardDoubleArrowDown')))));
718
712
  });
719
713
  FormDivider.displayName = 'FormDivider.';
720
714
  FormDivider.defaultProps = FormDividerDefaultProps;var StyledWrapGrid$1 = material.styled(material.Grid)(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
@@ -1122,7 +1116,7 @@ styleInject(css_248z$l);var FormTextField = React.forwardRef(function (_a, ref)
1122
1116
  * ******************************************************************************************************************/
1123
1117
  var label = React.useMemo(function () {
1124
1118
  return labelIcon ? (React.createElement(React.Fragment, null,
1125
- React.createElement(FormIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
1119
+ React.createElement(reactComponent.PdgIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
1126
1120
  React.createElement("span", { style: { verticalAlign: 'middle' } }, initLabel))) : (initLabel);
1127
1121
  }, [initLabel, labelIcon]);
1128
1122
  /********************************************************************************************************************
@@ -1205,7 +1199,7 @@ styleInject(css_248z$l);var FormTextField = React.forwardRef(function (_a, ref)
1205
1199
  if (startAdornment || icon || muiInputProps.startAdornment) {
1206
1200
  muiInputProps.startAdornment = (React.createElement(React.Fragment, null,
1207
1201
  icon && (React.createElement(material.InputAdornment, { position: 'start' },
1208
- React.createElement(FormIcon, { fontSize: 'small' }, icon))),
1202
+ React.createElement(reactComponent.PdgIcon, { fontSize: 'small' }, icon))),
1209
1203
  startAdornment && React.createElement(material.InputAdornment, { position: 'start' }, startAdornment),
1210
1204
  muiInputProps.startAdornment));
1211
1205
  }
@@ -1223,7 +1217,7 @@ styleInject(css_248z$l);var FormTextField = React.forwardRef(function (_a, ref)
1223
1217
  });
1224
1218
  }
1225
1219
  } },
1226
- React.createElement(FormIcon, { fontSize: 'inherit' }, "ClearRounded")))),
1220
+ React.createElement(reactComponent.PdgIcon, { fontSize: 'inherit' }, "ClearRounded")))),
1227
1221
  muiInputProps.endAdornment,
1228
1222
  endAdornment && React.createElement(material.InputAdornment, { position: 'end' }, endAdornment)));
1229
1223
  }
@@ -1676,7 +1670,7 @@ var templateObject_1$b;var FormTelDefaultProps = __assign(__assign({}, FormTextD
1676
1670
  * ******************************************************************************************************************/
1677
1671
  var className = _a.className, onValue = _a.onValue, props = __rest(_a, ["className", "onValue"]);
1678
1672
  var handleValue = React.useCallback(function (value) {
1679
- var newValue = util.telAutoDash(value.replace(/[^0-9]/gi, ''));
1673
+ var newValue = util.telNoAutoDash(value.replace(/[^0-9]/gi, ''));
1680
1674
  return onValue ? onValue(newValue) : newValue;
1681
1675
  }, [onValue]);
1682
1676
  /********************************************************************************************************************
@@ -2568,7 +2562,7 @@ styleInject(css_248z$e);var FormItemBase = React.forwardRef(function (_a, ref) {
2568
2562
  return (React.createElement("div", { style: wrapStyle },
2569
2563
  React.createElement(material.FormControl, { ref: ref, variant: 'standard', className: classNames(className, 'FormItemBase', !!label && 'with-label', "variant-".concat(variant), controlVerticalCenter && 'control-vertical-center', !!error && 'error'), style: style, color: color, error: error, focused: focused, sx: sx },
2570
2564
  !formColWithLabel && label && (React.createElement(material.InputLabel, { shrink: true, className: 'FormItemBase-InputLabel', size: size === 'medium' ? 'normal' : size, required: required }, labelIcon ? (React.createElement(React.Fragment, null,
2571
- React.createElement(FormIcon, { style: { verticalAlign: 'middle', marginRight: 3, marginTop: -4, marginBottom: -2 } }, labelIcon),
2565
+ React.createElement(reactComponent.PdgIcon, { style: { verticalAlign: 'middle', marginRight: 3, marginTop: -4, marginBottom: -2 } }, labelIcon),
2572
2566
  React.createElement("span", { style: { verticalAlign: 'middle' } }, label))) : (label))),
2573
2567
  React.createElement("div", { className: 'FormItemBase-Control-wrap', style: { display: 'grid', marginTop: hideLabel ? 0 : undefined } }, autoSize ? (React.createElement(React.Fragment, null,
2574
2568
  variant === 'standard' && (React.createElement(material.Input, { ref: inputRef, size: size, fullWidth: true, disabled: true, style: { visibility: 'hidden' } })),
@@ -3867,7 +3861,7 @@ FormToggleButtonGroup.defaultProps = FormToggleButtonGroupDefaultProps;var FormR
3867
3861
  /********************************************************************************************************************
3868
3862
  * Render
3869
3863
  * ******************************************************************************************************************/
3870
- return (React.createElement(FormItemBase, { variant: variant, size: size, color: color, focused: focused, className: classNames(className, 'FormValueItem', 'FormRating'), labelIcon: labelIcon, label: label, error: error, fullWidth: false, required: required, helperText: error ? errorHelperText : helperText, helperTextProps: { style: { marginLeft: 5 } }, style: style, sx: sx, hidden: hidden, autoSize: true, controlHeight: height || (size === 'small' ? 21 : 26), controlVerticalCenter: true, control: React.createElement(material.Rating, { ref: ratingRef, size: size === 'medium' ? 'large' : 'medium', name: name, precision: precision, highlightSelectedOnly: highlightSelectedOnly, value: value, disabled: disabled || readOnly, max: max, icon: React.createElement(FormIcon, { color: color, fontSize: 'inherit' }, icon ? icon : 'Star'), emptyIcon: React.createElement(FormIcon, { fontSize: 'inherit' }, emptyIcon ? emptyIcon : 'StarBorder'), onChange: handleChange, onFocus: function () { return setFocused(initFocused || true); }, onBlur: function () { return setFocused(initFocused || false); } }) }));
3864
+ return (React.createElement(FormItemBase, { variant: variant, size: size, color: color, focused: focused, className: classNames(className, 'FormValueItem', 'FormRating'), labelIcon: labelIcon, label: label, error: error, fullWidth: false, required: required, helperText: error ? errorHelperText : helperText, helperTextProps: { style: { marginLeft: 5 } }, style: style, sx: sx, hidden: hidden, autoSize: true, controlHeight: height || (size === 'small' ? 21 : 26), controlVerticalCenter: true, control: React.createElement(material.Rating, { ref: ratingRef, size: size === 'medium' ? 'large' : 'medium', name: name, precision: precision, highlightSelectedOnly: highlightSelectedOnly, value: value, disabled: disabled || readOnly, max: max, icon: React.createElement(reactComponent.PdgIcon, { color: color, fontSize: 'inherit' }, icon ? icon : 'Star'), emptyIcon: React.createElement(reactComponent.PdgIcon, { fontSize: 'inherit' }, emptyIcon ? emptyIcon : 'StarBorder'), onChange: handleChange, onFocus: function () { return setFocused(initFocused || true); }, onBlur: function () { return setFocused(initFocused || false); } }) }));
3871
3865
  });
3872
3866
  FormRating.displayName = 'FormRating';
3873
3867
  FormRating.defaultProps = FormRatingDefaultProps;var FormTextEditorDefaultProps = {
@@ -5539,7 +5533,7 @@ styleInject(css_248z$7);var PrivateDatePicker = React.forwardRef(function (_a, r
5539
5533
  if (startAdornment || icon || muiInputProps.startAdornment) {
5540
5534
  muiInputProps.startAdornment = (React.createElement(React.Fragment, null,
5541
5535
  icon && (React.createElement(material.InputAdornment, { position: 'start' },
5542
- React.createElement(FormIcon, { fontSize: 'small' }, icon))),
5536
+ React.createElement(reactComponent.PdgIcon, { fontSize: 'small' }, icon))),
5543
5537
  startAdornment && React.createElement(material.InputAdornment, { position: 'start' }, startAdornment),
5544
5538
  muiInputProps.startAdornment));
5545
5539
  }
@@ -6324,7 +6318,7 @@ PrivateStaticDateTimePicker.defaultProps = PrivateStaticDateTimePickerDefaultPro
6324
6318
  if (startAdornment || icon || muiInputProps.startAdornment) {
6325
6319
  muiInputProps.startAdornment = (React.createElement(React.Fragment, null,
6326
6320
  icon && (React.createElement(material.InputAdornment, { position: 'start' },
6327
- React.createElement(FormIcon, { fontSize: 'small' }, icon))),
6321
+ React.createElement(reactComponent.PdgIcon, { fontSize: 'small' }, icon))),
6328
6322
  startAdornment && React.createElement(material.InputAdornment, { position: 'start' }, startAdornment),
6329
6323
  muiInputProps.startAdornment));
6330
6324
  }
@@ -6427,7 +6421,7 @@ styleInject(css_248z$4);var PrivateInputDatePicker = React.forwardRef(function (
6427
6421
  * ******************************************************************************************************************/
6428
6422
  var label = React.useMemo(function () {
6429
6423
  return labelIcon ? (React.createElement(React.Fragment, null,
6430
- React.createElement(FormIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
6424
+ React.createElement(reactComponent.PdgIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
6431
6425
  React.createElement("span", { style: { verticalAlign: 'middle' } }, initLabel))) : (initLabel);
6432
6426
  }, [initLabel, labelIcon]);
6433
6427
  var inputLabelProps = React.useMemo(function () {
@@ -6444,7 +6438,7 @@ styleInject(css_248z$4);var PrivateInputDatePicker = React.forwardRef(function (
6444
6438
  if (startAdornment || icon || muiInputProps.startAdornment) {
6445
6439
  muiInputProps.startAdornment = (React.createElement(React.Fragment, null,
6446
6440
  icon && (React.createElement(material.InputAdornment, { position: 'start' },
6447
- React.createElement(FormIcon, { fontSize: 'small' }, icon))),
6441
+ React.createElement(reactComponent.PdgIcon, { fontSize: 'small' }, icon))),
6448
6442
  startAdornment && React.createElement(material.InputAdornment, { position: 'start' }, startAdornment),
6449
6443
  muiInputProps.startAdornment));
6450
6444
  }
@@ -7060,14 +7054,14 @@ var templateObject_1$5, templateObject_2$3, templateObject_3$2, templateObject_4
7060
7054
  return (React.createElement("div", { className: 'PrivateYearPicker' },
7061
7055
  !hideHeader && (React.createElement(StyledTitleContainer, null,
7062
7056
  React.createElement(StyledIconButton$1, { disabled: prevBtnDisabled, onClick: handlePrevClick },
7063
- React.createElement(FormIcon, null, "KeyboardArrowLeft")),
7057
+ React.createElement(reactComponent.PdgIcon, null, "KeyboardArrowLeft")),
7064
7058
  displayError ? (React.createElement(StyledYearMonthError$1, null,
7065
7059
  displayYear,
7066
7060
  "\uB144")) : (React.createElement(StyledYearMonth$1, null,
7067
7061
  displayYear,
7068
7062
  "\uB144")),
7069
7063
  React.createElement(StyledIconButton$1, { disabled: nextBtnDisabled, onClick: handleNextClick },
7070
- React.createElement(FormIcon, null, "KeyboardArrowRight")))),
7064
+ React.createElement(reactComponent.PdgIcon, null, "KeyboardArrowRight")))),
7071
7065
  React.createElement("div", null,
7072
7066
  React.createElement(PrivateYearPickerYearList, { value: value, minYear: minYear, maxYear: maxYear, disablePast: disablePast, disableFuture: disableFuture, selectFromYear: selectFromYear, selectToYear: selectToYear, onChange: handleYearChange }))));
7073
7067
  };
@@ -7290,7 +7284,7 @@ var templateObject_1$2, templateObject_2$1, templateObject_3$1, templateObject_4
7290
7284
  return (React.createElement(StyledContainer, { className: 'PrivateMonthPicker' },
7291
7285
  React.createElement(TitleContainer, null,
7292
7286
  React.createElement(StyledIconButton, { disabled: prevBtnDisabled, onClick: handlePrevClick },
7293
- React.createElement(FormIcon, null, "KeyboardArrowLeft")),
7287
+ React.createElement(reactComponent.PdgIcon, null, "KeyboardArrowLeft")),
7294
7288
  displayValueError ? (React.createElement(StyledYearMonthError, null,
7295
7289
  displayValue.year,
7296
7290
  "\uB144 ",
@@ -7301,7 +7295,7 @@ var templateObject_1$2, templateObject_2$1, templateObject_3$1, templateObject_4
7301
7295
  displayValue.month,
7302
7296
  "\uC6D4")),
7303
7297
  React.createElement(StyledIconButton, { disabled: nextBtnDisabled, onClick: handleNextClick },
7304
- React.createElement(FormIcon, null, "KeyboardArrowRight"))),
7298
+ React.createElement(reactComponent.PdgIcon, null, "KeyboardArrowRight"))),
7305
7299
  React.createElement("div", null,
7306
7300
  React.createElement(PrivateYearPicker, { value: (value === null || value === void 0 ? void 0 : value.year) || null, minYear: minValue.year, maxYear: maxValue.year, disablePast: disablePast, disableFuture: disableFuture, onChange: handleYearChange, hideHeader: true, selectFromYear: selectFromYear, selectToYear: selectToYear })),
7307
7301
  React.createElement("div", { style: { borderTop: '1px solid #efefef' } },
@@ -8651,7 +8645,7 @@ FormDateRangePicker.defaultProps = FormDateRangePickerDefaultProps;var FormFileD
8651
8645
  React.createElement(material.Button, { variant: 'text', onClick: handleSubmit }, "\uD655\uC778"))));
8652
8646
  };
8653
8647
  LinkDialog.displayName = 'LinkDialog';
8654
- LinkDialog.defaultProps = LinkDialogDefaultProps;var css_248z$1 = ".FormFile .control-wrap {\n display: inline-flex;\n}\n.FormFile .control-wrap .file-name-wrap .file-name {\n min-width: 350px;\n}\n.FormFile .control-wrap .file-name-wrap .file-name .MuiInputBase-root {\n padding-right: 7px;\n}\n.FormFile .control-wrap .input-file {\n display: none;\n}\n.FormFile .control-wrap .form-file-btn {\n min-width: 0;\n padding: 0;\n}\n.FormFile .control-wrap .form-file-btn label {\n cursor: pointer;\n display: flex;\n width: 100%;\n height: 100%;\n justify-content: center;\n align-items: center;\n padding: 0 10px;\n}\n.FormFile .control-wrap .form-file-btn label .FormIcon {\n margin-right: 5px;\n}\n.FormFile .control-wrap .form-file-btn.hidden-label label .FormIcon {\n margin-left: 0;\n margin-right: 0;\n}\n.FormFile .control-wrap .input-file-wrap {\n display: flex;\n}\n.FormFile .control-wrap .input-file-wrap .input-file-btn .FormIcon {\n margin-left: -3px;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:first-of-type:not(:last-of-type) {\n border-right: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:last-of-type:not(:first-of-type) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:not(:first-of-type):not(:last-of-type) {\n border-right: 0;\n border-radius: 0;\n}\n.FormFile.full-width .control-wrap {\n display: flex;\n}\n.FormFile.full-width .control-wrap .file-name-wrap {\n flex: 1;\n}\n.FormFile.variant-standard .file-name-wrap .file-name .MuiInputBase-root {\n padding-right: 0;\n}\n\n.FormFile:not(.hide-file-name).variant-outlined .form-file-btn label, .FormFile:not(.hide-file-name).variant-filled .form-file-btn label {\n padding-top: 10px;\n padding-bottom: 10px;\n}\n.FormFile:not(.hide-file-name).variant-standard .form-file-btn label {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n.FormFile:not(.hide-file-name).size-small .form-file-btn label {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n\n.FormFile.hide-file-name:not(.with-label).variant-outlined .form-file-btn {\n height: 52px;\n}\n.FormFile.hide-file-name:not(.with-label).variant-filled .form-file-btn {\n height: 52px;\n}\n.FormFile.hide-file-name:not(.with-label).variant-standard .form-file-btn {\n height: 28px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-outlined .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-filled .form-file-btn {\n height: 44px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-standard .form-file-btn {\n height: 26px;\n}\n.FormFile.hide-file-name.with-label.variant-outlined .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name.with-label.variant-filled .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name.with-label.variant-standard .form-file-btn {\n height: 28px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-outlined .form-file-btn {\n height: 24px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-filled .form-file-btn {\n height: 31px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-standard .form-file-btn {\n height: 26px;\n}\n\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-outlined .form-file-btn {\n height: 37px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-filled .form-file-btn {\n height: 37px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-standard .form-file-btn {\n height: 28px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-outlined .form-file-btn {\n height: 24px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-filled .form-file-btn {\n height: 31px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-standard .form-file-btn {\n height: 26px;\n}";
8648
+ LinkDialog.defaultProps = LinkDialogDefaultProps;var css_248z$1 = ".FormFile .control-wrap {\n display: inline-flex;\n}\n.FormFile .control-wrap .file-name-wrap .file-name {\n min-width: 350px;\n}\n.FormFile .control-wrap .file-name-wrap .file-name .MuiInputBase-root {\n padding-right: 7px;\n}\n.FormFile .control-wrap .input-file {\n display: none;\n}\n.FormFile .control-wrap .form-file-btn {\n min-width: 0;\n padding: 0;\n}\n.FormFile .control-wrap .form-file-btn label {\n cursor: pointer;\n display: flex;\n width: 100%;\n height: 100%;\n justify-content: center;\n align-items: center;\n padding: 0 10px;\n}\n.FormFile .control-wrap .form-file-btn label .PdgIcon {\n margin-right: 5px;\n}\n.FormFile .control-wrap .form-file-btn.hidden-label label .PdgIcon {\n margin-left: 0;\n margin-right: 0;\n}\n.FormFile .control-wrap .input-file-wrap {\n display: flex;\n}\n.FormFile .control-wrap .input-file-wrap .input-file-btn .PdgIcon {\n margin-left: -3px;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:first-of-type:not(:last-of-type) {\n border-right: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:last-of-type:not(:first-of-type) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n.FormFile .control-wrap .input-file-wrap .form-file-btn:not(:first-of-type):not(:last-of-type) {\n border-right: 0;\n border-radius: 0;\n}\n.FormFile.full-width .control-wrap {\n display: flex;\n}\n.FormFile.full-width .control-wrap .file-name-wrap {\n flex: 1;\n}\n.FormFile.variant-standard .file-name-wrap .file-name .MuiInputBase-root {\n padding-right: 0;\n}\n\n.FormFile:not(.hide-file-name).variant-outlined .form-file-btn label, .FormFile:not(.hide-file-name).variant-filled .form-file-btn label {\n padding-top: 10px;\n padding-bottom: 10px;\n}\n.FormFile:not(.hide-file-name).variant-standard .form-file-btn label {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n.FormFile:not(.hide-file-name).size-small .form-file-btn label {\n padding-top: 5px;\n padding-bottom: 5px;\n}\n\n.FormFile.hide-file-name:not(.with-label).variant-outlined .form-file-btn {\n height: 52px;\n}\n.FormFile.hide-file-name:not(.with-label).variant-filled .form-file-btn {\n height: 52px;\n}\n.FormFile.hide-file-name:not(.with-label).variant-standard .form-file-btn {\n height: 28px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-outlined .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-filled .form-file-btn {\n height: 44px;\n}\n.FormFile.hide-file-name:not(.with-label).size-small.variant-standard .form-file-btn {\n height: 26px;\n}\n.FormFile.hide-file-name.with-label.variant-outlined .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name.with-label.variant-filled .form-file-btn {\n height: 37px;\n}\n.FormFile.hide-file-name.with-label.variant-standard .form-file-btn {\n height: 28px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-outlined .form-file-btn {\n height: 24px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-filled .form-file-btn {\n height: 31px;\n}\n.FormFile.hide-file-name.with-label.size-small.variant-standard .form-file-btn {\n height: 26px;\n}\n\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-outlined .form-file-btn {\n height: 37px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-filled .form-file-btn {\n height: 37px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.variant-standard .form-file-btn {\n height: 28px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-outlined .form-file-btn {\n height: 24px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-filled .form-file-btn {\n height: 31px;\n}\n.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-standard .form-file-btn {\n height: 26px;\n}";
8655
8649
  styleInject(css_248z$1);var FormFile = React.forwardRef(function (_a, ref) {
8656
8650
  /********************************************************************************************************************
8657
8651
  * ID
@@ -8710,7 +8704,7 @@ styleInject(css_248z$1);var FormFile = React.forwardRef(function (_a, ref) {
8710
8704
  * ******************************************************************************************************************/
8711
8705
  var label = React.useMemo(function () {
8712
8706
  return labelIcon ? (React.createElement(React.Fragment, null,
8713
- React.createElement(FormIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
8707
+ React.createElement(reactComponent.PdgIcon, { style: { verticalAlign: 'middle', marginRight: 4 } }, labelIcon),
8714
8708
  React.createElement("span", { style: { verticalAlign: 'middle' } }, initLabel))) : (initLabel);
8715
8709
  }, [initLabel, labelIcon]);
8716
8710
  /********************************************************************************************************************
@@ -8947,32 +8941,32 @@ styleInject(css_248z$1);var FormFile = React.forwardRef(function (_a, ref) {
8947
8941
  !hideUpload && (React.createElement(React.Fragment, null,
8948
8942
  React.createElement(material.Button, { variant: 'text', tabIndex: uploadTabIndex == null ? -1 : uploadTabIndex, className: classNames('input-file-btn form-file-btn', !!hideUploadLabel && 'hidden-label'), color: error ? 'error' : color, disabled: readOnly || disabled, ref: fileUploadBtnRef },
8949
8943
  React.createElement("label", { htmlFor: id },
8950
- React.createElement(FormIcon, null, "upload"),
8944
+ React.createElement(reactComponent.PdgIcon, null, "upload"),
8951
8945
  !hideUploadLabel && (uploadLabel || '파일 업로드'))),
8952
8946
  React.createElement("input", { type: 'file', accept: accept, id: id, value: fileValue, className: 'input-file', onChange: handleFileChange }))),
8953
8947
  !hideLink && (React.createElement(material.Button, { variant: 'text', tabIndex: linkTabIndex == null ? -1 : linkTabIndex, className: classNames('link-btn form-file-btn', !!hideLinkLabel && 'hidden-label'), color: error ? 'error' : color, disabled: readOnly || disabled, ref: linkBtnRef, onClick: handleLinkClick },
8954
8948
  React.createElement("label", null,
8955
- React.createElement(FormIcon, null, "link"),
8949
+ React.createElement(reactComponent.PdgIcon, null, "link"),
8956
8950
  !hideLinkLabel && (linkLabel || '링크')))),
8957
8951
  !hideRemove && util.notEmpty(value) && (React.createElement(material.Button, { variant: 'text', tabIndex: removeTabIndex == null ? -1 : removeTabIndex, className: classNames('remove-btn form-file-btn', !!hideRemoveLabel && 'hidden-label'), color: error ? 'error' : color, disabled: readOnly || disabled, onClick: handleRemoveClick },
8958
8952
  React.createElement("label", null,
8959
- React.createElement(FormIcon, null, "Close"),
8953
+ React.createElement(reactComponent.PdgIcon, null, "Close"),
8960
8954
  !hideRemoveLabel && (removeLabel || '삭제'))))))),
8961
8955
  }, placeholder: '\uD30C\uC77C\uC744 \uC120\uD0DD\uD558\uC138\uC694' }))),
8962
8956
  !!hideUrl && (React.createElement("div", { className: 'input-file-wrap' },
8963
8957
  !hideUpload && (React.createElement(React.Fragment, null,
8964
8958
  React.createElement(material.Button, { variant: 'outlined', tabIndex: uploadTabIndex, className: classNames('input-file-btn form-file-btn', !!hideUploadLabel && 'hidden-label'), color: error ? 'error' : color, ref: fileUploadBtnRef, disabled: disabled },
8965
8959
  React.createElement("label", { htmlFor: id },
8966
- React.createElement(FormIcon, null, "upload"),
8960
+ React.createElement(reactComponent.PdgIcon, null, "upload"),
8967
8961
  !hideUploadLabel && (uploadLabel || '파일 업로드'))),
8968
8962
  React.createElement("input", { type: 'file', accept: accept, id: id, value: fileValue, className: 'input-file', onChange: handleFileChange }))),
8969
8963
  !hideLink && (React.createElement(material.Button, { variant: 'outlined', tabIndex: linkTabIndex, className: classNames('link-btn form-file-btn', !!hideLinkLabel && 'hidden-label'), color: error ? 'error' : color, onClick: handleLinkClick, disabled: disabled, ref: linkBtnRef },
8970
8964
  React.createElement("label", null,
8971
- React.createElement(FormIcon, null, "link"),
8965
+ React.createElement(reactComponent.PdgIcon, null, "link"),
8972
8966
  !hideLinkLabel && (linkLabel || '링크')))),
8973
8967
  !hideRemove && util.notEmpty(value) && (React.createElement(material.Button, { variant: 'outlined', tabIndex: removeTabIndex, className: classNames('remove-btn form-file-btn', !!hideRemoveLabel && 'hidden-label'), color: error ? 'error' : color, disabled: disabled, onClick: handleRemoveClick },
8974
8968
  React.createElement("label", null,
8975
- React.createElement(FormIcon, null, "Close"),
8969
+ React.createElement(reactComponent.PdgIcon, null, "Close"),
8976
8970
  !hideRemoveLabel && (removeLabel || '삭제')))))),
8977
8971
  React.createElement(PrivateAlertDialog, __assign({}, alertDialogProps, { onClose: function () { return setAlertDialogProps({ open: false }); } })),
8978
8972
  React.createElement(LinkDialog, { open: isOpenLinkDialog, onConfirm: handleLinkDialogConfirm, onClose: function () { return setIsOpenLinkDialog(false); } })) }));
@@ -11233,4 +11227,4 @@ SearchButton.defaultProps = SearchButtonDefaultProps;var SearchMenuButtonDefault
11233
11227
  React.createElement(FormButton, __assign({ className: classNames(className, 'SearchMenuButton'), size: 'medium', sx: sx, fullWidth: false, startIcon: startIcon, icon: icon }, props, { id: buttonId, "aria-controls": open ? menuId : undefined, "aria-haspopup": 'true', "aria-expanded": open ? 'true' : undefined, endIcon: endIcon, onClick: handleClick }), children),
11234
11228
  React.createElement(material.Menu, { id: menuId, "aria-labelledby": buttonId, anchorEl: anchorEl, open: open, onClose: handleClose, onClick: handleClose, anchorOrigin: anchorOrigin, transformOrigin: transformOrigin }, menuList)));
11235
11229
  };
11236
- SearchMenuButton.defaultProps = SearchMenuButtonDefaultProps;exports.Form=Form;exports.FormAutocomplete=FormAutocomplete;exports.FormAutocompleteDefaultProps=FormAutocompleteDefaultProps;exports.FormBlock=FormBlock;exports.FormBlockDefaultProps=FormBlockDefaultProps;exports.FormBody=FormBody;exports.FormBodyDefaultProps=FormBodyDefaultProps;exports.FormButton=FormButton;exports.FormButtonDefaultProps=FormButtonDefaultProps;exports.FormCheckbox=FormCheckbox;exports.FormCheckboxDefaultProps=FormCheckboxDefaultProps;exports.FormCol=FormCol;exports.FormColDefaultProps=FormColDefaultProps;exports.FormCompanyNo=FormCompanyNo;exports.FormCompanyNoDefaultProps=FormCompanyNoDefaultProps;exports.FormContext=FormContext;exports.FormContextDefaultValue=FormContextDefaultValue;exports.FormContextProvider=FormContextProvider;exports.FormDatePicker=FormDatePicker;exports.FormDatePickerDefaultProps=FormDatePickerDefaultProps;exports.FormDateRangePicker=FormDateRangePicker;exports.FormDateRangePickerDefaultProps=FormDateRangePickerDefaultProps;exports.FormDateTimePicker=FormDateTimePicker;exports.FormDateTimePickerDefaultProps=FormDateTimePickerDefaultProps;exports.FormDefaultProps=FormDefaultProps;exports.FormDivider=FormDivider;exports.FormDividerDefaultProps=FormDividerDefaultProps;exports.FormEmail=FormEmail;exports.FormEmailDefaultProps=FormEmailDefaultProps;exports.FormFile=FormFile;exports.FormFileDefaultProps=FormFileDefaultProps;exports.FormFooter=FormFooter;exports.FormFooterDefaultProps=FormFooterDefaultProps;exports.FormHidden=FormHidden;exports.FormHiddenDefaultProps=FormHiddenDefaultProps;exports.FormIcon=FormIcon;exports.FormIconDefaultProps=FormIconDefaultProps;exports.FormImageFile=FormImageFile;exports.FormImageFileDefaultProps=FormImageFileDefaultProps;exports.FormLabel=FormLabel;exports.FormLabelDefaultProps=FormLabelDefaultProps;exports.FormMobile=FormMobile;exports.FormMobileDefaultProps=FormMobileDefaultProps;exports.FormMonthPicker=FormMonthPicker;exports.FormMonthPickerDefaultProps=FormMonthPickerDefaultProps;exports.FormMonthRangePicker=FormMonthRangePicker;exports.FormMonthRangePickerDefaultProps=FormMonthRangePickerDefaultProps;exports.FormNumber=FormNumber;exports.FormNumberDefaultProps=FormNumberDefaultProps;exports.FormPassword=FormPassword;exports.FormPasswordDefaultProps=FormPasswordDefaultProps;exports.FormPersonalNo=FormPersonalNo;exports.FormPersonalNoDefaultProps=FormPersonalNoDefaultProps;exports.FormRadioGroup=FormRadioGroup;exports.FormRadioGroupDefaultProps=FormRadioGroupDefaultProps;exports.FormRating=FormRating;exports.FormRatingDefaultProps=FormRatingDefaultProps;exports.FormRow=FormRow;exports.FormRowDefaultProps=FormRowDefaultProps;exports.FormSearch=FormSearch;exports.FormSearchDefaultProps=FormSearchDefaultProps;exports.FormSelect=FormSelect;exports.FormSelectDefaultProps=FormSelectDefaultProps;exports.FormSwitch=FormSwitch;exports.FormSwitchDefaultProps=FormSwitchDefaultProps;exports.FormTag=FormTag;exports.FormTagDefaultProps=FormTagDefaultProps;exports.FormTel=FormTel;exports.FormTelDefaultProps=FormTelDefaultProps;exports.FormText=FormText;exports.FormTextDefaultProps=FormTextDefaultProps;exports.FormTextEditor=FormTextEditor;exports.FormTextEditorDefaultProps=FormTextEditorDefaultProps;exports.FormTextField=FormTextField;exports.FormTextFieldDefaultProps=FormTextFieldDefaultProps;exports.FormTextarea=FormTextarea;exports.FormTextareaDefaultProps=FormTextareaDefaultProps;exports.FormTimePicker=FormTimePicker;exports.FormTimePickerDefaultProps=FormTimePickerDefaultProps;exports.FormToggleButtonGroup=FormToggleButtonGroup;exports.FormToggleButtonGroupDefaultProps=FormToggleButtonGroupDefaultProps;exports.FormUrl=FormUrl;exports.FormUrlDefaultProps=FormUrlDefaultProps;exports.FormYearPicker=FormYearPicker;exports.FormYearPickerDefaultProps=FormYearPickerDefaultProps;exports.FormYearRangePicker=FormYearRangePicker;exports.FormYearRangePickerDefaultProps=FormYearRangePickerDefaultProps;exports.Search=Search;exports.SearchButton=SearchButton;exports.SearchButtonDefaultProps=SearchButtonDefaultProps;exports.SearchDefaultProps=SearchDefaultProps;exports.SearchGroup=SearchGroup;exports.SearchGroupDefaultProps=SearchGroupDefaultProps;exports.SearchGroupRow=SearchGroupRow;exports.SearchGroupRowDefaultProps=SearchGroupRowDefaultProps;exports.SearchMenuButton=SearchMenuButton;exports.SearchMenuButtonDefaultProps=SearchMenuButtonDefaultProps;exports.useFormState=useFormState;
11230
+ SearchMenuButton.defaultProps = SearchMenuButtonDefaultProps;exports.Form=Form;exports.FormAutocomplete=FormAutocomplete;exports.FormAutocompleteDefaultProps=FormAutocompleteDefaultProps;exports.FormBlock=FormBlock;exports.FormBlockDefaultProps=FormBlockDefaultProps;exports.FormBody=FormBody;exports.FormBodyDefaultProps=FormBodyDefaultProps;exports.FormButton=FormButton;exports.FormButtonDefaultProps=FormButtonDefaultProps;exports.FormCheckbox=FormCheckbox;exports.FormCheckboxDefaultProps=FormCheckboxDefaultProps;exports.FormCol=FormCol;exports.FormColDefaultProps=FormColDefaultProps;exports.FormCompanyNo=FormCompanyNo;exports.FormCompanyNoDefaultProps=FormCompanyNoDefaultProps;exports.FormContext=FormContext;exports.FormContextDefaultValue=FormContextDefaultValue;exports.FormContextProvider=FormContextProvider;exports.FormDatePicker=FormDatePicker;exports.FormDatePickerDefaultProps=FormDatePickerDefaultProps;exports.FormDateRangePicker=FormDateRangePicker;exports.FormDateRangePickerDefaultProps=FormDateRangePickerDefaultProps;exports.FormDateTimePicker=FormDateTimePicker;exports.FormDateTimePickerDefaultProps=FormDateTimePickerDefaultProps;exports.FormDefaultProps=FormDefaultProps;exports.FormDivider=FormDivider;exports.FormDividerDefaultProps=FormDividerDefaultProps;exports.FormEmail=FormEmail;exports.FormEmailDefaultProps=FormEmailDefaultProps;exports.FormFile=FormFile;exports.FormFileDefaultProps=FormFileDefaultProps;exports.FormFooter=FormFooter;exports.FormFooterDefaultProps=FormFooterDefaultProps;exports.FormHidden=FormHidden;exports.FormHiddenDefaultProps=FormHiddenDefaultProps;exports.FormImageFile=FormImageFile;exports.FormImageFileDefaultProps=FormImageFileDefaultProps;exports.FormLabel=FormLabel;exports.FormLabelDefaultProps=FormLabelDefaultProps;exports.FormMobile=FormMobile;exports.FormMobileDefaultProps=FormMobileDefaultProps;exports.FormMonthPicker=FormMonthPicker;exports.FormMonthPickerDefaultProps=FormMonthPickerDefaultProps;exports.FormMonthRangePicker=FormMonthRangePicker;exports.FormMonthRangePickerDefaultProps=FormMonthRangePickerDefaultProps;exports.FormNumber=FormNumber;exports.FormNumberDefaultProps=FormNumberDefaultProps;exports.FormPassword=FormPassword;exports.FormPasswordDefaultProps=FormPasswordDefaultProps;exports.FormPersonalNo=FormPersonalNo;exports.FormPersonalNoDefaultProps=FormPersonalNoDefaultProps;exports.FormRadioGroup=FormRadioGroup;exports.FormRadioGroupDefaultProps=FormRadioGroupDefaultProps;exports.FormRating=FormRating;exports.FormRatingDefaultProps=FormRatingDefaultProps;exports.FormRow=FormRow;exports.FormRowDefaultProps=FormRowDefaultProps;exports.FormSearch=FormSearch;exports.FormSearchDefaultProps=FormSearchDefaultProps;exports.FormSelect=FormSelect;exports.FormSelectDefaultProps=FormSelectDefaultProps;exports.FormSwitch=FormSwitch;exports.FormSwitchDefaultProps=FormSwitchDefaultProps;exports.FormTag=FormTag;exports.FormTagDefaultProps=FormTagDefaultProps;exports.FormTel=FormTel;exports.FormTelDefaultProps=FormTelDefaultProps;exports.FormText=FormText;exports.FormTextDefaultProps=FormTextDefaultProps;exports.FormTextEditor=FormTextEditor;exports.FormTextEditorDefaultProps=FormTextEditorDefaultProps;exports.FormTextField=FormTextField;exports.FormTextFieldDefaultProps=FormTextFieldDefaultProps;exports.FormTextarea=FormTextarea;exports.FormTextareaDefaultProps=FormTextareaDefaultProps;exports.FormTimePicker=FormTimePicker;exports.FormTimePickerDefaultProps=FormTimePickerDefaultProps;exports.FormToggleButtonGroup=FormToggleButtonGroup;exports.FormToggleButtonGroupDefaultProps=FormToggleButtonGroupDefaultProps;exports.FormUrl=FormUrl;exports.FormUrlDefaultProps=FormUrlDefaultProps;exports.FormYearPicker=FormYearPicker;exports.FormYearPickerDefaultProps=FormYearPickerDefaultProps;exports.FormYearRangePicker=FormYearRangePicker;exports.FormYearRangePickerDefaultProps=FormYearRangePickerDefaultProps;exports.Search=Search;exports.SearchButton=SearchButton;exports.SearchButtonDefaultProps=SearchButtonDefaultProps;exports.SearchDefaultProps=SearchDefaultProps;exports.SearchGroup=SearchGroup;exports.SearchGroupDefaultProps=SearchGroupDefaultProps;exports.SearchGroupRow=SearchGroupRow;exports.SearchGroupRowDefaultProps=SearchGroupRowDefaultProps;exports.SearchMenuButton=SearchMenuButton;exports.SearchMenuButtonDefaultProps=SearchMenuButtonDefaultProps;exports.useFormState=useFormState;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pdg/react-form",
3
3
  "title": "React Form",
4
- "version": "1.0.91",
4
+ "version": "1.0.93",
5
5
  "description": "React Form",
6
6
  "type": "module",
7
7
  "types": "dist/index.d.ts",
@@ -24,7 +24,7 @@
24
24
  "dev": "cd examples && npm run dev",
25
25
  "dev-prd-lib": "cd examples && npm run dev-prd-lib",
26
26
  "build": "rollup -c --bundleConfigAsCjs",
27
- "publish": "npm publish --access=public",
27
+ "pub": "npm publish --access=public",
28
28
  "lint": "eslint './src/**/*.{ts,tsx}'",
29
29
  "reinstall-module": "rm -rf node_modules && rm -f package-lock.json && npm i"
30
30
  },
@@ -44,9 +44,9 @@
44
44
  "@mui/icons-material": "^5.15.13",
45
45
  "@mui/material": "^5.15.13",
46
46
  "@mui/x-date-pickers": "^6.19.7",
47
- "@pdg/react-component": "^1.0.6",
48
- "@pdg/react-hook": "^1.0.6",
49
- "@pdg/util": "^1.0.3",
47
+ "@pdg/react-component": "^1.0.9",
48
+ "@pdg/react-hook": "^1.0.8",
49
+ "@pdg/util": "^1.0.19",
50
50
  "@tinymce/tinymce-react": "^4.3.2",
51
51
  "@types/react": "^17.0.0 || ^18.0.0",
52
52
  "classnames": "^2.5.1",
@@ -1,4 +0,0 @@
1
- import React from 'react';
2
- import { FormIconProps as Props } from './FormIcon.types';
3
- declare const FormIcon: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLAnchorElement>>;
4
- export default FormIcon;
@@ -1,6 +0,0 @@
1
- import { IconProps } from '@mui/material';
2
- import { SvgIconComponent } from '@mui/icons-material';
3
- export interface FormIconProps extends Pick<IconProps, 'color' | 'style' | 'sx' | 'className' | 'fontSize'> {
4
- children: string | SvgIconComponent;
5
- }
6
- export declare const FormIconDefaultProps: {};
@@ -1,4 +0,0 @@
1
- import FormIcon from './FormIcon';
2
- export default FormIcon;
3
- export { FormIcon };
4
- export * from './FormIcon.types';