@nutui/nutui-react-taro 2.0.0-alpha.4 → 2.0.0-alpha.6

package/dist/esm/searchbar.taro-37ade36e.js

@@ -0,0 +1,159 @@
+import React, { useRef, useState, useEffect } from "react";
+import { getEnv } from "@tarojs/taro";
+import { Search, CircleClose } from "@nutui/icons-react-taro";
+import { c as cn } from "./bem-cdccae08.js";
+import { u as useConfig } from "./configprovider.taro-25758d9f.js";
+import { C as ComponentDefaults } from "./typings-11d83a22.js";
+const defaultProps = {
+  ...ComponentDefaults,
+  placeholder: "",
+  shape: "square",
+  disabled: false,
+  maxLength: 9999,
+  clearable: true,
+  clearSize: "12px",
+  align: "left",
+  readonly: true,
+  autoFocus: false,
+  label: "",
+  leftinIcon: React.createElement(Search, { size: "12" })
+};
+const SearchBar = (props) => {
+  const searchbarBem = cn("searchbar");
+  const { locale } = useConfig();
+  const searchRef = useRef(null);
+  const [value, setValue] = useState(() => props.value);
+  const { placeholder, shape, className, disabled, maxLength, clearable, clearSize, align, readOnly, autoFocus, label, actionText, leftinIcon, rightinIcon, leftoutIcon, rightoutIcon, onChange, onFocus, onBlur, onClear, onCancel, onSearch, onClickInput, onClickLeftinIcon, onClickLeftoutIcon, onClickRightinIcon, onClickRightoutIcon } = {
+    ...defaultProps,
+    ...props
+  };
+  const alignClass = `${align}`;
+  const forceFocus = () => {
+    const searchSelf = searchRef.current;
+    searchSelf && searchSelf.focus();
+  };
+  const change = (event) => {
+    const { value: value2 } = event.target;
+    onChange && (onChange == null ? void 0 : onChange(value2, event));
+    setValue(value2);
+    value2 === "" && forceFocus();
+  };
+  const focus = (event) => {
+    const { value: value2 } = event.target;
+    onFocus && (onFocus == null ? void 0 : onFocus(value2, event));
+  };
+  const blur = (event) => {
+    const searchSelf = searchRef.current;
+    searchSelf && searchSelf.blur();
+    const { value: value2 } = event.target;
+    onBlur && (onBlur == null ? void 0 : onBlur(value2, event));
+  };
+  useEffect(() => {
+    setValue(props.value);
+  }, [props.value]);
+  useEffect(() => {
+    autoFocus && forceFocus();
+  }, [autoFocus]);
+  const renderField = () => {
+    return React.createElement("input", { className: `${searchbarBem("input")}  ${searchbarBem(alignClass)} ${shape === "round" ? searchbarBem("round") : ""} ${clearable ? searchbarBem("input-clear") : ""}`, ref: searchRef, style: { ...props.style }, value: value || "", placeholder: placeholder || locale.placeholder, disabled, readOnly, maxLength, onKeyPress: onKeypress, onChange: (e) => change(e), onFocus: (e) => focus(e), onBlur: (e) => blur(e), onClick: (e) => clickInput(e) });
+  };
+  const clickInput = (e) => {
+    onClickInput && onClickInput(e);
+  };
+  const renderLeftinIcon = () => {
+    if (!leftinIcon)
+      return null;
+    return React.createElement("div", { className: `${searchbarBem("leftin-icon")} ${searchbarBem("icon")}`, onClick: (e) => clickLeftIcon("in-left", e) }, leftinIcon);
+  };
+  const renderLeftoutIcon = () => {
+    if (!leftoutIcon)
+      return null;
+    return React.createElement("div", { className: `${searchbarBem("leftout-icon")}`, onClick: (e) => clickLeftIcon("out-left", e) }, leftoutIcon);
+  };
+  const clickLeftIcon = (flag, event) => {
+    if (flag === "in-left") {
+      onClickLeftinIcon && onClickLeftinIcon(value, event);
+    } else {
+      onClickLeftoutIcon && onClickLeftoutIcon(value, event);
+    }
+  };
+  const renderRightinIcon = () => {
+    if (!rightinIcon)
+      return null;
+    return React.createElement("div", { className: `${searchbarBem("rightin-icon")} ${searchbarBem("icon")}`, onClick: (e) => clickRightIcon("in-right", e) }, rightinIcon);
+  };
+  const renderRightoutIcon = () => {
+    if (!rightoutIcon)
+      return null;
+    return React.createElement("div", { className: `${searchbarBem("rightout-icon")}`, onClick: (e) => clickRightIcon("out-right", e) }, rightoutIcon);
+  };
+  const clickRightIcon = (flag, event) => {
+    if (flag === "in-left") {
+      onClickRightinIcon && onClickRightinIcon(value, event);
+    } else {
+      onClickRightoutIcon && onClickRightoutIcon(value, event);
+    }
+  };
+  const handleClear = () => {
+    return React.createElement(
+      "div",
+      { className: `${searchbarBem("clear")} ${rightinIcon ? "pos-right" : ""}`, onClick: (e) => clearaVal(e) },
+      React.createElement(CircleClose, { size: clearSize, color: "#555" })
+    );
+  };
+  const clearaVal = (event) => {
+    if (disabled || readOnly) {
+      return;
+    }
+    setValue("");
+    onClear && onClear(event);
+    forceFocus();
+  };
+  const renderRightLabel = () => {
+    if (actionText) {
+      return React.createElement("div", { className: searchbarBem("action-text"), onClick: search }, actionText);
+    }
+    return null;
+  };
+  const onKeypress = (e) => {
+    if (e.keyCode === 13) {
+      if (typeof e.cancelable !== "boolean" || e.cancelable) {
+        e.preventDefault();
+      }
+      onSearch && onSearch(value);
+    }
+  };
+  const search = () => {
+    onSearch && onSearch(value);
+  };
+  const renderLabel = () => {
+    if (label) {
+      return React.createElement("div", { className: searchbarBem("label") }, label);
+    }
+    return null;
+  };
+  const envClass = () => {
+    return getEnv() === "WEB" ? "nut-searchbar-taro" : "";
+  };
+  return React.createElement(
+    "div",
+    { className: `${searchbarBem()} ${envClass()} ${disabled ? searchbarBem("disabled") : ""}  ${className || ""}`, style: { ...props.style, background: props.background } },
+    renderLeftoutIcon(),
+    renderLabel(),
+    React.createElement(
+      "div",
+      { className: `${searchbarBem("content")}`, style: { background: props.inputBackground } },
+      renderLeftinIcon(),
+      React.createElement("div", { className: "nut-searchbar__input-box" }, renderField()),
+      renderRightinIcon(),
+      clearable && value && handleClear()
+    ),
+    renderRightoutIcon(),
+    renderRightLabel()
+  );
+};
+SearchBar.defaultProps = defaultProps;
+SearchBar.displayName = "NutSearchBar";
+export {
+  SearchBar as S
+};

