wz-h5-design 1.0.0

package/dist/Tip/index.js

@@ -0,0 +1,104 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+function getDefaultExportFromCjs(x) {
+  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
+}
+var classnames$1 = { 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 classNames() {
+      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 = classNames.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) {
+      classNames.default = classNames;
+      module.exports = classNames;
+    } else {
+      window.classNames = classNames;
+    }
+  })();
+})(classnames$1);
+var classnamesExports = classnames$1.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 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 }) })
+  ] });
+};
+export {
+  Tip as default
+};

package/dist/Tip/index.umd.cjs

@@ -0,0 +1,6 @@
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n(require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["react/jsx-runtime"],n):(e="undefined"!=typeof globalThis?globalThis:e||self).Tip=n(e.jsxRuntime)}(this,(function(e){"use strict";function n(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var t,o={exports:{}};
+/*!
+  	Copyright (c) 2018 Jed Watson.
+  	Licensed under the MIT License (MIT), see
+  	http://jedwatson.github.io/classnames
+  */t=o,function(){var e={}.hasOwnProperty;function n(){for(var t=[],o=0;o<arguments.length;o++){var i=arguments[o];if(i){var s=typeof i;if("string"===s||"number"===s)t.push(i);else if(Array.isArray(i)){if(i.length){var r=n.apply(null,i);r&&t.push(r)}}else if("object"===s){if(i.toString!==Object.prototype.toString&&!i.toString.toString().includes("[native code]")){t.push(i.toString());continue}for(var l in i)e.call(i,l)&&i[l]&&t.push(l)}}}return t.join(" ")}t.exports?(n.default=n,t.exports=n):window.classNames=n}();const i=n(o.exports),s=({name:n,size:t=24,color:o="currentColor",className:i="",style:s,onClick:r,type:l="yunying"})=>{const c={fontSize:"number"==typeof t?`${t}px`:t,color:o,...s},a=`iconfont-${l}`,u=`icon-${n}`;return e.jsx("i",{className:`wz-icon ${a} ${u} ${i}`,style:c,onClick:r})};return({content:n,className:t,visible:o=!0,onClose:r,action:l,marquee:c=!1})=>{if(!o)return null;const a="wz-tip",u=i(a,t,{[`${a}--marquee`]:c}),f=c?e.jsx("div",{className:`${a}-marquee-box`,children:e.jsx("span",{children:n})}):n;return e.jsxs("div",{className:u,children:[e.jsx("div",{className:`${a}-content`,children:f}),l&&e.jsx("div",{className:`${a}-action`,children:l}),r&&e.jsx("div",{className:`${a}-close`,onClick:r,children:e.jsx(s,{name:"close",size:16})})]})}}));

package/dist/Tip/style/index.css

@@ -0,0 +1 @@
+.wz-tip{color:#ff4d4f;background-color:#ff4d4f1f;align-items:center;padding:6px 12px;font-size:13px;display:flex}.wz-tip-content{flex:1}.wz-tip-close{cursor:pointer;margin-left:8px}.wz-tip-action{margin-left:8px}.wz-tip--marquee .wz-tip-content{white-space:nowrap;overflow:hidden}.wz-tip--marquee .wz-tip-marquee-box{padding-left:100%;animation:10s linear infinite marquee;display:inline-block}.wz-tip--marquee .wz-tip-marquee-box span{padding-right:1.5em}@keyframes marquee{to{transform:translate(-100%)}}

package/dist/Tip/style/index.js

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

package/dist/Tip/style.css

@@ -0,0 +1 @@
+.wz-tip{color:#ff4d4f;background-color:#ff4d4f1f;align-items:center;padding:6px 12px;font-size:13px;display:flex}.wz-tip-content{flex:1}.wz-tip-close{cursor:pointer;margin-left:8px}.wz-tip-action{margin-left:8px}.wz-tip--marquee .wz-tip-content{white-space:nowrap;overflow:hidden}.wz-tip--marquee .wz-tip-marquee-box{padding-left:100%;animation:10s linear infinite marquee;display:inline-block}.wz-tip--marquee .wz-tip-marquee-box span{padding-right:1.5em}@keyframes marquee{to{transform:translate(-100%)}}.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/Toast/index.js

@@ -0,0 +1,183 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createRoot } from "react-dom/client";
+import { useState, useEffect } from "react";
+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 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 })
+  ] }) });
+};
+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
+    }
+  );
+};
+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 };
+export {
+  Toast,
+  fail,
+  hide,
+  loading,
+  show,
+  success,
+  warn
+};

