react-vant-nova 1.0.0-test

package/lib/submit-bar/SubmitBar.js

@@ -0,0 +1,131 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+function _jsxRuntime() {
+  const data = require("react/jsx-runtime");
+  _jsxRuntime = function () {
+    return data;
+  };
+  return data;
+}
+function _react() {
+  const data = _interopRequireWildcard(require("react"));
+  _react = function () {
+    return data;
+  };
+  return data;
+}
+function _clsx() {
+  const data = _interopRequireDefault(require("clsx"));
+  _clsx = function () {
+    return data;
+  };
+  return data;
+}
+var _ConfigProviderContext = _interopRequireDefault(require("../config-provider/ConfigProviderContext"));
+var _button = _interopRequireDefault(require("../button"));
+var _utils = require("../utils");
+var _getDefaultProps = require("../utils/get-default-props");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const [bem] = (0, _utils.createNamespace)('submit-bar');
+const SubmitBar = p => {
+  const props = (0, _getDefaultProps.mergeProps)(p, {
+    buttonType: 'danger',
+    decimalLength: 2,
+    currency: '¥',
+    safeAreaInsetBottom: true
+  });
+  const {
+    locale
+  } = (0, _react().useContext)(_ConfigProviderContext.default);
+  const renderText = () => {
+    const {
+      price,
+      label,
+      currency,
+      textAlign,
+      suffixLabel,
+      decimalLength
+    } = props;
+    if (typeof +price === 'number') {
+      const pricePair = (+price / 100).toFixed(+decimalLength).split('.');
+      const decimal = decimalLength ? `.${pricePair[1]}` : '';
+      return (0, _jsxRuntime().jsxs)("div", Object.assign({
+        className: (0, _clsx().default)(bem('text')),
+        style: {
+          textAlign
+        }
+      }, {
+        children: [(0, _jsxRuntime().jsx)("span", {
+          children: label || locale.vanSubmitBar.label
+        }), (0, _jsxRuntime().jsxs)("span", Object.assign({
+          className: (0, _clsx().default)(bem('price'))
+        }, {
+          children: [currency, (0, _jsxRuntime().jsx)("span", Object.assign({
+            className: (0, _clsx().default)(bem('price-integer'))
+          }, {
+            children: pricePair[0]
+          })), decimal]
+        })), suffixLabel && (0, _jsxRuntime().jsx)("span", Object.assign({
+          className: (0, _clsx().default)(bem('suffix-label'))
+        }, {
+          children: suffixLabel
+        }))]
+      }));
+    }
+    return null;
+  };
+  const renderTip = () => {
+    const {
+      tip,
+      tipIcon
+    } = props;
+    if (tip) {
+      return (0, _jsxRuntime().jsxs)("div", Object.assign({
+        className: (0, _clsx().default)(bem('tip'))
+      }, {
+        children: [tipIcon && _react().default.cloneElement(tipIcon, {
+          className: (0, _clsx().default)(bem('tip-icon'))
+        }), tip && (0, _jsxRuntime().jsx)("span", Object.assign({
+          className: (0, _clsx().default)(bem('tip-text'))
+        }, {
+          children: tip
+        }))]
+      }));
+    }
+    return null;
+  };
+  const onClickButton = () => props === null || props === void 0 ? void 0 : props.onSubmit();
+  const renderButton = () => {
+    if (props.button) {
+      return props.button;
+    }
+    return (0, _jsxRuntime().jsx)(_button.default, {
+      round: true,
+      type: props.buttonType,
+      text: props.buttonText,
+      className: (0, _clsx().default)(bem('button', props.buttonType)),
+      color: props.buttonColor,
+      loading: props.loading,
+      disabled: props.disabled,
+      onClick: onClickButton
+    });
+  };
+  return (0, _jsxRuntime().jsxs)("div", Object.assign({
+    className: (0, _clsx().default)(props.className, bem(), {
+      'rv-safe-area-bottom': props.safeAreaInsetBottom
+    }),
+    style: props.style
+  }, {
+    children: [props.top, renderTip(), (0, _jsxRuntime().jsxs)("div", Object.assign({
+      className: (0, _clsx().default)(bem('bar'))
+    }, {
+      children: [props.children, renderText(), renderButton()]
+    }))]
+  }));
+};
+var _default = exports.default = SubmitBar;

