@gsretail.com/gui-core/build/core/Date/GuiDateTimeRangePicker.js

A skeleton to create your own React component library using Rollup, TypeScript, Sass and Storybook

import{__rest as e,__assign as a}from"../../node_modules/tslib/tslib.es6.js";import t from"react";import{Box as i}from"@mui/material";import{AdapterDateFns as l}from"../../node_modules/@mui/x-date-pickers/AdapterDateFns/index.js";import m from"date-fns/locale/ko";import{GuiDateTimePicker as r}from"./GuiDateTimePicker.js";import n from"./GuiDateTimeRangePicker.styled.js";import{LocalizationProvider as o}from"../../node_modules/@mui/x-date-pickers/LocalizationProvider/LocalizationProvider.js";var d={ko:m},s=n((function(m){var n=m.label,s=m.labelWidth,u=m.labelTextAlign,p=m.required,c=m.variant,h=m.width,x=m.size,y=m.disabled,b=m.readOnly,f=m.ampm,g=m.minDate,v=m.maxDate,_=m.inputFormat,k=m.mask,D=m.helperText,E=m.delimiter,T=m.today,j=m.valueStart,w=m.onChangeStart,z=m.valueEnd,P=m.onChangeEnd,C=m.sx,F=m.className,N=m.boxProps,A=e(m,["label","labelWidth","labelTextAlign","required","variant","width","size","disabled","readOnly","ampm","minDate","maxDate","inputFormat","mask","helperText","delimiter","today","valueStart","onChangeStart","valueEnd","onChangeEnd","sx","className","boxProps"]),S=t.useState(null),O=S[0],W=S[1];return t.createElement(i,a({className:["gui-form gui-date-picker",y&&"gui-form-disabled",b&&"gui-form-readonly",F&&F].join(" "),width:h},N,{sx:C}),n&&t.createElement(i,{minWidth:s},t.createElement("label",{className:["gui-label",u&&"textAlign-"+u,p&&"Mui-required"].join(" ")},n)),t.createElement(i,{flexGrow:1,className:"gui-date-range"},t.createElement(o,{dateAdapter:l,locale:d.ko},t.createElement(r,{value:j,onChange:function(e,a){w(e,a),P(null,null),W(e)},variant:c,width:"50%",size:x,ampm:f,minDate:g,maxDate:v,inputFormat:_,mask:k,helperText:D,today:T,disabled:y,readOnly:b}),"static"===c?null:t.createElement(i,{className:"delimiter"},E||"~"),t.createElement(r,{value:z,onChange:function(e,a){P(e,a)},variant:c,width:"50%",size:x,ampm:f,minDate:O||g,maxDate:v,minDateTime:O||A.minDateTime,inputFormat:_,mask:k,helperText:D,today:T,disabled:y,readOnly:b}))))}));s.defaultProps={variant:"desktop",labelWidth:"auto",width:"100%",size:"small",inputFormat:"yyyy-MM-dd HH:mm",ampm:!1,helperText:"yyyy-mm-dd hh:mm",mask:"____-__-__ __:__",today:!0};export{s as GuiDateTimeRangePicker,s as default};