ono-react-element 0.0.0

package/dist/es/Input-wORRaL9-.js

@@ -0,0 +1,301 @@
+import { j as o } from "./dependencies-DWmdjl5u.js";
+import { useState as x, useRef as T, useEffect as P } from "react";
+import { b as Y } from "./hooks-Bj-aT2k8.js";
+const A = () => /* @__PURE__ */ o.jsx(
+  "svg",
+  {
+    className: "ono-input-icon",
+    viewBox: "64 64 896 896",
+    focusable: "false",
+    "data-icon": "close-circle",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    children: /* @__PURE__ */ o.jsx("path", { d: "M512 64c247.4 0 448 200.6 448 448S759.4 960 512 960 64 759.4 64 512 264.6 64 512 64zm127.98 274.82h-.04l-.08.06L512 466.75 384.14 338.88c-.04-.05-.06-.06-.08-.06a.12.12 0 00-.07 0c-.03 0-.05.01-.09.05l-45.02 45.02a.2.2 0 00-.05.09.12.12 0 000 .07v.02a.27.27 0 00.06.06L466.75 512 338.88 639.86c-.05.04-.06.06-.06.08a.12.12 0 000 .07c0 .03.01.05.05.09l45.02 45.02a.2.2 0 00.09.05.12.12 0 00.07 0c.02 0 .04-.01.08-.05L512 557.25l127.86 127.87c.04.04.06.05.08.05a.12.12 0 00.07 0c.03 0 .05-.01.09-.05l45.02-45.02a.2.2 0 00.05-.09.12.12 0 000-.07v-.02a.27.27 0 00-.05-.06L557.25 512l127.87-127.86c.04-.04.05-.06.05-.08a.12.12 0 000-.07c0-.03-.01-.05-.05-.09l-45.02-45.02a.2.2 0 00-.09-.05.12.12 0 00-.07 0z" })
+  }
+), $ = ({ open: e }) => /* @__PURE__ */ o.jsx(
+  "svg",
+  {
+    viewBox: "64 64 896 896",
+    focusable: "false",
+    "data-icon": e ? "eye" : "eye-invisible",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    className: "ono-input-icon",
+    children: e ? /* @__PURE__ */ o.jsx("path", { d: "M942.2 486.2C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 000 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3 7.7-16.2 7.7-35 0-51.5zM512 766c-161.3 0-279.4-81.8-362.7-254C232.6 339.8 350.7 258 512 258c161.3 0 279.4 81.8 362.7 254C791.5 684.2 673.4 766 512 766zm-4-430c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm0 288c-61.9 0-112-50.1-112-112s50.1-112 112-112 112 50.1 112 112-50.1 112-112 112z" }) : /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+      /* @__PURE__ */ o.jsx("path", { d: "M942.2 486.2Q889.47 375.11 816.7 305l-50.88 50.88C807.31 395.53 843.45 447.4 874.7 512 791.5 684.2 673.4 766 512 766q-72.67 0-133.87-22.38L323 798.75Q408 838 512 838q288.3 0 430.2-300.3a60.29 60.29 0 000-51.5zm-63.57-320.64L836 122.88a8 8 0 00-11.32 0L715.31 232.2Q624.86 186 512 186q-288.3 0-430.2 300.3a60.3 60.3 0 000 51.5q56.69 119.4 136.5 191.41L112.48 835a8 8 0 000 11.31L155.17 889a8 8 0 0011.31 0l712.15-712.12a8 8 0 000-11.32zM149.3 512C232.6 339.8 350.7 258 512 258c54.54 0 104.13 9.36 149.12 28.39l-70.3 70.3a176 176 0 00-238.13 238.13l-83.42 83.42C223.1 637.49 183.3 582.28 149.3 512zm246.7 0a112.11 112.11 0 01146.2-106.69L401.31 546.2A112 112 0 01396 512z" }),
+      /* @__PURE__ */ o.jsx("path", { d: "M508 624c-3.46 0-6.87-.16-10.25-.47l-52.82 52.82a176.09 176.09 0 00227.42-227.42l-52.82 52.82c.31 3.38.47 6.79.47 10.25a111.94 111.94 0 01-112 112z" })
+    ] })
+  }
+), _ = ({
+  id: e,
+  name: l,
+  max: a,
+  min: c,
+  maxLength: s,
+  minLength: i,
+  type: v = "text",
+  className: d,
+  defaultValue: I,
+  placeholder: S,
+  readonly: D,
+  autocomplete: F = "off",
+  autofocus: L,
+  form: j,
+  disabled: b,
+  clearable: M,
+  showPassword: V,
+  prepend: f,
+  append: u,
+  prefix: w,
+  suffix: y,
+  showCount: O,
+  border: R = "1px solid #5644b8",
+  boxShadow: N = "0 0 0 2px #7969d11a",
+  value: z = "",
+  onChange: m,
+  onFocus: g,
+  onBlur: n,
+  onClear: E
+}) => {
+  const [C, k] = x(z), [q, t] = x(!1), [r, h] = x(!1), H = T(null), B = M && !b && C, Q = V && !b, W = () => {
+    H.current && (H.current.style.setProperty("--ono-input-border", R), H.current.style.setProperty("--ono-input-box-shadow", N));
+  };
+  return P(() => {
+    W();
+  }, [H]), P(() => {
+    k(z);
+  }, [z]), /* @__PURE__ */ o.jsxs(
+    "div",
+    {
+      className: [
+        "ono-input",
+        "ono-input-border",
+        b ? "ono-input-is-disabled" : ""
+      ].filter(Boolean).join(" "),
+      children: [
+        f && /* @__PURE__ */ o.jsx("div", { className: "ono-prepend", children: f }),
+        /* @__PURE__ */ o.jsxs(
+          "div",
+          {
+            ref: H,
+            className: [
+              "ono-input-wrapper",
+              q ? "ono-input-is-focus" : "",
+              d
+            ].filter(Boolean).join(" "),
+            onMouseDown: (p) => {
+              p.target.tagName !== "INPUT" && p.preventDefault();
+            },
+            children: [
+              w && /* @__PURE__ */ o.jsx("span", { className: "ono-prefix", children: w }),
+              /* @__PURE__ */ o.jsx(
+                "input",
+                {
+                  id: e,
+                  max: a,
+                  min: c,
+                  name: l,
+                  maxLength: s,
+                  minLength: i,
+                  defaultValue: I,
+                  className: "ono-input-inner",
+                  type: V ? r ? "text" : "password" : v,
+                  placeholder: S,
+                  readOnly: D,
+                  autoComplete: F,
+                  autoFocus: L,
+                  form: j,
+                  disabled: b,
+                  onFocus: (p) => {
+                    g == null || g(p), t(!0);
+                  },
+                  onBlur: (p) => {
+                    n == null || n(p), t(!1);
+                  },
+                  value: C,
+                  onChange: (p) => {
+                    m == null || m(p), k(p.target.value);
+                  }
+                }
+              ),
+              (y || B || Q || O) && /* @__PURE__ */ o.jsxs("span", { className: "ono-suffix", children: [
+                y,
+                B && /* @__PURE__ */ o.jsx(
+                  "button",
+                  {
+                    className: "ono-clear-icon",
+                    onClick: () => {
+                      E == null || E(), k("");
+                    },
+                    children: /* @__PURE__ */ o.jsx(A, {})
+                  }
+                ),
+                Q && /* @__PURE__ */ o.jsx(
+                  "button",
+                  {
+                    className: "ono-eye-icon",
+                    onClick: () => h(!r),
+                    children: /* @__PURE__ */ o.jsx($, { open: r })
+                  }
+                ),
+                O && s && /* @__PURE__ */ o.jsxs("p", { className: "ono-count", children: [
+                  C.length,
+                  "/",
+                  s
+                ] })
+              ] })
+            ]
+          }
+        ),
+        u && /* @__PURE__ */ o.jsx("div", { className: "ono-append", children: u })
+      ]
+    }
+  );
+}, K = (e, l, a, c, s) => {
+  const i = e.parentNode;
+  e.style.resize = l ? "none" : a ? "vertical" : "none", i.style.setProperty("--ono-input-border", c), i.style.setProperty("--ono-input-box-shadow", s), i.style.setProperty("--ono-input-height", "auto");
+}, U = (e, l) => {
+  const { minRows: a = 2, maxRows: c } = typeof l == "object" ? l : {}, s = document.createElement("div");
+  s.style.position = "absolute", s.style.visibility = "hidden", s.style.whiteSpace = "pre-wrap", s.style.wordWrap = "break-word", s.style.width = `${e.clientWidth}px`, s.style.font = getComputedStyle(e).font, s.style.padding = getComputedStyle(e).padding, s.style.border = getComputedStyle(e).border, s.style.boxSizing = "border-box", document.body.appendChild(s);
+  const i = 34, v = a * i;
+  let d = v;
+  if (e.value) {
+    s.textContent = e.value;
+    const I = s.offsetHeight;
+    d = Math.max(v, I), c && d > c * i ? (d = c * i, e.style.overflowY = "auto") : e.style.overflowY = "hidden";
+  } else
+    e.style.overflowY = "hidden";
+  return e.style.height = `${d}px`, e.style.resize = l ? "none" : "vertical", document.body.removeChild(s), {
+    autoRows: Math.floor(d / i),
+    padding: 0,
+    // 不再需要精确计算这些值
+    lineHeight: 0,
+    borderWidth: 0
+  };
+}, G = (e) => {
+  const { value: l, selectionStart: a, selectionEnd: c } = e, s = l.substring(0, a) + l.substring(c);
+  return e.value = s, e.setSelectionRange(a, a), s;
+}, ee = ({
+  id: e,
+  name: l,
+  rows: a,
+  maxLength: c,
+  minLength: s,
+  className: i,
+  placeholder: v,
+  readonly: d,
+  resize: I = !0,
+  autocomplete: S = "off",
+  autofocus: D,
+  form: F,
+  disabled: L,
+  autoSize: j,
+  showCount: b,
+  border: M = "1px solid #5644b8",
+  boxShadow: V = "0 0 0 2px #7969d11a",
+  value: f = "",
+  onChange: u
+}) => {
+  const [w, y] = x(f), [O, R] = x(!1), [N, z] = x([f]), [m, g] = x(0), n = T(null), E = () => {
+    if (!n.current) return;
+    const t = n.current;
+    K(t, j || !1, I, M, V), j && U(t, j);
+  }, C = (t) => {
+    const r = N.slice(0, m + 1);
+    r.push(t), z(r), g(r.length - 1);
+  }, k = () => {
+    if (m > 0 && n.current) {
+      const t = m - 1, r = N[t];
+      if (n.current.value = r, y(r), g(t), u) {
+        const h = {
+          target: n.current
+        };
+        u(h);
+      }
+    }
+  };
+  return [
+    {
+      key: "CommandOrControl+z",
+      handler: (t) => {
+        document.activeElement === n.current && (t.preventDefault(), k());
+      },
+      deps: [N]
+    },
+    {
+      key: "CommandOrControl+d",
+      handler: (t) => {
+        if (n.current && document.activeElement === n.current) {
+          t.preventDefault();
+          const r = G(n.current);
+          if (y(r), C(r), u) {
+            const h = {
+              target: n.current
+            };
+            u(h);
+          }
+        }
+      },
+      deps: [N]
+    }
+  ].forEach(
+    ({ key: t, handler: r, deps: h }) => Y(t, r, {
+      target: n.current,
+      deps: h
+    })
+  ), P(() => {
+    y(f);
+  }, [f]), P(() => {
+    E();
+  }, [n, j, w]), /* @__PURE__ */ o.jsxs(
+    "div",
+    {
+      className: ["ono-textarea", L ? "ono-input-is-disabled" : ""].filter(Boolean).join(" "),
+      children: [
+        /* @__PURE__ */ o.jsx(
+          "div",
+          {
+            className: [
+              "ono-textarea-wrapper",
+              O ? M === "none" ? "" : "ono-input-is-focus" : "",
+              i
+            ].filter(Boolean).join(" "),
+            onClick: () => {
+              var t;
+              return (t = n.current) == null ? void 0 : t.focus();
+            },
+            children: /* @__PURE__ */ o.jsx(
+              "textarea",
+              {
+                ref: n,
+                className: "ono-textarea-inner",
+                id: e,
+                rows: a,
+                name: l,
+                maxLength: c,
+                minLength: s,
+                placeholder: v,
+                readOnly: d,
+                autoComplete: S,
+                autoFocus: D,
+                form: F,
+                disabled: L,
+                onFocus: () => R(!0),
+                onBlur: () => R(!1),
+                value: w,
+                onChange: (t) => {
+                  y(t.target.value), C(t.target.value), u == null || u(t);
+                }
+              }
+            )
+          }
+        ),
+        b && c && /* @__PURE__ */ o.jsx("p", { className: "ono-count-bar", onClick: (t) => t.stopPropagation(), children: w.length + "/" + c })
+      ]
+    }
+  );
+};
+export {
+  _ as O,
+  ee as a
+};