package/dist/esm/shortpassword.taro-f7292032.js

@@ -0,0 +1,146 @@
+import React, { useRef, useState, useEffect } from "react";
+import { Tips } from "@nutui/icons-react-taro";
+import { c as cn } from "./bem-cdccae08.js";
+import { P as Popup } from "./popup.taro-e756f3fc.js";
+import { u as useConfig } from "./configprovider.taro-25758d9f.js";
+import { C as ComponentDefaults } from "./typings-11d83a22.js";
+const defaultProps = {
+  ...ComponentDefaults,
+  title: "",
+  description: "",
+  tips: "",
+  tipsIcon: null,
+  iconSize: 11,
+  visible: false,
+  modelValue: "",
+  errorMsg: "",
+  noButton: true,
+  closeOnClickOverlay: true,
+  length: 6,
+  className: "",
+  autoFocus: false,
+  onChange: (value) => {
+  },
+  onOk: (value) => {
+  },
+  onCancel: () => {
+  },
+  onClose: () => {
+  },
+  onTips: () => {
+  },
+  onComplete: (value) => {
+  }
+};
+const ShortPassword = (props) => {
+  const { locale } = useConfig();
+  const { title, description, tips, tipsIcon, iconSize, visible, modelValue, errorMsg, noButton, closeOnClickOverlay, length, style, className, onChange, onOk, onTips, onCancel, onClose, onComplete, autoFocus, ...reset } = props;
+  const b = cn("shortpassword");
+  const textInput = useRef(null);
+  const range = (val) => {
+    return Math.min(Math.max(4, val), 6);
+  };
+  const [innerVisible, setInnerVisible] = useState(visible);
+  const [comLen, setComLen] = useState(range(Number(length)));
+  const [inputValue, setInputValue] = useState("");
+  useEffect(() => {
+    setInnerVisible(visible);
+  }, [visible]);
+  useEffect(() => {
+    if (typeof modelValue !== "undefined") {
+      setInputValue(modelValue);
+    }
+  }, [modelValue]);
+  const changeValue = (e) => {
+    let inputValue2 = e.target.value;
+    if (String(inputValue2).length > comLen) {
+      inputValue2 = inputValue2.slice(0, comLen);
+    }
+    setInputValue(inputValue2);
+    if (String(inputValue2).length === comLen) {
+      onComplete && onComplete(inputValue2);
+    }
+    onChange && onChange(inputValue2);
+  };
+  const systemStyle = () => {
+    const u = navigator.userAgent;
+    const isAndroid = u.indexOf("Android") > -1 || u.indexOf("Linux") > -1;
+    const isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
+    let style2 = {};
+    if (isIOS) {
+      style2 = {
+        paddingRight: "1200px"
+      };
+    }
+    if (isAndroid) {
+      style2 = {
+        opacity: 0,
+        zIndex: 10
+      };
+    }
+    return style2;
+  };
+  const focus = () => {
+    if (textInput.current) {
+      textInput.current.focus();
+    }
+  };
+  const sure = () => {
+    onOk && onOk(inputValue);
+  };
+  const renderIcon = (size = "11px") => {
+    return React.isValidElement(tipsIcon) ? React.cloneElement(tipsIcon, {
+      ...tipsIcon.props,
+      size
+    }) : React.createElement(Tips, { size });
+  };
+  return React.createElement(
+    "div",
+    null,
+    React.createElement(
+      Popup,
+      { style: {
+        padding: "32px 24px 28px 24px",
+        borderRadius: "12px",
+        textAlign: "center"
+      }, visible: innerVisible, closeable: true, "close-on-click-overlay": closeOnClickOverlay, onClickOverlay: onClose, onClickCloseIcon: onClose },
+      React.createElement(
+        "div",
+        { className: `${b()} ${className}`, style: { ...style }, ...reset },
+        React.createElement("div", { className: b("title") }, title || locale.shortpassword.title),
+        React.createElement("div", { className: b("subtitle") }, description || locale.shortpassword.description),
+        React.createElement(
+          "div",
+          { className: b("input") },
+          React.createElement("input", { ref: textInput, className: b("input-real"), type: "number", style: systemStyle(), maxLength: 6, value: inputValue, autoFocus, onChange: (e) => changeValue(e) }),
+          React.createElement("div", { className: b("input-site") }),
+          React.createElement("div", { className: b("input-fake"), onClick: () => focus() }, [...new Array(comLen).keys()].map((item, index) => {
+            return React.createElement("div", { className: b("input-fake__li"), key: index }, String(inputValue).length > index ? React.createElement("div", { className: b("input-fake__li__icon") }) : null);
+          }))
+        ),
+        React.createElement(
+          "div",
+          { className: b("message") },
+          React.createElement("div", { className: b("message__error") }, errorMsg),
+          tips || locale.shortpassword.tips ? React.createElement(
+            "div",
+            { className: b("message__forget") },
+            renderIcon(iconSize),
+            React.createElement("div", { className: b("message__forget-tips"), onClick: onTips }, tips || locale.shortpassword.tips)
+          ) : null
+        ),
+        !noButton ? React.createElement(
+          "div",
+          { className: b("footer") },
+          React.createElement("div", { className: b("footer__cancel"), onClick: onCancel }, locale.cancel),
+          React.createElement("div", { className: b("footer__sure"), onClick: () => sure() }, locale.confirm)
+        ) : null
+      )
+    )
+  );
+};
+ShortPassword.defaultProps = defaultProps;
+ShortPassword.displayName = "NutShortPassword";
+export {
+  ShortPassword as S
+};

