@nutui/nutui-react-taro 2.0.0-alpha.12 → 2.0.0-alpha.14

package/dist/types/packages/watermark/watermark.taro.d.ts

@@ -1,22 +1,77 @@
 import React, { FunctionComponent } from 'react';
-export interface WaterMarkProps {
-    content: string;
-    fullPage: boolean;
-    zIndex: number;
-    className: string;
-    gapX: number;
-    gapY: number;
-    width: number;
-    height: number;
-    image: string;
-    imageWidth: number;
-    imageHeight: number;
-    rotate: number;
-    fontColor: string;
+import { BasicComponent } from '../../utils/typings';
+export interface WaterMarkProps extends BasicComponent {
+    /**
+    * 水印文字内容
+    * @default -
+    */
+    content: string
+    /**
+    * 是否覆盖整个页面
+    * @default true
+    */
+    fullPage: boolean
+    /**
+    * 追加的水印元素的 z-index
+    * @default 2000
+    */
+    zIndex: number
+    /**
+    * 水印之间的水平间距
+    * @default 24
+    */
+    gapX: number
+    /**
+    * 水印之间的垂直间距
+    * @default 48
+    */
+    gapY: number
+    /**
+    * 水印的宽度
+    * @default 120
+    */
+    width: number
+    /**
+    * 水印的高度
+    * @default 64
+    */
+    height: number
+    /**
+    * 图片源，建议导出 2 倍或 3 倍图，优先使用图片渲染水印
+    * @default -
+    */
+    image: string
+    /**
+    * 图片宽度
+    * @default 120
+    */
+    imageWidth: number
+    /**
+    * 图片高度
+    * @default 64
+    */
+    imageHeight: number
+    /**
+    * 水印绘制时，旋转的角度
+    * @default -22
+    */
+    rotate: number
+    /**
+    * 水印文字颜色
+    * @default rgba(0, 0, 0, .15)
+    */
+    color: string
     fontStyle: string;
-    fontFamily: string;
+    /**
+    * 水印文字字体
+    * @default -
+    */
+    fontFamily: string
     fontWeight: string;
-    fontSize: string | number;
-    style: React.CSSProperties;
+    /**
+    * 文字大小
+    * @default 16
+    */
+    fontSize: string | number
 }
 export declare const WaterMark: FunctionComponent<Partial<WaterMarkProps> & React.HTMLAttributes<HTMLDivElement>>;

package/dist/types/utils/index.d.ts

@@ -1,3 +1,4 @@
 export declare const isObject: (val: unknown) => val is Record<any, any>;
 export declare const isFunction: (val: unknown) => val is Function;
 export declare const isPromise: <T = any>(val: unknown) => val is Promise<T>;
+export declare const upperCaseFirst: (str: string) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nutui/nutui-react-taro",
-  "version": "2.0.0-alpha.12",
+  "version": "2.0.0-alpha.14",
   "style": "dist/style.css",
   "main": "dist/nutui.react.umd.js",
   "module": "dist/esm/nutui-react.es.js",

package/dist/esm/animatingnumbers.taro-c2a52dbd.js

@@ -1,103 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-import React, { useRef, useState, useEffect, Component } from "react";
-import { createSelectorQuery } from "@tarojs/taro";
-import { c as cn } from "./bem-cdccae08.js";
-const defaultProps$1 = {
-  maxLen: 0,
-  endNumber: "",
-  delaySpeed: 300,
-  easeSpeed: 1,
-  thousands: false,
-  className: ""
-};
-const CountUp = (props) => {
-  const { maxLen, endNumber, delaySpeed, easeSpeed, className, thousands, ...reset } = {
-    ...defaultProps$1,
-    ...props
-  };
-  const b = cn("countup");
-  const countupRef = useRef(null);
-  const timerRef = useRef(0);
-  const numbers = Array.from({ length: 10 }, (v, i) => i);
-  const getShowNumber = () => {
-    const splitArr = endNumber.split(".");
-    const intNumber = maxLen && splitArr[0].length < maxLen ? (Array(maxLen).join("0") + splitArr[0]).slice(-maxLen) : splitArr[0];
-    const currNumber = `${thousands ? intNumber.replace(/(\d)(?=(?:\d{3})+$)/g, "$1,") : intNumber}${splitArr[1] ? "." : ""}${splitArr[1] || ""}`;
-    return currNumber.split("");
-  };
-  const [numerArr, setNumerArr] = useState([]);
-  const [transformArr, setTransformArr] = useState([]);
-  const isLoaded = useRef(false);
-  const setNumberTransform = () => {
-    if (countupRef.current && numerArr.length) {
-      createSelectorQuery().selectAll(".nut-countup__listitem").node((numberItems) => {
-        const transformArrCache = [];
-        Object.keys(numberItems).forEach((key) => {
-          const elem = numberItems[Number(key)];
-          const idx = Number(numerArr[Number(key)]);
-          if (elem) {
-            const transform = idx || idx === 0 ? `translate(0, -${(idx === 0 ? 10 : idx) * 5}%)` : "";
-            transformArrCache.push(transform);
-          }
-        });
-        setTransformArr([...transformArrCache]);
-      }).exec();
-    }
-  };
-  const numberEaseStyle = (idx) => {
-    return {
-      transition: `transform ${easeSpeed}s ease-in-out`,
-      transform: transformArr[idx] ? transformArr[idx] : null
-    };
-  };
-  useEffect(() => {
-    setNumberTransform();
-  }, [numerArr]);
-  useEffect(() => {
-    if (!isLoaded.current) {
-      isLoaded.current = true;
-      timerRef.current = window.setTimeout(() => {
-        setNumerArr(getShowNumber());
-      }, delaySpeed);
-    } else {
-      setNumerArr(getShowNumber());
-    }
-    return () => {
-      window.clearTimeout(timerRef.current);
-    };
-  }, [endNumber]);
-  return React.createElement(
-    "div",
-    { className: `${b()} ${className}`, ref: countupRef },
-    React.createElement("ul", { className: b("list") }, numerArr.map((item, idx) => {
-      return React.createElement("li", { className: `${b("listitem", {
-        number: !Number.isNaN(Number(item))
-      })}`, key: idx }, !Number.isNaN(Number(item)) ? React.createElement("span", { className: b("number"), style: numberEaseStyle(idx) }, [...numbers, ...numbers].map((number, subidx) => {
-        return React.createElement("span", { key: subidx }, number);
-      })) : React.createElement("span", { className: b("separator") }, item));
-    }))
-  );
-};
-CountUp.defaultProps = defaultProps$1;
-CountUp.displayName = "NutCountUp";
-const defaultProps = {};
-class AnimatingNumbers extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {};
-  }
-  render() {
-    return React.createElement("div", { className: "nut-animatingnumbers" });
-  }
-}
-__publicField(AnimatingNumbers, "defaultProps", defaultProps);
-__publicField(AnimatingNumbers, "displayName", "NutAnimatingNumbers");
-__publicField(AnimatingNumbers, "CountUp", CountUp);
-export {
-  AnimatingNumbers as A
-};