package/lib/submit-bar/index.d.ts

@@ -0,0 +1,4 @@
+import './style/index.less';
+import SubmitBar from './SubmitBar';
+export { SubmitBar };
+export default SubmitBar;

package/lib/submit-bar/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "SubmitBar", {
+  enumerable: true,
+  get: function () {
+    return _SubmitBar.default;
+  }
+});
+exports.default = void 0;
+require("./style/index.css");
+var _SubmitBar = _interopRequireDefault(require("./SubmitBar"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = _SubmitBar.default;

package/lib/submit-bar/style/index.css

@@ -0,0 +1,84 @@
+:root {
+  --rv-submit-bar-height: 50px;
+  --rv-submit-bar-z-index: 100;
+  --rv-submit-bar-background-color: var(--rv-white);
+  --rv-submit-bar-button-width: 110px;
+  --rv-submit-bar-price-color: var(--rv-danger-color);
+  --rv-submit-bar-price-font-size: var(--rv-font-size-sm);
+  --rv-submit-bar-price-integer-font-size: 20px;
+  --rv-submit-bar-price-font-family: var(--rv-price-integer-font-family);
+  --rv-submit-bar-currency-font-size: var(--rv-font-size-md);
+  --rv-submit-bar-text-color: var(--rv-text-color);
+  --rv-submit-bar-text-font-size: var(--rv-font-size-md);
+  --rv-submit-bar-tip-padding: var(--rv-padding-xs) var(--rv-padding-sm);
+  --rv-submit-bar-tip-font-size: var(--rv-font-size-sm);
+  --rv-submit-bar-tip-line-height: 1.5;
+  --rv-submit-bar-tip-color: #f56723;
+  --rv-submit-bar-tip-background-color: #fff7cc;
+  --rv-submit-bar-tip-icon-size: 12px;
+  --rv-submit-bar-button-height: 40px;
+  --rv-submit-bar-padding: 0 var(--rv-padding-md);
+}
+.rv-submit-bar {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  z-index: var(--rv-submit-bar-z-index);
+  width: 100%;
+  background-color: var(--rv-submit-bar-background-color);
+  user-select: none;
+}
+.rv-submit-bar__tip {
+  padding: var(--rv-submit-bar-tip-padding);
+  color: var(--rv-submit-bar-tip-color);
+  font-size: var(--rv-submit-bar-tip-font-size);
+  line-height: var(--rv-submit-bar-tip-line-height);
+  background-color: var(--rv-submit-bar-tip-background-color);
+}
+.rv-submit-bar__tip-icon {
+  margin-right: var(--rv-padding-base);
+  font-size: var(--rv-submit-bar-tip-icon-size);
+  vertical-align: middle;
+}
+.rv-submit-bar__tip-text {
+  vertical-align: middle;
+}
+.rv-submit-bar__bar {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  height: var(--rv-submit-bar-height);
+  padding: var(--rv-submit-bar-padding);
+  font-size: var(--rv-submit-bar-text-font-size);
+}
+.rv-submit-bar__text {
+  flex: 1;
+  padding-right: var(--rv-padding-sm);
+  color: var(--rv-submit-bar-text-color);
+  text-align: right;
+}
+.rv-submit-bar__text span {
+  display: inline-block;
+}
+.rv-submit-bar__suffix-label {
+  margin-left: var(--rv-padding-base);
+  font-weight: var(--rv-font-weight-bold);
+}
+.rv-submit-bar__price {
+  color: var(--rv-submit-bar-price-color);
+  font-weight: var(--rv-font-weight-bold);
+  font-size: var(--rv-submit-bar-price-font-size);
+}
+.rv-submit-bar__price-integer {
+  font-size: var(--rv-submit-bar-price-integer-font-size);
+  font-family: var(--rv-submit-bar-price-font-family);
+}
+.rv-submit-bar__button.rv-button {
+  width: var(--rv-submit-bar-button-width);
+  height: var(--rv-submit-bar-button-height);
+  font-weight: var(--rv-font-weight-bold);
+  border: none;
+}
+.rv-submit-bar__button.rv-submit-bar__button--danger {
+  background: var(--rv-gradient-red);
+}

package/lib/swipe-cell/PropsType.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+import { BaseTypeProps } from '../utils';
+export interface SwipeCellProps extends BaseTypeProps {
+    /** 标识符，可以在事件参数中获取到 */
+    name?: string | number;
+    /** 指定左侧滑动区域宽度，单位为px */
+    leftWidth?: string | number;
+    /** 指定右侧滑动区域宽度，单位为 px */
+    rightWidth?: string | number;
+    /** 左侧滑动区域的内容 */
+    leftAction?: React.ReactNode;
+    /** 右侧滑动区域的内容 */
+    rightAction?: React.ReactNode;
+    /** 关闭前的回调函数，返回 false 可阻止关闭，支持返回 Promise */
+    beforeClose?: (...args: any[]) => Promise<boolean> | boolean;
+    /** 是否阻止滑动事件冒泡	 */
+    stopPropagation?: boolean;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 打开时触发 */
+    onOpen?: ({ name, position, }: {
+        name: string | number;
+        position: SwipeCellSide;
+    }) => void;
+    /** 关闭时触发 */
+    onClose?: ({ name, position, }: {
+        name: string | number;
+        position: SwipeCellPosition;
+    }) => void;
+    /** 点击时触发 */
+    onClick?: (position: SwipeCellPosition) => void;
+    children?: React.ReactNode;
+}
+export declare type SwipeCellSide = 'left' | 'right';
+export declare type SwipeCellPosition = SwipeCellSide | 'cell' | 'outside';
+export declare type SwipeCellInstance = {
+    open: (side: SwipeCellSide) => void;
+    close: () => void;
+};

package/lib/swipe-cell/PropsType.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/lib/swipe-cell/SwipeCell.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SwipeCellInstance, SwipeCellProps } from './PropsType';
+declare const SwipeCell: React.ForwardRefExoticComponent<SwipeCellProps & React.RefAttributes<SwipeCellInstance>>;
+export default SwipeCell;

package/lib/swipe-cell/SwipeCell.js

@@ -0,0 +1,205 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+function _react() {
+  const data = _interopRequireWildcard(require("react"));
+  _react = function () {
+    return data;
+  };
+  return data;
+}
+function _jsxRuntime() {
+  const data = require("react/jsx-runtime");
+  _jsxRuntime = function () {
+    return data;
+  };
+  return data;
+}
+function _clsx() {
+  const data = _interopRequireDefault(require("clsx"));
+  _clsx = function () {
+    return data;
+  };
+  return data;
+}
+var _utils = require("../utils");
+var _useRect = require("../hooks/use-rect");
+var _interceptor = require("../utils/interceptor");
+var _useClickAway = _interopRequireDefault(require("../hooks/use-click-away"));
+var _useEventListener = _interopRequireDefault(require("../hooks/use-event-listener"));
+var _hooks = require("../hooks");
+var _getDefaultProps = require("../utils/get-default-props");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const [bem] = (0, _utils.createNamespace)('swipe-cell');
+const SwipeCell = (0, _react().forwardRef)((p, instanceRef) => {
+  const props = (0, _getDefaultProps.mergeProps)(p, {
+    name: ''
+  });
+  const opened = (0, _react().useRef)(false);
+  const lockClick = (0, _react().useRef)(false);
+  const startOffset = (0, _react().useRef)(0);
+  const [state, setState] = (0, _react().useState)({
+    offset: 0,
+    dragging: false
+  });
+  const [actionWidth, setActionWidth] = (0, _react().useState)({
+    left: 0,
+    right: 0
+  });
+  const root = (0, _react().useRef)();
+  const getWidthByNode = node => node ? (0, _useRect.getRect)(node).width : 0;
+  const leftRef = (0, _react().useCallback)(node => {
+    if (node !== null) {
+      setActionWidth(v => Object.assign(Object.assign({}, v), {
+        left: getWidthByNode(node)
+      }));
+    }
+  }, []);
+  const rightRef = (0, _react().useCallback)(node => {
+    if (node !== null) {
+      setActionWidth(v => Object.assign(Object.assign({}, v), {
+        right: getWidthByNode(node)
+      }));
+    }
+  }, []);
+  const touch = (0, _hooks.useTouch)();
+  const leftWidth = (0, _react().useMemo)(() => (0, _utils.isDef)(props.leftWidth) ? +props.leftWidth : actionWidth.left, [props.leftWidth, actionWidth.left]);
+  const rightWidth = (0, _react().useMemo)(() => (0, _utils.isDef)(props.rightWidth) ? +props.rightWidth : actionWidth.right, [props.rightWidth, actionWidth.right]);
+  const open = side => {
+    var _a;
+    opened.current = true;
+    const offset = side === 'left' ? leftWidth : -rightWidth;
+    (_a = props.onOpen) === null || _a === void 0 ? void 0 : _a.call(props, {
+      name: props.name,
+      position: side
+    });
+    setState(v => Object.assign(Object.assign({}, v), {
+      offset
+    }));
+  };
+  const close = position => {
+    var _a;
+    if (opened.current) {
+      opened.current = false;
+      (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props, {
+        name: props.name,
+        position
+      });
+    }
+    setState(v => Object.assign(Object.assign({}, v), {
+      offset: 0
+    }));
+  };
+  const toggle = side => {
+    const offset = Math.abs(state.offset);
+    const THRESHOLD = 0.15;
+    const threshold = opened ? 1 - THRESHOLD : THRESHOLD;
+    const width = side === 'left' ? leftWidth : rightWidth;
+    if (width && offset > width * threshold) {
+      open(side);
+    } else {
+      close(side);
+    }
+  };
+  const onTouchStart = event => {
+    if (!props.disabled) {
+      startOffset.current = state.offset;
+      touch.start(event);
+    }
+  };
+  const onTouchMove = event => {
+    if (props.disabled) {
+      return;
+    }
+    touch.move(event);
+    if (touch.isHorizontal()) {
+      lockClick.current = true;
+      const newState = Object.assign(Object.assign({}, state), {
+        dragging: true
+      });
+      const isEdge = !opened.current || touch.deltaX.current * startOffset.current < 0;
+      if (isEdge) {
+        (0, _utils.preventDefault)(event, props.stopPropagation);
+      }
+      newState.offset = (0, _utils.range)(touch.deltaX.current + startOffset.current, -rightWidth, leftWidth);
+      setState(newState);
+    }
+  };
+  const onTouchEnd = () => {
+    if (state.dragging) {
+      setState(v => Object.assign(Object.assign({}, v), {
+        dragging: false
+      }));
+      toggle(state.offset > 0 ? 'left' : 'right');
+      // compatible with desktop scenario
+      setTimeout(() => {
+        lockClick.current = false;
+      }, 0);
+    }
+  };
+  const onClick = (position = 'outside') => {
+    var _a;
+    (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, position);
+    if (opened.current && !lockClick.current) {
+      (0, _interceptor.callInterceptor)({
+        interceptor: props.beforeClose,
+        args: [{
+          name: props.name,
+          position
+        }],
+        done: () => close(position)
+      });
+    }
+  };
+  const getClickHandler = (position, stop) => event => {
+    if (stop) {
+      event.stopPropagation();
+    }
+    onClick(position);
+  };
+  const renderSideContent = (side, measuredRef) => {
+    if (props[`${side}Action`]) {
+      return (0, _jsxRuntime().jsx)("div", Object.assign({
+        ref: measuredRef,
+        className: (0, _clsx().default)(bem(side)),
+        onClick: getClickHandler(side, true)
+      }, {
+        children: props[`${side}Action`]
+      }));
+    }
+    return null;
+  };
+  (0, _useClickAway.default)(root, () => onClick('outside'), 'touchstart');
+  (0, _react().useImperativeHandle)(instanceRef, () => ({
+    open,
+    close: () => close('outside')
+  }));
+  const wrapperStyle = {
+    transform: `translate3d(${state.offset}px, 0, 0)`,
+    transitionDuration: state.dragging ? '0s' : '.6s'
+  };
+  (0, _useEventListener.default)('touchmove', onTouchMove, {
+    target: root.current,
+    depends: [touch.deltaX]
+  });
+  return (0, _jsxRuntime().jsx)("div", Object.assign({
+    ref: root,
+    className: (0, _clsx().default)(bem()),
+    onClick: getClickHandler('cell'),
+    onTouchStart: onTouchStart,
+    onTouchEnd: onTouchEnd,
+    onTouchCancel: onTouchEnd
+  }, {
+    children: (0, _jsxRuntime().jsxs)("div", Object.assign({
+      className: (0, _clsx().default)(bem('wrapper')),
+      style: wrapperStyle
+    }, {
+      children: [renderSideContent('left', leftRef), props.children, renderSideContent('right', rightRef)]
+    }))
+  }));
+});
+var _default = exports.default = SwipeCell;

package/lib/swipe-cell/index.d.ts

@@ -0,0 +1,4 @@
+import './style/index.less';
+import SwipeCell from './SwipeCell';
+export { SwipeCell };
+export type { SwipeCellInstance, SwipeCellProps } from './PropsType';

package/lib/swipe-cell/index.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "SwipeCell", {
+  enumerable: true,
+  get: function () {
+    return _SwipeCell.default;
+  }
+});
+require("./style/index.css");
+var _SwipeCell = _interopRequireDefault(require("./SwipeCell"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/lib/swipe-cell/style/index.css

@@ -0,0 +1,23 @@
+.rv-swipe-cell {
+  position: relative;
+  overflow: hidden;
+  cursor: grab;
+}
+.rv-swipe-cell__wrapper {
+  transition-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1);
+  transition-property: transform;
+}
+.rv-swipe-cell__left,
+.rv-swipe-cell__right {
+  position: absolute;
+  top: 0;
+  height: 100%;
+}
+.rv-swipe-cell__left {
+  left: 0;
+  transform: translate3d(-100%, 0, 0);
+}
+.rv-swipe-cell__right {
+  right: 0;
+  transform: translate3d(100%, 0, 0);
+}

package/lib/swiper/PropsType.d.ts

@@ -0,0 +1,70 @@
+import React from 'react';
+import { BaseTypeProps } from '../utils';
+export declare type PageIndicatorProps = {
+    total: number;
+    current: number;
+    style?: React.CSSProperties;
+    className?: string;
+} & Pick<SwiperProps, 'vertical'>;
+export interface SwiperProps extends BaseTypeProps {
+    /** 初始位置索引值 */
+    initialSwipe?: number;
+    /** 是否允许手势滑动 */
+    touchable?: boolean;
+    /** 自动轮播间隔，单位为 ms	 */
+    autoplay?: boolean | number;
+    /** 是否开启循环播放	 */
+    loop?: boolean;
+    /** 是否为纵向滚动 */
+    vertical?: boolean;
+    /** 动画时长，单位为 ms */
+    duration?: number;
+    /**
+     * 是否启用
+     * @default true
+     */
+    enabled?: boolean;
+    /**
+     * 是否在拖动超出内容区域时启用橡皮筋效果，仅在非 loop 模式下生效
+     * @default true
+     */
+    rubberband?: boolean;
+    /** 每一页轮播结束后触发 */
+    onChange?: (index: number) => void;
+    /** 指示器属性 */
+    indicatorProps?: Pick<PageIndicatorProps, 'style' | 'className'>;
+    /** 自定义指示器 */
+    indicator?: boolean | ((total: number, current: number) => React.ReactNode);
+    /** 滑块的宽度百分比 */
+    slideSize?: number;
+    /** 滑块轨道整体的偏移量百分比	 */
+    trackOffset?: number;
+    /** 是否在边界两边卡住，避免出现空白，仅在非 loop 模式且 slideSize < 100 时生效	 */
+    stuckAtBoundary?: boolean;
+    /** 自适应高度 */
+    autoHeight?: boolean;
+    /** 是否阻止内部滚动行为 */
+    preventScroll?: boolean;
+    children?: React.ReactElement | React.ReactElement[];
+}
+export interface SwiperItemProps extends BaseTypeProps {
+    /** @private */
+    autoHeight?: boolean;
+    /** @private */
+    trackRef?: React.MutableRefObject<HTMLElement>;
+    onClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    children?: React.ReactNode;
+}
+export declare type SwiperInstance = {
+    activeIndex: number;
+    swipeTo: (index: number) => void;
+    swipeNext: () => void;
+    swipePrev: () => void;
+    /** 动态启用Swiper（如果已经禁用） */
+    enable: () => void;
+    /** 禁用 Swiper（如果已启用）被禁用时，它将不会响应任何事件和交互 */
+    disable: () => void;
+};
+export declare type SwiperItemInstance = {
+    self: any;
+};

package/lib/swiper/PropsType.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/lib/swiper/Swiper.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SwiperProps, SwiperInstance } from './PropsType';
+declare const Swiper: React.ForwardRefExoticComponent<SwiperProps & React.RefAttributes<SwiperInstance>>;
+export default Swiper;