package/dist/esm/sidenavbar.taro-9f210df4.js

@@ -0,0 +1,51 @@
+import React, { useState } from "react";
+import { P as Popup } from "./popup.taro-e756f3fc.js";
+import { O as OffsetContext } from "./offsetContext-f32a9246.js";
+const defaultProps = {
+  showhead: false,
+  position: "left",
+  width: "80%"
+};
+const SideNavBar = (props) => {
+  const { title, visible, width, position, children, className, showhead, onClose, ...rest } = {
+    ...defaultProps,
+    ...props
+  };
+  const offset = props.offset ? Number(props.offset) : 20;
+  const [sidenavbarShow, setSidenavbarShow] = useState(true);
+  const handleClick = () => {
+    setSidenavbarShow(!sidenavbarShow);
+  };
+  return React.createElement(
+    Popup,
+    { visible, style: { width, height: "100%" }, position, onClose },
+    React.createElement(
+      "div",
+      { className: className ? `${className} nut-sidenavbar` : "nut-sidenavbar", ...rest },
+      React.createElement(
+        "div",
+        { className: "nut-sidenavbar__content" },
+        React.createElement(
+          "div",
+          { className: `nut-sidenavbar__list ${sidenavbarShow ? "nutShow" : "nutHide"}`, onClick: handleClick },
+          React.createElement(
+            "div",
+            { className: "nut-sidenavbar__title border-bt ", style: { paddingLeft: `${offset}px` } },
+            title,
+            React.createElement("i", { className: `arrow-icon ${sidenavbarShow ? "arrow-up" : "arrow-down"}` })
+          ),
+          React.createElement(
+            OffsetContext.Provider,
+            { value: offset },
+            React.createElement("div", { className: "nut-sidenavbar__content" }, children)
+          )
+        )
+      )
+    )
+  );
+};
+SideNavBar.defaultProps = defaultProps;
+SideNavBar.displayName = "NutSideNavBar";
+export {
+  SideNavBar as S
+};

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