package/dist/esm/popover.taro-ad483372.js

@@ -1,162 +0,0 @@
-import React, { useRef, useState, useEffect } from "react";
-import { O as Overlay } from "./overlay.taro-75012bd3.js";
-import { g as getRectByTaro } from "./use-client-rect-f317804e.js";
-import { C as ComponentDefaults } from "./typings-11d83a22.js";
-function fillRef(ref, node) {
-  if (typeof ref === "function") {
-    ref(node);
-  } else if (typeof ref === "object" && ref && "current" in ref) {
-    ref.current = node;
-  }
-}
-function composeRef(...refs) {
-  return (node) => {
-    refs.forEach((ref) => {
-      fillRef(ref, node);
-    });
-  };
-}
-class Trigger extends React.Component {
-  fireEvents(type, e) {
-    const childCallback = this.props.children.props[type];
-    if (childCallback) {
-      childCallback(e);
-    }
-    const callback = this.props[type];
-    if (callback) {
-      callback(e);
-    }
-  }
-  render() {
-    const { children, className = "" } = this.props;
-    const child = React.Children.only(children);
-    const newChildProps = {
-      key: "trigger"
-    };
-    if (child && child.props && child.props.className) {
-      newChildProps.className = className;
-    }
-    const cloneProps = {
-      ...newChildProps
-    };
-    cloneProps.ref = composeRef(this.props.forwardedRef, child.ref);
-    const trigger = React.cloneElement(child, cloneProps);
-    return trigger;
-  }
-}
-const defaultProps = {
-  ...ComponentDefaults,
-  list: [],
-  theme: "light",
-  location: "bottom",
-  visible: false,
-  offset: 20,
-  className: "",
-  onClick: (e) => {
-  },
-  onChoose: (item, index) => {
-  }
-};
-const Popover = (props) => {
-  const { children, list, theme, location, visible, offset, className, style, onClick, onChoose, ...reset } = {
-    ...defaultProps,
-    ...props
-  };
-  const goodItem = useRef(null);
-  setTimeout(async () => {
-    if (goodItem.current) {
-      const res = await getRectByTaro(goodItem.current);
-      setElWidth(res == null ? void 0 : res.width);
-      setElHeight(res == null ? void 0 : res.height);
-    }
-  });
-  const [classes, setClasses] = useState("");
-  const [elWidth, setElWidth] = useState(0);
-  const [elHeight, setElHeight] = useState(0);
-  const [popoverContent, setPopoverContent] = useState("");
-  const [popoverArrow, setPopoverArrow] = useState("");
-  useEffect(() => {
-    setClasses(classesSelf());
-    setPopoverContent(popoverContentSelf());
-    setPopoverArrow(popoverArrowSelf());
-  }, [list, theme]);
-  const getStyle = () => {
-    const offNumer = Number(offset) ? Number(offset) : 0;
-    const style2 = {};
-    if (location.includes("top")) {
-      style2.bottom = `${elHeight + offNumer}px`;
-    } else if (location.includes("right")) {
-      style2.left = `${elWidth + offNumer}px`;
-    } else if (location.includes("left")) {
-      style2.right = `${elWidth + offNumer}px`;
-    } else {
-      style2.top = `${elHeight + offNumer}px`;
-    }
-    return style2;
-  };
-  const classesSelf = () => {
-    const prefixCls = "nut-popover";
-    return `${prefixCls} ${theme ? `${prefixCls}--${theme}` : ""}`;
-  };
-  const popoverContentSelf = () => {
-    const prefixCls = "popover-content";
-    return `${prefixCls}-show ${prefixCls} ${location ? `${prefixCls}--${location}` : ""}`;
-  };
-  const filter = () => {
-    const ms = ["top", "bottom", "left", "right"];
-    return ms.filter((m) => location.includes(m))[0];
-  };
-  const popoverArrowSelf = () => {
-    const prefixCls = "popover-arrow";
-    return `${prefixCls} ${prefixCls}-${filter()} ${location ? `${prefixCls}--${location}` : ""}`;
-  };
-  const handleClick = (e) => {
-    if (props.onClick) {
-      props.onClick(e);
-    }
-  };
-  const handleChoose = (item, index) => {
-    if (!item.disabled) {
-      onChoose(item, index);
-    }
-  };
-  return React.createElement(
-    React.Fragment,
-    null,
-    React.createElement(
-      "div",
-      { className: `${classes} ${className}`, style: { ...style }, ...reset },
-      React.createElement(
-        Trigger,
-        { forwardedRef: goodItem },
-        React.createElement(
-          "div",
-          { onClick: (e) => handleClick(e) },
-          Array.isArray(children) ? children[0] : children,
-          visible ? React.createElement(
-            "div",
-            { className: `${popoverContent}`, style: getStyle() },
-            React.createElement("div", { className: `${popoverArrow}` }),
-            Array.isArray(children) ? children[1] : "",
-            React.createElement("div", null, list.map((item, i) => {
-              return React.createElement(
-                "div",
-                { key: item.name, className: `popover-menu-item ${item.disabled ? "disabled" : ""}`, onClick: () => {
-                  handleChoose(item, i);
-                } },
-                item.icon ? item.icon : null,
-                React.createElement("div", { className: "popover-menu-item-name" }, item.name)
-              );
-            }))
-          ) : null
-        )
-      )
-    ),
-    visible ? React.createElement(Overlay, { visible, onClick: (e) => handleClick(e), style: { background: "transparent" } }) : null
-  );
-};
-Popover.defaultProps = defaultProps;
-Popover.displayName = "NutPopover";
-export {
-  Popover as P
-};

