@trionesdev/antd-mobile-react 0.0.2-beta.7 → 0.0.2-beta.9

package/dist/Popup/popup.js

@@ -0,0 +1,87 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { memo, useEffect, useState } from 'react';
+import classNames from 'classnames';
+import { CloseOutline } from '@trionesdev/antd-mobile-icons-react';
+import Overlay from "../Overlay";
+import SafeArea from "../SafeArea";
+var cls = 'triones-antm-popup';
+export var Popup = /*#__PURE__*/memo(function (_ref) {
+  var _ref$open = _ref.open,
+    open = _ref$open === void 0 ? false : _ref$open,
+    title = _ref.title,
+    _ref$position = _ref.position,
+    position = _ref$position === void 0 ? 'bottom' : _ref$position,
+    _ref$closable = _ref.closable,
+    closable = _ref$closable === void 0 ? false : _ref$closable,
+    _ref$closeIconPositio = _ref.closeIconPosition,
+    closeIconPosition = _ref$closeIconPositio === void 0 ? 'top-right' : _ref$closeIconPositio,
+    closeIcon = _ref.closeIcon,
+    _ref$overlayClosable = _ref.overlayClosable,
+    overlayClosable = _ref$overlayClosable === void 0 ? true : _ref$overlayClosable,
+    _ref$destroyOnHidden = _ref.destroyOnHidden,
+    destroyOnHidden = _ref$destroyOnHidden === void 0 ? false : _ref$destroyOnHidden,
+    onClose = _ref.onClose,
+    afterClose = _ref.afterClose,
+    afterOpenChange = _ref.afterOpenChange,
+    className = _ref.className,
+    style = _ref.style,
+    _ref$round = _ref.round,
+    round = _ref$round === void 0 ? false : _ref$round,
+    _ref$safeArea = _ref.safeArea,
+    safeArea = _ref$safeArea === void 0 ? true : _ref$safeArea,
+    zIndex = _ref.zIndex,
+    children = _ref.children,
+    styles = _ref.styles;
+  var _useState = useState(open || false),
+    _useState2 = _slicedToArray(_useState, 2),
+    internalOpen = _useState2[0],
+    setInternalOpen = _useState2[1];
+  var handleClose = function handleClose() {
+    setInternalOpen(false);
+    onClose === null || onClose === void 0 || onClose();
+  };
+  useEffect(function () {
+    if (open === undefined) {
+      return;
+    }
+    if (open !== internalOpen) {
+      setInternalOpen(open);
+    }
+  }, [open]);
+  var popupInner = /*#__PURE__*/React.createElement(React.Fragment, null, closable && /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(cls, "-close"), "".concat(cls, "-close-").concat(closeIconPosition)),
+    onClick: handleClose
+  }, closeIcon || /*#__PURE__*/React.createElement(CloseOutline, null)), title && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(cls, "-header"),
+    style: styles === null || styles === void 0 ? void 0 : styles.header
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(cls, "-title"),
+    style: styles === null || styles === void 0 ? void 0 : styles.title
+  }, title)), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(cls, "-body"),
+    style: styles === null || styles === void 0 ? void 0 : styles.body
+  }, children));
+  return /*#__PURE__*/React.createElement(Overlay, {
+    open: internalOpen,
+    onClose: handleClose,
+    closeOnOverlayClick: overlayClosable,
+    zIndex: zIndex,
+    className: classNames("".concat(cls, "-overlay"), "".concat(cls, "-").concat(position)),
+    afterClose: afterClose,
+    afterOpenChange: afterOpenChange,
+    destroyOnHidden: destroyOnHidden,
+    style: styles === null || styles === void 0 ? void 0 : styles.overlay
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(cls, "-container"), _defineProperty({}, "".concat(cls, "-round"), round)),
+    style: styles === null || styles === void 0 ? void 0 : styles.container
+  }, ['top', 'bottom', 'left', 'right'].includes(position) ? /*#__PURE__*/React.createElement(SafeArea, null, popupInner) : popupInner));
+});

package/dist/Popup/style.scss

