wz-h5-design 1.0.0

package/dist/Dialog/index.js

@@ -0,0 +1,216 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { forwardRef, useState, useRef, useMemo } from "react";
+import { createRoot } from "react-dom/client";
+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 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 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 container = document.createElement("div");
+  document.body.appendChild(container);
+  const root = createRoot(container);
+  const unmount = () => {
+    root.unmount();
+    document.body.removeChild(container);
+  };
+  root.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 {
+  Dialog,
+  alert,
+  confirm
+};

package/dist/Dialog/index.umd.cjs

@@ -0,0 +1,6 @@
+!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("react/jsx-runtime"),require("react"),require("react-dom/client")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime","react","react-dom/client"],o):o((e="undefined"!=typeof globalThis?globalThis:e||self).Dialog={},e.jsxRuntime,e.React,e.client)}(this,(function(e,o,t,n){"use strict";function r(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var i,l={exports:{}};
+/*!
+  	Copyright (c) 2018 Jed Watson.
+  	Licensed under the MIT License (MIT), see
+  	http://jedwatson.github.io/classnames
+  */i=l,function(){var e={}.hasOwnProperty;function o(){for(var t=[],n=0;n<arguments.length;n++){var r=arguments[n];if(r){var i=typeof r;if("string"===i||"number"===i)t.push(r);else if(Array.isArray(r)){if(r.length){var l=o.apply(null,r);l&&t.push(l)}}else if("object"===i){if(r.toString!==Object.prototype.toString&&!r.toString.toString().includes("[native code]")){t.push(r.toString());continue}for(var a in r)e.call(r,a)&&r[a]&&t.push(a)}}}return t.join(" ")}i.exports?(o.default=o,i.exports=o):window.classNames=o}();const a=r(l.exports),s=t.forwardRef((({type:e="primary",size:n="medium",block:r=!1,disabled:i=!1,color:l="",textColor:a="",borderColor:s="",className:c="",style:u={},children:d,onClick:m},f)=>{const[p,b]=t.useState(!1),w=t.useRef(null),y=t.useMemo((()=>{if("cancel"===e)return u;if("outline"===e)return{color:a||"var(--wz-primary-color)",borderColor:s||"var(--wz-primary-color)",background:"transparent",...u};if("text"===e)return{color:a||u.color||"var(--wz-primary-color, #22C94D)",background:"transparent",border:"none",boxShadow:"none",...u};if("primary"===e){let e={...u};return e.background=l||"var(--wz-primary-gradient, var(--wz-primary-color))",e.color=a||"#fff",e}return u}),[e,l,a,s,u]),x=["wz-button",`wz-button--${e}`,`wz-button--${n}`,r?"wz-button--block":"",i?"wz-button--disabled":"",p&&!i?"wz-button--active":"",c].filter(Boolean).join(" ");return o.jsxs("button",{ref:f,type:"button",className:x,style:y,disabled:i,onClick:e=>{i||(b(!0),w.current&&window.clearTimeout(w.current),w.current=window.setTimeout((()=>b(!1)),100),null==m||m(e))},children:[d,"primary"===e&&p&&o.jsx("span",{className:"wz-button__mask"}),"outline"===e&&p&&o.jsx("span",{className:"wz-button__mask"}),"outline"===e&&i&&o.jsx("span",{className:"wz-button__mask--disabled"}),"cancel"===e&&p&&o.jsx("span",{className:"wz-button__mask--cancel"})]})}));s.displayName="Button";const c=({visible:e,title:t,content:n,onClose:r,actions:i,closeOnAction:l,closeOnMaskClick:c})=>o.jsxs("div",{className:a("wz-dialog-root",{visible:e}),children:[o.jsx("div",{className:"wz-dialog-mask",onClick:()=>{c&&(null==r||r())}}),o.jsxs("div",{className:"wz-dialog-wrap",children:[t&&o.jsx("div",{className:"wz-dialog-header",children:o.jsx("div",{className:"wz-dialog-title",children:t})}),o.jsx("div",{className:"wz-dialog-content",children:n}),o.jsx("div",{className:"wz-dialog-footer",children:null==i?void 0:i.map((e=>o.jsx(s,{className:"wz-dialog-button",onClick:()=>{return null==(o=e.onClick)||o(),void(l&&(null==r||r()));var o},children:e.text},e.key)))})]})]}),u=e=>{const t=document.createElement("div");document.body.appendChild(t);const r=n.createRoot(t);r.render(o.jsx(c,{...e,visible:!0,onClose:()=>{r.unmount(),document.body.removeChild(t)}}))},d=e=>{u({...e,closeOnAction:!0,actions:[{key:"confirm",text:"确定",onClick:e.onConfirm}]})},m=e=>{u({...e,closeOnAction:!0,actions:[{key:"cancel",text:"取消",onClick:e.onCancel},{key:"confirm",text:"确定",onClick:e.onConfirm}]})},f=Object.assign(c,{alert:d,confirm:m});e.Dialog=f,e.alert=d,e.confirm=m,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})}));