@@ -0,0 +1,12 @@
+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/signature.taro-c57469aa.js

@@ -0,0 +1,146 @@
+import React, { useRef, useState, useEffect } from "react";
+import { getEnv, nextTick, createSelectorQuery, canvasToTempFilePath } from "@tarojs/taro";
+import { B as Button } from "./button.taro-01eae688.js";
+import { c as cn } from "./bem-cdccae08.js";
+import { u as useConfig } from "./configprovider.taro-25758d9f.js";
+const defaultProps = {
+  canvasId: "spcanvas",
+  type: "png",
+  lineWidth: 2,
+  strokeStyle: "#000",
+  className: ""
+};
+const Signature = (props) => {
+  const { locale } = useConfig();
+  const { canvasId, type, lineWidth, strokeStyle, unSupportTpl, className, confirm, clear, onConfirm, onClear, ...rest } = {
+    ...defaultProps,
+    ...props
+  };
+  const b = cn("signature");
+  const canvasRef = useRef(null);
+  const wrapRef = useRef(null);
+  const [canvasHeight, setCanvasHeight] = useState(0);
+  const [canvasWidth, setCanvasWidth] = useState(0);
+  const ctx = useRef(null);
+  const [disalbeScroll] = useState("true");
+  const startEventHandler = (event) => {
+    if (ctx.current) {
+      ctx.current.beginPath();
+      ctx.current.lineWidth = lineWidth;
+      ctx.current.strokeStyle = strokeStyle;
+    }
+  };
+  const moveEventHandler = (event) => {
+    if (ctx.current) {
+      const evt = event.changedTouches[0];
+      let mouseX = evt.x || evt.clientX;
+      let mouseY = evt.y || evt.clientY;
+      if (getEnv() === "WEB" && canvasRef.current) {
+        const coverPos = canvasRef.current.getBoundingClientRect();
+        mouseX = evt.clientX - coverPos.left;
+        mouseY = evt.clientY - coverPos.top;
+      }
+      nextTick(() => {
+        var _a, _b;
+        (_a = ctx.current) == null ? void 0 : _a.lineTo(mouseX, mouseY);
+        (_b = ctx.current) == null ? void 0 : _b.stroke();
+      });
+    }
+  };
+  const endEventHandler = (event) => {
+  };
+  const handleClearBtn = () => {
+    if (ctx.current) {
+      ctx.current.clearRect(0, 0, canvasWidth, canvasHeight);
+      ctx.current.closePath();
+    }
+    clear && clear();
+    onClear && onClear();
+  };
+  const handleConfirmBtn = () => {
+    onSave();
+  };
+  const onSave = () => {
+    createSelectorQuery().select(`#${canvasId}`).fields({
+      node: true,
+      size: true
+    }).exec((res) => {
+      canvasToTempFilePath({
+        canvas: res[0].node,
+        fileType: props.type,
+        canvasId: `${canvasId}`,
+        success: (res2) => {
+          handleClearBtn();
+          confirm && confirm(res2.tempFilePath);
+          onConfirm && onConfirm(res2.tempFilePath);
+        },
+        fail: (res2) => {
+          console.log("保存失败");
+        }
+      });
+    });
+  };
+  const canvasSetting = (canvasDom, width, height) => {
+    const canvas = canvasDom;
+    canvas.current = canvas;
+    ctx.current = canvas.getContext("2d");
+    setCanvasWidth(width);
+    setCanvasHeight(height);
+    canvas.width = width;
+    canvas.height = height;
+    if (ctx.current) {
+      ctx.current.clearRect(0, 0, width, height);
+      ctx.current.beginPath();
+      ctx.current.lineWidth = lineWidth;
+      ctx.current.strokeStyle = strokeStyle;
+    }
+  };
+  const initCanvas = () => {
+    nextTick(() => {
+      setTimeout(() => {
+        if (getEnv() === "WEAPP" || getEnv() === "JD") {
+          createSelectorQuery().select(`#${canvasId}`).fields({
+            node: true,
+            size: true
+          }, (res) => {
+            const { node, width, height } = res;
+            canvasSetting(node, width, height);
+          }).exec();
+        } else {
+          const canvasDom = document.getElementById(`${canvasId}`);
+          let canvas = canvasDom;
+          if ((canvasDom == null ? void 0 : canvasDom.tagName) !== "CANVAS") {
+            canvas = canvasDom == null ? void 0 : canvasDom.getElementsByTagName("canvas")[0];
+          }
+          canvasSetting(canvas, canvasDom == null ? void 0 : canvasDom.offsetWidth, canvasDom == null ? void 0 : canvasDom.offsetHeight);
+        }
+      }, 1e3);
+    });
+  };
+  useEffect(() => {
+    initCanvas();
+  }, []);
+  return React.createElement(
+    "div",
+    { className: `${b()} ${className}`, ...rest },
+    React.createElement("div", { className: `${b("inner")} spcanvas_WEAPP`, ref: wrapRef }, getEnv() === "WEAPP" || getEnv() === "JD" ? React.createElement("canvas", {
+      id: canvasId,
+      ref: canvasRef,
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      canvasId,
+      disalbeScroll: true,
+      type: "2d",
+      onTouchStart: startEventHandler,
+      onTouchMove: moveEventHandler,
+      onTouchEnd: endEventHandler
+    }) : React.createElement("canvas", { id: canvasId, ref: canvasRef, "canvas-id": canvasId, "disalbe-scroll": disalbeScroll, onTouchStart: startEventHandler, onTouchMove: moveEventHandler, onTouchEnd: endEventHandler, onTouchCancel: endEventHandler })),
+    React.createElement(Button, { className: `${b("btn")}`, type: "default", onClick: () => handleClearBtn() }, locale.signature.reSign),
+    React.createElement(Button, { className: `${b("btn")}`, type: "primary", onClick: () => handleConfirmBtn() }, locale.confirm)
+  );
+};
+Signature.defaultProps = defaultProps;
+Signature.displayName = "NutSignature";
+export {
+  Signature as S
+};

