@pdg/react-form 1.0.55 → 1.0.57
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/@private/PrivateDateTimePicker/PrivateDateTimePicker.d.ts +5 -0
- package/dist/@private/PrivateDateTimePicker/PrivateDateTimePicker.types.d.ts +30 -0
- package/dist/@private/PrivateDateTimePicker/index.d.ts +4 -0
- package/dist/@private/PrivateStaticDatePicker/PrivateStaticDatePicker.types.d.ts +0 -2
- package/dist/@private/PrivateStaticDateTimePicker/PrivateStaticDateTimePicker.d.ts +5 -0
- package/dist/@private/PrivateStaticDateTimePicker/PrivateStaticDateTimePicker.types.d.ts +22 -0
- package/dist/@private/PrivateStaticDateTimePicker/index.d.ts +4 -0
- package/dist/@private/index.d.ts +2 -0
- package/dist/@util/date_time.d.ts +2 -2
- package/dist/FormItemCustom/FormDateTimePicker/FormDateTimePicker.types.d.ts +4 -4
- package/dist/FormItemCustom/FormTimePicker/FormTimePicker.types.d.ts +4 -4
- package/dist/index.esm.js +775 -83
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +774 -82
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import*as React from'react';import React__default,{createContext,useContext,useMemo,useRef,useState,useCallback,useLayoutEffect,useEffect,cloneElement,isValidElement,createRef,PureComponent,useId}from'react';import {Box,Icon as Icon$1,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,Paper,Menu}from'@mui/material';import dayjs from'dayjs';import {findDOMNode}from'react-dom';import {CheckBox,CheckBoxOutlineBlank,RadioButtonUnchecked,RadioButtonChecked}from'@mui/icons-material';import CircularProgress$1 from'@mui/material/CircularProgress';import {AdapterDayjs}from'@mui/x-date-pickers/AdapterDayjs';import {PickersDay,StaticDatePicker,LocalizationProvider,DesktopDatePicker}from'@mui/x-date-pickers';/******************************************************************************
|
|
1
|
+
import*as React from'react';import React__default,{createContext,useContext,useMemo,useRef,useState,useCallback,useLayoutEffect,useEffect,cloneElement,isValidElement,createRef,PureComponent,useId}from'react';import {Box,Icon as Icon$1,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,Paper,Menu}from'@mui/material';import dayjs from'dayjs';import {findDOMNode}from'react-dom';import {CheckBox,CheckBoxOutlineBlank,RadioButtonUnchecked,RadioButtonChecked}from'@mui/icons-material';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';/******************************************************************************
|
|
2
2
|
Copyright (c) Microsoft Corporation.
|
|
3
3
|
|
|
4
4
|
Permission to use, copy, modify, and/or distribute this software for any
|
|
@@ -2193,8 +2193,8 @@ FormFooter.defaultProps = FormFooterDefaultProps;var FormTextFieldDefaultProps =
|
|
|
2193
2193
|
} else {
|
|
2194
2194
|
style.appendChild(document.createTextNode(css));
|
|
2195
2195
|
}
|
|
2196
|
-
}var css_248z$
|
|
2197
|
-
styleInject(css_248z$
|
|
2196
|
+
}var css_248z$l = ".FormTextField {\n min-width: 200px;\n}\n.FormTextField .clear-icon-button-wrap {\n visibility: hidden;\n}\n.FormTextField.variant-filled .clear-icon-button-wrap {\n margin-top: 9px;\n margin-bottom: -9px;\n}\n.FormTextField:hover .clear-icon-button-wrap.show,\n.FormTextField .MuiInputBase-root.Mui-focused .clear-icon-button-wrap.show {\n visibility: visible;\n}";
|
|
2197
|
+
styleInject(css_248z$l);var FormTextField = React__default.forwardRef(function (_a, ref) {
|
|
2198
2198
|
// ID --------------------------------------------------------------------------------------------------------------
|
|
2199
2199
|
var _b;
|
|
2200
2200
|
var initVariant = _a.variant, initSize = _a.size, initColor = _a.color, initFocused = _a.focused, initLabelShrink = _a.labelShrink, initFullWidth = _a.fullWidth,
|
|
@@ -2514,14 +2514,14 @@ FormTextField.defaultProps = FormTextFieldDefaultProps;var FormTextDefaultProps
|
|
|
2514
2514
|
return (React__default.createElement(FormTextField, __assign$7({ ref: ref, className: classNames$1(className, 'FormText'), disableReturnKey: true, onValue: handleValue }, props)));
|
|
2515
2515
|
});
|
|
2516
2516
|
FormText.displayName = 'FormText';
|
|
2517
|
-
FormText.defaultProps = FormTextDefaultProps;var FormHiddenDefaultProps = {};var css_248z$
|
|
2518
|
-
styleInject(css_248z$
|
|
2517
|
+
FormText.defaultProps = FormTextDefaultProps;var FormHiddenDefaultProps = {};var css_248z$k = ".FormHidden {\n display: none !important;\n}";
|
|
2518
|
+
styleInject(css_248z$k);var FormHidden = React__default.forwardRef(function (_a, ref) {
|
|
2519
2519
|
var className = _a.className, props = __rest$4(_a, ["className"]);
|
|
2520
2520
|
return (React__default.createElement(FormText, __assign$7({ ref: ref, className: classNames$1(className, 'FormHidden'), type: 'hidden', variant: 'standard' }, props)));
|
|
2521
2521
|
});
|
|
2522
2522
|
FormHidden.displayName = 'FormHidden';
|
|
2523
|
-
FormHidden.defaultProps = FormHiddenDefaultProps;var FormTagDefaultProps = __assign$7(__assign$7({}, FormTextDefaultProps), { value: [], clear: true, formValueSeparator: ',' });var css_248z$
|
|
2524
|
-
styleInject(css_248z$
|
|
2523
|
+
FormHidden.defaultProps = FormHiddenDefaultProps;var FormTagDefaultProps = __assign$7(__assign$7({}, FormTextDefaultProps), { value: [], clear: true, formValueSeparator: ',' });var css_248z$j = ".FormTag.FormTextField {\n min-width: 200px;\n}";
|
|
2524
|
+
styleInject(css_248z$j);var FormTag = React__default.forwardRef(function (_a, ref) {
|
|
2525
2525
|
// FormState -------------------------------------------------------------------------------------------------------
|
|
2526
2526
|
var className = _a.className, name = _a.name, initValue = _a.value, exceptValue = _a.exceptValue, required = _a.required, readOnly = _a.readOnly, maxLength = _a.maxLength, disabled = _a.disabled, initFullWidth = _a.fullWidth, initError = _a.error, initHelperText = _a.helperText, formValueSeparator = _a.formValueSeparator, formValueSort = _a.formValueSort, onValidate = _a.onValidate, onKeyDown = _a.onKeyDown, onChange = _a.onChange, onValue = _a.onValue, onBlur = _a.onBlur, props = __rest$4(_a, ["className", "name", "value", "exceptValue", "required", "readOnly", "maxLength", "disabled", "fullWidth", "error", "helperText", "formValueSeparator", "formValueSort", "onValidate", "onKeyDown", "onChange", "onValue", "onBlur"]);
|
|
2527
2527
|
var _b = useFormState(), formFullWidth = _b.fullWidth, onAddValueItem = _b.onAddValueItem, onValueChange = _b.onValueChange, onValueChangeByUser = _b.onValueChangeByUser, onRequestSearchSubmit = _b.onRequestSearchSubmit, otherFormState = __rest$4(_b, ["fullWidth", "onAddValueItem", "onValueChange", "onValueChangeByUser", "onRequestSearchSubmit"]);
|
|
@@ -2714,8 +2714,8 @@ FormTag.defaultProps = FormTagDefaultProps;var FormEmailDefaultProps = __assign$
|
|
|
2714
2714
|
return React__default.createElement(FormText, __assign$7({ ref: ref, className: classNames$1(className, 'FormEmail'), type: 'email' }, props));
|
|
2715
2715
|
});
|
|
2716
2716
|
FormEmail.displayName = 'FormEmail';
|
|
2717
|
-
FormEmail.defaultProps = FormEmailDefaultProps;var FormPasswordDefaultProps = __assign$7(__assign$7({}, FormTextFieldDefaultProps), { clear: false, eye: true });var css_248z$
|
|
2718
|
-
styleInject(css_248z$
|
|
2717
|
+
FormEmail.defaultProps = FormEmailDefaultProps;var FormPasswordDefaultProps = __assign$7(__assign$7({}, FormTextFieldDefaultProps), { clear: false, eye: true });var css_248z$i = ".FormPassword .eye-icon-button-wrap {\n visibility: hidden;\n}\n.FormPassword.variant-filled .eye-icon-button-wrap {\n margin-top: 9px;\n margin-bottom: -9px;\n}\n.FormPassword:hover .eye-icon-button-wrap.show,\n.FormPassword .MuiInputBase-root.Mui-focused .eye-icon-button-wrap.show {\n visibility: visible;\n}";
|
|
2718
|
+
styleInject(css_248z$i);var StyledEyeInputAdornment = styled(InputAdornment)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n visibility: hidden;\n"], ["\n visibility: hidden;\n"])));
|
|
2719
2719
|
var FormPassword = React__default.forwardRef(function (_a, ref) {
|
|
2720
2720
|
// State -----------------------------------------------------------------------------------------------------------
|
|
2721
2721
|
var className = _a.className, initMuiInputProps = _a.InputProps, eye = _a.eye, onChange = _a.onChange, props = __rest$4(_a, ["className", "InputProps", "eye", "onChange"]);
|
|
@@ -4052,14 +4052,14 @@ NumberFormatCustom.displayName = 'NumberFormatCustom';var FormNumberDefaultProps
|
|
|
4052
4052
|
return (React__default.createElement(FormText, __assign$7({ ref: ref, className: classNames$1(className, 'FormNumber'), InputProps: muiInputProps, readOnly: readOnly }, props)));
|
|
4053
4053
|
});
|
|
4054
4054
|
FormNumber.displayName = 'FormNumber';
|
|
4055
|
-
FormNumber.defaultProps = FormNumberDefaultProps;var FormSearchDefaultProps = __assign$7({}, FormTextDefaultProps);var css_248z$
|
|
4056
|
-
styleInject(css_248z$
|
|
4055
|
+
FormNumber.defaultProps = FormNumberDefaultProps;var FormSearchDefaultProps = __assign$7({}, FormTextDefaultProps);var css_248z$h = ".FormSearch input[type=search]::-webkit-search-decoration,\n.FormSearch input[type=search]::-webkit-search-cancel-button,\n.FormSearch input[type=search]::-webkit-search-results-button,\n.FormSearch input[type=search]::-webkit-search-results-decoration {\n -webkit-appearance: none;\n}";
|
|
4056
|
+
styleInject(css_248z$h);var FormSearch = React__default.forwardRef(function (_a, ref) {
|
|
4057
4057
|
var className = _a.className, props = __rest$4(_a, ["className"]);
|
|
4058
4058
|
return React__default.createElement(FormText, __assign$7({ className: classNames$1(className, 'FormSearch'), ref: ref, type: 'search' }, props));
|
|
4059
4059
|
});
|
|
4060
4060
|
FormSearch.displayName = 'FormSearch';
|
|
4061
|
-
FormSearch.defaultProps = FormSearchDefaultProps;var FormTextareaDefaultProps = __assign$7(__assign$7({}, FormTextFieldDefaultProps), { clear: false, rows: 3, value: '' });var css_248z$
|
|
4062
|
-
styleInject(css_248z$
|
|
4061
|
+
FormSearch.defaultProps = FormSearchDefaultProps;var FormTextareaDefaultProps = __assign$7(__assign$7({}, FormTextFieldDefaultProps), { clear: false, rows: 3, value: '' });var css_248z$g = ".FormTextarea .MuiInputBase-root .MuiInputBase-input {\n overflow-y: scroll;\n}\n.FormTextarea .MuiInputBase-root .MuiInputBase-input::-webkit-scrollbar {\n width: 8px;\n}\n.FormTextarea .MuiInputBase-root .MuiInputBase-input::-webkit-scrollbar-thumb {\n background-color: rgba(0, 0, 0, 0.1882352941);\n background-clip: padding-box;\n border-left: 4px transparent solid;\n}";
|
|
4062
|
+
styleInject(css_248z$g);var FormTextarea = React__default.forwardRef(function (_a, ref) {
|
|
4063
4063
|
var className = _a.className, props = __rest$4(_a, ["className"]);
|
|
4064
4064
|
return React__default.createElement(FormTextField, __assign$7({ ref: ref, className: classNames$1(className, 'FormTextarea') }, props, { multiline: true }));
|
|
4065
4065
|
});
|
|
@@ -4069,8 +4069,8 @@ FormTextarea.defaultProps = FormTextareaDefaultProps;var FormUrlDefaultProps = _
|
|
|
4069
4069
|
return React__default.createElement(FormText, __assign$7({ ref: ref, className: classNames$1(className, 'FormUrl'), type: 'url' }, props));
|
|
4070
4070
|
});
|
|
4071
4071
|
FormUrl.displayName = 'FormUrl';
|
|
4072
|
-
FormUrl.defaultProps = FormUrlDefaultProps;var FormSelectDefaultProps = __assign$7(__assign$7({}, FormTextDefaultProps), { formValueSeparator: ',', minWidth: 120 });var css_248z$
|
|
4073
|
-
styleInject(css_248z$
|
|
4072
|
+
FormUrl.defaultProps = FormUrlDefaultProps;var FormSelectDefaultProps = __assign$7(__assign$7({}, FormTextDefaultProps), { formValueSeparator: ',', minWidth: 120 });var css_248z$f = ".FormSelect.is-selected-placeholder .MuiSelect-select {\n opacity: 0.38;\n}\n.FormSelect .MuiInputBase-root.MuiInputBase-adornedEnd {\n padding-right: 25px;\n}\n.FormSelect .MuiSelect-select.MuiSelect-multiple .selected-list:not(:empty) {\n margin-top: -3px;\n margin-bottom: -3px;\n}\n.FormSelect-Menu-Popover > .MuiPaper-root::-webkit-scrollbar {\n width: 12px;\n}\n.FormSelect-Menu-Popover > .MuiPaper-root::-webkit-scrollbar-thumb {\n background-color: rgba(0, 0, 0, 0.1882352941);\n background-clip: padding-box;\n border-left: 4px transparent solid;\n border-right: 4px transparent solid;\n}\n.FormSelect-Menu-Popover > .MuiPaper-root::-webkit-scrollbar-button:start:decrement, .FormSelect-Menu-Popover > .MuiPaper-root::-webkit-scrollbar-button:end:increment {\n display: block;\n height: 4px;\n background-color: transparent;\n}";
|
|
4073
|
+
styleInject(css_248z$f);var FormSelect = React__default.forwardRef(function (_a, ref) {
|
|
4074
4074
|
// FormState -------------------------------------------------------------------------------------------------------
|
|
4075
4075
|
var className = _a.className, name = _a.name, initItems = _a.items, initFullWidth = _a.fullWidth, onLoadItems = _a.onLoadItems, readOnly = _a.readOnly, multiple = _a.multiple, checkbox = _a.checkbox, placeholder = _a.placeholder, initStartAdornment = _a.startAdornment, initValue = _a.value, initInputLabelProps = _a.InputLabelProps, initSelectProps = _a.SelectProps, formValueSeparator = _a.formValueSeparator, formValueSort = _a.formValueSort, width = _a.width, minWidth = _a.minWidth, initLoading = _a.loading, onChange = _a.onChange, onValue = _a.onValue, props = __rest$4(_a, ["className", "name", "items", "fullWidth", "onLoadItems", "readOnly", "multiple", "checkbox", "placeholder", "startAdornment", "value", "InputLabelProps", "SelectProps", "formValueSeparator", "formValueSort", "width", "minWidth", "loading", "onChange", "onValue"]);
|
|
4076
4076
|
var _b = useFormState(), formFullWidth = _b.fullWidth, onAddValueItem = _b.onAddValueItem, onValueChange = _b.onValueChange, otherFormState = __rest$4(_b, ["fullWidth", "onAddValueItem", "onValueChange"]);
|
|
@@ -4403,8 +4403,8 @@ function autoDash(personalNo) {
|
|
|
4403
4403
|
checked: false,
|
|
4404
4404
|
value: 1,
|
|
4405
4405
|
uncheckedValue: 0,
|
|
4406
|
-
};var css_248z$
|
|
4407
|
-
styleInject(css_248z$
|
|
4406
|
+
};var css_248z$e = ".FormItemBase .FormItemBase-InputLabel {\n overflow: visible;\n padding-left: 5px;\n}\n.FormItemBase .FormItemBase-InputLabel.MuiInputLabel-sizeSmall {\n transform: translate(0, -1.5px) scale(0.7);\n}\n.FormItemBase .FormItemBase-Control-wrap {\n position: relative;\n}\n.FormItemBase .FormItemBase-Control {\n position: absolute;\n left: 0;\n top: 0;\n}\n.FormItemBase.variant-standard .FormItemBase-Control-wrap {\n margin-top: 16px;\n}";
|
|
4407
|
+
styleInject(css_248z$e);var FormItemBase = React__default.forwardRef(function (_a, ref) {
|
|
4408
4408
|
// Ref ---------------------------------------------------------------------------------------------------------------
|
|
4409
4409
|
var initVariant = _a.variant, initSize = _a.size, initColor = _a.color, initFullWidth = _a.fullWidth,
|
|
4410
4410
|
//----------------------------------------------------------------------------------------------------------------
|
|
@@ -5023,8 +5023,8 @@ FormRadioGroup.displayName = 'FormRadioGroup';
|
|
|
5023
5023
|
FormRadioGroup.defaultProps = FormRadioGroupDefaultProps;var FormToggleButtonGroupDefaultProps = {
|
|
5024
5024
|
type: 'button',
|
|
5025
5025
|
formValueSeparator: ',',
|
|
5026
|
-
};var css_248z$
|
|
5027
|
-
styleInject(css_248z$
|
|
5026
|
+
};var css_248z$d = ".FormToggleButtonGroup .ToggleButton {\n display: inline-block;\n padding: 0 10px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton, .FormToggleButtonGroup.type-radio .ToggleButton {\n padding-left: 3px;\n padding-right: 5px;\n border: 0 !important;\n margin-left: 0 !important;\n justify-content: flex-start;\n display: flex;\n background-color: transparent !important;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton:not(:last-child), .FormToggleButtonGroup.type-radio .ToggleButton:not(:last-child) {\n margin-right: 5px;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-checked__,\n.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-unchecked__, .FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-checked__,\n.FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-unchecked__ {\n margin-right: 3px;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-checked__, .FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-checked__ {\n display: none;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton.Mui-selected .__checkbox-checked__, .FormToggleButtonGroup.type-radio .ToggleButton.Mui-selected .__checkbox-checked__ {\n display: block;\n}\n.FormToggleButtonGroup.type-checkbox .ToggleButton.Mui-selected .__checkbox-unchecked__, .FormToggleButtonGroup.type-radio .ToggleButton.Mui-selected .__checkbox-unchecked__ {\n display: none;\n}\n.FormToggleButtonGroup:not(.with-label).variant-outlined .FormItemBase-Control-wrap {\n margin-top: 15px;\n margin-bottom: -15px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-filled .FormItemBase-Control-wrap {\n margin-top: 15px;\n margin-bottom: -15px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-standard .FormItemBase-Control-wrap {\n margin-top: 0px;\n margin-bottom: 0px;\n}\n.FormToggleButtonGroup:not(.with-label).variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 28px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 13px;\n margin-bottom: -13px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 24px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-filled .FormItemBase-Control-wrap {\n margin-top: 13px;\n margin-bottom: -13px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 31px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0px;\n margin-bottom: 0px;\n}\n.FormToggleButtonGroup:not(.with-label).size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 26px;\n}\n.FormToggleButtonGroup.with-label.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup.with-label.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.FormToggleButtonGroup.with-label.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 28px;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 24px;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 31px;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.FormToggleButtonGroup.with-label.size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 26px;\n}\n\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 37px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 28px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-outlined .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {\n height: 24px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-filled .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {\n height: 31px;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-standard .FormItemBase-Control-wrap {\n margin-top: 0;\n margin-bottom: 0;\n}\n.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {\n height: 26px;\n}";
|
|
5027
|
+
styleInject(css_248z$d);var FormToggleButtonGroup = React__default.forwardRef(function (_a, ref) {
|
|
5028
5028
|
// ID --------------------------------------------------------------------------------------------------------------
|
|
5029
5029
|
var initVariant = _a.variant, initSize = _a.size, initColor = _a.color, initFocused = _a.focused, initFullWidth = _a.fullWidth,
|
|
5030
5030
|
//----------------------------------------------------------------------------------------------------------------
|
|
@@ -7466,8 +7466,8 @@ var Editor = /** @class */ (function (_super) {
|
|
|
7466
7466
|
}(React.Component));var FormTextEditorDefaultProps = {
|
|
7467
7467
|
menubar: true,
|
|
7468
7468
|
height: 500,
|
|
7469
|
-
};var css_248z$
|
|
7470
|
-
styleInject(css_248z$
|
|
7469
|
+
};var css_248z$c = ".FormTextEditor.initializing textarea {\n display: none;\n}\n.FormTextEditor.error .tox-tinymce {\n border-color: #d32f2f;\n}\n\n.tox-menu.tox-collection.tox-collection--list .tox-collection__group .tox-menu-nav__js.tox-collection__item {\n padding-right: 20px !important;\n}\n\n.tox-notifications-container {\n display: none;\n}";
|
|
7470
|
+
styleInject(css_248z$c);var FormTextEditor = React__default.forwardRef(function (_a, ref) {
|
|
7471
7471
|
// ID --------------------------------------------------------------------------------------------------------------
|
|
7472
7472
|
var initVariant = _a.variant, initSize = _a.size, initColor = _a.color, initFocused = _a.focused,
|
|
7473
7473
|
//----------------------------------------------------------------------------------------------------------------
|
|
@@ -8309,8 +8309,8 @@ Icon.defaultProps = IconDefaultProps;var IconTextDefaultProps = {
|
|
|
8309
8309
|
IconText.defaultProps = IconTextDefaultProps;var PrivateDatePickerDefaultProps = {
|
|
8310
8310
|
showDaysOutsideCurrentMonth: true,
|
|
8311
8311
|
align: 'center',
|
|
8312
|
-
};var PrivateStaticDatePickerDefaultProps = {};var PrivateYearSelectDefaultProps = {};var css_248z$
|
|
8313
|
-
styleInject(css_248z$
|
|
8312
|
+
};var PrivateStaticDatePickerDefaultProps = {};var PrivateYearSelectDefaultProps = {};var css_248z$b = ".PrivateYearSelect {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n background-color: white;\n}\n.PrivateYearSelect button {\n font-size: 14px;\n font-weight: 400;\n border-radius: 18px;\n}";
|
|
8313
|
+
styleInject(css_248z$b);var PrivateToggleButtonDefaultProps = {};var PrivateToggleButton = React__default.forwardRef(function (_a, ref) {
|
|
8314
8314
|
var children = _a.children, initClassName = _a.className, selected = _a.selected, activated = _a.activated, outlined = _a.outlined, props = __rest$4(_a, ["children", "className", "selected", "activated", "outlined"]);
|
|
8315
8315
|
var theme = useTheme();
|
|
8316
8316
|
var className = useMemo(function () { return classNames$1(initClassName, selected && 'selected', activated && 'activated', outlined && 'outlined'); }, [activated, initClassName, outlined, selected]);
|
|
@@ -9896,8 +9896,8 @@ var SimpleBar = React.forwardRef(function (_a, ref) {
|
|
|
9896
9896
|
React.createElement("div", { className: classNames.scrollbar }))));
|
|
9897
9897
|
});
|
|
9898
9898
|
SimpleBar.displayName = 'SimpleBar';var YEARS$1 = new Array(200).fill(0);
|
|
9899
|
-
for (var i$
|
|
9900
|
-
YEARS$1[i$
|
|
9899
|
+
for (var i$5 = 0; i$5 < 200; i$5 += 1) {
|
|
9900
|
+
YEARS$1[i$5] = 1900 + i$5;
|
|
9901
9901
|
}
|
|
9902
9902
|
var PrivateYearSelect = function (_a) {
|
|
9903
9903
|
// Ref -------------------------------------------------------------------------------------------------------------
|
|
@@ -9937,10 +9937,10 @@ var PrivateYearSelect = function (_a) {
|
|
|
9937
9937
|
})))));
|
|
9938
9938
|
};
|
|
9939
9939
|
PrivateYearSelect.displayName = 'PrivateYearSelect';
|
|
9940
|
-
PrivateYearSelect.defaultProps = PrivateYearSelectDefaultProps;var PrivateMonthSelectDefaultProps = {};var css_248z$
|
|
9941
|
-
styleInject(css_248z$
|
|
9942
|
-
for (var i$
|
|
9943
|
-
MONTHS$1[i$
|
|
9940
|
+
PrivateYearSelect.defaultProps = PrivateYearSelectDefaultProps;var PrivateMonthSelectDefaultProps = {};var css_248z$a = ".PrivateMonthSelect {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n background-color: white;\n}\n.PrivateMonthSelect button {\n font-size: 15px;\n font-weight: 400;\n border-radius: 18px;\n}";
|
|
9941
|
+
styleInject(css_248z$a);var MONTHS$1 = new Array(12).fill(0);
|
|
9942
|
+
for (var i$4 = 0; i$4 < 12; i$4 += 1) {
|
|
9943
|
+
MONTHS$1[i$4] = i$4;
|
|
9944
9944
|
}
|
|
9945
9945
|
var PrivateMonthSelect = function (_a) {
|
|
9946
9946
|
var year = _a.year, selectYear = _a.selectYear, selectMonth = _a.selectMonth, activeMonth = _a.activeMonth, availableDate = _a.availableDate, onSelect = _a.onSelect;
|
|
@@ -9961,10 +9961,10 @@ var PrivateMonthSelect = function (_a) {
|
|
|
9961
9961
|
PrivateMonthSelect.displayName = 'PrivateMonthSelect';
|
|
9962
9962
|
PrivateMonthSelect.defaultProps = PrivateMonthSelectDefaultProps;var PrivateTimeSelectDefaultProps = {
|
|
9963
9963
|
cols: 1,
|
|
9964
|
-
};var css_248z$
|
|
9965
|
-
styleInject(css_248z$
|
|
9966
|
-
for (var i$
|
|
9967
|
-
DEFAULT_MINUTES$
|
|
9964
|
+
};var css_248z$9 = ".PrivateTimeSelect {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n}\n.PrivateTimeSelect button {\n border-radius: 0;\n}";
|
|
9965
|
+
styleInject(css_248z$9);var DEFAULT_MINUTES$2 = new Array(60).fill(0);
|
|
9966
|
+
for (var i$3 = 0; i$3 < DEFAULT_MINUTES$2.length; i$3 += 1) {
|
|
9967
|
+
DEFAULT_MINUTES$2[i$3] = i$3;
|
|
9968
9968
|
}
|
|
9969
9969
|
var PrivateTimeSelect = React__default.forwardRef(function (_a, ref) {
|
|
9970
9970
|
// Ref -------------------------------------------------------------------------------------------------------------
|
|
@@ -10068,18 +10068,18 @@ var PrivateTimeSelect = React__default.forwardRef(function (_a, ref) {
|
|
|
10068
10068
|
}))))));
|
|
10069
10069
|
});
|
|
10070
10070
|
PrivateTimeSelect.displayName = 'PrivateTimeSelect';
|
|
10071
|
-
PrivateTimeSelect.defaultProps = PrivateTimeSelectDefaultProps;var css_248z$
|
|
10072
|
-
styleInject(css_248z$
|
|
10073
|
-
for (var i$
|
|
10074
|
-
DEFAULT_HOURS[i$
|
|
10071
|
+
PrivateTimeSelect.defaultProps = PrivateTimeSelectDefaultProps;var css_248z$8 = ".PrivateStaticDatePicker.time {\n height: 400px;\n}\n.PrivateStaticDatePicker .MuiPickersCalendarHeader-root {\n display: none;\n}\n.PrivateStaticDatePicker .month-title-container {\n display: flex;\n align-items: center;\n margin-left: 5px;\n}\n.PrivateStaticDatePicker .month-title-container .month-title-wrap {\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.PrivateStaticDatePicker .month-title-container .month-title-wrap .month-title button {\n font-size: 15px;\n padding-left: 8px;\n padding-right: 0;\n min-width: 0;\n}\n.PrivateStaticDatePicker .month-title-container .month-title-wrap .month-title button:not(.active) {\n color: unset;\n}\n.PrivateStaticDatePicker .action-buttons {\n border-top: 1px solid #efefef;\n padding: 10px;\n text-align: right;\n}\n.PrivateStaticDatePicker .action-buttons button {\n min-width: 0;\n color: inherit;\n}\n.PrivateStaticDatePicker .action-buttons button:not(:first-child) {\n margin-left: 5px;\n}\n.PrivateStaticDatePicker .action-buttons button.disabled {\n color: rgba(0, 0, 0, 0.5);\n}\n.PrivateStaticDatePicker .time {\n border-left: 2px solid #bfbfbf;\n}\n.PrivateStaticDatePicker .time .time-container {\n height: 100%;\n}\n.PrivateStaticDatePicker .time .time-container .time-title {\n text-align: center;\n padding: 22px 0;\n font-size: 15px;\n}\n.PrivateStaticDatePicker .time .time-container .time-select-wrap {\n flex: 1;\n border-top: 1px solid #efefef;\n}\n.PrivateStaticDatePicker.time .time .time-container .time-select-wrap > div > div:not(:first-child) {\n border-left: 1px solid #efefef;\n}";
|
|
10072
|
+
styleInject(css_248z$8);var DEFAULT_HOURS$1 = new Array(24).fill(0);
|
|
10073
|
+
for (var i$2 = 0; i$2 < DEFAULT_HOURS$1.length; i$2 += 1) {
|
|
10074
|
+
DEFAULT_HOURS$1[i$2] = i$2;
|
|
10075
10075
|
}
|
|
10076
|
-
var DEFAULT_MINUTES = new Array(60).fill(0);
|
|
10077
|
-
for (var i$
|
|
10078
|
-
DEFAULT_MINUTES[i$
|
|
10076
|
+
var DEFAULT_MINUTES$1 = new Array(60).fill(0);
|
|
10077
|
+
for (var i$2 = 0; i$2 < DEFAULT_MINUTES$1.length; i$2 += 1) {
|
|
10078
|
+
DEFAULT_MINUTES$1[i$2] = i$2;
|
|
10079
10079
|
}
|
|
10080
|
-
var DEFAULT_SECONDS = new Array(60).fill(0);
|
|
10081
|
-
for (var i$
|
|
10082
|
-
DEFAULT_SECONDS[i$
|
|
10080
|
+
var DEFAULT_SECONDS$1 = new Array(60).fill(0);
|
|
10081
|
+
for (var i$2 = 0; i$2 < DEFAULT_SECONDS$1.length; i$2 += 1) {
|
|
10082
|
+
DEFAULT_SECONDS$1[i$2] = i$2;
|
|
10083
10083
|
}
|
|
10084
10084
|
var PrivateStaticDatePicker = React__default.forwardRef(function (_a, ref) {
|
|
10085
10085
|
// Ref -------------------------------------------------------------------------------------------------------------
|
|
@@ -10100,9 +10100,9 @@ var PrivateStaticDatePicker = React__default.forwardRef(function (_a, ref) {
|
|
|
10100
10100
|
var _d = useState(false), yearSelectOpen = _d[0], setYearSelectOpen = _d[1];
|
|
10101
10101
|
var _e = useState(false), monthSelectOpen = _e[0], setMonthSelectOpen = _e[1];
|
|
10102
10102
|
// Memo --------------------------------------------------------------------------------------------------------------
|
|
10103
|
-
var hours = useMemo(function () { return initHours || DEFAULT_HOURS; }, [initHours]);
|
|
10104
|
-
var minutes = useMemo(function () { return initMinutes || DEFAULT_MINUTES; }, [initMinutes]);
|
|
10105
|
-
var seconds = useMemo(function () { return initSeconds || DEFAULT_SECONDS; }, [initSeconds]);
|
|
10103
|
+
var hours = useMemo(function () { return initHours || DEFAULT_HOURS$1; }, [initHours]);
|
|
10104
|
+
var minutes = useMemo(function () { return initMinutes || DEFAULT_MINUTES$1; }, [initMinutes]);
|
|
10105
|
+
var seconds = useMemo(function () { return initSeconds || DEFAULT_SECONDS$1; }, [initSeconds]);
|
|
10106
10106
|
var availableDate = useMemo(function () {
|
|
10107
10107
|
return initAvailableDate ? initAvailableDate : makeAvailableDate(minDate, maxDate, !!disablePast, !!disableFuture);
|
|
10108
10108
|
}, [initAvailableDate, minDate, maxDate, disablePast, disableFuture]);
|
|
@@ -10177,15 +10177,6 @@ var PrivateStaticDatePicker = React__default.forwardRef(function (_a, ref) {
|
|
|
10177
10177
|
rightArrowOnClickRef.current({});
|
|
10178
10178
|
}
|
|
10179
10179
|
}, []);
|
|
10180
|
-
var timeSelectScrollToDate = useCallback(function (date, times) {
|
|
10181
|
-
var _a, _b, _c;
|
|
10182
|
-
if (!times || (times === null || times === void 0 ? void 0 : times.includes('hour')))
|
|
10183
|
-
(_a = hourSelectRef.current) === null || _a === void 0 ? void 0 : _a.scrollToValue(date.hour());
|
|
10184
|
-
if (!times || (times === null || times === void 0 ? void 0 : times.includes('minute')))
|
|
10185
|
-
(_b = minuteSelectRef.current) === null || _b === void 0 ? void 0 : _b.scrollToValue(date.minute());
|
|
10186
|
-
if (!times || (times === null || times === void 0 ? void 0 : times.includes('second')))
|
|
10187
|
-
(_c = secondSelectRef.current) === null || _c === void 0 ? void 0 : _c.scrollToValue(date.second());
|
|
10188
|
-
}, []);
|
|
10189
10180
|
// Event Handler ---------------------------------------------------------------------------------------------------
|
|
10190
10181
|
var handleYearSelect = useCallback(function (year) {
|
|
10191
10182
|
setMonth(month.set('year', year));
|
|
@@ -10204,9 +10195,7 @@ var PrivateStaticDatePicker = React__default.forwardRef(function (_a, ref) {
|
|
|
10204
10195
|
// Commands --------------------------------------------------------------------------------------------------------
|
|
10205
10196
|
useLayoutEffect(function () {
|
|
10206
10197
|
if (ref) {
|
|
10207
|
-
var commands = {
|
|
10208
|
-
timeSelectScrollToDate: timeSelectScrollToDate,
|
|
10209
|
-
};
|
|
10198
|
+
var commands = {};
|
|
10210
10199
|
if (typeof ref === 'function') {
|
|
10211
10200
|
ref(commands);
|
|
10212
10201
|
}
|
|
@@ -10222,7 +10211,7 @@ var PrivateStaticDatePicker = React__default.forwardRef(function (_a, ref) {
|
|
|
10222
10211
|
}
|
|
10223
10212
|
};
|
|
10224
10213
|
}
|
|
10225
|
-
}, [ref
|
|
10214
|
+
}, [ref]);
|
|
10226
10215
|
// Render - Function -----------------------------------------------------------------------------------------------
|
|
10227
10216
|
var getActionButton = useCallback(function (date, label) {
|
|
10228
10217
|
var disabled = !isDateAvailable(date, availableDate, 'day');
|
|
@@ -10366,8 +10355,8 @@ PrivateStaticDatePicker.defaultProps = PrivateStaticDatePickerDefaultProps;var P
|
|
|
10366
10355
|
boxShadow: theme.shadows[8],
|
|
10367
10356
|
},
|
|
10368
10357
|
_b);
|
|
10369
|
-
});var css_248z$
|
|
10370
|
-
styleInject(css_248z$
|
|
10358
|
+
});var css_248z$7 = ".PrivateDatePicker .input-text-field.align-left .MuiInputBase-input {\n text-align: left;\n}\n.PrivateDatePicker .input-text-field.align-center .MuiInputBase-input {\n text-align: center;\n}\n.PrivateDatePicker .input-text-field.align-right .MuiInputBase-input {\n text-align: right;\n}";
|
|
10359
|
+
styleInject(css_248z$7);var PrivateDatePicker = React__default.forwardRef(function (_a, ref) {
|
|
10371
10360
|
// ID --------------------------------------------------------------------------------------------------------------
|
|
10372
10361
|
var initVariant = _a.variant, initSize = _a.size, initColor = _a.color, initFocused = _a.focused, initLabelShrink = _a.labelShrink, initFullWidth = _a.fullWidth,
|
|
10373
10362
|
//--------------------------------------------------------------------------------------------------------------------
|
|
@@ -10628,7 +10617,6 @@ styleInject(css_248z$5);var PrivateDatePicker = React__default.forwardRef(functi
|
|
|
10628
10617
|
]);
|
|
10629
10618
|
// Event Handler ---------------------------------------------------------------------------------------------------
|
|
10630
10619
|
var handleChange = useCallback(function (unit, newValue, keyboardInputValue) {
|
|
10631
|
-
var _a, _b, _c;
|
|
10632
10620
|
var updateValue = true;
|
|
10633
10621
|
if (notEmpty(keyboardInputValue)) {
|
|
10634
10622
|
if (newValue) {
|
|
@@ -10671,22 +10659,6 @@ styleInject(css_248z$5);var PrivateDatePicker = React__default.forwardRef(functi
|
|
|
10671
10659
|
onRequestSearchSubmit(name, finalValue);
|
|
10672
10660
|
}
|
|
10673
10661
|
});
|
|
10674
|
-
if (time) {
|
|
10675
|
-
if (finalValue) {
|
|
10676
|
-
switch (unit) {
|
|
10677
|
-
case 'date':
|
|
10678
|
-
case 'action_date':
|
|
10679
|
-
(_a = privateStaticDatePickerRef.current) === null || _a === void 0 ? void 0 : _a.timeSelectScrollToDate(finalValue);
|
|
10680
|
-
break;
|
|
10681
|
-
case 'hour':
|
|
10682
|
-
(_b = privateStaticDatePickerRef.current) === null || _b === void 0 ? void 0 : _b.timeSelectScrollToDate(finalValue, ['minute', 'second']);
|
|
10683
|
-
break;
|
|
10684
|
-
case 'minute':
|
|
10685
|
-
(_c = privateStaticDatePickerRef.current) === null || _c === void 0 ? void 0 : _c.timeSelectScrollToDate(finalValue, ['second']);
|
|
10686
|
-
break;
|
|
10687
|
-
}
|
|
10688
|
-
}
|
|
10689
|
-
}
|
|
10690
10662
|
}
|
|
10691
10663
|
setInputValue(finalValue);
|
|
10692
10664
|
}, [type, time, setValue, availableDate, open, onValueChangeByUser, name, onRequestSearchSubmit]);
|
|
@@ -10786,7 +10758,7 @@ styleInject(css_248z$5);var PrivateDatePicker = React__default.forwardRef(functi
|
|
|
10786
10758
|
variant,
|
|
10787
10759
|
]);
|
|
10788
10760
|
// Render ----------------------------------------------------------------------------------------------------------
|
|
10789
|
-
return (React__default.createElement(LocalizationProvider, { dateAdapter: AdapterDayjs
|
|
10761
|
+
return (React__default.createElement(LocalizationProvider, { dateAdapter: AdapterDayjs },
|
|
10790
10762
|
React__default.createElement(ClickAwayListener, { mouseEvent: 'onMouseDown', touchEvent: 'onTouchStart', onClickAway: function () { return setOpen(false); } },
|
|
10791
10763
|
React__default.createElement("div", { className: classNames$1(className, 'PrivateDatePicker'), style: wrapStyle, onMouseDown: handleContainerMouseDown, onFocus: handleContainerFocus, onBlur: handleContainerBlur },
|
|
10792
10764
|
React__default.createElement(PrivateStyledTooltip, { open: disabled || readOnly ? false : open, PopperProps: {
|
|
@@ -10804,7 +10776,727 @@ styleInject(css_248z$5);var PrivateDatePicker = React__default.forwardRef(functi
|
|
|
10804
10776
|
!formColWithHelperText && helperText && (React__default.createElement(FormHelperText, { error: error, style: { marginLeft: variant === 'standard' ? 0 : 14 } }, helperText))))));
|
|
10805
10777
|
});
|
|
10806
10778
|
PrivateDatePicker.displayName = 'PrivateDatePicker';
|
|
10807
|
-
PrivateDatePicker.defaultProps = PrivateDatePickerDefaultProps;var
|
|
10779
|
+
PrivateDatePicker.defaultProps = PrivateDatePickerDefaultProps;var PrivateDateTimePickerDefaultProps = {
|
|
10780
|
+
showDaysOutsideCurrentMonth: true,
|
|
10781
|
+
align: 'center',
|
|
10782
|
+
};var css_248z$6 = ".PrivateDateTimePicker .input-text-field.align-left .MuiInputBase-input {\n text-align: left;\n}\n.PrivateDateTimePicker .input-text-field.align-center .MuiInputBase-input {\n text-align: center;\n}\n.PrivateDateTimePicker .input-text-field.align-right .MuiInputBase-input {\n text-align: right;\n}";
|
|
10783
|
+
styleInject(css_248z$6);var PrivateStaticDateTimePickerDefaultProps = {};var css_248z$5 = ".PrivateStaticDateTimePicker.time {\n height: 400px;\n}\n.PrivateStaticDateTimePicker .MuiPickersCalendarHeader-root {\n display: none;\n}\n.PrivateStaticDateTimePicker .month-title-container {\n display: flex;\n align-items: center;\n margin-left: 5px;\n}\n.PrivateStaticDateTimePicker .month-title-container .month-title-wrap {\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.PrivateStaticDateTimePicker .month-title-container .month-title-wrap .month-title button {\n font-size: 15px;\n padding-left: 8px;\n padding-right: 0;\n min-width: 0;\n}\n.PrivateStaticDateTimePicker .month-title-container .month-title-wrap .month-title button:not(.active) {\n color: unset;\n}\n.PrivateStaticDateTimePicker .action-buttons {\n border-top: 1px solid #efefef;\n padding: 10px;\n text-align: right;\n}\n.PrivateStaticDateTimePicker .action-buttons button {\n min-width: 0;\n color: inherit;\n}\n.PrivateStaticDateTimePicker .action-buttons button:not(:first-child) {\n margin-left: 5px;\n}\n.PrivateStaticDateTimePicker .action-buttons button.disabled {\n color: rgba(0, 0, 0, 0.5);\n}\n.PrivateStaticDateTimePicker .time {\n border-left: 2px solid #bfbfbf;\n}\n.PrivateStaticDateTimePicker .time .time-container {\n height: 100%;\n}\n.PrivateStaticDateTimePicker .time .time-container .time-title {\n text-align: center;\n padding: 22px 0;\n font-size: 15px;\n}\n.PrivateStaticDateTimePicker .time .time-container .time-select-wrap {\n flex: 1;\n border-top: 1px solid #efefef;\n}\n.PrivateStaticDateTimePicker.time .time .time-container .time-select-wrap > div > div:not(:first-child) {\n border-left: 1px solid #efefef;\n}";
|
|
10784
|
+
styleInject(css_248z$5);var DEFAULT_HOURS = new Array(24).fill(0);
|
|
10785
|
+
for (var i$1 = 0; i$1 < DEFAULT_HOURS.length; i$1 += 1) {
|
|
10786
|
+
DEFAULT_HOURS[i$1] = i$1;
|
|
10787
|
+
}
|
|
10788
|
+
var DEFAULT_MINUTES = new Array(60).fill(0);
|
|
10789
|
+
for (var i$1 = 0; i$1 < DEFAULT_MINUTES.length; i$1 += 1) {
|
|
10790
|
+
DEFAULT_MINUTES[i$1] = i$1;
|
|
10791
|
+
}
|
|
10792
|
+
var DEFAULT_SECONDS = new Array(60).fill(0);
|
|
10793
|
+
for (var i$1 = 0; i$1 < DEFAULT_SECONDS.length; i$1 += 1) {
|
|
10794
|
+
DEFAULT_SECONDS[i$1] = i$1;
|
|
10795
|
+
}
|
|
10796
|
+
var PrivateStaticDateTimePicker = React__default.forwardRef(function (_a, ref) {
|
|
10797
|
+
// Ref -------------------------------------------------------------------------------------------------------------
|
|
10798
|
+
var value = _a.value, initAvailableDate = _a.availableDate, defaultCalendarMonth = _a.defaultCalendarMonth, type = _a.type, time = _a.time, initHours = _a.hours, initMinutes = _a.minutes, initSeconds = _a.seconds, minuteInterval = _a.minuteInterval, secondInterval = _a.secondInterval, minDate = _a.minDate, maxDate = _a.maxDate, disablePast = _a.disablePast, disableFuture = _a.disableFuture, onChange = _a.onChange, onMonthChange = _a.onMonthChange, onClose = _a.onClose, props = __rest$4(_a, ["value", "availableDate", "defaultCalendarMonth", "type", "time", "hours", "minutes", "seconds", "minuteInterval", "secondInterval", "minDate", "maxDate", "disablePast", "disableFuture", "onChange", "onMonthChange", "onClose"]);
|
|
10799
|
+
var hourSelectRef = useRef(null);
|
|
10800
|
+
var minuteSelectRef = useRef(null);
|
|
10801
|
+
var secondSelectRef = useRef(null);
|
|
10802
|
+
// State -----------------------------------------------------------------------------------------------------------
|
|
10803
|
+
var _b = useState(function () {
|
|
10804
|
+
if (value)
|
|
10805
|
+
return value;
|
|
10806
|
+
else if (defaultCalendarMonth)
|
|
10807
|
+
return defaultCalendarMonth;
|
|
10808
|
+
else
|
|
10809
|
+
return dayjs();
|
|
10810
|
+
}), month = _b[0], setMonth = _b[1];
|
|
10811
|
+
var _c = useState(null), activeMonthValue = _c[0], setActiveMonthValue = _c[1];
|
|
10812
|
+
var _d = useState(false), yearSelectOpen = _d[0], setYearSelectOpen = _d[1];
|
|
10813
|
+
var _e = useState(false), monthSelectOpen = _e[0], setMonthSelectOpen = _e[1];
|
|
10814
|
+
// Memo --------------------------------------------------------------------------------------------------------------
|
|
10815
|
+
var hours = useMemo(function () { return initHours || DEFAULT_HOURS; }, [initHours]);
|
|
10816
|
+
var minutes = useMemo(function () { return initMinutes || DEFAULT_MINUTES; }, [initMinutes]);
|
|
10817
|
+
var seconds = useMemo(function () { return initSeconds || DEFAULT_SECONDS; }, [initSeconds]);
|
|
10818
|
+
var availableDate = useMemo(function () {
|
|
10819
|
+
return initAvailableDate ? initAvailableDate : makeAvailableDate(minDate, maxDate, !!disablePast, !!disableFuture);
|
|
10820
|
+
}, [initAvailableDate, minDate, maxDate, disablePast, disableFuture]);
|
|
10821
|
+
var disableHours = useMemo(function () {
|
|
10822
|
+
var newDisableHours = [];
|
|
10823
|
+
if (time && value && (availableDate[0] || availableDate[1])) {
|
|
10824
|
+
hours.forEach(function (h) {
|
|
10825
|
+
if (!isDateAvailable(value.set('hour', h), availableDate, 'hour')) {
|
|
10826
|
+
newDisableHours.push(h);
|
|
10827
|
+
}
|
|
10828
|
+
});
|
|
10829
|
+
}
|
|
10830
|
+
return newDisableHours;
|
|
10831
|
+
}, [time, value, availableDate, hours]);
|
|
10832
|
+
var disableMinutes = useMemo(function () {
|
|
10833
|
+
var newDisableMinutes = [];
|
|
10834
|
+
if (time === 'minute' || time === 'second') {
|
|
10835
|
+
if (value && (availableDate[0] || availableDate[1])) {
|
|
10836
|
+
minutes.forEach(function (m) {
|
|
10837
|
+
if (!isDateAvailable(value.set('minute', m), availableDate, 'minute')) {
|
|
10838
|
+
newDisableMinutes.push(m);
|
|
10839
|
+
}
|
|
10840
|
+
});
|
|
10841
|
+
}
|
|
10842
|
+
}
|
|
10843
|
+
return newDisableMinutes;
|
|
10844
|
+
}, [time, value, availableDate, minutes]);
|
|
10845
|
+
var disableSeconds = useMemo(function () {
|
|
10846
|
+
var newDisableSeconds = [];
|
|
10847
|
+
if (time === 'second') {
|
|
10848
|
+
if (value && (availableDate[0] || availableDate[1])) {
|
|
10849
|
+
seconds.forEach(function (s) {
|
|
10850
|
+
if (!isDateAvailable(value.set('second', s), availableDate, 'second')) {
|
|
10851
|
+
newDisableSeconds.push(s);
|
|
10852
|
+
}
|
|
10853
|
+
});
|
|
10854
|
+
}
|
|
10855
|
+
}
|
|
10856
|
+
return newDisableSeconds;
|
|
10857
|
+
}, [time, value, availableDate, seconds]);
|
|
10858
|
+
// Effect ----------------------------------------------------------------------------------------------------------
|
|
10859
|
+
useEffect(function () {
|
|
10860
|
+
if (!yearSelectOpen) {
|
|
10861
|
+
setActiveMonthValue(null);
|
|
10862
|
+
}
|
|
10863
|
+
}, [yearSelectOpen]);
|
|
10864
|
+
//--------------------------------------------------------------------------------------------------------------------
|
|
10865
|
+
var leftArrowOnClickRef = useRef();
|
|
10866
|
+
var rightArrowOnClickRef = useRef();
|
|
10867
|
+
var LeftArrowButton = useState(function () {
|
|
10868
|
+
var ArrowButton = function (props) {
|
|
10869
|
+
leftArrowOnClickRef.current = props.onClick;
|
|
10870
|
+
return React__default.createElement(IconButton, __assign$7({}, props));
|
|
10871
|
+
};
|
|
10872
|
+
return ArrowButton;
|
|
10873
|
+
})[0];
|
|
10874
|
+
var RightArrowButton = useState(function () {
|
|
10875
|
+
var ArrowButton = function (props) {
|
|
10876
|
+
rightArrowOnClickRef.current = props.onClick;
|
|
10877
|
+
return React__default.createElement(IconButton, __assign$7({}, props));
|
|
10878
|
+
};
|
|
10879
|
+
return ArrowButton;
|
|
10880
|
+
})[0];
|
|
10881
|
+
// Function --------------------------------------------------------------------------------------------------------
|
|
10882
|
+
var previousMonth = useCallback(function () {
|
|
10883
|
+
if (leftArrowOnClickRef.current) {
|
|
10884
|
+
leftArrowOnClickRef.current({});
|
|
10885
|
+
}
|
|
10886
|
+
}, []);
|
|
10887
|
+
var nextMonth = useCallback(function () {
|
|
10888
|
+
if (rightArrowOnClickRef.current) {
|
|
10889
|
+
rightArrowOnClickRef.current({});
|
|
10890
|
+
}
|
|
10891
|
+
}, []);
|
|
10892
|
+
var timeSelectScrollToDate = useCallback(function (date, times) {
|
|
10893
|
+
var _a, _b, _c;
|
|
10894
|
+
if (!times || (times === null || times === void 0 ? void 0 : times.includes('hour')))
|
|
10895
|
+
(_a = hourSelectRef.current) === null || _a === void 0 ? void 0 : _a.scrollToValue(date.hour());
|
|
10896
|
+
if (!times || (times === null || times === void 0 ? void 0 : times.includes('minute')))
|
|
10897
|
+
(_b = minuteSelectRef.current) === null || _b === void 0 ? void 0 : _b.scrollToValue(date.minute());
|
|
10898
|
+
if (!times || (times === null || times === void 0 ? void 0 : times.includes('second')))
|
|
10899
|
+
(_c = secondSelectRef.current) === null || _c === void 0 ? void 0 : _c.scrollToValue(date.second());
|
|
10900
|
+
}, []);
|
|
10901
|
+
// Event Handler ---------------------------------------------------------------------------------------------------
|
|
10902
|
+
var handleYearSelect = useCallback(function (year) {
|
|
10903
|
+
setMonth(month.set('year', year));
|
|
10904
|
+
setActiveMonthValue(month.set('year', year));
|
|
10905
|
+
setYearSelectOpen(false);
|
|
10906
|
+
setMonthSelectOpen(true);
|
|
10907
|
+
}, [month]);
|
|
10908
|
+
var handleMonthSelect = useCallback(function (m) {
|
|
10909
|
+
setMonth(month.set('month', m));
|
|
10910
|
+
setActiveMonthValue(month.set('month', m));
|
|
10911
|
+
setMonthSelectOpen(false);
|
|
10912
|
+
}, [month]);
|
|
10913
|
+
var handleRenderDay = useCallback(function (props) {
|
|
10914
|
+
return React__default.createElement(PickersDay, __assign$7({}, props, { selected: props.day.isSame(value, 'date') }));
|
|
10915
|
+
}, [value]);
|
|
10916
|
+
// Commands --------------------------------------------------------------------------------------------------------
|
|
10917
|
+
useLayoutEffect(function () {
|
|
10918
|
+
if (ref) {
|
|
10919
|
+
var commands = {
|
|
10920
|
+
timeSelectScrollToDate: timeSelectScrollToDate,
|
|
10921
|
+
};
|
|
10922
|
+
if (typeof ref === 'function') {
|
|
10923
|
+
ref(commands);
|
|
10924
|
+
}
|
|
10925
|
+
else {
|
|
10926
|
+
ref.current = commands;
|
|
10927
|
+
}
|
|
10928
|
+
return function () {
|
|
10929
|
+
if (typeof ref === 'function') {
|
|
10930
|
+
ref(null);
|
|
10931
|
+
}
|
|
10932
|
+
else {
|
|
10933
|
+
ref.current = null;
|
|
10934
|
+
}
|
|
10935
|
+
};
|
|
10936
|
+
}
|
|
10937
|
+
}, [ref, timeSelectScrollToDate]);
|
|
10938
|
+
// Render - Function -----------------------------------------------------------------------------------------------
|
|
10939
|
+
var getActionButton = useCallback(function (date, label) {
|
|
10940
|
+
var disabled = !isDateAvailable(date, availableDate, 'day');
|
|
10941
|
+
return (React__default.createElement(Button, { variant: 'text', className: disabled ? 'disabled' : undefined, disabled: disabled, onClick: function () {
|
|
10942
|
+
var finalDate = date;
|
|
10943
|
+
var checkResult = checkDateAvailable(finalDate, availableDate, type, time);
|
|
10944
|
+
if (checkResult !== 'available') {
|
|
10945
|
+
var availableDateDate = getAvailableDate(availableDate, type, time);
|
|
10946
|
+
if (checkResult === 'min') {
|
|
10947
|
+
if (availableDateDate[0])
|
|
10948
|
+
finalDate = availableDateDate[0];
|
|
10949
|
+
}
|
|
10950
|
+
else if (checkResult === 'max') {
|
|
10951
|
+
if (availableDateDate[1])
|
|
10952
|
+
finalDate = availableDateDate[1];
|
|
10953
|
+
}
|
|
10954
|
+
}
|
|
10955
|
+
onChange('action_date', finalDate);
|
|
10956
|
+
} }, label));
|
|
10957
|
+
}, [type, time, onChange, availableDate]);
|
|
10958
|
+
// Render ----------------------------------------------------------------------------------------------------------
|
|
10959
|
+
return (React__default.createElement(Grid, { container: true, className: classNames$1('PrivateStaticDateTimePicker', type) },
|
|
10960
|
+
type !== 'time' && (React__default.createElement(Grid, { item: true },
|
|
10961
|
+
React__default.createElement(Grid, { container: true, direction: 'column' },
|
|
10962
|
+
React__default.createElement(Grid, { item: true, sx: { p: 2, width: '100%' } },
|
|
10963
|
+
React__default.createElement(Grid, { container: true, className: 'month-change-arrow-wrap' },
|
|
10964
|
+
React__default.createElement(Grid, { item: true, flex: 1, className: 'month-title-container' },
|
|
10965
|
+
React__default.createElement("div", { className: 'month-title-wrap' },
|
|
10966
|
+
React__default.createElement("div", { className: 'month-title' },
|
|
10967
|
+
React__default.createElement(Button, { variant: 'text', className: yearSelectOpen ? 'active' : undefined, onClick: function () {
|
|
10968
|
+
if (yearSelectOpen) {
|
|
10969
|
+
setYearSelectOpen(false);
|
|
10970
|
+
}
|
|
10971
|
+
else {
|
|
10972
|
+
setYearSelectOpen(true);
|
|
10973
|
+
setMonthSelectOpen(false);
|
|
10974
|
+
}
|
|
10975
|
+
} },
|
|
10976
|
+
month.format('YYYY년'),
|
|
10977
|
+
React__default.createElement(Icon$1, null, yearSelectOpen ? 'arrow_drop_up' : 'arrow_drop_down'))),
|
|
10978
|
+
React__default.createElement("div", { className: 'month-title' },
|
|
10979
|
+
React__default.createElement(Button, { variant: 'text', className: monthSelectOpen ? 'active' : undefined, onClick: function () {
|
|
10980
|
+
if (monthSelectOpen) {
|
|
10981
|
+
setMonthSelectOpen(false);
|
|
10982
|
+
}
|
|
10983
|
+
else {
|
|
10984
|
+
setMonthSelectOpen(true);
|
|
10985
|
+
setYearSelectOpen(false);
|
|
10986
|
+
}
|
|
10987
|
+
} },
|
|
10988
|
+
month.format('M월'),
|
|
10989
|
+
React__default.createElement(Icon$1, null, monthSelectOpen ? 'arrow_drop_up' : 'arrow_drop_down'))))),
|
|
10990
|
+
!yearSelectOpen && !monthSelectOpen && (React__default.createElement(Grid, { item: true, style: { textAlign: 'right' } },
|
|
10991
|
+
React__default.createElement(IconButton, { onClick: previousMonth, sx: { mr: 1 } },
|
|
10992
|
+
React__default.createElement(Icon$1, null, "keyboard_arrow_left")),
|
|
10993
|
+
React__default.createElement(IconButton, { onClick: nextMonth },
|
|
10994
|
+
React__default.createElement(Icon$1, null, "keyboard_arrow_right")))))),
|
|
10995
|
+
React__default.createElement(Grid, { item: true, style: { position: 'relative' } },
|
|
10996
|
+
React__default.createElement(StaticDateTimePicker, __assign$7({}, props, { value: activeMonthValue, defaultCalendarMonth: month, slots: {
|
|
10997
|
+
previousIconButton: LeftArrowButton,
|
|
10998
|
+
nextIconButton: RightArrowButton,
|
|
10999
|
+
day: handleRenderDay,
|
|
11000
|
+
}, viewRenderers: { hours: null, minutes: null, seconds: null }, minDate: minDate, maxDate: maxDate, disablePast: disablePast, disableFuture: disableFuture, displayStaticWrapperAs: 'desktop', onChange: function (newValue) {
|
|
11001
|
+
var finalValue = newValue
|
|
11002
|
+
? value
|
|
11003
|
+
? newValue.set('hour', value.hour()).set('minute', value.minute()).set('second', value.second())
|
|
11004
|
+
: newValue
|
|
11005
|
+
: newValue;
|
|
11006
|
+
onChange('date', finalValue);
|
|
11007
|
+
}, onMonthChange: function (month) {
|
|
11008
|
+
setMonth(month);
|
|
11009
|
+
if (onMonthChange)
|
|
11010
|
+
onMonthChange(month);
|
|
11011
|
+
} })),
|
|
11012
|
+
yearSelectOpen && (React__default.createElement(PrivateYearSelect, { selectYear: value == null ? null : value.year(), activeYear: month.year(), availableDate: availableDate, onSelect: handleYearSelect })),
|
|
11013
|
+
monthSelectOpen && (React__default.createElement(PrivateMonthSelect, { year: month.year(), selectYear: value == null ? null : value.year(), selectMonth: value == null ? null : value.month(), activeMonth: month.month(), availableDate: availableDate, onSelect: handleMonthSelect }))),
|
|
11014
|
+
React__default.createElement(Grid, { item: true, className: 'action-buttons' },
|
|
11015
|
+
getActionButton(dayjs()
|
|
11016
|
+
.startOf('d')
|
|
11017
|
+
.subtract(1, 'month')
|
|
11018
|
+
.set('hour', value ? value.hour() : 0)
|
|
11019
|
+
.set('minute', value ? value.minute() : 0)
|
|
11020
|
+
.set('second', value ? value.second() : 0), '지난달'),
|
|
11021
|
+
getActionButton(dayjs()
|
|
11022
|
+
.startOf('d')
|
|
11023
|
+
.subtract(7, 'd')
|
|
11024
|
+
.set('hour', value ? value.hour() : 0)
|
|
11025
|
+
.set('minute', value ? value.minute() : 0)
|
|
11026
|
+
.set('second', value ? value.second() : 0), '지난주'),
|
|
11027
|
+
getActionButton(dayjs()
|
|
11028
|
+
.startOf('d')
|
|
11029
|
+
.subtract(1, 'd')
|
|
11030
|
+
.set('hour', value ? value.hour() : 0)
|
|
11031
|
+
.set('minute', value ? value.minute() : 0)
|
|
11032
|
+
.set('second', value ? value.second() : 0), '어제'),
|
|
11033
|
+
getActionButton(dayjs()
|
|
11034
|
+
.startOf('d')
|
|
11035
|
+
.set('hour', value ? value.hour() : 0)
|
|
11036
|
+
.set('minute', value ? value.minute() : 0)
|
|
11037
|
+
.set('second', value ? value.second() : 0), '오늘'))))),
|
|
11038
|
+
time && (React__default.createElement(Grid, { item: true, className: 'time' },
|
|
11039
|
+
React__default.createElement(Grid, { container: true, direction: 'column', className: 'time-container' },
|
|
11040
|
+
React__default.createElement(Grid, { item: true, className: 'time-title' },
|
|
11041
|
+
time === 'hour' && (value ? value.format('HH시') : '00시'),
|
|
11042
|
+
time === 'minute' && (value ? value.format('HH시 mm분') : '00시 00분'),
|
|
11043
|
+
time === 'second' && (value ? value.format('HH시 mm분 ss초') : '00시 00분 00초')),
|
|
11044
|
+
React__default.createElement(Grid, { item: true, className: 'time-select-wrap' },
|
|
11045
|
+
React__default.createElement(Grid, { container: true, style: { height: '100%' } },
|
|
11046
|
+
React__default.createElement(Grid, { item: true, style: { position: 'relative', width: type === 'time' ? 240 : 80 } },
|
|
11047
|
+
React__default.createElement(PrivateTimeSelect, { ref: hourSelectRef, value: value && value.hour(), unit: '\uC2DC', list: hours, disableList: disableHours, cols: type === 'time' ? 3 : 1, onSelect: function (newValue) {
|
|
11048
|
+
onChange('hour', value ? value.set('hour', newValue) : dayjs().startOf('date').set('hour', newValue));
|
|
11049
|
+
} })),
|
|
11050
|
+
(time === 'minute' || time === 'second') && (React__default.createElement(Grid, { item: true, style: { position: 'relative', width: type === 'time' ? 240 : 80 } },
|
|
11051
|
+
React__default.createElement(PrivateTimeSelect, { ref: minuteSelectRef, value: value && value.minute(), unit: '\uBD84', list: minutes, disableList: disableMinutes, cols: type === 'time' ? 3 : 1, listInterval: minuteInterval, onSelect: function (newValue) {
|
|
11052
|
+
onChange('minute', value ? value.set('minute', newValue) : dayjs().startOf('date').set('minute', newValue));
|
|
11053
|
+
} }))),
|
|
11054
|
+
time === 'second' && (React__default.createElement(Grid, { item: true, style: { position: 'relative', width: type === 'time' ? 240 : 80 } },
|
|
11055
|
+
React__default.createElement(PrivateTimeSelect, { ref: secondSelectRef, value: value && value.second(), unit: '\uCD08', list: seconds, disableList: disableSeconds, cols: type === 'time' ? 3 : 1, listInterval: secondInterval, onSelect: function (newValue) {
|
|
11056
|
+
onChange('second', value ? value.set('second', newValue) : dayjs().startOf('date').set('second', newValue));
|
|
11057
|
+
} }))))),
|
|
11058
|
+
onClose && (React__default.createElement(Grid, { item: true, className: 'action-buttons' },
|
|
11059
|
+
React__default.createElement(Button, { variant: 'text', onClick: onClose }, "\uB2EB\uAE30"))))))));
|
|
11060
|
+
});
|
|
11061
|
+
PrivateStaticDateTimePicker.displayName = 'PrivateStaticDateTimePicker';
|
|
11062
|
+
PrivateStaticDateTimePicker.defaultProps = PrivateStaticDateTimePickerDefaultProps;var PrivateDateTimePicker = React__default.forwardRef(function (_a, ref) {
|
|
11063
|
+
// ID --------------------------------------------------------------------------------------------------------------
|
|
11064
|
+
var initVariant = _a.variant, initSize = _a.size, initColor = _a.color, initFocused = _a.focused, initLabelShrink = _a.labelShrink, initFullWidth = _a.fullWidth,
|
|
11065
|
+
//--------------------------------------------------------------------------------------------------------------------
|
|
11066
|
+
name = _a.name, type = _a.type, time = _a.time, initValue = _a.value, initData = _a.data, initLabel = _a.label, labelIcon = _a.labelIcon, initFormat = _a.format, initFormValueFormat = _a.formValueFormat, required = _a.required, readOnly = _a.readOnly, initDisabled = _a.disabled, width = _a.width, initError = _a.error, initHelperText = _a.helperText, minDate = _a.minDate, maxDate = _a.maxDate, disableFuture = _a.disableFuture, disablePast = _a.disablePast, exceptValue = _a.exceptValue, icon = _a.icon, startAdornment = _a.startAdornment, endAdornment = _a.endAdornment, align = _a.align, hours = _a.hours, minutes = _a.minutes, seconds = _a.seconds, minuteInterval = _a.minuteInterval, secondInterval = _a.secondInterval, readOnlyInput = _a.readOnlyInput, hidden = _a.hidden, onChange = _a.onChange, onValidate = _a.onValidate,
|
|
11067
|
+
//--------------------------------------------------------------------------------------------------------------------
|
|
11068
|
+
className = _a.className, initStyle = _a.style, sx = _a.sx, otherProps = __rest$4(_a, ["variant", "size", "color", "focused", "labelShrink", "fullWidth", "name", "type", "time", "value", "data", "label", "labelIcon", "format", "formValueFormat", "required", "readOnly", "disabled", "width", "error", "helperText", "minDate", "maxDate", "disableFuture", "disablePast", "exceptValue", "icon", "startAdornment", "endAdornment", "align", "hours", "minutes", "seconds", "minuteInterval", "secondInterval", "readOnlyInput", "hidden", "onChange", "onValidate", "className", "style", "sx"]);
|
|
11069
|
+
var id = useId();
|
|
11070
|
+
// Ref -------------------------------------------------------------------------------------------------------------
|
|
11071
|
+
var privateStaticDateTimePickerRef = useRef(null);
|
|
11072
|
+
var textFieldInputRef = useRef();
|
|
11073
|
+
var closeTimeoutRef = useRef();
|
|
11074
|
+
var mouseDownTimeRef = useRef();
|
|
11075
|
+
var datePickerErrorRef = useRef(null);
|
|
11076
|
+
var openValueRef = useRef(null);
|
|
11077
|
+
// FormState -------------------------------------------------------------------------------------------------------
|
|
11078
|
+
var _b = useFormState(), formVariant = _b.variant, formSize = _b.size, formColor = _b.color, formFocused = _b.focused, formLabelShrink = _b.labelShrink, formFullWidth = _b.fullWidth, formColWithHelperText = _b.formColWithHelperText, onAddValueItem = _b.onAddValueItem, onRemoveValueItem = _b.onRemoveValueItem, onValueChange = _b.onValueChange, onValueChangeByUser = _b.onValueChangeByUser, onRequestSearchSubmit = _b.onRequestSearchSubmit;
|
|
11079
|
+
// Memo - FormState ------------------------------------------------------------------------------------------------
|
|
11080
|
+
var variant = useMemo(function () { return (initVariant == null ? formVariant : initVariant); }, [initVariant, formVariant]);
|
|
11081
|
+
var size = useMemo(function () { return (initSize == null ? formSize : initSize); }, [initSize, formSize]);
|
|
11082
|
+
var color = useMemo(function () { return (initColor == null ? formColor : initColor); }, [initColor, formColor]);
|
|
11083
|
+
var focused = useMemo(function () { return (initFocused == null ? formFocused : initFocused); }, [initFocused, formFocused]);
|
|
11084
|
+
var labelShrink = useMemo(function () { return (initLabelShrink == null ? formLabelShrink : initLabelShrink); }, [initLabelShrink, formLabelShrink]);
|
|
11085
|
+
var fullWidth = useMemo(function () { return (initFullWidth == null ? formFullWidth : initFullWidth); }, [initFullWidth, formFullWidth]);
|
|
11086
|
+
// State - open ----------------------------------------------------------------------------------------------------
|
|
11087
|
+
var _c = useState(false), open = _c[0], setOpen = _c[1];
|
|
11088
|
+
// State -----------------------------------------------------------------------------------------------------------
|
|
11089
|
+
var _d = useAutoUpdateState$1(initError), error = _d[0], setError = _d[1];
|
|
11090
|
+
var _e = useState(null), timeError = _e[0], setTimeError = _e[1];
|
|
11091
|
+
var _f = useAutoUpdateState$1(initHelperText), helperText = _f[0], setHelperText = _f[1];
|
|
11092
|
+
var _g = useAutoUpdateState$1(initDisabled), disabled = _g[0], setDisabled = _g[1];
|
|
11093
|
+
var _h = useAutoUpdateState$1(initData), data = _h[0], setData = _h[1];
|
|
11094
|
+
// Memo --------------------------------------------------------------------------------------------------------------
|
|
11095
|
+
var label = useMemo(function () {
|
|
11096
|
+
if (labelIcon) {
|
|
11097
|
+
return React__default.createElement(IconText, { icon: labelIcon }, initLabel);
|
|
11098
|
+
}
|
|
11099
|
+
else {
|
|
11100
|
+
return initLabel;
|
|
11101
|
+
}
|
|
11102
|
+
}, [initLabel, labelIcon]);
|
|
11103
|
+
var format = useMemo(function () {
|
|
11104
|
+
if (initFormat) {
|
|
11105
|
+
return initFormat;
|
|
11106
|
+
}
|
|
11107
|
+
else {
|
|
11108
|
+
return getDateTimeFormat(type, time);
|
|
11109
|
+
}
|
|
11110
|
+
}, [initFormat, time, type]);
|
|
11111
|
+
var formValueFormat = useMemo(function () {
|
|
11112
|
+
if (initFormValueFormat) {
|
|
11113
|
+
return initFormValueFormat;
|
|
11114
|
+
}
|
|
11115
|
+
else {
|
|
11116
|
+
return getDateTimeFormValueFormat(type, time);
|
|
11117
|
+
}
|
|
11118
|
+
}, [initFormValueFormat, time, type]);
|
|
11119
|
+
var availableDate = useMemo(function () { return makeAvailableDate(minDate, maxDate, !!disablePast, !!disableFuture); }, [disableFuture, disablePast, maxDate, minDate]);
|
|
11120
|
+
// State - style ---------------------------------------------------------------------------------------------------
|
|
11121
|
+
var style = useAutoUpdateState$1(useCallback(function () {
|
|
11122
|
+
if (width != null) {
|
|
11123
|
+
return __assign$7(__assign$7({}, initStyle), { width: width });
|
|
11124
|
+
}
|
|
11125
|
+
else {
|
|
11126
|
+
return initStyle;
|
|
11127
|
+
}
|
|
11128
|
+
}, [initStyle, width]))[0];
|
|
11129
|
+
// Function - getFinalValue ----------------------------------------------------------------------------------------
|
|
11130
|
+
var getFinalValue = useCallback(function (value) {
|
|
11131
|
+
return value;
|
|
11132
|
+
}, []);
|
|
11133
|
+
// State - value ---------------------------------------------------------------------------------------------------
|
|
11134
|
+
var _j = useAutoUpdateState$1(initValue || null, getFinalValue), value = _j[0], setValue = _j[1];
|
|
11135
|
+
var _k = useState(null), inputValue = _k[0], setInputValue = _k[1];
|
|
11136
|
+
// Effect ----------------------------------------------------------------------------------------------------------
|
|
11137
|
+
useEffect(function () {
|
|
11138
|
+
if (value !== initValue) {
|
|
11139
|
+
if (onChange)
|
|
11140
|
+
onChange(value);
|
|
11141
|
+
onValueChange(name, value);
|
|
11142
|
+
}
|
|
11143
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
11144
|
+
}, []);
|
|
11145
|
+
useFirstSkipEffect$1(function () {
|
|
11146
|
+
if (error)
|
|
11147
|
+
validate(value);
|
|
11148
|
+
if (onChange)
|
|
11149
|
+
onChange(value);
|
|
11150
|
+
onValueChange(name, value);
|
|
11151
|
+
}, [value]);
|
|
11152
|
+
useEffect(function () {
|
|
11153
|
+
setInputValue(value);
|
|
11154
|
+
}, [value]);
|
|
11155
|
+
useFirstSkipEffect$1(function () {
|
|
11156
|
+
if (error && !timeError)
|
|
11157
|
+
validate(value);
|
|
11158
|
+
}, [timeError]);
|
|
11159
|
+
useFirstSkipEffect$1(function () {
|
|
11160
|
+
if (open) {
|
|
11161
|
+
openValueRef.current = value;
|
|
11162
|
+
}
|
|
11163
|
+
else {
|
|
11164
|
+
if (openValueRef.current !== value) {
|
|
11165
|
+
var runOnRequestSearchSubmit = void 0;
|
|
11166
|
+
if (openValueRef.current && value) {
|
|
11167
|
+
runOnRequestSearchSubmit = !openValueRef.current.isSame(value, 'second');
|
|
11168
|
+
}
|
|
11169
|
+
else {
|
|
11170
|
+
runOnRequestSearchSubmit = true;
|
|
11171
|
+
}
|
|
11172
|
+
if (runOnRequestSearchSubmit) {
|
|
11173
|
+
onRequestSearchSubmit(name, value);
|
|
11174
|
+
}
|
|
11175
|
+
}
|
|
11176
|
+
}
|
|
11177
|
+
}, [open]);
|
|
11178
|
+
useEffect(function () {
|
|
11179
|
+
if (type !== 'time' && time && value && (availableDate[0] || availableDate[1])) {
|
|
11180
|
+
var availableDateVal = getAvailableDateVal(availableDate, type, time);
|
|
11181
|
+
var valueVal = getDateValForAvailableDate(value, type, time);
|
|
11182
|
+
var timeError_1 = null;
|
|
11183
|
+
if (availableDateVal[0] && valueVal < availableDateVal[0]) {
|
|
11184
|
+
timeError_1 = 'minDate';
|
|
11185
|
+
}
|
|
11186
|
+
if (timeError_1 == null && availableDateVal[1] && valueVal > availableDateVal[1]) {
|
|
11187
|
+
timeError_1 = 'maxDate';
|
|
11188
|
+
}
|
|
11189
|
+
setTimeError(timeError_1);
|
|
11190
|
+
}
|
|
11191
|
+
else {
|
|
11192
|
+
setTimeError(null);
|
|
11193
|
+
}
|
|
11194
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
11195
|
+
}, [value]);
|
|
11196
|
+
// Memo --------------------------------------------------------------------------------------------------------------
|
|
11197
|
+
var wrapStyle = useMemo(function () { return ({
|
|
11198
|
+
display: hidden ? 'none' : fullWidth ? 'block' : 'inline-block',
|
|
11199
|
+
flex: fullWidth ? 1 : undefined,
|
|
11200
|
+
}); }, [hidden, fullWidth]);
|
|
11201
|
+
// Function - focus ------------------------------------------------------------------------------------------------
|
|
11202
|
+
var focus = useCallback(function () {
|
|
11203
|
+
var _a;
|
|
11204
|
+
(_a = textFieldInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
11205
|
+
}, [textFieldInputRef]);
|
|
11206
|
+
// Function - setErrorHelperText -----------------------------------------------------------------------------------
|
|
11207
|
+
var setErrorHelperText = useCallback(function (error, helperText) {
|
|
11208
|
+
setError(error);
|
|
11209
|
+
setHelperText(helperText);
|
|
11210
|
+
}, [setError, setHelperText]);
|
|
11211
|
+
// Function - validate ---------------------------------------------------------------------------------------------
|
|
11212
|
+
var validate = useCallback(function (value) {
|
|
11213
|
+
if (required && empty(value)) {
|
|
11214
|
+
setErrorHelperText(true, '필수 입력 항목입니다.');
|
|
11215
|
+
return false;
|
|
11216
|
+
}
|
|
11217
|
+
if (value && !value.isValid()) {
|
|
11218
|
+
setErrorHelperText(true, '형식이 일치하지 않습니다.');
|
|
11219
|
+
return false;
|
|
11220
|
+
}
|
|
11221
|
+
if (datePickerErrorRef.current) {
|
|
11222
|
+
setErrorHelperText(true, getDateValidationErrorText(datePickerErrorRef.current));
|
|
11223
|
+
return false;
|
|
11224
|
+
}
|
|
11225
|
+
if (timeError) {
|
|
11226
|
+
setErrorHelperText(true, getDateValidationErrorText(timeError));
|
|
11227
|
+
return false;
|
|
11228
|
+
}
|
|
11229
|
+
if (onValidate) {
|
|
11230
|
+
var onValidateResult = onValidate(value);
|
|
11231
|
+
if (onValidateResult != null && onValidateResult !== true) {
|
|
11232
|
+
setErrorHelperText(true, onValidateResult);
|
|
11233
|
+
return false;
|
|
11234
|
+
}
|
|
11235
|
+
}
|
|
11236
|
+
setErrorHelperText(false, initHelperText);
|
|
11237
|
+
return true;
|
|
11238
|
+
}, [required, timeError, onValidate, setErrorHelperText, initHelperText]);
|
|
11239
|
+
// Commands --------------------------------------------------------------------------------------------------------
|
|
11240
|
+
useLayoutEffect(function () {
|
|
11241
|
+
if (ref || onAddValueItem) {
|
|
11242
|
+
var lastValue_1 = value;
|
|
11243
|
+
var lastData_1 = data;
|
|
11244
|
+
var lastDisabled_1 = !!disabled;
|
|
11245
|
+
var commands = {
|
|
11246
|
+
getType: function () { return 'default'; },
|
|
11247
|
+
getName: function () { return name; },
|
|
11248
|
+
getReset: function () { return getFinalValue(initValue || null); },
|
|
11249
|
+
reset: function () {
|
|
11250
|
+
lastValue_1 = getFinalValue(initValue || null);
|
|
11251
|
+
setValue(lastValue_1);
|
|
11252
|
+
},
|
|
11253
|
+
getValue: function () { return lastValue_1; },
|
|
11254
|
+
setValue: function (value) {
|
|
11255
|
+
lastValue_1 = getFinalValue(value);
|
|
11256
|
+
setValue(lastValue_1);
|
|
11257
|
+
},
|
|
11258
|
+
getData: function () { return lastData_1; },
|
|
11259
|
+
setData: function (data) {
|
|
11260
|
+
lastData_1 = data;
|
|
11261
|
+
setData(data);
|
|
11262
|
+
},
|
|
11263
|
+
isExceptValue: function () { return !!exceptValue; },
|
|
11264
|
+
isDisabled: function () { return lastDisabled_1; },
|
|
11265
|
+
setDisabled: function (disabled) {
|
|
11266
|
+
lastDisabled_1 = disabled;
|
|
11267
|
+
setDisabled(disabled);
|
|
11268
|
+
},
|
|
11269
|
+
focus: focus,
|
|
11270
|
+
focusValidate: focus,
|
|
11271
|
+
validate: function () { return validate(value); },
|
|
11272
|
+
setError: function (error, errorText) {
|
|
11273
|
+
return setErrorHelperText(error, error ? errorText : initHelperText);
|
|
11274
|
+
},
|
|
11275
|
+
getFormValueFormat: function () { return formValueFormat; },
|
|
11276
|
+
};
|
|
11277
|
+
if (ref) {
|
|
11278
|
+
if (typeof ref === 'function') {
|
|
11279
|
+
ref(commands);
|
|
11280
|
+
}
|
|
11281
|
+
else {
|
|
11282
|
+
ref.current = commands;
|
|
11283
|
+
}
|
|
11284
|
+
}
|
|
11285
|
+
if (onAddValueItem)
|
|
11286
|
+
onAddValueItem(id, commands);
|
|
11287
|
+
return function () {
|
|
11288
|
+
if (ref) {
|
|
11289
|
+
if (typeof ref === 'function') {
|
|
11290
|
+
ref(null);
|
|
11291
|
+
}
|
|
11292
|
+
else {
|
|
11293
|
+
ref.current = null;
|
|
11294
|
+
}
|
|
11295
|
+
}
|
|
11296
|
+
if (onRemoveValueItem)
|
|
11297
|
+
onRemoveValueItem(id);
|
|
11298
|
+
};
|
|
11299
|
+
}
|
|
11300
|
+
}, [
|
|
11301
|
+
name,
|
|
11302
|
+
initValue,
|
|
11303
|
+
value,
|
|
11304
|
+
getFinalValue,
|
|
11305
|
+
exceptValue,
|
|
11306
|
+
disabled,
|
|
11307
|
+
focus,
|
|
11308
|
+
validate,
|
|
11309
|
+
formValueFormat,
|
|
11310
|
+
ref,
|
|
11311
|
+
onAddValueItem,
|
|
11312
|
+
onRemoveValueItem,
|
|
11313
|
+
id,
|
|
11314
|
+
setValue,
|
|
11315
|
+
setDisabled,
|
|
11316
|
+
setErrorHelperText,
|
|
11317
|
+
initHelperText,
|
|
11318
|
+
data,
|
|
11319
|
+
setData,
|
|
11320
|
+
]);
|
|
11321
|
+
// Event Handler ---------------------------------------------------------------------------------------------------
|
|
11322
|
+
var handleChange = useCallback(function (unit, newValue, keyboardInputValue) {
|
|
11323
|
+
var _a, _b, _c;
|
|
11324
|
+
var updateValue = true;
|
|
11325
|
+
if (notEmpty(keyboardInputValue)) {
|
|
11326
|
+
if (newValue) {
|
|
11327
|
+
if (!newValue.isValid()) {
|
|
11328
|
+
updateValue = false;
|
|
11329
|
+
}
|
|
11330
|
+
}
|
|
11331
|
+
}
|
|
11332
|
+
var finalValue = newValue;
|
|
11333
|
+
if (updateValue) {
|
|
11334
|
+
if (type !== 'time' && finalValue != null && keyboardInputValue == null) {
|
|
11335
|
+
var checkResult = checkDateAvailable(finalValue, availableDate, type, time);
|
|
11336
|
+
if (checkResult !== 'available') {
|
|
11337
|
+
var availableDateDate = getAvailableDate(availableDate, type, time);
|
|
11338
|
+
if (checkResult === 'min') {
|
|
11339
|
+
if (availableDateDate[0])
|
|
11340
|
+
finalValue = availableDateDate[0];
|
|
11341
|
+
}
|
|
11342
|
+
else if (checkResult === 'max') {
|
|
11343
|
+
if (availableDateDate[1])
|
|
11344
|
+
finalValue = availableDateDate[1];
|
|
11345
|
+
}
|
|
11346
|
+
}
|
|
11347
|
+
}
|
|
11348
|
+
var runOnRequestSearchSubmit_1 = false;
|
|
11349
|
+
if (notEmpty(keyboardInputValue)) {
|
|
11350
|
+
if (!time || unit !== 'action_date') {
|
|
11351
|
+
runOnRequestSearchSubmit_1 = !open; // 팝업창 열리지 않은 상태에서 날짜 키보드로 변경
|
|
11352
|
+
setOpen(false);
|
|
11353
|
+
}
|
|
11354
|
+
}
|
|
11355
|
+
else if (time) {
|
|
11356
|
+
if (time === unit)
|
|
11357
|
+
setOpen(false);
|
|
11358
|
+
}
|
|
11359
|
+
setValue(finalValue);
|
|
11360
|
+
nextTick(function () {
|
|
11361
|
+
onValueChangeByUser(name, finalValue);
|
|
11362
|
+
if (runOnRequestSearchSubmit_1) {
|
|
11363
|
+
onRequestSearchSubmit(name, finalValue);
|
|
11364
|
+
}
|
|
11365
|
+
});
|
|
11366
|
+
if (time) {
|
|
11367
|
+
if (finalValue) {
|
|
11368
|
+
switch (unit) {
|
|
11369
|
+
case 'date':
|
|
11370
|
+
case 'action_date':
|
|
11371
|
+
(_a = privateStaticDateTimePickerRef.current) === null || _a === void 0 ? void 0 : _a.timeSelectScrollToDate(finalValue);
|
|
11372
|
+
break;
|
|
11373
|
+
case 'hour':
|
|
11374
|
+
(_b = privateStaticDateTimePickerRef.current) === null || _b === void 0 ? void 0 : _b.timeSelectScrollToDate(finalValue, ['minute', 'second']);
|
|
11375
|
+
break;
|
|
11376
|
+
case 'minute':
|
|
11377
|
+
(_c = privateStaticDateTimePickerRef.current) === null || _c === void 0 ? void 0 : _c.timeSelectScrollToDate(finalValue, ['second']);
|
|
11378
|
+
break;
|
|
11379
|
+
}
|
|
11380
|
+
}
|
|
11381
|
+
}
|
|
11382
|
+
}
|
|
11383
|
+
setInputValue(finalValue);
|
|
11384
|
+
}, [type, time, setValue, availableDate, open, onValueChangeByUser, name, onRequestSearchSubmit]);
|
|
11385
|
+
var handleContainerFocus = useCallback(function () {
|
|
11386
|
+
if (closeTimeoutRef.current) {
|
|
11387
|
+
clearTimeout(closeTimeoutRef.current);
|
|
11388
|
+
closeTimeoutRef.current = undefined;
|
|
11389
|
+
}
|
|
11390
|
+
}, []);
|
|
11391
|
+
var handleContainerBlur = useCallback(function () {
|
|
11392
|
+
if (closeTimeoutRef.current) {
|
|
11393
|
+
clearTimeout(closeTimeoutRef.current);
|
|
11394
|
+
closeTimeoutRef.current = undefined;
|
|
11395
|
+
}
|
|
11396
|
+
if (!mouseDownTimeRef.current || new Date().getTime() - mouseDownTimeRef.current > 100) {
|
|
11397
|
+
closeTimeoutRef.current = setTimeout(function () {
|
|
11398
|
+
closeTimeoutRef.current = undefined;
|
|
11399
|
+
setOpen(false);
|
|
11400
|
+
}, 10);
|
|
11401
|
+
}
|
|
11402
|
+
}, []);
|
|
11403
|
+
var handleContainerMouseDown = useCallback(function () {
|
|
11404
|
+
if (closeTimeoutRef.current) {
|
|
11405
|
+
clearTimeout(closeTimeoutRef.current);
|
|
11406
|
+
closeTimeoutRef.current = undefined;
|
|
11407
|
+
}
|
|
11408
|
+
mouseDownTimeRef.current = new Date().getTime();
|
|
11409
|
+
}, []);
|
|
11410
|
+
// Memo --------------------------------------------------------------------------------------------------------------
|
|
11411
|
+
var slotProps = useMemo(function () {
|
|
11412
|
+
var textFieldInputLabelProps = {};
|
|
11413
|
+
if (labelShrink) {
|
|
11414
|
+
textFieldInputLabelProps.shrink = labelShrink;
|
|
11415
|
+
}
|
|
11416
|
+
var readOnly = readOnlyInput;
|
|
11417
|
+
var inputProps = {
|
|
11418
|
+
readOnly: readOnly,
|
|
11419
|
+
};
|
|
11420
|
+
if (readOnly) {
|
|
11421
|
+
inputProps.tabIndex = -1;
|
|
11422
|
+
inputProps.className = classNames$1(inputProps.className, 'Mui-disabled');
|
|
11423
|
+
}
|
|
11424
|
+
var muiInputProps = { endAdornment: undefined };
|
|
11425
|
+
if (startAdornment || icon || muiInputProps.startAdornment) {
|
|
11426
|
+
muiInputProps.startAdornment = (React__default.createElement(React__default.Fragment, null,
|
|
11427
|
+
icon && (React__default.createElement(InputAdornment, { position: 'start' },
|
|
11428
|
+
React__default.createElement(FormIcon, { fontSize: 'small' }, icon))),
|
|
11429
|
+
startAdornment && React__default.createElement(InputAdornment, { position: 'start' }, startAdornment),
|
|
11430
|
+
muiInputProps.startAdornment));
|
|
11431
|
+
}
|
|
11432
|
+
if (endAdornment) {
|
|
11433
|
+
muiInputProps.endAdornment = (React__default.createElement(React__default.Fragment, null, endAdornment && React__default.createElement(InputAdornment, { position: 'end' }, endAdornment)));
|
|
11434
|
+
}
|
|
11435
|
+
return {
|
|
11436
|
+
textField: {
|
|
11437
|
+
className: classNames$1('input-text-field', "align-".concat(align)),
|
|
11438
|
+
inputRef: function (ref) {
|
|
11439
|
+
textFieldInputRef.current = ref;
|
|
11440
|
+
},
|
|
11441
|
+
variant: variant,
|
|
11442
|
+
size: size,
|
|
11443
|
+
color: color,
|
|
11444
|
+
focused: focused,
|
|
11445
|
+
InputLabelProps: textFieldInputLabelProps,
|
|
11446
|
+
InputProps: muiInputProps,
|
|
11447
|
+
inputProps: inputProps,
|
|
11448
|
+
required: required,
|
|
11449
|
+
fullWidth: fullWidth,
|
|
11450
|
+
helperText: undefined,
|
|
11451
|
+
error: !!error || !!timeError,
|
|
11452
|
+
style: style,
|
|
11453
|
+
sx: sx,
|
|
11454
|
+
onFocus: function () {
|
|
11455
|
+
setOpen(true);
|
|
11456
|
+
},
|
|
11457
|
+
onClick: function () {
|
|
11458
|
+
setOpen(true);
|
|
11459
|
+
},
|
|
11460
|
+
},
|
|
11461
|
+
};
|
|
11462
|
+
}, [
|
|
11463
|
+
align,
|
|
11464
|
+
color,
|
|
11465
|
+
endAdornment,
|
|
11466
|
+
error,
|
|
11467
|
+
focused,
|
|
11468
|
+
fullWidth,
|
|
11469
|
+
icon,
|
|
11470
|
+
labelShrink,
|
|
11471
|
+
readOnlyInput,
|
|
11472
|
+
required,
|
|
11473
|
+
size,
|
|
11474
|
+
startAdornment,
|
|
11475
|
+
style,
|
|
11476
|
+
sx,
|
|
11477
|
+
timeError,
|
|
11478
|
+
variant,
|
|
11479
|
+
]);
|
|
11480
|
+
// Render ----------------------------------------------------------------------------------------------------------
|
|
11481
|
+
return (React__default.createElement(LocalizationProvider, { dateAdapter: AdapterDayjs },
|
|
11482
|
+
React__default.createElement(ClickAwayListener, { mouseEvent: 'onMouseDown', touchEvent: 'onTouchStart', onClickAway: function () { return setOpen(false); } },
|
|
11483
|
+
React__default.createElement("div", { className: classNames$1(className, 'PrivateDateTimePicker'), style: wrapStyle, onMouseDown: handleContainerMouseDown, onFocus: handleContainerFocus, onBlur: handleContainerBlur },
|
|
11484
|
+
React__default.createElement(PrivateStyledTooltip, { open: disabled || readOnly ? false : open, PopperProps: {
|
|
11485
|
+
modifiers: [
|
|
11486
|
+
{
|
|
11487
|
+
name: 'offset',
|
|
11488
|
+
options: {
|
|
11489
|
+
offset: [0, error && helperText ? 8 : -14],
|
|
11490
|
+
},
|
|
11491
|
+
},
|
|
11492
|
+
],
|
|
11493
|
+
}, title: React__default.createElement(PrivateStaticDateTimePicker, __assign$7({}, otherProps, { ref: privateStaticDateTimePickerRef, type: type, time: time, value: value, availableDate: availableDate, minDate: minDate, maxDate: maxDate, disablePast: disablePast, disableFuture: disableFuture, hours: hours, minutes: minutes, seconds: seconds, minuteInterval: minuteInterval, secondInterval: secondInterval, onChange: handleChange, onAccept: function () { return !time && setOpen(false); }, onClose: function () { return setOpen(false); } })) },
|
|
11494
|
+
React__default.createElement("div", { style: { display: fullWidth ? 'block' : 'inline-block' } },
|
|
11495
|
+
React__default.createElement(DesktopDateTimePicker, __assign$7({ value: inputValue, label: label, open: false, format: format, disabled: disabled, readOnly: readOnly, minDate: minDate, maxDate: maxDate, disablePast: disablePast, disableFuture: disableFuture, onClose: function () { return setOpen(false); }, onError: function (reason) { return (datePickerErrorRef.current = reason); }, onChange: function (newValue) { return handleChange('date', newValue); }, slotProps: slotProps }, otherProps)))),
|
|
11496
|
+
!formColWithHelperText && helperText && (React__default.createElement(FormHelperText, { error: error, style: { marginLeft: variant === 'standard' ? 0 : 14 } }, helperText))))));
|
|
11497
|
+
});
|
|
11498
|
+
PrivateDateTimePicker.displayName = 'PrivateDateTimePicker';
|
|
11499
|
+
PrivateDateTimePicker.defaultProps = PrivateDateTimePickerDefaultProps;var PrivateAlertDialogDefaultProps = {
|
|
10808
11500
|
color: 'primary',
|
|
10809
11501
|
};var PrivateAlertDialog = function (_a) {
|
|
10810
11502
|
var color = _a.color, open = _a.open, title = _a.title, content = _a.content, onClose = _a.onClose;
|
|
@@ -10843,7 +11535,7 @@ FormDatePicker.defaultProps = FormDatePickerDefaultProps;var FormDateTimePickerD
|
|
|
10843
11535
|
}, [onAddValueItem]);
|
|
10844
11536
|
// Render ----------------------------------------------------------------------------------------------------------
|
|
10845
11537
|
return (React__default.createElement(FormContextProvider, { value: __assign$7({ onAddValueItem: handleAddValueItem }, otherFormState) },
|
|
10846
|
-
React__default.createElement(
|
|
11538
|
+
React__default.createElement(PrivateDateTimePicker, __assign$7({ className: classNames$1(className, 'FormDateTimePicker') }, props, { ref: ref, type: 'date_time' }))));
|
|
10847
11539
|
});
|
|
10848
11540
|
FormDateTimePicker.displayName = 'FormDateTimePicker';
|
|
10849
11541
|
FormDateTimePicker.defaultProps = FormDateTimePickerDefaultProps;var FormTimePickerDefaultProps = {};var FormTimePicker = React__default.forwardRef(function (_a, ref) {
|
|
@@ -10857,7 +11549,7 @@ FormDateTimePicker.defaultProps = FormDateTimePickerDefaultProps;var FormTimePic
|
|
|
10857
11549
|
}, [onAddValueItem]);
|
|
10858
11550
|
// Render ----------------------------------------------------------------------------------------------------------
|
|
10859
11551
|
return (React__default.createElement(FormContextProvider, { value: __assign$7({ onAddValueItem: handleAddValueItem }, otherFormState) },
|
|
10860
|
-
React__default.createElement(
|
|
11552
|
+
React__default.createElement(PrivateDateTimePicker, __assign$7({ className: classNames$1(className, 'FormTimePicker') }, props, { ref: ref, type: 'time' }))));
|
|
10861
11553
|
});
|
|
10862
11554
|
FormTimePicker.displayName = 'FormTimePicker';
|
|
10863
11555
|
FormTimePicker.defaultProps = FormTimePickerDefaultProps;var FormDateRangePickerDefaultProps = {
|
|
@@ -11931,7 +12623,7 @@ var FormDateRangePicker = React__default.forwardRef(function (_a, ref) {
|
|
|
11931
12623
|
setData,
|
|
11932
12624
|
]);
|
|
11933
12625
|
// Render ----------------------------------------------------------------------------------------------------------
|
|
11934
|
-
return (React__default.createElement(LocalizationProvider, { dateAdapter: AdapterDayjs
|
|
12626
|
+
return (React__default.createElement(LocalizationProvider, { dateAdapter: AdapterDayjs },
|
|
11935
12627
|
React__default.createElement(ClickAwayListener, { mouseEvent: 'onMouseDown', touchEvent: 'onTouchStart', onClickAway: function () { return setOpen(false); } },
|
|
11936
12628
|
React__default.createElement("div", { className: classNames$1(className, 'FormDateRangePicker'), style: wrapStyle, onMouseDown: handleContainerMouseDown, onFocus: handleContainerFocus, onBlur: handleContainerBlur },
|
|
11937
12629
|
React__default.createElement(PrivateStyledTooltip, { open: open, PopperProps: {
|