@@ -0,0 +1,129 @@
+@use "../style/variable" as variable;
+
+$trionesPopupCls: 'triones-antm-popup';
+
+.#{$trionesPopupCls} {
+  &-overlay {
+    display: flex;
+
+    .#{$trionesPopupCls} {
+      &-container {
+        position: relative;
+        background-color: white;
+
+        .#{$trionesPopupCls} {
+          &-header {
+            padding-block: variable.$trionesPaddingContentVertical;
+            padding-inline: variable.$trionesPaddingContentHorizontal;
+          }
+        }
+      }
+
+      &-title {
+        text-align: center;
+      }
+
+      &-close {
+        position: absolute;
+
+        &-top-right {
+          top: variable.$trionesPaddingContentVertical;
+          right: variable.$trionesPaddingContentHorizontal;
+        }
+
+        &-top-left {
+          top: variable.$trionesPaddingContentVertical;
+          left: variable.$trionesPaddingContentHorizontal;
+        }
+      }
+    }
+  }
+
+  &-top {
+    flex-direction: column;
+    align-items: flex-start;
+    justify-content: flex-start;
+
+    .#{$trionesPopupCls} {
+      &-container {
+        width: 100%;
+        min-height: 20%;
+        max-height: 90%;
+      }
+
+      &-round {
+        border-bottom-left-radius: variable.$trionesBorderRadius;
+        border-bottom-right-radius: variable.$trionesBorderRadius;
+      }
+    }
+  }
+
+  &-bottom {
+    flex-direction: column;
+    align-items: flex-end;
+    justify-content: flex-end;
+
+    .#{$trionesPopupCls} {
+      &-container {
+        width: 100%;
+        min-height: 20%;
+        max-height: 90%;
+      }
+
+      &-round {
+        border-top-left-radius: variable.$trionesBorderRadius;
+        border-top-right-radius: variable.$trionesBorderRadius;
+      }
+    }
+  }
+
+  &-left {
+    flex-direction: row;
+    justify-content: flex-start;
+
+    .#{$trionesPopupCls} {
+      &-container {
+        height: 100%;
+        min-width: 20%;
+        max-width: 90%;
+      }
+
+      &-round {
+        border-top-right-radius: variable.$trionesBorderRadius;
+        border-bottom-right-radius: variable.$trionesBorderRadius;
+      }
+    }
+  }
+
+
+  &-right {
+    flex-direction: row;
+    justify-content: flex-end;
+
+    .#{$trionesPopupCls} {
+      &-container {
+        height: 100%;
+        min-width: 20%;
+        max-width: 90%;
+      }
+
+      &-round {
+        border-top-left-radius: variable.$trionesBorderRadius;
+        border-bottom-left-radius: variable.$trionesBorderRadius;
+      }
+    }
+  }
+
+  &-center {
+    justify-content: center;
+    align-items: center;
+
+    .#{$trionesPopupCls} {
+      &-round {
+        border-radius: variable.$trionesBorderRadius;
+      }
+    }
+  }
+
+
+}

package/dist/ScrollView/index.d.ts

@@ -1,3 +1,4 @@
-import { ScrollView, ScrollViewProps } from '@trionesdev/antd-mobile-base-react';
+import { ScrollView } from "./scroll-view";
+import type { ScrollViewProps } from "./types";
 export type { ScrollViewProps };
 export default ScrollView;

package/dist/ScrollView/index.js

@@ -1,2 +1,2 @@
-import { ScrollView } from '@trionesdev/antd-mobile-base-react';
+import { ScrollView } from "./scroll-view";
 export default ScrollView;

package/dist/ScrollView/scroll-view.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import './style.scss';
+import { ScrollViewProps } from "./types";
+export declare const ScrollView: FC<ScrollViewProps>;

package/dist/ScrollView/scroll-view.js

