@nutui/nutui-react-taro 2.0.0-alpha.0 → 2.0.0-alpha.10

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

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

package/dist/esm/card.taro-2080f4d2.js

@@ -0,0 +1,51 @@
+import React from "react";
+import classNames from "classnames";
+import { P as Price } from "./price.taro-479f1b82.js";
+import { T as Tag } from "./tag.taro-1b4134a5.js";
+import { c as cn } from "./bem-cdccae08.js";
+const defaultProps = {};
+const Card = (props) => {
+  const { className, style, imgUrl, title, price, vipPrice, shopDesc, delivery, shopName, shopTagTpl, originTpl, prolistTpl, footerTpl, ...rest } = {
+    ...defaultProps,
+    ...props
+  };
+  const b = cn("card");
+  return React.createElement(
+    "div",
+    { className: classNames(b(), className), style, ...rest },
+    React.createElement(
+      "div",
+      { className: b("left") },
+      React.createElement("img", { src: imgUrl, alt: "" })
+    ),
+    React.createElement(
+      "div",
+      { className: b("right") },
+      React.createElement("div", { className: b("right__title") }, title),
+      prolistTpl,
+      React.createElement(
+        "div",
+        { className: b("right__price") },
+        React.createElement(Price, { price }),
+        originTpl || React.createElement(Price, { className: b("right__price__origin"), price: vipPrice })
+      ),
+      React.createElement("div", { className: b("right__other") }, shopTagTpl || React.createElement(
+        React.Fragment,
+        null,
+        React.createElement(Tag, { type: "danger" }, shopDesc),
+        React.createElement(Tag, { plain: true }, delivery)
+      )),
+      React.createElement(
+        "div",
+        { className: b("right__shop") },
+        React.createElement("div", { className: b("right__shop__name") }, shopName),
+        footerTpl
+      )
+    )
+  );
+};
+Card.defaultProps = defaultProps;
+Card.displayName = "NutCard";
+export {
+  Card as C
+};

package/dist/esm/cascader.taro-fb7a0230.js