package/dist/Dialog/style/index.css

@@ -0,0 +1 @@
+.wz-dialog-root{z-index:1000;visibility:hidden;opacity:0;justify-content:center;align-items:center;width:100%;height:100%;transition:all .3s;display:flex;position:fixed;top:0;left:0}.wz-dialog-root.visible{visibility:visible;opacity:1}.wz-dialog-mask{background-color:#0006;width:100%;height:100%;position:absolute;top:0;left:0}.wz-dialog-wrap{background-color:#fff;border-radius:8px;width:85%;max-width:300px;padding-top:24px;position:relative;overflow:hidden}.wz-dialog-header{text-align:center;padding:0 24px 8px}.wz-dialog-title{font-size:18px;font-weight:500}.wz-dialog-content{text-align:center;color:#666;padding:8px 24px 24px;font-size:14px}.wz-dialog-footer{padding:0 24px 24px;display:flex}.wz-dialog-footer .wz-dialog-button{color:#fff;background-color:#00b578;border-radius:100px;flex:1}.wz-dialog-footer .wz-dialog-button:not(:last-child){margin-right:12px}

package/dist/Dialog/style/index.js

@@ -0,0 +1 @@
+import './index.css';

package/dist/Dialog/style.css

@@ -0,0 +1 @@
+.wz-dialog-root{z-index:1000;visibility:hidden;opacity:0;justify-content:center;align-items:center;width:100%;height:100%;transition:all .3s;display:flex;position:fixed;top:0;left:0}.wz-dialog-root.visible{visibility:visible;opacity:1}.wz-dialog-mask{background-color:#0006;width:100%;height:100%;position:absolute;top:0;left:0}.wz-dialog-wrap{background-color:#fff;border-radius:8px;width:85%;max-width:300px;padding-top:24px;position:relative;overflow:hidden}.wz-dialog-header{text-align:center;padding:0 24px 8px}.wz-dialog-title{font-size:18px;font-weight:500}.wz-dialog-content{text-align:center;color:#666;padding:8px 24px 24px;font-size:14px}.wz-dialog-footer{padding:0 24px 24px;display:flex}.wz-dialog-footer .wz-dialog-button{color:#fff;background-color:#00b578;border-radius:100px;flex:1}.wz-dialog-footer .wz-dialog-button:not(:last-child){margin-right:12px}.wz-button{box-sizing:border-box;text-align:center;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;border-radius:23px;outline:none;justify-content:center;align-items:center;height:40px;padding:0 15px;font-family:"Alibaba PuHuiTi 2.0",Alibaba-PuHuiTi-Regular,PingFang SC,Microsoft YaHei,Arial,sans-serif;font-size:18px;font-weight:600;line-height:23px;transition:all .2s;display:inline-flex;position:relative;overflow:hidden}.wz-button--primary{color:#fff;background:var(--wz-primary-gradient,linear-gradient(90deg,#0ac0f7 0%,#0596f7 100%));border:none;border-radius:23px}.wz-button--primary.wz-button--disabled{background:#c0c4cc}.wz-button--outline{color:var(--wz-primary-color,#22c94d);border:1px solid var(--wz-primary-color,#22c94d);background:0 0;border-radius:26px}.wz-button--cancel{color:#fff;background:#c0c4cc;border:none;border-radius:26px}.wz-button--block{width:100%;display:flex}.wz-button--large{height:45px;padding:0 20px;font-size:18px}.wz-button--medium{height:30px;padding:0 16px;font-size:14px}.wz-button--small{height:25px;padding:0 12px;font-size:13px}.wz-button--disabled{cursor:not-allowed;opacity:.6}.wz-button--active{opacity:.9}.wz-button__mask{pointer-events:none;border-radius:inherit;z-index:1;background:#00000014;width:100%;height:100%;position:absolute;top:0;left:0}.wz-button__mask--disabled{pointer-events:none;border-radius:inherit;z-index:10;background:#ffffff80;width:100%;height:100%;position:absolute;top:0;left:0}.wz-button__mask--cancel{pointer-events:none;border-radius:inherit;z-index:10;background:#0000000f;width:100%;height:100%;position:absolute;top:0;left:0}@media screen and (max-width:767px){.wz-button--small{height:30px;font-size:14px}.wz-button--medium{height:40px;font-size:15px}.wz-button--large{height:50px;font-size:16px}}.wz-button--text{color:var(--wz-primary-color,#22c94d);box-shadow:none;background:0 0;border:none;min-width:0;height:auto;padding:0 8px;font-size:16px;font-weight:600;transition:color .2s}.wz-button--text:active{color:#179a38;background:#f5f7f9}.wz-button--disabled.wz-button--text{color:#c0c4cc;background:0 0}

package/dist/Divider/index.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+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
+      }
+    }
+  );
+};
+export {
+  Divider as default
+};

