@gsretail.com/gui-core
Version:
A skeleton to create your own React component library using Rollup, TypeScript, Sass and Storybook
2 lines (1 loc) • 1.34 kB
JavaScript
import{__rest as e,__assign as a}from"tslib";import t from"react";import{Box as o}from"@mui/material";import{ko as r}from"date-fns/locale";import{DateRange as l,DefinedRange as s}from"react-date-range";import i from"./GuiDateRangeCalendar.styled.js";var n=i((function(i){var n=i.width,d=i.disabled,m=i.readOnly,y=i.showDateDisplay,c=i.today,h=i.range,p=i.onChange,g=i.sx,f=i.className,D=i.boxProps,u=e(i,["width","disabled","readOnly","showDateDisplay","today","range","onChange","sx","className","boxProps"]);return t.createElement(o,a({className:["gui-form gui-date-picker",d&&"gui-form-disabled",m&&"gui-form-readonly",f&&f].join(" "),width:n},D,{sx:g}),t.createElement(o,{flexGrow:1,className:"gui-date-range",position:"relative",overflow:"hidden"},t.createElement(l,a({ranges:[a({key:"selection"},h)],onChange:p,showMonthAndYearPickers:!0,showDateDisplay:y,moveRangeOnFirstSelection:!1,direction:"horizontal",locale:r,monthDisplayFormat:"yyyy년 MM월",weekdayDisplayFormat:"eeeee",dateDisplayFormat:"yyyy-MM-dd",startDatePlaceholder:"yyyy-MM-dd",endDatePlaceholder:"yyyy-MM-dd"},u)),d||m?t.createElement(o,{className:"disabled-static"}):null,c&&t.createElement(s,{onChange:function(e){p(e)},ranges:[a({key:"selection"},h)]})))}));n.defaultProps={months:1,showDateDisplay:!1,today:!0};export{n as GuiDateRangeCalendar,n as default};