react-vant-nova 1.0.0-test

package/es/utils/dom/scroll.js

@@ -0,0 +1,86 @@
+/* eslint-disable no-plusplus */
+import { raf, cancelRaf } from '../raf';
+import { isIOS as checkIsIOS } from '../validate/system';
+function isWindow(val) {
+  return val === window;
+}
+export function getScrollTop(el) {
+  const top = 'scrollTop' in el ? el.scrollTop : el.pageYOffset;
+  // iOS scroll bounce cause minus scrollTop
+  return Math.max(top, 0);
+}
+export function getRootScrollTop() {
+  return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
+}
+export function setRootScrollTop(value) {
+  setScrollTop(window, value);
+  // setScrollTop(document.body, value);
+}
+// get distance from element top to page top or scroller top
+export function getElementTop(el, scroller) {
+  if (isWindow(el)) {
+    return 0;
+  }
+  const scrollTop = scroller ? getScrollTop(scroller) : getRootScrollTop();
+  return el.getBoundingClientRect().top + scrollTop;
+}
+export function getVisibleHeight(el) {
+  if (isWindow(el)) {
+    return el.innerHeight;
+  }
+  return el.getBoundingClientRect().height;
+}
+export function getVisibleTop(el) {
+  if (isWindow(el)) {
+    return 0;
+  }
+  return el.getBoundingClientRect().top;
+}
+export function setScrollTop(el, value) {
+  if ('scrollTop' in el) {
+    el.scrollTop = value;
+  } else {
+    el.scrollTo(el.scrollX, value);
+  }
+}
+let rafId;
+export function scrollLeftTo(scroller, to, duration) {
+  cancelRaf(rafId);
+  let count = 0;
+  const from = scroller.scrollLeft;
+  const frames = duration === 0 ? 1 : Math.round(duration / 16);
+  function animate() {
+    scroller.scrollLeft += (to - from) / frames;
+    if (++count < frames) {
+      rafId = raf(animate);
+    }
+  }
+  animate();
+}
+export function scrollTopTo(scroller, to, duration, callback) {
+  let current = getScrollTop(scroller);
+  const isDown = current < to;
+  const frames = duration === 0 ? 1 : Math.round(duration / 16);
+  const step = (to - current) / frames;
+  function animate() {
+    current += step;
+    if (isDown && current > to || !isDown && current < to) {
+      current = to;
+    }
+    setScrollTop(scroller, current);
+    if (isDown && current < to || !isDown && current > to) {
+      raf(animate);
+    } else if (callback) {
+      raf(callback);
+    }
+  }
+  animate();
+}
+const isIOS = checkIsIOS();
+// hack for iOS12 page scroll
+// see: https://developers.weixin.qq.com/community/develop/doc/00044ae90742f8c82fb78fcae56800
+export function resetScroll() {
+  if (isIOS) {
+    setRootScrollTop(getRootScrollTop());
+  }
+}

package/es/utils/dom/style.d.ts

@@ -0,0 +1 @@
+export declare function isHidden(elementRef: HTMLElement): boolean;

package/es/utils/dom/style.js

@@ -0,0 +1,13 @@
+export function isHidden(elementRef) {
+  const el = elementRef;
+  if (!el) {
+    return false;
+  }
+  const style = window.getComputedStyle(el);
+  const hidden = style.display === 'none';
+  // offsetParent returns null in the following situations:
+  // 1. The element or its parent element has the display property set to none.
+  // 2. The element has the position property set to fixed
+  const parentHidden = el.offsetParent === null && style.position !== 'fixed';
+  return hidden || parentHidden;
+}

package/es/utils/dom/version.d.ts

@@ -0,0 +1,2 @@
+export declare const reactVersion: number;
+export declare const reactDomVersion: number;

package/es/utils/dom/version.js

@@ -0,0 +1,4 @@
+import { version as _reactVersion } from 'react';
+import { version as _reactDomVersion } from 'react-dom';
+export const reactVersion = Number((_reactVersion || '').split('.')[0]);
+export const reactDomVersion = Number((_reactDomVersion || '').split('.')[0]);

package/es/utils/format/number.d.ts

@@ -0,0 +1,3 @@
+export declare function range(num: number, min: number, max: number): number;
+export declare function formatNumber(value: string, allowDot?: boolean, allowMinus?: boolean): string;
+export declare function addNumber(num1: number, num2: number): number;

package/es/utils/format/number.js

