@adiraku/react-native-ui 1.2.8-canary-0 → 1.2.8-canary-2

package/lib/module/components/calendars/calendars.component.js

@@ -0,0 +1,207 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React, { memo, useCallback, useMemo, useState } from 'react';
+import { TouchableHighlight, View } from 'react-native';
+import { Calendar, LocaleConfig } from 'react-native-calendars';
+import ReactNativeModal from 'react-native-modal';
+import { Palettes, Spacing } from '../../themes';
+import { adjustDate, findYearPairIndex, generateYearPairs, getFullDate, getMonth, getYear } from './calendars.service';
+import { calendarTheme, getStyle } from './calendars.style';
+import { MonthID } from './calendars.type';
+import { IconChevronLeft, IconChevronRight } from '../../icons';
+import { Typography } from '../typography/typography.component';
+import { Button } from '../button/button.component';
+import { MonthPickerModal, YearPicker } from './month-picker-modal.component';
+
+// localization for calendar component
+LocaleConfig.locales['id'] = MonthID;
+LocaleConfig.defaultLocale = 'id';
+export function Calendars({
+  isVisible,
+  initialDate = new Date(),
+  onDismiss = () => {},
+  minDate,
+  maxDate,
+  onDateSave,
+  selectedDate,
+  ...rest
+}) {
+  const computedStyle = getStyle();
+  const [dateindicator, setDateIndicator] = useState(selectedDate || initialDate);
+  const [markedDate, setMarkedDate] = useState({});
+  const [selectMode, setSelectMode] = useState('calendar');
+  const yearIntervalPair = useMemo(() => {
+    let minYear = 1900;
+    let maxYear = new Date().getFullYear();
+    if (minDate) {
+      minYear = new Date(minDate).getFullYear();
+    }
+    if (maxDate) {
+      maxYear = new Date(maxDate).getFullYear();
+    }
+    console.log({
+      minYear,
+      maxYear,
+      minDate,
+      maxDate
+    });
+    return generateYearPairs(minYear, maxYear, 12);
+  }, [minDate, maxDate]);
+  const initYearPairIndex = findYearPairIndex(yearIntervalPair, (initialDate === null || initialDate === void 0 ? void 0 : initialDate.getFullYear()) || 0);
+  const [yearPairSelectIndex, setYearPairSelectIndex] = useState(initYearPairIndex);
+  const handleOnMonthChange = ({
+    num
+  }) => {
+    setDateIndicator(adjustDate(dateindicator, num));
+    setSelectMode('calendar');
+  };
+  const handleOnArrowPress = direction => {
+    if (selectMode === 'calendar') {
+      setDateIndicator(adjustDate(dateindicator, direction === 'left' ? -1 : 1));
+    } else if (selectMode === 'month') {
+      setDateIndicator(adjustDate(dateindicator, direction === 'left' ? -12 : 12));
+    } else {
+      if (yearPairSelectIndex <= 0 && direction === 'right') return;
+      if (yearPairSelectIndex >= yearIntervalPair.length - 1 && direction === 'left') return;
+
+      // don't ask what i'm doing, I know it's crazy T_T
+      setYearPairSelectIndex(e => direction === 'left' ? e + 1 : e - 1);
+    }
+  };
+  const onDayPress = useCallback(dates => {
+    if (!dates) return;
+    setDateIndicator(new Date(dates.timestamp));
+    setMarkedDate({
+      [dates.dateString]: {
+        selected: true,
+        ...dates
+      }
+    });
+  }, []);
+  const handleSelectModeChange = mode => {
+    setSelectMode(mode);
+  };
+  const handleOnDismiss = () => {
+    onDismiss();
+
+    // reset back to initial state
+    setSelectMode('calendar');
+    setDateIndicator(initialDate);
+    setYearPairSelectIndex(initYearPairIndex);
+    setMarkedDate({});
+  };
+  const handleOnDateSubmit = () => {
+    const keys = Object.keys(markedDate);
+    if (keys.length <= 0) return;
+    const testDate = markedDate[keys[0] || ''];
+    const selectedDate = new Date(testDate === null || testDate === void 0 ? void 0 : testDate.timestamp);
+    onDateSave === null || onDateSave === void 0 || onDateSave(selectedDate);
+    onDismiss();
+  };
+  return /*#__PURE__*/React.createElement(ReactNativeModal, {
+    isVisible: isVisible,
+    onBackdropPress: handleOnDismiss,
+    onBackButtonPress: handleOnDismiss,
+    backdropTransitionOutTiming: 0,
+    needsOffscreenAlphaCompositing: true,
+    animationIn: "zoomInDown",
+    animationOut: "zoomOut",
+    style: computedStyle.modalContainer
+  }, /*#__PURE__*/React.createElement(View, {
+    style: computedStyle.container
+  }, /*#__PURE__*/React.createElement(CalendarHeader, {
+    initialDate: dateindicator,
+    mode: selectMode,
+    handleOnArrowPress: handleOnArrowPress,
+    handleSelectMode: handleSelectModeChange,
+    yearPairSelectIndex: yearPairSelectIndex,
+    yearIntervalPair: yearIntervalPair
+  }), /*#__PURE__*/React.createElement(View, {
+    style: [computedStyle.calendarContainer, {
+      paddingHorizontal: selectMode === 'calendar' ? Spacing[4] : Spacing[4]
+    }]
+  }, selectMode === 'calendar' ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Calendar, _extends({
+    markedDates: markedDate,
+    initialDate: getFullDate(dateindicator),
+    style: {
+      marginHorizontal: Spacing[12]
+    },
+    theme: calendarTheme,
+    renderHeader: () => null,
+    onDayPress: onDayPress,
+    enableSwipeMonths: true,
+    minDate: minDate,
+    maxDate: maxDate
+  }, rest)), /*#__PURE__*/React.createElement(View, {
+    style: computedStyle.calendarBottomContainer
+  }, /*#__PURE__*/React.createElement(View, {
+    style: {
+      flex: 1
+    }
+  }, /*#__PURE__*/React.createElement(Button, {
+    label: "Batal",
+    variant: "secondary",
+    onPress: handleOnDismiss
+  })), /*#__PURE__*/React.createElement(View, {
+    style: {
+      width: 16
+    }
+  }), /*#__PURE__*/React.createElement(View, {
+    style: {
+      flex: 1
+    }
+  }, /*#__PURE__*/React.createElement(Button, {
+    label: "Simpan",
+    onPress: handleOnDateSubmit,
+    disabled: Object.keys(markedDate).length <= 0
+  })))) : selectMode === 'month' ? /*#__PURE__*/React.createElement(MonthPickerModal, {
+    initialDate: dateindicator,
+    onMonthChange: handleOnMonthChange
+  }) : /*#__PURE__*/React.createElement(YearPicker, {
+    initialDate: dateindicator,
+    yearPairSelectIndex: yearPairSelectIndex,
+    yearIntervalPair: yearIntervalPair,
+    onYearChange: handleOnMonthChange
+  }))));
+}
+const CalendarHeader = /*#__PURE__*/memo(function ({
+  mode = 'calendar',
+  initialDate = new Date(),
+  yearIntervalPair,
+  yearPairSelectIndex,
+  handleSelectMode,
+  handleOnArrowPress
+}) {
+  var _yearIntervalPair$yea, _yearIntervalPair$yea2;
+  const computedStyle = getStyle();
+  return /*#__PURE__*/React.createElement(View, {
+    style: computedStyle.headerContainer
+  }, /*#__PURE__*/React.createElement(TouchableHighlight, {
+    onPress: () => handleOnArrowPress('left'),
+    style: computedStyle.headerArrowWrapper,
+    underlayColor: Palettes.black[900] + '33'
+  }, /*#__PURE__*/React.createElement(IconChevronLeft, null)), /*#__PURE__*/React.createElement(View, {
+    style: computedStyle.headerCenterWrapper
+  }, mode === 'calendar' || mode === 'month' ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TouchableHighlight, {
+    onPress: () => handleSelectMode('month'),
+    style: computedStyle.headerCenterItem,
+    underlayColor: Palettes.black[900] + '33'
+  }, /*#__PURE__*/React.createElement(Typography, {
+    variant: "button"
+  }, getMonth(initialDate))), /*#__PURE__*/React.createElement(TouchableHighlight, {
+    onPress: () => handleSelectMode('year'),
+    style: computedStyle.headerCenterItem,
+    underlayColor: Palettes.black[900] + '33'
+  }, /*#__PURE__*/React.createElement(Typography, {
+    variant: "button"
+  }, getYear(initialDate)))) : /*#__PURE__*/React.createElement(TouchableHighlight, {
+    style: computedStyle.headerCenterItem,
+    underlayColor: Palettes.black[900] + '33'
+  }, /*#__PURE__*/React.createElement(Typography, {
+    variant: "button"
+  }, (_yearIntervalPair$yea = yearIntervalPair[yearPairSelectIndex]) === null || _yearIntervalPair$yea === void 0 ? void 0 : _yearIntervalPair$yea[1], " -", ' ', (_yearIntervalPair$yea2 = yearIntervalPair[yearPairSelectIndex]) === null || _yearIntervalPair$yea2 === void 0 ? void 0 : _yearIntervalPair$yea2[0]))), /*#__PURE__*/React.createElement(TouchableHighlight, {
+    onPress: () => handleOnArrowPress('right'),
+    style: computedStyle.headerArrowWrapper,
+    underlayColor: Palettes.black[900] + '33'
+  }, /*#__PURE__*/React.createElement(IconChevronRight, null)));
+});
+//# sourceMappingURL=calendars.component.js.map

