@nutui/nutui-react 2.7.0 → 3.0.0-beta.0

package/dist/esm/VirtualList.js

@@ -1,253 +0,0 @@
-import { _ as __rest } from "./tslib.es6.js";
-import React__default, { useRef, useState, useEffect, useCallback } from "react";
-import classNames from "classnames";
-import { C as ComponentDefaults } from "./typings.js";
-const initPositinoCache = (reaItemSize, length = 0) => {
-  let index = 0;
-  const positions = Array(length);
-  while (index < length) {
-    positions[index] = {
-      index,
-      height: reaItemSize,
-      width: reaItemSize,
-      top: index * reaItemSize,
-      bottom: (index + 1) * reaItemSize,
-      left: index * reaItemSize,
-      right: (index + 1) * reaItemSize
-    };
-    index++;
-  }
-  return positions;
-};
-const getListTotalSize = (positions, horizontal) => {
-  const index = positions.length - 1;
-  let size = 0;
-  if (index < 0) {
-    size = 0;
-  } else {
-    size = horizontal ? positions[index].right : positions[index].bottom;
-  }
-  return size;
-};
-const binarySearch = (positionsList, horizontal, value = 0) => {
-  let start = 0;
-  let end = positionsList.length - 1;
-  let tempIndex = null;
-  const key = horizontal ? "right" : "bottom";
-  while (start <= end) {
-    const midIndex = Math.floor((start + end) / 2);
-    const midValue = positionsList[midIndex][key];
-    if (midValue === value) {
-      return midIndex + 1;
-    }
-    if (midValue < value) {
-      start = midIndex + 1;
-    } else if (midValue > value) {
-      if (tempIndex === null || tempIndex > midIndex) {
-        tempIndex = midIndex;
-      }
-      end = midIndex - 1;
-    }
-  }
-  tempIndex = tempIndex || 0;
-  return tempIndex;
-};
-const getEndIndex = ({ list, startIndex, visibleCount, itemEqual = true, positions, offSetSize, overscan, sizeKey = "width" }) => {
-  const dataLength = list.length;
-  let tempIndex = null;
-  if (itemEqual) {
-    const endIndex = startIndex + visibleCount;
-    tempIndex = dataLength > 0 ? Math.min(dataLength, endIndex) : endIndex;
-  } else {
-    let sizeNum = 0;
-    for (let i = startIndex; i < dataLength; i++) {
-      sizeNum += positions[i][sizeKey] || 0;
-      if (sizeNum > offSetSize) {
-        const endIndex = i + overscan;
-        tempIndex = dataLength > 0 ? Math.min(dataLength, endIndex) : endIndex;
-        break;
-      }
-    }
-    if (sizeNum < offSetSize) {
-      tempIndex = dataLength;
-    }
-  }
-  tempIndex = tempIndex || 0;
-  return tempIndex;
-};
-const updateItemSize = (positions, items, sizeKey, margin) => {
-  const newPos = positions.concat();
-  Array.from(items).forEach((item) => {
-    const index = Number(item.getAttribute("data-index"));
-    const styleVal = item.getAttribute("style");
-    if (styleVal && styleVal.includes("none"))
-      return;
-    let nowSize = item.getBoundingClientRect()[sizeKey];
-    const oldSize = positions[index][sizeKey];
-    const dValue = oldSize - nowSize;
-    if (dValue) {
-      if (sizeKey === "width") {
-        newPos[index].right -= dValue;
-        newPos[index][sizeKey] = nowSize;
-        for (let k = index + 1; k < positions.length; k++) {
-          newPos[k].left = positions[k - 1].right;
-          newPos[k].right -= dValue;
-        }
-      } else if (sizeKey === "height") {
-        newPos[index].bottom -= dValue;
-        newPos[index][sizeKey] = nowSize;
-        for (let k = index + 1; k < positions.length; k++) {
-          newPos[k].top = positions[k - 1].bottom;
-          newPos[k].bottom -= dValue;
-        }
-      }
-    }
-  });
-};
-const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { list: [], itemHeight: 66, itemEqual: true, direction: "vertical", overscan: 2 });
-const VirtualList = (props) => {
-  const _a = Object.assign(Object.assign({}, defaultProps), props), { list, itemRender, itemEqual, itemHeight, direction, overscan, key, onScroll, className, containerHeight } = _a, rest = __rest(_a, ["list", "itemRender", "itemEqual", "itemHeight", "direction", "overscan", "key", "onScroll", "className", "containerHeight"]);
-  const horizontal = direction === "horizontal";
-  const sizeKey = horizontal ? "width" : "height";
-  const scrollKey = horizontal ? "scrollLeft" : "scrollTop";
-  const offsetKey = horizontal ? "left" : "top";
-  const scrollRef = useRef(null);
-  const itemsRef = useRef(null);
-  const [positions, setPositions] = useState([
-    {
-      index: 0,
-      left: 0,
-      top: 0,
-      bottom: 0,
-      width: 0,
-      height: 0,
-      right: 0
-    }
-  ]);
-  const [listTotalSize, setListTotalSize] = useState(99999999);
-  const [visibleCount, setVisibleCount] = useState(0);
-  const [offSetSize, setOffSetSize] = useState(containerHeight || 0);
-  const [options, setOptions] = useState({
-    startOffset: 0,
-    // 可视区域距离顶部的偏移量
-    startIndex: 0,
-    // 可视区域开始索引
-    overStart: 0,
-    endIndex: 10
-    // 可视区域结束索引
-  });
-  useEffect(() => {
-    const pos = initPositinoCache(itemHeight, list.length);
-    setPositions(pos);
-    const totalSize = getListTotalSize(pos, horizontal);
-    setListTotalSize(totalSize);
-  }, [list, itemHeight, horizontal]);
-  const getElement = useCallback(() => {
-    var _a2;
-    return ((_a2 = scrollRef.current) === null || _a2 === void 0 ? void 0 : _a2.parentElement) || document.body;
-  }, []);
-  useEffect(() => {
-    if (containerHeight)
-      return;
-    const size = horizontal ? getElement().offsetWidth : getElement().offsetHeight;
-    setOffSetSize(size);
-  }, [getElement, horizontal, containerHeight]);
-  useEffect(() => {
-    if (offSetSize === 0)
-      return;
-    const count = Math.ceil(offSetSize / itemHeight) + overscan;
-    setVisibleCount(count);
-    setOptions((options2) => {
-      return Object.assign(Object.assign({}, options2), { endIndex: count });
-    });
-  }, [getElement, horizontal, itemHeight, overscan, offSetSize]);
-  const updateTotalSize = useCallback(() => {
-    if (!itemsRef.current)
-      return;
-    const items = itemsRef.current.children;
-    if (!items.length)
-      return;
-    updateItemSize(positions, items, sizeKey);
-    const totalSize = getListTotalSize(positions, horizontal);
-    setListTotalSize(totalSize);
-  }, [positions, sizeKey, horizontal]);
-  const scroll = useCallback(() => {
-    requestAnimationFrame((e) => {
-      const scrollSize = getElement()[scrollKey];
-      const startIndex = binarySearch(positions, horizontal, scrollSize);
-      const overStart = startIndex - overscan > -1 ? startIndex - overscan : 0;
-      if (!itemEqual) {
-        updateTotalSize();
-      }
-      const endIndex = getEndIndex({
-        list,
-        startIndex,
-        visibleCount,
-        itemEqual,
-        positions,
-        offSetSize,
-        sizeKey,
-        overscan
-      });
-      const startOffset = positions[startIndex][offsetKey];
-      setOptions({ startOffset, startIndex, overStart, endIndex });
-      if (endIndex > list.length - 1) {
-        if (onScroll) {
-          onScroll();
-        }
-      }
-    });
-  }, [
-    positions,
-    getElement,
-    list,
-    visibleCount,
-    itemEqual,
-    updateTotalSize,
-    offsetKey,
-    sizeKey,
-    scrollKey,
-    horizontal,
-    overscan,
-    offSetSize
-  ]);
-  useEffect(() => {
-    const element = getElement();
-    element.addEventListener("scroll", scroll, false);
-    return () => {
-      element.removeEventListener("scroll", scroll, false);
-    };
-  }, [getElement, scroll]);
-  return React__default.createElement(
-    "div",
-    Object.assign({ className: classNames("nut-virtualList-box", className) }, rest, { style: {
-      [sizeKey]: containerHeight ? `${offSetSize}px` : ""
-    } }),
-    React__default.createElement(
-      "div",
-      { ref: scrollRef, className: classNames({
-        "nut-horizontal-box": horizontal,
-        "nut-vertical-box": !horizontal
-      }), style: {
-        position: "relative",
-        [sizeKey]: `${listTotalSize}px`
-      } },
-      React__default.createElement("ul", { className: classNames("nut-virtuallist-items", {
-        "nut-horizontal-items": horizontal,
-        "nut-vertical-items": !horizontal
-      }), ref: itemsRef, style: {
-        transform: horizontal ? `translate3d(${options.startOffset}px,0,0)` : `translate3d(0,${options.startOffset}px,0)`
-      } }, list.slice(options.overStart, options.endIndex).map((data, index) => {
-        const { startIndex, overStart } = options;
-        const dataIndex = overStart + index;
-        const styleVal = dataIndex < startIndex ? "none" : "block";
-        const keyVal = key && data[key] ? data[key] : dataIndex;
-        return React__default.createElement("li", { "data-index": `${dataIndex}`, className: "nut-virtuallist-item", key: `${keyVal}`, style: { display: styleVal } }, itemRender ? itemRender(data, dataIndex, index) : data);
-      }))
-    )
-  );
-};
-VirtualList.displayName = "NutVirtualList";
-export {
-  VirtualList as default
-};