@@ -0,0 +1,471 @@
+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, { isValidElement, useState, useEffect } from "react";
+import classNames from "classnames";
+import { P as Popup } from "./popup.taro-e756f3fc.js";
+import { T as Tabs } from "./tabs.taro-66164782.js";
+import { Loading, Checklist } from "@nutui/icons-react-taro";
+import { C as ComponentDefaults } from "./typings-11d83a22.js";
+import { u as usePropsValue } from "./use-props-value-7ac1b1b5.js";
+const defaultProps$1 = {
+  data: {
+    text: "",
+    value: "",
+    paneKey: "",
+    disabled: false,
+    loading: false,
+    children: []
+  },
+  activeColor: "",
+  checked: false,
+  activeIcon: "checklist",
+  chooseItem: () => {
+  }
+};
+const InternalCascaderItem = (props, ref) => {
+  const { data, checked, activeIcon, chooseItem, activeColor } = {
+    ...defaultProps$1,
+    ...props
+  };
+  const classPrefix = "nut-cascader-item";
+  const classes = classNames({
+    active: checked,
+    disabled: data.disabled
+  }, classPrefix);
+  const classesTitle = classNames({
+    [`${classPrefix}__title`]: true
+  });
+  const renderIcon = () => {
+    if (checked) {
+      if (isValidElement(activeIcon)) {
+        return activeIcon;
+      }
+      return React.createElement(Checklist, { className: `${checked ? `${classPrefix}__icon-check` : ""}` });
+    }
+    return null;
+  };
+  return React.createElement(
+    "div",
+    { style: { color: checked ? activeColor : "" }, className: classes, onClick: () => {
+      chooseItem(data);
+    } },
+    React.createElement("div", { className: classesTitle }, data.text),
+    data.loading ? React.createElement(Loading, { color: "#969799", className: "nut-cascader-item__icon-loading" }) : renderIcon()
+  );
+};
+const CascaderItem = React.forwardRef(InternalCascaderItem);
+CascaderItem.defaultProps = defaultProps$1;
+CascaderItem.displayName = "NutCascaderItem";
+const formatTree = (tree, parent, config) => tree.map((node) => {
+  const { value: valueKey = "value", text: textKey = "text", children: childrenKey = "children" } = config;
+  const { [valueKey]: value, [textKey]: text, [childrenKey]: children, ...others } = node;
+  const newNode = {
+    loading: false,
+    ...others,
+    level: parent ? (parent && parent.level || 0) + 1 : 0,
+    value,
+    text,
+    children,
+    _parent: parent
+  };
+  if (newNode.children && newNode.children.length) {
+    newNode.children = formatTree(newNode.children, newNode, config);
+  }
+  return newNode;
+});
+const eachTree = (tree, cb) => {
+  let i = 0;
+  let node;
+  while (node = tree[i++]) {
+    if (cb(node) === true) {
+      break;
+    }
+    if (node.children && node.children.length) {
+      eachTree(node.children, cb);
+    }
+  }
+};
+const defaultConvertConfig = {
+  topId: null,
+  idKey: "id",
+  pidKey: "pid",
+  sortKey: ""
+};
+const convertListToOptions = (list, options) => {
+  const mergedOptions = {
+    ...defaultConvertConfig,
+    ...options || {}
+  };
+  const { topId, idKey, pidKey, sortKey } = mergedOptions;
+  let result = [];
+  let map = {};
+  list.forEach((node) => {
+    node = { ...node };
+    const { [idKey]: id, [pidKey]: pid } = node;
+    const children = map[pid] = map[pid] || [];
+    if (!result.length && pid === topId) {
+      result = children;
+    }
+    children.push(node);
+    node.children = map[id] || (map[id] = []);
+  });
+  if (sortKey) {
+    Object.keys(map).forEach((i) => {
+      if (map[i].length > 1) {
+        map[i].sort((a, b) => a[sortKey] - b[sortKey]);
+      }
+    });
+  }
+  map = null;
+  return result;
+};
+class Tree {
+  constructor(nodes, config) {
+    __publicField(this, "nodes");
+    __publicField(this, "config");
+    __publicField(this, "isLeaf", (node, lazy) => {
+      const { leaf, children } = node;
+      const hasChildren = Array.isArray(children) && Boolean(children.length);
+      return leaf || !hasChildren && !lazy;
+    });
+    __publicField(this, "hasChildren", (node, lazy) => {
+      const isLeaf = this.isLeaf(node, lazy);
+      if (isLeaf) {
+        return false;
+      }
+      const { children } = node;
+      return Array.isArray(children) && Boolean(children.length);
+    });
+    this.config = {
+      value: "value",
+      text: "text",
+      children: "children",
+      ...config || {}
+    };
+    this.nodes = formatTree(nodes, null, this.config);
+  }
+  updateChildren(nodes, parent) {
+    if (!parent) {
+      this.nodes = formatTree(nodes, null, this.config);
+    } else {
+      parent.children = formatTree(nodes, parent, this.config);
+    }
+  }
+  // for test
+  getNodeByValue(value) {
+    let foundNode;
+    eachTree(this.nodes, (node) => {
+      if (node.value === value) {
+        foundNode = node;
+        return true;
+      }
+      return null;
+    });
+    return foundNode;
+  }
+  getPathNodesByValue(value) {
+    if (!value.length) {
+      return [];
+    }
+    const pathNodes = [];
+    let currentNodes = this.nodes;
+    while (currentNodes && currentNodes.length) {
+      const foundNode = currentNodes.find((node) => node.value === value[node.level]);
+      if (!foundNode) {
+        break;
+      }
+      pathNodes.push(foundNode);
+      currentNodes = foundNode.children;
+    }
+    return pathNodes;
+  }
+}
+const Tree$1 = Tree;
+const defaultProps = {
+  ...ComponentDefaults,
+  activeColor: "",
+  activeIcon: "checklist",
+  popup: true,
+  visible: false,
+  options: [],
+  title: "",
+  optionKey: { textKey: "text", valueKey: "value", childrenKey: "children" },
+  format: {},
+  closeable: false,
+  closeIconPosition: "top-right",
+  closeIcon: "close",
+  lazy: false,
+  onLoad: () => {
+  },
+  onClose: () => {
+  },
+  onChange: () => {
+  },
+  onPathChange: () => {
+  }
+};
+const InternalCascader = (props, ref) => {
+  const { className, style, popup, visible, options, value, defaultValue, title, optionKey, format, closeable, closeIconPosition, closeIcon, lazy, onLoad, onClose, onChange, onPathChange } = { ...defaultProps, ...props };
+  const [tabvalue, setTabvalue] = useState("c1");
+  const [optionsData, setOptionsData] = useState([]);
+  const isLazy = () => state.configs.lazy && Boolean(state.configs.onLoad);
+  const [innerValue, setInnerValue] = usePropsValue({
+    value,
+    defaultValue,
+    finalValue: defaultValue,
+    onChange: (val) => {
+      var _a;
+      (_a = props.onChange) == null ? void 0 : _a.call(props, val);
+    }
+  });
+  const [state] = useState({
+    optionsData: [],
+    panes: [
+      {
+        nodes: [],
+        selectedNode: [],
+        paneKey: ""
+      }
+    ],
+    tree: new Tree$1([], {}),
+    tabsCursor: 0,
+    initLoading: false,
+    currentProcessNode: [],
+    configs: {
+      lazy,
+      onLoad,
+      optionKey,
+      format
+    },
+    lazyLoadMap: /* @__PURE__ */ new Map()
+  });
+  const classPrefix = classNames(`nut-cascader`);
+  const classesPane = classNames({
+    [`${classPrefix}-pane`]: true
+  });
+  useEffect(() => {
+    initData();
+  }, [options, format]);
+  useEffect(() => {
+    if (defaultValue && defaultValue !== innerValue) {
+      setInnerValue(defaultValue);
+    }
+  }, [defaultValue]);
+  const initData = async () => {
+    state.lazyLoadMap.clear();
+    if (format && Object.keys(format).length > 0) {
+      state.optionsData = convertListToOptions(options, format);
+    } else {
+      state.optionsData = options;
+    }
+    state.tree = new Tree$1(state.optionsData, {
+      value: state.configs.optionKey.valueKey,
+      text: state.configs.optionKey.textKey,
+      children: state.configs.optionKey.childrenKey
+    });
+    if (isLazy() && !state.tree.nodes.length) {
+      await invokeLazyLoad({
+        root: true,
+        loading: true,
+        text: "",
+        value: ""
+      });
+    }
+    state.panes = [
+      {
+        nodes: state.tree.nodes,
+        selectedNode: null,
+        paneKey: "c1"
+      }
+    ];
+    syncValue();
+    setOptionsData(state.panes);
+  };
+  const syncValue = async () => {
+    const currentValue = innerValue;
+    if (currentValue === void 0 || currentValue !== defaultValue || !state.tree.nodes.length) {
+      return;
+    }
+    if (currentValue.length === 0) {
+      state.tabsCursor = 0;
+      return;
+    }
+    let needToSync = currentValue;
+    if (isLazy() && Array.isArray(currentValue) && currentValue.length) {
+      needToSync = [];
+      const parent = state.tree.nodes.find((node) => node.value === currentValue[0]);
+      if (parent) {
+        needToSync = [parent.value];
+        state.initLoading = true;
+        const last = await currentValue.slice(1).reduce(async (p, value2) => {
+          var _a;
+          const parent2 = await p;
+          await invokeLazyLoad(parent2);
+          const node = (_a = parent2 == null ? void 0 : parent2.children) == null ? void 0 : _a.find((item) => item.value === value2);
+          if (node) {
+            needToSync.push(value2);
+          }
+          return Promise.resolve(node);
+        }, Promise.resolve(parent));
+        await invokeLazyLoad(last);
+        state.initLoading = false;
+      }
+    }
+    if (needToSync.length && currentValue === defaultValue) {
+      const pathNodes = state.tree.getPathNodesByValue(needToSync);
+      pathNodes.forEach((node, index) => {
+        state.tabsCursor = index;
+        chooseItem(node, true);
+      });
+    }
+  };
+  const invokeLazyLoad = async (node) => {
+    if (!node) {
+      return;
+    }
+    if (!state.configs.onLoad) {
+      node.leaf = true;
+      return;
+    }
+    if (state.tree.isLeaf(node, isLazy()) || state.tree.hasChildren(node, isLazy())) {
+      return;
+    }
+    node.loading = true;
+    const parent = node.root ? null : node;
+    let lazyLoadPromise = state.lazyLoadMap.get(node);
+    if (!lazyLoadPromise) {
+      lazyLoadPromise = new Promise((resolve) => {
+        var _a, _b;
+        (_b = (_a = state.configs).onLoad) == null ? void 0 : _b.call(_a, node, resolve);
+      });
+      state.lazyLoadMap.set(node, lazyLoadPromise);
+    }
+    const nodes = await lazyLoadPromise;
+    if (Array.isArray(nodes) && nodes.length > 0) {
+      state.tree.updateChildren(nodes, parent);
+    } else {
+      node.leaf = true;
+    }
+    node.loading = false;
+    state.lazyLoadMap.delete(node);
+  };
+  const close = () => {
+    onClose && onClose();
+  };
+  const closePopup = () => {
+    close();
+  };
+  const chooseItem = async (node, type) => {
+    if (!type && node.disabled || !state.panes[state.tabsCursor]) {
+      return;
+    }
+    if (state.tree.isLeaf(node, isLazy())) {
+      node.leaf = true;
+      state.panes[state.tabsCursor].selectedNode = node;
+      state.panes = state.panes.slice(0, node.level + 1);
+      if (!type) {
+        const pathNodes = state.panes.map((item) => item.selectedNode);
+        const optionParams = pathNodes.map((item) => item.value);
+        onChange(optionParams, pathNodes);
+        onPathChange(optionParams, pathNodes);
+        setInnerValue(optionParams);
+      }
+      setOptionsData(state.panes);
+      close();
+      return;
+    }
+    if (state.tree.hasChildren(node, isLazy())) {
+      const level = node.level + 1;
+      state.panes[state.tabsCursor].selectedNode = node;
+      state.panes = state.panes.slice(0, level);
+      state.tabsCursor = level;
+      state.panes.push({
+        nodes: node.children || [],
+        selectedNode: null,
+        paneKey: `c${state.tabsCursor + 1}`
+      });
+      setOptionsData(state.panes);
+      setTabvalue(`c${state.tabsCursor + 1}`);
+      if (!type) {
+        const pathNodes = state.panes.map((item) => item.selectedNode);
+        const optionParams = pathNodes.map((item) => item == null ? void 0 : item.value);
+        onPathChange(optionParams, pathNodes);
+      }
+      return;
+    }
+    state.currentProcessNode = node;
+    if (node.loading) {
+      return;
+    }
+    await invokeLazyLoad(node);
+    if (state.currentProcessNode === node) {
+      state.panes[state.tabsCursor].selectedNode = node;
+      chooseItem(node, type);
+    }
+    setOptionsData(state.panes);
+  };
+  const renderItem = () => {
+    return React.createElement(
+      "div",
+      { className: `${classPrefix} ${className}`, style },
+      popup && React.createElement("div", { className: "nut-cascader__title" }, title),
+      React.createElement(Tabs, { value: tabvalue, title: () => {
+        return optionsData.map((pane, index) => {
+          var _a, _b;
+          return React.createElement(
+            "div",
+            { onClick: () => {
+              setTabvalue(pane.paneKey);
+              state.tabsCursor = index;
+            }, className: `nut-tabs__titles-item ${tabvalue === pane.paneKey ? "nut-tabs__titles-item--active" : ""}`, key: pane.paneKey },
+            React.createElement(
+              "span",
+              { className: "nut-tabs__titles-item__text" },
+              !state.initLoading && state.panes.length && ((_a = pane == null ? void 0 : pane.selectedNode) == null ? void 0 : _a.text),
+              !state.initLoading && state.panes.length && !((_b = pane == null ? void 0 : pane.selectedNode) == null ? void 0 : _b.text) && "请选择",
+              !(!state.initLoading && state.panes.length) && "Loading..."
+            ),
+            React.createElement("span", { className: "nut-tabs__titles-item__line" })
+          );
+        });
+      } }, !state.initLoading && state.panes.length ? optionsData.map((pane) => React.createElement(
+        Tabs.TabPane,
+        { key: pane.paneKey, value: pane.paneKey },
+        React.createElement("div", { className: classesPane }, pane.nodes && pane.nodes.map((node, index) => {
+          var _a;
+          return React.createElement(CascaderItem, { key: index, ...props, data: node, checked: ((_a = pane.selectedNode) == null ? void 0 : _a.value) === node.value, chooseItem: (node2) => chooseItem(node2, false) });
+        }))
+      )) : React.createElement(
+        Tabs.TabPane,
+        null,
+        React.createElement("div", { className: classesPane })
+      ))
+    );
+  };
+  return React.createElement(React.Fragment, null, popup ? React.createElement(
+    Popup,
+    {
+      // className="nut-cascadar-popup"
+      visible,
+      position: "bottom",
+      round: true,
+      closeIcon,
+      closeable,
+      closeIconPosition,
+      // todo 只关闭，不处理逻辑。和popup的逻辑不一致。关闭时需要增加是否要处理回调
+      onClickOverlay: closePopup,
+      onClickCloseIcon: closePopup
+    },
+    renderItem()
+  ) : renderItem());
+};
+const Cascader = React.forwardRef(InternalCascader);
+Cascader.defaultProps = defaultProps;
+Cascader.displayName = "NutCascader";
+export {
+  Cascader as C
+};