package/dist/Toast/index.umd.cjs

@@ -0,0 +1,6 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react/jsx-runtime"),require("react-dom/client"),require("react")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime","react-dom/client","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Toast={},e.jsxRuntime,e.client,e.React)}(this,(function(e,t,n,o){"use strict";function i(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var s,r={exports:{}};
+/*!
+  	Copyright (c) 2018 Jed Watson.
+  	Licensed under the MIT License (MIT), see
+  	http://jedwatson.github.io/classnames
+  */s=r,function(){var e={}.hasOwnProperty;function t(){for(var n=[],o=0;o<arguments.length;o++){var i=arguments[o];if(i){var s=typeof i;if("string"===s||"number"===s)n.push(i);else if(Array.isArray(i)){if(i.length){var r=t.apply(null,i);r&&n.push(r)}}else if("object"===s){if(i.toString!==Object.prototype.toString&&!i.toString.toString().includes("[native code]")){n.push(i.toString());continue}for(var l in i)e.call(i,l)&&i[l]&&n.push(l)}}}return n.join(" ")}s.exports?(t.default=t,s.exports=t):window.classNames=t}();const l=i(r.exports),c=({content:e,duration:n=2e3,icon:i,visible:s=!1,onClose:r})=>{const[c,a]=o.useState(s);o.useEffect((()=>{let e;return a(s),s&&n>0&&(e=setTimeout((()=>{a(!1),null==r||r()}),n)),()=>{clearTimeout(e)}}),[s,n,r]);const u=l("wz-toast",{"wz-toast-visible":c}),d=l("wz-toast-icon");return t.jsx("div",{className:u,children:t.jsxs("div",{className:"wz-toast-content",children:[i&&t.jsx("div",{className:d,children:i}),t.jsx("div",{className:"wz-toast-text",children:e})]})})},a=({name:e,size:n=24,color:o="currentColor",className:i="",style:s,onClick:r,type:l="yunying"})=>{const c={fontSize:"number"==typeof n?`${n}px`:n,color:o,...s},a=`iconfont-${l}`,u=`icon-${e}`;return t.jsx("i",{className:`wz-icon ${a} ${u} ${i}`,style:c,onClick:r})};let u=null,d=null;const f=()=>{u&&(u.unmount(),u=null),d&&d.parentNode&&(d.parentNode.removeChild(d),d=null)},p=e=>{d||(d=document.createElement("div"),document.body.appendChild(d),u=n.createRoot(d)),u.render(t.jsx(c,{...e}))},m=e=>{p({..."string"==typeof e?{content:e}:e,visible:!0,onClose:f})},v=(e,n)=>{p({content:e,duration:n,icon:t.jsx(a,{name:"check-round",size:37.14}),visible:!0,onClose:f})},h=(e,n)=>{p({content:e,duration:n,icon:t.jsx(a,{name:"close",size:37.14}),visible:!0,onClose:f})},x=(e,n)=>{p({content:e,duration:n,icon:t.jsx(a,{name:"loading",size:37.14}),visible:!0,onClose:f})},y=(e,n)=>{p({content:e,duration:n,icon:t.jsx(a,{name:"info",size:37.14}),visible:!0,onClose:f})},b=()=>{p({content:"",visible:!1}),f()},j={show:m,success:v,fail:h,loading:x,warn:y,hide:b};e.Toast=j,e.fail=h,e.hide=b,e.loading=x,e.show=m,e.success=v,e.warn=y,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})}));

package/dist/Toast/style/index.css

