reaxify 0.0.98 → 1.3.0

package/dist/components/Tabs/index.es.js

@@ -1,102 +1,112 @@
 "use client";
-import { jsx as u } from "react/jsx-runtime";
-import { createContext as I, useState as T, useContext as h, useRef as P, useCallback as A, useEffect as B, useMemo as G, Fragment as R } from "react";
+import { jsx as c } from "react/jsx-runtime";
+import { createContext as I, useState as T, useContext as y, useRef as P, useCallback as A, useEffect as B, useMemo as G, Fragment as R } from "react";
 import { twMerge as S } from "../../node_modules/tailwind-merge/dist/bundle-mjs.es.js";
-import g from "../../helpers/cn.es.js";
-import f from "../../hooks/useClasses.es.js";
 import $ from "../Button/index.es.js";
 import k from "../ButtonGroup/index.es.js";
-const p = I({
+import b from "../../hooks/useClasses.es.js";
+import C from "../../helpers/cn.es.js";
+const m = I({
   active: null,
   onChange: () => {
   }
 });
-function m({ active: o = null, onChange: t = () => {
+function x({ active: n = null, onChange: t = () => {
 }, children: s }) {
-  return /* @__PURE__ */ u(p.Provider, { value: { active: o, onChange: t }, children: s });
+  return /* @__PURE__ */ c(m.Provider, { value: { active: n, onChange: t }, children: s });
 }
 function q({
-  className: o,
+  className: n,
   ...t
 }) {
-  const [s, a] = T(!1), c = f((e) => e.tabs.indicator.base), { active: b } = h(p), l = P(null), d = A(() => {
-    const e = l.current, n = e == null ? void 0 : e.parentElement, r = n == null ? void 0 : n.querySelector("button[data-active='true']");
-    if (!n || !r || !e) return;
-    const i = (r == null ? void 0 : r.offsetLeft) ?? 0, v = window.getComputedStyle(r).paddingInline, w = (r == null ? void 0 : r.getBoundingClientRect().width) ?? 0, y = i, C = w;
-    e.style.setProperty("--left", `${y}px`), e.style.setProperty("--width", `${C}px`), e.style.setProperty("--padding-x", `${v}`);
+  const [s, r] = T(!1), l = b((e) => e.tabs.indicator.base), { active: h } = y(m), f = P(null), p = A(() => {
+    const e = f.current, u = e == null ? void 0 : e.parentElement, o = u == null ? void 0 : u.querySelector("button[data-active='true']");
+    if (!u || !o || !e) return;
+    const d = (o == null ? void 0 : o.offsetLeft) ?? 0, a = window.getComputedStyle(o).paddingInline, g = (o == null ? void 0 : o.getBoundingClientRect().width) ?? 0, w = d, i = g;
+    e.style.setProperty("--left", `${w}px`), e.style.setProperty("--width", `${i}px`), e.style.setProperty("--padding-x", `${a}`);
   }, []);
   return B(() => {
-    d(), requestAnimationFrame(() => a(!0));
-  }, [d, b]), /* @__PURE__ */ u(
+    p(), requestAnimationFrame(() => r(!0));
+  }, [p, h]), /* @__PURE__ */ c(
     "span",
     {
-      ref: l,
+      ref: f,
+      "data-button-group-skip": !0,
+      "data-name": "tabs-indicator",
       className: S(
         "absolute bottom-0 left-(--left,0px) rtl:left-(--left,100%) w-(--width,0px) px-(--padding-x,0px) h-px overflow-hidden",
         s ? "transition-[width,left,padding]" : "",
-        c,
-        o
+        l,
+        n
       ),
       ...t,
-      children: /* @__PURE__ */ u("span", { className: "block size-full rounded-full bg-primary" })
+      children: /* @__PURE__ */ c("span", { className: "block size-full rounded-full bg-primary" })
     }
   );
 }
 function E({
-  className: o,
+  className: n,
   children: t,
   ...s
 }) {
-  const a = f((c) => c.tabs.buttonGroup.base);
-  return /* @__PURE__ */ u(
+  const r = b((l) => l.tabs.buttonGroup.base);
+  return /* @__PURE__ */ c(
     k,
     {
       as: "div",
-      className: g("relative flex items-center", a, o),
+      "data-name": "tabs-button-group",
+      className: C("relative flex items-center", r, n),
       ...s,
       children: t
     }
   );
 }
 function F({
-  eventKey: o,
+  eventKey: n,
   className: t,
   children: s,
-  onClick: a,
-  ...c
+  onClick: r,
+  variant: l = "text",
+  color: h,
+  size: f,
+  loading: p,
+  ...e
 }) {
-  const b = f((i) => i.tabs.button.base), l = f((i) => i.tabs.button.active), { active: d, onChange: e } = h(p), n = o === d, x = G(() => typeof t == "function" ? t({ isActive: n }) : t, [n, t]);
-  return /* @__PURE__ */ u(
+  const u = b((i) => i.tabs.button.base), v = b((i) => i.tabs.button.active), { active: o, onChange: d } = y(m), a = n === o, g = G(() => typeof t == "function" ? t({ isActive: a }) : t, [a, t]), w = (i) => {
+    a || d == null || d(n), r == null || r(i);
+  };
+  return /* @__PURE__ */ c(
     $,
     {
       as: "button",
       type: "button",
-      "data-active": n,
-      onClick: (i) => {
-        !n && e(o), a == null || a(i);
-      },
-      color: n ? "primary" : "dark",
-      variant: "text",
-      className: g(
+      "data-active": a,
+      "data-name": "tabs-button",
+      variant: l,
+      color: h ?? (a ? "primary" : "dark"),
+      size: f,
+      loading: p,
+      className: C(
         "shadow-none border-none",
-        b,
-        n && l,
-        x
+        u,
+        a && v,
+        g
       ),
-      ...c,
+      onClick: w,
+      ...e,
       children: s
     }
   );
 }
-function L({ eventKey: o, children: t }) {
-  const { active: s } = h(p);
-  return s !== o ? null : /* @__PURE__ */ u(R, { children: t });
+function L({ eventKey: n, children: t }) {
+  const { active: s } = y(m);
+  return s !== n ? null : /* @__PURE__ */ c(R, { children: t });
 }
-m.Indicator = q;
-m.ButtonGroup = E;
-m.Button = F;
-m.Item = L;
+x.Indicator = q;
+x.ButtonGroup = E;
+x.Button = F;
+x.Item = L;
 export {
-  p as TabsContext,
-  m as default
+  m as TabsContext,
+  x as default
 };

package/dist/components/Toggle/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("react/jsx-runtime"),e=require("react"),P=require("../../helpers/anchorPointer.cjs.js"),M=e.createContext(null),h=e.createContext(null);function E(...t){return l=>{t.forEach(r=>{typeof r=="function"?r(l):r&&(r.current=l)})}}function j(){const t=e.useContext(M),l=e.useContext(h);if(!t||!l)throw new Error("useToggleContext must be used within Toggle");return{...t,...l}}function k(){const t=e.useContext(M);if(!t)throw new Error("Toggle subcomponents must be used within Toggle");return t}function w(){const t=e.useContext(h);if(!t)throw new Error("Toggle subcomponents must be used within Toggle");return t}function v({defaultOpen:t=!1,open:l,onOpenChange:r,anchor:i=!1,triggerOn:u="click",ref:a,children:g}){const[s,x]=e.useState(t),[p,d]=e.useState(null),f=l!==void 0,n=f?l:s,o=e.useCallback(m=>{f||x(m),m||d(null),r==null||r(m)},[f,r]),c=e.useCallback(()=>{o(!0)},[o]),C=e.useCallback(()=>{o(!1)},[o]),T=e.useCallback(()=>{o(!n)},[n,o]);e.useImperativeHandle(a,()=>({open:c,close:C,toggle:T}));const S=e.useMemo(()=>({open:n,anchorEl:p,anchor:i,triggerOn:u}),[n,p,i,u]),A=e.useMemo(()=>({open:c,close:C,toggle:T,setAnchorEl:d}),[c,C,T]);return b.jsx(h.Provider,{value:A,children:b.jsx(M.Provider,{value:S,children:g})})}function y({children:t}){const{open:l,triggerOn:r}=k(),{toggle:i,setAnchorEl:u,open:a,close:g}=w();if(!e.isValidElement(t))return t;const s=e.Children.only(t),x=n=>{var o,c;(c=(o=s.props).onClick)==null||c.call(o,n),u(n.currentTarget),i()},p=n=>{var o,c;n.preventDefault(),(c=(o=s.props).onContextMenu)==null||c.call(o,n),P.setAnchorPointer(n.currentTarget,n.clientX,n.clientY),u(n.currentTarget),a()},d=n=>{var o,c;(c=(o=s.props).onMouseEnter)==null||c.call(o,n),u(n.currentTarget),a()},f=n=>{var o,c;(c=(o=s.props).onMouseLeave)==null||c.call(o,n),g()};return r==="contextMenu"?e.cloneElement(s,{"aria-expanded":l,onContextMenu:p,ref:E(s.props.ref)}):r==="hover"?e.cloneElement(s,{"aria-expanded":l,onMouseEnter:d,onMouseLeave:f,ref:E(s.props.ref)}):r==="click"?e.cloneElement(s,{"aria-expanded":l,onClick:x,ref:E(s.props.ref)}):s}function V({children:t}){const{open:l,anchorEl:r,anchor:i,triggerOn:u}=k(),{close:a}=w();if(!e.isValidElement(t))return t;const g=u==="contextMenu",s=e.Children.only(t);return e.cloneElement(s,{open:l,onClose:a,...i&&{anchorEl:r},...g&&{anchorPointer:!0}})}v.Trigger=y;v.Content=V;exports.default=v;exports.useToggleContext=j;

package/dist/components/Toggle/index.d.ts

@@ -0,0 +1,48 @@
+import { ChildrenProps } from '../../types';
+import { MouseEvent, ReactElement, Ref } from 'react';
+type TriggerOn = "hover" | "click" | "contextMenu";
+export type ToggleRef = {
+    open: VoidFunction;
+    close: VoidFunction;
+    toggle: VoidFunction;
+};
+type ToggleProps = {
+    defaultOpen?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    anchor?: boolean;
+    triggerOn?: TriggerOn;
+    ref?: Ref<ToggleRef>;
+} & ChildrenProps;
+type ToggleTriggerProps = ChildrenProps;
+type ToggleContentProps = ChildrenProps;
+export declare function useToggleContext(): {
+    open: VoidFunction;
+    close: VoidFunction;
+    toggle: VoidFunction;
+    setAnchorEl: (el: HTMLElement | null) => void;
+    anchorEl: HTMLElement | null;
+    anchor: boolean;
+    triggerOn: TriggerOn;
+};
+declare function Toggle({ defaultOpen, open: openProp, onOpenChange, anchor, triggerOn, ref, children, }: ToggleProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Toggle {
+    var Trigger: typeof ToggleTrigger;
+    var Content: typeof ToggleContent;
+}
+declare function ToggleTrigger({ children }: ToggleTriggerProps): string | number | bigint | boolean | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | ReactElement<{
+    onClick?: (e: MouseEvent<HTMLElement>) => void;
+    onContextMenu?: (e: MouseEvent<HTMLElement>) => void;
+    onMouseEnter?: (e: MouseEvent<HTMLElement>) => void;
+    onMouseLeave?: (e: MouseEvent<HTMLElement>) => void;
+    ref?: Ref<HTMLElement>;
+    "aria-expanded"?: boolean;
+}, string | import('react').JSXElementConstructor<any>> | null | undefined;
+declare function ToggleContent({ children }: ToggleContentProps): string | number | bigint | boolean | Iterable<import('react').ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | null | undefined> | ReactElement<{
+    open?: boolean;
+    onClose?: VoidFunction;
+    anchorEl?: HTMLElement | null;
+    anchorPointer?: boolean;
+}, string | import('react').JSXElementConstructor<any>> | null | undefined;
+export default Toggle;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Toggle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAKL,UAAU,EACV,YAAY,EACZ,GAAG,EAMJ,MAAM,OAAO,CAAC;AAEf,KAAK,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,aAAa,CAAC;AAgBnD,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,EAAE,YAAY,CAAC;IACpB,MAAM,EAAE,YAAY,CAAC;CACtB,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,GAAG,CAAC,EAAE,GAAG,CAAC,SAAS,CAAC,CAAC;CACtB,GAAG,aAAa,CAAC;AAElB,KAAK,kBAAkB,GAAG,aAAa,CAAC;AAExC,KAAK,kBAAkB,GAAG,aAAa,CAAC;AAgBxC,wBAAgB,gBAAgB;UAvCxB,YAAY;WACX,YAAY;YACX,YAAY;iBACP,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI;cATnC,WAAW,GAAG,IAAI;YACpB,OAAO;eACJ,SAAS;EAkDrB;AAkBD,iBAAS,MAAM,CAAC,EACd,WAAmB,EACnB,IAAI,EAAE,QAAQ,EACd,YAAY,EACZ,MAAc,EACd,SAAmB,EACnB,GAAG,EACH,QAAQ,GACT,EAAE,WAAW,2CAkDb;kBA1DQ,MAAM;;;;AA4Df,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE,kBAAkB;cAOzC,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI;oBAC9B,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI;mBACrC,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI;mBACpC,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI;UAC7C,GAAG,CAAC,WAAW,CAAC;sBACJ,OAAO;2EAsD5B;AAED,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE,kBAAkB;WAS5C,OAAO;cACJ,YAAY;eACX,WAAW,GAAG,IAAI;oBACb,OAAO;2EAS1B;AAKD,eAAe,MAAM,CAAC"}

package/dist/components/Toggle/index.es.js

@@ -0,0 +1,115 @@
+"use client";
+import { jsx as b } from "react/jsx-runtime";
+import { useState as k, useCallback as d, useImperativeHandle as H, useMemo as A, useContext as x, createContext as y, isValidElement as L, Children as P, cloneElement as T } from "react";
+import { setAnchorPointer as I } from "../../helpers/anchorPointer.es.js";
+const v = y(null), w = y(
+  null
+);
+function M(...e) {
+  return (c) => {
+    e.forEach((n) => {
+      typeof n == "function" ? n(c) : n && (n.current = c);
+    });
+  };
+}
+function z() {
+  const e = x(v), c = x(w);
+  if (!e || !c)
+    throw new Error("useToggleContext must be used within Toggle");
+  return { ...e, ...c };
+}
+function S() {
+  const e = x(v);
+  if (!e)
+    throw new Error("Toggle subcomponents must be used within Toggle");
+  return e;
+}
+function V() {
+  const e = x(w);
+  if (!e)
+    throw new Error("Toggle subcomponents must be used within Toggle");
+  return e;
+}
+function F({
+  defaultOpen: e = !1,
+  open: c,
+  onOpenChange: n,
+  anchor: u = !1,
+  triggerOn: l = "click",
+  ref: i,
+  children: a
+}) {
+  const [r, m] = k(e), [f, p] = k(null), g = c !== void 0, t = g ? c : r, o = d(
+    (E) => {
+      g || m(E), E || p(null), n == null || n(E);
+    },
+    [g, n]
+  ), s = d(() => {
+    o(!0);
+  }, [o]), C = d(() => {
+    o(!1);
+  }, [o]), h = d(() => {
+    o(!t);
+  }, [t, o]);
+  H(i, () => ({
+    open: s,
+    close: C,
+    toggle: h
+  }));
+  const j = A(
+    () => ({ open: t, anchorEl: f, anchor: u, triggerOn: l }),
+    [t, f, u, l]
+  ), D = A(
+    () => ({ open: s, close: C, toggle: h, setAnchorEl: p }),
+    [s, C, h]
+  );
+  return /* @__PURE__ */ b(w.Provider, { value: D, children: /* @__PURE__ */ b(v.Provider, { value: j, children: a }) });
+}
+function R({ children: e }) {
+  const { open: c, triggerOn: n } = S(), { toggle: u, setAnchorEl: l, open: i, close: a } = V();
+  if (!L(e)) return e;
+  const r = P.only(e), m = (t) => {
+    var o, s;
+    (s = (o = r.props).onClick) == null || s.call(o, t), l(t.currentTarget), u();
+  }, f = (t) => {
+    var o, s;
+    t.preventDefault(), (s = (o = r.props).onContextMenu) == null || s.call(o, t), I(t.currentTarget, t.clientX, t.clientY), l(t.currentTarget), i();
+  }, p = (t) => {
+    var o, s;
+    (s = (o = r.props).onMouseEnter) == null || s.call(o, t), l(t.currentTarget), i();
+  }, g = (t) => {
+    var o, s;
+    (s = (o = r.props).onMouseLeave) == null || s.call(o, t), a();
+  };
+  return n === "contextMenu" ? T(r, {
+    "aria-expanded": c,
+    onContextMenu: f,
+    ref: M(r.props.ref)
+  }) : n === "hover" ? T(r, {
+    "aria-expanded": c,
+    onMouseEnter: p,
+    onMouseLeave: g,
+    ref: M(r.props.ref)
+  }) : n === "click" ? T(r, {
+    "aria-expanded": c,
+    onClick: m,
+    ref: M(r.props.ref)
+  }) : r;
+}
+function U({ children: e }) {
+  const { open: c, anchorEl: n, anchor: u, triggerOn: l } = S(), { close: i } = V();
+  if (!L(e)) return e;
+  const a = l === "contextMenu", r = P.only(e);
+  return T(r, {
+    open: c,
+    onClose: i,
+    ...u && { anchorEl: n },
+    ...a && { anchorPointer: !0 }
+  });
+}
+F.Trigger = R;
+F.Content = U;
+export {
+  F as default,
+  z as useToggleContext
+};

package/dist/components/Tooltip/index.cjs.js

@@ -1 +1 @@
-"use client";"use strict";const c=require("react/jsx-runtime"),$=require("../../helpers/cn.cjs.js"),B=require("../../hooks/useClasses.cjs.js"),o=require("react"),f=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),F=require("../Portal/index.cjs.js"),N=require("../../node_modules/react-transition-group/esm/Transition.cjs.js");function P({title:x,color:l="dark",placement:s="top",duration:h=300,className:w,children:i,...b}){const r=B(e=>e.tooltip),m=o.useRef(null),d=o.useRef(null),[p,u]=o.useState(!1),[v,y]=o.useState({}),g=o.useMemo(()=>{var t;if(!l)return"border-transparent";const e={primary:"bg-primary text-white",secondary:"bg-secondary text-white",success:"bg-success text-white",info:"bg-info text-white",warning:"bg-warning text-white",danger:"bg-danger text-white",dark:"bg-dark text-white",light:"bg-light text-dark"};return[e==null?void 0:e[l],(t=r==null?void 0:r.color)==null?void 0:t[l]]},[l,r==null?void 0:r.color]),M=o.useMemo(()=>{var n;return["size-0 min-w-(--width) min-h-(--height) top-(--top) right-(--right) bottom-(--bottom) left-(--left) justify-end items-center p-1.5",{top:"-translate-y-full flex-col origin-bottom",end:"translate-x-[calc(var(--ratio)*100%)] flex-row-reverse origin-left rtl:origin-right",bottom:"translate-y-full flex-col-reverse origin-top",start:"translate-x-[calc(var(--ratio)*-100%)] flex-row origin-right rtl:origin-left"}[s],(n=r==null?void 0:r.placement)==null?void 0:n[s]]},[s,r==null?void 0:r.placement]),j={entering:"scale-100 opacity-100",entered:"scale-100 opacity-100",exiting:"scale-75 opacity-0",exited:"scale-75 opacity-0",unmounted:""},k=o.useMemo(()=>({top:"mt-[-0.5rem]",end:"me-[-0.5rem]",bottom:"mb-[-0.5rem]",start:"ms-[-0.5rem]"})[s],[s]),E=o.useMemo(()=>i?o.cloneElement(i,{ref:e=>{d.current=e},onMouseEnter:e=>{var t,n;(n=(t=i.props).onMouseEnter)==null||n.call(t,e),u(!0)},onMouseLeave:e=>{var t,n;(n=(t=i.props).onMouseLeave)==null||n.call(t,e),u(!1)},onFocus:e=>{var t,n;(n=(t=i.props).onFocus)==null||n.call(t,e),u(!0)},onBlur:e=>{var t,n;(n=(t=i.props).onBlur)==null||n.call(t,e),u(!1)}}):null,[i]),a=o.useCallback(()=>{const e=d.current;if(!e)return;const t=e.getBoundingClientRect(),n=t.width,C=t.height,R=t.top,q=t.left,z=window.innerWidth-t.right,L=window.innerHeight-t.bottom;y({"--width":`${n}px`,"--height":`${C}px`,"--top":`${R}px`,"--left":`${q}px`,"--right":`${z}px`,"--bottom":`${L}px`})},[]);return o.useEffect(()=>(p&&a(),window.addEventListener("scroll",a),window.addEventListener("resize",a),()=>{window.removeEventListener("scroll",a),window.removeEventListener("resize",a)}),[p,s,a]),c.jsxs(o.Fragment,{children:[E,c.jsx(F,{children:c.jsx(N.default,{nodeRef:m,in:p,timeout:h,unmountOnExit:!0,children:e=>c.jsxs("div",{ref:m,style:v,className:$("fixed flex justify-center items-center z-10 pointer-events-none transition-[scale,opacity] [--ratio:1] rtl:[--ratio:-1]",...M,j[e]),children:[c.jsx("span",{className:f.twMerge("relative block size-fit min-w-fit min-h-fit bg-dark text-sm rounded px-2 py-px whitespace-nowrap z-[1]",r==null?void 0:r.base,g,w),...b,children:x}),c.jsx("span",{className:f.twMerge("block size-3 min-w-3 min-h-3 bg-dark rotate-45",k,g)})]})})})]})}module.exports=P;
+"use client";"use strict";const v=require("react/jsx-runtime"),s=require("react"),L=require("../../node_modules/tailwind-merge/dist/bundle-mjs.cjs.js"),F=require("../Portal/index.cjs.js"),E=require("../../hooks/useClasses.cjs.js"),G=require("../../helpers/anchorPointer.cjs.js"),I=require("../../node_modules/react-transition-group/esm/Transition.cjs.js"),N=s.createContext({placement:"top",color:"dark",transitionState:"unmounted"});function W(){return s.useContext(N)}function H({open:l=!1,anchorEl:u=null,anchorPointer:r=!1,placement:t="top",color:g="dark",duration:w=300,onEnter:b,onEntering:n,onEntered:p,onExit:$,onExiting:B,onExited:S,className:O,children:A}){const c=E(e=>e.tooltip),d=s.useRef(null),y=0,C=16,X={entering:"scale-100 opacity-100",entered:"scale-100 opacity-100",exiting:"scale-75 opacity-0",exited:"scale-75 opacity-0",unmounted:""},Y=s.useMemo(()=>{var f;return[t==="top"||t==="bottom"?"flex-col":"flex-row",{top:"flex-col origin-bottom",bottom:"flex-col-reverse origin-top",start:"flex-row origin-right rtl:origin-left",end:"flex-row-reverse origin-left rtl:origin-right"}[t],(f=c==null?void 0:c.placement)==null?void 0:f[t]]},[t,c==null?void 0:c.placement]),D=s.useCallback(e=>{var a,f,i;(a=d.current)==null||a.style.setProperty("--left",`${e.left}px`),(f=d.current)==null||f.style.setProperty("--right",`${e.right}px`),(i=d.current)==null||i.style.setProperty("--top",`${e.top}px`)},[]),M=s.useCallback(()=>{if(!l||!u||!d.current)return;const e=d.current,a=window.innerWidth,f=window.innerHeight,i=e.offsetWidth,j=e.offsetHeight;let P,R,z,T,k,q;if(r){const o=G.getAnchorPointer(u);if(!o)return;P=o.x,R=o.x,z=o.y,T=o.y,k=o.x,q=o.y}else{const o=u.getBoundingClientRect();P=o.left,R=o.right,z=o.top,T=o.bottom,k=o.left+o.width/2,q=o.top+o.height/2}let h,x,m;switch(t){case"top":h=k-i/2,x=a-k-i/2,m=z-j-y;break;case"bottom":h=k-i/2,x=a-k-i/2,m=T+y;break;case"start":h=P-i-y,x=a-R-y-i,m=q-j/2;break;case"end":h=R+y,x=a-P+y,m=q-j/2;break}h=Math.min(Math.max(h,C),a-i-C),x=Math.min(Math.max(x,C),a-i-C),m=Math.min(Math.max(m,C),f-j-C),D({left:h,right:x,top:m})},[l,u,r,t,D]);return s.useEffect(()=>{M()},[M,A]),s.useEffect(()=>{const e=()=>M();return window.addEventListener("scroll",e),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",e),window.removeEventListener("resize",e)}},[M]),v.jsx(F,{children:v.jsx(I.default,{nodeRef:d,in:l,timeout:w,unmountOnExit:!0,onEnter:b,onEntering:n,onEntered:p,onExit:$,onExiting:B,onExited:S,children:e=>v.jsx(N.Provider,{value:{placement:t,color:g,transitionState:e},children:v.jsx("div",{ref:d,"data-name":"tooltip","data-open":l,style:{transitionDuration:`${w}ms`},className:L.twMerge("flex items-center justify-center fixed z-1 pointer-events-none top-(--top) left-(--left) right-auto origin-top-left rtl:left-auto rtl:right-(--right) rtl:origin-top-right transition-[scale,opacity]",c==null?void 0:c.base,Y,X[e],O),children:A})})})})}function J({className:l,children:u,...r}){const t=E(b=>{var n;return(n=b.tooltip)==null?void 0:n.content}),{color:g}=W(),w=s.useMemo(()=>{var n;return[{primary:"bg-primary text-white",secondary:"bg-secondary text-white",success:"bg-success text-white",info:"bg-info text-white",warning:"bg-warning text-white",danger:"bg-danger text-white",dark:"bg-dark text-white",light:"bg-light text-dark"}[g],(n=t==null?void 0:t.color)==null?void 0:n[g]]},[g,t==null?void 0:t.color]);return v.jsx("span",{role:"tooltip","data-name":"tooltip-content",className:L.twMerge("relative block size-fit min-w-fit min-h-fit text-sm rounded px-2 py-px whitespace-nowrap z-1",t==null?void 0:t.base,w,l),...r,children:u})}function K({className:l,...u}){const r=E(n=>{var p;return(p=n.tooltip)==null?void 0:p.arrow}),{color:t,placement:g}=W(),w=s.useMemo(()=>({top:"-translate-y-2/3",bottom:"translate-y-2/3",start:"-translate-x-2/3 rtl:translate-x-2/3",end:"translate-x-2/3 rtl:-translate-x-2/3"})[g],[g]),b=s.useMemo(()=>{var p;return[{primary:"bg-primary",secondary:"bg-secondary",success:"bg-success",info:"bg-info",warning:"bg-warning",danger:"bg-danger",dark:"bg-dark",light:"bg-light"}[t],(p=r==null?void 0:r.color)==null?void 0:p[t]]},[t,r==null?void 0:r.color]);return v.jsx("span",{"data-name":"tooltip-arrow",className:L.twMerge("block size-3 min-w-3 min-h-3 rotate-45 shrink-0",r==null?void 0:r.base,w,b,l),...u})}H.Content=J;H.Arrow=K;module.exports=H;

package/dist/components/Tooltip/index.d.ts

@@ -1,13 +1,20 @@
-import { Color, ComponentPropsWithoutAs } from '../../types';
-import { ReactElement } from 'react';
+import { ChildrenProps, Color, ComponentPropsWithoutAs, ToggleEventProps, ToggleProps } from '../../types';
 type Placement = "top" | "end" | "bottom" | "start";
-type Props = {
-    title: string;
+type TooltipProps = {
+    anchorEl?: HTMLElement | null;
+    anchorPointer?: boolean;
+    placement?: Placement;
     color?: Color;
     duration?: number;
-    placement?: Placement;
-    children?: ReactElement<any>;
-};
-export default function Tooltip({ title, color, placement, duration, className, children, ...props }: ComponentPropsWithoutAs<"span", Props>): import("react/jsx-runtime").JSX.Element;
-export {};
+} & Partial<Omit<ToggleProps, "onClose">> & Partial<ToggleEventProps> & ChildrenProps;
+declare function Tooltip({ open, anchorEl, anchorPointer, placement, color, duration, onEnter, onEntering, onEntered, onExit, onExiting, onExited, className, children, }: TooltipProps & {
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace Tooltip {
+    var Content: typeof TooltipContent;
+    var Arrow: typeof TooltipArrow;
+}
+declare function TooltipContent({ className, children, ...props }: ComponentPropsWithoutAs<"span">): import("react/jsx-runtime").JSX.Element;
+declare function TooltipArrow({ className, ...props }: ComponentPropsWithoutAs<"span">): import("react/jsx-runtime").JSX.Element;
+export default Tooltip;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Tooltip/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAGzD,OAAO,EAGL,YAAY,EAMb,MAAM,OAAO,CAAC;AAKf,KAAK,SAAS,GAAG,KAAK,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,CAAC;AACpD,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,QAAQ,CAAC,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC;CAC9B,CAAC;AAIF,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAC9B,KAAK,EACL,KAAc,EACd,SAAiB,EACjB,QAAc,EACd,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,MAAM,EAAE,KAAK,CAAC,2CAgJxC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,aAAa,EACb,KAAK,EACL,uBAAuB,EACvB,gBAAgB,EAChB,WAAW,EACZ,MAAM,SAAS,CAAC;AAcjB,KAAK,SAAS,GAAG,KAAK,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,CAAC;AAGpD,KAAK,YAAY,GAAG;IAClB,QAAQ,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,GAAG,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,GACvC,OAAO,CAAC,gBAAgB,CAAC,GACzB,aAAa,CAAC;AAsBhB,iBAAS,OAAO,CAAC,EACf,IAAY,EACZ,QAAe,EACf,aAAqB,EACrB,SAAiB,EACjB,KAAc,EACd,QAAc,EACd,OAAO,EACP,UAAU,EACV,SAAS,EACT,MAAM,EACN,SAAS,EACT,QAAQ,EACR,SAAS,EACT,QAAQ,GACT,EAAE,YAAY,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,2CAyJvC;kBAxKQ,OAAO;;;;AA0KhB,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,MAAM,CAAC,2CAiCjC;AAED,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,MAAM,CAAC,2CAwCjC;AAKD,eAAe,OAAO,CAAC"}