package/dist/esm/WaterMark/style/index.js

@@ -1,2 +0,0 @@
-
-import '../../../packages/watermark/watermark.scss'

package/dist/esm/WaterMark/style/style.css

@@ -1 +0,0 @@
-.nut-watermark{position:absolute;z-index:var(--nutui-watermark-z-index, 1200);left:0;right:0;top:0;bottom:0;pointer-events:none;background-repeat:repeat}.nut-watermark-full-page{position:fixed}

package/dist/esm/WaterMark.js

@@ -1,62 +0,0 @@
-import React__default, { useState, useEffect } from "react";
-import classNames from "classnames";
-import { useConfig } from "./ConfigProvider.js";
-import { C as ComponentDefaults } from "./typings.js";
-const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { content: "", fullPage: true, zIndex: 2e3, gapX: 24, gapY: 48, width: 120, height: 64, startX: 0, startY: 0, image: "", imageWidth: 120, imageHeight: 64, rotate: -22, color: "rgba(0,0,0,.15)", fontStyle: "normal", fontWeight: "normal", fontSize: 14 });
-const WaterMark = (props) => {
-  const { locale } = useConfig();
-  const { content, fullPage, zIndex, className, gapX, gapY, startX, startY, width, height, image, imageWidth, imageHeight, rotate, color, fontStyle, fontFamily, fontWeight, fontSize, style } = Object.assign(Object.assign({}, defaultProps), props);
-  const [base64Url, setBase64Url] = useState("");
-  const classPrefix = "nut-watermark";
-  const classes = classNames(classPrefix, {
-    [`${classPrefix}-full-page`]: fullPage
-  });
-  const cls = classNames(classes, className);
-  useEffect(() => {
-    init();
-  }, []);
-  const init = () => {
-    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) {
-        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 = image;
-        img.onload = () => {
-          ctx.drawImage(img, -imageWidth * ratio / 2, -imageHeight * ratio / 2, imageWidth * ratio, imageHeight * ratio);
-          ctx.restore();
-          setBase64Url(canvas.toDataURL());
-        };
-      } else if (content) {
-        ctx.textBaseline = "middle";
-        ctx.textAlign = "center";
-        ctx.translate(markWidth / 2, markHeight / 2);
-        ctx.rotate(Math.PI / 180 * Number(rotate));
-        const markSize = Number(fontSize) * ratio;
-        ctx.font = `${fontStyle} normal ${fontWeight} ${markSize}px/${markHeight}px ${fontFamily}`;
-        ctx.fillStyle = color;
-        ctx.fillText(content, startX, startY);
-        ctx.restore();
-        setBase64Url(canvas.toDataURL());
-      }
-    } else {
-      throw new Error(locale.watermark.errorCanvasTips);
-    }
-  };
-  return React__default.createElement("div", { className: cls, style: Object.assign({ zIndex, backgroundSize: `${gapX + width}px`, backgroundImage: `url('${base64Url}')` }, style) });
-};
-WaterMark.displayName = "NutWaterMark";
-export {
-  WaterMark as default
-};