package/lib/module/components/calendars/calendars.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","useCallback","useMemo","useState","TouchableHighlight","View","Calendar","LocaleConfig","ReactNativeModal","Palettes","Spacing","adjustDate","findYearPairIndex","generateYearPairs","getFullDate","getMonth","getYear","calendarTheme","getStyle","MonthID","IconChevronLeft","IconChevronRight","Typography","Button","MonthPickerModal","YearPicker","locales","defaultLocale","Calendars","isVisible","initialDate","Date","onDismiss","minDate","maxDate","onDateSave","selectedDate","rest","computedStyle","dateindicator","setDateIndicator","markedDate","setMarkedDate","selectMode","setSelectMode","yearIntervalPair","minYear","maxYear","getFullYear","console","log","initYearPairIndex","yearPairSelectIndex","setYearPairSelectIndex","handleOnMonthChange","num","handleOnArrowPress","direction","length","e","onDayPress","dates","timestamp","dateString","selected","handleSelectModeChange","mode","handleOnDismiss","handleOnDateSubmit","keys","Object","testDate","createElement","onBackdropPress","onBackButtonPress","backdropTransitionOutTiming","needsOffscreenAlphaCompositing","animationIn","animationOut","style","modalContainer","container","CalendarHeader","handleSelectMode","calendarContainer","paddingHorizontal","Fragment","_extends","markedDates","marginHorizontal","theme","renderHeader","enableSwipeMonths","calendarBottomContainer","flex","label","variant","onPress","width","disabled","onMonthChange","onYearChange","_yearIntervalPair$yea","_yearIntervalPair$yea2","headerContainer","headerArrowWrapper","underlayColor","black","headerCenterWrapper","headerCenterItem"],"sourceRoot":"../../../../src","sources":["components/calendars/calendars.component.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/calendars/calendars.service.js