@@ -0,0 +1,34 @@
+/* eslint-disable prefer-destructuring */
+export function range(num, min, max) {
+  return Math.min(Math.max(num, min), max);
+}
+function trimExtraChar(value, char, regExp) {
+  const index = value.indexOf(char);
+  if (index === -1) {
+    return value;
+  }
+  if (char === '-' && index !== 0) {
+    return value.slice(0, index);
+  }
+  return value.slice(0, index + 1) + value.slice(index).replace(regExp, '');
+}
+export function formatNumber(value, allowDot = true, allowMinus = true) {
+  if (allowDot) {
+    value = trimExtraChar(value, '.', /\./g);
+  } else {
+    // eslint-disable-next-line prefer-destructuring
+    value = value.split('.')[0];
+  }
+  if (allowMinus) {
+    value = trimExtraChar(value, '-', /-/g);
+  } else {
+    value = value.replace(/-/g, '');
+  }
+  const regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
+  return value.replace(regExp, '');
+}
+// add num and avoid float number
+export function addNumber(num1, num2) {
+  const cardinal = Math.pow(10, 10);
+  return Math.round((num1 + num2) * cardinal) / cardinal;
+}

package/es/utils/format/react.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare function parseChildList<T>(children: React.ReactNode): T[];

package/es/utils/format/react.js

@@ -0,0 +1,14 @@
+import React from 'react';
+export function parseChildList(children) {
+  return React.Children.toArray(children).map(node => {
+    if (React.isValidElement(node)) {
+      const key = node.key !== undefined ? String(node.key) : undefined;
+      return Object.assign(Object.assign({
+        key
+      }, node.props), {
+        node
+      });
+    }
+    return null;
+  }).filter(child => child);
+}

package/es/utils/format/string.d.ts

@@ -0,0 +1,2 @@
+export declare function camelize(str: string): string;
+export declare function padZero(num: number | string, targetLength?: number): string;

package/es/utils/format/string.js

@@ -0,0 +1,11 @@
+const camelizeRE = /-(\w)/g;
+export function camelize(str) {
+  return str.replace(camelizeRE, (_, c) => c.toUpperCase());
+}
+export function padZero(num, targetLength = 2) {
+  let str = `${num}`;
+  while (str.length < targetLength) {
+    str = `0${str}`;
+  }
+  return str;
+}

package/es/utils/format/unit.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export declare function addUnit(value?: string | number): string | undefined;
+export declare function getSizeStyle(originSize?: string | number): {
+    width: string;
+    height: string;
+} | {
+    width?: undefined;
+    height?: undefined;
+};
+export declare function getZIndexStyle(zIndex?: string | number): React.CSSProperties;
+export declare function unitToPx(value: string | number): number;
+export declare function kebabCase(str: string): string;

package/es/utils/format/unit.js

@@ -0,0 +1,69 @@
+import { isDef, inBrowser } from '..';
+import { isNumeric } from '../validate/number';
+export function addUnit(value) {
+  if (!isDef(value)) {
+    return undefined;
+  }
+  // eslint-disable-next-line no-param-reassign
+  value = String(value);
+  return isNumeric(value) ? `${value}px` : value;
+}
+export function getSizeStyle(originSize) {
+  if (isDef(originSize)) {
+    const size = addUnit(originSize);
+    return {
+      width: size,
+      height: size
+    };
+  }
+  return {};
+}
+export function getZIndexStyle(zIndex) {
+  const style = {};
+  if (zIndex !== undefined) {
+    style.zIndex = +zIndex;
+  }
+  return style;
+}
+// cache
+let rootFontSize;
+function getRootFontSize() {
+  if (!rootFontSize) {
+    const doc = document.documentElement;
+    const fontSize = doc.style.fontSize || window.getComputedStyle(doc).fontSize;
+    rootFontSize = parseFloat(fontSize);
+  }
+  return rootFontSize;
+}
+function convertRem(value) {
+  value = value.replace(/rem/g, '');
+  return +value * getRootFontSize();
+}
+function convertVw(value) {
+  value = value.replace(/vw/g, '');
+  return +value * window.innerWidth / 100;
+}
+function convertVh(value) {
+  value = value.replace(/vh/g, '');
+  return +value * window.innerHeight / 100;
+}
+export function unitToPx(value) {
+  if (typeof value === 'number') {
+    return value;
+  }
+  if (inBrowser) {
+    if (value.indexOf('rem') !== -1) {
+      return convertRem(value);
+    }
+    if (value.indexOf('vw') !== -1) {
+      return convertVw(value);
+    }
+    if (value.indexOf('vh') !== -1) {
+      return convertVh(value);
+    }
+  }
+  return parseFloat(value);
+}
+export function kebabCase(str) {
+  return str.replace(/([A-Z])/g, '-$1').toLowerCase().replace(/^-/, '');
+}