package/dist/Divider/index.umd.cjs

@@ -0,0 +1 @@
+!function(e,i){"object"==typeof exports&&"undefined"!=typeof module?module.exports=i(require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["react/jsx-runtime"],i):(e="undefined"!=typeof globalThis?globalThis:e||self).Divider=i(e.jsxRuntime)}(this,(function(e){"use strict";return({direction:i="horizontal",color:t="#eee",length:n,margin:r,style:o,className:d=""})=>{const s="vertical"===i;return e.jsx("div",{className:`wz-divider wz-divider--${i} ${d}`,style:{background:t,width:s?1:n||"100%",height:s?n||24:1,margin:r,...o}})}}));

package/dist/Divider/style/index.css

@@ -0,0 +1 @@
+.wz-divider{background:#eee;border:none;display:block}.wz-divider--vertical{width:1px;min-height:16px}.wz-divider--horizontal{width:100%;height:1px}

package/dist/Divider/style/index.js

@@ -0,0 +1 @@
+import './index.css';

package/dist/Divider/style.css

@@ -0,0 +1 @@
+.wz-divider{background:#eee;border:none;display:block}.wz-divider--vertical{width:1px;min-height:16px}.wz-divider--horizontal{width:100%;height:1px}

package/dist/DropDownMenu/index.js

@@ -0,0 +1,111 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+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 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
+      )) })
+    ] })
+  ] });
+};
+export {
+  DropdownMenu
+};

package/dist/DropDownMenu/index.umd.cjs

@@ -0,0 +1 @@
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react/jsx-runtime"),require("react")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime","react"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).DropDownMenu={},e.jsxRuntime,e.React)}(this,(function(e,n,o){"use strict";const t=({name:e,size:o=24,color:t="currentColor",className:s="",style:i,onClick:l,type:r="yunying"})=>{const c={fontSize:"number"==typeof o?`${o}px`:o,color:t,...i},d=`iconfont-${r}`,a=`icon-${e}`;return n.jsx("i",{className:`wz-icon ${d} ${a} ${s}`,style:c,onClick:l})};e.DropdownMenu=({items:e,extension:s,onChange:i,value:l,defaultValue:r={}})=>{const[c,d]=o.useState(null),[a,u]=o.useState(r);o.useEffect((()=>{void 0!==l&&u(l)}),[l]);const p=void 0!==l,m=()=>p?l:a,f=n=>{const o=m()[n];if(void 0===o)return e[n].title;const t=e[n].options.find((e=>e.value===o));return t?t.text:e[n].title};return n.jsxs("div",{className:"wz-dropdown-menu-wrapper",children:[n.jsxs("div",{className:"wz-dropdown-menu",children:[e.map(((e,o)=>n.jsxs("div",{className:"wz-dropdown-item "+(c===o?"active":""),onClick:()=>(e=>{d(c===e?null:e)})(o),children:[n.jsx("span",{children:f(o)}),e.icon||n.jsx(t,{name:"dropdown",size:12})]},o))),s&&n.jsx("div",{className:"wz-dropdown-extension",children:s})]}),null!==c&&n.jsxs(n.Fragment,{children:[n.jsx("div",{className:"wz-dropdown-mask",onClick:()=>{d(null)}}),n.jsx("div",{className:"wz-dropdown-popup",children:e[c].options.map((e=>n.jsx("div",{className:"wz-dropdown-option "+(m()[c]===e.value?"selected":""),onClick:()=>((e,n)=>{const o={...m(),[e]:n};p||u(o),d(null),i&&i(e,n,o)})(c,e.value),children:e.text},e.value)))})]})]})},Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})}));