package/dist/esm/skeleton.taro-9ff9baf4.js

@@ -0,0 +1,71 @@
+import React from "react";
+import classNames from "classnames";
+import { A as Avatar } from "./avatar.taro-01536aff.js";
+import { c as cn } from "./bem-cdccae08.js";
+const defaultProps = {
+  width: "100px",
+  height: "100px",
+  row: 1,
+  animated: false,
+  title: false,
+  avatar: false,
+  round: false,
+  avatarSize: "50px",
+  loading: false,
+  avatarShape: "round"
+};
+const Skeleton = (props) => {
+  const { className, width, height, animated, row, title, avatar, avatarSize, round, loading, children, avatarShape, ...restProps } = {
+    ...defaultProps,
+    ...props
+  };
+  const b = cn("skeleton");
+  const classes = classNames(className, b());
+  const blockClass = classNames({
+    blockClass: true,
+    "blockClass--round": round
+  });
+  const avatarClass = classNames({
+    avatarClass: true,
+    [`avatarClass--${avatarShape}`]: avatarShape
+  });
+  const repeatLines = (num) => {
+    return Array.from({ length: num }, (v, i) => i);
+  };
+  const getStyle = () => {
+    if (avatarSize) {
+      return {
+        width: avatarSize,
+        height: avatarSize
+      };
+    }
+    return {
+      width: "50px",
+      height: "50px"
+    };
+  };
+  return React.createElement(React.Fragment, null, loading ? React.createElement("div", null, children) : React.createElement(
+    "div",
+    { className: classes, ...restProps },
+    animated && React.createElement("div", { className: "skeleton-animation" }),
+    React.createElement(
+      "div",
+      { className: "nut-skeleton-content" },
+      avatar && React.createElement(Avatar, { className: avatarClass, background: "rgb(239, 239, 239)", shape: avatarShape, style: getStyle() }),
+      row === 1 && React.createElement("div", { className: blockClass, style: { width, height } }),
+      React.createElement(
+        "div",
+        { className: "skeleton-content-line" },
+        title && React.createElement("div", { className: "skeleton-title" }),
+        repeatLines(row).map((item, index) => {
+          return React.createElement("div", { className: blockClass, key: index, style: { width, height } });
+        })
+      )
+    )
+  ));
+};
+Skeleton.defaultProps = defaultProps;
+Skeleton.displayName = "NutSkeleton";
+export {
+  Skeleton as S
+};