@@ -0,0 +1,56 @@
+export const getMonth = date => {
+  return new Intl.DateTimeFormat('id-ID', {
+    month: 'long'
+  }).format(date);
+};
+export const getYear = date => {
+  return new Intl.DateTimeFormat('id-ID', {
+    year: 'numeric'
+  }).format(date);
+};
+export const getFullDate = date => {
+  const formatter = new Intl.DateTimeFormat('en-CA', {
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit'
+  });
+
+  // Format the date
+  const formattedDate = formatter.format(date);
+
+  // Since the formatter returns a date in the format of "YYYY/MM/DD",
+  // we need to replace the slashes with dashes
+  return formattedDate.replace(/\//g, '-');
+};
+export function adjustDate(date, number) {
+  // Ensure the input date is a Date object
+  const newDate = new Date(date);
+
+  // Adjust the date by the specified number of days
+  newDate.setMonth(newDate.getMonth() + number);
+  return newDate;
+}
+// endYear < startYear
+export function generateYearPairs(endYear, startYear, interval) {
+  const yearPairs = [];
+  let currentYear = startYear;
+  while (currentYear - interval >= endYear) {
+    yearPairs.push([currentYear, currentYear - interval + 1]);
+    currentYear -= interval;
+  }
+  yearPairs.push([currentYear, endYear]);
+  return yearPairs;
+}
+export function findYearPairIndex(years, targetYear) {
+  for (let i = 0; i < years.length; i++) {
+    const pair = years[i];
+    if (!pair) continue; // Skip if the pair is undefined
+
+    const [startYear, endYear] = pair;
+    if (targetYear >= endYear && targetYear <= startYear) {
+      return i;
+    }
+  }
+  return -1; // Return -1 if the target year is not found in any pair
+}
+//# sourceMappingURL=calendars.service.js.map

package/lib/module/components/calendars/calendars.service.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getMonth","date","Intl","DateTimeFormat","month","format","getYear","year","getFullDate","formatter","day","formattedDate","replace","adjustDate","number","newDate","Date","setMonth","generateYearPairs","endYear","startYear","interval","yearPairs","currentYear","push","findYearPairIndex","years","targetYear","i","length","pair"],"sourceRoot":"../../../../src","sources":["components/calendars/calendars.service.ts"],"mappings":"AAAA,OAAO,MAAMA,QAAQ,GAAIC,IAAU,IAAK;EACtC,OAAO,IAAIC,IAAI,CAACC,cAAc,CAAC,OAAO,EAAE;IAAEC,KAAK,EAAE;EAAO,CAAC,CAAC,CAACC,MAAM,CAACJ,IAAI,CAAC;AACzE,CAAC;AAED,OAAO,MAAMK,OAAO,GAAIL,IAAU,IAAK;EACrC,OAAO,IAAIC,IAAI,CAACC,cAAc,CAAC,OAAO,EAAE;IAAEI,IAAI,EAAE;EAAU,CAAC,CAAC,CAACF,MAAM,CAACJ,IAAI,CAAC;AAC3E,CAAC;AAED,OAAO,MAAMO,WAAW,GAAIP,IAAU,IAAK;EACzC,MAAMQ,SAAS,GAAG,IAAIP,IAAI,CAACC,cAAc,CAAC,OAAO,EAAE;IACjDI,IAAI,EAAE,SAAS;IACfH,KAAK,EAAE,SAAS;IAChBM,GAAG,EAAE;EACP,CAAC,CAAC;;EAEF;EACA,MAAMC,aAAa,GAAGF,SAAS,CAACJ,MAAM,CAACJ,IAAI,CAAC;;EAE5C;EACA;EACA,OAAOU,aAAa,CAACC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC;AAC1C,CAAC;AAED,OAAO,SAASC,UAAUA,CAACZ,IAAU,EAAEa,MAAc,EAAE;EACrD;EACA,MAAMC,OAAO,GAAG,IAAIC,IAAI,CAACf,IAAI,CAAC;;EAE9B;EACAc,OAAO,CAACE,QAAQ,CAACF,OAAO,CAACf,QAAQ,CAAC,CAAC,GAAGc,MAAM,CAAC;EAE7C,OAAOC,OAAO;AAChB;AAIA;AACA,OAAO,SAASG,iBAAiBA,CAACC,OAAe,EAAEC,SAAiB,EAAEC,QAAgB,EAAc;EAClG,MAAMC,SAAqB,GAAG,EAAE;EAChC,IAAIC,WAAW,GAAGH,SAAS;EAE3B,OAAOG,WAAW,GAAGF,QAAQ,IAAIF,OAAO,EAAE;IACxCG,SAAS,CAACE,IAAI,CAAC,CAACD,WAAW,EAAEA,WAAW,GAAGF,QAAQ,GAAG,CAAC,CAAC,CAAC;IACzDE,WAAW,IAAIF,QAAQ;EACzB;EAEAC,SAAS,CAACE,IAAI,CAAC,CAACD,WAAW,EAAEJ,OAAO,CAAC,CAAC;EAEtC,OAAOG,SAAS;AAClB;AACA,OAAO,SAASG,iBAAiBA,CAC/BC,KAAyB,EACzBC,UAAkB,EACV;EACR,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGF,KAAK,CAACG,MAAM,EAAED,CAAC,EAAE,EAAE;IACrC,MAAME,IAAI,GAAGJ,KAAK,CAACE,CAAC,CAAC;IACrB,IAAI,CAACE,IAAI,EAAE,SAAS,CAAC;;IAErB,MAAM,CAACV,SAAS,EAAED,OAAO,CAAC,GAAGW,IAAI;IACjC,IAAIH,UAAU,IAAIR,OAAO,IAAIQ,UAAU,IAAIP,SAAS,EAAE;MACpD,OAAOQ,CAAC;IACV;EACF;EACA,OAAO,CAAC,CAAC,CAAC,CAAC;AACb","ignoreList":[]}

package/lib/module/components/calendars/calendars.style.js

@@ -0,0 +1,119 @@
+import { StyleSheet } from 'react-native';
+import { Palettes, Radius, Spacing, Shadow } from '../../themes';
+export const getStyle = () => {
+  const computedStyle = {};
+  computedStyle.modalContainer = {
+    height: '100%',
+    width: '100%'
+  };
+  computedStyle.container = {
+    width: 350,
+    backgroundColor: Palettes.white[50],
+    paddingVertical: Spacing[24],
+    borderRadius: Radius[16],
+    overflow: 'hidden',
+    ...Shadow['shadow-elevation-1']
+  };
+  computedStyle.headerContainer = {
+    backgroundColor: Palettes.grey[50],
+    height: 40,
+    flexGrow: 1,
+    borderRadius: Radius[8],
+    marginBottom: Spacing[16],
+    overflow: 'hidden',
+    flexDirection: 'row',
+    marginHorizontal: Spacing[16]
+  };
+  computedStyle.headerArrowWrapper = {
+    height: 40,
+    width: 40,
+    justifyContent: 'center',
+    alignItems: 'center'
+  };
+  computedStyle.headerCenterWrapper = {
+    flex: 1,
+    flexDirection: 'row'
+  };
+  computedStyle.headerCenterItem = {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
+  };
+  computedStyle.calendarContainer = {
+    height: 350,
+    justifyContent: 'space-between'
+  };
+  computedStyle.calendarBottomContainer = {
+    flexDirection: 'row',
+    marginTop: Spacing[12],
+    paddingHorizontal: Spacing[16]
+  };
+  return StyleSheet.create(computedStyle);
+};
+export const calendarTheme = {
+  'textDayStyle': {
+    height: 40,
+    width: 40,
+    borderRadius: 99,
+    borderWidth: 2,
+    borderColor: 'transparent',
+    textAlign: 'center',
+    verticalAlign: 'middle',
+    overflow: 'hidden'
+  },
+  'stylesheet.day.basic': {
+    base: {
+      width: 40,
+      height: 40,
+      alignItems: 'center',
+      marginTop: 4
+    },
+    alignedText: {},
+    selected: {},
+    today: {},
+    todayText: {
+      borderColor: Palettes.yellow[600]
+    },
+    selectedText: {
+      borderColor: Palettes.yellow[600],
+      backgroundColor: Palettes.yellow[600]
+    },
+    disabledText: {
+      color: Palettes.grey[200]
+    },
+    inactiveText: {
+      color: Palettes.grey[200]
+    }
+  },
+  'stylesheet.calendar.header': {
+    header: {
+      flexDirection: 'row',
+      justifyContent: 'space-between',
+      backgroundColor: 'red',
+      height: 0
+    },
+    headerContainer: {
+      flexGrow: 1,
+      justifyContent: 'center'
+    },
+    week: {
+      flexDirection: 'row',
+      justifyContent: 'space-between',
+      borderBottomWidth: 1,
+      borderBottomColor: Palettes.grey[200],
+      paddingBottom: 12
+    },
+    dayHeader: {
+      fontFamily: 'Montserrat-Regular',
+      fontSize: 14,
+      color: Palettes.black[900]
+    }
+  },
+  'stylesheet.calendar.main': {
+    week: {
+      flexDirection: 'row',
+      justifyContent: 'space-around'
+    }
+  }
+};
+//# sourceMappingURL=calendars.style.js.map

package/lib/module/components/calendars/calendars.style.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","Palettes","Radius","Spacing","Shadow","getStyle","computedStyle","modalContainer","height","width","container","backgroundColor","white","paddingVertical","borderRadius","overflow","headerContainer","grey","flexGrow","marginBottom","flexDirection","marginHorizontal","headerArrowWrapper","justifyContent","alignItems","headerCenterWrapper","flex","headerCenterItem","calendarContainer","calendarBottomContainer","marginTop","paddingHorizontal","create","calendarTheme","borderWidth","borderColor","textAlign","verticalAlign","base","alignedText","selected","today","todayText","yellow","selectedText","disabledText","color","inactiveText","header","week","borderBottomWidth","borderBottomColor","paddingBottom","dayHeader","fontFamily","fontSize","black"],"sourceRoot":"../../../../src","sources":["components/calendars/calendars.style.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/components/calendars/calendars.type.js

@@ -0,0 +1,8 @@
+export const MonthID = {
+  monthNames: ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'],
+  monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'Mei', 'Jun', 'Jul', 'Agu', 'Sep', 'Okt', 'Nov', 'Des'],
+  dayNames: ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu'],
+  dayNamesShort: ['Min', 'Sen', 'Sel', 'Rab', 'Kam', 'Jum', 'Sab'],
+  today: 'Hari ini'
+};
+//# sourceMappingURL=calendars.type.js.map