package/es/utils/get-default-props.d.ts

@@ -0,0 +1,2 @@
+export declare function mergeProps<A, B>(a: A, b: B): B & A;
+export declare function mergeProps<A, B, C>(a: A, b: B, c: C): C & B & A;

package/es/utils/get-default-props.js

@@ -0,0 +1,12 @@
+// 实现react的defaultProps和props合并
+export function mergeProps(...items) {
+  const result = Object.assign({}, items[0]);
+  items.forEach(item => {
+    for (const key in item) {
+      const val = item[key];
+      // eslint-disable-next-line no-prototype-builtins
+      result[key] = result.hasOwnProperty(key) ? result[key] : val;
+    }
+  });
+  return result;
+}

package/es/utils/index.d.ts

@@ -0,0 +1,10 @@
+export * from './base';
+export * from './create';
+export * from './interface';
+export * from './dom/event';
+export * from './dom/scroll';
+export * from './dom/style';
+export * from './format/react';
+export * from './format/unit';
+export * from './format/number';
+export * from './format/string';

package/es/utils/index.js

@@ -0,0 +1,10 @@
+export * from './base';
+export * from './create';
+export * from './interface';
+export * from './dom/event';
+export * from './dom/scroll';
+export * from './dom/style';
+export * from './format/react';
+export * from './format/unit';
+export * from './format/number';
+export * from './format/string';

package/es/utils/interceptor.d.ts

@@ -0,0 +1,7 @@
+export declare type Interceptor = (...args: any[]) => Promise<boolean> | boolean;
+export declare function callInterceptor(options: {
+    interceptor?: Function;
+    args: any[];
+    done: () => void;
+    canceled?: () => void;
+}): void;

package/es/utils/interceptor.js

@@ -0,0 +1,30 @@
+/* eslint-disable @typescript-eslint/ban-types */
+/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
+import { isPromise, noop } from '.';
+export function callInterceptor(options) {
+  const {
+    interceptor,
+    args,
+    done,
+    canceled
+  } = options;
+  if (interceptor) {
+    // eslint-disable-next-line prefer-spread
+    const returnVal = interceptor.apply(null, args || []);
+    if (isPromise(returnVal)) {
+      returnVal.then(value => {
+        if (value) {
+          done();
+        } else if (canceled) {
+          canceled();
+        }
+      }).catch(noop);
+    } else if (returnVal) {
+      done();
+    } else if (canceled) {
+      canceled();
+    }
+  } else {
+    done();
+  }
+}

package/es/utils/interface.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export interface BaseTypeProps {
+    style?: React.CSSProperties | any;
+    className?: string;
+    children?: React.ReactNode;
+}
+/** 指定挂载的节点 */
+export declare type TeleportType = HTMLElement | (() => HTMLElement) | null;
+export declare type WithDisplayNameReactElement = React.ReactElement & {
+    type: {
+        displayName: string;
+    };
+};

package/es/utils/interface.js

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

package/es/utils/is-dev.d.ts

@@ -0,0 +1 @@
+export declare const isDev: boolean;

package/es/utils/is-dev.js

@@ -0,0 +1 @@
+export const isDev = process.env.NODE_ENV === 'development';

package/es/utils/raf.d.ts

@@ -0,0 +1,4 @@
+export declare const root: Window;
+export declare function raf(fn: FrameRequestCallback): number;
+export declare function cancelRaf(id: number): void;
+export declare function doubleRaf(fn: FrameRequestCallback): void;

package/es/utils/raf.js

@@ -0,0 +1,26 @@
+/* eslint-disable @typescript-eslint/unbound-method */
+import { inBrowser } from '.';
+export const root = inBrowser ? window : global;
+let prev = Date.now();
+function rafPolyfill(fn) {
+  const curr = Date.now();
+  const ms = Math.max(0, 16 - (curr - prev));
+  const id = setTimeout(fn, ms);
+  prev = curr + ms;
+  return id;
+}
+export function raf(fn) {
+  const requestAnimationFrame = root.requestAnimationFrame || rafPolyfill;
+  return requestAnimationFrame.call(root, fn);
+}
+// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+export function cancelRaf(id) {
+  const cancelAnimationFrame = root.cancelAnimationFrame || root.clearTimeout;
+  cancelAnimationFrame.call(root, id);
+}
+// double raf for animation
+export function doubleRaf(fn) {
+  raf(() => {
+    raf(fn);
+  });
+}