package/dist/esm/sidenavbaritem.taro-32a45ce6.js

@@ -1,12 +0,0 @@
-import React from "react";
-const SideNavBarItem = (props) => {
-  const { title, key, children, onClick, ...rest } = props;
-  const clickFn = (e) => {
-    e.stopPropagation();
-    onClick && onClick({ title, key });
-  };
-  return React.createElement("div", { className: "nut-subsidenavbar__item border-bt", onClick: clickFn, ...rest }, title);
-};
-export {
-  SideNavBarItem as S
-};

package/dist/esm/trendarrow.taro-0cf43935.js

@@ -1,72 +0,0 @@
-import React, { useRef } from "react";
-import { TriangleUp, TriangleDown } from "@nutui/icons-react-taro";
-import { c as cn } from "./bem-cdccae08.js";
-const defaultProps = {
-  rate: 0,
-  digits: 2,
-  showSign: false,
-  showZero: false,
-  arrowLeft: false,
-  syncTextColor: true,
-  textColor: "#333",
-  riseColor: "#fa2c19",
-  dropColor: "#64b578",
-  upIcon: null,
-  downIcon: null,
-  className: ""
-};
-const TrendArrow = (props) => {
-  const { rate, digits, showSign, showZero, arrowLeft, syncTextColor, textColor, riseColor, dropColor, upIcon, downIcon, className, children, ...rest } = { ...defaultProps, ...props };
-  const b = cn("trendarrow");
-  const handleClick = () => {
-  };
-  const rateTrend = useRef(rate > 0);
-  const myFixed = (num, digit = 2) => {
-    if (Object.is(parseFloat(num), NaN)) {
-      return console.log(`传入的值：${num}不是一个数字`);
-    }
-    num = parseFloat(num);
-    const numPow = Math.pow(10, digit);
-    return (Math.round((num + Number.EPSILON) * numPow) / numPow).toFixed(digit);
-  };
-  const calcStyle = (() => {
-    const arrowColor = rateTrend.current ? riseColor : dropColor;
-    const textEquArrowColor = syncTextColor ? arrowColor : textColor;
-    const style = {
-      color: rate === 0 ? textColor : textEquArrowColor
-    };
-    return style;
-  })();
-  const calcRate = (() => {
-    rateTrend.current = rate > 0;
-    const absRate = Math.abs(rate);
-    if (!showZero && rate === 0) {
-      return "--";
-    }
-    const resultRate = `${// eslint-disable-next-line no-nested-ternary
-    showSign && rate !== 0 ? rateTrend.current ? "+" : "-" : ""}${myFixed(Number(absRate), digits)}%`;
-    return resultRate;
-  })();
-  const calcIconProps = (() => {
-    const iconProps = {
-      color: rateTrend.current ? riseColor : dropColor
-    };
-    return iconProps;
-  })();
-  const renderContent = (arrowLeft2) => {
-    const classNameSuffix = !arrowLeft2 ? "icon-after" : "icon-before";
-    return React.createElement("span", { className: `${b(classNameSuffix)} ${b("rate")}`, style: calcStyle }, calcRate);
-  };
-  return React.createElement(
-    "div",
-    { className: `${b()} ${className}`, ...rest, onClick: handleClick },
-    !arrowLeft && renderContent(!arrowLeft),
-    children || React.createElement(React.Fragment, null, Number(rate) !== 0 && React.createElement(React.Fragment, null, rateTrend ? React.createElement(TriangleUp, { color: calcIconProps.color }) : React.createElement(TriangleDown, { color: calcIconProps.color }))),
-    arrowLeft && renderContent(!arrowLeft)
-  );
-};
-TrendArrow.defaultProps = defaultProps;
-TrendArrow.displayName = "NutTrendArrow";
-export {
-  TrendArrow as T
-};