package/dist/DropDownMenu/style/index.css

@@ -0,0 +1 @@
+:root{--wz-z-index-base:1;--wz-z-index-dropdown:100;--wz-z-index-navbar:999;--wz-z-index-tabbar:999;--wz-z-index-popup:1000;--wz-z-index-dialog:1000;--wz-z-index-toast:9999}.wz-dropdown-menu-wrapper{position:relative}.wz-dropdown-menu{z-index:var(--wz-z-index-dropdown,100);background-color:#fff;align-items:center;gap:4px;height:48px;padding:0 4px;display:flex;position:relative;box-shadow:0 2px 12px #6465661f}.wz-dropdown-item{color:#333;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;flex:none;justify-content:center;align-items:center;min-width:60px;padding:0 14px;font-size:13px;font-weight:400;line-height:20px;transition:color .3s;display:flex}.wz-dropdown-item:nth-child(2){padding:0 10px}.wz-dropdown-item:nth-child(n+3){padding:0 18px}.wz-dropdown-item.active{color:#1677ff}.wz-dropdown-item .wz-icon{margin-left:4px}.wz-dropdown-extension{align-items:center;gap:8px;margin-left:auto;padding:0 4px;display:flex}.wz-dropdown-extension .wz-dropdown-btn-icon{align-items:center;margin-right:4px;display:inline-flex}.wz-dropdown-mask{z-index:calc(var(--wz-z-index-dropdown,100) - 1);background-color:#0000;position:fixed;top:0;bottom:0;left:0;right:0}.wz-dropdown-popup{z-index:var(--wz-z-index-dropdown,100);background-color:#fff;border-radius:0 0 8px 8px;max-height:240px;position:absolute;top:48px;left:0;right:0;overflow-y:auto;box-shadow:0 4px 12px #00000026}.wz-dropdown-option{color:#333;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;padding:12px 18px;font-size:14px;transition:background-color .3s}.wz-dropdown-option:hover{background-color:#f5f5f5}.wz-dropdown-option.selected{color:#1677ff;font-weight:500}

package/dist/DropDownMenu/style/index.js

@@ -0,0 +1 @@
+import './index.css';

package/dist/DropDownMenu/style.css

@@ -0,0 +1 @@
+:root{--wz-z-index-base:1;--wz-z-index-dropdown:100;--wz-z-index-navbar:999;--wz-z-index-tabbar:999;--wz-z-index-popup:1000;--wz-z-index-dialog:1000;--wz-z-index-toast:9999}.wz-dropdown-menu-wrapper{position:relative}.wz-dropdown-menu{z-index:var(--wz-z-index-dropdown,100);background-color:#fff;align-items:center;gap:4px;height:48px;padding:0 4px;display:flex;position:relative;box-shadow:0 2px 12px #6465661f}.wz-dropdown-item{color:#333;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;flex:none;justify-content:center;align-items:center;min-width:60px;padding:0 14px;font-size:13px;font-weight:400;line-height:20px;transition:color .3s;display:flex}.wz-dropdown-item:nth-child(2){padding:0 10px}.wz-dropdown-item:nth-child(n+3){padding:0 18px}.wz-dropdown-item.active{color:#1677ff}.wz-dropdown-item .wz-icon{margin-left:4px}.wz-dropdown-extension{align-items:center;gap:8px;margin-left:auto;padding:0 4px;display:flex}.wz-dropdown-extension .wz-dropdown-btn-icon{align-items:center;margin-right:4px;display:inline-flex}.wz-dropdown-mask{z-index:calc(var(--wz-z-index-dropdown,100) - 1);background-color:#0000;position:fixed;top:0;bottom:0;left:0;right:0}.wz-dropdown-popup{z-index:var(--wz-z-index-dropdown,100);background-color:#fff;border-radius:0 0 8px 8px;max-height:240px;position:absolute;top:48px;left:0;right:0;overflow-y:auto;box-shadow:0 4px 12px #00000026}.wz-dropdown-option{color:#333;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;padding:12px 18px;font-size:14px;transition:background-color .3s}.wz-dropdown-option:hover{background-color:#f5f5f5}.wz-dropdown-option.selected{color:#1677ff;font-weight:500}.wz-icon{justify-content:center;align-items:center;transition:color .2s ease-in-out;display:inline-flex}.wz-icon-home:before{content:""}.wz-icon-search:before{content:""}.wz-icon-person:before{content:""}.wz-icon-settings:before{content:""}.wz-icon-notifications:before{content:""}.wz-icon-message:before{content:""}.wz-icon-favorite:before{content:""}.wz-icon-star:before{content:""}.wz-icon-close:before{content:""}.wz-icon-check:before{content:""}.wz-icon-arrow-back:before{content:""}.wz-icon-arrow-forward:before{content:""}.wz-icon-menu:before{content:""}.wz-icon-more:before{content:""}.wz-icon-add:before{content:""}.wz-icon-edit:before{content:""}.wz-icon-delete:before{content:""}.wz-icon-share:before{content:""}.wz-icon-download:before{content:""}.wz-icon-upload:before{content:""}.wz-icon-refresh:before{content:""}.wz-icon-help:before{content:""}.wz-icon-info:before{content:""}.wz-icon-warning:before{content:""}.wz-icon-error:before{content:""}.wz-icon-success:before{content:""}

package/dist/Flex/index.js

@@ -0,0 +1,85 @@
+import { jsx } from "react/jsx-runtime";
+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;
+export {
+  Flex
+};

package/dist/Flex/index.umd.cjs

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Flex={},e.jsxRuntime)}(this,(function(e,t){"use strict";const n={start:"flex-start",center:"center",end:"flex-end",stretch:"stretch",baseline:"baseline"},s={start:"flex-start",center:"center",end:"flex-end",between:"space-between",around:"space-around",evenly:"space-evenly"},r=({direction:e="row",align:r="stretch",justify:i="start",wrap:l="nowrap",gap:o=0,className:a="",style:d={},children:c})=>{const f={display:"flex",flexDirection:e,alignItems:n[r],justifyContent:s[i],flexWrap:l,gap:"number"==typeof o?`${o}px`:o,...d};return t.jsx("div",{className:"wz-flex"+(a?" "+a:""),style:f,children:c})};r.Item=({span:e,order:n,offset:s,className:r="",style:i={},children:l})=>{process.env.NODE_ENV;const o={flexBasis:void 0!==e?100*e+"%":void 0,flexGrow:void 0!==e?0:void 0,flexShrink:void 0!==e?0:void 0,order:n,marginLeft:void 0!==s?100*s+"%":void 0,...i};return t.jsx("div",{className:"wz-flex-item"+(r?" "+r:""),style:o,children:l})},e.Flex=r,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})}));