package/dist/es/List-B9mP7VjN.js

@@ -0,0 +1,35 @@
+import { useState as y, useEffect as D } from "react";
+const w = ({
+  list: n,
+  children: u,
+  fallback: i,
+  deps: f = [],
+  insertBetweenDom: p
+}) => {
+  const [a, c] = y([]), t = (e) => e.map(u).filter((s) => s), o = (e, s) => s ? e.reduce((h, L, m) => (h.push(L), m < e.length - 1 && h.push(s(m)), h), []) : e, r = async () => {
+    if (!n) return;
+    c(i);
+    const e = typeof n == "function" ? await n() : n;
+    c(
+      e.length > 0 ? o(t(e), p) : i
+    );
+  };
+  return D(() => {
+    r();
+  }, [...f]), a;
+}, B = ({
+  list: n,
+  children: u,
+  fallback: i,
+  insertBetweenDom: f
+}) => {
+  const p = (t) => t.map(u).filter(Boolean), a = (t, o) => o ? t.reduce((r, e, s) => (r.push(e), s < t.length - 1 && r.push(o(s)), r), []) : t;
+  return (() => {
+    const t = typeof n == "function" ? n() : n;
+    return t.length > 0 ? a(p(t), f) : i;
+  })();
+};
+export {
+  w as A,
+  B as L
+};

