@beppla/tapas-ui 1.0.70 → 1.0.72

package/module/Calendar/Calendar.base.js

@@ -1,198 +1,274 @@
-"use strict";
+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 { Divider, withTheme } from "@rneui/themed";
+import { SupportLanguage } from "./types";
+import { View, StyleSheet, Text } from "react-native";
+import { Calendar, LocaleConfig } from "react-native-calendars";
+import Button from "../Button/Button";
+import { locales } from "./local";
+import React, { forwardRef, useRef, useState } from "react";
+import { formatDate, formatTitle } from "./helper";
+import CustomIcon from "../Icons/TapasIcon";
 
-var __assign = this && this.__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 = this && this.__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 = this && this.__setModuleDefault || (Object.create ? function (o, v) {
-  Object.defineProperty(o, "default", {
-    enumerable: true,
-    value: v
-  });
-} : function (o, v) {
-  o["default"] = v;
-});
-var __importStar = this && this.__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 __rest = this && this.__rest || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
-};
-var __importDefault = this && this.__importDefault || function (mod) {
-  return mod && mod.__esModule ? mod : {
-    "default": mod
-  };
-};
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var themed_1 = require("@rneui/themed");
-var types_1 = require("./types");
-var react_native_1 = require("react-native");
-var react_native_calendars_1 = require("react-native-calendars");
-var Button_1 = __importDefault(require("../Button/Button"));
-var local_1 = require("./local");
-var react_1 = __importStar(require("react"));
-var helper_1 = require("./helper");
-var TapasIcon_1 = __importDefault(require("../Icons/TapasIcon"));
 // 安全地设置 LocaleConfig.locales
 try {
-  if (react_native_calendars_1.LocaleConfig && typeof react_native_calendars_1.LocaleConfig === 'object') {
-    react_native_calendars_1.LocaleConfig.locales = react_native_calendars_1.LocaleConfig.locales || {};
-    Object.assign(react_native_calendars_1.LocaleConfig.locales, local_1.locales);
+  if (LocaleConfig && typeof LocaleConfig === 'object') {
+    LocaleConfig.locales = LocaleConfig.locales || {};
+    Object.assign(LocaleConfig.locales, locales);
   }
 } catch (error) {
   console.warn('Could not set LocaleConfig.locales:', error);
 }
-var CalendarBase = function (_a) {
-  var _b;
-  var _c = _a.languageCode,
-    languageCode = _c === void 0 ? types_1.SupportLanguage.en : _c,
-    current = _a.current,
-    _d = _a.hideDayNames,
-    hideDayNames = _d === void 0 ? false : _d,
-    theme = _a.theme,
-    defaultSelectedDate = _a.defaultSelectedDate,
-    innerConWidth = _a.innerConWidth,
-    customRangeFn = _a.customRangeFn,
-    _e = _a.hideRange,
-    hideRange = _e === void 0 ? false : _e,
-    attachSelectedDate = _a.attachSelectedDate,
-    attachCancel = _a.attachCancel,
-    rest = __rest(_a, ["languageCode", "current", "hideDayNames", "theme", "defaultSelectedDate", "innerConWidth", "customRangeFn", "hideRange", "attachSelectedDate", "attachCancel"]);
-  var customHeaderProps = (0, react_1.useRef)();
-  var _f = (0, react_1.useState)(defaultSelectedDate),
-    selected = _f[0],
-    setSelected = _f[1];
-  var _g = (0, react_1.useState)((0, helper_1.formatTitle)(current, languageCode)),
-    title = _g[0],
-    setTitle = _g[1];
+const CalendarBase = ({
+  languageCode = SupportLanguage.en,
+  current,
+  hideDayNames = false,
+  theme,
+  defaultSelectedDate,
+  innerConWidth,
+  customRangeFn,
+  hideRange = false,
+  attachSelectedDate,
+  attachCancel,
+  ...rest
+}) => {
+  const customHeaderProps = useRef();
+  const [selected, setSelected] = useState(defaultSelectedDate);
+  const [title, setTitle] = useState(formatTitle(current, languageCode));
+
   // 安全地设置 defaultLocale
   try {
-    if (react_native_calendars_1.LocaleConfig && typeof react_native_calendars_1.LocaleConfig === 'object') {
-      react_native_calendars_1.LocaleConfig.defaultLocale = languageCode;
+    if (LocaleConfig && typeof LocaleConfig === 'object') {
+      LocaleConfig.defaultLocale = languageCode;
     }
   } catch (error) {
     console.warn('Could not set LocaleConfig.defaultLocale:', error);
   }
-  var setCustomHeaderNewMonth = function (next) {
-    var _a, _b;
-    if (next === void 0) {
-      next = false;
-    }
-    var add = next ? 1 : -1;
-    var month = new Date((_a = customHeaderProps === null || customHeaderProps === void 0 ? void 0 : customHeaderProps.current) === null || _a === void 0 ? void 0 : _a.month);
-    var newMonth = new Date(month.setMonth(month.getMonth() + add));
-    (_b = customHeaderProps === null || customHeaderProps === void 0 ? void 0 : customHeaderProps.current) === null || _b === void 0 ? void 0 : _b.addMonth(add);
-    setTitle((0, helper_1.formatTitle)((0, helper_1.formatDate)(newMonth), languageCode));
+  const setCustomHeaderNewMonth = (next = false) => {
+    const add = next ? 1 : -1;
+    const month = new Date(customHeaderProps?.current?.month);
+    const newMonth = new Date(month.setMonth(month.getMonth() + add));
+    customHeaderProps?.current?.addMonth(add);
+    setTitle(formatTitle(formatDate(newMonth), languageCode));
   };
-  var moveNext = function () {
+  const moveNext = () => {
     setCustomHeaderNewMonth(true);
   };
-  var movePrevious = function () {
+  const movePrevious = () => {
     setCustomHeaderNewMonth(false);
   };
-  var CustomHeader = (0, react_1.forwardRef)(function (props, ref) {
-    var _a, _b;
+  const CustomHeader = /*#__PURE__*/forwardRef((props, ref) => {
     customHeaderProps.current = props;
-    return react_1.default.createElement(react_1.default.Fragment, null, react_1.default.createElement(react_native_1.View, __assign({
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, _extends({
       ref: ref
     }, props, {
       style: styles.headerCon
-    }), react_1.default.createElement(react_native_1.View, {
-      style: __assign(__assign({}, styles.header), {
+    }), /*#__PURE__*/React.createElement(View, {
+      style: {
+        ...styles.header,
         width: innerConWidth
-      })
-    }, react_1.default.createElement(react_native_1.Text, {
-      style: __assign(__assign({}, styles.title), {
+      }
+    }, /*#__PURE__*/React.createElement(Text, {
+      style: {
+        ...styles.title,
         color: theme.colors.primary
-      })
-    }, title), react_1.default.createElement(react_native_1.View, {
+      }
+    }, title), /*#__PURE__*/React.createElement(View, {
       style: styles.rightCon
-    }, react_1.default.createElement(react_native_1.View, {
+    }, /*#__PURE__*/React.createElement(View, {
       style: styles.arrow
-    }, react_1.default.createElement(Button_1.default, {
+    }, /*#__PURE__*/React.createElement(Button, {
       type: "clear",
-      icon: react_1.default.createElement(TapasIcon_1.default, {
+      icon: /*#__PURE__*/React.createElement(CustomIcon, {
         name: "chevron_left",
         size: 20,
         color: theme.colors.primary
       }),
       onPress: movePrevious
-    })), react_1.default.createElement(react_native_1.Text, {
-      style: __assign(__assign({}, styles.today), {
+    })), /*#__PURE__*/React.createElement(Text, {
+      style: {
+        ...styles.today,
         color: theme.colors.primary
-      })
-    }, local_1.locales[languageCode].today), react_1.default.createElement(react_native_1.View, {
+      }
+    }, locales[languageCode].today), /*#__PURE__*/React.createElement(View, {
       style: styles.arrow
-    }, react_1.default.createElement(Button_1.default, {
+    }, /*#__PURE__*/React.createElement(Button, {
       buttonStyle: styles.arrow,
       type: "clear",
-      icon: react_1.default.createElement(TapasIcon_1.default, {
+      icon: /*#__PURE__*/React.createElement(CustomIcon, {
         name: "chevron_right",
         size: 20,
         color: theme.colors.primary
       }),
       onPress: moveNext
-    }))))), !hideDayNames && react_1.default.createElement(react_native_1.View, {
+    }))))), !hideDayNames && /*#__PURE__*/React.createElement(View, {
       style: styles.dayNames
-    }, (_b = (_a = local_1.locales[languageCode]) === null || _a === void 0 ? void 0 : _a.dayNamesShort) === null || _b === void 0 ? void 0 : _b.map(function (str) {
-      return react_1.default.createElement(react_native_1.Text, {
-        key: str,
-        style: __assign(__assign({}, styles.dayNameCell), {
-          color: theme.colors.secondary
-        })
-      }, str);
-    })));
+    }, locales[languageCode]?.dayNamesShort?.map(str => /*#__PURE__*/React.createElement(Text, {
+      key: str,
+      style: {
+        ...styles.dayNameCell,
+        color: theme.colors.secondary
+      }
+    }, str))));
   });
-  return react_1.default.createElement(react_native_1.View, {
+  return /*#__PURE__*/React.createElement(View, {
     style: styles.container
-  }, react_1.default.createElement(react_native_1.View, {
+  }, /*#__PURE__*/React.createElement(View, {
     style: styles.calendarCon
-  }, react_1.default.createElement(react_native_calendars_1.Calendar, __assign({}, rest, {
+  }, /*#__PURE__*/React.createElement(Calendar, _extends({}, rest, {
     // Customize the appearance of the calendar
-    hideArrows: true,
+    hideArrows: true
+    // Specify the current date
+    ,
+    current: current,
+    Callback: true,
+    that: true,
+    gets: true,
+    called: true,
+    when: true,
+    the: true,
+    user: true,
+    selects: true,
+    a: true,
+    day: true,
+    onDayPress: day => {
+      if (day.dateString !== selected) {
+        setSelected(day.dateString);
+        attachSelectedDate && attachSelectedDate(day.dateString);
+      } else {
+        setSelected('');
+        attachSelectedDate && attachSelectedDate('');
+      }
+    }
+    // Mark specific dates as marked
+    ,
+    markedDates: {
+      [selected]: {
+        selected: true,
+        // disableTouchEvent: true,
+        selectedColor: theme.colors.primary
+      },
+      [current]: {
+        marked: true,
+        selected: current === selected,
+        selectedColor: theme.colors.primary,
+        dotColor: theme.colors.colorTextAccent
+      }
+    },
+    customHeader: CustomHeader,
+    enableSwipeMonths: true,
+    hideExtraDays: true,
+    theme: {
+      textDayFontSize: 14,
+      // day font size
+      textDayHeaderFontSize: 14,
+      // day of the week font size
+      textDayFontWeight: "400",
+      dayTextColor: theme.colors.primary,
+      todayTextColor: theme.colors.primary,
+      // the color of the section titles
+      textSectionTitleDisabledColor: "gray" // the color of the section titles when disabled
+    }
+  }))), /*#__PURE__*/React.createElement(Divider, {
+    style: styles.divider
+  }), /*#__PURE__*/React.createElement(View, {
+    style: styles.footer
+  }, /*#__PURE__*/React.createElement(Button, {
+    type: "clear",
+    onPress: () => {
+      setSelected("");
+      attachCancel && attachCancel();
+    }
+  }, locales[languageCode].clear), !hideRange && /*#__PURE__*/React.createElement(Button, {
+    type: "clear",
+    onPress: customRangeFn
+  }, locales[languageCode].range)));
+};
+const styles = StyleSheet.create({
+  container: {
+    display: "flex",
+    flexDirection: "column",
+    flexGrow: 1,
+    width: "100%",
+    overflow: "hidden",
+    paddingTop: 16,
+    paddingBottom: 16
+  },
+  calendarCon: {
+    display: "flex",
+    flexDirection: "column",
+    flexGrow: 1,
+    overflow: "hidden"
+  },
+  headerCon: {
+    display: "flex",
+    height: 40,
+    width: "100%",
+    flexDirection: "row",
+    justifyContent: "center"
+  },
+  header: {
+    display: "flex",
+    height: 40,
+    flexDirection: "row",
+    justifyContent: "space-between",
+    width: "100%"
+  },
+  title: {
+    fontSize: 16,
+    fontWeight: "700",
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center"
+  },
+  arrow: {
+    alignSelf: "center"
+  },
+  today: {
+    fontSize: 14,
+    fontWeight: "600",
+    display: "flex",
+    minWidth: 56,
+    textAlign: "center",
+    flexDirection: "column",
+    justifyContent: "center",
+    marginLeft: 12,
+    marginRight: 12
+  },
+  rightCon: {
+    display: "flex",
+    flexDirection: "row",
+    justifyContent: "flex-end",
+    flexGrow: 1,
+    marginRight: -16
+  },
+  divider: {
+    // marginTop: 48,
+  },
+  footer: {
+    display: "flex",
+    flexDirection: "row",
+    justifyContent: "flex-end",
+    height: 40,
+    marginLeft: 8,
+    marginRight: 8,
+    marginTop: 8,
+    gap: 8
+  },
+  dayNames: {
+    display: "flex",
+    flexDirection: "row",
+    width: "100%",
+    justifyContent: "space-around",
+    marginTop: 7,
+    marginBottom: 7
+  },
+  dayNameCell: {
+    alignItems: "center",
+    fontWeight: "400",
+    fontSize: 14
+  }
+});
+export default withTheme(CalendarBase);
     // Specify the current date
     current: current,
     Callback: true,
@@ -340,4 +416,3 @@ var styles = react_native_1.StyleSheet.create({
   }
 });
 exports.default = (0, themed_1.withTheme)(CalendarBase);
-//# sourceMappingURL=Calendar.base.js.map

package/module/Calendar/Calendar.js

@@ -1,89 +1,85 @@
-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 { TabView, withTheme } from "@rneui/themed";
-import React, { useState } from "react";
-import { View, StyleSheet } from "react-native";
-import { SupportLanguage } from "./types";
-import { calcHeaderWidth, formatDate } from "./helper";
-import CustomRange from "./CustomRange";
-import CalendarBase from "./Calendar.base";
-const curDate = new Date();
-const TapasCalendar = ({
-  languageCode = SupportLanguage.en,
-  current = formatDate(curDate),
-  defaultSelectedDate,
-  autoSize = true,
-  width = 360,
-  height = 436,
-  hideDayNames = false,
-  theme,
-  attachSelectedDate,
-  attachCancel,
-  hideRange = false,
-  ...rest
-}) => {
-  const [tabIndex, setTabIndex] = useState(0);
-  const [innerConWidth, setInnerConWidth] = useState(autoSize ? 0 : calcHeaderWidth(width));
+"use strict";
 
-  // Inner Container Layout Event to set grid width and height
-  const handleInnerConLayout = event => {
-    const {
-      width
-    } = event.nativeEvent.layout;
-    if (innerConWidth === 0 && autoSize) {
-      setInnerConWidth(calcHeaderWidth(width));
+var __assign = this && this.__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 /*#__PURE__*/React.createElement(View, {
-    style: {
-      ...styles.container,
-      flexGrow: autoSize ? 1 : undefined,
-      width: autoSize ? undefined : width,
-      height: autoSize ? undefined : height
-    },
-    onLayout: handleInnerConLayout
-  }, /*#__PURE__*/React.createElement(TabView, {
-    value: tabIndex,
-    onChange: setTabIndex,
-    animationType: "spring"
-  }, /*#__PURE__*/React.createElement(TabView.Item, {
-    style: styles.wFull
-  }, /*#__PURE__*/React.createElement(CalendarBase, _extends({}, rest, {
-    defaultSelectedDate: defaultSelectedDate,
-    current: current,
-    languageCode: languageCode,
-    innerConWidth: innerConWidth,
-    customRangeFn: () => setTabIndex(1),
-    hideDayNames: hideDayNames,
-    attachSelectedDate: dateStr => {
-      attachSelectedDate && attachSelectedDate(dateStr);
-    },
-    attachCancel: attachCancel,
-    hideRange: hideRange
-  }))), /*#__PURE__*/React.createElement(TabView.Item, {
-    style: styles.wFull
-  }, /*#__PURE__*/React.createElement(CustomRange, {
-    backFn: () => setTabIndex(0),
-    rangeVal: [],
-    attachComplete: range => {
-      attachSelectedDate && attachSelectedDate(range.map(item => item ? `${item.year}-${item.month}-${item.day}` : ""));
-    },
-    languageCode: languageCode
-  }))));
+  return __assign.apply(this, arguments);
 };
-const styles = StyleSheet.create({
-  container: {
-    display: "flex",
-    flexDirection: "column",
-    flexGrow: 1,
-    width: "100%",
-    overflow: "hidden"
-  },
-  wFull: {
-    width: "100%"
+var __createBinding = this && this.__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 = this && this.__setModuleDefault || (Object.create ? function (o, v) {
+  Object.defineProperty(o, "default", {
+    enumerable: true,
+    value: v
+  });
+} : function (o, v) {
+  o["default"] = v;
+});
+var __importStar = this && this.__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 __rest = this && this.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
+  return t;
+};
+var __importDefault = this && this.__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-export default withTheme(TapasCalendar);
-//# sourceMappingURL=Calendar.js.map,
+var themed_1 = require("@rneui/themed");
+var react_1 = __importStar(require("react"));
+var react_native_1 = require("react-native");
+var types_1 = require("./types");
+var helper_1 = require("./helper");
+var CustomRange_1 = __importDefault(require("./CustomRange"));
+var Calendar_base_1 = __importDefault(require("./Calendar.base"));
+var curDate = new Date();
+var TapasCalendar = function (_a) {
+  var _b = _a.languageCode,
+    languageCode = _b === void 0 ? types_1.SupportLanguage.en : _b,
+    _c = _a.current,
+    current = _c === void 0 ? (0, helper_1.formatDate)(curDate) : _c,
     defaultSelectedDate = _a.defaultSelectedDate,
     _d = _a.autoSize,
     autoSize = _d === void 0 ? true : _d,
@@ -167,4 +163,3 @@ var styles = react_native_1.StyleSheet.create({
   }
 });
 exports.default = (0, themed_1.withTheme)(TapasCalendar);
-//# sourceMappingURL=Calendar.js.map

package/module/Calendar/ConcreteTimeSelector.js

@@ -389,7 +389,6 @@ const styles = StyleSheet.create({
   }
 });
 export default withTheme(ConcreteTimeSelector);
-//# sourceMappingURL=ConcreteTimeSelector.js.map    size: 24,
       color: theme.colors.primary,
       name: "close"
     }),
@@ -562,4 +561,3 @@ var styles = react_native_1.StyleSheet.create({
   }
 });
 exports.default = (0, themed_1.withTheme)(ConcreteTimeSelector);
-//# sourceMappingURL=ConcreteTimeSelector.js.map

package/module/Calendar/CustomRange.js

@@ -546,4 +546,3 @@ var styles = react_native_1.StyleSheet.create({
   }
 });
 exports.default = (0, themed_1.withTheme)(CustomRange);
-//# sourceMappingURL=CustomRange.js.map