@kakadu/components 5.0.6 → 5.0.7

package/build/components/click-ripples.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../jsx-runtime-BB_1_6y_.js"),r=require("react"),w=require("@kuma-ui/core");function v({id:t,x:o,y:i,onEnd:s}){return r.useEffect(()=>{const n=setTimeout(()=>{s(t)},370);return()=>{clearTimeout(n)}},[s,t]),a.jsxRuntimeExports.jsx("div",{style:{top:i,left:o},className:"kakadu-components-3828473824"})}function y({isActive:t=!0,size:o=150,className:i,...s}){const n=r.useRef(null),[p,f]=r.useState([]);r.useEffect(()=>{if(!t)return;const e=u=>{if(n.current){const c=n.current.getBoundingClientRect(),{clientX:l,clientY:d}=u,{left:m,right:E,top:x,bottom:R}=c;l>m&&l<E&&d>x&&d<R&&f(k=>[...k,{id:Date.now()+Math.random()*1e3,x:l-m,y:d-x}])}};return window.addEventListener("pointerdown",e),()=>{window.removeEventListener("pointerdown",e)}},[t]);const j=r.useCallback(e=>{f(u=>u.filter(c=>c.id!==e))},[]);return a.jsxRuntimeExports.jsx("div",{...s,ref:n,style:{"--size":`${o}px`},className:w.cx("kakadu-components-4189236582",i),children:p.map(e=>a.jsxRuntimeExports.jsx(v,{id:e.id,x:e.x,y:e.y,onEnd:j},e.id))})}exports.default=y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const m=require("../jsx-runtime-BB_1_6y_.js"),s=require("react"),v=require("@kuma-ui/core"),y=require("../hooks/use-is-in-view.js");function b({id:n,x:o,y:i,onEnd:r}){return s.useEffect(()=>{const t=setTimeout(()=>{r(n)},370);return()=>{clearTimeout(t)}},[r,n]),m.jsxRuntimeExports.jsx("div",{style:{top:i,left:o},className:"kakadu-components-3828473824"})}function g({isActive:n=!0,size:o=150,className:i,...r}){const t=s.useRef(null),u=y.default(t),[w,c]=s.useState([]);s.useEffect(()=>{if(!n||!u){c([]);return}const e=l=>{if(t.current){const d=t.current.getBoundingClientRect(),{clientX:a,clientY:f}=l,{left:x,right:k,top:p,bottom:E}=d;a>x&&a<k&&f>p&&f<E&&c(R=>[...R,{id:Date.now()+Math.random()*1e3,x:a-x,y:f-p}])}};return window.addEventListener("pointerdown",e),()=>{window.removeEventListener("pointerdown",e)}},[n,u]);const j=s.useCallback(e=>{c(l=>l.filter(d=>d.id!==e))},[]);return m.jsxRuntimeExports.jsx("div",{...r,ref:t,style:{"--size":`${o}px`},className:v.cx("kakadu-components-4189236582",i),children:u?w.map(e=>m.jsxRuntimeExports.jsx(b,{id:e.id,x:e.x,y:e.y,onEnd:j},e.id)):null})}exports.default=g;

package/build/components/click-ripples.mjs