package/es/utils/rubberband.d.ts

@@ -0,0 +1,2 @@
+export declare function rubberband(distance: number, dimension: number, constant: number): number;
+export declare function rubberbandIfOutOfBounds(position: number, min: number, max: number, dimension: number, constant?: number): number;

package/es/utils/rubberband.js

@@ -0,0 +1,10 @@
+import { bound } from './bound';
+export function rubberband(distance, dimension, constant) {
+  return distance * dimension * constant / (dimension + constant * distance);
+}
+export function rubberbandIfOutOfBounds(position, min, max, dimension, constant = 0.15) {
+  if (constant === 0) return bound(position, min, max);
+  if (position < min) return -rubberband(min - position, dimension, constant) + min;
+  if (position > max) return +rubberband(position - max, dimension, constant) + max;
+  return position;
+}

package/es/utils/supports-passive.d.ts

@@ -0,0 +1 @@
+export declare let supportsPassive: boolean;

package/es/utils/supports-passive.js

@@ -0,0 +1,14 @@
+import canUseDom from './dom/canUseDom';
+export let supportsPassive = false;
+if (canUseDom()) {
+  try {
+    const opts = {};
+    Object.defineProperty(opts, 'passive', {
+      get() {
+        supportsPassive = true;
+      }
+    });
+    window.addEventListener('test-passive', null, opts);
+    // eslint-disable-next-line no-empty
+  } catch (e) {}
+}

package/es/utils/throttle.d.ts

@@ -0,0 +1,7 @@
+declare function throttle(func: any, wait: any, options?: any): {
+    (...args: any[]): any;
+    cancel: () => void;
+    flush: () => any;
+    pending: () => boolean;
+};
+export default throttle;

package/es/utils/throttle.js

@@ -0,0 +1,20 @@
+import { isObject } from './base';
+import { debounce } from './debounce';
+// https://github.com/lodash/lodash/blob/master/throttle.js
+function throttle(func, wait, options) {
+  let leading = true;
+  let trailing = true;
+  if (typeof func !== 'function') {
+    throw new TypeError('Expected a function');
+  }
+  if (isObject(options)) {
+    leading = 'leading' in options ? !!options.leading : leading;
+    trailing = 'trailing' in options ? !!options.trailing : trailing;
+  }
+  return debounce(func, wait, {
+    leading,
+    trailing,
+    'maxWait': wait
+  });
+}
+export default throttle;

package/es/utils/validate/date.d.ts

@@ -0,0 +1 @@
+export declare function isDate(val: Date): val is Date;

package/es/utils/validate/date.js

@@ -0,0 +1,4 @@
+import { isNaN } from './number';
+export function isDate(val) {
+  return Object.prototype.toString.call(val) === '[object Date]' && !isNaN(val.getTime());
+}

package/es/utils/validate/number.d.ts

@@ -0,0 +1,2 @@
+export declare function isNumeric(val: string): boolean;
+export declare function isNaN(val: number): val is typeof NaN;

package/es/utils/validate/number.js

@@ -0,0 +1,10 @@
+export function isNumeric(val) {
+  return /^\d+(\.\d+)?$/.test(val);
+}
+export function isNaN(val) {
+  if (Number.isNaN) {
+    return Number.isNaN(val);
+  }
+  // eslint-disable-next-line no-self-compare
+  return val !== val;
+}

package/es/utils/validate/system.d.ts

@@ -0,0 +1,2 @@
+export declare function isAndroid(): boolean;
+export declare function isIOS(): boolean;

package/es/utils/validate/system.js

@@ -0,0 +1,7 @@
+import { inBrowser } from '../base';
+export function isAndroid() {
+  return inBrowser ? /android/.test(navigator.userAgent.toLowerCase()) : false;
+}
+export function isIOS() {
+  return inBrowser ? /ios|iphone|ipad|ipod/.test(navigator.userAgent.toLowerCase()) : false;
+}

package/es/water-mark/PropsType.d.ts