package/lib/module/components/calendars/calendars.type.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MonthID","monthNames","monthNamesShort","dayNames","dayNamesShort","today"],"sourceRoot":"../../../../src","sources":["components/calendars/calendars.type.tsx"],"mappings":"AAGA,OAAO,MAAMA,OAAO,GAAG;EACrBC,UAAU,EAAE,CACV,SAAS,EACT,UAAU,EACV,OAAO,EACP,OAAO,EACP,KAAK,EACL,MAAM,EACN,MAAM,EACN,SAAS,EACT,WAAW,EACX,SAAS,EACT,UAAU,EACV,UAAU,CACX;EACDC,eAAe,EAAE,CACf,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,CACN;EACDC,QAAQ,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,CAAC;EAC1EC,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;EAChEC,KAAK,EAAE;AACT,CAAC","ignoreList":[]}

package/lib/module/components/calendars/month-picker-modal.component.js

@@ -0,0 +1,95 @@
+import React, { useMemo } from 'react';
+import { TouchableHighlight, View } from 'react-native';
+import { Palettes, Radius, Spacing } from '../../themes';
+import { Typography } from '../typography/typography.component';
+import { MonthID } from './calendars.type';
+export function MonthPickerModal({
+  initialDate,
+  onMonthChange
+}) {
+  return /*#__PURE__*/React.createElement(View, {
+    style: {
+      flex: 1,
+      justifyContent: 'center',
+      alignItems: 'center',
+      padding: Spacing[24]
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    style: {
+      width: '100%',
+      flexDirection: 'row',
+      flexWrap: 'wrap',
+      justifyContent: 'space-between'
+    }
+  }, MonthID.monthNames.map((month, index) => /*#__PURE__*/React.createElement(TouchableHighlight, {
+    key: month,
+    onPressIn: () => onMonthChange({
+      num: index - ((initialDate === null || initialDate === void 0 ? void 0 : initialDate.getMonth()) || 0)
+    }),
+    underlayColor: Palettes.black[900] + '33',
+    style: {
+      width: '32%',
+      alignItems: 'center',
+      justifyContent: 'center',
+      borderWidth: 1,
+      paddingVertical: Spacing[12],
+      borderColor: Palettes.grey[200],
+      borderRadius: Radius[8],
+      marginBottom: Spacing[8],
+      backgroundColor: (initialDate === null || initialDate === void 0 ? void 0 : initialDate.getMonth()) === index ? Palettes.yellow[600] : 'transparent'
+    }
+  }, /*#__PURE__*/React.createElement(Typography, {
+    variant: "button-small"
+  }, month)))));
+}
+export function YearPicker({
+  initialDate,
+  onYearChange,
+  yearPairSelectIndex,
+  yearIntervalPair
+}) {
+  const yearArray = useMemo(() => {
+    const years = [];
+    const yearPair = yearIntervalPair[yearPairSelectIndex];
+    if (!yearPair) return [];
+    for (let year = yearPair[1]; year <= yearPair[0]; year++) {
+      years.push(year);
+    }
+    return years;
+  }, [yearPairSelectIndex, yearIntervalPair]);
+  return /*#__PURE__*/React.createElement(View, {
+    style: {
+      flex: 1,
+      justifyContent: 'center',
+      alignItems: 'center',
+      padding: Spacing[24]
+    }
+  }, /*#__PURE__*/React.createElement(View, {
+    style: {
+      width: '100%',
+      flexDirection: 'row',
+      flexWrap: 'wrap',
+      justifyContent: 'space-between'
+    }
+  }, yearArray.map(year => /*#__PURE__*/React.createElement(TouchableHighlight, {
+    key: year,
+    onPressIn: () => onYearChange({
+      num: (year - ((initialDate === null || initialDate === void 0 ? void 0 : initialDate.getFullYear()) || 0)) * 12
+    }),
+    underlayColor: Palettes.black[900] + '33',
+    style: {
+      width: '32%',
+      alignItems: 'center',
+      justifyContent: 'center',
+      borderWidth: 1,
+      paddingVertical: Spacing[12],
+      borderColor: Palettes.grey[200],
+      borderRadius: Radius[8],
+      marginBottom: Spacing[8],
+      backgroundColor: (initialDate === null || initialDate === void 0 ? void 0 : initialDate.getFullYear()) === year ? Palettes.yellow[600] : 'transparent'
+    }
+  }, /*#__PURE__*/React.createElement(Typography, {
+    variant: "button-small"
+  }, year)))));
+}
+//# sourceMappingURL=month-picker-modal.component.js.map