package/dist/esm/step.taro-3bc01c0c.js

@@ -0,0 +1,66 @@
+import React, { useContext } from "react";
+import classNames from "classnames";
+import { D as DataContext } from "./UserContext-fde5badc.js";
+import { c as cn } from "./bem-cdccae08.js";
+import { C as ComponentDefaults } from "./typings-11d83a22.js";
+const defaultProps = {
+  ...ComponentDefaults,
+  title: "",
+  content: "",
+  activeIndex: 0,
+  icon: ""
+};
+const Step = (props) => {
+  const { children, title, content, activeIndex, icon, className, renderContent, ...restProps } = {
+    ...defaultProps,
+    ...props
+  };
+  const parent = useContext(DataContext);
+  const dot = parent.propSteps.progressDot;
+  const getCurrentStatus = () => {
+    const index = activeIndex;
+    if (index < +parent.propSteps.current)
+      return "finish";
+    return index === +parent.propSteps.current ? "process" : "wait";
+  };
+  const handleClickStep = () => {
+    var _a, _b, _c, _d;
+    ((_a = parent.propSteps) == null ? void 0 : _a.onClickStep) && ((_b = parent.propSteps) == null ? void 0 : _b.onClickStep(activeIndex));
+    ((_c = parent.propSteps) == null ? void 0 : _c.clickStep) && ((_d = parent.propSteps) == null ? void 0 : _d.clickStep(activeIndex));
+  };
+  const b = cn("step");
+  const classes = classNames({
+    [`${b("")}-${getCurrentStatus()}`]: true
+  }, className, b(""));
+  const renderIconClass = () => {
+    if (!dot && icon) {
+      return "nut-step-icon is-icon";
+    }
+    if (!dot && !icon) {
+      return "nut-step-icon is-text";
+    }
+    return "nut-step-icon";
+  };
+  return React.createElement(
+    "div",
+    { className: classes, ...restProps, onClick: handleClickStep },
+    React.createElement(
+      "div",
+      { className: "nut-step-head" },
+      React.createElement("div", { className: "nut-step-line" }),
+      React.createElement("div", { className: renderIconClass() }, React.isValidElement(icon) ? icon : !dot && React.createElement("span", { className: "nut-step-inner" }, activeIndex))
+    ),
+    React.createElement(
+      "div",
+      { className: "nut-step-main" },
+      React.createElement("span", { className: "nut-step-title" }, title),
+      content && React.createElement("span", { className: "nut-step-content" }, content),
+      renderContent && React.createElement("span", { className: "nut-step-content" }, renderContent())
+    )
+  );
+};
+Step.defaultProps = defaultProps;
+Step.displayName = "NutStep";
+export {
+  Step as S
+};

package/dist/esm/steps.taro-77e301ab.js

@@ -0,0 +1,30 @@
+import React from "react";
+import classNames from "classnames";
+import { D as DataContext } from "./UserContext-fde5badc.js";
+import { c as cn } from "./bem-cdccae08.js";
+const defaultProps = {
+  current: 0,
+  direction: "horizontal",
+  progressDot: false
+};
+const Steps = (props) => {
+  const propSteps = { ...defaultProps, ...props };
+  const { children, current, direction, className, progressDot, clickStep, onClickStep, ...restProps } = propSteps;
+  const parentSteps = {
+    propSteps
+  };
+  const b = cn("steps");
+  const classes = classNames({
+    [`${b("")}-${direction}`]: true,
+    [`${b("")}-dot`]: !!props.progressDot
+  }, className, b(""));
+  return React.createElement(DataContext.Provider, { value: parentSteps }, React.createElement("div", {
+    className: classes,
+    ...restProps
+  }, children));
+};
+Steps.defaultProps = defaultProps;
+Steps.displayName = "NutSteps";
+export {
+  Steps as S
+};