wz-h5-design 1.0.0

package/dist/wz-h5-design.es.js

@@ -0,0 +1,2449 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import React, { forwardRef, useState, useRef, useMemo, useContext, createContext, createElement, Children, useEffect, useImperativeHandle, useLayoutEffect } from "react";
+import { createRoot } from "react-dom/client";
+const Button = forwardRef(({
+  type = "primary",
+  size = "medium",
+  block = false,
+  disabled = false,
+  color = "",
+  textColor = "",
+  borderColor = "",
+  className = "",
+  style = {},
+  children,
+  onClick
+}, ref) => {
+  const [isActive, setIsActive] = useState(false);
+  const timerRef = useRef(null);
+  const buttonStyle = useMemo(() => {
+    if (type === "cancel") return style;
+    if (type === "outline") {
+      return {
+        color: textColor || "var(--wz-primary-color)",
+        borderColor: borderColor || "var(--wz-primary-color)",
+        background: "transparent",
+        ...style
+      };
+    }
+    if (type === "text") {
+      return {
+        color: textColor || style.color || "var(--wz-primary-color, #22C94D)",
+        background: "transparent",
+        border: "none",
+        boxShadow: "none",
+        ...style
+      };
+    }
+    if (type === "primary") {
+      let s = { ...style };
+      s.background = color || "var(--wz-primary-gradient, var(--wz-primary-color))";
+      s.color = textColor || "#fff";
+      return s;
+    }
+    return style;
+  }, [type, color, textColor, borderColor, style]);
+  const handleClick = (e) => {
+    if (disabled) return;
+    setIsActive(true);
+    if (timerRef.current) window.clearTimeout(timerRef.current);
+    timerRef.current = window.setTimeout(() => setIsActive(false), 100);
+    onClick == null ? void 0 : onClick(e);
+  };
+  const btnClass = [
+    "wz-button",
+    `wz-button--${type}`,
+    `wz-button--${size}`,
+    block ? "wz-button--block" : "",
+    disabled ? "wz-button--disabled" : "",
+    isActive && !disabled ? "wz-button--active" : "",
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref,
+      type: "button",
+      className: btnClass,
+      style: buttonStyle,
+      disabled,
+      onClick: handleClick,
+      children: [
+        children,
+        type === "primary" && isActive && /* @__PURE__ */ jsx("span", { className: "wz-button__mask" }),
+        type === "outline" && isActive && /* @__PURE__ */ jsx("span", { className: "wz-button__mask" }),
+        type === "outline" && disabled && /* @__PURE__ */ jsx("span", { className: "wz-button__mask--disabled" }),
+        type === "cancel" && isActive && /* @__PURE__ */ jsx("span", { className: "wz-button__mask--cancel" })
+      ]
+    }
+  );
+});
+Button.displayName = "Button";
+const RadioGroupContext = createContext({});
+const Radio = ({
+  size,
+  checked,
+  disabled,
+  onChange,
+  children,
+  value,
+  className = "",
+  style,
+  ...rest
+}) => {
+  const groupContext = useContext(RadioGroupContext);
+  const isInGroup = !!groupContext.value;
+  const handleChange = (e) => {
+    var _a;
+    if (!disabled && !groupContext.disabled) {
+      if (isInGroup) {
+        (_a = groupContext.onChange) == null ? void 0 : _a.call(groupContext, value);
+      } else {
+        onChange == null ? void 0 : onChange(e.target.checked);
+      }
+    }
+  };
+  const isChecked = isInGroup ? groupContext.value === value : checked;
+  const isDisabled = disabled || groupContext.disabled;
+  const radioSize = size || groupContext.size || "medium";
+  return /* @__PURE__ */ jsxs(
+    "label",
+    {
+      className: `wz-radio-wrapper ${isDisabled ? "wz-radio--disabled" : ""} wz-radio--${radioSize} ${className}`,
+      style,
+      children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "radio",
+            className: "wz-radio-input",
+            checked: isChecked,
+            disabled: isDisabled,
+            onChange: handleChange,
+            value,
+            ...rest
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "wz-radio-inner" }),
+        children && /* @__PURE__ */ jsx("span", { className: "wz-radio-label", children })
+      ]
+    }
+  );
+};
+const RadioGroup = ({
+  value,
+  defaultValue,
+  onChange,
+  disabled,
+  size,
+  children,
+  className = "",
+  style
+}) => {
+  const [innerValue, setInnerValue] = React.useState(defaultValue);
+  const handleChange = (newValue) => {
+    setInnerValue(newValue);
+    onChange == null ? void 0 : onChange(newValue);
+  };
+  const contextValue = {
+    value: value !== void 0 ? value : innerValue,
+    onChange: handleChange,
+    disabled,
+    size
+  };
+  return /* @__PURE__ */ jsx(RadioGroupContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: `wz-radio-group ${className}`, style, children }) });
+};
+Radio.Group = RadioGroup;
+Radio.displayName = "Radio";
+RadioGroup.displayName = "Radio.Group";
+const CheckboxContext = createContext({});
+const Checkbox = ({
+  size,
+  checked,
+  disabled,
+  onChange,
+  children,
+  value,
+  className = "",
+  style,
+  ...rest
+}) => {
+  var _a;
+  const groupContext = useContext(CheckboxContext);
+  const isInGroup = !!groupContext.value;
+  const handleChange = (e) => {
+    var _a2;
+    if (!disabled && !groupContext.disabled) {
+      if (isInGroup) {
+        const newValue = e.target.checked ? [...groupContext.value || [], value] : (groupContext.value || []).filter((v) => v !== value);
+        (_a2 = groupContext.onChange) == null ? void 0 : _a2.call(groupContext, newValue);
+      } else {
+        onChange == null ? void 0 : onChange(e.target.checked);
+      }
+    }
+  };
+  const isChecked = isInGroup ? (_a = groupContext.value) == null ? void 0 : _a.includes(value) : checked;
+  const isDisabled = disabled || groupContext.disabled;
+  const checkboxSize = size || groupContext.size || "medium";
+  return /* @__PURE__ */ jsxs(
+    "label",
+    {
+      className: `wz-checkbox-wrapper ${isDisabled ? "wz-checkbox--disabled" : ""} wz-checkbox--${checkboxSize} ${className}`,
+      style,
+      children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "checkbox",
+            className: "wz-checkbox-input",
+            checked: isChecked,
+            disabled: isDisabled,
+            onChange: handleChange,
+            value,
+            ...rest
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "wz-checkbox-inner" }),
+        children && /* @__PURE__ */ jsx("span", { className: "wz-checkbox-label", children })
+      ]
+    }
+  );
+};
+const CheckboxGroup = ({
+  value,
+  defaultValue,
+  onChange,
+  disabled,
+  size,
+  children,
+  className = "",
+  style
+}) => {
+  const [innerValue, setInnerValue] = React.useState(defaultValue || []);
+  const handleChange = (newValue) => {
+    setInnerValue(newValue);
+    onChange == null ? void 0 : onChange(newValue);
+  };
+  const contextValue = {
+    value: value !== void 0 ? value : innerValue,
+    onChange: handleChange,
+    disabled,
+    size
+  };
+  return /* @__PURE__ */ jsx(CheckboxContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: `wz-checkbox-group ${className}`, style, children }) });
+};
+Checkbox.Group = CheckboxGroup;
+Checkbox.displayName = "Checkbox";
+CheckboxGroup.displayName = "Checkbox.Group";
+const DEFAULT_ACTIVE_TEXT = "开启";
+const DEFAULT_INACTIVE_TEXT = "关闭";
+const Switch = ({
+  value,
+  defaultValue = false,
+  onChange,
+  disabled = false,
+  showText = true,
+  activeText = "",
+  inactiveText = "",
+  style,
+  className = "",
+  size = "default",
+  activeColor
+}) => {
+  const [innerValue, setInnerValue] = useState(defaultValue);
+  const isControlled = value !== void 0;
+  const checked = isControlled ? value : innerValue;
+  const text = checked ? activeText || DEFAULT_ACTIVE_TEXT : inactiveText || DEFAULT_INACTIVE_TEXT;
+  const textWidth = showText ? `${text.length * 12 + 8}px` : "0px";
+  const baseWidth = size === "large" ? 62 : 60;
+  const switchWidthNum = showText ? text.length * 12 + 40 : baseWidth;
+  const switchWidth = `${switchWidthNum}px`;
+  const onBg = activeColor ? activeColor.includes("gradient") ? activeColor : activeColor : void 0;
+  const handleClick = () => {
+    if (disabled) return;
+    if (!isControlled) setInnerValue(!checked);
+    onChange == null ? void 0 : onChange(!checked);
+  };
+  const bgStyle = checked ? activeColor ? { background: onBg } : {} : {};
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `wz-switch-bg ${checked ? "wz-switch-on" : "wz-switch-off"}${disabled ? " wz-switch-disabled" : ""}${className ? " " + className : ""} wz-switch-${size}`,
+      style: { width: switchWidth, minWidth: `${baseWidth}px`, ...style, ...bgStyle },
+      onClick: handleClick,
+      children: [
+        showText && /* @__PURE__ */ jsx("span", { className: "wz-switch-text", style: { width: textWidth }, children: text }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `wz-switch-slider ${checked ? "wz-switch-slider-on" : "wz-switch-slider-off"}`
+          }
+        )
+      ]
+    }
+  );
+};
+function getDefaultExportFromCjs(x) {
+  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
+}
+var classnames = { exports: {} };
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/
+(function(module) {
+  (function() {
+    var hasOwn = {}.hasOwnProperty;
+    function classNames2() {
+      var classes = [];
+      for (var i = 0; i < arguments.length; i++) {
+        var arg = arguments[i];
+        if (!arg) continue;
+        var argType = typeof arg;
+        if (argType === "string" || argType === "number") {
+          classes.push(arg);
+        } else if (Array.isArray(arg)) {
+          if (arg.length) {
+            var inner = classNames2.apply(null, arg);
+            if (inner) {
+              classes.push(inner);
+            }
+          }
+        } else if (argType === "object") {
+          if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes("[native code]")) {
+            classes.push(arg.toString());
+            continue;
+          }
+          for (var key in arg) {
+            if (hasOwn.call(arg, key) && arg[key]) {
+              classes.push(key);
+            }
+          }
+        }
+      }
+      return classes.join(" ");
+    }
+    if (module.exports) {
+      classNames2.default = classNames2;
+      module.exports = classNames2;
+    } else {
+      window.classNames = classNames2;
+    }
+  })();
+})(classnames);
+var classnamesExports = classnames.exports;
+const classNames = /* @__PURE__ */ getDefaultExportFromCjs(classnamesExports);
+const Icon = ({
+  name,
+  size = 24,
+  color = "currentColor",
+  className = "",
+  style,
+  onClick,
+  type = "yunying"
+  // 默认使用yunying图标库
+}) => {
+  const iconStyle = {
+    fontSize: typeof size === "number" ? `${size}px` : size,
+    color,
+    ...style
+  };
+  const iconFontClass = `iconfont-${type}`;
+  const iconPrefix = "icon-";
+  const iconClass = `${iconPrefix}${name}`;
+  return /* @__PURE__ */ jsx(
+    "i",
+    {
+      className: `wz-icon ${iconFontClass} ${iconClass} ${className}`,
+      style: iconStyle,
+      onClick
+    }
+  );
+};
+const TabbarItem = (props) => {
+  const { title, icon, activeIcon, badge, badgeAsBubble, hump, active, onItemClick, onClick, activeColor } = props;
+  const renderIcon = (iconSource) => {
+    if (typeof iconSource === "string") {
+      return /* @__PURE__ */ jsx(Icon, { name: iconSource });
+    }
+    return iconSource;
+  };
+  const renderBadge = () => {
+    if (!badge) return null;
+    if (badgeAsBubble) {
+      return /* @__PURE__ */ jsx("div", { className: "wz-tabbar-item-badge-custom", children: /* @__PURE__ */ jsxs("div", { className: "wz-tabbar-item-badge-bubble", children: [
+        badge,
+        /* @__PURE__ */ jsx("div", { className: "wz-tabbar-item-badge-bubble-arrow" })
+      ] }) });
+    }
+    if (React.isValidElement(badge)) {
+      return /* @__PURE__ */ jsx("div", { className: "wz-tabbar-item-badge-custom", children: badge });
+    }
+    return /* @__PURE__ */ jsx("div", { className: "wz-tabbar-item-badge", children: badge });
+  };
+  const itemCls = classNames("wz-tabbar-item", {
+    "wz-tabbar-item-active": !hump && active,
+    "wz-tabbar-item-hump": hump
+  });
+  const itemStyle = useMemo(() => {
+    const style = {};
+    if (active && activeColor) {
+      style.color = activeColor;
+    }
+    return style;
+  }, [active, activeColor]);
+  return /* @__PURE__ */ jsxs("div", { className: itemCls, style: itemStyle, onClick: hump ? onClick : onItemClick, children: [
+    /* @__PURE__ */ jsxs("div", { className: "wz-tabbar-item-icon", children: [
+      active ? renderIcon(activeIcon || icon) : renderIcon(icon),
+      renderBadge()
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "wz-tabbar-item-title", children: title })
+  ] });
+};
+const Tabbar = (props) => {
+  var _a;
+  const {
+    activeKey,
+    defaultActiveKey,
+    onChange,
+    items,
+    fixed = true,
+    className,
+    style
+  } = props;
+  const [currentKey, setCurrentKey] = React.useState(
+    activeKey ?? defaultActiveKey ?? ((_a = items == null ? void 0 : items[0]) == null ? void 0 : _a.key)
+  );
+  React.useEffect(() => {
+    if (activeKey !== void 0) {
+      setCurrentKey(activeKey);
+    }
+  }, [activeKey]);
+  const handleItemClick = (key) => {
+    if (activeKey === void 0) {
+      setCurrentKey(key);
+    }
+    onChange == null ? void 0 : onChange(key);
+  };
+  const containerCls = classNames("wz-tabbar", { "wz-tabbar-fixed": fixed }, className);
+  return /* @__PURE__ */ jsx("div", { className: containerCls, style, children: items.map((item) => /* @__PURE__ */ createElement(
+    TabbarItem,
+    {
+      ...item,
+      key: item.key,
+      active: !item.hump && currentKey === item.key,
+      onItemClick: () => handleItemClick(item.key)
+    }
+  )) });
+};
+const Card = ({
+  title,
+  extra,
+  cover,
+  actions,
+  bordered,
+  noDivider = false,
+  className = "",
+  style,
+  children,
+  onClick
+}) => {
+  const cardClassName = [
+    "wz-card",
+    bordered !== void 0 ? "wz-card-bordered" : "",
+    noDivider ? "wz-card-no-divider" : "",
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs("div", { className: cardClassName, style, onClick, children: [
+    cover && /* @__PURE__ */ jsx("div", { className: "wz-card-cover", children: cover }),
+    (title || extra) && /* @__PURE__ */ jsxs("div", { className: "wz-card-header", children: [
+      title && /* @__PURE__ */ jsx("div", { className: "wz-card-title", children: title }),
+      extra && /* @__PURE__ */ jsx("div", { className: "wz-card-extra", children: extra })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "wz-card-body", children }),
+    actions && actions.length > 0 && /* @__PURE__ */ jsx("div", { className: "wz-card-actions", children: actions.map((action, index) => /* @__PURE__ */ jsx("div", { className: "wz-card-action", children: action }, index)) })
+  ] });
+};
+const Cell$1 = (props) => {
+  const {
+    title,
+    label,
+    value,
+    icon,
+    arrow = false,
+    border = true,
+    center = false,
+    disabled = false,
+    required = false,
+    className,
+    style,
+    titleStyle,
+    titleClassName,
+    labelStyle,
+    labelClassName,
+    valueStyle,
+    valueClassName,
+    onClick,
+    children
+  } = props;
+  const cellClassName = classNames(
+    "wz-cell",
+    {
+      "wz-cell-border": border,
+      "wz-cell-center": center,
+      "wz-cell-disabled": disabled
+    },
+    className
+  );
+  const renderTitle = () => {
+    if (title) {
+      return /* @__PURE__ */ jsxs("div", { className: classNames("wz-cell-title", titleClassName), style: titleStyle, children: [
+        required && /* @__PURE__ */ jsx("span", { className: "wz-cell-required", children: "*" }),
+        title,
+        value && /* @__PURE__ */ jsx("span", { className: classNames("wz-cell-value", valueClassName), style: valueStyle, children: value })
+      ] });
+    }
+    return null;
+  };
+  const renderValue = () => {
+    return null;
+  };
+  const renderLabel = () => {
+    if (label) {
+      return /* @__PURE__ */ jsx("div", { className: classNames("wz-cell-label", labelClassName), style: labelStyle, children: label });
+    }
+    return null;
+  };
+  const renderLeftIcon = () => {
+    if (icon) {
+      return /* @__PURE__ */ jsx("div", { className: "wz-cell-icon", children: icon });
+    }
+    return null;
+  };
+  const renderRightIcon = () => {
+    if (arrow) {
+      return /* @__PURE__ */ jsx("div", { className: "wz-cell-arrow" });
+    }
+    return null;
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cellClassName, style, onClick: disabled ? void 0 : onClick, children: [
+    renderLeftIcon(),
+    /* @__PURE__ */ jsxs("div", { className: "wz-cell-content", children: [
+      renderTitle(),
+      renderLabel()
+    ] }),
+    renderValue(),
+    children && /* @__PURE__ */ jsx("div", { className: "wz-cell-extra", children }),
+    renderRightIcon()
+  ] });
+};
+const CellGroup = (props) => {
+  const { className, style, children } = props;
+  return /* @__PURE__ */ jsx("div", { className: classNames("wz-cell-group", className), style, children });
+};
+const Cell = Cell$1;
+Cell.Group = CellGroup;
+const TabPane = ({ children }) => {
+  return /* @__PURE__ */ jsx(Fragment, { children });
+};
+const Tabs = ({
+  type = "line",
+  value,
+  defaultValue = 0,
+  onChange,
+  className = "",
+  style,
+  headerClassName = "",
+  headerStyle,
+  contentClassName = "",
+  contentStyle,
+  children
+}) => {
+  const isControlled = value !== void 0;
+  const [innerValue, setInnerValue] = useState(defaultValue);
+  const activeIndex = isControlled ? value : innerValue;
+  const panes = Children.toArray(children).filter(Boolean);
+  const handleTabClick = (idx, disabled) => {
+    if (disabled) return;
+    if (!isControlled) setInnerValue(idx);
+    onChange == null ? void 0 : onChange(idx);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: `wz-tabs wz-tabs-${type} ${className}`, style, children: [
+    /* @__PURE__ */ jsx("div", { className: `wz-tabs-header ${headerClassName}`, style: headerStyle, children: panes.map((pane, idx) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `wz-tabs-tab${idx === activeIndex ? " wz-tabs-tab-active" : ""}${pane.props.disabled ? " wz-tabs-tab-disabled" : ""}`,
+        onClick: () => handleTabClick(idx, pane.props.disabled),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "wz-tabs-tab-text", children: [
+            pane.props.title,
+            pane.props.badge && /* @__PURE__ */ jsx("div", { className: "wz-tabs-badge", children: pane.props.badge })
+          ] }),
+          idx === activeIndex && type === "line" && /* @__PURE__ */ jsx("div", { className: "wz-tabs-underline" })
+        ]
+      },
+      idx
+    )) }),
+    /* @__PURE__ */ jsx("div", { className: `wz-tabs-content ${contentClassName}`, style: contentStyle, children: panes[activeIndex] })
+  ] });
+};
+Tabs.TabPane = TabPane;
+const Collapse = ({
+  title,
+  extra,
+  children,
+  defaultExpanded = false,
+  expanded,
+  onChange,
+  style,
+  className = "",
+  headerStyle,
+  headerClassName = "",
+  contentStyle,
+  contentClassName = ""
+}) => {
+  const [innerExpanded, setInnerExpanded] = useState(defaultExpanded);
+  const isControlled = expanded !== void 0;
+  const isExpanded = isControlled ? expanded : innerExpanded;
+  const handleToggle = () => {
+    if (!isControlled) {
+      setInnerExpanded(!isExpanded);
+    }
+    onChange == null ? void 0 : onChange(!isExpanded);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: `wz-collapse${className ? " " + className : ""}`, style, children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `wz-collapse-header ${headerClassName}`,
+        onClick: handleToggle,
+        style: headerStyle,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "wz-collapse-title", children: title }),
+          /* @__PURE__ */ jsx("div", { className: "wz-collapse-extra", onClick: (e) => e.stopPropagation(), children: extra }),
+          /* @__PURE__ */ jsx(
+            "svg",
+            {
+              className: `wz-collapse-arrow${isExpanded ? " expanded" : ""}`,
+              width: "20",
+              height: "20",
+              viewBox: "0 0 20 20",
+              style: { transition: "transform 0.2s", transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)" },
+              children: /* @__PURE__ */ jsx(
+                "polyline",
+                {
+                  points: "7,5 13,10 7,15",
+                  fill: "none",
+                  stroke: "#888",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round"
+                }
+              )
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `wz-collapse-content${isExpanded ? " expanded" : ""} ${contentClassName}`,
+        style: contentStyle,
+        children
+      }
+    )
+  ] });
+};
+const Stepper = ({
+  value,
+  min = -Infinity,
+  max = Infinity,
+  step = 1,
+  onChange,
+  disabled = false,
+  prefix,
+  suffix,
+  showMinus = true,
+  // 默认显示减号按钮
+  showPlus = true,
+  // 默认显示加号按钮
+  precision,
+  className = "",
+  style,
+  inputStyle,
+  inputClassName = "",
+  buttonStyle,
+  buttonClassName = ""
+}) => {
+  const [inputValue, setInputValue] = useState(String(value));
+  const [isFocused, setIsFocused] = useState(false);
+  useEffect(() => {
+    if (!isFocused) {
+      setInputValue(String(value));
+    }
+  }, [value, isFocused]);
+  const handleAdd = () => {
+    if (disabled) return;
+    let num = Number(value) + step;
+    if (num > max) num = max;
+    num = precision !== void 0 ? parseFloat(num.toFixed(precision)) : num;
+    onChange(num);
+    setInputValue(String(num));
+  };
+  const handleMinus = () => {
+    if (disabled) return;
+    let num = Number(value) - step;
+    if (num < min) num = min;
+    num = precision !== void 0 ? parseFloat(num.toFixed(precision)) : num;
+    onChange(num);
+    setInputValue(String(num));
+  };
+  const handleInputFocus = (e) => {
+    setIsFocused(true);
+    e.target.select();
+  };
+  const handleInputChange = (e) => {
+    setInputValue(e.target.value);
+  };
+  const handleInputBlur = () => {
+    setIsFocused(false);
+    let num = Number(inputValue);
+    if (isNaN(num)) {
+      setInputValue(String(value));
+      return;
+    }
+    if (num > max) num = max;
+    if (num < min) num = min;
+    num = precision !== void 0 ? parseFloat(num.toFixed(precision)) : num;
+    onChange(num);
+    setInputValue(String(num));
+  };
+  const minusDisabled = disabled || Number(value) <= min;
+  const addDisabled = disabled || Number(value) >= max;
+  return /* @__PURE__ */ jsxs("div", { className: `wz-stepper ${className}`, style, children: [
+    showMinus && /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: `wz-stepper-btn wz-stepper-btn-minus ${buttonClassName}`,
+        onClick: handleMinus,
+        disabled: minusDisabled,
+        type: "button",
+        style: buttonStyle,
+        children: /* @__PURE__ */ jsx(Icon, { name: "jian", type: "yunying", size: 21 })
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "wz-stepper-input-wrapper", children: [
+      prefix && /* @__PURE__ */ jsx("span", { className: "wz-stepper-prefix", children: prefix }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          className: `wz-stepper-input ${inputClassName}`,
+          type: "text",
+          value: inputValue,
+          onChange: handleInputChange,
+          onFocus: handleInputFocus,
+          onBlur: handleInputBlur,
+          disabled,
+          style: inputStyle
+        }
+      ),
+      suffix && /* @__PURE__ */ jsx("span", { className: "wz-stepper-suffix", children: suffix })
+    ] }),
+    showPlus && /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: `wz-stepper-btn wz-stepper-btn-plus ${buttonClassName}`,
+        onClick: handleAdd,
+        disabled: addDisabled,
+        type: "button",
+        style: buttonStyle,
+        children: /* @__PURE__ */ jsx(Icon, { name: "jia", type: "yunying", size: 21 })
+      }
+    )
+  ] });
+};
+const Popup = ({
+  visible = false,
+  position = "bottom",
+  mask = true,
+  maskClosable = true,
+  round = false,
+  duration = 300,
+  zIndex = 1e3,
+  destroyOnClose = false,
+  className = "",
+  style = {},
+  maskStyle = {},
+  children,
+  onClose,
+  onClosed,
+  afterShow,
+  closeable = false,
+  title
+}) => {
+  const [display, setDisplay] = useState(visible);
+  const [animating, setAnimating] = useState(false);
+  const [active, setActive] = useState(visible);
+  useEffect(() => {
+    if (visible) {
+      open();
+    } else {
+      close();
+    }
+  }, [visible]);
+  const open = () => {
+    if (display) return;
+    setDisplay(true);
+    setAnimating(true);
+    requestAnimationFrame(() => {
+      requestAnimationFrame(() => {
+        setActive(true);
+        setTimeout(() => {
+          setAnimating(false);
+          afterShow == null ? void 0 : afterShow();
+        }, duration);
+      });
+    });
+  };
+  const close = () => {
+    if (!display) return;
+    setActive(false);
+    setAnimating(true);
+    setTimeout(() => {
+      setAnimating(false);
+      setDisplay(false);
+      onClosed == null ? void 0 : onClosed();
+    }, duration);
+  };
+  const handleMaskClick = () => {
+    if (maskClosable && !animating) {
+      onClose == null ? void 0 : onClose();
+    }
+  };
+  const handleCloseClick = () => {
+    if (!animating) {
+      onClose == null ? void 0 : onClose();
+    }
+  };
+  const popupStyle = {
+    ...style,
+    zIndex,
+    transitionDuration: `${duration}ms`
+  };
+  const maskBaseStyle = {
+    ...maskStyle,
+    zIndex,
+    transitionDuration: `${duration}ms`
+  };
+  if (!display && destroyOnClose) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `wz-popup-container ${display ? "wz-popup--display" : ""}`,
+      style: { zIndex },
+      children: [
+        mask && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `wz-popup-mask ${active ? "wz-popup-mask--active" : ""}`,
+            style: maskBaseStyle,
+            onClick: handleMaskClick
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `
+          wz-popup 
+          wz-popup--${position} 
+          ${active ? "wz-popup--active" : ""} 
+          ${round ? "wz-popup--round" : ""}
+          ${className}
+        `,
+            style: popupStyle,
+            children: [
+              closeable && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "wz-popup-close",
+                  onClick: handleCloseClick,
+                  children: /* @__PURE__ */ jsx("span", { className: "wz-popup-close-icon", children: "×" })
+                }
+              ),
+              title && /* @__PURE__ */ jsx("div", { className: "wz-popup-title", children: title }),
+              children
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+const Cascader = ({
+  value,
+  onChange,
+  data
+}) => {
+  const [selectedValues, setSelectedValues] = useState(value || []);
+  const [activeLevel, setActiveLevel] = useState(Math.min((value || []).length, 2));
+  useEffect(() => {
+    if (value !== void 0) {
+      setSelectedValues(value);
+      setActiveLevel(Math.min(value.length, 2));
+    }
+  }, [value]);
+  const currentLevelData = useMemo(() => {
+    if (activeLevel === 0) {
+      return data;
+    }
+    let currentData = data;
+    for (let i = 0; i < activeLevel; i++) {
+      const selectedItem = currentData.find((item) => item.value === selectedValues[i]);
+      currentData = (selectedItem == null ? void 0 : selectedItem.children) || [];
+    }
+    return currentData;
+  }, [data, activeLevel, selectedValues]);
+  const selectedLabels = useMemo(() => {
+    let currentData = data;
+    const defaultLabels = ["请选择", "请选择", "请选择"];
+    return selectedValues.map((value2, index) => {
+      const selectedItem = currentData.find((item) => item.value === value2);
+      currentData = (selectedItem == null ? void 0 : selectedItem.children) || [];
+      return (selectedItem == null ? void 0 : selectedItem.label) || defaultLabels[index];
+    });
+  }, [data, selectedValues]);
+  const handleSelect = (item) => {
+    if (item.disabled) return;
+    const newSelectedValues = [...selectedValues];
+    newSelectedValues[activeLevel] = item.value;
+    newSelectedValues.length = activeLevel + 1;
+    setSelectedValues(newSelectedValues);
+    if (activeLevel === 0 && item.children) {
+      setActiveLevel(1);
+    } else if (activeLevel === 1 && item.children) {
+      setActiveLevel(2);
+    } else if (activeLevel === 2) {
+      onChange == null ? void 0 : onChange(newSelectedValues);
+    }
+  };
+  const handleLevelChange = (level) => {
+    if (level <= selectedValues.length) {
+      setActiveLevel(level);
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "wz-cascader", children: [
+    /* @__PURE__ */ jsx("div", { className: "wz-cascader-levels", children: ["省", "市", "区"].map((label, index) => {
+      if (index > 0 && selectedValues.length < index) {
+        return null;
+      }
+      return /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: `
+                wz-cascader-level 
+                ${activeLevel === index ? "active" : ""}
+                ${selectedValues[index] ? "selected" : ""}
+              `,
+          onClick: () => handleLevelChange(index),
+          children: selectedValues[index] ? selectedLabels[index] : "请选择"
+        },
+        label
+      );
+    }) }),
+    /* @__PURE__ */ jsx("div", { className: "wz-cascader-content", children: /* @__PURE__ */ jsx("div", { className: "wz-cascader-options", children: currentLevelData.map((item) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `
+                wz-cascader-option 
+                ${selectedValues.includes(item.value) ? "selected" : ""}
+                ${item.disabled ? "disabled" : ""}
+              `,
+        onClick: () => handleSelect(item),
+        children: [
+          item.label,
+          item.disabled && /* @__PURE__ */ jsx("span", { className: "wz-cascader-option-tip", children: "不可选" })
+        ]
+      },
+      item.value
+    )) }) })
+  ] });
+};
+const Input = forwardRef(
+  ({
+    clearable = false,
+    align = "center",
+    value,
+    defaultValue,
+    onChange,
+    style,
+    className = "",
+    type = "text",
+    showCount = false,
+    rows = 3,
+    maxLength,
+    countStyle,
+    suffix,
+    borderRadius,
+    backgroundColor,
+    bordered,
+    ...props
+  }, ref) => {
+    const isControlled = value !== void 0;
+    const [innerValue, setInnerValue] = useState(defaultValue || "");
+    const showClear = clearable && !!(isControlled ? value : innerValue);
+    const [passwordVisible, setPasswordVisible] = useState(false);
+    const handleChange = (e) => {
+      if (!isControlled) setInnerValue(e.target.value);
+      onChange == null ? void 0 : onChange(e);
+    };
+    const handleClear = () => {
+      if (!isControlled) setInnerValue("");
+      const event = {
+        ...props,
+        target: { value: "" }
+      };
+      onChange == null ? void 0 : onChange(event);
+    };
+    const handlePasswordVisible = () => {
+      setPasswordVisible(!passwordVisible);
+    };
+    const wrapperStyle = {
+      position: "relative",
+      width: style == null ? void 0 : style.width,
+      ...style
+    };
+    const inputStyle = {
+      textAlign: align,
+      borderRadius,
+      backgroundColor,
+      border: bordered !== void 0 ? void 0 : "none"
+    };
+    const currentValue = isControlled ? value : innerValue;
+    const count = (currentValue == null ? void 0 : currentValue.toString().length) || 0;
+    const isExceeded = maxLength && count > maxLength;
+    const renderInput = () => {
+      if (type === "textarea") {
+        return /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              ref,
+              className: `wz-input ${className}`,
+              value: currentValue,
+              onChange: handleChange,
+              style: { ...inputStyle, resize: "none" },
+              rows,
+              maxLength,
+              ...props
+            }
+          ),
+          showCount && maxLength && /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `wz-input-count ${isExceeded ? "wz-input-count-exceeded" : ""}`,
+              style: countStyle,
+              children: [
+                count,
+                "/",
+                maxLength
+              ]
+            }
+          )
+        ] });
+      }
+      return /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref,
+          className: `wz-input ${className}`,
+          value: currentValue,
+          onChange: handleChange,
+          style: inputStyle,
+          type: type === "password" && passwordVisible ? "text" : type,
+          maxLength,
+          ...props
+        }
+      );
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `wz-input-affix-wrapper ${type === "textarea" ? "wz-input-affix-wrapper-textarea" : ""} ${suffix ? "wz-input-has-suffix" : ""} ${bordered === void 0 ? "wz-input-no-border" : ""}`,
+        style: wrapperStyle,
+        children: [
+          renderInput(),
+          showClear && !props.disabled && type !== "textarea" && !suffix && /* @__PURE__ */ jsx("span", { className: "wz-input-clear", onClick: handleClear, children: /* @__PURE__ */ jsx(Icon, { name: "close", size: 22 }) }),
+          type === "password" && !suffix && /* @__PURE__ */ jsx("span", { className: "wz-input-password", onClick: handlePasswordVisible, children: /* @__PURE__ */ jsx(Icon, { name: passwordVisible ? "eyes-close" : "eyes-open", size: 22 }) }),
+          suffix && /* @__PURE__ */ jsxs("div", { className: "wz-input-suffix", children: [
+            /* @__PURE__ */ jsx("span", { className: "wz-input-suffix-divider" }),
+            suffix
+          ] })
+        ]
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+const Divider = ({
+  direction = "horizontal",
+  color = "#eee",
+  length,
+  margin,
+  style,
+  className = ""
+}) => {
+  const isVertical = direction === "vertical";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `wz-divider wz-divider--${direction} ${className}`,
+      style: {
+        background: color,
+        width: isVertical ? 1 : length || "100%",
+        height: isVertical ? length || 24 : 1,
+        margin,
+        ...style
+      }
+    }
+  );
+};
+const CheckList = ({ options, value, onChange, multiple = false, style, className = "" }) => {
+  const isChecked = (item) => {
+    if (multiple && Array.isArray(value)) return value.includes(item);
+    return value === item;
+  };
+  const handleClick = (item) => {
+    if (multiple) {
+      if (!Array.isArray(value)) return;
+      if (value.includes(item)) {
+        onChange(value.filter((v) => v !== item));
+      } else {
+        onChange([...value, item]);
+      }
+    } else {
+      onChange(item);
+    }
+  };
+  return /* @__PURE__ */ jsx("div", { className: `wz-check-list ${className}`, style, children: options.map((item) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "wz-check-list__item" + (isChecked(item) ? " wz-check-list__item--active" : ""),
+      onClick: () => handleClick(item),
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "wz-check-list__label", children: item }),
+        isChecked(item) && /* @__PURE__ */ jsx("span", { className: "wz-check-list__icon", children: "✔" })
+      ]
+    },
+    item
+  )) });
+};
+const Search = forwardRef(
+  ({
+    value,
+    defaultValue,
+    placeholder = "输入关键词搜索",
+    shape = "round",
+    clearable = true,
+    disabled = false,
+    prefix,
+    suffix,
+    leftIcon = /* @__PURE__ */ jsx(Icon, { name: "search", size: 16 }),
+    actionText = "搜索",
+    showCancel = false,
+    cancelText = "返回",
+    background,
+    style,
+    className = "",
+    onSearch,
+    onClear,
+    onChange,
+    onFocus,
+    onBlur,
+    onCancel,
+    ...props
+  }, ref) => {
+    const isControlled = value !== void 0;
+    const [innerValue, setInnerValue] = useState(defaultValue || "");
+    const [isFocused, setIsFocused] = useState(false);
+    const inputRef = useRef(null);
+    useImperativeHandle(ref, () => inputRef.current);
+    const inputValue = isControlled ? value : innerValue;
+    const showClear = clearable && inputValue && isFocused && !disabled;
+    const handleChange = (e) => {
+      const newValue = e.target.value;
+      if (!isControlled) setInnerValue(newValue);
+      onChange == null ? void 0 : onChange(newValue);
+    };
+    const handleFocus = (e) => {
+      setIsFocused(true);
+      onFocus == null ? void 0 : onFocus(e);
+    };
+    const handleBlur = (e) => {
+      setIsFocused(false);
+      onBlur == null ? void 0 : onBlur(e);
+    };
+    const handleSearch = () => {
+      var _a;
+      if (disabled) return;
+      (_a = inputRef.current) == null ? void 0 : _a.blur();
+      onSearch == null ? void 0 : onSearch(inputValue);
+    };
+    const handleClear = (e) => {
+      var _a;
+      e.preventDefault();
+      if (!isControlled) setInnerValue("");
+      onChange == null ? void 0 : onChange("");
+      onClear == null ? void 0 : onClear();
+      (_a = inputRef.current) == null ? void 0 : _a.focus();
+    };
+    const handleKeyDown = (e) => {
+      if (e.key === "Enter" && !disabled) handleSearch();
+    };
+    const handleCancel = () => {
+      setIsFocused(false);
+      onCancel == null ? void 0 : onCancel();
+    };
+    const renderCancel = () => {
+      if (prefix || !showCancel || !isFocused) return null;
+      return /* @__PURE__ */ jsx("div", { className: "wz-search-cancel", onClick: handleCancel, children: cancelText });
+    };
+    const combinedStyle = {
+      ...style,
+      backgroundColor: background
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `wz-search ${isFocused ? "wz-search-focused" : ""} ${className}`,
+        style: combinedStyle,
+        children: [
+          prefix && /* @__PURE__ */ jsx("div", { className: "wz-search-prefix", children: prefix }),
+          renderCancel(),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `wz-search-content wz-search-shape-${shape} ${disabled ? "wz-search-disabled" : ""}`,
+              children: [
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: `wz-search-input-wrapper ${showClear ? "wz-search-input-wrapper--with-clear" : ""}`,
+                    children: [
+                      leftIcon && /* @__PURE__ */ jsx("div", { className: "wz-search-left-icon", children: leftIcon }),
+                      /* @__PURE__ */ jsx(
+                        "input",
+                        {
+                          ref: inputRef,
+                          className: "wz-search-input",
+                          value: inputValue,
+                          onChange: handleChange,
+                          onFocus: handleFocus,
+                          onBlur: handleBlur,
+                          onKeyDown: handleKeyDown,
+                          placeholder,
+                          disabled,
+                          ...props
+                        }
+                      ),
+                      showClear && /* @__PURE__ */ jsx("div", { className: "wz-search-clear", onMouseDown: handleClear, children: /* @__PURE__ */ jsx(Icon, { name: "close", size: 16, color: "#BDBDBD" }) })
+                    ]
+                  }
+                ),
+                actionText && /* @__PURE__ */ jsxs("div", { className: "wz-search-action", onClick: handleSearch, children: [
+                  /* @__PURE__ */ jsx("div", { className: "wz-search-divider" }),
+                  /* @__PURE__ */ jsx("div", { className: "wz-search-action-text", children: actionText })
+                ] })
+              ]
+            }
+          ),
+          suffix && /* @__PURE__ */ jsx("div", { className: "wz-search-suffix", children: suffix })
+        ]
+      }
+    );
+  }
+);
+Search.displayName = "Search";
+const defaultSingleOptions = Array.from({ length: 24 }, (_, i) => `${i + 1}小时`);
+const hourOptions = Array.from({ length: 24 }, (_, i) => i.toString().padStart(2, "0"));
+const minuteOptions = Array.from({ length: 60 }, (_, i) => i.toString().padStart(2, "0"));
+const TimePicker = ({
+  type = "single",
+  options,
+  value,
+  onChange,
+  className = "",
+  style,
+  itemHeight = 48
+}) => {
+  if (type === "single") {
+    const pickerOptions = options && options.length > 0 ? options : defaultSingleOptions;
+    const [current, setCurrent] = useState(() => {
+      const idx = value ? pickerOptions.indexOf(value) : 0;
+      return idx >= 0 ? idx : 0;
+    });
+    const wrapperRef = useRef(null);
+    const startY2 = useRef(0);
+    const startScroll2 = useRef(0);
+    const isDragging2 = useRef(false);
+    useEffect(() => {
+      if (value && pickerOptions.includes(value)) {
+        setCurrent(pickerOptions.indexOf(value));
+      }
+    }, [value, pickerOptions]);
+    useEffect(() => {
+      if (wrapperRef.current) {
+        wrapperRef.current.scrollTo({
+          top: current * itemHeight,
+          behavior: "smooth"
+        });
+      }
+    }, [current, itemHeight]);
+    const handleTouchStart2 = (e) => {
+      var _a;
+      isDragging2.current = true;
+      startY2.current = e.touches[0].clientY;
+      startScroll2.current = ((_a = wrapperRef.current) == null ? void 0 : _a.scrollTop) || 0;
+    };
+    const handleTouchMove2 = (e) => {
+      if (!isDragging2.current) return;
+      const deltaY = e.touches[0].clientY - startY2.current;
+      if (wrapperRef.current) {
+        wrapperRef.current.scrollTop = startScroll2.current - deltaY;
+      }
+    };
+    const handleTouchEnd2 = () => {
+      isDragging2.current = false;
+      if (!wrapperRef.current) return;
+      const idx = Math.round(wrapperRef.current.scrollTop / itemHeight);
+      setCurrent(idx);
+      onChange == null ? void 0 : onChange(pickerOptions[idx]);
+    };
+    const handleScroll2 = () => {
+      if (!isDragging2.current && wrapperRef.current) {
+        const idx = Math.round(wrapperRef.current.scrollTop / itemHeight);
+        setCurrent(idx);
+        onChange == null ? void 0 : onChange(pickerOptions[idx]);
+      }
+    };
+    const isItemActive = (index) => index === current;
+    return /* @__PURE__ */ jsxs("div", { className: `wz-time-picker ${className}`, style, children: [
+      /* @__PURE__ */ jsx("div", { className: "wz-time-picker-mask wz-time-picker-mask-top", style: { height: itemHeight } }),
+      /* @__PURE__ */ jsx("div", { className: "wz-time-picker-indicator", style: { height: itemHeight } }),
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "wz-time-picker-list",
+          ref: wrapperRef,
+          style: { height: itemHeight * 3 },
+          onTouchStart: handleTouchStart2,
+          onTouchMove: handleTouchMove2,
+          onTouchEnd: handleTouchEnd2,
+          onScroll: handleScroll2,
+          children: [
+            /* @__PURE__ */ jsx("div", { style: { height: itemHeight } }),
+            pickerOptions.map((opt, idx) => /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: `wz-time-picker-item${isItemActive(idx) ? " active" : ""}`,
+                style: { height: itemHeight },
+                children: opt
+              },
+              opt
+            )),
+            /* @__PURE__ */ jsx("div", { style: { height: itemHeight } })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "wz-time-picker-mask wz-time-picker-mask-bottom", style: { height: itemHeight } })
+    ] });
+  }
+  const [hour, minute] = value ? value.split(":") : [hourOptions[0], minuteOptions[0]];
+  const [currentHour, setCurrentHour] = useState(hourOptions.indexOf(hour));
+  const [currentMinute, setCurrentMinute] = useState(minuteOptions.indexOf(minute));
+  const hourRef = useRef(null);
+  const minuteRef = useRef(null);
+  const startY = useRef(0);
+  const startScroll = useRef(0);
+  const isDragging = useRef(false);
+  const dragType = useRef(null);
+  useEffect(() => {
+    if (hourRef.current) {
+      hourRef.current.scrollTo({
+        top: currentHour * itemHeight,
+        behavior: "smooth"
+      });
+    }
+  }, [currentHour, itemHeight]);
+  useEffect(() => {
+    if (minuteRef.current) {
+      minuteRef.current.scrollTo({
+        top: currentMinute * itemHeight,
+        behavior: "smooth"
+      });
+    }
+  }, [currentMinute, itemHeight]);
+  const handleTouchStart = (type2) => (e) => {
+    var _a, _b;
+    isDragging.current = true;
+    dragType.current = type2;
+    startY.current = e.touches[0].clientY;
+    startScroll.current = (type2 === "hour" ? (_a = hourRef.current) == null ? void 0 : _a.scrollTop : (_b = minuteRef.current) == null ? void 0 : _b.scrollTop) || 0;
+  };
+  const handleTouchMove = (e) => {
+    if (!isDragging.current || !dragType.current) return;
+    const deltaY = e.touches[0].clientY - startY.current;
+    if (dragType.current === "hour" && hourRef.current) {
+      hourRef.current.scrollTop = startScroll.current - deltaY;
+    } else if (dragType.current === "minute" && minuteRef.current) {
+      minuteRef.current.scrollTop = startScroll.current - deltaY;
+    }
+  };
+  const handleTouchEnd = () => {
+    if (!isDragging.current || !dragType.current) return;
+    if (dragType.current === "hour" && hourRef.current) {
+      const idx = Math.round(hourRef.current.scrollTop / itemHeight);
+      setCurrentHour(idx);
+      onChange == null ? void 0 : onChange(`${hourOptions[idx]}:${minuteOptions[currentMinute]}`);
+    } else if (dragType.current === "minute" && minuteRef.current) {
+      const idx = Math.round(minuteRef.current.scrollTop / itemHeight);
+      setCurrentMinute(idx);
+      onChange == null ? void 0 : onChange(`${hourOptions[currentHour]}:${minuteOptions[idx]}`);
+    }
+    isDragging.current = false;
+    dragType.current = null;
+  };
+  const handleScroll = (type2) => () => {
+    if (isDragging.current) return;
+    if (type2 === "hour" && hourRef.current) {
+      const idx = Math.round(hourRef.current.scrollTop / itemHeight);
+      setCurrentHour(idx);
+      onChange == null ? void 0 : onChange(`${hourOptions[idx]}:${minuteOptions[currentMinute]}`);
+    } else if (type2 === "minute" && minuteRef.current) {
+      const idx = Math.round(minuteRef.current.scrollTop / itemHeight);
+      setCurrentMinute(idx);
+      onChange == null ? void 0 : onChange(`${hourOptions[currentHour]}:${minuteOptions[idx]}`);
+    }
+  };
+  const renderColumn = (options2, current, ref, type2) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "wz-time-picker-list",
+      ref,
+      style: { height: itemHeight * 3 },
+      onTouchStart: handleTouchStart(type2),
+      onTouchMove: handleTouchMove,
+      onTouchEnd: handleTouchEnd,
+      onScroll: handleScroll(type2),
+      children: [
+        /* @__PURE__ */ jsx("div", { style: { height: itemHeight } }),
+        options2.map((opt, idx) => /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `wz-time-picker-item${idx === current ? " active" : ""}`,
+            style: { height: itemHeight },
+            children: opt
+          },
+          opt
+        )),
+        /* @__PURE__ */ jsx("div", { style: { height: itemHeight } })
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsxs("div", { className: `wz-time-picker wz-time-picker-double ${className}`, style, children: [
+    /* @__PURE__ */ jsx("div", { className: "wz-time-picker-mask wz-time-picker-mask-top", style: { height: itemHeight } }),
+    /* @__PURE__ */ jsx("div", { className: "wz-time-picker-indicator", style: { height: itemHeight } }),
+    /* @__PURE__ */ jsxs("div", { className: "wz-time-picker-double-columns", children: [
+      renderColumn(hourOptions, currentHour, hourRef, "hour"),
+      renderColumn(minuteOptions, currentMinute, minuteRef, "minute")
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "wz-time-picker-mask wz-time-picker-mask-bottom", style: { height: itemHeight } })
+  ] });
+};
+const getYearList = (min, max) => {
+  const arr = [];
+  for (let i = min; i <= max; i++) arr.push(i.toString());
+  return arr;
+};
+const getMonthList = () => Array.from({ length: 12 }, (_, i) => (i + 1).toString().padStart(2, "0"));
+const getDayList = (year, month) => {
+  const days = new Date(year, month, 0).getDate();
+  return Array.from({ length: days }, (_, i) => (i + 1).toString().padStart(2, "0"));
+};
+const DatePicker = ({
+  value,
+  onChange,
+  min = "1970-01-01",
+  max = "2100-12-31",
+  columns = ["year", "month", "day"],
+  itemHeight = 48,
+  className = "",
+  style
+}) => {
+  const today = /* @__PURE__ */ new Date();
+  const [initYear, initMonth, initDay] = value ? value.split("-").map(Number) : [today.getFullYear(), today.getMonth() + 1, today.getDate()];
+  const minYear = Number(min.split("-")[0]);
+  const maxYear = Number(max.split("-")[0]);
+  const yearList = useMemo(() => getYearList(minYear, maxYear), [minYear, maxYear]);
+  const [year, setYear] = useState(initYear);
+  const [month, setMonth] = useState(initMonth);
+  const [day, setDay] = useState(initDay);
+  const monthList = getMonthList();
+  const dayList = getDayList(year, month);
+  const yearRef = useRef(null);
+  const monthRef = useRef(null);
+  const dayRef = useRef(null);
+  const startY = useRef(0);
+  const startScroll = useRef(0);
+  const isDragging = useRef(false);
+  const dragType = useRef(null);
+  useLayoutEffect(() => {
+    if (yearRef.current) yearRef.current.scrollTo({ top: (year - minYear) * itemHeight, behavior: "auto" });
+  }, [year, itemHeight, minYear]);
+  useLayoutEffect(() => {
+    if (monthRef.current) monthRef.current.scrollTo({ top: (month - 1) * itemHeight, behavior: "auto" });
+  }, [month, itemHeight]);
+  useLayoutEffect(() => {
+    if (dayRef.current) dayRef.current.scrollTo({ top: (day - 1) * itemHeight, behavior: "auto" });
+  }, [day, itemHeight]);
+  const handleTouchStart = (type) => (e) => {
+    var _a, _b, _c;
+    isDragging.current = true;
+    dragType.current = type;
+    startY.current = e.touches[0].clientY;
+    let scrollTop = 0;
+    if (type === "year") scrollTop = ((_a = yearRef.current) == null ? void 0 : _a.scrollTop) || 0;
+    if (type === "month") scrollTop = ((_b = monthRef.current) == null ? void 0 : _b.scrollTop) || 0;
+    if (type === "day") scrollTop = ((_c = dayRef.current) == null ? void 0 : _c.scrollTop) || 0;
+    startScroll.current = scrollTop;
+  };
+  const handleTouchMove = (e) => {
+    if (!isDragging.current || !dragType.current) return;
+    const deltaY = e.touches[0].clientY - startY.current;
+    if (dragType.current === "year" && yearRef.current) yearRef.current.scrollTop = startScroll.current - deltaY;
+    if (dragType.current === "month" && monthRef.current) monthRef.current.scrollTop = startScroll.current - deltaY;
+    if (dragType.current === "day" && dayRef.current) dayRef.current.scrollTop = startScroll.current - deltaY;
+  };
+  const handleTouchEnd = () => {
+    if (!isDragging.current || !dragType.current) return;
+    if (dragType.current === "year" && yearRef.current) {
+      const idx = Math.round(yearRef.current.scrollTop / itemHeight);
+      setYear(Number(yearList[idx]));
+      onChange == null ? void 0 : onChange(`${yearList[idx]}-${month.toString().padStart(2, "0")}-${day.toString().padStart(2, "0")}`);
+    }
+    if (dragType.current === "month" && monthRef.current) {
+      const idx = Math.round(monthRef.current.scrollTop / itemHeight);
+      setMonth(Number(monthList[idx]));
+      onChange == null ? void 0 : onChange(`${year}-${monthList[idx]}-${day.toString().padStart(2, "0")}`);
+    }
+    if (dragType.current === "day" && dayRef.current) {
+      const idx = Math.round(dayRef.current.scrollTop / itemHeight);
+      setDay(Number(dayList[idx]));
+      onChange == null ? void 0 : onChange(`${year}-${month.toString().padStart(2, "0")}-${dayList[idx]}`);
+    }
+    isDragging.current = false;
+    dragType.current = null;
+  };
+  const handleScroll = (type) => () => {
+    if (isDragging.current) return;
+    if (type === "year" && yearRef.current) {
+      const idx = Math.round(yearRef.current.scrollTop / itemHeight);
+      setYear(Number(yearList[idx]));
+      onChange == null ? void 0 : onChange(`${yearList[idx]}-${month.toString().padStart(2, "0")}-${day.toString().padStart(2, "0")}`);
+    }
+    if (type === "month" && monthRef.current) {
+      const idx = Math.round(monthRef.current.scrollTop / itemHeight);
+      setMonth(Number(monthList[idx]));
+      onChange == null ? void 0 : onChange(`${year}-${monthList[idx]}-${day.toString().padStart(2, "0")}`);
+    }
+    if (type === "day" && dayRef.current) {
+      const idx = Math.round(dayRef.current.scrollTop / itemHeight);
+      setDay(Number(dayList[idx]));
+      onChange == null ? void 0 : onChange(`${year}-${month.toString().padStart(2, "0")}-${dayList[idx]}`);
+    }
+  };
+  React.useEffect(() => {
+    if (value) {
+      const [y, m, d] = value.split("-").map(Number);
+      setYear(y);
+      setMonth(m);
+      setDay(d);
+      if (yearRef.current) yearRef.current.scrollTo({ top: (y - minYear) * itemHeight, behavior: "auto" });
+      if (monthRef.current) monthRef.current.scrollTo({ top: (m - 1) * itemHeight, behavior: "auto" });
+      if (dayRef.current) dayRef.current.scrollTo({ top: (d - 1) * itemHeight, behavior: "auto" });
+    }
+  }, [value]);
+  const renderColumn = (options, current, ref, type) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "wz-date-picker-list",
+      ref,
+      style: { height: itemHeight * 3 },
+      onTouchStart: handleTouchStart(type),
+      onTouchMove: handleTouchMove,
+      onTouchEnd: handleTouchEnd,
+      onScroll: handleScroll(type),
+      children: [
+        /* @__PURE__ */ jsx("div", { style: { height: itemHeight } }),
+        options.map((opt, idx) => /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `wz-date-picker-item${idx === current ? " active" : ""}`,
+            style: { height: itemHeight },
+            children: type === "year" ? `${opt}年` : type === "month" ? `${opt}月` : `${opt}日`
+          },
+          opt
+        )),
+        /* @__PURE__ */ jsx("div", { style: { height: itemHeight } })
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsxs("div", { className: `wz-date-picker ${className}`, style, children: [
+    /* @__PURE__ */ jsx("div", { className: "wz-date-picker-mask wz-date-picker-mask-top", style: { height: itemHeight } }),
+    /* @__PURE__ */ jsx("div", { className: "wz-date-picker-indicator", style: { height: itemHeight } }),
+    /* @__PURE__ */ jsxs("div", { className: "wz-date-picker-columns", children: [
+      columns.includes("year") && renderColumn(yearList, year - minYear, yearRef, "year"),
+      columns.includes("month") && renderColumn(monthList, month - 1, monthRef, "month"),
+      columns.includes("day") && renderColumn(dayList, day - 1, dayRef, "day")
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "wz-date-picker-mask wz-date-picker-mask-bottom", style: { height: itemHeight } })
+  ] });
+};
+const DateRangePicker = ({
+  value,
+  onChange,
+  min = "1970-01-01",
+  max = "2100-12-31",
+  startLabel = "开始时间",
+  endLabel = "结束时间",
+  className = "",
+  style
+}) => {
+  const todayStr = React.useMemo(() => {
+    const today = /* @__PURE__ */ new Date();
+    const y = today.getFullYear();
+    const m = (today.getMonth() + 1).toString().padStart(2, "0");
+    const d = today.getDate().toString().padStart(2, "0");
+    return `${y}-${m}-${d}`;
+  }, []);
+  const [innerValue, setInnerValue] = useState(value || [todayStr, todayStr]);
+  const range = value || innerValue;
+  const [active, setActive] = useState("start");
+  const handleSelect = (val) => {
+    if (active === "start") {
+      const newRange = [val, range[1] && range[1] >= val ? range[1] : val];
+      setInnerValue(newRange);
+      onChange == null ? void 0 : onChange(newRange);
+    } else {
+      const newRange = [range[0], val && val >= range[0] ? val : range[0]];
+      setInnerValue(newRange);
+      onChange == null ? void 0 : onChange(newRange);
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: `wz-date-range-picker ${className}`, style, children: [
+    /* @__PURE__ */ jsxs("div", { className: "wz-date-range-picker-label-row", children: [
+      /* @__PURE__ */ jsx("div", { className: "wz-date-range-picker-label", children: startLabel }),
+      /* @__PURE__ */ jsx("div", { className: "wz-date-range-picker-label", children: endLabel })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "wz-date-range-picker-row", children: [
+      /* @__PURE__ */ jsx("div", { className: "wz-date-range-picker-col", children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: `wz-date-range-picker-value${active === "start" ? " active" : ""}`,
+          onClick: () => setActive("start"),
+          children: range[0] || "请选择"
+        }
+      ) }),
+      /* @__PURE__ */ jsx("div", { className: "wz-date-range-picker-sep", children: "至" }),
+      /* @__PURE__ */ jsx("div", { className: "wz-date-range-picker-col", children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: `wz-date-range-picker-value${active === "end" ? " active" : ""}`,
+          onClick: () => setActive("end"),
+          children: range[1] || "请选择"
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "wz-date-range-picker-picker", children: /* @__PURE__ */ jsx(
+      DatePicker,
+      {
+        value: active === "start" ? range[0] : range[1],
+        onChange: handleSelect,
+        min,
+        max
+      }
+    ) })
+  ] });
+};
+const alignMap = {
+  start: "flex-start",
+  center: "center",
+  end: "flex-end",
+  stretch: "stretch",
+  baseline: "baseline"
+};
+const justifyMap = {
+  start: "flex-start",
+  center: "center",
+  end: "flex-end",
+  between: "space-between",
+  around: "space-around",
+  evenly: "space-evenly"
+};
+const FlexItem = ({
+  span,
+  order,
+  offset,
+  className = "",
+  style = {},
+  children
+}) => {
+  if (process.env.NODE_ENV !== "production") {
+    if (span !== void 0 && (span < 0 || span > 1)) {
+      console.warn(
+        `[Flex.Item] span 应该在 0-1 之间，当前值为 ${span}。例如：0.5 表示 50%`
+      );
+    }
+    if (offset !== void 0 && (offset < 0 || offset > 1)) {
+      console.warn(
+        `[Flex.Item] offset 应该在 0-1 之间，当前值为 ${offset}。例如：0.25 表示 25%`
+      );
+    }
+  }
+  const itemStyle = {
+    flexBasis: span !== void 0 ? `${span * 100}%` : void 0,
+    flexGrow: span !== void 0 ? 0 : void 0,
+    flexShrink: span !== void 0 ? 0 : void 0,
+    order,
+    marginLeft: offset !== void 0 ? `${offset * 100}%` : void 0,
+    ...style
+  };
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `wz-flex-item${className ? " " + className : ""}`,
+      style: itemStyle,
+      children
+    }
+  );
+};
+const Flex = ({
+  direction = "row",
+  align = "stretch",
+  justify = "start",
+  wrap = "nowrap",
+  gap = 0,
+  className = "",
+  style = {},
+  children
+}) => {
+  const flexStyle = {
+    display: "flex",
+    flexDirection: direction,
+    alignItems: alignMap[align],
+    justifyContent: justifyMap[justify],
+    flexWrap: wrap,
+    gap: typeof gap === "number" ? `${gap}px` : gap,
+    ...style
+  };
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `wz-flex${className ? " " + className : ""}`,
+      style: flexStyle,
+      children
+    }
+  );
+};
+Flex.Item = FlexItem;
+const GridContext = createContext(24);
+const GridItem = ({
+  span = 1,
+  offset = 0,
+  order,
+  className = "",
+  style = {},
+  children
+}) => {
+  const cols = useContext(GridContext);
+  if (process.env.NODE_ENV !== "production") {
+    if (span < 1 || span > cols) {
+      console.warn(
+        `[Grid.Item] span 应该在 1-${cols} 之间，当前值为 ${span}`
+      );
+    }
+    if (offset < 0 || offset > cols) {
+      console.warn(
+        `[Grid.Item] offset 应该在 0-${cols} 之间，当前值为 ${offset}`
+      );
+    }
+  }
+  const width = `${span / cols * 100}%`;
+  const marginLeft = offset ? `${offset / cols * 100}%` : void 0;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `wz-grid-item${className ? " " + className : ""}`,
+      style: { width, marginLeft, order, ...style },
+      children
+    }
+  );
+};
+const Grid = ({
+  cols = 24,
+  gap = 0,
+  className = "",
+  style = {},
+  children
+}) => {
+  const gridStyle = {
+    display: "flex",
+    flexWrap: "wrap",
+    gap: typeof gap === "number" ? `${gap}px` : gap,
+    ...style
+  };
+  return /* @__PURE__ */ jsx(GridContext.Provider, { value: cols, children: /* @__PURE__ */ jsx("div", { className: `wz-grid${className ? " " + className : ""}`, style: gridStyle, children }) });
+};
+Grid.Item = GridItem;
+const GridViewItem = ({
+  icon,
+  text,
+  description,
+  badge,
+  corner,
+  onClick,
+  className = "",
+  style = {},
+  disabled = false,
+  children,
+  horizontal = false,
+  compact = false,
+  backgroundImage,
+  backgroundStyle = {}
+}) => {
+  const handleClick = () => {
+    if (!disabled && onClick) {
+      onClick();
+    }
+  };
+  const itemClass = [
+    "wz-grid-view-item",
+    disabled ? "wz-grid-view-item--disabled" : "",
+    onClick ? "wz-grid-view-item--clickable" : "",
+    horizontal ? "wz-grid-view-item--horizontal" : "",
+    compact ? "wz-grid-view-item--compact" : "",
+    backgroundImage ? "wz-grid-view-item--with-bg" : "",
+    className
+  ].filter(Boolean).join(" ");
+  const itemStyle = backgroundImage ? {
+    backgroundImage: `url(${backgroundImage})`,
+    backgroundSize: "cover",
+    backgroundPosition: "center",
+    backgroundRepeat: "no-repeat",
+    ...backgroundStyle,
+    ...style
+  } : style;
+  if (children) {
+    return /* @__PURE__ */ jsxs("div", { className: itemClass, style: itemStyle, onClick: handleClick, children: [
+      corner && /* @__PURE__ */ jsx("div", { className: "wz-grid-view-item__corner", children: corner }),
+      children,
+      badge && /* @__PURE__ */ jsx("div", { className: "wz-grid-view-item__badge", children: badge })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: itemClass, style: itemStyle, onClick: handleClick, children: [
+    corner && /* @__PURE__ */ jsx("div", { className: "wz-grid-view-item__corner", children: corner }),
+    /* @__PURE__ */ jsxs("div", { className: "wz-grid-view-item__content", children: [
+      icon && /* @__PURE__ */ jsx("div", { className: "wz-grid-view-item__icon", children: icon }),
+      /* @__PURE__ */ jsxs("div", { className: "wz-grid-view-item__text", children: [
+        text && /* @__PURE__ */ jsx("div", { className: "wz-grid-view-item__title", children: text }),
+        description && /* @__PURE__ */ jsx("div", { className: "wz-grid-view-item__desc", children: description })
+      ] })
+    ] }),
+    badge && /* @__PURE__ */ jsx("div", { className: "wz-grid-view-item__badge", children: badge })
+  ] });
+};
+const GridView = ({
+  columns = 4,
+  gap = 0,
+  square = true,
+  className = "",
+  style = {},
+  children,
+  noBg = false,
+  rounded = false,
+  shadow = false,
+  horizontal = false
+}) => {
+  const gridStyle = {
+    gridTemplateColumns: `repeat(${columns}, 1fr)`,
+    gap: typeof gap === "number" ? `${gap}px` : gap,
+    ...style
+  };
+  const gridClass = [
+    "wz-grid-view",
+    square ? "wz-grid-view--square" : "",
+    noBg ? "wz-grid-view--no-bg" : "",
+    rounded ? "wz-grid-view--rounded" : "",
+    shadow ? "wz-grid-view--shadow" : "",
+    horizontal ? "wz-grid-view--horizontal" : "",
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx("div", { className: gridClass, style: gridStyle, children });
+};
+GridView.Item = GridViewItem;
+function hexToRgba(hex, opacity) {
+  let newHex = hex.replace("#", "");
+  if (newHex.length === 3) {
+    newHex = newHex.split("").map((char) => char + char).join("");
+  }
+  const r = parseInt(newHex.substring(0, 2), 16);
+  const g = parseInt(newHex.substring(2, 4), 16);
+  const b = parseInt(newHex.substring(4, 6), 16);
+  return `rgba(${r}, ${g}, ${b}, ${opacity})`;
+}
+const Tag = (props) => {
+  const {
+    type = "solid",
+    size = "large",
+    color,
+    bgColor,
+    fontWeight,
+    className,
+    style,
+    children
+  } = props;
+  const classes = classNames("wz-tag", `wz-tag-${type}`, `wz-tag-${size}`, className);
+  const tagStyle = useMemo(() => {
+    const newStyle = { ...style };
+    if (color) {
+      newStyle.color = color;
+      if (type === "line") {
+        newStyle.borderColor = hexToRgba(color, 0.5);
+      }
+    }
+    if (bgColor && type === "solid") {
+      newStyle.backgroundColor = bgColor;
+    }
+    if (fontWeight) {
+      newStyle.fontWeight = fontWeight;
+    }
+    return newStyle;
+  }, [type, color, bgColor, fontWeight, style]);
+  return /* @__PURE__ */ jsx("div", { className: classes, style: tagStyle, children });
+};
+const Tip = ({
+  content,
+  className,
+  visible = true,
+  onClose,
+  action,
+  marquee = false
+}) => {
+  if (!visible) {
+    return null;
+  }
+  const baseClass = "wz-tip";
+  const tipClass = classNames(baseClass, className, {
+    [`${baseClass}--marquee`]: marquee
+  });
+  const contentNode = marquee ? /* @__PURE__ */ jsx("div", { className: `${baseClass}-marquee-box`, children: /* @__PURE__ */ jsx("span", { children: content }) }) : content;
+  return /* @__PURE__ */ jsxs("div", { className: tipClass, children: [
+    /* @__PURE__ */ jsx("div", { className: `${baseClass}-content`, children: contentNode }),
+    action && /* @__PURE__ */ jsx("div", { className: `${baseClass}-action`, children: action }),
+    onClose && /* @__PURE__ */ jsx("div", { className: `${baseClass}-close`, onClick: onClose, children: /* @__PURE__ */ jsx(Icon, { name: "close", size: 16 }) })
+  ] });
+};
+const NavBar = ({
+  title,
+  leftArrow = true,
+  leftText,
+  rightText,
+  onLeftClick,
+  onRightClick,
+  leftSlot,
+  rightSlot,
+  titleSlot,
+  className,
+  style,
+  fixed = false,
+  scrollFixed = false
+}) => {
+  const [isFixed, setIsFixed] = useState(fixed);
+  const navbarRef = useRef(null);
+  const placeholderRef = useRef(null);
+  useEffect(() => {
+    if (scrollFixed === false) {
+      setIsFixed(fixed);
+      return;
+    }
+    const threshold = typeof scrollFixed === "number" ? scrollFixed : 0;
+    const handleScroll = () => {
+      const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
+      setIsFixed(scrollTop > threshold);
+    };
+    window.addEventListener("scroll", handleScroll);
+    handleScroll();
+    return () => {
+      window.removeEventListener("scroll", handleScroll);
+    };
+  }, [scrollFixed, fixed]);
+  const handleLeftClick = () => {
+    if (onLeftClick) {
+      onLeftClick();
+    }
+  };
+  const handleRightClick = () => {
+    if (onRightClick) {
+      onRightClick();
+    }
+  };
+  const renderLeft = () => {
+    if (leftSlot) {
+      return /* @__PURE__ */ jsx("div", { className: "wz-navbar-left", children: leftSlot });
+    }
+    return /* @__PURE__ */ jsxs("div", { className: "wz-navbar-left", onClick: handleLeftClick, children: [
+      leftArrow && /* @__PURE__ */ jsx(
+        Icon,
+        {
+          name: "right-arrow",
+          size: 20,
+          style: { transform: "scaleX(-1)" },
+          className: "wz-navbar-icon"
+        }
+      ),
+      leftText && /* @__PURE__ */ jsx("span", { className: "wz-navbar-text", children: leftText })
+    ] });
+  };
+  const renderRight = () => {
+    if (rightSlot) {
+      return /* @__PURE__ */ jsx("div", { className: "wz-navbar-right", children: rightSlot });
+    }
+    return /* @__PURE__ */ jsxs("div", { className: "wz-navbar-right", onClick: handleRightClick, children: [
+      rightText && /* @__PURE__ */ jsx("span", { className: "wz-navbar-text", children: rightText }),
+      !rightText && /* @__PURE__ */ jsx(Icon, { name: "more-h", className: "wz-navbar-icon" })
+    ] });
+  };
+  const renderTitle = () => {
+    if (titleSlot) {
+      return /* @__PURE__ */ jsx("div", { className: "wz-navbar-title", children: titleSlot });
+    }
+    return /* @__PURE__ */ jsx("div", { className: "wz-navbar-title", children: title });
+  };
+  const navbarClass = classNames(
+    "wz-navbar",
+    {
+      "wz-navbar-fixed": isFixed
+    },
+    className
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    isFixed && /* @__PURE__ */ jsx("div", { ref: placeholderRef, style: { height: "44px" } }),
+    /* @__PURE__ */ jsxs("div", { ref: navbarRef, className: navbarClass, style, children: [
+      renderLeft(),
+      renderTitle(),
+      renderRight()
+    ] })
+  ] });
+};
+const DropdownMenu = ({
+  items,
+  extension,
+  onChange,
+  value,
+  defaultValue = {}
+}) => {
+  const [activeItem, setActiveItem] = useState(null);
+  const [selectedValues, setSelectedValues] = useState(defaultValue);
+  useEffect(() => {
+    if (value !== void 0) {
+      setSelectedValues(value);
+    }
+  }, [value]);
+  const isControlled = value !== void 0;
+  const getCurrentValues = () => isControlled ? value : selectedValues;
+  const handleItemClick = (index) => {
+    setActiveItem(activeItem === index ? null : index);
+  };
+  const handleOptionClick = (itemIndex, optionValue) => {
+    const newValues = { ...getCurrentValues(), [itemIndex]: optionValue };
+    if (!isControlled) {
+      setSelectedValues(newValues);
+    }
+    setActiveItem(null);
+    if (onChange) {
+      onChange(itemIndex, optionValue, newValues);
+    }
+  };
+  const handleMaskClick = () => {
+    setActiveItem(null);
+  };
+  const getSelectedItemText = (itemIndex) => {
+    const currentValues = getCurrentValues();
+    const selectedValue = currentValues[itemIndex];
+    if (selectedValue === void 0) {
+      return items[itemIndex].title;
+    }
+    const selectedOption = items[itemIndex].options.find(
+      (option) => option.value === selectedValue
+    );
+    return selectedOption ? selectedOption.text : items[itemIndex].title;
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "wz-dropdown-menu-wrapper", children: [
+    /* @__PURE__ */ jsxs("div", { className: "wz-dropdown-menu", children: [
+      items.map((item, index) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: `wz-dropdown-item ${activeItem === index ? "active" : ""}`,
+          onClick: () => handleItemClick(index),
+          children: [
+            /* @__PURE__ */ jsx("span", { children: getSelectedItemText(index) }),
+            item.icon || /* @__PURE__ */ jsx(
+              Icon,
+              {
+                name: "dropdown",
+                size: 12
+              }
+            )
+          ]
+        },
+        index
+      )),
+      extension && /* @__PURE__ */ jsx("div", { className: "wz-dropdown-extension", children: extension })
+    ] }),
+    activeItem !== null && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "wz-dropdown-mask", onClick: handleMaskClick }),
+      /* @__PURE__ */ jsx("div", { className: "wz-dropdown-popup", children: items[activeItem].options.map((option) => /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: `wz-dropdown-option ${getCurrentValues()[activeItem] === option.value ? "selected" : ""}`,
+          onClick: () => handleOptionClick(activeItem, option.value),
+          children: option.text
+        },
+        option.value
+      )) })
+    ] })
+  ] });
+};
+const Toast$1 = ({
+  content,
+  duration = 2e3,
+  icon,
+  visible = false,
+  onClose
+}) => {
+  const [show2, setShow] = useState(visible);
+  useEffect(() => {
+    setShow(visible);
+    let timer;
+    if (visible && duration > 0) {
+      timer = setTimeout(() => {
+        setShow(false);
+        onClose == null ? void 0 : onClose();
+      }, duration);
+    }
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [visible, duration, onClose]);
+  const toastClass = classNames("wz-toast", { "wz-toast-visible": show2 });
+  const iconClass = classNames("wz-toast-icon");
+  return /* @__PURE__ */ jsx("div", { className: toastClass, children: /* @__PURE__ */ jsxs("div", { className: "wz-toast-content", children: [
+    icon && /* @__PURE__ */ jsx("div", { className: iconClass, children: icon }),
+    /* @__PURE__ */ jsx("div", { className: "wz-toast-text", children: content })
+  ] }) });
+};
+let root = null;
+let container = null;
+const destroy = () => {
+  if (root) {
+    root.unmount();
+    root = null;
+  }
+  if (container && container.parentNode) {
+    container.parentNode.removeChild(container);
+    container = null;
+  }
+};
+const renderToast = (props) => {
+  if (!container) {
+    container = document.createElement("div");
+    document.body.appendChild(container);
+    root = createRoot(container);
+  }
+  root.render(/* @__PURE__ */ jsx(Toast$1, { ...props }));
+};
+const show = (props) => {
+  const toastProps = typeof props === "string" ? { content: props } : props;
+  renderToast({ ...toastProps, visible: true, onClose: destroy });
+};
+const success = (content, duration) => {
+  renderToast({
+    content,
+    duration,
+    icon: /* @__PURE__ */ jsx(Icon, { name: "check-round", size: 37.14 }),
+    visible: true,
+    onClose: destroy
+  });
+};
+const fail = (content, duration) => {
+  renderToast({
+    content,
+    duration,
+    icon: /* @__PURE__ */ jsx(Icon, { name: "close", size: 37.14 }),
+    visible: true,
+    onClose: destroy
+  });
+};
+const loading = (content, duration) => {
+  renderToast({
+    content,
+    duration,
+    icon: /* @__PURE__ */ jsx(Icon, { name: "loading", size: 37.14 }),
+    visible: true,
+    onClose: destroy
+  });
+};
+const warn = (content, duration) => {
+  renderToast({
+    content,
+    duration,
+    icon: /* @__PURE__ */ jsx(Icon, { name: "info", size: 37.14 }),
+    visible: true,
+    onClose: destroy
+  });
+};
+const hide = () => {
+  renderToast({ content: "", visible: false });
+  destroy();
+};
+const Toast = { show, success, fail, loading, warn, hide };
+const Tooltip = ({
+  content,
+  children,
+  className,
+  style,
+  color,
+  textColor,
+  trigger = "click",
+  visible,
+  onVisibleChange,
+  showMask = false,
+  action,
+  closeIcon
+}) => {
+  const [internalVisible, setInternalVisible] = useState(false);
+  const [computedStyle, setComputedStyle] = useState({});
+  const [currentPlacement, setCurrentPlacement] = useState("bottom");
+  const tooltipRef = useRef(null);
+  const triggerRef = useRef(null);
+  const isControlled = visible !== void 0;
+  const currentVisible = isControlled ? visible : internalVisible;
+  const handleVisibleChange = (newVisible) => {
+    if (!isControlled) {
+      setInternalVisible(newVisible);
+    }
+    onVisibleChange == null ? void 0 : onVisibleChange(newVisible);
+  };
+  useLayoutEffect(() => {
+    if (currentVisible && tooltipRef.current && triggerRef.current) {
+      const bubbleEl = tooltipRef.current;
+      const triggerEl = triggerRef.current;
+      const { width: bubbleWidth, height: bubbleHeight } = bubbleEl.getBoundingClientRect();
+      const { top: triggerTop, left: triggerLeft, width: triggerWidth, height: triggerHeight } = triggerEl.getBoundingClientRect();
+      const { innerWidth, innerHeight } = window;
+      const margin = 8;
+      let finalTop;
+      let finalLeft = triggerLeft + triggerWidth / 2 - bubbleWidth / 2;
+      let finalPlacement = "bottom";
+      if (finalLeft < margin) {
+        finalLeft = margin;
+      }
+      if (finalLeft + bubbleWidth > innerWidth - margin) {
+        finalLeft = innerWidth - bubbleWidth - margin;
+      }
+      finalTop = triggerTop + triggerHeight + margin;
+      if (finalTop + bubbleHeight > innerHeight - margin) {
+        finalPlacement = "top";
+        finalTop = triggerTop - bubbleHeight - margin;
+      }
+      if (finalTop < margin) {
+        finalPlacement = "bottom";
+        finalTop = triggerTop + triggerHeight + margin;
+      }
+      const arrowLeft = triggerLeft + triggerWidth / 2 - finalLeft;
+      setCurrentPlacement(finalPlacement);
+      setComputedStyle({
+        top: `${finalTop}px`,
+        left: `${finalLeft}px`,
+        "--wz-tooltip-arrow-left": `${arrowLeft}px`
+      });
+    }
+  }, [currentVisible]);
+  const handleWrapperClick = () => {
+    if (trigger === "click") {
+      handleVisibleChange(!currentVisible);
+    }
+  };
+  const handleClose = (e) => {
+    e.stopPropagation();
+    handleVisibleChange(false);
+  };
+  const classes = classNames("wz-tooltip-bubble", `wz-tooltip-bubble--placement-${currentPlacement}`, className);
+  const bubbleStyle = {
+    ...style,
+    ...computedStyle,
+    opacity: computedStyle.top ? 1 : 0,
+    transition: "opacity 150ms ease-in",
+    "--wz-tooltip-bubble-bg": color,
+    color: textColor
+  };
+  const renderBubble = () => {
+    if (!currentVisible) return null;
+    const renderAction = () => {
+      if (!action) return null;
+      const originalOnClick = action.props.onClick;
+      const newOnClick = (e) => {
+        originalOnClick == null ? void 0 : originalOnClick(e);
+        handleVisibleChange(false);
+      };
+      return /* @__PURE__ */ jsx("div", { className: "wz-tooltip-bubble__action-slot", children: React.cloneElement(action, { onClick: newOnClick }) });
+    };
+    const renderCloseIcon = () => {
+      if (!closeIcon) return null;
+      return /* @__PURE__ */ jsx("div", { className: "wz-tooltip-bubble__close-slot", children: React.cloneElement(closeIcon, { onClick: handleClose }) });
+    };
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      showMask && /* @__PURE__ */ jsx("div", { className: "wz-tooltip-mask", onClick: handleClose }),
+      /* @__PURE__ */ jsxs("div", { className: classes, style: bubbleStyle, ref: tooltipRef, children: [
+        /* @__PURE__ */ jsx("div", { className: "wz-tooltip-bubble__arrow" }),
+        /* @__PURE__ */ jsxs("div", { className: "wz-tooltip-bubble__inner", children: [
+          /* @__PURE__ */ jsx("div", { className: "wz-tooltip-bubble__body", children: content }),
+          renderAction(),
+          renderCloseIcon()
+        ] })
+      ] })
+    ] });
+  };
+  const triggerProps = {
+    onClick: handleWrapperClick,
+    ref: triggerRef
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    React.cloneElement(children, triggerProps),
+    renderBubble()
+  ] });
+};
+const Dialog$1 = ({
+  visible,
+  title,
+  content,
+  onClose,
+  actions,
+  closeOnAction,
+  closeOnMaskClick
+}) => {
+  const onMaskClick = () => {
+    if (closeOnMaskClick) {
+      onClose == null ? void 0 : onClose();
+    }
+  };
+  const onActionClick = (onClick) => {
+    onClick == null ? void 0 : onClick();
+    if (closeOnAction) {
+      onClose == null ? void 0 : onClose();
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: classNames("wz-dialog-root", { visible }), children: [
+    /* @__PURE__ */ jsx("div", { className: "wz-dialog-mask", onClick: onMaskClick }),
+    /* @__PURE__ */ jsxs("div", { className: "wz-dialog-wrap", children: [
+      title && /* @__PURE__ */ jsx("div", { className: "wz-dialog-header", children: /* @__PURE__ */ jsx("div", { className: "wz-dialog-title", children: title }) }),
+      /* @__PURE__ */ jsx("div", { className: "wz-dialog-content", children: content }),
+      /* @__PURE__ */ jsx("div", { className: "wz-dialog-footer", children: actions == null ? void 0 : actions.map((action) => /* @__PURE__ */ jsx(
+        Button,
+        {
+          className: "wz-dialog-button",
+          onClick: () => onActionClick(action.onClick),
+          children: action.text
+        },
+        action.key
+      )) })
+    ] })
+  ] });
+};
+const renderDialog = (props) => {
+  const container2 = document.createElement("div");
+  document.body.appendChild(container2);
+  const root2 = createRoot(container2);
+  const unmount = () => {
+    root2.unmount();
+    document.body.removeChild(container2);
+  };
+  root2.render(/* @__PURE__ */ jsx(Dialog$1, { ...props, visible: true, onClose: unmount }));
+};
+const alert = (props) => {
+  renderDialog({
+    ...props,
+    closeOnAction: true,
+    actions: [
+      {
+        key: "confirm",
+        text: "确定",
+        onClick: props.onConfirm
+      }
+    ]
+  });
+};
+const confirm = (props) => {
+  renderDialog({
+    ...props,
+    closeOnAction: true,
+    actions: [
+      {
+        key: "cancel",
+        text: "取消",
+        onClick: props.onCancel
+      },
+      {
+        key: "confirm",
+        text: "确定",
+        onClick: props.onConfirm
+      }
+    ]
+  });
+};
+const Dialog = Object.assign(Dialog$1, { alert, confirm });
+export {
+  Button,
+  Card,
+  Cascader,
+  Cell,
+  CheckList,
+  Checkbox,
+  Collapse,
+  DatePicker,
+  DateRangePicker,
+  Dialog,
+  Divider,
+  DropdownMenu,
+  Flex,
+  Grid,
+  GridView,
+  Icon,
+  Input,
+  NavBar,
+  Popup,
+  Radio,
+  Search,
+  Stepper,
+  Switch,
+  Tabbar,
+  Tabs,
+  Tag,
+  TimePicker,
+  Tip,
+  Toast,
+  Tooltip
+};