package/dist/esm/badge2.js

@@ -1,67 +0,0 @@
-import React__default from "react";
-import classNames from "classnames";
-import { C as ComponentDefaults } from "./typings.js";
-import { useRtl } from "./ConfigProvider.js";
-const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { value: "", dot: false, max: 99, top: "4", right: "8", color: "", fill: "solid" });
-const Badge = (props) => {
-  var _a;
-  const rtl = useRtl();
-  const { className, style, value, max, children, dot, top, right, color, fill } = Object.assign(Object.assign({}, defaultProps), props);
-  const classPrefix = "nut-badge";
-  const classes = classNames(classPrefix, className, {
-    [`${classPrefix}-${fill}`]: fill === "outline"
-  });
-  function content() {
-    if (dot || typeof value === "object" || value === 0)
-      return null;
-    if (typeof value === "number" && typeof max === "number") {
-      return max < value ? `${max}+` : `${value}`;
-    }
-    return value;
-  }
-  function isIcon() {
-    if (typeof value === "object" && value)
-      return value;
-  }
-  function isNumber() {
-    if (typeof value === "number" && value)
-      return value;
-  }
-  function isString() {
-    if (typeof value === "string" && value)
-      return value;
-  }
-  const contentClasses = classNames({ [`${classPrefix}-dot`]: dot }, `${classPrefix}-content`, { [`${classPrefix}-sup`]: isNumber() || isString() || dot }, {
-    [`${classPrefix}-one`]: typeof content() === "string" && ((_a = `${content()}`) === null || _a === void 0 ? void 0 : _a.length) === 1
-  });
-  const getStyle = () => {
-    const style2 = {};
-    style2.top = `${Number(top) || parseFloat(String(top)) || 0}px`;
-    const dir = rtl ? "left" : "right";
-    style2[dir] = `${Number(right) || parseFloat(String(right)) || 0}px`;
-    if (color) {
-      if (fill === "outline") {
-        style2.color = color;
-        style2.background = "#fff";
-        if (!(color === null || color === void 0 ? void 0 : color.includes("gradient"))) {
-          style2.border = `1px solid ${color}`;
-        }
-      } else {
-        style2.color = "#fff";
-        style2.background = color;
-      }
-    }
-    return style2;
-  };
-  return React__default.createElement(
-    "div",
-    { className: classes, style },
-    isIcon() && React__default.createElement("div", { className: `${classPrefix}-icon` }, value),
-    children,
-    !isIcon() && React__default.createElement("div", { className: contentClasses, style: getStyle() }, content())
-  );
-};
-Badge.displayName = "NutBadge";
-export {
-  Badge as B
-};