@@ -0,0 +1,55 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import classNames from 'classnames';
+import React, { forwardRef, useEffect, useRef } from 'react';
+import "./style.scss";
+export var ScrollView = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    style = _ref.style,
+    children = _ref.children,
+    _onScroll = _ref.onScroll,
+    _ref$showScrollbar = _ref.showScrollbar,
+    showScrollbar = _ref$showScrollbar === void 0 ? true : _ref$showScrollbar,
+    scrollX = _ref.scrollX,
+    scrollY = _ref.scrollY,
+    scrollTop = _ref.scrollTop,
+    _ref$upperThreshold = _ref.upperThreshold,
+    upperThreshold = _ref$upperThreshold === void 0 ? 50 : _ref$upperThreshold,
+    _ref$lowerThreshold = _ref.lowerThreshold,
+    lowerThreshold = _ref$lowerThreshold === void 0 ? 50 : _ref$lowerThreshold,
+    onScrollToUpper = _ref.onScrollToUpper,
+    onScrollToLower = _ref.onScrollToLower;
+  var scrollRef = useRef();
+  var handleRef = function handleRef(node) {
+    scrollRef.current = node;
+    if (ref) {
+      if (typeof ref === 'function') {
+        ref(node);
+      } else {
+        ref.current = node;
+      }
+    }
+  };
+  useEffect(function () {
+    if (scrollTop !== undefined) {}
+  }, [scrollTop]);
+  var trionesScrollViewCls = 'triones-antm-scroll-view';
+  return /*#__PURE__*/React.createElement("div", {
+    ref: handleRef,
+    className: classNames("".concat(trionesScrollViewCls), className, _defineProperty(_defineProperty(_defineProperty({}, "".concat(trionesScrollViewCls, "-scroll-x"), scrollX), "".concat(trionesScrollViewCls, "-scroll-y"), scrollY), "".concat(trionesScrollViewCls, "-scroll-bar-hidden"), !showScrollbar)),
+    style: style,
+    onScroll: function onScroll(e) {
+      // console.log(e);
+      _onScroll === null || _onScroll === void 0 || _onScroll({
+        detail: {
+          scrollLeft: e.target.scrollLeft,
+          scrollTop: e.target.scrollTop,
+          scrollHeight: e.target.scrollHeight,
+          scrollWidth: e.target.scrollWidth
+        }
+      });
+    }
+  }, children);
+});

package/dist/ScrollView/style.scss

@@ -0,0 +1,19 @@
+$trionesScrollViewCls: 'triones-antm-scroll-view';
+
+.#{$trionesScrollViewCls} {
+  scrollbar-width: thin;
+
+  &-scroll-x {
+    overflow-x: auto;
+    overflow-y: hidden;
+  }
+
+  &-scroll-y {
+    overflow-x: hidden;
+    overflow-y: auto;
+  }
+
+  &-scroll-bar-hidden {
+    scrollbar-width: none;
+  }
+}

package/dist/ScrollView/types.d.ts

@@ -0,0 +1,26 @@
+import React, { ReactNode } from "react";
+export type ScrollEvent = {
+    target?: any;
+    detail: {
+        deltaX?: number;
+        deltaY?: number;
+        scrollLeft?: number;
+        scrollTop?: number;
+        scrollHeight?: number;
+        scrollWidth?: number;
+    };
+};
+export type ScrollViewProps = {
+    className?: string;
+    style?: React.CSSProperties;
+    children?: ReactNode;
+    onScroll?: (e: ScrollEvent) => void;
+    showScrollbar?: boolean;
+    scrollX?: boolean;
+    scrollY?: boolean;
+    scrollTop?: number;
+    upperThreshold?: number;
+    lowerThreshold?: number;
+    onScrollToUpper?: () => void;
+    onScrollToLower?: () => void;
+};

package/dist/ScrollView/types.js

@@ -0,0 +1 @@
+export {};

package/dist/SideBar/index.d.ts

@@ -1,3 +1,3 @@
-import { SideBar, SideBarProps } from './side-bar';
+import { SideBar, SideBarProps } from "./side-bar";
 export type { SideBarProps };
 export default SideBar;

package/dist/Toast/toast-modal.js

@@ -12,9 +12,9 @@ import { memo, useEffect, useMemo, useRef, useState } from "react";
 import classNames from "classnames";
 import React from "react";
 import "./style.scss";
-import Mask from "../Mask";
-import { CheckOutline, CloseOutline } from "../../../antd-mobile-icons-react";
 import { SpinLoading } from "../index";