package/dist/es/MenuButton-CuOdVlg0.js

@@ -0,0 +1,62 @@
+import { j as m } from "./dependencies-DWmdjl5u.js";
+import { useState as b, useEffect as g } from "react";
+const S = ({
+  active: l,
+  onchange: r,
+  w: t = "40px",
+  duration: d = 400,
+  clr: c = "#f5f5f5",
+  bgc: h = "#342A7C"
+}) => {
+  const [s, u] = b(!1), e = (a, i) => {
+    let f;
+    const o = a.split(""), x = o.length;
+    return o[x - 1] === "x" && (f = `${Number(o.slice(0, -2).join("")) * i}px`), f;
+  }, n = {
+    width: e(t, 0.6),
+    height: e(t, 0.06),
+    left: s ? e(t, 0.11) : e(t, 0.2),
+    borderRadius: e(t, 1),
+    background: c,
+    transition: `all ${d / 1e3}s`
+  }, p = [
+    {
+      ...n,
+      width: s ? e(t, 0.8) : e(t, 0.5),
+      height: s ? e(t, 0.05) : e(t, 0.06),
+      transform: s ? "translateY(0) rotate(45deg)" : `translateY(-${e(t, 0.22)})`
+    },
+    {
+      ...n,
+      width: s ? e(t, 0.8) : e(t, 0.3),
+      height: s ? e(t, 0.05) : e(t, 0.06),
+      transform: s ? "translateY(0) rotate(315deg)" : `translateY(${e(t, 0.22)})`
+    },
+    {
+      ...n,
+      left: "auto",
+      transform: s ? `translateX(${e(t, 1.1)})` : "translateX(0)"
+    }
+  ];
+  return g(() => {
+    u(!!l);
+  }, [l]), /* @__PURE__ */ m.jsx(
+    "button",
+    {
+      className: "ono-menu-button",
+      style: {
+        width: t,
+        height: t,
+        background: h,
+        borderRadius: e(t, 0.2)
+      },
+      onClick: () => requestAnimationFrame(() => {
+        r == null || r(!s), u(!s);
+      }),
+      children: p.map((a, i) => /* @__PURE__ */ m.jsx("span", { style: { ...a } }, i))
+    }
+  );
+};
+export {
+  S as M
+};