@@ -1,63 +1,66 @@
-import { j as a } from "../jsx-runtime-B4hRZ52C.mjs";
-import { useRef as E, useState as R, useEffect as p, useCallback as h } from "react";
-import { cx as v } from "@kuma-ui/core";
-function C({
-  id: t,
+import { j as m } from "../jsx-runtime-B4hRZ52C.mjs";
+import { useRef as R, useState as h, useEffect as x, useCallback as v } from "react";
+import { cx as C } from "@kuma-ui/core";
+import b from "../hooks/use-is-in-view.mjs";
+function g({
+  id: n,
   x: r,
   y: s,
   onEnd: o
 }) {
-  return p(() => {
-    const n = setTimeout(() => {
-      o(t);
+  return x(() => {
+    const t = setTimeout(() => {
+      o(n);
     }, 370);
     return () => {
-      clearTimeout(n);
+      clearTimeout(t);
     };
-  }, [o, t]), /* @__PURE__ */ a.jsx("div", { style: {
+  }, [o, n]), /* @__PURE__ */ m.jsx("div", { style: {
     top: s,
     left: r
   }, className: "kakadu-components-3828473824" });
 }
-function N({
-  isActive: t = !0,
+function V({
+  isActive: n = !0,
   size: r = 150,
   className: s,
   ...o
 }) {
-  const n = E(null), [x, d] = R([]);
-  p(() => {
-    if (!t)
+  const t = R(null), i = b(t), [w, c] = h([]);
+  x(() => {
+    if (!n || !i) {
+      c([]);
       return;
-    const e = (i) => {
-      if (n.current) {
-        const c = n.current.getBoundingClientRect(), {
-          clientX: u,
-          clientY: l
-        } = i, {
-          left: m,
-          right: w,
-          top: f,
-          bottom: j
-        } = c;
-        u > m && u < w && l > f && l < j && d((y) => [...y, {
+    }
+    const e = (u) => {
+      if (t.current) {
+        const l = t.current.getBoundingClientRect(), {
+          clientX: a,
+          clientY: d
+        } = u, {
+          left: f,
+          right: j,
+          top: p,
+          bottom: y
+        } = l;
+        a > f && a < j && d > p && d < y && c((E) => [...E, {
           id: Date.now() + Math.random() * 1e3,
-          x: u - m,
-          y: l - f
+          x: a - f,
+          y: d - p
         }]);
       }
     };
     return window.addEventListener("pointerdown", e), () => {
       window.removeEventListener("pointerdown", e);
     };
-  }, [t]);
-  const k = h((e) => {
-    d((i) => i.filter((c) => c.id !== e));
+  }, [n, i]);
+  const k = v((e) => {
+    c((u) => u.filter((l) => l.id !== e));
   }, []);
-  return /* @__PURE__ */ a.jsx("div", { ...o, ref: n, style: {
+  return /* @__PURE__ */ m.jsx("div", { ...o, ref: t, style: {
     "--size": `${r}px`
-  }, className: v("kakadu-components-4189236582", s), children: x.map((e) => /* @__PURE__ */ a.jsx(C, { id: e.id, x: e.x, y: e.y, onEnd: k }, e.id)) });
+  }, className: C("kakadu-components-4189236582", s), children: i ? w.map((e) => /* @__PURE__ */ m.jsx(g, { id: e.id, x: e.x, y: e.y, onEnd: k }, e.id)) : null });
 }
 export {
-  N as default
+  V as default
 };

package/build/components/hover-gradient.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const p=require("../jsx-runtime-BB_1_6y_.js"),t=require("react"),x=require("@kuma-ui/core"),$="kakadu-components-2608453841";function q({isActive:i=!0,size:k=200,className:E,...g}){const l=t.useRef(null),n=t.useRef(null),[b,s]=t.useState(!1),[o,j]=t.useState();return t.useEffect(()=>{if(!i){s(!1);return}const c=l.current;if(!c)return;n.current||(n.current=c.parentElement);const e=n.current;if(!e)return;const a=f=>{const S=f.target;if(!e.contains(S))return;const y=e.getBoundingClientRect(),{clientX:r,clientY:u}=f,{left:d,right:L,top:v,bottom:R}=y;r>d&&r<L&&u>v&&u<R&&(s(!0),j([r-d,u-v]))},m=()=>{s(!1)};return e.addEventListener("mousemove",a),e.addEventListener("mouseleave",m),()=>{e.removeEventListener("mousemove",a),e.removeEventListener("mouseleave",m)}},[i]),p.jsxRuntimeExports.jsx("div",{...g,ref:l,className:x.cx("kakadu-components-1237006455",E),children:o?p.jsxRuntimeExports.jsx("div",{style:{"--size":`${k}px`,"--offset-x":`${o[0]}px`,"--offset-y":`${o[1]}px`},className:x.cx("kakadu-components-611160091",b&&"kakadu-components-3627966847")}):null})}exports.default=q;exports.normalBlendStyles=$;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const x=require("../jsx-runtime-BB_1_6y_.js"),t=require("react"),k=require("@kuma-ui/core"),$=require("../hooks/use-is-in-view.js"),I="kakadu-components-2608453841";function V({isActive:l=!0,size:E=200,className:g,...b}){const s=t.useRef(null),o=$.default(s),n=t.useRef(null),[j,r]=t.useState(!1),[u,S]=t.useState();return t.useEffect(()=>{if(!l||!o){r(!1);return}const a=s.current;if(!a)return;n.current||(n.current=a.parentElement);const e=n.current;if(!e)return;const m=d=>{const q=d.target;if(!e.contains(q))return;const y=e.getBoundingClientRect(),{clientX:i,clientY:c}=d,{left:v,right:L,top:p,bottom:R}=y;i>v&&i<L&&c>p&&c<R&&(r(!0),S([i-v,c-p]))},f=()=>{r(!1)};return e.addEventListener("mousemove",m),e.addEventListener("mouseleave",f),()=>{e.removeEventListener("mousemove",m),e.removeEventListener("mouseleave",f)}},[l,o]),x.jsxRuntimeExports.jsx("div",{...b,ref:s,className:k.cx("kakadu-components-1237006455",g),children:u&&o?x.jsxRuntimeExports.jsx("div",{style:{"--size":`${E}px`,"--offset-x":`${u[0]}px`,"--offset-y":`${u[1]}px`},className:k.cx("kakadu-components-611160091",j&&"kakadu-components-3627966847")}):null})}exports.default=V;exports.normalBlendStyles=I;

package/build/components/hover-gradient.mjs

@@ -1,53 +1,54 @@
-import { j as p } from "../jsx-runtime-B4hRZ52C.mjs";
-import { useRef as v, useState as x, useEffect as N } from "react";
-import { cx as k } from "@kuma-ui/core";
-const z = "kakadu-components-2608453841";
-function C({
-  isActive: i = !0,
-  size: E = 200,
-  className: g,
-  ...L
+import { j as v } from "../jsx-runtime-B4hRZ52C.mjs";
+import { useRef as x, useState as k, useEffect as w } from "react";
+import { cx as E } from "@kuma-ui/core";
+import B from "../hooks/use-is-in-view.mjs";
+const C = "kakadu-components-2608453841";
+function G({
+  isActive: a = !0,
+  size: g = 200,
+  className: L,
+  ...b
 }) {
-  const a = v(null), t = v(null), [b, n] = x(!1), [s, j] = x();
-  return N(() => {
-    if (!i) {
-      n(!1);
+  const n = x(null), s = B(n), t = x(null), [j, o] = k(!1), [r, I] = k();
+  return w(() => {
+    if (!a || !s) {
+      o(!1);
       return;
     }
-    const u = a.current;
-    if (!u)
+    const c = n.current;
+    if (!c)
       return;
-    t.current || (t.current = u.parentElement);
+    t.current || (t.current = c.parentElement);
     const e = t.current;
     if (!e)
       return;
-    const c = (m) => {
-      const y = m.target;
-      if (!e.contains(y))
+    const l = (f) => {
+      const V = f.target;
+      if (!e.contains(V))
         return;
-      const $ = e.getBoundingClientRect(), {
-        clientX: o,
-        clientY: r
-      } = m, {
-        left: f,
-        right: h,
-        top: d,
-        bottom: B
-      } = $;
-      o > f && o < h && r > d && r < B && (n(!0), j([o - f, r - d]));
-    }, l = () => {
-      n(!1);
+      const y = e.getBoundingClientRect(), {
+        clientX: i,
+        clientY: u
+      } = f, {
+        left: d,
+        right: $,
+        top: p,
+        bottom: h
+      } = y;
+      i > d && i < $ && u > p && u < h && (o(!0), I([i - d, u - p]));
+    }, m = () => {
+      o(!1);
     };
-    return e.addEventListener("mousemove", c), e.addEventListener("mouseleave", l), () => {
-      e.removeEventListener("mousemove", c), e.removeEventListener("mouseleave", l);
+    return e.addEventListener("mousemove", l), e.addEventListener("mouseleave", m), () => {
+      e.removeEventListener("mousemove", l), e.removeEventListener("mouseleave", m);
     };
-  }, [i]), /* @__PURE__ */ p.jsx("div", { ...L, ref: a, className: k("kakadu-components-1237006455", g), children: s ? /* @__PURE__ */ p.jsx("div", { style: {
-    "--size": `${E}px`,
-    "--offset-x": `${s[0]}px`,
-    "--offset-y": `${s[1]}px`
-  }, className: k("kakadu-components-611160091", b && "kakadu-components-3627966847") }) : null });
+  }, [a, s]), /* @__PURE__ */ v.jsx("div", { ...b, ref: n, className: E("kakadu-components-1237006455", L), children: r && s ? /* @__PURE__ */ v.jsx("div", { style: {
+    "--size": `${g}px`,
+    "--offset-x": `${r[0]}px`,
+    "--offset-y": `${r[1]}px`
+  }, className: E("kakadu-components-611160091", j && "kakadu-components-3627966847") }) : null });
 }
 export {
-  C as default,
-  z as normalBlendStyles
+  G as default,
+  C as normalBlendStyles
 };

package/package.json

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