@kakadu/components 2.3.3 → 2.3.4

package/build/components/popover.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../jsx-runtime-BB_1_6y_.js"),f=require("@kuma-ui/core"),e=require("react"),L=require("../focus-trap-react-CcpTuiJi.js"),R=require("./atom.js"),C=e.createContext({isVisible:!1}),{Provider:O}=C;function V(){return e.useContext(C)}function A({as:r,className:s,...o}){return n.jsxRuntimeExports.jsx(R.default,{as:r??R.defaultAtomElementType,...o,className:f.cx("kakadu-components-2845019685",s)})}function D({as:r,isVisible:s,label:o,shouldCloseOnOutsideClick:d=!0,shouldCloseOnEscapePress:u=!0,children:i,className:p,innerClassName:v,onClose:a,...m}){const c=e.useRef(null),x=e.useRef(null),[b,q]=e.useState(!1),[l,k]=e.useState(!1),h=e.useCallback(t=>{c.current=t,k(!1)},[]),j=e.useRef(null),T=e.useCallback(t=>{t&&(j.current=t)},[]),M=e.useMemo(()=>({initialFocus:()=>j.current??void 0,onActivate:()=>{var t;return(t=j.current)==null?void 0:t.focus()},clickOutsideDeactivates:d,escapeDeactivates:u,onDeactivate(){k(!1)}}),[d,u]),[P,I]=e.useState(s??!1),N=e.useMemo(()=>({isVisible:P,setInitialFocus:T,close:h}),[P,T,h]),[E,F]=e.useState(!1),[w,y]=e.useState(!1);return e.useEffect(()=>{const t=x.current;if(t){const g=()=>{const S=t.getBoundingClientRect();F(S.left<0),y(S.right>window.innerWidth)};return g(),window.addEventListener("resize",g),()=>{window.removeEventListener("resize",g)}}},[]),e.useEffect(()=>{s&&(q(!0),I(!0))},[s]),e.useEffect(()=>{if(s){const t=setTimeout(()=>{k(!0)},100);return()=>{clearTimeout(t)}}k(!1)},[s]),e.useEffect(()=>{if(b&&!l){const t=setTimeout(()=>{a==null||a(c.current??void 0),I(!1)},370);return()=>{clearTimeout(t)}}},[b,l,a]),n.jsxRuntimeExports.jsx(R.default,{reference:x,as:r??R.defaultAtomElementType,role:"dialog","aria-hidden":!l,"aria-label":o??"Popover",...m,className:f.cx("kakadu-components-3920007758",E&&"kakadu-components-611400930",w&&"kakadu-components-944244368",l&&"kakadu-components-1399012551",p),children:n.jsxRuntimeExports.jsxs("div",{className:f.cx("kakadu-components-1118152266",l&&"kakadu-components-231244945"),children:[n.jsxRuntimeExports.jsx("div",{className:f.cx("kakadu-components-2899069338",E&&"kakadu-components-1495725644",w&&"kakadu-components-4235689197")}),n.jsxRuntimeExports.jsx(L.focusTrapReactExports.FocusTrap,{active:l,focusTrapOptions:M,children:n.jsxRuntimeExports.jsxs("div",{className:f.cx("kakadu-components-3905822111",v),children:[n.jsxRuntimeExports.jsx(O,{value:N,children:i}),n.jsxRuntimeExports.jsx("div",{className:f.cx("kakadu-components-3328048824",E&&"kakadu-components-3754561431",w&&"kakadu-components-2265262600")})]})})]})})}function _(r,s){const[o,d]=e.useState(!1),u=e.useRef(void 0),i=e.useRef(null),p=e.useCallback(async m=>(d(!0),i.current=m??document.activeElement,new Promise(c=>{u.current=c})),[]),v=e.useCallback(m=>{var c;if(d(!1),(c=u.current)==null||c.call(u,m),u.current=void 0,i.current){const x=i.current;x.isConnected&&x.focus(),i.current=null}},[]),a=e.useMemo(()=>n.jsxRuntimeExports.jsx(r,{...s,isVisible:o,onClose:v}),[r,s,o,v]);return e.useMemo(()=>({isVisible:o,show:p,popover:a}),[o,p,a])}exports.PopoverContainer=A;exports.default=D;exports.usePopover=_;exports.usePopoverContext=V;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../jsx-runtime-BB_1_6y_.js"),d=require("@kuma-ui/core"),e=require("react"),_=require("../focus-trap-react-CcpTuiJi.js"),w=require("./atom.js"),D=e.createContext({isVisible:!1}),{Provider:z}=D;function B(){return e.useContext(D)}function $({as:i,className:n,...o}){return s.jsxRuntimeExports.jsx(w.default,{as:i??w.defaultAtomElementType,...o,className:d.cx("kakadu-components-2845019685",n)})}function H({as:i,isVisible:n,label:o,shouldCloseOnOutsideClick:m=!0,shouldCloseOnEscapePress:r=!0,children:u,className:k,innerClassName:R,onClose:c,...p}){const a=e.useRef(null),x=e.useRef(null),[T,V]=e.useState(!1),[l,h]=e.useState(!1),C=e.useCallback(t=>{a.current=t,h(!1)},[]),E=e.useRef(null),M=e.useCallback(t=>{t&&(E.current=t)},[]),A=e.useMemo(()=>({initialFocus:()=>E.current??void 0,onActivate:()=>{var t;return(t=E.current)==null?void 0:t.focus()},clickOutsideDeactivates:m,escapeDeactivates:r,onDeactivate(){h(!1)}}),[m,r]),[I,S]=e.useState(n??!1),W=e.useMemo(()=>({isVisible:I,setInitialFocus:M,close:C}),[I,M,C]),[f,q]=e.useState("center");return e.useEffect(()=>{const t=x.current;if(t){const g=()=>{const N=t.offsetParent,b=N instanceof HTMLElement?N.getBoundingClientRect():null,F=t.getBoundingClientRect();if(!b){q("center");return}const P=b.left+b.width/2-F.width/2,L=P+F.width,O=P<0,y=L>window.innerWidth;let v="center";if(O&&y){const j=Math.abs(P);v=L-window.innerWidth>j?"right":"left"}else y?v="right":O&&(v="left");q(j=>j===v?j:v)};return g(),window.addEventListener("resize",g),()=>{window.removeEventListener("resize",g)}}},[]),e.useEffect(()=>{n&&(V(!0),S(!0))},[n]),e.useEffect(()=>{if(n){const t=setTimeout(()=>{h(!0)},100);return()=>{clearTimeout(t)}}h(!1)},[n]),e.useEffect(()=>{if(T&&!l){const t=setTimeout(()=>{c==null||c(a.current??void 0),S(!1)},370);return()=>{clearTimeout(t)}}},[T,l,c]),s.jsxRuntimeExports.jsx(w.default,{reference:x,as:i??w.defaultAtomElementType,role:"dialog","aria-hidden":!l,"aria-label":o??"Popover",...p,className:d.cx("kakadu-components-3920007758",f==="left"&&"kakadu-components-611400930",f==="right"&&"kakadu-components-944244368",l&&"kakadu-components-1399012551",k),children:s.jsxRuntimeExports.jsxs("div",{className:d.cx("kakadu-components-1118152266",l&&"kakadu-components-231244945"),children:[s.jsxRuntimeExports.jsx("div",{className:d.cx("kakadu-components-2899069338",f==="left"&&"kakadu-components-1495725644",f==="right"&&"kakadu-components-4235689197")}),s.jsxRuntimeExports.jsx(_.focusTrapReactExports.FocusTrap,{active:l,focusTrapOptions:A,children:s.jsxRuntimeExports.jsxs("div",{className:d.cx("kakadu-components-3905822111",R),children:[s.jsxRuntimeExports.jsx(z,{value:W,children:u}),s.jsxRuntimeExports.jsx("div",{className:d.cx("kakadu-components-3328048824",f==="left"&&"kakadu-components-3754561431",f==="right"&&"kakadu-components-2265262600")})]})})]})})}function G(i,n){const[o,m]=e.useState(!1),r=e.useRef(void 0),u=e.useRef(null),k=e.useCallback(async p=>(m(!0),u.current=p??document.activeElement,new Promise(a=>{r.current=a})),[]),R=e.useCallback(p=>{var a;if(m(!1),(a=r.current)==null||a.call(r,p),r.current=void 0,u.current){const x=u.current;x.isConnected&&x.focus(),u.current=null}},[]),c=e.useMemo(()=>s.jsxRuntimeExports.jsx(i,{...n,isVisible:o,onClose:R}),[i,n,o,R]);return e.useMemo(()=>({isVisible:o,show:k,popover:c}),[o,k,c])}exports.PopoverContainer=$;exports.default=H;exports.usePopover=G;exports.usePopoverContext=B;