package/dist/esm/types/src/packages/popover/Trigger.d.ts

@@ -1,19 +0,0 @@
-import React from 'react';
-interface TriggerProps {
-    className?: string | undefined;
-    children?: React.ReactNode;
-    forwardedRef: React.RefObject<HTMLElement>;
-}
-/**
- * 过滤ref
- */
-export declare function fillRef<T>(ref: React.Ref<T>, node: T): void;
-/**
- * 将ref合并到一个ref函数中以支持ref传递
- */
-export declare function composeRef<T>(...refs: React.Ref<T>[]): React.Ref<T>;
-export default class Trigger extends React.Component<TriggerProps, unknown> {
-    fireEvents(type: string, e: Event): void;
-    render(): JSX.Element;
-}
-export {};

package/dist/esm/types/src/packages/sidenavbar/type.d.ts

@@ -1,34 +0,0 @@
-import React from 'react';
-type NavBarProps = {
-    showhead?: boolean;
-};
-export interface SideNavBarProps extends React.HTMLAttributes<HTMLDivElement>, NavBarProps {
-    title: string;
-    visible: boolean;
-    width?: string;
-    offset?: number;
-    position?: 'left' | 'right';
-    handleClose: () => void;
-    children?: React.ReactNode;
-}
-export type SideNavBarItemProps = {
-    title: string;
-    key: string | number;
-    click?: ({ title, key }: {
-        title: string;
-        key: string | number;
-    }) => void;
-    children?: React.ReactNode;
-};
-export type SubNavBarProps = {
-    title: string;
-    key: string | number;
-    open?: boolean;
-    children?: React.ReactNode;
-    titleClick?: ({ title, key, isShow, }: {
-        title: string;
-        key: string | number;
-        isShow: boolean;
-    }) => void;
-};
-export {};