@@ -0,0 +1 @@
+.wz-toast{color:#fff;z-index:9999;opacity:0;pointer-events:none;background-color:#000000b3;border-radius:7.43px;flex-direction:column;justify-content:center;align-items:center;width:130px;height:130px;padding:10px 20px;transition:opacity .3s;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.wz-toast-visible{opacity:1;pointer-events:auto}.wz-toast-content{text-align:center}.wz-toast-icon{margin-bottom:8px}.wz-toast-icon-loading .wz-icon{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.wz-toast-text{font-size:14px}

package/dist/Toast/style/index.js

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

package/dist/Toast/style.css

@@ -0,0 +1 @@
+.wz-toast{color:#fff;z-index:9999;opacity:0;pointer-events:none;background-color:#000000b3;border-radius:7.43px;flex-direction:column;justify-content:center;align-items:center;width:130px;height:130px;padding:10px 20px;transition:opacity .3s;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.wz-toast-visible{opacity:1;pointer-events:auto}.wz-toast-content{text-align:center}.wz-toast-icon{margin-bottom:8px}.wz-toast-icon-loading .wz-icon{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.wz-toast-text{font-size:14px}.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/Tooltip/index.js

@@ -0,0 +1,172 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import React, { useState, useRef, useLayoutEffect } from "react";
+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 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()
+  ] });
+};
+export {
+  Tooltip as default
+};

package/dist/Tooltip/index.umd.cjs