package/dist/Flex/style/index.css

@@ -0,0 +1 @@
+.wz-flex{box-sizing:border-box;display:flex}.wz-flex-item{box-sizing:border-box}

package/dist/Flex/style/index.js

@@ -0,0 +1 @@
+import './index.css';

package/dist/Flex/style.css

@@ -0,0 +1 @@
+.wz-flex{box-sizing:border-box;display:flex}.wz-flex-item{box-sizing:border-box}

package/dist/Grid/index.js

@@ -0,0 +1,54 @@
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+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;
+export {
+  Grid as default
+};

package/dist/Grid/index.umd.cjs

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react/jsx-runtime"),require("react")):"function"==typeof define&&define.amd?define(["react/jsx-runtime","react"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).Grid=t(e.jsxRuntime,e.React)}(this,(function(e,t){"use strict";const r=t.createContext(24),s=({cols:t=24,gap:s=0,className:n="",style:i={},children:o})=>{const c={display:"flex",flexWrap:"wrap",gap:"number"==typeof s?`${s}px`:s,...i};return e.jsx(r.Provider,{value:t,children:e.jsx("div",{className:"wz-grid"+(n?" "+n:""),style:c,children:o})})};return s.Item=({span:s=1,offset:n=0,order:i,className:o="",style:c={},children:d})=>{const a=t.useContext(r);process.env.NODE_ENV;const l=s/a*100+"%",f=n?n/a*100+"%":void 0;return e.jsx("div",{className:"wz-grid-item"+(o?" "+o:""),style:{width:l,marginLeft:f,order:i,...c},children:d})},s}));

package/dist/Grid/style/index.css

@@ -0,0 +1 @@
+.wz-grid{box-sizing:border-box;flex-wrap:wrap;display:flex}.wz-grid-item{box-sizing:border-box}

package/dist/Grid/style/index.js

@@ -0,0 +1 @@
+import './index.css';

package/dist/Grid/style.css

@@ -0,0 +1 @@
+.wz-grid{box-sizing:border-box;flex-wrap:wrap;display:flex}.wz-grid-item{box-sizing:border-box}