package/lib/module/components/calendars/month-picker-modal.component.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","TouchableHighlight","View","Palettes","Radius","Spacing","Typography","MonthID","MonthPickerModal","initialDate","onMonthChange","createElement","style","flex","justifyContent","alignItems","padding","width","flexDirection","flexWrap","monthNames","map","month","index","key","onPressIn","num","getMonth","underlayColor","black","borderWidth","paddingVertical","borderColor","grey","borderRadius","marginBottom","backgroundColor","yellow","variant","YearPicker","onYearChange","yearPairSelectIndex","yearIntervalPair","yearArray","years","yearPair","year","push","getFullYear"],"sourceRoot":"../../../../src","sources":["components/calendars/month-picker-modal.component.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/index.js

@@ -1,5 +1,6 @@
 export { ActionList } from './ActionList/ActionList.component';
 export { Button } from './button/button.component';
+export { Calendars } from './calendars/calendars.component';
 export { Label } from './label/label.component';
 export { BaseComponent } from './base/base.component';
 export { Typography } from './typography/typography.component';

package/lib/module/components/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["ActionList","Button","Label","BaseComponent","Typography","Coachmark","TextLink","SliderIndicator","TextInput","TextArea","StepperCounter","Divider","Tabs","RadioButton","BottomSheet","BottomSheetHandler","SearchInput","RadioInput","CheckBoxInput","Checkbox","Appbar","Snackbar","SnackbarComponent","Switch","Dot","InformationBox","RoundedTab","Countdown","Mask","MaskArray","MaskInputProps","MaskItem","Masks","UseMaskedInputProps","createNumberMask","formatWithMask","useMaskedInputProps","SelectionCard"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":"AAAA,SAASA,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,KAAK,QAAQ,yBAAyB;AAC/C,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,eAAe,QAAQ,+CAA+C;AAC/E,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,cAAc,QAAQ,2CAA2C;AAC1E,SAASC,OAAO,QAAQ,6BAA6B;AACrD,SAASC,IAAI,QAAQ,uBAAuB;AAC5C,SAASC,WAAW,QAAQ,qCAAqC;AACjE,SACEC,WAAW,EACXC,kBAAkB,QACb,qCAAqC;AAC5C,SAASC,WAAW,QAAQ,uCAAuC;AACnE,SAASC,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,aAAa,QAAQ,yCAAyC;AACvE,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,QAAQ,EAAEC,iBAAiB,QAAQ,+BAA+B;AAC3E,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,GAAG,QAAQ,qBAAqB;AACzC,SAASC,cAAc,QAAQ,6CAA6C;AAC5E,SAASC,UAAU,QAAQ,qCAAqC;AAChE,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SACEC,IAAI,EACJC,SAAS,EACTC,cAAc,EACdC,QAAQ,EACRC,KAAK,EACLC,mBAAmB,EACnBC,gBAAgB,EAChBC,cAAc,EACdC,mBAAmB,QACd,yBAAyB;AAChC,SAASC,aAAa,QAAQ,0CAA0C","ignoreList":[]}
+{"version":3,"names":["ActionList","Button","Calendars","Label","BaseComponent","Typography","Coachmark","TextLink","SliderIndicator","TextInput","TextArea","StepperCounter","Divider","Tabs","RadioButton","BottomSheet","BottomSheetHandler","SearchInput","RadioInput","CheckBoxInput","Checkbox","Appbar","Snackbar","SnackbarComponent","Switch","Dot","InformationBox","RoundedTab","Countdown","Mask","MaskArray","MaskInputProps","MaskItem","Masks","UseMaskedInputProps","createNumberMask","formatWithMask","useMaskedInputProps","SelectionCard"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":"AAAA,SAASA,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SAASC,KAAK,QAAQ,yBAAyB;AAC/C,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,eAAe,QAAQ,+CAA+C;AAC/E,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,cAAc,QAAQ,2CAA2C;AAC1E,SAASC,OAAO,QAAQ,6BAA6B;AACrD,SAASC,IAAI,QAAQ,uBAAuB;AAC5C,SAASC,WAAW,QAAQ,qCAAqC;AACjE,SACEC,WAAW,EACXC,kBAAkB,QACb,qCAAqC;AAC5C,SAASC,WAAW,QAAQ,uCAAuC;AACnE,SAASC,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,aAAa,QAAQ,yCAAyC;AACvE,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,QAAQ,EAAEC,iBAAiB,QAAQ,+BAA+B;AAC3E,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,GAAG,QAAQ,qBAAqB;AACzC,SAASC,cAAc,QAAQ,6CAA6C;AAC5E,SAASC,UAAU,QAAQ,qCAAqC;AAChE,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SACEC,IAAI,EACJC,SAAS,EACTC,cAAc,EACdC,QAAQ,EACRC,KAAK,EACLC,mBAAmB,EACnBC,gBAAgB,EAChBC,cAAc,EACdC,mBAAmB,QACd,yBAAyB;AAChC,SAASC,aAAa,QAAQ,0CAA0C","ignoreList":[]}