+import Overlay from "../Overlay";
+import { CheckOutline, CloseOutline } from "@trionesdev/antd-mobile-icons-react";
 var toastCls = "triones-antm-toast";
 export var ToastModal = /*#__PURE__*/memo(function (_ref) {
   var open = _ref.open,
@@ -84,10 +84,10 @@ export var ToastModal = /*#__PURE__*/memo(function (_ref) {
         return '50%';
     }
   }, [position]);
-  return /*#__PURE__*/React.createElement(Mask, {
+  return /*#__PURE__*/React.createElement(Overlay, {
     className: maskClassName,
     open: internalOpen,
-    onMaskClick: function onMaskClick() {
+    onClick: function onClick() {
       if (maskClosable) {
         setInternalOpen(false);
       }

package/dist/index.d.ts

@@ -10,14 +10,16 @@ export { default as Button } from './Button';
 export type { ButtonProps } from './Button';
 export { default as Calendar, CalendarGrid, TouchableCalendarGrid, } from './Calendar';
 export type { CalendarGridProps, CalendarProps } from './Calendar';
-export { default as CalendarDatetimePicker } from './CalendarDatetimePicker';
-export type { CalendarDatetimePickerProps } from './CalendarDatetimePicker';
-export { default as CalendarPicker } from './CalendarPicker';
-export type { CalendarPickerProps } from './CalendarPicker';
+export { default as CalendarDatetimePopup } from './CalendarDatetimePopup';
+export type { CalendarDatetimePopupProps } from './CalendarDatetimePopup';
+export { default as CalendarPopup } from './CalendarPopup';
+export type { CalendarPopupProps } from './CalendarPopup';
 export { default as Card } from './Card';
 export type { CardProps } from './Card';
 export { default as CascaderPicker } from './CascaderPicker';
 export type { CascaderPickerProps } from './CascaderPicker';
+export { default as CascaderPopup } from './CascaderPopup';
+export type { CascaderPopupProps } from './CascaderPopup';
 export { default as CascaderView } from './CascaderView';
 export type { CascaderViewProps } from './CascaderView';
 export { default as Cell } from './Cell';
@@ -52,12 +54,12 @@ export { default as Input } from './Input';
 export type { InputOPTProps, InputPasswordProps, InputProps, InputTextareaProps } from './Input';
 export { default as InputNumber } from './InputNumber';
 export type { InputNumberProps } from './InputNumber';
-export { default as Mask } from "./Mask";
-export type { MaskProps } from "./Mask";
 export { default as NavBar } from './NavBar';
 export type { NavBarProps } from './NavBar';
 export { default as NoticeBar } from './NoticeBar';
 export type { NoticeBarProps } from './NoticeBar';
+export { default as Overlay } from './Overlay';
+export type { OverlayProps } from './Overlay';
 export { default as PageIndicator } from './PageIndicator';
 export type { PageIndicatorProps } from './PageIndicator';
 export { default as Picker } from './Picker';

package/dist/index.js

@@ -4,10 +4,11 @@ export { default as Avatar } from "./Avatar";
 export { default as Badge } from "./Badge";
 export { default as Button } from "./Button";
 export { default as Calendar, CalendarGrid, TouchableCalendarGrid } from "./Calendar";
-export { default as CalendarDatetimePicker } from "./CalendarDatetimePicker";
-export { default as CalendarPicker } from "./CalendarPicker";
+export { default as CalendarDatetimePopup } from "./CalendarDatetimePopup";
+export { default as CalendarPopup } from "./CalendarPopup";
 export { default as Card } from "./Card";
 export { default as CascaderPicker } from "./CascaderPicker";
+export { default as CascaderPopup } from "./CascaderPopup";
 export { default as CascaderView } from "./CascaderView";
 export { default as Cell } from "./Cell";
 export { default as Checkbox } from "./Checkbox";
@@ -25,9 +26,9 @@ export { default as ImagesPreview } from "./ImagesPreview";
 export { default as ImagesWall } from "./ImagesWall";
 export { default as Input } from "./Input";
 export { default as InputNumber } from "./InputNumber";
-export { default as Mask } from "./Mask";
 export { default as NavBar } from "./NavBar";
 export { default as NoticeBar } from "./NoticeBar";
+export { default as Overlay } from "./Overlay";
 export { default as PageIndicator } from "./PageIndicator";
 export { default as Picker } from "./Picker";
 export { default as PickerView } from "./PickerView";

package/dist/utils/use-isomorphic-update-layout-effect.d.ts

@@ -1,2 +1,2 @@
 /// <reference types="react" />
-export declare const useIsomorphicUpdateLayoutEffect: typeof import("react").useLayoutEffect | typeof import("react").useEffect;
+export declare const useIsomorphicUpdateLayoutEffect: typeof import("react").useEffect | typeof import("react").useLayoutEffect;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trionesdev/antd-mobile-react",
-  "version": "0.0.2-beta.7",
+  "version": "0.0.2-beta.9",
   "description": "antd mobile react ",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -79,7 +79,7 @@
     "father": "^4.6.9",
     "husky": "^8.0.1",
     "lint-staged": "^13.0.3",
-    "lodash-es": "^4.17.21",
+    "lodash-es": "^4.17.23",
     "prettier": "^3.4.2",
     "prettier-plugin-organize-imports": "^4.1.0",
     "prettier-plugin-packagejson": "^2.5.6",
@@ -89,16 +89,15 @@
     "stylelint": "^16.12.0"
   },
   "dependencies": {
-    "@trionesdev/antd-mobile-base-react": "^0.0.2-beta.7",
+    "@trionesdev/antd-mobile-base-react": "^0.0.2-beta.9",
     "ahooks": "^3.8.4",
     "crypto-js": "^4.2.0",
-    "rc-field-form": "^2.7.0",
-    "rc-util": "^5.44.3",
-    "runes2": "^1.1.4"
+    "dayjs": "^1.11.19",
+    "rc-field-form": "^2.7.0"
   },
   "optionalDependencies": {
     "@trionesdev/antd-mobile-base-react": "workspace:*",
-    "@trionesdev/antd-mobile-icons-react": "0.0.2-beta.7"
+    "@trionesdev/antd-mobile-icons-react": "0.0.2-beta.9"
   },
-  "gitHead": "dda211e5c6e5ddc80ba9045b0cdec0b4b5297e4e"
+  "gitHead": "c062f3bd8651ea933f9385279c05a1ab0245b2b8"
 }

package/dist/CalendarPicker/calendar-picker.d.ts

@@ -1,4 +0,0 @@
-import { FC } from 'react';
-import './style.scss';
-import { CalendarPickerProps } from './types';
-export declare const CalendarPicker: FC<CalendarPickerProps>;

package/dist/CalendarPicker/calendar-range-picker.d.ts

@@ -1,4 +0,0 @@
-import { FC } from "react";
-import "./style.scss";
-import { CalendarPickerRangeProps } from "./types";
-export declare const CalendarRangePicker: FC<CalendarPickerRangeProps>;

package/dist/CalendarPicker/index.d.ts

@@ -1,9 +0,0 @@
-import { CalendarPicker as InternalCalendarPicker } from "./calendar-picker";
-import { CalendarRangePicker } from "./calendar-range-picker";
-import { CalendarPickerProps } from "./types";
-type CompoundedComponent = typeof InternalCalendarPicker & {
-    Range: typeof CalendarRangePicker;
-};
-declare const CalendarPicker: CompoundedComponent;
-export type { CalendarPickerProps };
-export default CalendarPicker;

package/dist/CalendarPicker/index.js

@@ -1,5 +0,0 @@
-import { CalendarPicker as InternalCalendarPicker } from "./calendar-picker";
-import { CalendarRangePicker } from "./calendar-range-picker";
-var CalendarPicker = InternalCalendarPicker;
-CalendarPicker.Range = CalendarRangePicker;
-export default CalendarPicker;

package/dist/Mask/index.d.ts

@@ -1,3 +0,0 @@
-import { Mask, MaskProps } from "@trionesdev/antd-mobile-base-react";
-export type { MaskProps };
-export default Mask;

package/dist/Mask/index.js

@@ -1,2 +0,0 @@
-import { Mask } from "@trionesdev/antd-mobile-base-react";
-export default Mask;