@beppla/tapas-ui 1.0.67 → 1.0.68

package/commonjs/Calendar/CustomRange.js

@@ -1,162 +1,76 @@
 "use strict";
 
-var __assign = void 0 && (void 0).__assign || function () {
-  __assign = Object.assign || function (t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-    }
-    return t;
-  };
-  return __assign.apply(this, arguments);
-};
-var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
-  if (k2 === undefined) k2 = k;
-  var desc = Object.getOwnPropertyDescriptor(m, k);
-  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-    desc = {
-      enumerable: true,
-      get: function () {
-        return m[k];
-      }
-    };
-  }
-  Object.defineProperty(o, k2, desc);
-} : function (o, m, k, k2) {
-  if (k2 === undefined) k2 = k;
-  o[k2] = m[k];
-});
-var __setModuleDefault = void 0 && (void 0).__setModuleDefault || (Object.create ? function (o, v) {
-  Object.defineProperty(o, "default", {
-    enumerable: true,
-    value: v
-  });
-} : function (o, v) {
-  o["default"] = v;
-});
-var __importStar = void 0 && (void 0).__importStar || function () {
-  var ownKeys = function (o) {
-    ownKeys = Object.getOwnPropertyNames || function (o) {
-      var ar = [];
-      for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-      return ar;
-    };
-    return ownKeys(o);
-  };
-  return function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-    __setModuleDefault(result, mod);
-    return result;
-  };
-}();
-var __spreadArray = void 0 && (void 0).__spreadArray || function (to, from, pack) {
-  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-    if (ar || !(i in from)) {
-      if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-      ar[i] = from[i];
-    }
-  }
-  return to.concat(ar || Array.prototype.slice.call(from));
-};
-var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
-  return mod && mod.__esModule ? mod : {
-    "default": mod
-  };
-};
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-var themed_1 = require("@rneui/themed");
-var react_1 = __importStar(require("react"));
-var react_native_1 = require("react-native");
-var Button_1 = __importDefault(require("../Button/Button"));
-var types_1 = require("./types");
-var TapasIcon_1 = __importDefault(require("../Icons/TapasIcon"));
-var local_1 = require("./local");
-var FixedSizeGrid_1 = __importDefault(require("../Grid/FixedSizeGrid"));
-var helper_1 = require("./helper");
-var curDate = new Date();
-var CustomRange = function (_a) {
-  var _b, _c, _d, _e;
-  var backFn = _a.backFn,
-    theme = _a.theme,
-    attachComplete = _a.attachComplete,
-    rangeVal = _a.rangeVal,
-    _f = _a.languageCode,
-    languageCode = _f === void 0 ? types_1.SupportLanguage.en : _f;
-  var _g = (0, react_1.useState)("start"),
-    curEditDate = _g[0],
-    setCurEditDate = _g[1];
-  var _h = (0, react_1.useState)(rangeVal !== null && rangeVal !== void 0 ? rangeVal : []),
-    range = _h[0],
-    setRnage = _h[1];
-  var _j = (0, react_1.useState)([]),
-    rangeDetail = _j[0],
-    setRangeDetail = _j[1];
-  var _k = (0, react_1.useState)(52),
-    rowHeight = _k[0],
-    setRowHeight = _k[1];
-  var years = (0, helper_1.getYears)(curDate, languageCode);
-  var _l = (0, react_1.useState)([local_1.locales[languageCode].any]),
-    days = _l[0],
-    setDays = _l[1];
-  var monthes = __spreadArray([local_1.locales[languageCode].any], (_b = local_1.locales[languageCode]) === null || _b === void 0 ? void 0 : _b.monthNamesShort, true);
-  var _m = (0, react_1.useState)(2),
-    mid = _m[0],
-    setMid = _m[1];
-  var _o = (0, react_1.useState)({
-      left: years.length + mid * 2,
-      center: monthes.length + mid * 2,
-      right: days.length + mid * 2
-    }),
-    rowCount = _o[0],
-    setRowCount = _o[1];
-  var _p = (0, react_1.useState)(0),
-    selectedYear = _p[0],
-    setSelectedYear = _p[1];
-  var _q = (0, react_1.useState)(0),
-    selectedMonth = _q[0],
-    setSelectedMonth = _q[1];
-  var _r = (0, react_1.useState)(0),
-    selectedDay = _r[0],
-    setSelectedDay = _r[1];
-  var _s = (0, react_1.useState)(0),
-    innerConWidth = _s[0],
-    setInnerConWidth = _s[1];
-  var _t = (0, react_1.useState)(0),
-    innerConHeight = _t[0],
-    setInnerConHeight = _t[1];
-  var yearGrid = (0, react_1.useRef)(null);
-  var monthGrid = (0, react_1.useRef)(null);
-  var dayGrid = (0, react_1.useRef)(null);
-  (0, react_1.useEffect)(function () {
+exports.default = void 0;
+var _themed = require("@rneui/themed");
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _Button = _interopRequireDefault(require("../Button/Button"));
+var _types = require("./types");
+var _TapasIcon = _interopRequireDefault(require("../Icons/TapasIcon"));
+var _local = require("./local");
+var _FixedSizeGrid = _interopRequireDefault(require("../Grid/FixedSizeGrid"));
+var _helper = require("./helper");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const curDate = new Date();
+const CustomRange = ({
+  backFn,
+  theme,
+  attachComplete,
+  rangeVal,
+  languageCode = _types.SupportLanguage.en
+}) => {
+  const [curEditDate, setCurEditDate] = (0, _react.useState)("start");
+  const [range, setRnage] = (0, _react.useState)(rangeVal ?? []);
+  const [rangeDetail, setRangeDetail] = (0, _react.useState)([]);
+  const [rowHeight, setRowHeight] = (0, _react.useState)(52);
+  const years = (0, _helper.getYears)(curDate, languageCode);
+  const [days, setDays] = (0, _react.useState)([_local.locales[languageCode].any]);
+  const monthes = [_local.locales[languageCode].any, ..._local.locales[languageCode]?.monthNamesShort];
+  const [mid, setMid] = (0, _react.useState)(2);
+  const [rowCount, setRowCount] = (0, _react.useState)({
+    left: years.length + mid * 2,
+    center: monthes.length + mid * 2,
+    right: days.length + mid * 2
+  });
+  const [selectedYear, setSelectedYear] = (0, _react.useState)(0);
+  const [selectedMonth, setSelectedMonth] = (0, _react.useState)(0);
+  const [selectedDay, setSelectedDay] = (0, _react.useState)(0);
+  const [innerConWidth, setInnerConWidth] = (0, _react.useState)(0);
+  const [innerConHeight, setInnerConHeight] = (0, _react.useState)(0);
+  const yearGrid = (0, _react.useRef)(null);
+  const monthGrid = (0, _react.useRef)(null);
+  const dayGrid = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
     if (selectedYear > 0 && selectedMonth > mid) {
-      setDays((0, helper_1.getDays)(new Date("".concat(selectedYear - mid === years.length - 1 ? curDate.getFullYear() : years[selectedYear - mid], "-").concat(selectedMonth - mid < 0 ? 1 : selectedMonth - mid, "-01")), languageCode));
-      setRowCount(__assign(__assign({}, rowCount), {
+      setDays((0, _helper.getDays)(new Date(`${selectedYear - mid === years.length - 1 ? curDate.getFullYear() : years[selectedYear - mid]}-${selectedMonth - mid < 0 ? 1 : selectedMonth - mid}-01`), languageCode));
+      setRowCount({
+        ...rowCount,
         right: days.length + mid * 2
-      }));
+      });
     }
   }, [selectedMonth, selectedYear]);
-  (0, react_1.useEffect)(function () {
-    var _a, _b, _c, _d;
-    var val = "";
-    var obj = null;
+  (0, _react.useEffect)(() => {
+    let val = "";
+    let obj = null;
     if (selectedMonth > mid) {
-      var month = selectedMonth - mid < 0 ? 1 : selectedMonth - mid;
+      const month = selectedMonth - mid < 0 ? 1 : selectedMonth - mid;
       if (month) {
         obj = {
-          month: month
+          month
         };
-        val += local_1.locales[languageCode].monthNamesShort[month - 1];
+        val += _local.locales[languageCode].monthNamesShort[month - 1];
         if (selectedDay > mid) {
-          var day = selectedDay - mid < 0 ? 1 : selectedDay - mid;
+          const day = selectedDay - mid < 0 ? 1 : selectedDay - mid;
           if (day) {
             if (obj) {
               obj.day = day;
             }
-            val += " ".concat(day.toString().padStart(2, "0"));
+            val += ` ${day.toString().padStart(2, "0")}`;
           }
         }
       }
@@ -165,66 +79,75 @@ var CustomRange = function (_a) {
       if (val) {
         val += ", ";
       }
-      var year = years[selectedYear - mid];
+      const year = years[selectedYear - mid];
       if (year) {
         val += year;
-        obj = __assign(__assign({}, obj !== null && obj !== void 0 ? obj : {}), {
+        obj = {
+          ...(obj ?? {}),
           year: parseInt(year)
-        });
+        };
       }
     }
     if (curEditDate === "start") {
-      setRangeDetail([obj, (_a = rangeDetail[1]) !== null && _a !== void 0 ? _a : null]);
-      setRnage([val, (_b = range[1]) !== null && _b !== void 0 ? _b : ""]);
+      setRangeDetail([obj, rangeDetail[1] ?? null]);
+      setRnage([val, range[1] ?? ""]);
     } else {
-      setRnage([(_c = range[0]) !== null && _c !== void 0 ? _c : "", val]);
-      setRangeDetail([(_d = rangeDetail[0]) !== null && _d !== void 0 ? _d : null, obj]);
+      setRnage([range[0] ?? "", val]);
+      setRangeDetail([rangeDetail[0] ?? null, obj]);
     }
   }, [selectedMonth, selectedYear, selectedDay]);
-  (0, react_1.useEffect)(function () {
-    var _a;
-    var _b = (_a = rangeDetail[curEditDate === "start" ? 0 : 1]) !== null && _a !== void 0 ? _a : {},
-      year = _b.year,
-      month = _b.month,
-      day = _b.day;
-    var newYearIndex = year ? years.indexOf("".concat(year)) : years.length + mid * 2 - 1;
+  (0, _react.useEffect)(() => {
+    const {
+      year,
+      month,
+      day
+    } = rangeDetail[curEditDate === "start" ? 0 : 1] ?? {};
+    const newYearIndex = year ? years.indexOf(`${year}`) : years.length + mid * 2 - 1;
     yearGrid.current.scrollToItem({
       columnIndex: 0,
       rowIndex: newYearIndex,
       align: "auto"
     });
-    var newMonthIndex = month ? month + mid * 2 : 0;
+    const newMonthIndex = month ? month + mid * 2 : 0;
     monthGrid.current.scrollToItem({
       columnIndex: 0,
       rowIndex: newMonthIndex,
       align: "auto"
     });
-    var newDayIndex = day ? day + mid * 2 : 0;
+    const newDayIndex = day ? day + mid * 2 : 0;
     dayGrid.current.scrollToItem({
       columnIndex: 0,
       rowIndex: newDayIndex,
       align: "auto"
     });
   }, [curEditDate, mid]);
+
   // Inner Container Layout Event to set grid width and height
-  var handleInnerConWidthLayout = function (event) {
-    var width = event.nativeEvent.layout.width;
+  const handleInnerConWidthLayout = event => {
+    const {
+      width
+    } = event.nativeEvent.layout;
     if (innerConWidth === 0) {
       setInnerConWidth(width);
     }
   };
+
   // Inner Container Layout Event to set grid width and height
-  var handleInnerConHeightLayout = function (event) {
-    var height = event.nativeEvent.layout.height;
+  const handleInnerConHeightLayout = event => {
+    const {
+      height
+    } = event.nativeEvent.layout;
     if (innerConHeight === 0) {
       setInnerConHeight(height);
+
       // 矫正行高，和总行数，确保显示行为奇数， 中间行为选中行
-      var maxRowCount = Math.floor((height - 64) / rowHeight);
-      var adjustedRowCount = maxRowCount % 2 === 0 ? maxRowCount - 1 : maxRowCount;
-      var newRowHeight = (height - 64) / adjustedRowCount;
+      const maxRowCount = Math.floor((height - 64) / rowHeight);
+      const adjustedRowCount = maxRowCount % 2 === 0 ? maxRowCount - 1 : maxRowCount;
+      const newRowHeight = (height - 64) / adjustedRowCount;
       setRowHeight(newRowHeight);
+
       // 设置中间行索引以及各列的选中行索引
-      var val = Math.floor((height - 64) / 2 / newRowHeight);
+      const val = Math.floor((height - 64) / 2 / newRowHeight);
       setMid(val);
       setRowCount({
         left: years.length + val * 2,
@@ -236,79 +159,74 @@ var CustomRange = function (_a) {
       setSelectedYear(years.length + val * 2 - 1);
     }
   };
-  var renderRangeText = function (key) {
-    var _a, _b;
-    return react_1.default.createElement(react_native_1.View, {
-      key: key,
-      style: key === "start" ? styles.range1 : styles.range2
-    }, react_1.default.createElement(Button_1.default, {
-      type: "clear",
-      titleStyle: __assign(__assign({}, styles.rangeText), {
-        maxWidth: (innerConWidth - 102) / 2 - 8,
-        whiteSpace: "nowrap",
-        textOverflow: "ellipsis",
-        color: curEditDate === key ? theme.colors.primary : theme.colors.secondary
-      }),
-      buttonStyle: styles.padding4,
-      onPress: function () {
-        return setCurEditDate(key);
-      }
-    }, key === "start" ? range[0] || ((_a = local_1.locales[languageCode]) === null || _a === void 0 ? void 0 : _a.anyStartDate) : range[1] || ((_b = local_1.locales[languageCode]) === null || _b === void 0 ? void 0 : _b.anyEndDate)));
-  };
-  var renderListHeader = function (title) {
-    return react_1.default.createElement(react_native_1.Text, {
-      key: title,
-      style: __assign(__assign({}, styles.listHeadertext), {
-        color: theme.colors.primary,
-        width: (innerConWidth - 20) / 3
-      })
-    }, title);
-  };
-  var YearCell = function (_a) {
-    var rowIndex = _a.rowIndex,
-      style = _a.style;
-    return react_1.default.createElement(react_native_1.View, {
-      style: style
-    }, react_1.default.createElement(react_native_1.Text, {
-      style: __assign(__assign({}, styles.cell), {
-        fontSize: rowIndex === selectedYear ? 16 : 14,
-        fontWeight: rowIndex === selectedYear ? "700" : "400",
-        color: rowIndex === selectedYear ? theme.colors.primary : theme.colors.secondary
-      })
-    }, years[rowIndex - mid]));
-  };
-  var MonthCell = function (_a) {
-    var rowIndex = _a.rowIndex,
-      style = _a.style;
-    return react_1.default.createElement(react_native_1.View, {
-      style: style
-    }, react_1.default.createElement(react_native_1.Text, {
-      style: __assign(__assign({}, styles.cell), {
-        fontSize: rowIndex === selectedMonth ? 16 : 14,
-        fontWeight: rowIndex === selectedMonth ? "700" : "400",
-        color: rowIndex === selectedMonth ? theme.colors.primary : theme.colors.secondary
-      })
-    }, monthes[rowIndex - mid]));
-  };
-  var DayCell = function (_a) {
-    var rowIndex = _a.rowIndex,
-      style = _a.style;
-    return react_1.default.createElement(react_native_1.View, {
-      style: style
-    }, react_1.default.createElement(react_native_1.Text, {
-      style: __assign(__assign({}, styles.cell), {
-        fontSize: rowIndex === selectedDay ? 16 : 14,
-        fontWeight: rowIndex === selectedDay ? "700" : "400",
-        color: rowIndex === selectedDay ? theme.colors.primary : theme.colors.secondary
-      })
-    }, days[rowIndex - mid]));
-  };
-  return react_1.default.createElement(react_native_1.View, {
+  const renderRangeText = key => /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    key: key,
+    style: key === "start" ? styles.range1 : styles.range2
+  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
+    type: "clear",
+    titleStyle: {
+      ...styles.rangeText,
+      maxWidth: (innerConWidth - 102) / 2 - 8,
+      whiteSpace: "nowrap",
+      textOverflow: "ellipsis",
+      color: curEditDate === key ? theme.colors.primary : theme.colors.secondary
+    },
+    buttonStyle: styles.padding4,
+    onPress: () => setCurEditDate(key)
+  }, key === "start" ? range[0] || _local.locales[languageCode]?.anyStartDate : range[1] || _local.locales[languageCode]?.anyEndDate));
+  const renderListHeader = title => /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    key: title,
+    style: {
+      ...styles.listHeadertext,
+      color: theme.colors.primary,
+      width: (innerConWidth - 20) / 3
+    }
+  }, title);
+  const YearCell = ({
+    rowIndex,
+    style
+  }) => /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: style
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: {
+      ...styles.cell,
+      fontSize: rowIndex === selectedYear ? 16 : 14,
+      fontWeight: rowIndex === selectedYear ? "700" : "400",
+      color: rowIndex === selectedYear ? theme.colors.primary : theme.colors.secondary
+    }
+  }, years[rowIndex - mid]));
+  const MonthCell = ({
+    rowIndex,
+    style
+  }) => /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: style
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: {
+      ...styles.cell,
+      fontSize: rowIndex === selectedMonth ? 16 : 14,
+      fontWeight: rowIndex === selectedMonth ? "700" : "400",
+      color: rowIndex === selectedMonth ? theme.colors.primary : theme.colors.secondary
+    }
+  }, monthes[rowIndex - mid]));
+  const DayCell = ({
+    rowIndex,
+    style
+  }) => /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: style
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: {
+      ...styles.cell,
+      fontSize: rowIndex === selectedDay ? 16 : 14,
+      fontWeight: rowIndex === selectedDay ? "700" : "400",
+      color: rowIndex === selectedDay ? theme.colors.primary : theme.colors.secondary
+    }
+  }, days[rowIndex - mid]));
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: styles.container
-  }, react_1.default.createElement(react_native_1.View, {
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: styles.header,
     onLayout: handleInnerConWidthLayout
-  }, react_1.default.createElement(Button_1.default, {
+  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
     containerStyle: styles.backBtn,
     buttonStyle: {
       paddingTop: 4.5,
@@ -316,37 +234,41 @@ var CustomRange = function (_a) {
     },
     onPress: backFn,
     type: "clear",
-    icon: react_1.default.createElement(TapasIcon_1.default, {
+    icon: /*#__PURE__*/_react.default.createElement(_TapasIcon.default, {
       size: 24,
       color: theme.colors.primary,
       name: "back"
     })
-  }), react_1.default.createElement(react_native_1.View, {
+  }), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: styles.rangeTextCon
-  }, renderRangeText("start"), react_1.default.createElement(react_native_1.Text, {
-    style: __assign(__assign({}, styles.rangeText), {
+  }, renderRangeText("start"), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+    style: {
+      ...styles.rangeText,
       color: theme.colors.secondary
-    })
-  }, "-"), renderRangeText("end")), react_1.default.createElement(react_native_1.View, {
+    }
+  }, "-"), renderRangeText("end")), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: styles.backBtn
-  })), react_1.default.createElement(react_native_1.View, {
+  })), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: styles.main,
     onLayout: handleInnerConHeightLayout
