ono-react-element 0.0.11 → 0.0.12

package/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 ONO
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/es/{AutoSliderList-Dy-otnYu.js → AutoSliderList-DCpCHe1X.js}

@@ -1,16 +1,16 @@
 import { j as t } from "./dependencies-CbQbPZZ-.js";
 import { p as e } from "./utils-BxXROOPY.js";
 import { useState as i, useRef as o, useMemo as r, useEffect as n, cloneElement as s } from "react";
-import { u as l } from "./hooks-Dew3_cmY.js";
+import { useGetElementSize as l } from "./index.js";
 var a = ((t2) => (t2.Horizontal = "Horizontal", t2.Vertical = "Vertical", t2))(a || {});
-const c = ({ list: c2, style: d, disable: f, children: u, sliderBox: m, className: p, sliderStyle: h, duration: x = 300, sliderClassName: w, currentIndex: y = 0, direction: j = a.Horizontal, sliderTransitionTimingFunction: g = "ease-in-out" }) => {
-  const [z, H] = i(false), [T, $] = i(0), [v, A] = i({ t: 0, l: 0 }), [C, N] = i({ w: 0, h: 0 }), b = o(null), k = o(null), B = r(() => ["width", "height", "transform"].map((t2) => `${t2} ${x / 1e3}s ${g}`).join(","), [j, x, g]), D = r(() => ({ width: C.w, height: C.h, transition: z ? B : "initial", transform: `translate(${v.l}px, ${v.t}px)` }), [C, v]), { w: I, h: L } = l();
+const c = ({ list: c2, style: d, disable: f, children: m, sliderBox: u, className: p, sliderStyle: h, duration: x = 300, sliderClassName: w, currentIndex: y = 0, direction: j = a.Horizontal, sliderTransitionTimingFunction: g = "ease-in-out" }) => {
+  const [z, H] = i(false), [T, $] = i(0), [v, A] = i({ t: 0, l: 0 }), [C, N] = i({ w: 0, h: 0 }), b = o(null), B = o(null), k = r(() => ["width", "height", "transform"].map((t2) => `${t2} ${x / 1e3}s ${g}`).join(","), [j, x, g]), D = r(() => ({ width: C.w, height: C.h, transition: z ? k : "initial", transform: `translate(${v.l}px, ${v.t}px)` }), [C, v]), { w: I, h: L } = l();
   return n(() => {
     $(y);
   }, [y]), n(() => {
     (() => {
       if ("number" != typeof T) return;
-      if (!b.current || !k.current) return;
+      if (!b.current || !B.current) return;
       const t2 = Array.from(b.current.children).slice(1);
       t2.forEach((t3) => {
         t3.style.position = "relative", t3.style.cursor = f ? "not-allowed" : "pointer", t3.style.zIndex = "1";
@@ -18,9 +18,9 @@ const c = ({ list: c2, style: d, disable: f, children: u, sliderBox: m, classNam
       const i2 = window.getComputedStyle(b.current), o2 = { t: "Horizontal" === j ? e(i2.paddingTop) : t2[T].offsetTop, l: "Horizontal" === j ? t2[T].offsetLeft : e(i2.paddingLeft) };
       A(o2), N({ w: t2[T].offsetWidth, h: t2[T].offsetHeight }), setTimeout(() => H(true), x);
     })();
-  }, [T, I, L, f]), t.jsxs("ul", { ref: b, className: ["ono-auto-slider-list-container", p, f ? "ono-auto-slider-list-is-disable" : ""].filter(Boolean).join(" "), style: { flexDirection: "Horizontal" === j ? "row" : "column", ...d }, children: [t.jsx("li", { ref: k, className: ["ono-auto-slider-list-slider", w].filter(Boolean).join(" "), style: { ...h, ...D }, children: m }), c2.map((t2, e2) => s(u({ item: t2, index: e2, isActive: e2 === T }), { onClick: (i2) => {
+  }, [T, I, L, f]), t.jsxs("ul", { ref: b, className: ["ono-auto-slider-list-container", p, f ? "ono-auto-slider-list-is-disable" : ""].filter(Boolean).join(" "), style: { flexDirection: "Horizontal" === j ? "row" : "column", ...d }, children: [t.jsx("li", { ref: B, className: ["ono-auto-slider-list-slider", w].filter(Boolean).join(" "), style: { ...h, ...D }, children: u }), c2.map((t2, e2) => s(m({ item: t2, index: e2, isActive: e2 === T }), { onClick: (i2) => {
     if (f) return;
-    const o2 = u({ item: t2, index: e2, isActive: e2 === T }).props.onClick;
+    const o2 = m({ item: t2, index: e2, isActive: e2 === T }).props.onClick;
     o2 && o2(i2), $(e2);
   } }))] });
 };

package/dist/es/InjunctiveBox-DsntB_UW.js

@@ -0,0 +1,11 @@
+import { j as e, R as o } from "./dependencies-CbQbPZZ-.js";
+import { useEventListener as n } from "./index.js";
+let s, l = null;
+const t = ({ className: o2, content: s2, style: t2, onClick: u2, onDoubleClick: i2, onContextMenu: c, onMouseDown: r, onMouseUp: M, onMouseEnter: a, onMouseLeave: d, onMouseMove: m, isClickBoxToClose: p }) => (n("click", () => {
+  p && l && (l.remove(), l = null);
+}), e.jsx("div", { className: o2, style: t2, onClick: u2, onDoubleClick: i2, onContextMenu: c, onMouseDown: r, onMouseUp: M, onMouseEnter: a, onMouseLeave: d, onMouseMove: m, children: "function" == typeof s2 ? s2((e2) => {
+  l && (l.remove(), l = null, e2 && e2());
+}) : s2 })), u = (o2) => (i(o2.isSingle || false).render(e.jsx(t, { ...o2 })), l), i = (e2) => (e2 && l && s || (l = document.createElement("div"), document.body.appendChild(l), s = o.createRoot(l)), s);
+export {
+  u as i
+};

package/dist/es/{Input-Z3uL5-nj.js → Input-CYA8Q8B5.js}

@@ -1,15 +1,15 @@
 import { j as e } from "./dependencies-CbQbPZZ-.js";
 import { useState as o, useRef as n, useEffect as t } from "react";
-import { b as a } from "./hooks-Dew3_cmY.js";
-const s = () => e.jsx("svg", { className: "ono-input-icon", viewBox: "64 64 896 896", focusable: "false", "data-icon": "close-circle", fill: "currentColor", "aria-hidden": "true", children: e.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" }) }), r = ({ open: o2 }) => e.jsx("svg", { viewBox: "64 64 896 896", focusable: "false", "data-icon": o2 ? "eye" : "eye-invisible", fill: "currentColor", "aria-hidden": "true", className: "ono-input-icon", children: o2 ? e.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" }) : e.jsxs(e.Fragment, { children: [e.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" }), e.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" })] }) }), l = ({ id: a2, name: l2, max: i2, min: c, maxLength: d, minLength: u, type: p = "text", className: m, defaultValue: h, placeholder: x, readonly: f, autocomplete: y = "off", autofocus: g, form: b, disabled: v, clearable: C, showPassword: j, prepend: w, append: N, prefix: L, suffix: z, showCount: S, border: k = "1px solid #5644b8", boxShadow: B = "0 0 0 2px #7969d11a", value: M = "", onChange: P, onFocus: F, onBlur: E, onClear: O }) => {
-  const [q, D] = o(M), [Q, R] = o(false), [Y, V] = o(false), W = n(null), $ = C && !v && q, A = j && !v;
+import { useKeyPress as a } from "./index.js";
+const r = () => e.jsx("svg", { className: "ono-input-icon", viewBox: "64 64 896 896", focusable: "false", "data-icon": "close-circle", fill: "currentColor", "aria-hidden": "true", children: e.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" }) }), s = ({ open: o2 }) => e.jsx("svg", { viewBox: "64 64 896 896", focusable: "false", "data-icon": o2 ? "eye" : "eye-invisible", fill: "currentColor", "aria-hidden": "true", className: "ono-input-icon", children: o2 ? e.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" }) : e.jsxs(e.Fragment, { children: [e.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" }), e.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" })] }) }), l = ({ id: a2, name: l2, max: i2, min: c, maxLength: d, minLength: u, type: p = "text", className: m, defaultValue: h, placeholder: x, readonly: f, autocomplete: y = "off", autofocus: g, form: v, disabled: b, clearable: C, showPassword: j, prepend: w, append: N, prefix: L, suffix: z, showCount: S, border: B = "1px solid #5644b8", boxShadow: M = "0 0 0 2px #7969d11a", value: k = "", onChange: P, onFocus: F, onBlur: E, onClear: O }) => {
+  const [q, D] = o(k), [Q, R] = o(false), [Y, V] = o(false), W = n(null), $ = C && !b && q, A = j && !b;
   return t(() => {
-    W.current && (W.current.style.setProperty("--ono-input-border", k), W.current.style.setProperty("--ono-input-box-shadow", B));
+    W.current && (W.current.style.setProperty("--ono-input-border", B), W.current.style.setProperty("--ono-input-box-shadow", M));
   }, [W]), t(() => {
-    D(M);
-  }, [M]), e.jsxs("div", { className: ["ono-input", "ono-input-border", v ? "ono-input-is-disabled" : ""].filter(Boolean).join(" "), children: [w && e.jsx("div", { className: "ono-prepend", children: w }), e.jsxs("div", { ref: W, className: ["ono-input-wrapper", Q ? "ono-input-is-focus" : "", m].filter(Boolean).join(" "), onMouseDown: (e2) => {
+    D(k);
+  }, [k]), e.jsxs("div", { className: ["ono-input", "ono-input-border", b ? "ono-input-is-disabled" : ""].filter(Boolean).join(" "), children: [w && e.jsx("div", { className: "ono-prepend", children: w }), e.jsxs("div", { ref: W, className: ["ono-input-wrapper", Q ? "ono-input-is-focus" : "", m].filter(Boolean).join(" "), onMouseDown: (e2) => {
     "INPUT" !== e2.target.tagName && e2.preventDefault();
-  }, children: [L && e.jsx("span", { className: "ono-prefix", children: L }), e.jsx("input", { id: a2, max: i2, min: c, name: l2, maxLength: d, minLength: u, defaultValue: h, className: "ono-input-inner", type: j ? Y ? "text" : "password" : p, placeholder: x, readOnly: f, autoComplete: y, autoFocus: g, form: b, disabled: v, onFocus: (e2) => {
+  }, children: [L && e.jsx("span", { className: "ono-prefix", children: L }), e.jsx("input", { id: a2, max: i2, min: c, name: l2, maxLength: d, minLength: u, defaultValue: h, className: "ono-input-inner", type: j ? Y ? "text" : "password" : p, placeholder: x, readOnly: f, autoComplete: y, autoFocus: g, form: v, disabled: b, onFocus: (e2) => {
     F == null ? void 0 : F(e2), R(true);
   }, onBlur: (e2) => {
     E == null ? void 0 : E(e2), R(false);
@@ -17,22 +17,22 @@ const s = () => e.jsx("svg", { className: "ono-input-icon", viewBox: "64 64 896
     P == null ? void 0 : P(e2), D(e2.target.value);
   } }), (z || $ || A || S) && e.jsxs("span", { className: "ono-suffix", children: [z, $ && e.jsx("button", { className: "ono-clear-icon", onClick: () => {
     O == null ? void 0 : O(), D("");
-  }, children: e.jsx(s, {}) }), A && e.jsx("button", { className: "ono-eye-icon", onClick: () => V(!Y), children: e.jsx(r, { open: Y }) }), S && d && e.jsxs("p", { className: "ono-count", children: [q.length, "/", d] })] })] }), N && e.jsx("div", { className: "ono-append", children: N })] });
-}, i = ({ id: s2, name: r2, rows: l2, maxLength: i2, minLength: c, className: d, placeholder: u, readonly: p, resize: m = true, autocomplete: h = "off", autofocus: x, form: f, disabled: y, autoSize: g, showCount: b, border: v = "1px solid #5644b8", boxShadow: C = "0 0 0 2px #7969d11a", value: j = "", onChange: w }) => {
-  const [N, L] = o(j), [z, S] = o(false), [k, B] = o([j]), [M, P] = o(0), F = n(null), E = (e2) => {
-    const o2 = k.slice(0, M + 1);
-    o2.push(e2), B(o2), P(o2.length - 1);
+  }, children: e.jsx(r, {}) }), A && e.jsx("button", { className: "ono-eye-icon", onClick: () => V(!Y), children: e.jsx(s, { open: Y }) }), S && d && e.jsxs("p", { className: "ono-count", children: [q.length, "/", d] })] })] }), N && e.jsx("div", { className: "ono-append", children: N })] });
+}, i = ({ id: r2, name: s2, rows: l2, maxLength: i2, minLength: c, className: d, placeholder: u, readonly: p, resize: m = true, autocomplete: h = "off", autofocus: x, form: f, disabled: y, autoSize: g, showCount: v, border: b = "1px solid #5644b8", boxShadow: C = "0 0 0 2px #7969d11a", value: j = "", onChange: w }) => {
+  const [N, L] = o(j), [z, S] = o(false), [B, M] = o([j]), [k, P] = o(0), F = n(null), E = (e2) => {
+    const o2 = B.slice(0, k + 1);
+    o2.push(e2), M(o2), P(o2.length - 1);
   }, O = [{ key: "CommandOrControl+z", handler: (e2) => {
     document.activeElement === F.current && (e2.preventDefault(), (() => {
-      if (M > 0 && F.current) {
-        const e3 = M - 1, o2 = k[e3];
+      if (k > 0 && F.current) {
+        const e3 = k - 1, o2 = B[e3];
         if (F.current.value = o2, L(o2), P(e3), w) {
           const e4 = { target: F.current };
           w(e4);
         }
       }
     })());
-  }, deps: [k] }, { key: "CommandOrControl+d", handler: (e2) => {
+  }, deps: [B] }, { key: "CommandOrControl+d", handler: (e2) => {
     if (F.current && document.activeElement === F.current) {
       e2.preventDefault();
       const o2 = ((e3) => {
@@ -44,7 +44,7 @@ const s = () => e.jsx("svg", { className: "ono-input-icon", viewBox: "64 64 896
         w(e3);
       }
     }
-  }, deps: [k] }];
+  }, deps: [B] }];
   return O.forEach(({ key: e2, handler: o2, deps: n2 }) => a(e2, o2, { target: F.current, deps: n2 })), t(() => {
     L(j);
   }, [j]), t(() => {
@@ -52,27 +52,27 @@ const s = () => e.jsx("svg", { className: "ono-input-icon", viewBox: "64 64 896
       if (!F.current) return;
       const e2 = F.current;
       ((e3, o2, n2, t2, a2) => {
-        const s3 = e3.parentNode;
-        e3.style.resize = o2 ? "none" : n2 ? "vertical" : "none", s3.style.setProperty("--ono-input-border", t2), s3.style.setProperty("--ono-input-box-shadow", a2), s3.style.setProperty("--ono-input-height", "auto");
-      })(e2, g || false, m, v, C), g && ((e3, o2) => {
+        const r3 = e3.parentNode;
+        e3.style.resize = o2 ? "none" : n2 ? "vertical" : "none", r3.style.setProperty("--ono-input-border", t2), r3.style.setProperty("--ono-input-box-shadow", a2), r3.style.setProperty("--ono-input-height", "auto");
+      })(e2, g || false, m, b, C), g && ((e3, o2) => {
         const { minRows: n2 = 2, maxRows: t2 } = "object" == typeof o2 ? o2 : {}, a2 = document.createElement("div");
         a2.style.position = "absolute", a2.style.visibility = "hidden", a2.style.whiteSpace = "pre-wrap", a2.style.wordWrap = "break-word", a2.style.width = `${e3.clientWidth}px`, a2.style.font = getComputedStyle(e3).font, a2.style.padding = getComputedStyle(e3).padding, a2.style.border = getComputedStyle(e3).border, a2.style.boxSizing = "border-box", document.body.appendChild(a2);
-        const s3 = 34 * n2;
-        let r3 = s3;
+        const r3 = 34 * n2;
+        let s3 = r3;
         if (e3.value) {
           a2.textContent = e3.value;
           const o3 = a2.offsetHeight;
-          r3 = Math.max(s3, o3), t2 && r3 > 34 * t2 ? (r3 = 34 * t2, e3.style.overflowY = "auto") : e3.style.overflowY = "hidden";
+          s3 = Math.max(r3, o3), t2 && s3 > 34 * t2 ? (s3 = 34 * t2, e3.style.overflowY = "auto") : e3.style.overflowY = "hidden";
         } else e3.style.overflowY = "hidden";
-        e3.style.height = `${r3}px`, e3.style.resize = o2 ? "none" : "vertical", document.body.removeChild(a2), Math.floor(r3 / 34);
+        e3.style.height = `${s3}px`, e3.style.resize = o2 ? "none" : "vertical", document.body.removeChild(a2), Math.floor(s3 / 34);
       })(e2, g);
     })();
-  }, [F, g, N]), e.jsxs("div", { className: ["ono-textarea", y ? "ono-input-is-disabled" : ""].filter(Boolean).join(" "), children: [e.jsx("div", { className: ["ono-textarea-wrapper", z ? "none" === v ? "" : "ono-input-is-focus" : "", d].filter(Boolean).join(" "), onClick: () => {
+  }, [F, g, N]), e.jsxs("div", { className: ["ono-textarea", y ? "ono-input-is-disabled" : ""].filter(Boolean).join(" "), children: [e.jsx("div", { className: ["ono-textarea-wrapper", z ? "none" === b ? "" : "ono-input-is-focus" : "", d].filter(Boolean).join(" "), onClick: () => {
     var _a;
     return (_a = F.current) == null ? void 0 : _a.focus();
-  }, children: e.jsx("textarea", { ref: F, className: "ono-textarea-inner", id: s2, rows: l2, name: r2, maxLength: i2, minLength: c, placeholder: u, readOnly: p, autoComplete: h, autoFocus: x, form: f, disabled: y, onFocus: () => S(true), onBlur: () => S(false), value: N, onChange: (e2) => {
+  }, children: e.jsx("textarea", { ref: F, className: "ono-textarea-inner", id: r2, rows: l2, name: s2, maxLength: i2, minLength: c, placeholder: u, readOnly: p, autoComplete: h, autoFocus: x, form: f, disabled: y, onFocus: () => S(true), onBlur: () => S(false), value: N, onChange: (e2) => {
     L(e2.target.value), E(e2.target.value), w == null ? void 0 : w(e2);
-  } }) }), b && i2 && e.jsx("p", { className: "ono-count-bar", onClick: (e2) => e2.stopPropagation(), children: N.length + "/" + i2 })] });
+  } }) }), v && i2 && e.jsx("p", { className: "ono-count-bar", onClick: (e2) => e2.stopPropagation(), children: N.length + "/" + i2 })] });
 };
 export {
   l as O,

package/dist/es/{Modal-C-c_S_VM.js → Modal-D4gV43Cy.js}

@@ -4,7 +4,7 @@ import { useRef as n, useEffect as l } from "react";
 import { p as a } from "./PortalRenderer-CDAzQJgm.js";
 const t = ({ title: a2 = "This is a modal title", icon: t2, content: r2 = "This is a modal content", okText: s = "confirm", cancelText: i = "cancel", isLoading: c, confirmDisabled: d, cancelDisabled: m, position: x, onConfirm: h = () => {
 }, onCancel: b = () => {
-}, mask: f = true, maskClosable: u = false, width: j, btnClr: p, footer: C = ({ OkBtn: e2, CancelBtn: n2 }) => o.jsxs(o.Fragment, { children: [o.jsx(n2, {}), o.jsx(e2, {})] }), modalBody: v, destroy: y }) => {
+}, mask: u = true, maskClosable: f = false, width: j, btnClr: p, footer: C = ({ OkBtn: e2, CancelBtn: n2 }) => o.jsxs(o.Fragment, { children: [o.jsx(n2, {}), o.jsx(e2, {})] }), modalBody: v, destroy: y }) => {
   const g = n(null), B = n(null), w = [{ label: "themeColor", value: p || "" }, { label: "themeHoverColor", value: p && e(p, "light", 10) || "" }, { label: "themeActiveColor", value: p && e(p, "dark", 20) || "" }, { label: "themeDisabledClr", value: p && e(p, "light", 20) || "" }], N = () => {
     if (x) {
       if (!B.current) return;
@@ -13,15 +13,15 @@ const t = ({ title: a2 = "This is a modal title", icon: t2, content: r2 = "This
       }, 300);
     } else y();
   };
-  return l(() => (g.current && (f ? g.current.showModal() : g.current.show()), () => {
+  return l(() => (g.current && (u ? g.current.showModal() : g.current.show()), () => {
     g.current && g.current.close();
-  }), [g.current, f]), l(() => {
+  }), [g.current, u]), l(() => {
     (() => {
       if (!B.current) return;
       const o2 = B.current.style;
       j && o2.setProperty("--width", j + "px"), x && (o2.setProperty("--left", (x.x / window.innerWidth * 100).toFixed(2) + "%"), o2.setProperty("--top", (x.y / window.innerHeight * 100).toFixed(2) + "%")), p && w.forEach((e2) => o2.setProperty(`--${e2.label}`, e2.value));
     })();
-  }, [B]), o.jsx("dialog", { ref: g, className: "ono-modal", onClick: () => u && N(), children: v ? v(N) : o.jsxs("div", { ref: B, className: ["ono-modal-box", x ? "ono-modal-enter" : ""].join(" "), onClick: (o2) => o2.stopPropagation(), children: [o.jsxs("div", { className: "ono-modal-box-body", children: [t2 ?? o.jsx("div", { className: "ono-modal-box-body-icon", children: o.jsx("svg", { color: "#faad14", viewBox: "64 64 896 896", focusable: "false", "data-icon": "exclamation-circle", width: "22px", height: "22px", fill: "currentColor", "aria-hidden": "true", style: { marginInlineEnd: "12px" }, children: o.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" }) }) }), o.jsxs("div", { className: "ono-modal-box-body-contentBar", children: [o.jsx("h1", { className: "ono-modal-box-body-contentBar-title", children: a2 }), o.jsx("p", { className: "ono-modal-box-body-contentBar-content", children: r2 })] })] }), C && o.jsx("div", { className: "ono-modal-box-footer", children: C({ OkBtn: () => o.jsxs("button", { className: "ono-modal-box-footer-confirmBtn", disabled: d || c, onClick: () => {
+  }, [B]), o.jsx("dialog", { ref: g, className: "ono-modal", onClick: () => f && N(), children: v ? v(N) : o.jsxs("div", { ref: B, className: ["ono-modal-box", x ? "ono-modal-enter" : ""].join(" "), onClick: (o2) => o2.stopPropagation(), children: [o.jsxs("div", { className: "ono-modal-box-body", children: [t2 ?? o.jsx("div", { className: "ono-modal-box-body-icon", children: o.jsx("svg", { color: "#faad14", viewBox: "64 64 896 896", focusable: "false", "data-icon": "exclamation-circle", width: "22px", height: "22px", fill: "currentColor", "aria-hidden": "true", style: { marginInlineEnd: "12px" }, children: o.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" }) }) }), o.jsxs("div", { className: "ono-modal-box-body-contentBar", children: [o.jsx("h1", { className: "ono-modal-box-body-contentBar-title", children: a2 }), o.jsx("p", { className: "ono-modal-box-body-contentBar-content", children: r2 })] })] }), C && o.jsx("div", { className: "ono-modal-box-footer", children: C({ OkBtn: () => o.jsxs("button", { className: "ono-modal-box-footer-confirmBtn", disabled: d || c, onClick: () => {
     h(), N();
   }, children: [c && o.jsx("svg", { className: "ono-modal-box-footer-confirmBtn-loading", viewBox: "0 0 1024 1024", focusable: "false", "data-icon": "loading", fill: "currentColor", "aria-hidden": "true", children: o.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" }) }), s ?? "Confirm"] }), CancelBtn: () => o.jsx("button", { className: "ono-modal-box-footer-cancelBtn", disabled: m || c, onClick: () => {
     b(), N();

package/dist/es/{Select-BXPk2P2w.js → Select-CJuIMAoG.js}

@@ -1,9 +1,9 @@
 import { j as e } from "./dependencies-CbQbPZZ-.js";
 import { useState as o, useEffect as n } from "react";
-import { T as a } from "./Tooltip-C5OFmxWo.js";
-import { O as t } from "./Input-Z3uL5-nj.js";
+import { T as a } from "./Tooltip-Dj8ZeMVG.js";
+import { O as t } from "./Input-CYA8Q8B5.js";
 import { L as l } from "./List-UAKCMuGC.js";
-const i = ({ label: o2, value: n2, disabled: a2, onChange: t2, optionRender: l2, currentValue: i2 }) => e.jsx("button", { role: "option", "aria-label": o2, disabled: a2, className: "ono-option-item", onClick: () => t2 == null ? void 0 : t2(n2), children: l2 ? l2({ label: o2, value: n2, disabled: a2 }, i2 === o2) : e.jsx("div", { className: ["ono-option-item-content", i2 === o2 ? "ono-option-item-content-active" : "", a2 ? "ono-option-item-content-disabled" : ""].filter(Boolean).join(" "), children: o2 }) }), s = ({ options: s2, defaultValue: c, placeholder: d, inputBorder: p, isShowArrow: m, disabled: u, clearable: h, selectClassName: j, optionsClassName: b, filterable: f, notFoundContent: x, optionRender: v, onClear: C, onChange: g, filterMethod: w }) => {
+const i = ({ label: o2, value: n2, disabled: a2, onChange: t2, optionRender: l2, currentValue: i2 }) => e.jsx("button", { role: "option", "aria-label": o2, disabled: a2, className: "ono-option-item", onClick: () => t2 == null ? void 0 : t2(n2), children: l2 ? l2({ label: o2, value: n2, disabled: a2 }, i2 === o2) : e.jsx("div", { className: ["ono-option-item-content", i2 === o2 ? "ono-option-item-content-active" : "", a2 ? "ono-option-item-content-disabled" : ""].filter(Boolean).join(" "), children: o2 }) }), s = ({ options: s2, defaultValue: c, placeholder: d, inputBorder: p, isShowArrow: m, disabled: u, clearable: h, selectClassName: f, optionsClassName: j, filterable: b, notFoundContent: x, optionRender: v, onClear: C, onChange: g, filterMethod: w }) => {
   const [N, L] = o(""), [B, S] = o(""), [V, k] = o(false), [M, y] = o(false), [O, R] = o(""), A = (e2) => {
     const o2 = s2.find((o3) => o3.value === e2);
     L(o2 ? o2.label : "");
@@ -12,9 +12,9 @@ const i = ({ label: o2, value: n2, disabled: a2, onChange: t2, optionRender: l2,
   };
   return n(() => {
     c && A(c);
-  }, [c, s2]), e.jsx(a, { sameWidth: true, trigger: "click", placement: "bottom", isShowArrow: m, className: ["ono-option-container", b].filter(Boolean).join(" "), onOpenChange: (e2) => {
-    y(e2), f && B && !e2 && S("");
-  }, content: e.jsx(l, { list: f ? w && "function" == typeof w ? w(B, s2) : s2.filter((e2) => e2.label.toLocaleLowerCase().includes(B.toLocaleLowerCase())) : s2, fallback: x ?? e.jsx("div", { className: "ono-option-item", children: e.jsx("div", { className: "ono-option-item-content-no-data", onClick: (e2) => e2.stopPropagation(), children: "No Data" }) }), children: (o2) => e.jsx(i, { ...o2, onChange: F, currentValue: N.toString(), optionRender: v }, o2.value) }), children: e.jsx("div", { className: "ono-select", onMouseEnter: () => k(true), onMouseLeave: () => k(false), children: e.jsx(t, { className: [f ? "" : "ono-select-readonly", j].filter(Boolean).join(" "), border: p, disabled: u, placeholder: f && O ? N.toString() || "" : d, readonly: !f, value: f && M ? B : N.toString(), clearable: V && h, suffix: V && h && N || h && B && f ? e.jsx(e.Fragment, {}) : e.jsx(r, { isVisible: M }), onClear: () => {
+  }, [c, s2]), e.jsx(a, { sameWidth: true, trigger: "click", placement: "bottom", isShowArrow: m, className: ["ono-option-container", j].filter(Boolean).join(" "), onOpenChange: (e2) => {
+    y(e2), b && B && !e2 && S("");
+  }, content: e.jsx(l, { list: b ? w && "function" == typeof w ? w(B, s2) : s2.filter((e2) => e2.label.toLocaleLowerCase().includes(B.toLocaleLowerCase())) : s2, fallback: x ?? e.jsx("div", { className: "ono-option-item", children: e.jsx("div", { className: "ono-option-item-content-no-data", onClick: (e2) => e2.stopPropagation(), children: "No Data" }) }), children: (o2) => e.jsx(i, { ...o2, onChange: F, currentValue: N.toString(), optionRender: v }, o2.value) }), children: e.jsx("div", { className: "ono-select", onMouseEnter: () => k(true), onMouseLeave: () => k(false), children: e.jsx(t, { className: [b ? "" : "ono-select-readonly", f].filter(Boolean).join(" "), border: p, disabled: u, placeholder: b && O ? N.toString() || "" : d, readonly: !b, value: b && M ? B : N.toString(), clearable: V && h, suffix: V && h && N || h && B && b ? e.jsx(e.Fragment, {}) : e.jsx(r, { isVisible: M }), onClear: () => {
     C == null ? void 0 : C(), g == null ? void 0 : g(""), R(""), L(""), S("");
   }, onChange: (e2) => S(e2.target.value) }) }) });
 }, r = ({ isVisible: o2 }) => e.jsx("svg", { className: ["ono-select-arrow-down-icon", o2 ? "ono-select-arrow-down-active" : ""].filter(Boolean).join(" "), viewBox: "64 64 896 896", focusable: "false", "data-icon": "down", fill: "currentColor", "aria-hidden": "true", children: e.jsx("path", { d: "M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z" }) });

package/dist/es/{TemplateDialog-CO-4TmAd.js → TemplateDialog-DKEBuvXA.js}

@@ -1,7 +1,7 @@
 import { j as e } from "./dependencies-CbQbPZZ-.js";
 import { h as t } from "./utils-BxXROOPY.js";
 import { useState as n, useRef as o, useEffect as r, useCallback as s } from "react";
-const i = ({ children: i2, animation: a, className: l, duration: c = 300, style: d, maskColor: p = "rgba(0, 0, 0, 0.5)", disableContextMenu: u, clickMaskClose: m = true, dialogClose: y }) => {
+const i = ({ children: i2, animation: a, className: l, duration: c = 300, style: d, maskColor: p = "rgba(0, 0, 0, 0.5)", disableContextMenu: m, maskClickClose: u = true, dialogClose: y }) => {
   const [f, k] = n(false), g = o(null), x = () => {
     if (g.current) if (k(true), a) {
       const e2 = g.current;
@@ -26,7 +26,7 @@ const i = ({ children: i2, animation: a, className: l, duration: c = 300, style:
       }
     })();
   }, [g, a]);
-  const h = s(() => {
+  const C = s(() => {
     if (!a) return "";
     const e2 = `ono-${a.type}-enter`, t2 = `ono-${a.type}-leave`;
     return f ? t2 : e2;
@@ -34,10 +34,10 @@ const i = ({ children: i2, animation: a, className: l, duration: c = 300, style:
   return e.jsx("div", { className: `
         ono-dialog-mask
         ono-dialog-mask-${f ? "leave" : "enter"}
-      `, style: { background: p }, onClick: () => m && x(), onContextMenu: (e2) => u && e2.preventDefault(), children: e.jsx("div", { ref: g, className: `
+      `, style: { background: p }, onClick: () => u && x(), onContextMenu: (e2) => m && e2.preventDefault(), children: e.jsx("div", { ref: g, className: `
           ono-dialog
           ${l || ""} 
-          ${h()}
+          ${C()}
         `, style: d, onClick: (e2) => e2.stopPropagation(), children: "function" == typeof i2 ? i2(x) : i2 }) });
 };
 export {

package/dist/es/{Toast-BadlA1yD.js → Toast-DHu6WOZ0.js}

@@ -1,6 +1,6 @@
 import { j as s } from "./dependencies-CbQbPZZ-.js";
 import { useEffect as e, useRef as t } from "react";
-import { i } from "./InjunctiveBox-D0V-K9Pn.js";
+import { i } from "./InjunctiveBox-DsntB_UW.js";
 const a = "_enter_3s92l_32";
 let r = [];
 const c = { success: { light: "#52c41a", dark: "#49aa19" }, error: { light: "#ff4d4f", dark: "#a61d24" }, warning: { light: "#faad14", dark: "#d89614" }, promise: { light: "", dark: "" } }, o = (s2, e2) => c[s2][e2], n = (e2) => {

package/dist/es/Tooltip-Dj8ZeMVG.js

@@ -0,0 +1,29 @@
+import { j as e } from "./dependencies-CbQbPZZ-.js";
+import { createPopper as r } from "@popperjs/core";
+import { useState as t, useRef as n, useEffect as o } from "react";
+import { useClickOutSide as c } from "./index.js";
+let s = null, l = null;
+const i = ({ children: i2, content: p, onOpenChange: u, trigger: a = "hover", placement: m = "top", popperOptions: d = {}, className: f, style: h, isShowArrow: x = true, sameWidth: w, autoAdjustOverflow: j = true }) => {
+  const [v, y] = t(false), g = n(null), b = n(null), k = (e2) => {
+    u == null ? void 0 : u(e2), y(e2);
+  };
+  return c(b, () => {
+    "click" !== a && "contextmenu" !== a || k(false);
+  }, { event: ["click", "contextmenu"], deps: [a, u] }), o(() => {
+    (() => {
+      if (!b.current) return;
+      const e2 = Array.from(b.current.children);
+      if (e2.length > 1) throw new Error("Tooltip only support one child");
+      b.current.style.width = e2[0].getBoundingClientRect().width + "px";
+    })();
+  }, [b, i2]), o(() => {
+    b.current && ("hover" === a ? (b.current.onmouseenter = () => k(true), b.current.onmouseleave = () => k(false)) : "click" === a ? b.current.onclick = () => k(!v) : "focus" === a ? (b.current.onfocus = () => k(true), b.current.onblur = () => k(false)) : b.current.oncontextmenu = () => k(!v)), v && b.current && g.current ? l = r(b.current, g.current, { placement: m, modifiers: [{ name: "offset", options: { offset: [0, 6] } }, w ? { name: "sameWidth", enabled: true, phase: "beforeWrite", requires: ["computeStyles"], fn({ state: e2 }) {
+      e2.styles.popper.width = `${e2.rects.reference.width}px`;
+    }, effect({ state: e2 }) {
+      e2.elements.popper.style.width = `${e2.elements.reference.offsetWidth}px`;
+    } } : {}, j ? { name: "flip", enabled: true } : {}], ...d }) : l && (l.destroy(), l = null, s && s.remove(), s = null);
+  }, [v, b, g]), e.jsxs(e.Fragment, { children: [v && e.jsxs("div", { ref: g, style: h, className: ["ono-tooltip-popper", f].join(" "), "data-popper-placement": d.placement || m, children: [e.jsx("div", { children: p instanceof Function ? p() : p }), x && e.jsx("div", { className: "ono-tooltip-popper-arrow", "data-popper-arrow": true })] }), e.jsx("div", { ref: b, children: i2 instanceof Function ? i2() : i2 })] });
+};
+export {
+  i as T
+};

package/dist/es/{VirtualList-BeDq637Z.js → VirtualList-BBvdkGKk.js}

@@ -1,11 +1,11 @@
 import { j as e } from "./dependencies-CbQbPZZ-.js";
 import { memo as t, useState as r, useMemo as i, useRef as n, useEffect as l } from "react";
-import { a } from "./hooks-Dew3_cmY.js";
-const s = t(({ containerClassName: t2, dataSource: s2, containerStyle: d2 = {}, onEndCallback: c, refreshSpeed: o = 50, wrapperClassName: h, wrapperStyle: u = {}, estimatedSize: p = 35, updateDataSourceScroll2Top: f, direction: g = "vertical" }) => {
-  const [v, S] = r({ viewSize: 0, startIndex: 0, listSize: 0, renderCount: 0, prevLen: 0 }), [x, m] = r([]), z = "number" == typeof p ? p : p(), w = i(() => Math.min(s2.length, v.startIndex + v.renderCount), [s2, v]), I = i(() => {
+import { useEventListener as a } from "./index.js";
+const d = t(({ containerClassName: t2, dataSource: d2, containerStyle: s2 = {}, onEndCallback: c, refreshSpeed: o = 50, wrapperClassName: h, wrapperStyle: u = {}, estimatedSize: p = 35, updateDataSourceScroll2Top: f, direction: g = "vertical" }) => {
+  const [v, x] = r({ viewSize: 0, startIndex: 0, listSize: 0, renderCount: 0, prevLen: 0 }), [S, m] = r([]), z = "number" == typeof p ? p : p(), w = i(() => Math.min(d2.length, v.startIndex + v.renderCount), [d2, v]), I = i(() => {
     var _a;
-    return v.startIndex > 0 ? (_a = x[v.startIndex - 1]) == null ? void 0 : _a.end : 0;
-  }, [v.startIndex, x]), y = i(() => s2.slice(v.startIndex, w).map(({ id: t3, data: r2 }) => e.jsx("li", { "data-virtual-id": t3, style: "vertical" === g ? { width: "100%" } : { height: "100%" }, children: r2 }, t3)), [w, s2, v.startIndex, g]), C = i(() => ({ display: "flex", listStyle: "none", flexDirection: "vertical" === g ? "column" : "row", height: "vertical" === g ? v.listSize - I + "px" : "100%", width: "vertical" === g ? "auto" : v.listSize - I + "px", transform: "vertical" === g ? `translate3d(0, ${I}px, 0)` : `translate3d(${I}px, 0, 0)` }), [v.listSize, I, g]), j = n(null), L = n(null), N = (e2) => S((t3) => ({ ...t3, ...e2 })), b = /* @__PURE__ */ ((e2, t3 = 300) => {
+    return v.startIndex > 0 ? (_a = S[v.startIndex - 1]) == null ? void 0 : _a.end : 0;
+  }, [v.startIndex, S]), y = i(() => d2.slice(v.startIndex, w).map(({ id: t3, data: r2 }) => e.jsx("li", { "data-virtual-id": t3, style: "vertical" === g ? { width: "100%" } : { height: "100%" }, children: r2 }, t3)), [w, d2, v.startIndex, g]), C = i(() => ({ display: "flex", listStyle: "none", flexDirection: "vertical" === g ? "column" : "row", height: "vertical" === g ? v.listSize - I + "px" : "100%", width: "vertical" === g ? "auto" : v.listSize - I + "px", transform: "vertical" === g ? `translate3d(0, ${I}px, 0)` : `translate3d(${I}px, 0, 0)` }), [v.listSize, I, g]), j = n(null), L = n(null), N = (e2) => x((t3) => ({ ...t3, ...e2 })), b = /* @__PURE__ */ ((e2, t3 = 300) => {
     let r2 = 0;
     return () => {
       const i2 = Date.now();
@@ -13,7 +13,7 @@ const s = t(({ containerClassName: t2, dataSource: s2, containerStyle: d2 = {},
     };
   })(() => {
     const { scrollTop: e2, clientHeight: t3, scrollHeight: r2, scrollLeft: i2, clientWidth: n2, scrollWidth: l2 } = j.current, a2 = "vertical" === g ? r2 - t3 - e2 : l2 - n2 - i2;
-    N({ startIndex: A(x, "vertical" === g ? e2 : i2) }), ("vertical" === g ? e2 === z / 2 : i2 === z / 2) && N({ startIndex: 0 }), a2 <= 20 && c && c();
+    N({ startIndex: A(S, "vertical" === g ? e2 : i2) }), ("vertical" === g ? e2 === z / 2 : i2 === z / 2) && N({ startIndex: 0 }), a2 <= 20 && c && c();
   }, o), A = (e2, t3) => {
     let r2 = 0, i2 = e2.length - 1, n2 = -1;
     for (; r2 <= i2; ) {
@@ -23,43 +23,43 @@ const s = t(({ containerClassName: t2, dataSource: s2, containerStyle: d2 = {},
     }
     return n2;
   };
-  return a("scroll", b, { target: j.current, deps: [x, g] }), l(() => {
+  return a("scroll", b, { target: j.current, deps: [S, g] }), l(() => {
     (() => {
       if (!j.current) return;
       const e2 = ("vertical" === g ? j.current.offsetHeight : j.current.offsetWidth) || 0;
       N({ viewSize: e2, renderCount: Math.ceil(e2 / z) + 1 });
     })();
   }, [j, g]), l(() => {
-    s2.length && L && (() => {
+    d2.length && L && (() => {
       var _a;
-      const e2 = [], t3 = s2.length - v.prevLen, r2 = t3 > 0 ? x.length : 0, i2 = r2 > 0 ? x[r2 - 1].end : 0;
-      for (let r3 = 0; r3 < (t3 > 0 ? t3 : s2.length); r3++) {
-        const n2 = s2[(t3 > 0 ? v.prevLen : 0) + r3];
+      const e2 = [], t3 = d2.length - v.prevLen, r2 = t3 > 0 ? S.length : 0, i2 = r2 > 0 ? S[r2 - 1].end : 0;
+      for (let r3 = 0; r3 < (t3 > 0 ? t3 : d2.length); r3++) {
+        const n2 = d2[(t3 > 0 ? v.prevLen : 0) + r3];
         e2.push({ index: n2.id, size: z, start: i2 ? i2 + r3 * z : n2.id * z, end: i2 ? i2 + (r3 + 1) * z : (n2.id + 1) * z, dSize: 0 });
       }
-      m((r3) => [...t3 > 0 ? r3 : [], ...e2]), N({ prevLen: s2.length }), f && ((_a = j.current) == null ? void 0 : _a.scrollTo(0, 0));
+      m((r3) => [...t3 > 0 ? r3 : [], ...e2]), N({ prevLen: d2.length }), f && ((_a = j.current) == null ? void 0 : _a.scrollTo(0, 0));
     })();
-  }, [L, s2, f]), l(() => {
+  }, [L, d2, f]), l(() => {
     (() => {
-      if (!L.current || 0 === x.length) return;
+      if (!L.current || 0 === S.length) return;
       const e2 = Array.from(L.current.childNodes);
       if (!e2.length) return;
       e2.forEach((e3) => {
-        const t4 = e3.getBoundingClientRect(), r3 = +e3.getAttribute("data-virtual-id"), i3 = x[r3], n2 = i3.size - ("vertical" === g ? t4.height : t4.width);
+        const t4 = e3.getBoundingClientRect(), r3 = +e3.getAttribute("data-virtual-id"), i3 = S[r3], n2 = i3.size - ("vertical" === g ? t4.height : t4.width);
         n2 && (i3.size = "vertical" === g ? t4.height : t4.width, i3.end = i3.end - n2, i3.dSize = n2);
       });
-      const t3 = +e2[0].getAttribute("data-virtual-id"), r2 = x.length;
-      let i2 = x[t3].dSize;
-      x[t3].dSize = 0;
+      const t3 = +e2[0].getAttribute("data-virtual-id"), r2 = S.length;
+      let i2 = S[t3].dSize;
+      S[t3].dSize = 0;
       for (let e3 = t3 + 1; e3 < r2; e3++) {
-        const t4 = x[e3];
-        t4.start = x[e3 - 1].end, t4.end = t4.end - i2, t4.dSize && (i2 += t4.dSize, t4.dSize = 0);
+        const t4 = S[e3];
+        t4.start = S[e3 - 1].end, t4.end = t4.end - i2, t4.dSize && (i2 += t4.dSize, t4.dSize = 0);
       }
-      N({ listSize: x[r2 - 1].end });
+      N({ listSize: S[r2 - 1].end });
     })();
-  }, [L, x, v.startIndex, g]), e.jsx("div", { ref: j, className: t2, style: { width: "100%", height: "100%", overflow: "auto", ...d2 }, children: e.jsx("ul", { ref: L, className: h, style: { ...C, ...u }, children: y }) });
-}), d = (e2, t2) => e2.map((e3, r2) => ({ id: r2, data: t2(e3, r2) }));
+  }, [L, S, v.startIndex, g]), e.jsx("div", { ref: j, className: t2, style: { width: "100%", height: "100%", overflow: "auto", ...s2 }, children: e.jsx("ul", { ref: L, className: h, style: { ...C, ...u }, children: y }) });
+}), s = (e2, t2) => e2.map((e3, r2) => ({ id: r2, data: t2(e3, r2) }));
 export {
-  s as E,
-  d as c
+  d as E,
+  s as c
 };

package/dist/es/{Waterfall-a_c3urjB.js → Waterfall-Ce9ZeKxm.js}

@@ -1,6 +1,6 @@
 import { j as e } from "./dependencies-CbQbPZZ-.js";
 import { useState as t, useRef as a, useCallback as i, useEffect as n } from "react";
-import { a as o } from "./hooks-Dew3_cmY.js";
+import { useEventListener as o } from "./index.js";
 const r = ({ options: r2, pageSize: l, children: s, request: d, reloadData: c, className: m, style: g, updateData: p, loading: h = true, bottomThreshold: u = 50 }) => {
   const [f, x] = t({ page: 1, reloadData: c, loading: false, isFinish: false, gap: "number" == typeof r2 ? 0 : r2.gap, imageWidth: "number" == typeof r2 ? r2 : 0, columns: "number" == typeof r2 ? 0 : r2.columns, imageList: [] }), [y, w] = t([]), [W, b] = t([]), j = a(null), v = a(null), D = a(null), L = (e2) => x((t2) => ({ ...t2, ...e2 })), N = async (e2, t2) => {
     const a2 = c && f.reloadData !== c;

package/dist/es/index.js

@@ -1,26 +1,125 @@
+import { v as e } from "./utils-BxXROOPY.js";
 import { i, j, f, k, l, m, n, o, q, r, s, t, u, w, x, y, z, A, B, C, D, E, F, h, G, H, I, J, K, L, M, N, O, P, Q, R, p, S, T, U, V, W, X, Y, Z, _ } from "./utils-BxXROOPY.js";
-import { A as A2, D as D2 } from "./AutoSliderList-Dy-otnYu.js";
+import { A as A2, D as D2 } from "./AutoSliderList-DCpCHe1X.js";
 import { A as A3 } from "./AvatarCrop-DrA-SARP.js";
 import { A as A4, L as L2 } from "./List-UAKCMuGC.js";
 import { B as B2 } from "./Button-C89izu2m.js";
 import { C as C2 } from "./Card3D-DMvCSUhe.js";
 import { C as C3 } from "./Checkbox-daBabj14.js";
-import { E as E2, c } from "./VirtualList-BeDq637Z.js";
+import { E as E2, c } from "./VirtualList-BBvdkGKk.js";
 import { M as M2 } from "./MenuButton-DHkU5Bq7.js";
 import { m as m2 } from "./Message-GvTC61N0.js";
-import { M as M3 } from "./Modal-C-c_S_VM.js";
-import { O as O2, a } from "./Input-Z3uL5-nj.js";
-import { O as O3 } from "./Select-BXPk2P2w.js";
+import { M as M3 } from "./Modal-D4gV43Cy.js";
+import { O as O2, a } from "./Input-CYA8Q8B5.js";
+import { O as O3 } from "./Select-CJuIMAoG.js";
 import { P as P2 } from "./Pagination-m71H2tfS.js";
 import { p as p2 } from "./PortalRenderer-CDAzQJgm.js";
 import { R as R2, a as a2 } from "./Radio-D_GKVoOC.js";
 import { S as S2 } from "./SvgImg-CZwq2D7J.js";
 import { S as S3 } from "./Switch-CN3M5pXb.js";
-import { T as T2 } from "./TemplateDialog-CO-4TmAd.js";
-import { t as t2 } from "./Toast-BadlA1yD.js";
-import { T as T3 } from "./Tooltip-C5OFmxWo.js";
-import { c as c2, d, a as a3, u as u2, b, e, f as f2 } from "./hooks-Dew3_cmY.js";
-import { W as W2 } from "./Waterfall-a_c3urjB.js";
+import { T as T2 } from "./TemplateDialog-DKEBuvXA.js";
+import { t as t2 } from "./Toast-DHu6WOZ0.js";
+import { T as T3 } from "./Tooltip-Dj8ZeMVG.js";
+import { useEffect as d, useState as g, useRef as v, useCallback as b } from "react";
+import { W as W2 } from "./Waterfall-Ce9ZeKxm.js";
+const $ = (e2, t3, r2) => {
+  const { target: o2, deps: a3, isDeferred: s2 } = r2 || {}, n2 = (e3) => t3(e3);
+  return d(() => ("string" == typeof e2 ? !s2 && (o2 || window).addEventListener(e2, n2) : e2.forEach((e3) => !s2 && (o2 || window).addEventListener(e3, n2)), () => {
+    "string" == typeof e2 ? (o2 || window).removeEventListener(e2, n2) : e2.forEach((e3) => (o2 || window).removeEventListener(e3, n2));
+  }), [o2, ...a3 || []]), s2 ? () => {
+    "string" == typeof e2 ? (o2 || window).addEventListener(e2, n2) : e2.forEach((e3) => (o2 || window).addEventListener(e3, n2));
+  } : void 0;
+}, ee = (e2, t3, r2) => $(((e3) => {
+  const t4 = "string" == typeof e3 ? [e3] : e3;
+  if (new Set(t4).size !== t4.length) throw new Error("there are duplicates in the event type");
+  return t4;
+})((r2 == null ? void 0 : r2.event) || "click"), (r3) => {
+  if (e2) if (e2 instanceof Array) e2.map((e3) => e3 instanceof HTMLElement ? e3 : e3.current).some((e3) => !!e3 && e3.contains(r3.target)) || t3(r3);
+  else {
+    const o2 = e2 instanceof HTMLElement ? e2 : e2.current;
+    o2 && !o2.contains(r3.target) && t3(r3);
+  }
+}, { deps: [e2, ...(r2 == null ? void 0 : r2.deps) || []] }), te = (e2 = 60, t3) => {
+  const [r2, o2] = g(e2), [a3, s2] = g(false), n2 = v(null), i2 = b(() => s2(true), []), c2 = b(() => {
+    s2(false), o2(e2), n2.current && (clearTimeout(n2.current), n2.current = null), t3 == null ? void 0 : t3();
+  }, [e2, t3]);
+  return d(() => {
+    if (a3) return r2 > 0 ? n2.current = setTimeout(() => {
+      o2((e3) => e3 - 1);
+    }, 1e3) : c2(), () => {
+      n2.current && (clearTimeout(n2.current), n2.current = null);
+    };
+  }, [a3, r2, c2]), [r2, i2, c2];
+}, re = (e2) => {
+  const [t3, r2] = g({ w: 0, h: 0 }), o2 = new ResizeObserver((e3) => {
+    for (const t4 of e3) r2({ w: t4.borderBoxSize[0].inlineSize, h: t4.borderBoxSize[0].blockSize });
+  }), a3 = () => {
+    if (e2 && "function" != typeof e2) o2.observe(e2 instanceof HTMLElement ? e2 : e2.current);
+    else if (e2 && "function" == typeof e2) {
+      const t4 = e2();
+      o2.observe(t4 instanceof HTMLElement ? t4 : t4.current);
+    } else r2({ w: window.innerWidth, h: window.innerHeight });
+  };
+  return d(() => (a3(), window.addEventListener("resize", a3), () => {
+    if (window.removeEventListener("resize", a3), e2 && "function" != typeof e2) o2.unobserve(e2 instanceof HTMLElement ? e2 : e2.current);
+    else if (e2 && "function" == typeof e2) {
+      const t4 = e2();
+      o2.unobserve(t4 instanceof HTMLElement ? t4 : t4.current);
+    }
+  }), [e2]), t3;
+}, oe = (e2) => e2.toString().toLocaleLowerCase(), ae = (e2, t3, r2) => {
+  const o2 = (o3) => $(o3, (o4) => ((e3, r3, o5) => {
+    e3.forEach((e4) => {
+      if (e4.includes("+") && e4.length > 1) {
+        const o6 = e4.split("+"), a3 = r3.ctrlKey && o6.includes("ctrl"), s2 = r3.shiftKey && o6.includes("shift"), n2 = r3.altKey && o6.includes("alt"), i2 = r3.metaKey && o6.includes("meta"), c2 = (r3.ctrlKey || r3.metaKey) && o6.includes("commandorcontrol");
+        2 === o6.length ? (a3 || s2 || n2 || i2 || c2) && r3.key.toLocaleLowerCase() === o6[o6.length - 1] && t3(r3, e4) : 3 === o6.length && (a3 && s2 || a3 && n2 || a3 && i2 || a3 && c2 || s2 && n2 || s2 && i2 || s2 && c2 || n2 && i2 || n2 && c2 || i2 && c2) && r3.key.toLocaleLowerCase() === o6[o6.length - 1] && t3(r3, e4);
+      } else if (e4.includes(oe(r3.key))) {
+        if (o5) e4 === oe(r3.key) && t3(r3, e4);
+        else if (!(r3.ctrlKey || r3.metaKey || r3.shiftKey || r3.altKey)) return t3(r3, e4);
+      }
+    });
+  })(e2 instanceof Array ? e2.map((e3) => oe(e3)) : [oe(e2)], o4, (r2 == null ? void 0 : r2.exactMatch) || false), { deps: [r2 == null ? void 0 : r2.target, ...(r2 == null ? void 0 : r2.deps) || []] });
+  (r2 == null ? void 0 : r2.events) instanceof Array ? r2.events.forEach((e3) => o2(e3)) : o2((r2 == null ? void 0 : r2.events) || "keydown");
+}, se = () => {
+  const [e2, t3] = g({ clientX: 0, clientY: 0, screenX: 0, screenY: 0, pageX: 0, pageY: 0 });
+  return $("click", (e3) => {
+    const r2 = e3.clientX, o2 = e3.clientY, a3 = e3.screenX, s2 = e3.screenY, n2 = e3.pageX, i2 = e3.pageY;
+    t3({ clientX: r2, clientY: o2, screenX: a3, screenY: s2, pageX: n2, pageY: i2 });
+  }), e2;
+};
+let ne = false;
+const ie = ({ theme: e2, onDark: t3, onLight: r2 }) => {
+  const o2 = window.matchMedia("(prefers-color-scheme: dark)"), a3 = () => {
+    o2.matches ? t3() : r2();
+  };
+  d(() => {
+    (() => {
+      switch (ne && (ne = false, o2.removeEventListener("change", a3)), e2) {
+        case "light":
+          r2();
+          break;
+        case "dark":
+          t3();
+          break;
+        default:
+          a3(), ne = true, o2.addEventListener("change", a3);
+      }
+    })();
+  }, [e2]);
+}, ce = (t3) => {
+  const { initTheme: r2 = "light", themeRules: o2 = (e2) => {
+    e2 ? document.documentElement.classList.add("dark") : document.documentElement.classList.remove("dark");
+  } } = t3 || Object.assign({}), [a3, s2] = g(r2), n2 = v(null);
+  return ie({ theme: a3, onDark: () => {
+    n2.current ? e.changeThemeClipPathCircle({ element: n2.current, onChangeTheme: () => o2(true) }) : o2(true);
+  }, onLight: () => {
+    n2.current ? e.changeThemeClipPathCircle({ element: n2.current, onChangeTheme: () => o2(false) }) : o2(false);
+  } }), [a3, ({ targetTheme: e2, element: t4, onChange: r3 }) => {
+    n2.current = t4 || null, requestAnimationFrame(() => {
+      r3 == null ? void 0 : r3(), s2(e2);
+    });
+  }];
+};
 export {
   A2 as AutoSliderList,
   A3 as AvatarCrop,
@@ -94,11 +193,12 @@ export {
   Y as urlToBase64,
   Z as urlToBlob,
   _ as urlToFile,
-  c2 as useClickOutSide,
-  d as useCountdown,
-  a3 as useEventListener,
-  u2 as useGetElementSize,
-  b as useKeyPress,
-  e as useTheme,
-  f2 as useThemePro
+  ee as useClickOutSide,
+  te as useCountdown,
+  $ as useEventListener,
+  re as useGetElementSize,
+  ae as useKeyPress,
+  se as useMouseClick,
+  ie as useTheme,
+  ce as useThemePro
 };

package/dist/index.css

@@ -1 +1 @@
-:root{--bg-color:pink}.ono-auto-slider-list-container{align-items:center;display:flex;list-style:none;position:relative;width:fit-content}.ono-auto-slider-list-container .ono-auto-slider-list-slider{background:#ccc;left:0;position:absolute;top:0;transform-origin:top left;z-index:0}.ono-auto-slider-list-is-disable{cursor:not-allowed}.ono-avatar-canvas{aspect-ratio:1;overflow:hidden;position:relative}.ono-avatar-canvas .ono-avatar-mask{align-items:center;display:flex;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:100%}.ono-btn-danger,.ono-btn-default,.ono-btn-info,.ono-btn-primary,.ono-btn-success,.ono-btn-warning{--btn-width:0;--btn-height:0;--delay:0.3s;align-items:center;border:none;border-radius:4px;color:#fff;display:flex;font-size:16px;gap:0;justify-content:center;outline:none;padding:2px 15px;transition:gap .3s ease-in-out;white-space:nowrap;width:fit-content}.ono-btn-danger:hover,.ono-btn-default:hover,.ono-btn-info:hover,.ono-btn-primary:hover,.ono-btn-success:hover,.ono-btn-warning:hover{opacity:.9}.ono-btn-danger:focus,.ono-btn-default:focus,.ono-btn-info:focus,.ono-btn-primary:focus,.ono-btn-success:focus,.ono-btn-warning:focus{outline:none}.ono-btn-danger:active,.ono-btn-default:active,.ono-btn-info:active,.ono-btn-primary:active,.ono-btn-success:active,.ono-btn-warning:active{opacity:1}.ono-btn-default{background-color:transparent;border:1px solid #333;color:#333}.ono-btn-primary{background-color:#007bff}.ono-btn-success{background-color:#28a745}.ono-btn-warning{background-color:#ffc107}.ono-btn-danger{background-color:#dc3545}.ono-btn-info{background-color:#909399}.is-loading{opacity:.7}.is-loading .ono-btn-icon{display:grid;grid-template-columns:0fr}.is-round{border-radius:calc(var(--btn-height)/2)}.is-icon{gap:8px}.is-circle{border-radius:50%}.is-disabled{cursor:not-allowed!important;opacity:.5}.ono-btn-icon span{overflow:hidden}.ono-loading-start{animation:loading 1s linear infinite,start var(--delay) ease-in-out forwards}.ono-loading-end{animation:loading 1s linear infinite,end var(--delay) ease-in-out forwards}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes start{0%{grid-template-columns:0fr}to{grid-template-columns:1fr}}@keyframes end{0%{grid-template-columns:1fr}to{grid-template-columns:0fr}}.ono-card{overflow:hidden;transition:all .3s linear,width 0s,height 0s}.ono-card:hover{box-shadow:var(--sd)}.ono-checkbox-border,.ono-checkbox-line{--border-color:#333;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:1px solid var(--border-color);height:20px;outline:none;position:relative;transition:background .1s,border .1s;width:20px}.ono-checkbox-border:checked,.ono-checkbox-line:checked{background:var(--checkedColor)}.ono-checkbox-border:checked:after,.ono-checkbox-line:checked:after{border:calc(var(--w)/8) solid #fff;border-right:none;border-top:none;content:"";height:calc(var(--w)/8*3);left:50%;position:absolute;top:50%;transform:translate(-50%,calc(-50% - var(--w)/24*3)) rotate(-45deg);width:calc(var(--w)/3*2)}.ono-checkbox-border:indeterminate,.ono-checkbox-line:indeterminate{background:var(--indeterminateColor)}.ono-checkbox-border:indeterminate:after,.ono-checkbox-line:indeterminate:after{background:#fff;border-radius:calc(var(--w)/10);content:"";height:calc(var(--w)/7);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:calc(var(--w)/5*3.5)}.ono-checkbox-border:indeterminate:after{background:transparent;border:calc(var(--w)/8) solid #fff;content:"";height:100%;width:100%}.ono-input,.ono-textarea .ono-textarea-wrapper{align-items:center;border-radius:6px;color:#333;display:flex;font-size:16px;line-height:24px;overflow:hidden}.ono-input input[type=password],.ono-textarea .ono-textarea-wrapper input[type=password]{background-color:transparent;border:none;font-family:inherit;font-size:inherit;margin:0;outline:none;padding:0}.ono-input input[type=password]::-ms-clear,.ono-input input[type=password]::-ms-reveal,.ono-textarea .ono-textarea-wrapper input[type=password]::-ms-clear,.ono-textarea .ono-textarea-wrapper input[type=password]::-ms-reveal{display:none}.ono-input input[type=password]::-webkit-inner-spin-button,.ono-input input[type=password]::-webkit-outer-spin-button,.ono-textarea .ono-textarea-wrapper input[type=password]::-webkit-inner-spin-button,.ono-textarea .ono-textarea-wrapper input[type=password]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.ono-input .ono-prepend,.ono-textarea .ono-textarea-wrapper .ono-prepend{background:#d9d9d9;border:1px solid #999;border-radius:6px 0 0 6px;border-right:none;color:inherit;flex-shrink:0;font-size:inherit;line-height:inherit;padding:4px 12px}.ono-input .ono-input-wrapper,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper{align-items:center;background:#f5f5f5;color:inherit;cursor:text;display:flex;font-size:inherit;gap:4px;line-height:inherit;outline:none;padding:4px 12px;width:100%}.ono-input .ono-input-wrapper .ono-append,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-append{align-items:center;color:inherit;display:flex;flex-shrink:0;font-size:inherit;justify-content:center;line-height:inherit}.ono-input .ono-input-wrapper .ono-input-inner,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-input-inner{background:transparent;border:none;color:inherit;cursor:inherit;flex:1;font-size:inherit;line-height:inherit;outline:none}.ono-input .ono-input-wrapper .ono-suffix,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix{align-items:center;color:inherit;display:flex;flex-shrink:0;font-size:inherit;gap:8px;justify-content:center;line-height:inherit}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon{cursor:pointer;height:12px;width:12px}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon{color:#999;height:100%;transition:color .3s;width:100%}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon:hover,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon:hover{color:#666}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon{cursor:pointer;height:16px;width:16px}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon .icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon .icon{color:#999;height:100%;transition:color .3s;width:100%}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon .icon:hover,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon .icon:hover{color:#333}.ono-input .ono-input-wrapper .ono-suffix .ono-count,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-count{color:#999;font-size:inherit;line-height:inherit}.ono-input .ono-append,.ono-textarea .ono-textarea-wrapper .ono-append{background:#d9d9d9;border:1px solid #999;border-left:none;border-radius:0 6px 6px 0;color:inherit;flex-shrink:0;font-size:inherit;line-height:inherit;padding:4px 12px}.ono-textarea{display:flex;flex-direction:column;gap:4px;width:100%}.ono-textarea .ono-textarea-wrapper{background:#f5f5f5;border:1px solid #999;display:initial;flex-shrink:0;min-height:100%;outline:none;padding:0;width:100%}.ono-textarea .ono-textarea-wrapper .ono-textarea-inner{background:none;border:none;border-radius:inherit;color:inherit;display:initial;font-size:inherit;height:100%;line-height:inherit;outline:none;overflow:initial;padding:4px 12px;width:100%}.ono-textarea .ono-count-bar{color:#999;font-size:16px;line-height:24px;text-align:right;width:100%}.ono-input-border .ono-input-wrapper{border:1px solid #999;border-radius:inherit}.ono-input-border:has(.ono-prepend) .ono-input-wrapper{border-bottom-left-radius:0;border-top-left-radius:0}.ono-input-border:has(.ono-append) .ono-input-wrapper{border-bottom-right-radius:0;border-top-right-radius:0}.ono-scrollbar{scrollbar-width:none}.ono-scrollbar::-webkit-scrollbar{width:0}.ono-input-is-focus{border:var(--ono-input-border)!important;box-shadow:var(--ono-input-box-shadow)}.ono-input-is-disabled{background:#d9d9d9;color:#999;cursor:not-allowed;user-select:none}.ono-input-is-disabled .ono-input-wrapper,.ono-input-is-disabled .ono-textarea-wrapper{pointer-events:none}.ono-menu-button{align-items:center;border:none;cursor:pointer;display:flex;flex-direction:column;justify-content:center;margin:0;outline:none;overflow:hidden;padding:0;position:relative;z-index:10}.ono-menu-button span{position:absolute}.ono-message{align-items:center;background:#fff;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.2);color:#333;display:flex;font-size:16px;gap:8px;left:50%;line-height:24px;padding:8px;position:fixed;top:0;transform-origin:top left}.ono-message .ono-type-icon{height:20px;width:20px}.ono-info-icon{height:18px;width:18px}.ono-message-enter{animation:enter var(--speed) ease-in-out forwards}.ono-message-leave{animation:leave var(--speed) ease-in-out forwards;pointer-events:none}.ono-message-success.ono-message-color{background:#f6ffed;border:1px solid #d9f7be;color:#52c41a}.ono-message-warning.ono-message-color{background:#fffbe6;border:1px solid #fff1b8;color:#faad14}.ono-message-error.ono-message-color{background:#fff1f0;border:1px solid #ffccc7;color:#ff4d4f}.ono-message-info.ono-message-color{background:#f5f5f5;border:1px solid #f0f0f0;color:#8c8c8c}.ono-clear-icon{color:#999;height:16px;width:16px}.ono-loading{animation:loading 1s linear infinite}@keyframes enter{0%{opacity:0}to{opacity:1}}@keyframes leave{0%{opacity:1}to{opacity:0}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-modal{--width:416px;--color:#333;--themeColor:#5644b8;--themeHoverColor:#8676de;--themeActiveColor:#352494;--themeDisabledClr:#9587e7;background:transparent}.ono-modal button{background:none;border:none;outline:none;padding:0}.ono-modal-box{--top:0;--left:0;background:#fff;border-radius:6px;color:var(--color);display:flex;flex-direction:column;gap:12px;left:50%;padding:24px;position:fixed;top:50%;transform:translate(-50%,-50%);width:var(--width)}.ono-modal-box-body{display:flex}.ono-modal-box-body-contentBar{align-items:start;display:flex;flex-direction:column;gap:8px;justify-content:start}.ono-modal-box-body-contentBar-title{font-weight:600;line-height:24px}.ono-modal-box-body-contentBar-content{font-size:14px;line-height:22px}.ono-modal-box-footer{align-items:center;display:flex;gap:16px;justify-content:start;margin-left:auto}.ono-modal-box-footer .ono-modal-box-footer-cancelBtn,.ono-modal-box-footer .ono-modal-box-footer-confirmBtn{align-items:center;border-radius:6px;display:flex;justify-content:center;padding:4px 16px;transition:all .2s ease-in-out;user-select:none;width:fit-content}.ono-modal-box-footer-cancelBtn{background:#fff;border:1px solid #ccc;color:#333}.ono-modal-box-footer-cancelBtn:hover{border:1px solid var(--themeHoverColor);color:var(--themeHoverColor)}.ono-modal-box-footer-cancelBtn:active{border:1px solid var(--themeActiveColor);color:var(--themeActiveColor)}.ono-modal-box-footer-cancelBtn:disabled{border:1px solid #ccc;color:#ccc;cursor:no-drop}.ono-modal-box-footer-confirmBtn{background:var(--themeColor);color:#f5f5f5;gap:8px}.ono-modal-box-footer-confirmBtn-loading{animation:loading 1s linear infinite;height:16px;width:16px}.ono-modal-box-footer-confirmBtn:hover{background:var(--themeHoverColor)}.ono-modal-box-footer-confirmBtn:active{background:var(--themeActiveColor)}.ono-modal-box-footer-confirmBtn:disabled{background:var(--themeDisabledClr);cursor:no-drop}.ono-modal::backdrop{backdrop-filter:blur(5px);background:rgba(0,0,0,.5)}.ono-modal-enter{animation:enter .3s forwards}.ono-modal-leave{animation:leave .3s forwards}@keyframes enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-pagination{align-items:center;display:flex;gap:16px;justify-content:center}.ono-pagination-base,.ono-pagination-btn{cursor:pointer;list-style:none;user-select:none}.ono-pagination-btn{align-items:center;aspect-ratio:2/1;background:#ccc;display:flex;justify-content:center;padding:0 10px;width:fit-content}.ono-pagination-btn-active{background:#07c;color:#fff}.ono-radio-group{align-items:flex-start;display:flex;gap:4px;justify-content:flex-start;width:fit-content}.ono-radio-box{align-items:center;display:flex;gap:var(--gap);justify-content:center;width:fit-content}.ono-radio-box .ono-radio{background:var(--unCheckedColor);border:1px solid #424242;border-radius:50%;flex-shrink:0;height:var(--w);position:relative;width:var(--w)}.ono-radio-box .ono-radio input[type=radio]{height:0;opacity:0;width:0}.ono-radio-box .ono-radio:has(input[type=radio]:checked){background:var(--checkedColor)}.ono-radio-box .ono-radio:has(input[type=radio]:checked):after{background-color:#fff;border-radius:50%;content:"";height:50%;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:50%}.ono-select{width:100%}.ono-select .ono-select-arrow-down-icon{color:#666;height:12px;transition:transform .2s linear;width:12px}.ono-select .ono-select-arrow-down-active{transform:rotate(180deg)}.ono-option-container{--tooltip-bg:#fff;box-shadow:0 4px 10px rgba(0,0,0,.1);padding:8px;z-index:9999}.ono-option-container .ono-option-item{background:transparent;border:none;display:block;margin:0;outline:none;padding:0;width:100%}.ono-option-container .ono-option-item .ono-option-item-content,.ono-option-container .ono-option-item .ono-option-item-content-no-data{border-radius:4px;color:#333;font-weight:500;overflow:hidden;padding:4px;text-align:start;text-overflow:ellipsis;white-space:nowrap;width:100%}.ono-option-container .ono-option-item .ono-option-item-content-no-data:hover,.ono-option-container .ono-option-item .ono-option-item-content:hover{background:#ccc}.ono-option-container .ono-option-item .ono-option-item-content-active{color:#5644b8;font-weight:600}.ono-option-container .ono-option-item .ono-option-item-content-disabled{color:#ccc;cursor:not-allowed}.ono-option-container .ono-option-item .ono-option-item-content-disabled:hover,.ono-option-container .ono-option-item .ono-option-item-content-no-data:hover{background:transparent}.ono-select-readonly{cursor:pointer!important}.ono-svg-img{--w:24px;--h:24px;--clr:#fff;height:var(--h);overflow:hidden;width:var(--w)}.ono-svg-img img{filter:drop-shadow(var(--clr) var(--w) 0);height:100%;position:relative;transform:translateX(calc(var(--w)*-1));width:100%}.ono-switch{--checkedClr:#342a7c;--uncheckedClr:rgba(0,0,0,.2)}.ono-switch input[type=checkbox]{height:0;margin:0;opacity:0;position:absolute;width:0}.ono-switch input[type=checkbox]:checked+.ono-switch-box{background-color:var(--checkedClr)}.ono-switch input[type=checkbox]:checked+.ono-switch-box:before{transform:translate(calc(var(--w) - var(--h)))}.ono-switch input[type=checkbox]:checked+.ono-switch-box>.ono-switch-children-bar{transform:translate(calc(var(--h)/8))}.ono-switch.ono-switch-is-disabled .ono-switch-box{cursor:not-allowed;opacity:.6}.ono-switch .ono-switch-box{background-color:var(--uncheckedClr);border-radius:calc(var(--h)/2);cursor:pointer;display:flex;flex-shrink:0;height:var(--h);overflow:hidden;position:relative;width:var(--w)}.ono-switch .ono-switch-box:before{aspect-ratio:1;background:#fff;border-radius:50%;content:"";display:block;left:calc(var(--h)/8);position:absolute;top:calc(var(--h)/8);transition:transform .3s;width:calc(var(--h)*3/4)}.ono-switch .ono-switch-children-bar{display:flex;position:absolute;top:calc(var(--h)/8);transform:translate(calc((var(--w) - var(--h)*9/8)*-1))}.ono-switch .ono-switch-children-bar .ono-switch-children{align-items:center;display:flex;height:calc(var(--h)/4*3);justify-content:center;min-width:fit-content;text-wrap:nowrap;width:calc(var(--w) - var(--h))}.ono-switch .ono-switch-children-bar .ono-switch-slider{aspect-ratio:1;width:calc(var(--h)*3/4)}.ono-dialog-mask{height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:9999}.ono-dialog-mask .ono-dialog{box-shadow:0 0 10px rgba(0,0,0,.3);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.ono-dialog-mask-enter{animation:mask-enter var(--duration) forwards}.ono-dialog-mask-leave{animation:mask-leave var(--duration) forwards}.ono-zoom-enter{animation:zoom-enter var(--duration) forwards}.ono-zoom-leave{animation:zoom-leave var(--duration) forwards}.ono-fade-enter{animation:fade-enter var(--duration) forwards}.ono-fade-leave{animation:fade-leave var(--duration) forwards}@keyframes mask-enter{0%{opacity:0}to{opacity:1}}@keyframes mask-leave{0%{opacity:1}to{opacity:0}}@keyframes zoom-enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes zoom-leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes fade-enter{0%{opacity:0;top:var(--top);transform:translate(-50%,-100%)}to{opacity:1;top:50%;transform:translate(-50%,-50%)}}@keyframes fade-leave{0%{opacity:1;top:50%;transform:translate(-50%,-50%)}to{opacity:0;top:var(--top);transform:translate(-50%,-100%)}}._container_3s92l_1{align-items:center;display:flex;flex-direction:column;gap:20px;height:100vh;left:0;padding:20px;pointer-events:none;position:fixed;top:0;width:100vw}._base_3s92l_15,._promise_3s92l_15{--speed:0.2s;align-items:center;background-color:#fff;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.1);display:flex;gap:8px;height:fit-content;justify-content:center;padding:8px 10px;pointer-events:auto;transform:translateY(0) scale(1);user-select:none;width:fit-content}._enter_3s92l_32{animation:_enter_3s92l_32 var(--speed) forwards}._leave_3s92l_36{animation:_leave_3s92l_36 var(--speed) forwards}._promise_3s92l_15 ._icon_3s92l_40{animation:_loading_3s92l_1 1s linear infinite}@keyframes _enter_3s92l_32{0%{opacity:0;transform:translateY(-80%) scale(.6)}60%{opacity:1;transform:translateY(0) scale(1.1)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes _leave_3s92l_36{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-80%) scale(.6)}}@keyframes _loading_3s92l_1{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-tooltip-popper{background:var(--tooltip-bg,#333);border-radius:4px;color:#fff;font-size:13px;font-weight:700;padding:4px 8px}.ono-tooltip-popper .ono-tooltip-popper-arrow,.ono-tooltip-popper .ono-tooltip-popper-arrow:before{background:inherit;height:8px;position:absolute;width:8px}.ono-tooltip-popper .ono-tooltip-popper-arrow{visibility:hidden}.ono-tooltip-popper .ono-tooltip-popper-arrow:before{content:"";transform:rotate(45deg);visibility:visible}.ono-tooltip-popper[data-popper-placement^=top]>.ono-tooltip-popper-arrow{bottom:-4px}.ono-tooltip-popper[data-popper-placement^=bottom]>.ono-tooltip-popper-arrow{top:-4px}.ono-tooltip-popper[data-popper-placement^=left]>.ono-tooltip-popper-arrow{right:-4px}.ono-tooltip-popper[data-popper-placement^=right]>.ono-tooltip-popper-arrow{left:-4px}.ono-waterfall-container{height:100%;width:100%}.ono-waterfall-content{height:100%;overflow-y:scroll;width:100%}.ono-waterfall-wrapper{position:relative;width:100%}.ono-waterfall-item{left:0;position:absolute;top:0;transform-origin:top left;transition:transform .3s ease-in-out}.ono-waterfall-loading{align-items:center;background:rgba(0,0,0,.502);bottom:0;color:#fff;display:flex;height:100%;justify-content:center;left:0;position:absolute;width:100%;z-index:10}
+:root{--bg-color:pink}.ono-auto-slider-list-container{align-items:center;display:flex;list-style:none;position:relative;width:fit-content}.ono-auto-slider-list-container .ono-auto-slider-list-slider{background:#ccc;left:0;position:absolute;top:0;transform-origin:top left;z-index:0}.ono-auto-slider-list-is-disable{cursor:not-allowed}.ono-avatar-canvas{aspect-ratio:1;overflow:hidden;position:relative}.ono-avatar-canvas .ono-avatar-mask{align-items:center;display:flex;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:100%}.ono-btn-danger,.ono-btn-default,.ono-btn-info,.ono-btn-primary,.ono-btn-success,.ono-btn-warning{--btn-width:0;--btn-height:0;--delay:0.3s;align-items:center;border:none;border-radius:4px;color:#fff;display:flex;font-size:16px;gap:0;justify-content:center;outline:none;padding:2px 15px;transition:gap .3s ease-in-out;white-space:nowrap;width:fit-content}.ono-btn-danger:hover,.ono-btn-default:hover,.ono-btn-info:hover,.ono-btn-primary:hover,.ono-btn-success:hover,.ono-btn-warning:hover{opacity:.9}.ono-btn-danger:focus,.ono-btn-default:focus,.ono-btn-info:focus,.ono-btn-primary:focus,.ono-btn-success:focus,.ono-btn-warning:focus{outline:none}.ono-btn-danger:active,.ono-btn-default:active,.ono-btn-info:active,.ono-btn-primary:active,.ono-btn-success:active,.ono-btn-warning:active{opacity:1}.ono-btn-default{background-color:transparent;border:1px solid #333;color:#333}.ono-btn-primary{background-color:#007bff}.ono-btn-success{background-color:#28a745}.ono-btn-warning{background-color:#ffc107}.ono-btn-danger{background-color:#dc3545}.ono-btn-info{background-color:#909399}.is-loading{opacity:.7}.is-loading .ono-btn-icon{display:grid;grid-template-columns:0fr}.is-round{border-radius:calc(var(--btn-height)/2)}.is-icon{gap:8px}.is-circle{border-radius:50%}.is-disabled{cursor:not-allowed!important;opacity:.5}.ono-btn-icon span{overflow:hidden}.ono-loading-start{animation:loading 1s linear infinite,start var(--delay) ease-in-out forwards}.ono-loading-end{animation:loading 1s linear infinite,end var(--delay) ease-in-out forwards}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes start{0%{grid-template-columns:0fr}to{grid-template-columns:1fr}}@keyframes end{0%{grid-template-columns:1fr}to{grid-template-columns:0fr}}.ono-card{overflow:hidden;transition:all .3s linear,width 0s,height 0s}.ono-card:hover{box-shadow:var(--sd)}.ono-checkbox-border,.ono-checkbox-line{--border-color:#333;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:1px solid var(--border-color);height:20px;outline:none;position:relative;transition:background .1s,border .1s;width:20px}.ono-checkbox-border:checked,.ono-checkbox-line:checked{background:var(--checkedColor)}.ono-checkbox-border:checked:after,.ono-checkbox-line:checked:after{border:calc(var(--w)/8) solid #fff;border-right:none;border-top:none;content:"";height:calc(var(--w)/8*3);left:50%;position:absolute;top:50%;transform:translate(-50%,calc(-50% - var(--w)/24*3)) rotate(-45deg);width:calc(var(--w)/3*2)}.ono-checkbox-border:indeterminate,.ono-checkbox-line:indeterminate{background:var(--indeterminateColor)}.ono-checkbox-border:indeterminate:after,.ono-checkbox-line:indeterminate:after{background:#fff;border-radius:calc(var(--w)/10);content:"";height:calc(var(--w)/7);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:calc(var(--w)/5*3.5)}.ono-checkbox-border:indeterminate:after{background:transparent;border:calc(var(--w)/8) solid #fff;content:"";height:100%;width:100%}.ono-input,.ono-textarea .ono-textarea-wrapper{align-items:center;border-radius:6px;color:#333;display:flex;font-size:16px;line-height:24px;overflow:hidden}.ono-input input[type=password],.ono-textarea .ono-textarea-wrapper input[type=password]{background-color:transparent;border:none;font-family:inherit;font-size:inherit;margin:0;outline:none;padding:0}.ono-input input[type=password]::-ms-clear,.ono-input input[type=password]::-ms-reveal,.ono-textarea .ono-textarea-wrapper input[type=password]::-ms-clear,.ono-textarea .ono-textarea-wrapper input[type=password]::-ms-reveal{display:none}.ono-input input[type=password]::-webkit-inner-spin-button,.ono-input input[type=password]::-webkit-outer-spin-button,.ono-textarea .ono-textarea-wrapper input[type=password]::-webkit-inner-spin-button,.ono-textarea .ono-textarea-wrapper input[type=password]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.ono-input .ono-prepend,.ono-textarea .ono-textarea-wrapper .ono-prepend{background:#d9d9d9;border:1px solid #999;border-radius:6px 0 0 6px;border-right:none;color:inherit;flex-shrink:0;font-size:inherit;line-height:inherit;padding:4px 12px}.ono-input .ono-input-wrapper,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper{align-items:center;background:#f5f5f5;color:inherit;cursor:text;display:flex;font-size:inherit;gap:4px;line-height:inherit;outline:none;padding:4px 12px;width:100%}.ono-input .ono-input-wrapper .ono-append,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-append{align-items:center;color:inherit;display:flex;flex-shrink:0;font-size:inherit;justify-content:center;line-height:inherit}.ono-input .ono-input-wrapper .ono-input-inner,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-input-inner{background:transparent;border:none;color:inherit;cursor:inherit;flex:1;font-size:inherit;line-height:inherit;outline:none}.ono-input .ono-input-wrapper .ono-suffix,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix{align-items:center;color:inherit;display:flex;flex-shrink:0;font-size:inherit;gap:8px;justify-content:center;line-height:inherit}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon{cursor:pointer;height:12px;width:12px}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon{color:#999;height:100%;transition:color .3s;width:100%}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon:hover,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon:hover{color:#666}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon{cursor:pointer;height:16px;width:16px}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon .icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon .icon{color:#999;height:100%;transition:color .3s;width:100%}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon .icon:hover,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon .icon:hover{color:#333}.ono-input .ono-input-wrapper .ono-suffix .ono-count,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-count{color:#999;font-size:inherit;line-height:inherit}.ono-input .ono-append,.ono-textarea .ono-textarea-wrapper .ono-append{background:#d9d9d9;border:1px solid #999;border-left:none;border-radius:0 6px 6px 0;color:inherit;flex-shrink:0;font-size:inherit;line-height:inherit;padding:4px 12px}.ono-textarea{display:flex;flex-direction:column;gap:4px;width:100%}.ono-textarea .ono-textarea-wrapper{background:#f5f5f5;border:1px solid #999;display:initial;flex-shrink:0;min-height:100%;outline:none;padding:0;width:100%}.ono-textarea .ono-textarea-wrapper .ono-textarea-inner{background:none;border:none;border-radius:inherit;color:inherit;display:initial;font-size:inherit;height:100%;line-height:inherit;outline:none;overflow:initial;padding:4px 12px;width:100%}.ono-textarea .ono-count-bar{color:#999;font-size:16px;line-height:24px;text-align:right;width:100%}.ono-input-border .ono-input-wrapper{border:1px solid #999;border-radius:inherit}.ono-input-border:has(.ono-prepend) .ono-input-wrapper{border-bottom-left-radius:0;border-top-left-radius:0}.ono-input-border:has(.ono-append) .ono-input-wrapper{border-bottom-right-radius:0;border-top-right-radius:0}.ono-scrollbar{scrollbar-width:none}.ono-scrollbar::-webkit-scrollbar{width:0}.ono-input-is-focus{border:var(--ono-input-border)!important;box-shadow:var(--ono-input-box-shadow)}.ono-input-is-disabled{background:#d9d9d9;color:#999;cursor:not-allowed;user-select:none}.ono-input-is-disabled .ono-input-wrapper,.ono-input-is-disabled .ono-textarea-wrapper{pointer-events:none}.ono-menu-button{align-items:center;border:none;cursor:pointer;display:flex;flex-direction:column;justify-content:center;margin:0;outline:none;overflow:hidden;padding:0;position:relative;z-index:10}.ono-menu-button span{position:absolute}.ono-message{align-items:center;background:#fff;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.2);color:#333;display:flex;font-size:16px;gap:8px;left:50%;line-height:24px;padding:8px;position:fixed;top:0;transform-origin:top left}.ono-message .ono-type-icon{height:20px;width:20px}.ono-info-icon{height:18px;width:18px}.ono-message-enter{animation:enter var(--speed) ease-in-out forwards}.ono-message-leave{animation:leave var(--speed) ease-in-out forwards;pointer-events:none}.ono-message-success.ono-message-color{background:#f6ffed;border:1px solid #d9f7be;color:#52c41a}.ono-message-warning.ono-message-color{background:#fffbe6;border:1px solid #fff1b8;color:#faad14}.ono-message-error.ono-message-color{background:#fff1f0;border:1px solid #ffccc7;color:#ff4d4f}.ono-message-info.ono-message-color{background:#f5f5f5;border:1px solid #f0f0f0;color:#8c8c8c}.ono-clear-icon{color:#999;height:16px;width:16px}.ono-loading{animation:loading 1s linear infinite}@keyframes enter{0%{opacity:0}to{opacity:1}}@keyframes leave{0%{opacity:1}to{opacity:0}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-modal{--width:416px;--color:#333;--themeColor:#5644b8;--themeHoverColor:#8676de;--themeActiveColor:#352494;--themeDisabledClr:#9587e7;background:transparent}.ono-modal-box{--top:0;--left:0;background:#fff;border-radius:6px;color:var(--color);display:flex;flex-direction:column;gap:12px;left:50%;padding:24px;position:fixed;top:50%;transform:translate(-50%,-50%);width:var(--width)}.ono-modal-box-body{display:flex}.ono-modal-box-body-contentBar{align-items:start;display:flex;flex-direction:column;gap:8px;justify-content:start}.ono-modal-box-body-contentBar-title{font-weight:600;line-height:24px}.ono-modal-box-body-contentBar-content{font-size:14px;line-height:22px}.ono-modal-box-footer{align-items:center;display:flex;gap:16px;justify-content:start;margin-left:auto}.ono-modal-box-footer .ono-modal-box-footer-cancelBtn,.ono-modal-box-footer .ono-modal-box-footer-confirmBtn{align-items:center;border-radius:6px;display:flex;justify-content:center;outline:none;padding:4px 16px;transition:all .2s ease-in-out;user-select:none;width:fit-content}.ono-modal-box-footer-cancelBtn{background:#fff;border:1px solid #ccc;color:#333}.ono-modal-box-footer-cancelBtn:hover{border:1px solid var(--themeHoverColor);color:var(--themeHoverColor)}.ono-modal-box-footer-cancelBtn:active{border:1px solid var(--themeActiveColor);color:var(--themeActiveColor)}.ono-modal-box-footer-cancelBtn:disabled{border:1px solid #ccc;color:#ccc;cursor:no-drop}.ono-modal-box-footer-confirmBtn{background:var(--themeColor);border:none;color:#f5f5f5;gap:8px}.ono-modal-box-footer-confirmBtn-loading{animation:loading 1s linear infinite;height:16px;width:16px}.ono-modal-box-footer-confirmBtn:hover{background:var(--themeHoverColor)}.ono-modal-box-footer-confirmBtn:active{background:var(--themeActiveColor)}.ono-modal-box-footer-confirmBtn:disabled{background:var(--themeDisabledClr);cursor:no-drop}.ono-modal::backdrop{backdrop-filter:blur(5px);background:rgba(0,0,0,.5)}.ono-modal-enter{animation:enter .3s forwards}.ono-modal-leave{animation:leave .3s forwards}@keyframes enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-pagination{align-items:center;display:flex;gap:16px;justify-content:center}.ono-pagination-base,.ono-pagination-btn{cursor:pointer;list-style:none;user-select:none}.ono-pagination-btn{align-items:center;aspect-ratio:2/1;background:#ccc;display:flex;justify-content:center;padding:0 10px;width:fit-content}.ono-pagination-btn-active{background:#07c;color:#fff}.ono-radio-group{align-items:flex-start;display:flex;gap:4px;justify-content:flex-start;width:fit-content}.ono-radio-box{align-items:center;display:flex;gap:var(--gap);justify-content:center;width:fit-content}.ono-radio-box .ono-radio{background:var(--unCheckedColor);border:1px solid #424242;border-radius:50%;flex-shrink:0;height:var(--w);position:relative;width:var(--w)}.ono-radio-box .ono-radio input[type=radio]{height:0;opacity:0;width:0}.ono-radio-box .ono-radio:has(input[type=radio]:checked){background:var(--checkedColor)}.ono-radio-box .ono-radio:has(input[type=radio]:checked):after{background-color:#fff;border-radius:50%;content:"";height:50%;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:50%}.ono-select{width:100%}.ono-select .ono-select-arrow-down-icon{color:#666;height:12px;transition:transform .2s linear;width:12px}.ono-select .ono-select-arrow-down-active{transform:rotate(180deg)}.ono-option-container{--tooltip-bg:#fff;box-shadow:0 4px 10px rgba(0,0,0,.1);padding:8px;z-index:9999}.ono-option-container .ono-option-item{background:transparent;border:none;display:block;margin:0;outline:none;padding:0;width:100%}.ono-option-container .ono-option-item .ono-option-item-content,.ono-option-container .ono-option-item .ono-option-item-content-no-data{border-radius:4px;color:#333;font-weight:500;overflow:hidden;padding:4px;text-align:start;text-overflow:ellipsis;white-space:nowrap;width:100%}.ono-option-container .ono-option-item .ono-option-item-content-no-data:hover,.ono-option-container .ono-option-item .ono-option-item-content:hover{background:#ccc}.ono-option-container .ono-option-item .ono-option-item-content-active{color:#5644b8;font-weight:600}.ono-option-container .ono-option-item .ono-option-item-content-disabled{color:#ccc;cursor:not-allowed}.ono-option-container .ono-option-item .ono-option-item-content-disabled:hover,.ono-option-container .ono-option-item .ono-option-item-content-no-data:hover{background:transparent}.ono-select-readonly{cursor:pointer!important}.ono-svg-img{--w:24px;--h:24px;--clr:#fff;height:var(--h);overflow:hidden;width:var(--w)}.ono-svg-img img{filter:drop-shadow(var(--clr) var(--w) 0);height:100%;position:relative;transform:translateX(calc(var(--w)*-1));width:100%}.ono-switch{--checkedClr:#342a7c;--uncheckedClr:rgba(0,0,0,.2)}.ono-switch input[type=checkbox]{height:0;margin:0;opacity:0;position:absolute;width:0}.ono-switch input[type=checkbox]:checked+.ono-switch-box{background-color:var(--checkedClr)}.ono-switch input[type=checkbox]:checked+.ono-switch-box:before{transform:translate(calc(var(--w) - var(--h)))}.ono-switch input[type=checkbox]:checked+.ono-switch-box>.ono-switch-children-bar{transform:translate(calc(var(--h)/8))}.ono-switch.ono-switch-is-disabled .ono-switch-box{cursor:not-allowed;opacity:.6}.ono-switch .ono-switch-box{background-color:var(--uncheckedClr);border-radius:calc(var(--h)/2);cursor:pointer;display:flex;flex-shrink:0;height:var(--h);overflow:hidden;position:relative;width:var(--w)}.ono-switch .ono-switch-box:before{aspect-ratio:1;background:#fff;border-radius:50%;content:"";display:block;left:calc(var(--h)/8);position:absolute;top:calc(var(--h)/8);transition:transform .3s;width:calc(var(--h)*3/4)}.ono-switch .ono-switch-children-bar{display:flex;position:absolute;top:calc(var(--h)/8);transform:translate(calc((var(--w) - var(--h)*9/8)*-1))}.ono-switch .ono-switch-children-bar .ono-switch-children{align-items:center;display:flex;height:calc(var(--h)/4*3);justify-content:center;min-width:fit-content;text-wrap:nowrap;width:calc(var(--w) - var(--h))}.ono-switch .ono-switch-children-bar .ono-switch-slider{aspect-ratio:1;width:calc(var(--h)*3/4)}.ono-dialog-mask{height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:9999}.ono-dialog-mask .ono-dialog{box-shadow:0 0 10px rgba(0,0,0,.3);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.ono-dialog-mask-enter{animation:mask-enter var(--duration) forwards}.ono-dialog-mask-leave{animation:mask-leave var(--duration) forwards}.ono-zoom-enter{animation:zoom-enter var(--duration) forwards}.ono-zoom-leave{animation:zoom-leave var(--duration) forwards}.ono-fade-enter{animation:fade-enter var(--duration) forwards}.ono-fade-leave{animation:fade-leave var(--duration) forwards}@keyframes mask-enter{0%{opacity:0}to{opacity:1}}@keyframes mask-leave{0%{opacity:1}to{opacity:0}}@keyframes zoom-enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes zoom-leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes fade-enter{0%{opacity:0;top:var(--top);transform:translate(-50%,-100%)}to{opacity:1;top:50%;transform:translate(-50%,-50%)}}@keyframes fade-leave{0%{opacity:1;top:50%;transform:translate(-50%,-50%)}to{opacity:0;top:var(--top);transform:translate(-50%,-100%)}}._container_3s92l_1{align-items:center;display:flex;flex-direction:column;gap:20px;height:100vh;left:0;padding:20px;pointer-events:none;position:fixed;top:0;width:100vw}._base_3s92l_15,._promise_3s92l_15{--speed:0.2s;align-items:center;background-color:#fff;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.1);display:flex;gap:8px;height:fit-content;justify-content:center;padding:8px 10px;pointer-events:auto;transform:translateY(0) scale(1);user-select:none;width:fit-content}._enter_3s92l_32{animation:_enter_3s92l_32 var(--speed) forwards}._leave_3s92l_36{animation:_leave_3s92l_36 var(--speed) forwards}._promise_3s92l_15 ._icon_3s92l_40{animation:_loading_3s92l_1 1s linear infinite}@keyframes _enter_3s92l_32{0%{opacity:0;transform:translateY(-80%) scale(.6)}60%{opacity:1;transform:translateY(0) scale(1.1)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes _leave_3s92l_36{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-80%) scale(.6)}}@keyframes _loading_3s92l_1{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-tooltip-popper{background:var(--tooltip-bg,#333);border-radius:4px;color:#fff;font-size:13px;font-weight:700;padding:4px 8px}.ono-tooltip-popper .ono-tooltip-popper-arrow,.ono-tooltip-popper .ono-tooltip-popper-arrow:before{background:inherit;height:8px;position:absolute;width:8px}.ono-tooltip-popper .ono-tooltip-popper-arrow{visibility:hidden}.ono-tooltip-popper .ono-tooltip-popper-arrow:before{content:"";transform:rotate(45deg);visibility:visible}.ono-tooltip-popper[data-popper-placement^=top]>.ono-tooltip-popper-arrow{bottom:-4px}.ono-tooltip-popper[data-popper-placement^=bottom]>.ono-tooltip-popper-arrow{top:-4px}.ono-tooltip-popper[data-popper-placement^=left]>.ono-tooltip-popper-arrow{right:-4px}.ono-tooltip-popper[data-popper-placement^=right]>.ono-tooltip-popper-arrow{left:-4px}.ono-waterfall-container{height:100%;width:100%}.ono-waterfall-content{height:100%;overflow-y:scroll;width:100%}.ono-waterfall-wrapper{position:relative;width:100%}.ono-waterfall-item{left:0;position:absolute;top:0;transform-origin:top left;transition:transform .3s ease-in-out}.ono-waterfall-loading{align-items:center;background:rgba(0,0,0,.502);bottom:0;color:#fff;display:flex;height:100%;justify-content:center;left:0;position:absolute;width:100%;z-index:10}

package/dist/style/Modal.css

@@ -1 +1 @@
-.ono-modal{--width:416px;--color:#333;--themeColor:#5644b8;--themeHoverColor:#8676de;--themeActiveColor:#352494;--themeDisabledClr:#9587e7;background:transparent}.ono-modal button{background:none;border:none;outline:none;padding:0}.ono-modal-box{--top:0;--left:0;background:#fff;border-radius:6px;color:var(--color);display:flex;flex-direction:column;gap:12px;left:50%;padding:24px;position:fixed;top:50%;transform:translate(-50%,-50%);width:var(--width)}.ono-modal-box-body{display:flex}.ono-modal-box-body-contentBar{align-items:start;display:flex;flex-direction:column;gap:8px;justify-content:start}.ono-modal-box-body-contentBar-title{font-weight:600;line-height:24px}.ono-modal-box-body-contentBar-content{font-size:14px;line-height:22px}.ono-modal-box-footer{align-items:center;display:flex;gap:16px;justify-content:start;margin-left:auto}.ono-modal-box-footer .ono-modal-box-footer-cancelBtn,.ono-modal-box-footer .ono-modal-box-footer-confirmBtn{align-items:center;border-radius:6px;display:flex;justify-content:center;padding:4px 16px;transition:all .2s ease-in-out;user-select:none;width:fit-content}.ono-modal-box-footer-cancelBtn{background:#fff;border:1px solid #ccc;color:#333}.ono-modal-box-footer-cancelBtn:hover{border:1px solid var(--themeHoverColor);color:var(--themeHoverColor)}.ono-modal-box-footer-cancelBtn:active{border:1px solid var(--themeActiveColor);color:var(--themeActiveColor)}.ono-modal-box-footer-cancelBtn:disabled{border:1px solid #ccc;color:#ccc;cursor:no-drop}.ono-modal-box-footer-confirmBtn{background:var(--themeColor);color:#f5f5f5;gap:8px}.ono-modal-box-footer-confirmBtn-loading{animation:loading 1s linear infinite;height:16px;width:16px}.ono-modal-box-footer-confirmBtn:hover{background:var(--themeHoverColor)}.ono-modal-box-footer-confirmBtn:active{background:var(--themeActiveColor)}.ono-modal-box-footer-confirmBtn:disabled{background:var(--themeDisabledClr);cursor:no-drop}.ono-modal::backdrop{backdrop-filter:blur(5px);background:rgba(0,0,0,.5)}.ono-modal-enter{animation:enter .3s forwards}.ono-modal-leave{animation:leave .3s forwards}@keyframes enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
+.ono-modal{--width:416px;--color:#333;--themeColor:#5644b8;--themeHoverColor:#8676de;--themeActiveColor:#352494;--themeDisabledClr:#9587e7;background:transparent}.ono-modal-box{--top:0;--left:0;background:#fff;border-radius:6px;color:var(--color);display:flex;flex-direction:column;gap:12px;left:50%;padding:24px;position:fixed;top:50%;transform:translate(-50%,-50%);width:var(--width)}.ono-modal-box-body{display:flex}.ono-modal-box-body-contentBar{align-items:start;display:flex;flex-direction:column;gap:8px;justify-content:start}.ono-modal-box-body-contentBar-title{font-weight:600;line-height:24px}.ono-modal-box-body-contentBar-content{font-size:14px;line-height:22px}.ono-modal-box-footer{align-items:center;display:flex;gap:16px;justify-content:start;margin-left:auto}.ono-modal-box-footer .ono-modal-box-footer-cancelBtn,.ono-modal-box-footer .ono-modal-box-footer-confirmBtn{align-items:center;border-radius:6px;display:flex;justify-content:center;outline:none;padding:4px 16px;transition:all .2s ease-in-out;user-select:none;width:fit-content}.ono-modal-box-footer-cancelBtn{background:#fff;border:1px solid #ccc;color:#333}.ono-modal-box-footer-cancelBtn:hover{border:1px solid var(--themeHoverColor);color:var(--themeHoverColor)}.ono-modal-box-footer-cancelBtn:active{border:1px solid var(--themeActiveColor);color:var(--themeActiveColor)}.ono-modal-box-footer-cancelBtn:disabled{border:1px solid #ccc;color:#ccc;cursor:no-drop}.ono-modal-box-footer-confirmBtn{background:var(--themeColor);border:none;color:#f5f5f5;gap:8px}.ono-modal-box-footer-confirmBtn-loading{animation:loading 1s linear infinite;height:16px;width:16px}.ono-modal-box-footer-confirmBtn:hover{background:var(--themeHoverColor)}.ono-modal-box-footer-confirmBtn:active{background:var(--themeActiveColor)}.ono-modal-box-footer-confirmBtn:disabled{background:var(--themeDisabledClr);cursor:no-drop}.ono-modal::backdrop{backdrop-filter:blur(5px);background:rgba(0,0,0,.5)}.ono-modal-enter{animation:enter .3s forwards}.ono-modal-leave{animation:leave .3s forwards}@keyframes enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}

package/dist/types/components/TemplateDialog/TemplateDialog.d.ts

@@ -1,2 +1,2 @@
 import { TemplateDialogProps } from './types';
-export declare const TemplateDialog: ({ children, animation, className, duration, style, maskColor, disableContextMenu, clickMaskClose, dialogClose }: TemplateDialogProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TemplateDialog: ({ children, animation, className, duration, style, maskColor, disableContextMenu, maskClickClose, dialogClose }: TemplateDialogProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/TemplateDialog/types.d.ts

@@ -14,6 +14,6 @@ export interface TemplateDialogProps {
     style?: CSSProperties;
     maskColor?: string;
     disableContextMenu?: boolean;
-    clickMaskClose?: boolean;
+    maskClickClose?: boolean;
     dialogClose: () => void;
 }

package/dist/types/hooks/index.d.ts

@@ -3,5 +3,6 @@ export * from './useCountdown';
 export * from './useEventListener';
 export * from './useGetElementSize';
 export * from './useKeyPress';
+export * from './useMouseClick';
 export * from './useTheme';
 export * from './useThemePro';

package/dist/types/hooks/useMouseClick.d.ts

@@ -0,0 +1,8 @@
+export declare const useMouseClick: () => {
+    clientX: number;
+    clientY: number;
+    screenX: number;
+    screenY: number;
+    pageX: number;
+    pageY: number;
+};

package/dist/types/index.d.ts

@@ -1,8 +1,8 @@
 import { AutoSliderList, AvatarCrop, AwaitList, Button, Card3D, Checkbox, createDataSource, Direction, EstimatedVirtualList, ImageItem, List, MenuButton, message, Modal, OnoInput, OnoSelect, OnoTextarea, Pagination, portalRenderer, Radio, RadioGroup, SvgImg, Switch, TemplateDialog, toast, Tooltip, Waterfall } from './components';
-import { ThemeType, useClickOutSide, useCountdown, useEventListener, useGetElementSize, useKeyPress, useTheme, useThemePro } from './hooks';
+import { ThemeType, useClickOutSide, useCountdown, useEventListener, useGetElementSize, useKeyPress, useMouseClick, useTheme, useThemePro } from './hooks';
 import { default as colorUtils, adjustingColors } from './utils/colorUtils';
 import { default as common, addCommasToNumber, addEventWithOriginHandler, calculateAspectRatio, checkDeviceIsMobile, checkStatusCode, copy2Clipboard, createIntersectionObserver, dayOfYear, deepCopy, downloadFile, formatFileSize, formatSecondes, getElementCenterPosition, getFileName, getFileSuffix, getImageSIze, getPointDistance, getURLSearchParams, grayColor, mediaAutoplayPolicies, parseQuery, passwordStrength, pick, printStr, pureNumber, quickSort, rafTimeout, randomString, safeCapitalizeWord, singleton } from './utils/common';
 import { base64ToBlob, base64ToFile, blobToBase64, blobToFile, fileToBase64, fileToBlob, urlToBase64, urlToBlob, urlToFile } from './utils/fileFormatConversion';
 import { convertSecondToOtherTime, formatTime, localFormat, second2Day } from './utils/formatTimeUtils';
-export { addCommasToNumber, addEventWithOriginHandler, adjustingColors, AutoSliderList, AvatarCrop, AwaitList, base64ToBlob, base64ToFile, blobToBase64, blobToFile, Button, calculateAspectRatio, Card3D, Checkbox, checkDeviceIsMobile, checkStatusCode, colorUtils, common, convertSecondToOtherTime, copy2Clipboard, createDataSource, createIntersectionObserver, dayOfYear, deepCopy, Direction, downloadFile, EstimatedVirtualList, fileToBase64, fileToBlob, formatFileSize, formatSecondes, formatTime, getElementCenterPosition, getFileName, getFileSuffix, getImageSIze, getPointDistance, getURLSearchParams, grayColor, List, localFormat, mediaAutoplayPolicies, MenuButton, message, Modal, OnoInput, OnoSelect, OnoTextarea, Pagination, parseQuery, passwordStrength, pick, portalRenderer, printStr, pureNumber, quickSort, Radio, RadioGroup, rafTimeout, randomString, safeCapitalizeWord, second2Day, singleton, SvgImg, Switch, TemplateDialog, toast, Tooltip, urlToBase64, urlToBlob, urlToFile, useClickOutSide, useCountdown, useEventListener, useGetElementSize, useKeyPress, useTheme, useThemePro, Waterfall };
+export { addCommasToNumber, addEventWithOriginHandler, adjustingColors, AutoSliderList, AvatarCrop, AwaitList, base64ToBlob, base64ToFile, blobToBase64, blobToFile, Button, calculateAspectRatio, Card3D, Checkbox, checkDeviceIsMobile, checkStatusCode, colorUtils, common, convertSecondToOtherTime, copy2Clipboard, createDataSource, createIntersectionObserver, dayOfYear, deepCopy, Direction, downloadFile, EstimatedVirtualList, fileToBase64, fileToBlob, formatFileSize, formatSecondes, formatTime, getElementCenterPosition, getFileName, getFileSuffix, getImageSIze, getPointDistance, getURLSearchParams, grayColor, List, localFormat, mediaAutoplayPolicies, MenuButton, message, Modal, OnoInput, OnoSelect, OnoTextarea, Pagination, parseQuery, passwordStrength, pick, portalRenderer, printStr, pureNumber, quickSort, Radio, RadioGroup, rafTimeout, randomString, safeCapitalizeWord, second2Day, singleton, SvgImg, Switch, TemplateDialog, toast, Tooltip, urlToBase64, urlToBlob, urlToFile, useClickOutSide, useCountdown, useEventListener, useGetElementSize, useKeyPress, useMouseClick, useTheme, useThemePro, Waterfall };
 export type { ImageItem, ThemeType };

package/dist/umd/index.css

@@ -1 +1 @@
-:root{--bg-color:pink}.ono-auto-slider-list-container{align-items:center;display:flex;list-style:none;position:relative;width:fit-content}.ono-auto-slider-list-container .ono-auto-slider-list-slider{background:#ccc;left:0;position:absolute;top:0;transform-origin:top left;z-index:0}.ono-auto-slider-list-is-disable{cursor:not-allowed}.ono-avatar-canvas{aspect-ratio:1;overflow:hidden;position:relative}.ono-avatar-canvas .ono-avatar-mask{align-items:center;display:flex;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:100%}.ono-btn-danger,.ono-btn-default,.ono-btn-info,.ono-btn-primary,.ono-btn-success,.ono-btn-warning{--btn-width:0;--btn-height:0;--delay:0.3s;align-items:center;border:none;border-radius:4px;color:#fff;display:flex;font-size:16px;gap:0;justify-content:center;outline:none;padding:2px 15px;transition:gap .3s ease-in-out;white-space:nowrap;width:fit-content}.ono-btn-danger:hover,.ono-btn-default:hover,.ono-btn-info:hover,.ono-btn-primary:hover,.ono-btn-success:hover,.ono-btn-warning:hover{opacity:.9}.ono-btn-danger:focus,.ono-btn-default:focus,.ono-btn-info:focus,.ono-btn-primary:focus,.ono-btn-success:focus,.ono-btn-warning:focus{outline:none}.ono-btn-danger:active,.ono-btn-default:active,.ono-btn-info:active,.ono-btn-primary:active,.ono-btn-success:active,.ono-btn-warning:active{opacity:1}.ono-btn-default{background-color:transparent;border:1px solid #333;color:#333}.ono-btn-primary{background-color:#007bff}.ono-btn-success{background-color:#28a745}.ono-btn-warning{background-color:#ffc107}.ono-btn-danger{background-color:#dc3545}.ono-btn-info{background-color:#909399}.is-loading{opacity:.7}.is-loading .ono-btn-icon{display:grid;grid-template-columns:0fr}.is-round{border-radius:calc(var(--btn-height)/2)}.is-icon{gap:8px}.is-circle{border-radius:50%}.is-disabled{cursor:not-allowed!important;opacity:.5}.ono-btn-icon span{overflow:hidden}.ono-loading-start{animation:loading 1s linear infinite,start var(--delay) ease-in-out forwards}.ono-loading-end{animation:loading 1s linear infinite,end var(--delay) ease-in-out forwards}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes start{0%{grid-template-columns:0fr}to{grid-template-columns:1fr}}@keyframes end{0%{grid-template-columns:1fr}to{grid-template-columns:0fr}}.ono-card{overflow:hidden;transition:all .3s linear,width 0s,height 0s}.ono-card:hover{box-shadow:var(--sd)}.ono-checkbox-border,.ono-checkbox-line{--border-color:#333;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:1px solid var(--border-color);height:20px;outline:none;position:relative;transition:background .1s,border .1s;width:20px}.ono-checkbox-border:checked,.ono-checkbox-line:checked{background:var(--checkedColor)}.ono-checkbox-border:checked:after,.ono-checkbox-line:checked:after{border:calc(var(--w)/8) solid #fff;border-right:none;border-top:none;content:"";height:calc(var(--w)/8*3);left:50%;position:absolute;top:50%;transform:translate(-50%,calc(-50% - var(--w)/24*3)) rotate(-45deg);width:calc(var(--w)/3*2)}.ono-checkbox-border:indeterminate,.ono-checkbox-line:indeterminate{background:var(--indeterminateColor)}.ono-checkbox-border:indeterminate:after,.ono-checkbox-line:indeterminate:after{background:#fff;border-radius:calc(var(--w)/10);content:"";height:calc(var(--w)/7);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:calc(var(--w)/5*3.5)}.ono-checkbox-border:indeterminate:after{background:transparent;border:calc(var(--w)/8) solid #fff;content:"";height:100%;width:100%}.ono-input,.ono-textarea .ono-textarea-wrapper{align-items:center;border-radius:6px;color:#333;display:flex;font-size:16px;line-height:24px;overflow:hidden}.ono-input input[type=password],.ono-textarea .ono-textarea-wrapper input[type=password]{background-color:transparent;border:none;font-family:inherit;font-size:inherit;margin:0;outline:none;padding:0}.ono-input input[type=password]::-ms-clear,.ono-input input[type=password]::-ms-reveal,.ono-textarea .ono-textarea-wrapper input[type=password]::-ms-clear,.ono-textarea .ono-textarea-wrapper input[type=password]::-ms-reveal{display:none}.ono-input input[type=password]::-webkit-inner-spin-button,.ono-input input[type=password]::-webkit-outer-spin-button,.ono-textarea .ono-textarea-wrapper input[type=password]::-webkit-inner-spin-button,.ono-textarea .ono-textarea-wrapper input[type=password]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.ono-input .ono-prepend,.ono-textarea .ono-textarea-wrapper .ono-prepend{background:#d9d9d9;border:1px solid #999;border-radius:6px 0 0 6px;border-right:none;color:inherit;flex-shrink:0;font-size:inherit;line-height:inherit;padding:4px 12px}.ono-input .ono-input-wrapper,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper{align-items:center;background:#f5f5f5;color:inherit;cursor:text;display:flex;font-size:inherit;gap:4px;line-height:inherit;outline:none;padding:4px 12px;width:100%}.ono-input .ono-input-wrapper .ono-append,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-append{align-items:center;color:inherit;display:flex;flex-shrink:0;font-size:inherit;justify-content:center;line-height:inherit}.ono-input .ono-input-wrapper .ono-input-inner,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-input-inner{background:transparent;border:none;color:inherit;cursor:inherit;flex:1;font-size:inherit;line-height:inherit;outline:none}.ono-input .ono-input-wrapper .ono-suffix,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix{align-items:center;color:inherit;display:flex;flex-shrink:0;font-size:inherit;gap:8px;justify-content:center;line-height:inherit}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon{cursor:pointer;height:12px;width:12px}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon{color:#999;height:100%;transition:color .3s;width:100%}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon:hover,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon:hover{color:#666}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon{cursor:pointer;height:16px;width:16px}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon .icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon .icon{color:#999;height:100%;transition:color .3s;width:100%}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon .icon:hover,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon .icon:hover{color:#333}.ono-input .ono-input-wrapper .ono-suffix .ono-count,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-count{color:#999;font-size:inherit;line-height:inherit}.ono-input .ono-append,.ono-textarea .ono-textarea-wrapper .ono-append{background:#d9d9d9;border:1px solid #999;border-left:none;border-radius:0 6px 6px 0;color:inherit;flex-shrink:0;font-size:inherit;line-height:inherit;padding:4px 12px}.ono-textarea{display:flex;flex-direction:column;gap:4px;width:100%}.ono-textarea .ono-textarea-wrapper{background:#f5f5f5;border:1px solid #999;display:initial;flex-shrink:0;min-height:100%;outline:none;padding:0;width:100%}.ono-textarea .ono-textarea-wrapper .ono-textarea-inner{background:none;border:none;border-radius:inherit;color:inherit;display:initial;font-size:inherit;height:100%;line-height:inherit;outline:none;overflow:initial;padding:4px 12px;width:100%}.ono-textarea .ono-count-bar{color:#999;font-size:16px;line-height:24px;text-align:right;width:100%}.ono-input-border .ono-input-wrapper{border:1px solid #999;border-radius:inherit}.ono-input-border:has(.ono-prepend) .ono-input-wrapper{border-bottom-left-radius:0;border-top-left-radius:0}.ono-input-border:has(.ono-append) .ono-input-wrapper{border-bottom-right-radius:0;border-top-right-radius:0}.ono-scrollbar{scrollbar-width:none}.ono-scrollbar::-webkit-scrollbar{width:0}.ono-input-is-focus{border:var(--ono-input-border)!important;box-shadow:var(--ono-input-box-shadow)}.ono-input-is-disabled{background:#d9d9d9;color:#999;cursor:not-allowed;user-select:none}.ono-input-is-disabled .ono-input-wrapper,.ono-input-is-disabled .ono-textarea-wrapper{pointer-events:none}.ono-menu-button{align-items:center;border:none;cursor:pointer;display:flex;flex-direction:column;justify-content:center;margin:0;outline:none;overflow:hidden;padding:0;position:relative;z-index:10}.ono-menu-button span{position:absolute}.ono-message{align-items:center;background:#fff;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.2);color:#333;display:flex;font-size:16px;gap:8px;left:50%;line-height:24px;padding:8px;position:fixed;top:0;transform-origin:top left}.ono-message .ono-type-icon{height:20px;width:20px}.ono-info-icon{height:18px;width:18px}.ono-message-enter{animation:enter var(--speed) ease-in-out forwards}.ono-message-leave{animation:leave var(--speed) ease-in-out forwards;pointer-events:none}.ono-message-success.ono-message-color{background:#f6ffed;border:1px solid #d9f7be;color:#52c41a}.ono-message-warning.ono-message-color{background:#fffbe6;border:1px solid #fff1b8;color:#faad14}.ono-message-error.ono-message-color{background:#fff1f0;border:1px solid #ffccc7;color:#ff4d4f}.ono-message-info.ono-message-color{background:#f5f5f5;border:1px solid #f0f0f0;color:#8c8c8c}.ono-clear-icon{color:#999;height:16px;width:16px}.ono-loading{animation:loading 1s linear infinite}@keyframes enter{0%{opacity:0}to{opacity:1}}@keyframes leave{0%{opacity:1}to{opacity:0}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-modal{--width:416px;--color:#333;--themeColor:#5644b8;--themeHoverColor:#8676de;--themeActiveColor:#352494;--themeDisabledClr:#9587e7;background:transparent}.ono-modal button{background:none;border:none;outline:none;padding:0}.ono-modal-box{--top:0;--left:0;background:#fff;border-radius:6px;color:var(--color);display:flex;flex-direction:column;gap:12px;left:50%;padding:24px;position:fixed;top:50%;transform:translate(-50%,-50%);width:var(--width)}.ono-modal-box-body{display:flex}.ono-modal-box-body-contentBar{align-items:start;display:flex;flex-direction:column;gap:8px;justify-content:start}.ono-modal-box-body-contentBar-title{font-weight:600;line-height:24px}.ono-modal-box-body-contentBar-content{font-size:14px;line-height:22px}.ono-modal-box-footer{align-items:center;display:flex;gap:16px;justify-content:start;margin-left:auto}.ono-modal-box-footer .ono-modal-box-footer-cancelBtn,.ono-modal-box-footer .ono-modal-box-footer-confirmBtn{align-items:center;border-radius:6px;display:flex;justify-content:center;padding:4px 16px;transition:all .2s ease-in-out;user-select:none;width:fit-content}.ono-modal-box-footer-cancelBtn{background:#fff;border:1px solid #ccc;color:#333}.ono-modal-box-footer-cancelBtn:hover{border:1px solid var(--themeHoverColor);color:var(--themeHoverColor)}.ono-modal-box-footer-cancelBtn:active{border:1px solid var(--themeActiveColor);color:var(--themeActiveColor)}.ono-modal-box-footer-cancelBtn:disabled{border:1px solid #ccc;color:#ccc;cursor:no-drop}.ono-modal-box-footer-confirmBtn{background:var(--themeColor);color:#f5f5f5;gap:8px}.ono-modal-box-footer-confirmBtn-loading{animation:loading 1s linear infinite;height:16px;width:16px}.ono-modal-box-footer-confirmBtn:hover{background:var(--themeHoverColor)}.ono-modal-box-footer-confirmBtn:active{background:var(--themeActiveColor)}.ono-modal-box-footer-confirmBtn:disabled{background:var(--themeDisabledClr);cursor:no-drop}.ono-modal::backdrop{backdrop-filter:blur(5px);background:rgba(0,0,0,.5)}.ono-modal-enter{animation:enter .3s forwards}.ono-modal-leave{animation:leave .3s forwards}@keyframes enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-pagination{align-items:center;display:flex;gap:16px;justify-content:center}.ono-pagination-base,.ono-pagination-btn{cursor:pointer;list-style:none;user-select:none}.ono-pagination-btn{align-items:center;aspect-ratio:2/1;background:#ccc;display:flex;justify-content:center;padding:0 10px;width:fit-content}.ono-pagination-btn-active{background:#07c;color:#fff}.ono-radio-group{align-items:flex-start;display:flex;gap:4px;justify-content:flex-start;width:fit-content}.ono-radio-box{align-items:center;display:flex;gap:var(--gap);justify-content:center;width:fit-content}.ono-radio-box .ono-radio{background:var(--unCheckedColor);border:1px solid #424242;border-radius:50%;flex-shrink:0;height:var(--w);position:relative;width:var(--w)}.ono-radio-box .ono-radio input[type=radio]{height:0;opacity:0;width:0}.ono-radio-box .ono-radio:has(input[type=radio]:checked){background:var(--checkedColor)}.ono-radio-box .ono-radio:has(input[type=radio]:checked):after{background-color:#fff;border-radius:50%;content:"";height:50%;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:50%}.ono-select{width:100%}.ono-select .ono-select-arrow-down-icon{color:#666;height:12px;transition:transform .2s linear;width:12px}.ono-select .ono-select-arrow-down-active{transform:rotate(180deg)}.ono-option-container{--tooltip-bg:#fff;box-shadow:0 4px 10px rgba(0,0,0,.1);padding:8px;z-index:9999}.ono-option-container .ono-option-item{background:transparent;border:none;display:block;margin:0;outline:none;padding:0;width:100%}.ono-option-container .ono-option-item .ono-option-item-content,.ono-option-container .ono-option-item .ono-option-item-content-no-data{border-radius:4px;color:#333;font-weight:500;overflow:hidden;padding:4px;text-align:start;text-overflow:ellipsis;white-space:nowrap;width:100%}.ono-option-container .ono-option-item .ono-option-item-content-no-data:hover,.ono-option-container .ono-option-item .ono-option-item-content:hover{background:#ccc}.ono-option-container .ono-option-item .ono-option-item-content-active{color:#5644b8;font-weight:600}.ono-option-container .ono-option-item .ono-option-item-content-disabled{color:#ccc;cursor:not-allowed}.ono-option-container .ono-option-item .ono-option-item-content-disabled:hover,.ono-option-container .ono-option-item .ono-option-item-content-no-data:hover{background:transparent}.ono-select-readonly{cursor:pointer!important}.ono-svg-img{--w:24px;--h:24px;--clr:#fff;height:var(--h);overflow:hidden;width:var(--w)}.ono-svg-img img{filter:drop-shadow(var(--clr) var(--w) 0);height:100%;position:relative;transform:translateX(calc(var(--w)*-1));width:100%}.ono-switch{--checkedClr:#342a7c;--uncheckedClr:rgba(0,0,0,.2)}.ono-switch input[type=checkbox]{height:0;margin:0;opacity:0;position:absolute;width:0}.ono-switch input[type=checkbox]:checked+.ono-switch-box{background-color:var(--checkedClr)}.ono-switch input[type=checkbox]:checked+.ono-switch-box:before{transform:translate(calc(var(--w) - var(--h)))}.ono-switch input[type=checkbox]:checked+.ono-switch-box>.ono-switch-children-bar{transform:translate(calc(var(--h)/8))}.ono-switch.ono-switch-is-disabled .ono-switch-box{cursor:not-allowed;opacity:.6}.ono-switch .ono-switch-box{background-color:var(--uncheckedClr);border-radius:calc(var(--h)/2);cursor:pointer;display:flex;flex-shrink:0;height:var(--h);overflow:hidden;position:relative;width:var(--w)}.ono-switch .ono-switch-box:before{aspect-ratio:1;background:#fff;border-radius:50%;content:"";display:block;left:calc(var(--h)/8);position:absolute;top:calc(var(--h)/8);transition:transform .3s;width:calc(var(--h)*3/4)}.ono-switch .ono-switch-children-bar{display:flex;position:absolute;top:calc(var(--h)/8);transform:translate(calc((var(--w) - var(--h)*9/8)*-1))}.ono-switch .ono-switch-children-bar .ono-switch-children{align-items:center;display:flex;height:calc(var(--h)/4*3);justify-content:center;min-width:fit-content;text-wrap:nowrap;width:calc(var(--w) - var(--h))}.ono-switch .ono-switch-children-bar .ono-switch-slider{aspect-ratio:1;width:calc(var(--h)*3/4)}.ono-dialog-mask{height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:9999}.ono-dialog-mask .ono-dialog{box-shadow:0 0 10px rgba(0,0,0,.3);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.ono-dialog-mask-enter{animation:mask-enter var(--duration) forwards}.ono-dialog-mask-leave{animation:mask-leave var(--duration) forwards}.ono-zoom-enter{animation:zoom-enter var(--duration) forwards}.ono-zoom-leave{animation:zoom-leave var(--duration) forwards}.ono-fade-enter{animation:fade-enter var(--duration) forwards}.ono-fade-leave{animation:fade-leave var(--duration) forwards}@keyframes mask-enter{0%{opacity:0}to{opacity:1}}@keyframes mask-leave{0%{opacity:1}to{opacity:0}}@keyframes zoom-enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes zoom-leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes fade-enter{0%{opacity:0;top:var(--top);transform:translate(-50%,-100%)}to{opacity:1;top:50%;transform:translate(-50%,-50%)}}@keyframes fade-leave{0%{opacity:1;top:50%;transform:translate(-50%,-50%)}to{opacity:0;top:var(--top);transform:translate(-50%,-100%)}}._container_3s92l_1{align-items:center;display:flex;flex-direction:column;gap:20px;height:100vh;left:0;padding:20px;pointer-events:none;position:fixed;top:0;width:100vw}._base_3s92l_15,._promise_3s92l_15{--speed:0.2s;align-items:center;background-color:#fff;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.1);display:flex;gap:8px;height:fit-content;justify-content:center;padding:8px 10px;pointer-events:auto;transform:translateY(0) scale(1);user-select:none;width:fit-content}._enter_3s92l_32{animation:_enter_3s92l_32 var(--speed) forwards}._leave_3s92l_36{animation:_leave_3s92l_36 var(--speed) forwards}._promise_3s92l_15 ._icon_3s92l_40{animation:_loading_3s92l_1 1s linear infinite}@keyframes _enter_3s92l_32{0%{opacity:0;transform:translateY(-80%) scale(.6)}60%{opacity:1;transform:translateY(0) scale(1.1)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes _leave_3s92l_36{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-80%) scale(.6)}}@keyframes _loading_3s92l_1{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-tooltip-popper{background:var(--tooltip-bg,#333);border-radius:4px;color:#fff;font-size:13px;font-weight:700;padding:4px 8px}.ono-tooltip-popper .ono-tooltip-popper-arrow,.ono-tooltip-popper .ono-tooltip-popper-arrow:before{background:inherit;height:8px;position:absolute;width:8px}.ono-tooltip-popper .ono-tooltip-popper-arrow{visibility:hidden}.ono-tooltip-popper .ono-tooltip-popper-arrow:before{content:"";transform:rotate(45deg);visibility:visible}.ono-tooltip-popper[data-popper-placement^=top]>.ono-tooltip-popper-arrow{bottom:-4px}.ono-tooltip-popper[data-popper-placement^=bottom]>.ono-tooltip-popper-arrow{top:-4px}.ono-tooltip-popper[data-popper-placement^=left]>.ono-tooltip-popper-arrow{right:-4px}.ono-tooltip-popper[data-popper-placement^=right]>.ono-tooltip-popper-arrow{left:-4px}.ono-waterfall-container{height:100%;width:100%}.ono-waterfall-content{height:100%;overflow-y:scroll;width:100%}.ono-waterfall-wrapper{position:relative;width:100%}.ono-waterfall-item{left:0;position:absolute;top:0;transform-origin:top left;transition:transform .3s ease-in-out}.ono-waterfall-loading{align-items:center;background:rgba(0,0,0,.502);bottom:0;color:#fff;display:flex;height:100%;justify-content:center;left:0;position:absolute;width:100%;z-index:10}
+:root{--bg-color:pink}.ono-auto-slider-list-container{align-items:center;display:flex;list-style:none;position:relative;width:fit-content}.ono-auto-slider-list-container .ono-auto-slider-list-slider{background:#ccc;left:0;position:absolute;top:0;transform-origin:top left;z-index:0}.ono-auto-slider-list-is-disable{cursor:not-allowed}.ono-avatar-canvas{aspect-ratio:1;overflow:hidden;position:relative}.ono-avatar-canvas .ono-avatar-mask{align-items:center;display:flex;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:100%}.ono-btn-danger,.ono-btn-default,.ono-btn-info,.ono-btn-primary,.ono-btn-success,.ono-btn-warning{--btn-width:0;--btn-height:0;--delay:0.3s;align-items:center;border:none;border-radius:4px;color:#fff;display:flex;font-size:16px;gap:0;justify-content:center;outline:none;padding:2px 15px;transition:gap .3s ease-in-out;white-space:nowrap;width:fit-content}.ono-btn-danger:hover,.ono-btn-default:hover,.ono-btn-info:hover,.ono-btn-primary:hover,.ono-btn-success:hover,.ono-btn-warning:hover{opacity:.9}.ono-btn-danger:focus,.ono-btn-default:focus,.ono-btn-info:focus,.ono-btn-primary:focus,.ono-btn-success:focus,.ono-btn-warning:focus{outline:none}.ono-btn-danger:active,.ono-btn-default:active,.ono-btn-info:active,.ono-btn-primary:active,.ono-btn-success:active,.ono-btn-warning:active{opacity:1}.ono-btn-default{background-color:transparent;border:1px solid #333;color:#333}.ono-btn-primary{background-color:#007bff}.ono-btn-success{background-color:#28a745}.ono-btn-warning{background-color:#ffc107}.ono-btn-danger{background-color:#dc3545}.ono-btn-info{background-color:#909399}.is-loading{opacity:.7}.is-loading .ono-btn-icon{display:grid;grid-template-columns:0fr}.is-round{border-radius:calc(var(--btn-height)/2)}.is-icon{gap:8px}.is-circle{border-radius:50%}.is-disabled{cursor:not-allowed!important;opacity:.5}.ono-btn-icon span{overflow:hidden}.ono-loading-start{animation:loading 1s linear infinite,start var(--delay) ease-in-out forwards}.ono-loading-end{animation:loading 1s linear infinite,end var(--delay) ease-in-out forwards}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes start{0%{grid-template-columns:0fr}to{grid-template-columns:1fr}}@keyframes end{0%{grid-template-columns:1fr}to{grid-template-columns:0fr}}.ono-card{overflow:hidden;transition:all .3s linear,width 0s,height 0s}.ono-card:hover{box-shadow:var(--sd)}.ono-checkbox-border,.ono-checkbox-line{--border-color:#333;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:1px solid var(--border-color);height:20px;outline:none;position:relative;transition:background .1s,border .1s;width:20px}.ono-checkbox-border:checked,.ono-checkbox-line:checked{background:var(--checkedColor)}.ono-checkbox-border:checked:after,.ono-checkbox-line:checked:after{border:calc(var(--w)/8) solid #fff;border-right:none;border-top:none;content:"";height:calc(var(--w)/8*3);left:50%;position:absolute;top:50%;transform:translate(-50%,calc(-50% - var(--w)/24*3)) rotate(-45deg);width:calc(var(--w)/3*2)}.ono-checkbox-border:indeterminate,.ono-checkbox-line:indeterminate{background:var(--indeterminateColor)}.ono-checkbox-border:indeterminate:after,.ono-checkbox-line:indeterminate:after{background:#fff;border-radius:calc(var(--w)/10);content:"";height:calc(var(--w)/7);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:calc(var(--w)/5*3.5)}.ono-checkbox-border:indeterminate:after{background:transparent;border:calc(var(--w)/8) solid #fff;content:"";height:100%;width:100%}.ono-input,.ono-textarea .ono-textarea-wrapper{align-items:center;border-radius:6px;color:#333;display:flex;font-size:16px;line-height:24px;overflow:hidden}.ono-input input[type=password],.ono-textarea .ono-textarea-wrapper input[type=password]{background-color:transparent;border:none;font-family:inherit;font-size:inherit;margin:0;outline:none;padding:0}.ono-input input[type=password]::-ms-clear,.ono-input input[type=password]::-ms-reveal,.ono-textarea .ono-textarea-wrapper input[type=password]::-ms-clear,.ono-textarea .ono-textarea-wrapper input[type=password]::-ms-reveal{display:none}.ono-input input[type=password]::-webkit-inner-spin-button,.ono-input input[type=password]::-webkit-outer-spin-button,.ono-textarea .ono-textarea-wrapper input[type=password]::-webkit-inner-spin-button,.ono-textarea .ono-textarea-wrapper input[type=password]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.ono-input .ono-prepend,.ono-textarea .ono-textarea-wrapper .ono-prepend{background:#d9d9d9;border:1px solid #999;border-radius:6px 0 0 6px;border-right:none;color:inherit;flex-shrink:0;font-size:inherit;line-height:inherit;padding:4px 12px}.ono-input .ono-input-wrapper,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper{align-items:center;background:#f5f5f5;color:inherit;cursor:text;display:flex;font-size:inherit;gap:4px;line-height:inherit;outline:none;padding:4px 12px;width:100%}.ono-input .ono-input-wrapper .ono-append,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-append{align-items:center;color:inherit;display:flex;flex-shrink:0;font-size:inherit;justify-content:center;line-height:inherit}.ono-input .ono-input-wrapper .ono-input-inner,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-input-inner{background:transparent;border:none;color:inherit;cursor:inherit;flex:1;font-size:inherit;line-height:inherit;outline:none}.ono-input .ono-input-wrapper .ono-suffix,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix{align-items:center;color:inherit;display:flex;flex-shrink:0;font-size:inherit;gap:8px;justify-content:center;line-height:inherit}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon{cursor:pointer;height:12px;width:12px}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon{color:#999;height:100%;transition:color .3s;width:100%}.ono-input .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon:hover,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-clear-icon .ono-input-icon:hover{color:#666}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon{cursor:pointer;height:16px;width:16px}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon .icon,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon .icon{color:#999;height:100%;transition:color .3s;width:100%}.ono-input .ono-input-wrapper .ono-suffix .ono-eye-icon .icon:hover,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-eye-icon .icon:hover{color:#333}.ono-input .ono-input-wrapper .ono-suffix .ono-count,.ono-textarea .ono-textarea-wrapper .ono-input-wrapper .ono-suffix .ono-count{color:#999;font-size:inherit;line-height:inherit}.ono-input .ono-append,.ono-textarea .ono-textarea-wrapper .ono-append{background:#d9d9d9;border:1px solid #999;border-left:none;border-radius:0 6px 6px 0;color:inherit;flex-shrink:0;font-size:inherit;line-height:inherit;padding:4px 12px}.ono-textarea{display:flex;flex-direction:column;gap:4px;width:100%}.ono-textarea .ono-textarea-wrapper{background:#f5f5f5;border:1px solid #999;display:initial;flex-shrink:0;min-height:100%;outline:none;padding:0;width:100%}.ono-textarea .ono-textarea-wrapper .ono-textarea-inner{background:none;border:none;border-radius:inherit;color:inherit;display:initial;font-size:inherit;height:100%;line-height:inherit;outline:none;overflow:initial;padding:4px 12px;width:100%}.ono-textarea .ono-count-bar{color:#999;font-size:16px;line-height:24px;text-align:right;width:100%}.ono-input-border .ono-input-wrapper{border:1px solid #999;border-radius:inherit}.ono-input-border:has(.ono-prepend) .ono-input-wrapper{border-bottom-left-radius:0;border-top-left-radius:0}.ono-input-border:has(.ono-append) .ono-input-wrapper{border-bottom-right-radius:0;border-top-right-radius:0}.ono-scrollbar{scrollbar-width:none}.ono-scrollbar::-webkit-scrollbar{width:0}.ono-input-is-focus{border:var(--ono-input-border)!important;box-shadow:var(--ono-input-box-shadow)}.ono-input-is-disabled{background:#d9d9d9;color:#999;cursor:not-allowed;user-select:none}.ono-input-is-disabled .ono-input-wrapper,.ono-input-is-disabled .ono-textarea-wrapper{pointer-events:none}.ono-menu-button{align-items:center;border:none;cursor:pointer;display:flex;flex-direction:column;justify-content:center;margin:0;outline:none;overflow:hidden;padding:0;position:relative;z-index:10}.ono-menu-button span{position:absolute}.ono-message{align-items:center;background:#fff;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.2);color:#333;display:flex;font-size:16px;gap:8px;left:50%;line-height:24px;padding:8px;position:fixed;top:0;transform-origin:top left}.ono-message .ono-type-icon{height:20px;width:20px}.ono-info-icon{height:18px;width:18px}.ono-message-enter{animation:enter var(--speed) ease-in-out forwards}.ono-message-leave{animation:leave var(--speed) ease-in-out forwards;pointer-events:none}.ono-message-success.ono-message-color{background:#f6ffed;border:1px solid #d9f7be;color:#52c41a}.ono-message-warning.ono-message-color{background:#fffbe6;border:1px solid #fff1b8;color:#faad14}.ono-message-error.ono-message-color{background:#fff1f0;border:1px solid #ffccc7;color:#ff4d4f}.ono-message-info.ono-message-color{background:#f5f5f5;border:1px solid #f0f0f0;color:#8c8c8c}.ono-clear-icon{color:#999;height:16px;width:16px}.ono-loading{animation:loading 1s linear infinite}@keyframes enter{0%{opacity:0}to{opacity:1}}@keyframes leave{0%{opacity:1}to{opacity:0}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-modal{--width:416px;--color:#333;--themeColor:#5644b8;--themeHoverColor:#8676de;--themeActiveColor:#352494;--themeDisabledClr:#9587e7;background:transparent}.ono-modal-box{--top:0;--left:0;background:#fff;border-radius:6px;color:var(--color);display:flex;flex-direction:column;gap:12px;left:50%;padding:24px;position:fixed;top:50%;transform:translate(-50%,-50%);width:var(--width)}.ono-modal-box-body{display:flex}.ono-modal-box-body-contentBar{align-items:start;display:flex;flex-direction:column;gap:8px;justify-content:start}.ono-modal-box-body-contentBar-title{font-weight:600;line-height:24px}.ono-modal-box-body-contentBar-content{font-size:14px;line-height:22px}.ono-modal-box-footer{align-items:center;display:flex;gap:16px;justify-content:start;margin-left:auto}.ono-modal-box-footer .ono-modal-box-footer-cancelBtn,.ono-modal-box-footer .ono-modal-box-footer-confirmBtn{align-items:center;border-radius:6px;display:flex;justify-content:center;outline:none;padding:4px 16px;transition:all .2s ease-in-out;user-select:none;width:fit-content}.ono-modal-box-footer-cancelBtn{background:#fff;border:1px solid #ccc;color:#333}.ono-modal-box-footer-cancelBtn:hover{border:1px solid var(--themeHoverColor);color:var(--themeHoverColor)}.ono-modal-box-footer-cancelBtn:active{border:1px solid var(--themeActiveColor);color:var(--themeActiveColor)}.ono-modal-box-footer-cancelBtn:disabled{border:1px solid #ccc;color:#ccc;cursor:no-drop}.ono-modal-box-footer-confirmBtn{background:var(--themeColor);border:none;color:#f5f5f5;gap:8px}.ono-modal-box-footer-confirmBtn-loading{animation:loading 1s linear infinite;height:16px;width:16px}.ono-modal-box-footer-confirmBtn:hover{background:var(--themeHoverColor)}.ono-modal-box-footer-confirmBtn:active{background:var(--themeActiveColor)}.ono-modal-box-footer-confirmBtn:disabled{background:var(--themeDisabledClr);cursor:no-drop}.ono-modal::backdrop{backdrop-filter:blur(5px);background:rgba(0,0,0,.5)}.ono-modal-enter{animation:enter .3s forwards}.ono-modal-leave{animation:leave .3s forwards}@keyframes enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes loading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-pagination{align-items:center;display:flex;gap:16px;justify-content:center}.ono-pagination-base,.ono-pagination-btn{cursor:pointer;list-style:none;user-select:none}.ono-pagination-btn{align-items:center;aspect-ratio:2/1;background:#ccc;display:flex;justify-content:center;padding:0 10px;width:fit-content}.ono-pagination-btn-active{background:#07c;color:#fff}.ono-radio-group{align-items:flex-start;display:flex;gap:4px;justify-content:flex-start;width:fit-content}.ono-radio-box{align-items:center;display:flex;gap:var(--gap);justify-content:center;width:fit-content}.ono-radio-box .ono-radio{background:var(--unCheckedColor);border:1px solid #424242;border-radius:50%;flex-shrink:0;height:var(--w);position:relative;width:var(--w)}.ono-radio-box .ono-radio input[type=radio]{height:0;opacity:0;width:0}.ono-radio-box .ono-radio:has(input[type=radio]:checked){background:var(--checkedColor)}.ono-radio-box .ono-radio:has(input[type=radio]:checked):after{background-color:#fff;border-radius:50%;content:"";height:50%;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:50%}.ono-select{width:100%}.ono-select .ono-select-arrow-down-icon{color:#666;height:12px;transition:transform .2s linear;width:12px}.ono-select .ono-select-arrow-down-active{transform:rotate(180deg)}.ono-option-container{--tooltip-bg:#fff;box-shadow:0 4px 10px rgba(0,0,0,.1);padding:8px;z-index:9999}.ono-option-container .ono-option-item{background:transparent;border:none;display:block;margin:0;outline:none;padding:0;width:100%}.ono-option-container .ono-option-item .ono-option-item-content,.ono-option-container .ono-option-item .ono-option-item-content-no-data{border-radius:4px;color:#333;font-weight:500;overflow:hidden;padding:4px;text-align:start;text-overflow:ellipsis;white-space:nowrap;width:100%}.ono-option-container .ono-option-item .ono-option-item-content-no-data:hover,.ono-option-container .ono-option-item .ono-option-item-content:hover{background:#ccc}.ono-option-container .ono-option-item .ono-option-item-content-active{color:#5644b8;font-weight:600}.ono-option-container .ono-option-item .ono-option-item-content-disabled{color:#ccc;cursor:not-allowed}.ono-option-container .ono-option-item .ono-option-item-content-disabled:hover,.ono-option-container .ono-option-item .ono-option-item-content-no-data:hover{background:transparent}.ono-select-readonly{cursor:pointer!important}.ono-svg-img{--w:24px;--h:24px;--clr:#fff;height:var(--h);overflow:hidden;width:var(--w)}.ono-svg-img img{filter:drop-shadow(var(--clr) var(--w) 0);height:100%;position:relative;transform:translateX(calc(var(--w)*-1));width:100%}.ono-switch{--checkedClr:#342a7c;--uncheckedClr:rgba(0,0,0,.2)}.ono-switch input[type=checkbox]{height:0;margin:0;opacity:0;position:absolute;width:0}.ono-switch input[type=checkbox]:checked+.ono-switch-box{background-color:var(--checkedClr)}.ono-switch input[type=checkbox]:checked+.ono-switch-box:before{transform:translate(calc(var(--w) - var(--h)))}.ono-switch input[type=checkbox]:checked+.ono-switch-box>.ono-switch-children-bar{transform:translate(calc(var(--h)/8))}.ono-switch.ono-switch-is-disabled .ono-switch-box{cursor:not-allowed;opacity:.6}.ono-switch .ono-switch-box{background-color:var(--uncheckedClr);border-radius:calc(var(--h)/2);cursor:pointer;display:flex;flex-shrink:0;height:var(--h);overflow:hidden;position:relative;width:var(--w)}.ono-switch .ono-switch-box:before{aspect-ratio:1;background:#fff;border-radius:50%;content:"";display:block;left:calc(var(--h)/8);position:absolute;top:calc(var(--h)/8);transition:transform .3s;width:calc(var(--h)*3/4)}.ono-switch .ono-switch-children-bar{display:flex;position:absolute;top:calc(var(--h)/8);transform:translate(calc((var(--w) - var(--h)*9/8)*-1))}.ono-switch .ono-switch-children-bar .ono-switch-children{align-items:center;display:flex;height:calc(var(--h)/4*3);justify-content:center;min-width:fit-content;text-wrap:nowrap;width:calc(var(--w) - var(--h))}.ono-switch .ono-switch-children-bar .ono-switch-slider{aspect-ratio:1;width:calc(var(--h)*3/4)}.ono-dialog-mask{height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:9999}.ono-dialog-mask .ono-dialog{box-shadow:0 0 10px rgba(0,0,0,.3);left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.ono-dialog-mask-enter{animation:mask-enter var(--duration) forwards}.ono-dialog-mask-leave{animation:mask-leave var(--duration) forwards}.ono-zoom-enter{animation:zoom-enter var(--duration) forwards}.ono-zoom-leave{animation:zoom-leave var(--duration) forwards}.ono-fade-enter{animation:fade-enter var(--duration) forwards}.ono-fade-leave{animation:fade-leave var(--duration) forwards}@keyframes mask-enter{0%{opacity:0}to{opacity:1}}@keyframes mask-leave{0%{opacity:1}to{opacity:0}}@keyframes zoom-enter{0%{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}to{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}}@keyframes zoom-leave{0%{left:50%;opacity:1;top:50%;transform:translate(-50%,-50%) scale(1)}to{left:var(--left);opacity:0;top:var(--top);transform:translate(-50%,-50%) scale(0)}}@keyframes fade-enter{0%{opacity:0;top:var(--top);transform:translate(-50%,-100%)}to{opacity:1;top:50%;transform:translate(-50%,-50%)}}@keyframes fade-leave{0%{opacity:1;top:50%;transform:translate(-50%,-50%)}to{opacity:0;top:var(--top);transform:translate(-50%,-100%)}}._container_3s92l_1{align-items:center;display:flex;flex-direction:column;gap:20px;height:100vh;left:0;padding:20px;pointer-events:none;position:fixed;top:0;width:100vw}._base_3s92l_15,._promise_3s92l_15{--speed:0.2s;align-items:center;background-color:#fff;border-radius:6px;box-shadow:0 4px 8px rgba(0,0,0,.1);display:flex;gap:8px;height:fit-content;justify-content:center;padding:8px 10px;pointer-events:auto;transform:translateY(0) scale(1);user-select:none;width:fit-content}._enter_3s92l_32{animation:_enter_3s92l_32 var(--speed) forwards}._leave_3s92l_36{animation:_leave_3s92l_36 var(--speed) forwards}._promise_3s92l_15 ._icon_3s92l_40{animation:_loading_3s92l_1 1s linear infinite}@keyframes _enter_3s92l_32{0%{opacity:0;transform:translateY(-80%) scale(.6)}60%{opacity:1;transform:translateY(0) scale(1.1)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes _leave_3s92l_36{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-80%) scale(.6)}}@keyframes _loading_3s92l_1{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ono-tooltip-popper{background:var(--tooltip-bg,#333);border-radius:4px;color:#fff;font-size:13px;font-weight:700;padding:4px 8px}.ono-tooltip-popper .ono-tooltip-popper-arrow,.ono-tooltip-popper .ono-tooltip-popper-arrow:before{background:inherit;height:8px;position:absolute;width:8px}.ono-tooltip-popper .ono-tooltip-popper-arrow{visibility:hidden}.ono-tooltip-popper .ono-tooltip-popper-arrow:before{content:"";transform:rotate(45deg);visibility:visible}.ono-tooltip-popper[data-popper-placement^=top]>.ono-tooltip-popper-arrow{bottom:-4px}.ono-tooltip-popper[data-popper-placement^=bottom]>.ono-tooltip-popper-arrow{top:-4px}.ono-tooltip-popper[data-popper-placement^=left]>.ono-tooltip-popper-arrow{right:-4px}.ono-tooltip-popper[data-popper-placement^=right]>.ono-tooltip-popper-arrow{left:-4px}.ono-waterfall-container{height:100%;width:100%}.ono-waterfall-content{height:100%;overflow-y:scroll;width:100%}.ono-waterfall-wrapper{position:relative;width:100%}.ono-waterfall-item{left:0;position:absolute;top:0;transform-origin:top left;transition:transform .3s ease-in-out}.ono-waterfall-loading{align-items:center;background:rgba(0,0,0,.502);bottom:0;color:#fff;display:flex;height:100%;justify-content:center;left:0;position:absolute;width:100%;z-index:10}

package/dist/umd/index.umd.cjs

@@ -16423,7 +16423,7 @@
       var _a;
       return (_a = p2.current) == null ? void 0 : _a.click();
     }, children: d.jsxs("div", { ref: h2, className: "ono-switch-children-bar", children: [(n2 == null ? void 0 : n2.active) && d.jsx("div", { ref: m2, className: "ono-switch-children", children: n2 == null ? void 0 : n2.active }), d.jsx("div", { className: "ono-switch-slider" }), (n2 == null ? void 0 : n2.inactive) && d.jsx("div", { ref: g2, className: "ono-switch-children", children: n2 == null ? void 0 : n2.inactive })] }) })] });
-  }, e.TemplateDialog = ({ children: e2, animation: n2, className: r2, duration: a2 = 300, style: o2, maskColor: l2 = "rgba(0, 0, 0, 0.5)", disableContextMenu: i2, clickMaskClose: s2 = true, dialogClose: u2 }) => {
+  }, e.TemplateDialog = ({ children: e2, animation: n2, className: r2, duration: a2 = 300, style: o2, maskColor: l2 = "rgba(0, 0, 0, 0.5)", disableContextMenu: i2, maskClickClose: s2 = true, dialogClose: u2 }) => {
     const [c2, f2] = t.useState(false), p2 = t.useRef(null), h2 = () => {
       if (p2.current) if (f2(true), n2) {
         const e3 = p2.current;
@@ -16564,7 +16564,13 @@
         i2.current && (clearTimeout(i2.current), i2.current = null);
       };
     }, [o2, r2, u2]), [r2, s2, u2];
-  }, e.useEventListener = f, e.useGetElementSize = h, e.useKeyPress = g, e.useTheme = b, e.useThemePro = (e2) => {
+  }, e.useEventListener = f, e.useGetElementSize = h, e.useKeyPress = g, e.useMouseClick = () => {
+    const [e2, n2] = t.useState({ clientX: 0, clientY: 0, screenX: 0, screenY: 0, pageX: 0, pageY: 0 });
+    return f("click", (e3) => {
+      const t2 = e3.clientX, r2 = e3.clientY, a2 = e3.screenX, o2 = e3.screenY, l2 = e3.pageX, i2 = e3.pageY;
+      n2({ clientX: t2, clientY: r2, screenX: a2, screenY: o2, pageX: l2, pageY: i2 });
+    }), e2;
+  }, e.useTheme = b, e.useThemePro = (e2) => {
     const { initTheme: n2 = "light", themeRules: r2 = (e3) => {
       e3 ? document.documentElement.classList.add("dark") : document.documentElement.classList.remove("dark");
     } } = e2 || Object.assign({}), [a2, o2] = t.useState(n2), l2 = t.useRef(null);

package/package.json

@@ -1,14 +1,15 @@
 {
   "name": "ono-react-element",
   "private": false,
-  "version": "0.0.11",
+  "version": "0.0.12",
   "description": "Component library by React + Typescript",
   "type": "module",
   "main": "./dist/umd/index.umd.cjs",
   "module": "./dist/es/index.js",
   "types": "./dist/index.d.ts",
   "files": [
-    "dist"
+    "dist",
+    "LICENSE.md"
   ],
   "exports": {
     ".": {

package/dist/es/InjunctiveBox-D0V-K9Pn.js

@@ -1,11 +0,0 @@
-import { j as o, R as e } from "./dependencies-CbQbPZZ-.js";
-import { a as n } from "./hooks-Dew3_cmY.js";
-let s, l = null;
-const t = ({ className: e2, content: s2, style: t2, onClick: u2, onDoubleClick: c2, onContextMenu: i, onMouseDown: a, onMouseUp: r, onMouseEnter: M, onMouseLeave: d, onMouseMove: m, isClickBoxToClose: p }) => (n("click", () => {
-  p && l && (l.remove(), l = null);
-}), o.jsx("div", { className: e2, style: t2, onClick: u2, onDoubleClick: c2, onContextMenu: i, onMouseDown: a, onMouseUp: r, onMouseEnter: M, onMouseLeave: d, onMouseMove: m, children: "function" == typeof s2 ? s2((o2) => {
-  l && (l.remove(), l = null, o2 && o2());
-}) : s2 })), u = (e2) => (c(e2.isSingle || false).render(o.jsx(t, { ...e2 })), l), c = (o2) => (o2 && l && s || (l = document.createElement("div"), document.body.appendChild(l), s = e.createRoot(l)), s);
-export {
-  u as i
-};

package/dist/es/Tooltip-C5OFmxWo.js

@@ -1,29 +0,0 @@
-import { j as e } from "./dependencies-CbQbPZZ-.js";
-import { createPopper as r } from "@popperjs/core";
-import { useState as t, useRef as n, useEffect as o } from "react";
-import { c } from "./hooks-Dew3_cmY.js";
-let s = null, l = null;
-const p = ({ children: p2, content: i, onOpenChange: u, trigger: a = "hover", placement: m = "top", popperOptions: d = {}, className: f, style: h, isShowArrow: w = true, sameWidth: x, autoAdjustOverflow: j = true }) => {
-  const [v, y] = t(false), g = n(null), k = n(null), b = (e2) => {
-    u == null ? void 0 : u(e2), y(e2);
-  };
-  return c(k, () => {
-    "click" !== a && "contextmenu" !== a || b(false);
-  }, { event: ["click", "contextmenu"], deps: [a, u] }), o(() => {
-    (() => {
-      if (!k.current) return;
-      const e2 = Array.from(k.current.children);
-      if (e2.length > 1) throw new Error("Tooltip only support one child");
-      k.current.style.width = e2[0].getBoundingClientRect().width + "px";
-    })();
-  }, [k, p2]), o(() => {
-    k.current && ("hover" === a ? (k.current.onmouseenter = () => b(true), k.current.onmouseleave = () => b(false)) : "click" === a ? k.current.onclick = () => b(!v) : "focus" === a ? (k.current.onfocus = () => b(true), k.current.onblur = () => b(false)) : k.current.oncontextmenu = () => b(!v)), v && k.current && g.current ? l = r(k.current, g.current, { placement: m, modifiers: [{ name: "offset", options: { offset: [0, 6] } }, x ? { name: "sameWidth", enabled: true, phase: "beforeWrite", requires: ["computeStyles"], fn({ state: e2 }) {
-      e2.styles.popper.width = `${e2.rects.reference.width}px`;
-    }, effect({ state: e2 }) {
-      e2.elements.popper.style.width = `${e2.elements.reference.offsetWidth}px`;
-    } } : {}, j ? { name: "flip", enabled: true } : {}], ...d }) : l && (l.destroy(), l = null, s && s.remove(), s = null);
-  }, [v, k, g]), e.jsxs(e.Fragment, { children: [v && e.jsxs("div", { ref: g, style: h, className: ["ono-tooltip-popper", f].join(" "), "data-popper-placement": d.placement || m, children: [e.jsx("div", { children: i instanceof Function ? i() : i }), w && e.jsx("div", { className: "ono-tooltip-popper-arrow", "data-popper-arrow": true })] }), e.jsx("div", { ref: k, children: p2 instanceof Function ? p2() : p2 })] });
-};
-export {
-  p as T
-};

package/dist/es/hooks-Dew3_cmY.js

@@ -1,103 +0,0 @@
-import { useEffect as e, useState as t, useRef as n, useCallback as r } from "react";
-import { v as o } from "./utils-BxXROOPY.js";
-const i = (t2, n2, r2) => {
-  const { target: o2, deps: i2, isDeferred: s2 } = r2 || {}, c2 = (e2) => n2(e2);
-  return e(() => ("string" == typeof t2 ? !s2 && (o2 || window).addEventListener(t2, c2) : t2.forEach((e2) => !s2 && (o2 || window).addEventListener(e2, c2)), () => {
-    "string" == typeof t2 ? (o2 || window).removeEventListener(t2, c2) : t2.forEach((e2) => (o2 || window).removeEventListener(e2, c2));
-  }), [o2, ...i2 || []]), s2 ? () => {
-    "string" == typeof t2 ? (o2 || window).addEventListener(t2, c2) : t2.forEach((e2) => (o2 || window).addEventListener(e2, c2));
-  } : void 0;
-}, s = (e2, t2, n2) => i(((e3) => {
-  const t3 = "string" == typeof e3 ? [e3] : e3;
-  if (new Set(t3).size !== t3.length) throw new Error("there are duplicates in the event type");
-  return t3;
-})((n2 == null ? void 0 : n2.event) || "click"), (n3) => {
-  if (e2) if (e2 instanceof Array) e2.map((e3) => e3 instanceof HTMLElement ? e3 : e3.current).some((e3) => !!e3 && e3.contains(n3.target)) || t2(n3);
-  else {
-    const r2 = e2 instanceof HTMLElement ? e2 : e2.current;
-    r2 && !r2.contains(n3.target) && t2(n3);
-  }
-}, { deps: [e2, ...(n2 == null ? void 0 : n2.deps) || []] }), c = (o2 = 60, i2) => {
-  const [s2, c2] = t(o2), [a2, l2] = t(false), d2 = n(null), u2 = r(() => l2(true), []), m2 = r(() => {
-    l2(false), c2(o2), d2.current && (clearTimeout(d2.current), d2.current = null), i2 == null ? void 0 : i2();
-  }, [o2, i2]);
-  return e(() => {
-    if (a2) return s2 > 0 ? d2.current = setTimeout(() => {
-      c2((e2) => e2 - 1);
-    }, 1e3) : m2(), () => {
-      d2.current && (clearTimeout(d2.current), d2.current = null);
-    };
-  }, [a2, s2, m2]), [s2, u2, m2];
-}, a = (n2) => {
-  const [r2, o2] = t({ w: 0, h: 0 }), i2 = new ResizeObserver((e2) => {
-    for (const t2 of e2) o2({ w: t2.borderBoxSize[0].inlineSize, h: t2.borderBoxSize[0].blockSize });
-  }), s2 = () => {
-    if (n2 && "function" != typeof n2) i2.observe(n2 instanceof HTMLElement ? n2 : n2.current);
-    else if (n2 && "function" == typeof n2) {
-      const e2 = n2();
-      i2.observe(e2 instanceof HTMLElement ? e2 : e2.current);
-    } else o2({ w: window.innerWidth, h: window.innerHeight });
-  };
-  return e(() => (s2(), window.addEventListener("resize", s2), () => {
-    if (window.removeEventListener("resize", s2), n2 && "function" != typeof n2) i2.unobserve(n2 instanceof HTMLElement ? n2 : n2.current);
-    else if (n2 && "function" == typeof n2) {
-      const e2 = n2();
-      i2.unobserve(e2 instanceof HTMLElement ? e2 : e2.current);
-    }
-  }), [n2]), r2;
-}, l = (e2) => e2.toString().toLocaleLowerCase(), d = (e2, t2, n2) => {
-  const r2 = (r3) => i(r3, (r4) => ((e3, n3, r5) => {
-    e3.forEach((e4) => {
-      if (e4.includes("+") && e4.length > 1) {
-        const r6 = e4.split("+"), o2 = n3.ctrlKey && r6.includes("ctrl"), i2 = n3.shiftKey && r6.includes("shift"), s2 = n3.altKey && r6.includes("alt"), c2 = n3.metaKey && r6.includes("meta"), a2 = (n3.ctrlKey || n3.metaKey) && r6.includes("commandorcontrol");
-        2 === r6.length ? (o2 || i2 || s2 || c2 || a2) && n3.key.toLocaleLowerCase() === r6[r6.length - 1] && t2(n3, e4) : 3 === r6.length && (o2 && i2 || o2 && s2 || o2 && c2 || o2 && a2 || i2 && s2 || i2 && c2 || i2 && a2 || s2 && c2 || s2 && a2 || c2 && a2) && n3.key.toLocaleLowerCase() === r6[r6.length - 1] && t2(n3, e4);
-      } else if (e4.includes(l(n3.key))) {
-        if (r5) e4 === l(n3.key) && t2(n3, e4);
-        else if (!(n3.ctrlKey || n3.metaKey || n3.shiftKey || n3.altKey)) return t2(n3, e4);
-      }
-    });
-  })(e2 instanceof Array ? e2.map((e3) => l(e3)) : [l(e2)], r4, (n2 == null ? void 0 : n2.exactMatch) || false), { deps: [n2 == null ? void 0 : n2.target, ...(n2 == null ? void 0 : n2.deps) || []] });
-  (n2 == null ? void 0 : n2.events) instanceof Array ? n2.events.forEach((e3) => r2(e3)) : r2((n2 == null ? void 0 : n2.events) || "keydown");
-};
-let u = false;
-const m = ({ theme: t2, onDark: n2, onLight: r2 }) => {
-  const o2 = window.matchMedia("(prefers-color-scheme: dark)"), i2 = () => {
-    o2.matches ? n2() : r2();
-  };
-  e(() => {
-    (() => {
-      switch (u && (u = false, o2.removeEventListener("change", i2)), t2) {
-        case "light":
-          r2();
-          break;
-        case "dark":
-          n2();
-          break;
-        default:
-          i2(), u = true, o2.addEventListener("change", i2);
-      }
-    })();
-  }, [t2]);
-}, f = (e2) => {
-  const { initTheme: r2 = "light", themeRules: i2 = (e3) => {
-    e3 ? document.documentElement.classList.add("dark") : document.documentElement.classList.remove("dark");
-  } } = e2 || Object.assign({}), [s2, c2] = t(r2), a2 = n(null);
-  return m({ theme: s2, onDark: () => {
-    a2.current ? o.changeThemeClipPathCircle({ element: a2.current, onChangeTheme: () => i2(true) }) : i2(true);
-  }, onLight: () => {
-    a2.current ? o.changeThemeClipPathCircle({ element: a2.current, onChangeTheme: () => i2(false) }) : i2(false);
-  } }), [s2, ({ targetTheme: e3, element: t2, onChange: n2 }) => {
-    a2.current = t2 || null, requestAnimationFrame(() => {
-      n2 == null ? void 0 : n2(), c2(e3);
-    });
-  }];
-};
-export {
-  i as a,
-  d as b,
-  s as c,
-  c as d,
-  m as e,
-  f,
-  a as u
-};