package/build/components/popover.mjs

@@ -1,114 +1,124 @@
 import { j as n } from "../jsx-runtime-B4hRZ52C.mjs";
-import { cx as l } from "@kuma-ui/core";
-import { createContext as M, useRef as k, useState as d, useCallback as j, useMemo as g, useEffect as h, useContext as S } from "react";
-import { f as q } from "../focus-trap-react-DYXrtbDH.mjs";
-import A, { defaultAtomElementType as D } from "./atom.mjs";
-const O = M({
+import { cx as f } from "@kuma-ui/core";
+import { createContext as K, useRef as h, useState as v, useCallback as T, useMemo as P, useEffect as R, useContext as Q } from "react";
+import { f as U } from "../focus-trap-react-DYXrtbDH.mjs";
+import B, { defaultAtomElementType as H } from "./atom.mjs";
+const S = K({
   isVisible: !1
 }), {
-  Provider: G
-} = O;
-function X() {
-  return S(O);
+  Provider: X
+} = S;
+function ne() {
+  return Q(S);
 }
-function Y({
-  as: c,
+function se({
+  as: i,
   className: t,
   ...s
 }) {
-  return /* @__PURE__ */ n.jsx(A, { as: c ?? D, ...s, className: l("kakadu-components-2845019685", t) });
+  return /* @__PURE__ */ n.jsx(B, { as: i ?? H, ...s, className: f("kakadu-components-2845019685", t) });
 }
-function Z({
-  as: c,
+function oe({
+  as: i,
   isVisible: t,
   label: s,
-  shouldCloseOnOutsideClick: f = !0,
+  shouldCloseOnOutsideClick: d = !0,
   shouldCloseOnEscapePress: o = !0,
-  children: i,
-  className: v,
+  children: a,
+  className: w,
   innerClassName: x,
-  onClose: a,
+  onClose: r,
   ...m
 }) {
-  const r = k(null), p = k(null), [E, y] = d(!1), [u, w] = d(!1), N = j((e) => {
-    r.current = e, w(!1);
-  }, []), I = k(null), P = j((e) => {
-    e && (I.current = e);
-  }, []), z = g(() => ({
-    initialFocus: () => I.current ?? void 0,
+  const c = h(null), p = h(null), [F, q] = v(!1), [u, g] = v(!1), L = T((e) => {
+    c.current = e, g(!1);
+  }, []), b = h(null), D = T((e) => {
+    e && (b.current = e);
+  }, []), G = P(() => ({
+    initialFocus: () => b.current ?? void 0,
     onActivate: () => {
       var e;
-      return (e = I.current) == null ? void 0 : e.focus();
+      return (e = b.current) == null ? void 0 : e.focus();
     },
-    clickOutsideDeactivates: f,
+    clickOutsideDeactivates: d,
     escapeDeactivates: o,
     onDeactivate() {
-      w(!1);
+      g(!1);
     }
-  }), [f, o]), [F, L] = d(t ?? !1), C = g(() => ({
-    isVisible: F,
-    setInitialFocus: P,
-    close: N
-  }), [F, P, N]), [R, W] = d(!1), [T, B] = d(!1);
-  return h(() => {
+  }), [d, o]), [O, V] = v(t ?? !1), J = P(() => ({
+    isVisible: O,
+    setInitialFocus: D,
+    close: L
+  }), [O, D, L]), [l, A] = v("center");
+  return R(() => {
     const e = p.current;
     if (e) {
-      const b = () => {
-        const V = e.getBoundingClientRect();
-        W(V.left < 0), B(V.right > window.innerWidth);
+      const E = () => {
+        const C = e.offsetParent, I = C instanceof HTMLElement ? C.getBoundingClientRect() : null, M = e.getBoundingClientRect();
+        if (!I) {
+          A("center");
+          return;
+        }
+        const N = I.left + I.width / 2 - M.width / 2, W = N + M.width, y = N < 0, z = W > window.innerWidth;
+        let k = "center";
+        if (y && z) {
+          const j = Math.abs(N);
+          k = W - window.innerWidth > j ? "right" : "left";
+        } else z ? k = "right" : y && (k = "left");
+        A((j) => j === k ? j : k);
       };
-      return b(), window.addEventListener("resize", b), () => {
-        window.removeEventListener("resize", b);
+      return E(), window.addEventListener("resize", E), () => {
+        window.removeEventListener("resize", E);
       };
     }
-  }, []), h(() => {
-    t && (y(!0), L(!0));
-  }, [t]), h(() => {
+  }, []), R(() => {
+    t && (q(!0), V(!0));
+  }, [t]), R(() => {
     if (t) {
       const e = setTimeout(() => {
-        w(!0);
+        g(!0);
       }, 100);
       return () => {
         clearTimeout(e);
       };
     }
-    w(!1);
-  }, [t]), h(() => {
-    if (E && !u) {
+    g(!1);
+  }, [t]), R(() => {
+    if (F && !u) {
       const e = setTimeout(() => {
-        a == null || a(r.current ?? void 0), L(!1);
+        r == null || r(c.current ?? void 0), V(!1);
       }, 370);
       return () => {
         clearTimeout(e);
       };
     }
-  }, [E, u, a]), /* @__PURE__ */ n.jsx(A, { reference: p, as: c ?? D, role: "dialog", "aria-hidden": !u, "aria-label": s ?? "Popover", ...m, className: l("kakadu-components-3920007758", R && "kakadu-components-611400930", T && "kakadu-components-944244368", u && "kakadu-components-1399012551", v), children: /* @__PURE__ */ n.jsxs("div", { className: l("kakadu-components-1118152266", u && "kakadu-components-231244945"), children: [
-    /* @__PURE__ */ n.jsx("div", { className: l("kakadu-components-2899069338", R && "kakadu-components-1495725644", T && "kakadu-components-4235689197") }),
-    /* @__PURE__ */ n.jsx(q.FocusTrap, { active: u, focusTrapOptions: z, children: /* @__PURE__ */ n.jsxs("div", { className: l("kakadu-components-3905822111", x), children: [
-      /* @__PURE__ */ n.jsx(G, { value: C, children: i }),
-      /* @__PURE__ */ n.jsx("div", { className: l("kakadu-components-3328048824", R && "kakadu-components-3754561431", T && "kakadu-components-2265262600") })
+  }, [F, u, r]), /* @__PURE__ */ n.jsx(B, { reference: p, as: i ?? H, role: "dialog", "aria-hidden": !u, "aria-label": s ?? "Popover", ...m, className: f("kakadu-components-3920007758", l === "left" && "kakadu-components-611400930", l === "right" && "kakadu-components-944244368", u && "kakadu-components-1399012551", w), children: /* @__PURE__ */ n.jsxs("div", { className: f("kakadu-components-1118152266", u && "kakadu-components-231244945"), children: [
+    /* @__PURE__ */ n.jsx("div", { className: f("kakadu-components-2899069338", l === "left" && "kakadu-components-1495725644", l === "right" && "kakadu-components-4235689197") }),
+    /* @__PURE__ */ n.jsx(U.FocusTrap, { active: u, focusTrapOptions: G, children: /* @__PURE__ */ n.jsxs("div", { className: f("kakadu-components-3905822111", x), children: [
+      /* @__PURE__ */ n.jsx(X, { value: J, children: a }),
+      /* @__PURE__ */ n.jsx("div", { className: f("kakadu-components-3328048824", l === "left" && "kakadu-components-3754561431", l === "right" && "kakadu-components-2265262600") })
     ] }) })
   ] }) });
 }
-function _(c, t) {
-  const [s, f] = d(!1), o = k(void 0), i = k(null), v = j(async (m) => (f(!0), i.current = m ?? document.activeElement, new Promise((r) => {
-    o.current = r;
-  })), []), x = j((m) => {
-    var r;
-    if (f(!1), (r = o.current) == null || r.call(o, m), o.current = void 0, i.current) {
-      const p = i.current;
-      p.isConnected && p.focus(), i.current = null;
+function re(i, t) {
+  const [s, d] = v(!1), o = h(void 0), a = h(null), w = T(async (m) => (d(!0), a.current = m ?? document.activeElement, new Promise((c) => {
+    o.current = c;
+  })), []), x = T((m) => {
+    var c;
+    if (d(!1), (c = o.current) == null || c.call(o, m), o.current = void 0, a.current) {
+      const p = a.current;
+      p.isConnected && p.focus(), a.current = null;
     }
-  }, []), a = g(() => /* @__PURE__ */ n.jsx(c, { ...t, isVisible: s, onClose: x }), [c, t, s, x]);
-  return g(() => ({
+  }, []), r = P(() => /* @__PURE__ */ n.jsx(i, { ...t, isVisible: s, onClose: x }), [i, t, s, x]);
+  return P(() => ({
     isVisible: s,
-    show: v,
-    popover: a
-  }), [s, v, a]);
+    show: w,
+    popover: r
+  }), [s, w, r]);
 }
 export {
-  Y as PopoverContainer,
-  Z as default,
-  _ as usePopover,
-  X as usePopoverContext
+  se as PopoverContainer,
+  oe as default,
+  re as usePopover,
+  ne as usePopoverContext
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kakadu/components",
-  "version": "2.3.3",
+  "version": "2.3.4",
   "description": "Kakadu components library",
   "license": "MIT",
   "main": "./build/index.js",