package/dist/es/Message-BMimz-k2.js

@@ -0,0 +1,219 @@
+import { j as t } from "./dependencies-DWmdjl5u.js";
+import { useState as m, useRef as v, useMemo as J, useCallback as Q, useEffect as j } from "react";
+import { c, g as U, a as W, b as X, d as B, e as Y } from "./utils-ziqvBIOU.js";
+const Z = {
+  info: { light: "#1677ff", dark: "#1677ff" },
+  success: { light: "#52c41a", dark: "#49aa19" },
+  error: { light: "#ff4d4f", dark: "#a61d24" },
+  warning: { light: "#faad14", dark: "#d89614" },
+  loading: { light: "#9254de", dark: "#f5f5f5" }
+}, d = (e, a) => Z[e][a], k = (e) => {
+  switch (e) {
+    case "success":
+      return /* @__PURE__ */ t.jsx(
+        "svg",
+        {
+          className: "ono-type-icon",
+          viewBox: "0 0 1024 1024",
+          focusable: "false",
+          "data-icon": "check-circle",
+          fill: d(e, "light"),
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ t.jsx("path", { d: "M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z" })
+        }
+      );
+    case "error":
+      return /* @__PURE__ */ t.jsx(
+        "svg",
+        {
+          className: "ono-type-icon",
+          viewBox: "0 0 1024 1024",
+          focusable: "false",
+          "data-icon": "close-circle",
+          fill: d(e, "light"),
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ t.jsx("path", { d: "M512 64c247.4 0 448 200.6 448 448S759.4 960 512 960 64 759.4 64 512 264.6 64 512 64zm127.98 274.82h-.04l-.08.06L512 466.75 384.14 338.88c-.04-.05-.06-.06-.08-.06a.12.12 0 00-.07 0c-.03 0-.05.01-.09.05l-45.02 45.02a.2.2 0 00-.05.09.12.12 0 000 .07v.02a.27.27 0 00.06.06L466.75 512 338.88 639.86c-.05.04-.06.06-.06.08a.12.12 0 000 .07c0 .03.01.05.05.09l45.02 45.02a.2.2 0 00.09.05.12.12 0 00.07 0c.02 0 .04-.01.08-.05L512 557.25l127.86 127.87c.04.04.06.05.08.05a.12.12 0 00.07 0c.03 0 .05-.01.09-.05l45.02-45.02a.2.2 0 00.05-.09.12.12 0 000-.07v-.02a.27.27 0 00-.05-.06L557.25 512l127.87-127.86c.04-.04.05-.06.05-.08a.12.12 0 000-.07c0-.03-.01-.05-.05-.09l-45.02-45.02a.2.2 0 00-.09-.05.12.12 0 00-.07 0z" })
+        }
+      );
+    case "loading":
+      return /* @__PURE__ */ t.jsx(
+        "svg",
+        {
+          className: ["ono-info-icon", "ono-loading"].join(" "),
+          viewBox: "0 0 1024 1024",
+          focusable: "false",
+          "data-icon": "loading",
+          fill: d(e, "light"),
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ t.jsx("path", { d: "M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z" })
+        }
+      );
+    default:
+      return /* @__PURE__ */ t.jsx(
+        "svg",
+        {
+          className: "ono-info-icon",
+          viewBox: "64 64 896 896",
+          focusable: "false",
+          "data-icon": "exclamation-circle",
+          fill: d(e, "light"),
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ t.jsx("path", { d: "M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 010-96 48.01 48.01 0 010 96z" })
+        }
+      );
+  }
+}, P = ({ handleDestroy: e }) => /* @__PURE__ */ t.jsx("button", { onClick: e, children: /* @__PURE__ */ t.jsx(
+  "svg",
+  {
+    className: "ono-clear-icon",
+    viewBox: "64 64 896 896",
+    focusable: "false",
+    "data-icon": "close-circle",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    children: /* @__PURE__ */ t.jsx("path", { d: "M512 64c247.4 0 448 200.6 448 448S759.4 960 512 960 64 759.4 64 512 264.6 64 512 64zm127.98 274.82h-.04l-.08.06L512 466.75 384.14 338.88c-.04-.05-.06-.06-.08-.06a.12.12 0 00-.07 0c-.03 0-.05.01-.09.05l-45.02 45.02a.2.2 0 00-.05.09.12.12 0 000 .07v.02a.27.27 0 00.06.06L466.75 512 338.88 639.86c-.05.04-.06.06-.06.08a.12.12 0 000 .07c0 .03.01.05.05.09l45.02 45.02a.2.2 0 00.09.05.12.12 0 00.07 0c.02 0 .04-.01.08-.05L512 557.25l127.86 127.87c.04.04.06.05.08.05a.12.12 0 00.07 0c.03 0 .05-.01.09-.05l45.02-45.02a.2.2 0 00.05-.09.12.12 0 000-.07v-.02a.27.27 0 00-.05-.06L557.25 512l127.87-127.86c.04-.04.05-.06.05-.08a.12.12 0 000-.07c0-.03-.01-.05-.05-.09l-45.02-45.02a.2.2 0 00-.09-.05.12.12 0 00-.07 0z" })
+  }
+) }), i = ({
+  id: e,
+  instancesKey: a,
+  duration: z = 3e3,
+  speed: u = 300,
+  offset: M = 20,
+  message: T,
+  type: b,
+  plain: O = !0,
+  showClose: S = !1,
+  zIndex: I,
+  onClose: N = () => {
+  },
+  destroy: $
+}) => {
+  const [, R] = m(!1), [h, E] = m(0), [f, F] = m(U(e)), [s, H] = m({ duration: z, speed: u, message: T, type: b, showClose: S, onClose: N }), K = (n) => H((r) => ({ ...r, ...n })), g = v(null), p = v(null), o = v(null), C = f + h, q = J(
+    () => ({
+      transform: `translate(-50%, ${f}px)`,
+      transition: `transform ${u}ms ease-in-out`,
+      zIndex: I
+    }),
+    [f, u]
+  ), x = () => {
+    o.current && (o.current.classList.remove("ono-message-enter"), o.current.classList.add("ono-message-leave"), o.current.style.transform = `translate(-50%, ${B(e) - h}px)`, Y(e), setTimeout(() => $(s.onClose), u));
+  }, y = (n, r, G) => {
+    n !== "loading" && (g.current = setTimeout(x, r - G));
+  }, A = () => {
+    g.current && (clearTimeout(g.current), g.current = null);
+  }, D = () => {
+    if (!o.current) return;
+    const { height: n } = o.current.getBoundingClientRect();
+    o.current.style.setProperty(
+      "--speed",
+      `${s.speed}ms`
+    ), E(n);
+  }, L = () => {
+    const n = B(e);
+    R((r) => (r && F(n + M), !0)), requestAnimationFrame(L);
+  }, V = () => [
+    "ono-message",
+    `ono-message-${s.type}`,
+    "ono-message-enter",
+    O ? "" : "ono-message-color"
+  ].filter(Boolean).join(" "), w = Q(() => {
+    if (s.type === "loading") {
+      if (p.current) return;
+      p.current = setTimeout(() => {
+        p.current = null;
+        const n = W(
+          a || ""
+        );
+        n && (K({ ...n }), y(
+          s.type,
+          n.duration || s.duration,
+          n.speed || s.speed
+        ), w());
+      }, 100);
+    }
+  }, [s]);
+  return j(() => {
+    y(
+      s.type,
+      s.duration,
+      s.speed
+    ), L(), w();
+  }, [s.type, s.duration, s.speed]), j(() => {
+    D();
+  }, [o]), j(() => {
+    X(e, {
+      topOffset: f,
+      height: h,
+      bottomOffset: C
+    });
+  }, [C]), /* @__PURE__ */ t.jsx(
+    "div",
+    {
+      ref: o,
+      className: V(),
+      style: q,
+      onMouseEnter: A,
+      onMouseLeave: () => y(
+        s.type,
+        s.duration,
+        s.speed
+      ),
+      children: typeof s.message == "function" ? s.message(
+        k(s.type),
+        s.showClose && /* @__PURE__ */ t.jsx(P, { handleDestroy: x })
+      ) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+        k(s.type),
+        /* @__PURE__ */ t.jsx("div", { children: s.message }),
+        s.showClose && /* @__PURE__ */ t.jsx(P, { handleDestroy: x })
+      ] })
+    }
+  );
+}, l = (e) => {
+  if (typeof e == "string")
+    return {
+      message: e
+    };
+  {
+    const a = { ...e, instancesKey: e.key };
+    return delete a.key, { ...a };
+  }
+}, t0 = {
+  info: (e) => {
+    c(
+      i,
+      { ...l(e), type: "info" },
+      "ono-message"
+    );
+  },
+  success: (e) => {
+    c(
+      i,
+      { ...l(e), type: "success" },
+      "ono-message"
+    );
+  },
+  warning: (e) => {
+    c(
+      i,
+      { ...l(e), type: "warning" },
+      "ono-message"
+    );
+  },
+  error: (e) => {
+    c(
+      i,
+      { ...l(e), type: "error" },
+      "ono-message"
+    );
+  },
+  loading: (e) => {
+    c(
+      i,
+      { ...l(e), type: "loading" },
+      "ono-message"
+    );
+  }
+};
+export {
+  t0 as m
+};