@@ -0,0 +1,6 @@
+!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).Tooltip=t(e.jsxRuntime,e.React)}(this,(function(e,t){"use strict";function o(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var n,l={exports:{}};
+/*!
+  	Copyright (c) 2018 Jed Watson.
+  	Licensed under the MIT License (MIT), see
+  	http://jedwatson.github.io/classnames
+  */n=l,function(){var e={}.hasOwnProperty;function t(){for(var o=[],n=0;n<arguments.length;n++){var l=arguments[n];if(l){var i=typeof l;if("string"===i||"number"===i)o.push(l);else if(Array.isArray(l)){if(l.length){var r=t.apply(null,l);r&&o.push(r)}}else if("object"===i){if(l.toString!==Object.prototype.toString&&!l.toString.toString().includes("[native code]")){o.push(l.toString());continue}for(var s in l)e.call(l,s)&&l[s]&&o.push(s)}}}return o.join(" ")}n.exports?(t.default=t,n.exports=t):window.classNames=t}();const i=o(l.exports);return({content:o,children:n,className:l,style:r,color:s,textColor:c,trigger:a="click",visible:u,onVisibleChange:p,showMask:d=!1,action:f,closeIcon:b})=>{const[h,m]=t.useState(!1),[g,x]=t.useState({}),[w,y]=t.useState("bottom"),j=t.useRef(null),v=t.useRef(null),_=void 0!==u,z=_?u:h,k=e=>{_||m(e),null==p||p(e)};t.useLayoutEffect((()=>{if(z&&j.current&&v.current){const e=j.current,t=v.current,{width:o,height:n}=e.getBoundingClientRect(),{top:l,left:i,width:r,height:s}=t.getBoundingClientRect(),{innerWidth:c,innerHeight:a}=window,u=8;let p,d=i+r/2-o/2,f="bottom";d<u&&(d=u),d+o>c-u&&(d=c-o-u),p=l+s+u,p+n>a-u&&(f="top",p=l-n-u),p<u&&(f="bottom",p=l+s+u);const b=i+r/2-d;y(f),x({top:`${p}px`,left:`${d}px`,"--wz-tooltip-arrow-left":`${b}px`})}}),[z]);const C=e=>{e.stopPropagation(),k(!1)},N=i("wz-tooltip-bubble",`wz-tooltip-bubble--placement-${w}`,l),S={...r,...g,opacity:g.top?1:0,transition:"opacity 150ms ease-in","--wz-tooltip-bubble-bg":s,color:c},R={onClick:()=>{"click"===a&&k(!z)},ref:v};return e.jsxs(e.Fragment,{children:[t.cloneElement(n,R),(()=>{if(!z)return null;return e.jsxs(e.Fragment,{children:[d&&e.jsx("div",{className:"wz-tooltip-mask",onClick:C}),e.jsxs("div",{className:N,style:S,ref:j,children:[e.jsx("div",{className:"wz-tooltip-bubble__arrow"}),e.jsxs("div",{className:"wz-tooltip-bubble__inner",children:[e.jsx("div",{className:"wz-tooltip-bubble__body",children:o}),(()=>{if(!f)return null;const o=f.props.onClick;return e.jsx("div",{className:"wz-tooltip-bubble__action-slot",children:t.cloneElement(f,{onClick:e=>{null==o||o(e),k(!1)}})})})(),b?e.jsx("div",{className:"wz-tooltip-bubble__close-slot",children:t.cloneElement(b,{onClick:C})}):null]})]})]})})()]})}}));

package/dist/Tooltip/style/index.css

@@ -0,0 +1 @@
+.wz-tooltip-mask{z-index:1000;background-color:#0006;position:fixed;top:0;bottom:0;left:0;right:0}.wz-tooltip-bubble{z-index:1001;background:var(--wz-tooltip-bubble-bg,#fff);border-radius:5px;flex-direction:column;justify-content:center;align-items:center;height:30px;font-size:14px;font-weight:400;display:flex;position:fixed;box-shadow:0 0 10px #0000001a}.wz-tooltip-bubble__inner{align-items:center;padding:12px 16px;display:flex}.wz-tooltip-bubble__action-slot,.wz-tooltip-bubble__close-slot{align-items:center;display:flex}.wz-tooltip-bubble__action-slot{order:2;margin-left:auto;padding-left:12px}.wz-tooltip-bubble__close-slot{order:3;padding-left:8px}.wz-tooltip-bubble--placement-top .wz-tooltip-bubble__arrow{border-top-color:var(--wz-tooltip-bubble-bg,#fff);top:100%}.wz-tooltip-bubble--placement-bottom .wz-tooltip-bubble__arrow{border-bottom-color:var(--wz-tooltip-bubble-bg,#fff);bottom:100%}.wz-tooltip-bubble__arrow{left:var(--wz-tooltip-arrow-left,50%);border:8px solid #0000;width:0;height:0;position:absolute;transform:translate(-50%)}.wz-tooltip-bubble__close-icon{color:inherit;opacity:.7;order:3;width:16px;height:16px;margin-left:12px;font-size:16px;position:relative;top:auto;right:auto}.wz-tooltip-bubble__close-icon:hover{opacity:1}.wz-tooltip-bubble__content{flex-direction:column;width:100%;padding:16px;display:flex}.wz-tooltip-bubble__title{color:var(--wz-tooltip-bubble-text-color,#333);margin-bottom:8px;font-size:16px;font-weight:500}.wz-tooltip-bubble__body{color:inherit;flex:1;order:1;font-size:14px;line-height:1.5}

package/dist/Tooltip/style/index.js

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

package/dist/Tooltip/style.css

@@ -0,0 +1 @@
+.wz-tooltip-mask{z-index:1000;background-color:#0006;position:fixed;top:0;bottom:0;left:0;right:0}.wz-tooltip-bubble{z-index:1001;background:var(--wz-tooltip-bubble-bg,#fff);border-radius:5px;flex-direction:column;justify-content:center;align-items:center;height:30px;font-size:14px;font-weight:400;display:flex;position:fixed;box-shadow:0 0 10px #0000001a}.wz-tooltip-bubble__inner{align-items:center;padding:12px 16px;display:flex}.wz-tooltip-bubble__action-slot,.wz-tooltip-bubble__close-slot{align-items:center;display:flex}.wz-tooltip-bubble__action-slot{order:2;margin-left:auto;padding-left:12px}.wz-tooltip-bubble__close-slot{order:3;padding-left:8px}.wz-tooltip-bubble--placement-top .wz-tooltip-bubble__arrow{border-top-color:var(--wz-tooltip-bubble-bg,#fff);top:100%}.wz-tooltip-bubble--placement-bottom .wz-tooltip-bubble__arrow{border-bottom-color:var(--wz-tooltip-bubble-bg,#fff);bottom:100%}.wz-tooltip-bubble__arrow{left:var(--wz-tooltip-arrow-left,50%);border:8px solid #0000;width:0;height:0;position:absolute;transform:translate(-50%)}.wz-tooltip-bubble__close-icon{color:inherit;opacity:.7;order:3;width:16px;height:16px;margin-left:12px;font-size:16px;position:relative;top:auto;right:auto}.wz-tooltip-bubble__close-icon:hover{opacity:1}.wz-tooltip-bubble__content{flex-direction:column;width:100%;padding:16px;display:flex}.wz-tooltip-bubble__title{color:var(--wz-tooltip-bubble-text-color,#333);margin-bottom:8px;font-size:16px;font-weight:500}.wz-tooltip-bubble__body{color:inherit;flex:1;order:1;font-size:14px;line-height:1.5}