-  }, react_1.default.createElement(react_native_1.View, {
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: styles.listHeader
-  }, renderListHeader(local_1.locales[languageCode].year), renderListHeader(local_1.locales[languageCode].month), renderListHeader(local_1.locales[languageCode].day)), react_1.default.createElement(react_native_1.View, {
+  }, renderListHeader(_local.locales[languageCode].year), renderListHeader(_local.locales[languageCode].month), renderListHeader(_local.locales[languageCode].day)), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: styles.flatlistCon
-  }, react_1.default.createElement(react_native_1.View, {
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     key: "year-grid",
-    style: __assign(__assign({}, styles.scrollCon), {
+    style: {
+      ...styles.scrollCon,
       backgroundColor: theme.colors.grey5,
       borderTopLeftRadius: 8,
       borderBottomLeftRadius: 8
-    })
-  }, react_1.default.createElement(FixedSizeGrid_1.default, {
-    onScroll: function (event) {
-      var scrollTop = event.scrollTop;
-      var index = Math.floor((scrollTop + (innerConHeight - 64) / 2) / rowHeight);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_FixedSizeGrid.default, {
+    onScroll: event => {
+      const {
+        scrollTop
+      } = event;
+      const index = Math.floor((scrollTop + (innerConHeight - 64) / 2) / rowHeight);
       setSelectedYear(index);
     },
     style: {
@@ -360,15 +282,18 @@ var CustomRange = function (_a) {
     rowCount: rowCount.left,
     rowHeight: rowHeight,
     ref: yearGrid
-  }, YearCell)), react_1.default.createElement(react_native_1.View, {
+  }, YearCell)), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     key: "month-grid",
-    style: __assign(__assign({}, styles.scrollCon), {
+    style: {
+      ...styles.scrollCon,
       backgroundColor: theme.colors.grey5
-    })
-  }, react_1.default.createElement(FixedSizeGrid_1.default, {
-    onScroll: function (event) {
-      var scrollTop = event.scrollTop;
-      var index = Math.floor((scrollTop + (innerConHeight - 64) / 2) / rowHeight);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_FixedSizeGrid.default, {
+    onScroll: event => {
+      const {
+        scrollTop
+      } = event;
+      const index = Math.floor((scrollTop + (innerConHeight - 64) / 2) / rowHeight);
       setSelectedMonth(index);
     },
     style: {
@@ -382,17 +307,20 @@ var CustomRange = function (_a) {
     rowCount: rowCount.center,
     rowHeight: rowHeight,
     ref: monthGrid
-  }, MonthCell)), react_1.default.createElement(react_native_1.View, {
+  }, MonthCell)), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     key: "day-grid",
-    style: __assign(__assign({}, styles.scrollCon), {
+    style: {
+      ...styles.scrollCon,
       backgroundColor: theme.colors.grey5,
       borderTopRightRadius: 8,
       borderBottomRightRadius: 8
-    })
-  }, react_1.default.createElement(FixedSizeGrid_1.default, {
-    onScroll: function (event) {
-      var scrollTop = event.scrollTop;
-      var index = Math.floor((scrollTop + (innerConHeight - 64) / 2) / rowHeight);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_FixedSizeGrid.default, {
+    onScroll: event => {
+      const {
+        scrollTop
+      } = event;
+      const index = Math.floor((scrollTop + (innerConHeight - 64) / 2) / rowHeight);
       setSelectedDay(index);
     },
     style: {
@@ -406,20 +334,145 @@ var CustomRange = function (_a) {
     rowCount: rowCount.right,
     rowHeight: rowHeight,
     ref: dayGrid
-  }, DayCell)))), react_1.default.createElement(react_native_1.View, {
+  }, DayCell)))), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
     style: styles.footer
-  }, react_1.default.createElement(Button_1.default, {
+  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
     type: "clear",
-    onPress: function () {
+    onPress: () => {
       setRangeDetail([]);
       setRnage([]);
       // TODO reset sroll
     }
-  }, (_c = local_1.locales[languageCode]) === null || _c === void 0 ? void 0 : _c.reset), curEditDate === "end" ? react_1.default.createElement(Button_1.default, {
-    onPress: function () {
+  }, _local.locales[languageCode]?.reset), curEditDate === "end" ? /*#__PURE__*/_react.default.createElement(_Button.default, {
+    onPress: () => {
       attachComplete && attachComplete(rangeDetail);
     }
-  }, (_d = local_1.locales[languageCode]) === null || _d === void 0 ? void 0 : _d.done) : react_1.default.createElement(Button_1.default, {
+  }, _local.locales[languageCode]?.done) : /*#__PURE__*/_react.default.createElement(_Button.default, {
+    onPress: () => setCurEditDate("end")
+  }, _local.locales[languageCode]?.next)));
+};
+const styles = _reactNative.StyleSheet.create({
+  container: {
+    display: "flex",
+    flexDirection: "column",
+    flexGrow: 1,
+    overflow: "hidden"
+  },
+  header: {
+    display: "flex",
+    flexDirection: "row",
+    justifyContent: "flex-start",
+    marginLeft: 8,
+    marginRight: 8,
+    marginTop: 16,
+    marginBottom: 8,
+    gap: 8,
+    height: 40,
+    overflow: "hidden"
+  },
+  backBtn: {
+    width: 40,
+    height: 40
+  },
+  rangeTextCon: {
+    height: 40,
+    display: "flex",
+    flexDirection: "row",
+    flexGrow: 1,
+    flex: 1,
+    overflow: "hidden"
+  },
+  padding4: {
+    paddingLeft: 4,
+    paddingRight: 4
+  },
+  range1: {
+    display: "flex",
+    flexDirection: "row",
+    flexGrow: 1,
+    justifyContent: "flex-end",
+    height: 40,
+    overflow: "hidden"
+  },
+  range2: {
+    display: "flex",
+    flexDirection: "row",
+    flexGrow: 1,
+    justifyContent: "flex-start",
+    height: 40,
+    overflow: "hidden"
+  },
+  rangeText: {
+    alignSelf: "center",
+    fontSize: 16,
+    fontWeight: "700",
+    overflow: "hidden"
+  },
+  main: {
+    display: "flex",
+    flexDirection: "column",
+    flexGrow: 1,
+    marginLeft: 16,
+    marginRight: 16,
+    overflow: "hidden"
+  },
+  footer: {
+    display: "flex",
+    flexDirection: "row",
+    height: 40,
+    marginLeft: 16,
+    marginBottom: 16,
+    marginRight: 16,
+    marginTop: 8,
+    overflow: "hidden",
+    gap: 8,
+    justifyContent: "flex-end"
+  },
+  flatlistCon: {
+    display: "flex",
+    flexDirection: "row",
+    justifyContent: "space-between",
+    flexGrow: 1,
+    marginBottom: 8,
+    marginTop: 8,
+    gap: 1,
+    height: 0,
+    overflow: "hidden"
+  },
+  scrollCon: {
+    paddingLeft: 12,
+    paddingRight: 12,
+    paddingTop: 8,
+    paddingBottom: 8
+  },
+  listHeader: {
+    height: 28,
+    display: "flex",
+    flexDirection: "row",
+    justifyContent: "space-between",
+    gap: 1,
+    overflow: "hidden"
+  },
+  listHeadertext: {
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    height: 14,
+    marginTop: 14,
+    textAlign: "center",
+    fontSize: 12,
+    fontWeight: "700"
+  },
+  cell: {
+    display: "flex",
+    flexDirection: "column",
+    height: 40,
+    justifyContent: "center",
+    textAlign: "center"
+  }
+});
+var _default = exports.default = (0, _themed.withTheme)(CustomRange);
+//# sourceMappingURL=CustomRange.js.map0 ? void 0 : _d.done) : react_1.default.createElement(Button_1.default, {
     onPress: function () {
       return setCurEditDate("end");
     }