package/dist/esm/button2.js

@@ -1,54 +0,0 @@
-import { _ as __rest } from "./tslib.es6.js";
-import React__default, { useCallback } from "react";
-import classNames from "classnames";
-import { Loading } from "@nutui/icons-react";
-import { C as ComponentDefaults } from "./typings.js";
-const prefixCls = "nut-button";
-const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { color: "", type: "default", size: "normal", shape: "round", fill: "outline", loading: false, disabled: false, block: false, icon: null, rightIcon: null, nativeType: "button", onClick: (e) => {
-} });
-const Button = React__default.forwardRef((props, ref) => {
-  const _a = Object.assign(Object.assign({}, defaultProps), props), { color, shape, fill, loading, disabled, type, size, block, icon, rightIcon, children, className, style, nativeType, onClick } = _a, rest = __rest(_a, ["color", "shape", "fill", "loading", "disabled", "type", "size", "block", "icon", "rightIcon", "children", "className", "style", "nativeType", "onClick"]);
-  const getStyle = useCallback(() => {
-    const style2 = {};
-    if (color) {
-      if (props.fill === "outline" || props.fill === "dashed") {
-        style2.color = color;
-        if (!(color === null || color === void 0 ? void 0 : color.includes("gradient"))) {
-          style2.borderColor = color;
-        }
-      } else {
-        style2.color = "#fff";
-        style2.background = color;
-        style2.borderColor = "transparent";
-      }
-    }
-    return style2;
-  }, [color, props.fill]);
-  const handleClick = (e) => {
-    if (!loading && !disabled && onClick) {
-      onClick(e);
-    }
-  };
-  return React__default.createElement(
-    "button",
-    Object.assign({}, rest, { ref, type: nativeType, className: classNames(prefixCls, `${prefixCls}-${type}`, props.fill ? `${prefixCls}-${fill}` : null, children ? "" : `${prefixCls}-icononly`, {
-      [`${prefixCls}-${size}`]: size,
-      [`${prefixCls}-${shape}`]: shape,
-      [`${prefixCls}-block`]: block,
-      [`${prefixCls}-disabled`]: disabled || loading,
-      [`${prefixCls}-loading`]: loading
-    }, className), style: Object.assign(Object.assign({}, getStyle()), style), onClick: (e) => handleClick(e) }),
-    React__default.createElement(
-      "div",
-      { className: "nut-button-wrap" },
-      loading && React__default.createElement(Loading, { className: "nut-icon-loading" }),
-      !loading && icon ? icon : null,
-      children && React__default.createElement("div", { className: `${icon || loading ? "nut-button-text" : ""}${rightIcon ? " nut-button-text right" : ""}` }, children),
-      rightIcon || null
-    )
-  );
-});
-Button.displayName = "NutButton";
-export {
-  Button as B
-};

package/dist/esm/can-use-dom.js

@@ -1,4 +0,0 @@
-const canUseDom = !!(typeof window !== "undefined" && typeof document !== "undefined" && window.document && window.document.createElement);
-export {
-  canUseDom as c
-};