package/dist/esm/cell.taro-4e31d1fa.js

@@ -0,0 +1,48 @@
+import React from "react";
+import classNames from "classnames";
+import { C as ComponentDefaults } from "./typings-11d83a22.js";
+const defaultProps = {
+  ...ComponentDefaults,
+  title: null,
+  description: null,
+  extra: null,
+  radius: "6px",
+  align: "flex-start",
+  onClick: (event) => {
+  }
+};
+const classPrefix = "nut-cell";
+const Cell = (props) => {
+  const { children, onClick, title, description, extra, radius, align, className, style, ...rest } = {
+    ...defaultProps,
+    ...props
+  };
+  const handleClick = (event) => {
+    onClick(event);
+  };
+  const baseStyle = {
+    ...style,
+    borderRadius: Number.isNaN(Number(radius)) ? String(radius) : `${radius}px`,
+    alignItems: align
+  };
+  const styles = title || description ? {} : {
+    flex: 1
+  };
+  return React.createElement("div", { className: classNames(classPrefix, className), onClick: (event) => handleClick(event), style: baseStyle, ...rest }, children || React.createElement(
+    React.Fragment,
+    null,
+    title || description ? React.createElement(
+      "div",
+      { className: `${classPrefix}__left` },
+      title ? React.createElement("div", { className: `${classPrefix}__title` }, title) : null,
+      description ? React.createElement("div", { className: `${classPrefix}__description` }, description) : null
+    ) : null,
+    extra ? React.createElement("div", { className: `${classPrefix}__extra`, style: styles }, extra) : null,
+    React.createElement("div", { className: `${classPrefix}__divider` })
+  ));
+};
+Cell.defaultProps = defaultProps;
+Cell.displayName = "NutCell";
+export {
+  Cell as C
+};

package/dist/esm/cellgroup.taro-a790d91b.js

@@ -0,0 +1,28 @@
+import React from "react";
+import classNames from "classnames";
+import { C as ComponentDefaults } from "./typings-11d83a22.js";
+const defaultProps = {
+  ...ComponentDefaults,
+  title: "",
+  description: "",
+  divider: true
+};
+const classPrefix = "nut-cell-group";
+const CellGroup = (props) => {
+  const { children, className, style, title, description, divider, ...rest } = {
+    ...defaultProps,
+    ...props
+  };
+  return React.createElement(
+    "div",
+    { className: classNames(classPrefix, className), ...rest },
+    title ? React.createElement("div", { className: `${classPrefix}__title` }, title) : null,
+    description ? React.createElement("div", { className: `${classPrefix}__description` }, description) : null,
+    React.createElement("div", { className: `${classPrefix}__wrap ${divider ? `${classPrefix}__wrap--divider` : ""}` }, children)
+  );
+};
+CellGroup.defaultProps = defaultProps;
+CellGroup.displayName = "NutCellGroup";
+export {
+  CellGroup as C
+};