@rnwonder/react-date-picker
Version:
A simple and reusable Datepicker component for ReactJS ([Demo](https://stackblitz.com/edit/solidjs-templates-dof6jl?file=src%2FApp.tsx))
2 lines (1 loc) • 1.05 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../DatePickerDay/index.js"),r=require("../DatePickerWeek/index.js"),t=require("react");exports.WeekDays=s=>{const[o,l]=t.useState([]),[n,c]=t.useState([]);return t.useEffect((()=>{const e=Array.from({length:7},((e,a)=>{const r=new Date(0,0,a-(1-(s.weekStartDay||0))+1).toLocaleDateString(s.locale||"en",{weekday:"single"===s.weekDaysType?"narrow":"short"});return"double"===s.weekDaysType?r.slice(0,2):r})),a=Array.from({length:7},((e,a)=>new Date(0,0,a-(1-(s.weekStartDay||0))+1).toLocaleDateString(s.locale||"en",{weekday:"long"})));c(a),l(e)}),[s.locale,s.weekDaysType,s.weekStartDay]),e.jsx(r.DatePickerWeek,{weekNamesRowClass:s.weekNamesRowClass,children:o.map(((r,t)=>e.jsx(a.DatePickerDay,{weekDaysNameColor:s.weekDaysNameColor,weekNamesClass:s.weekNamesClass,wrapperProps:{"data-scope":"date-picker","data-type":"column-header","aria-label":n[t],role:"columnheader"},header:!0,headerValue:n[t],children:r},t)))})};