build(deps): update src/components/Datepicker/DateRangePicker/index.js, src/components/Datepicker/index.js and src/index.scss update yarn.lock

src/components/Datepicker/CalenderList/index.js

@@ -0,0 +1,38 @@
+import React from "react";
+
+import { Calendar } from "react-multi-date-picker";
+import persian from "react-date-object/calendars/persian";
+import persian_fa from "react-date-object/locales/persian_fa";
+
+const weekDays = [
+  "شنبه",
+  "یکشنبه",
+  "دوشنبه",
+  "سشنبه",
+  "چهارشنبه",
+  "پنجشنبه",
+  "جمعه",
+];
+
+const CalenderList = () => {
+  return (
+    <div className="calender-list">
+      <Calendar
+        mapDays={({ date }) => {
+          let props = {};
+          let isWeekend = date.weekDay.index === 6;
+
+          if (isWeekend) props.className = "highlight highlight-red";
+
+          return props;
+        }}
+        weekDays={weekDays}
+        arrow={false}
+        calendar={persian}
+        locale={persian_fa}
+      />
+    </div>
+  );
+};
+
+export default CalenderList;

src/components/Datepicker/index.js

@@ -4,6 +4,7 @@ import DateRangePicker from "./DateRangePicker";
 import RangeDatePicker from "./RangeDatePicker";
 import SimpleCalendar from "./SimpleCalendar";
 import SimpleDatePicker from "./SimpleDatePicker";
+import CalenderList from "./CalenderList";
 
 function Calender() {
   const list = {
@@ -11,6 +12,7 @@ function Calender() {
     2: <RangeDatePicker />,
     3: <SimpleCalendar />,
     4: <SimpleDatePicker />,
+    5: <CalenderList />,
   };
   const [type, setType] = useState(1);
   return (

src/index.scss

@@ -2811,3 +2811,8 @@ $radkoColor2: #3197ee;
 }
 
 // * end Radio1 Component
+
+.calender-list .rmdp-rtl .rmdp-right,
+.rmdp-left {
+  display: none !important;
+}