@@ -0,0 +1,39 @@
+import { BaseTypeProps } from '../utils';
+export interface WaterMarkProps extends BaseTypeProps {
+    /** 水印的宽度 */
+    width?: number;
+    /** 水印的高度 */
+    height?: number;
+    /** 水印旋转的角度，单位 °	 */
+    rotate?: number;
+    /** 设置图片水印 */
+    image?: {
+        /** 图片地址 */
+        src: string;
+        /** 图片宽度 */
+        width: number;
+        /** 图片高度 */
+        height: number;
+    };
+    zIndex?: number;
+    /** 水印文字内容 */
+    content?: string;
+    font?: {
+        /** 文字颜色	 */
+        color?: string;
+        /** 文字大小	 */
+        size?: number | string;
+        /** 文字style属性 */
+        style?: string;
+        /** 文字family */
+        family?: string;
+        /** 文字weight属性 */
+        weight?: string;
+    };
+    /** 水印之间的水平间距	 */
+    gapX?: number;
+    /** 水印之间的垂直间距	 */
+    gapY?: number;
+    /** 是否覆盖整个页面	 */
+    fullPage?: boolean;
+}

package/es/water-mark/PropsType.js

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

package/es/water-mark/WaterMark.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { WaterMarkProps } from './PropsType';
+declare const WaterMark: React.FC<WaterMarkProps>;
+export default WaterMark;

package/es/water-mark/WaterMark.js

@@ -0,0 +1,102 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import clsx from 'clsx';
+import { createNamespace } from '../utils';
+import { mergeProps } from '../utils/get-default-props';
+const DEFAULT_FONT = {
+  style: 'normal',
+  weight: 'normal',
+  color: 'rgba(0,0,0,.15)',
+  size: 14,
+  family: 'sans-serif'
+};
+const [bem] = createNamespace('water-mark');
+// 移植自antd mobile: https://github.com/ant-design/ant-design-mobile/blob/master/src/components/water-mark/water-mark.tsx
+const WaterMark = p => {
+  const props = mergeProps(p, {
+    zIndex: 2000,
+    gapX: 24,
+    gapY: 48,
+    width: 100,
+    height: 64,
+    rotate: -22,
+    font: DEFAULT_FONT,
+    fullPage: true
+  });
+  const {
+    zIndex,
+    gapX,
+    gapY,
+    width,
+    height,
+    rotate,
+    image,
+    content,
+    font
+  } = props;
+  const [base64Url, setBase64Url] = React.useState('');
+  React.useEffect(() => {
+    const canvas = document.createElement('canvas');
+    const ratio = window.devicePixelRatio;
+    const ctx = canvas.getContext('2d');
+    const canvasWidth = `${(gapX + width) * ratio}px`;
+    const canvasHeight = `${(gapY + height) * ratio}px`;
+    const markWidth = width * ratio;
+    const markHeight = height * ratio;
+    canvas.setAttribute('width', canvasWidth);
+    canvas.setAttribute('height', canvasHeight);
+    if (ctx) {
+      if (image) {
+        const {
+          width,
+          height,
+          src
+        } = image;
+        ctx.translate(markWidth / 2, markHeight / 2);
+        ctx.rotate(Math.PI / 180 * Number(rotate));
+        const img = new Image();
+        img.crossOrigin = 'anonymous';
+        img.referrerPolicy = 'no-referrer';
+        img.src = src;
+        img.onload = () => {
+          ctx.drawImage(img, -width * ratio / 2, -height * ratio / 2, width * ratio, height * ratio);
+          ctx.restore();
+          setBase64Url(canvas.toDataURL());
+        };
+      } else if (content) {
+        const frontProps = Object.assign(Object.assign({}, DEFAULT_FONT), font);
+        const {
+          size,
+          family,
+          style,
+          weight,
+          color
+        } = frontProps;
+        ctx.textBaseline = 'middle';
+        ctx.textAlign = 'center';
+        // 文字绕中间旋转
+        ctx.translate(markWidth / 2, markHeight / 2);
+        ctx.rotate(Math.PI / 180 * Number(rotate));
+        const markSize = Number(size) * ratio;
+        ctx.font = `${style} normal ${weight} ${markSize}px/${markHeight}px ${family}`;
+        ctx.fillStyle = color;
+        ctx.fillText(content, 0, 0);
+        ctx.restore();
+        setBase64Url(canvas.toDataURL());
+      }
+    } else {
+      throw new Error('当前环境不支持Canvas');
+    }
+  }, [gapX, gapY, rotate, width, height, image, content, font]);
+  return _jsx("div", {
+    className: clsx(bem({
+      full: props.fullPage
+    })),
+    style: {
+      zIndex,
+      backgroundSize: `${gapX + width}px`,
+      backgroundImage: `url('${base64Url}')`
+    }
+  });
+};
+export default WaterMark;