package/dist/esm/use-client-rect-f317804e.js

@@ -1,10 +0,0 @@
-const getRectByTaro = async (element) => {
-  if (element) {
-    const res = await element.getBoundingClientRect();
-    return res;
-  }
-  return Promise.resolve({});
-};
-export {
-  getRectByTaro as g
-};

package/dist/esm/video-5d106e33.js

@@ -1,73 +0,0 @@
-import React, { useRef, useEffect } from "react";
-import classNames from "classnames";
-import { c as cn } from "./bem-cdccae08.js";
-const defaultProps = {
-  source: {
-    type: {},
-    src: ""
-  },
-  options: {
-    controls: true,
-    muted: false,
-    autoplay: false,
-    poster: "",
-    playsinline: false,
-    loop: false
-  }
-};
-const Video = (props) => {
-  const { children, source, options, className, play, pause, playend, onPlay, onPause, onPlayEnd, ...restProps } = {
-    ...defaultProps,
-    ...props
-  };
-  const rootRef = useRef(null);
-  const b = cn("video");
-  const classes = classNames(className, b(""));
-  useEffect(() => {
-    init();
-  }, []);
-  const init = () => {
-    if (rootRef.current) {
-      const videoRef = rootRef.current;
-      if (options.autoplay) {
-        setTimeout(() => {
-          videoRef.play();
-        }, 200);
-      }
-      if (options.playsinline) {
-        videoRef.setAttribute("playsinline", String(options.playsinline));
-        videoRef.setAttribute("webkit-playsinline", String(options.playsinline));
-        videoRef.setAttribute("x5-video-player-type", "h5-page");
-        videoRef.setAttribute("x5-video-player-fullscreen", "false");
-      }
-      videoRef.addEventListener("play", () => {
-        onPlay && onPlay(videoRef);
-        play && play(videoRef);
-      });
-      videoRef.addEventListener("pause", () => {
-        onPause && onPause(videoRef);
-        pause && pause(videoRef);
-      });
-      videoRef.addEventListener("ended", () => {
-        videoRef.currentTime = 0;
-        onPlayEnd && onPlayEnd(videoRef);
-        playend && playend(videoRef);
-      });
-    }
-  };
-  return React.createElement(
-    "div",
-    { className: classes, ...restProps },
-    React.createElement(
-      "video",
-      { className: "nut-video-player", muted: options.muted, autoPlay: options.autoplay, loop: options.loop, poster: options.poster, controls: options.controls, ref: rootRef, src: source.src },
-      React.createElement("source", { src: source.src, type: source.type }),
-      React.createElement("track", { kind: "captions" })
-    )
-  );
-};
-Video.defaultProps = defaultProps;
-Video.displayName = "NutVideo";
-export {
-  Video as V
-};

package/dist/types/packages/popover/Trigger.d.ts

@@ -1,19 +0,0 @@
-import React from 'react';
-interface TriggerProps {
-    className?: string | undefined;
-    children?: React.ReactNode;
-    forwardedRef: React.RefObject<HTMLElement>;
-}
-/**
- * 过滤ref
- */
-export declare function fillRef<T>(ref: React.Ref<T>, node: T): void;
-/**
- * 将ref合并到一个ref函数中以支持ref传递
- */
-export declare function composeRef<T>(...refs: React.Ref<T>[]): React.Ref<T>;
-export default class Trigger extends React.Component<TriggerProps, unknown> {
-    fireEvents(type: string, e: Event): void;
-    render(): JSX.Element;
-}
-export {};

package/dist/types/packages/video/video.d.ts

@@ -1,24 +0,0 @@
-import React, { FunctionComponent } from 'react';
-export interface VideoProps {
-    source: {
-        type: string;
-        src: string;
-    };
-    options: {
-        controls?: boolean;
-        muted?: boolean;
-        autoplay?: boolean;
-        poster?: string;
-        playsinline?: boolean;
-        loop?: boolean;
-    };
-    className: string;
-    style: React.CSSProperties;
-    play: (e: HTMLVideoElement) => void;
-    pause: (e: HTMLVideoElement) => void;
-    playend: (e: HTMLVideoElement) => void;
-    onPlay: (e: HTMLVideoElement) => void;
-    onPause: (e: HTMLVideoElement) => void;
-    onPlayEnd: (e: HTMLVideoElement) => void;
-}
-export declare const Video: FunctionComponent<Partial<VideoProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onPause' | 'onPlay'>>;