m3-ripple 1.1.0 → 1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,7 @@
1
+ # 1.1.1 - 30 Dec
2
+ Fix:
3
+ - ripple sharing element
4
+
1
5
  # 1.1.0 - 30 Dec 2025
2
6
  Improvement:
3
7
  - add `pointer-events: none` to ripple element to prevent blocking pointer events on parent elements
package/dist/index.cjs.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Y=require("react/jsx-runtime"),r=require("react"),J=.2,K=12,Q=75,V=.35,W="forwards",ee=({hoverOpacity:k,pressedOpacity:g,disabled:l=!1,className:v="",style:D,easing:I,duration:a=150,minimumPressDuration:y=225,touchDelay:S=150})=>{const[H,M]=r.useState(!1),[U,T]=r.useState(!1),o=r.useRef(null),P=r.useRef(null),m=r.useRef(""),$=r.useRef(""),b=r.useRef(0),E=r.useRef(void 0),s=r.useRef(0),R=r.useRef(void 0),w=r.useRef(!1);r.useEffect(()=>{if(!P.current)return;const e=P.current.style;k!==void 0&&e.setProperty("--ripple-hover-opacity",k+""),g!==void 0&&e.setProperty("--ripple-pressed-opacity",g+""),a!==void 0&&a!==150&&e.setProperty("--ripple-duration",a+"ms")},[k,g,a]);const f=(e,t)=>parent.addEventListener(e,t,!0),p=(e,t)=>parent.removeEventListener(e,t,!0);r.useEffect(()=>{var t;if((t=o.current)!=null&&t.parentElement)return f("click",F),f("contextmenu",X),f("pointercancel",O),f("pointerdown",q),f("pointerenter",_),f("pointerleave",j),f("pointerup",G),()=>{p("click",F),p("contextmenu",X),p("pointercancel",O),p("pointerdown",q),p("pointerenter",_),p("pointerleave",j),p("pointerup",G)}},[l,I,a,y,S]);const h=r.useCallback(({pointerType:e})=>e==="touch",[]),u=r.useCallback(e=>{var n,c;if(l||(c=(n=o.current)==null?void 0:n.parentElement)!=null&&c.disabled||!e.isPrimary||R.current&&R.current.pointerId!==e.pointerId)return!1;if(e.type==="pointerenter"||e.type==="pointerleave")return!h(e);const t=e.buttons===1;return h(e)||t},[l,h]),N=r.useCallback(({x:e,y:t})=>{const n=o.current;if(!n)return!1;const c=n.getBoundingClientRect();return e>=c.left&&e<=c.right&&t>=c.top&&t<=c.bottom},[o]),_=r.useCallback(e=>{u(e)&&M(!0)},[u]),z=r.useCallback(()=>{const e=o.current;if(!e)return;const{height:t,width:n}=e.getBoundingClientRect(),c=Math.max(t,n),C=Math.max(V*c,Q),x=Math.floor(c*J),Z=Math.sqrt(n**2+t**2)+K;b.current=x,$.current=(Z+C)/x+"",m.current=x+"px"},[o]),B=r.useCallback(e=>{const t=o.current;if(!t)return{x:0,y:0};const n=t.getBoundingClientRect(),c=window.scrollX+n.left,C=window.scrollY+n.top;return{x:e.pageX-c,y:e.pageY-C}},[o]),L=r.useCallback(e=>{const t=o.current.parentElement;if(!t)return{startPoint:{x:0,y:0},endPoint:{x:0,y:0}};const n=t.getBoundingClientRect(),c={x:(n.width-b.current)/2,y:(n.height-b.current)/2};return{startPoint:B(e),endPoint:c}},[o,B]),d=r.useCallback(e=>{var A;const t=P.current;if(!t)return;T(!0),(A=E.current)==null||A.cancel(),z();const{startPoint:n,endPoint:c}=L(e),C=`${n.x}px, ${n.y}px`,x=`${c.x}px, ${c.y}px`;E.current=t.animate({height:[m.current,m.current],width:[m.current,m.current],transform:[`translate(${C}) scale(1)`,`translate(${x}) scale(${$.current})`]},{pseudoElement:"::after",duration:a,easing:I,fill:W})},[z,a,I,L]),i=r.useCallback(()=>{R.current=void 0,s.current=0;const e=E.current;let t=1/0;if(typeof(e==null?void 0:e.currentTime)=="number"?t=e.currentTime:e!=null&&e.currentTime&&(t=e.currentTime.to("ms").value),t>=y)return void T(!1);setTimeout(()=>{E.current===e&&T(!1)},y-t)},[y]),j=r.useCallback(e=>{u(e)&&(M(!1),s.current!==0&&i())},[i,u]),G=r.useCallback(e=>{if(u(e)){if(s.current===2){s.current=3;return}if(s.current===1){s.current=3,d(R.current);return}}},[u,d]),q=r.useCallback(async e=>{if(u(e)){if(R.current=e,!h(e)){s.current=3,d(e);return}w.current&&!N(e)||(w.current=!1,s.current=1,await new Promise(t=>{setTimeout(t,S)}),s.current===1&&(s.current=2,d(e)))}},[u,h,N,d,S]),F=r.useCallback(()=>{if(!l){if(s.current===3){i();return}s.current===0&&(d(),i())}},[l,i,d]),O=r.useCallback(e=>{u(e)&&i()},[i,u]),X=r.useCallback(()=>{l||(w.current=!0,i())},[l,i]);return Y.jsx("div",{ref:o,className:`salty-ripple${v?` ${v}`:""}`,style:D,"aria-hidden":"true",children:Y.jsx("div",{ref:P,className:`salty-ripple-surface${H?" --hover":""}${U?" --press":""}`})})};exports.Ripple=ee;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O=require("react/jsx-runtime"),r=require("react"),U=.2,Z=12,J=75,K=.35,Q="forwards",V=({hoverOpacity:P,pressedOpacity:E,disabled:a=!1,className:w="",style:X,easing:k,duration:f=150,minimumPressDuration:C=225,touchDelay:g=150})=>{const[Y,A]=r.useState(!1),[D,I]=r.useState(!1),o=r.useRef(null),x=r.useRef(null),m=r.useRef(""),v=r.useRef(""),S=r.useRef(0),y=r.useRef(void 0),s=r.useRef(0),R=r.useRef(void 0),T=r.useRef(!1);r.useEffect(()=>{if(!x.current)return;const e=x.current.style;P!==void 0&&e.setProperty("--ripple-hover-opacity",P+""),E!==void 0&&e.setProperty("--ripple-pressed-opacity",E+""),f!==void 0&&f!==150&&e.setProperty("--ripple-duration",f+"ms")},[P,E,f]),r.useEffect(()=>{var c;const e=(c=o.current)==null?void 0:c.parentElement;if(!e)return;const t=(n,l)=>e.addEventListener(n,l,!0);return t("click",G),t("contextmenu",F),t("pointercancel",q),t("pointerdown",j),t("pointerenter",$),t("pointerleave",B),t("pointerup",L),()=>{const n=(l,d)=>e.removeEventListener(l,d,!0);n("click",G),n("contextmenu",F),n("pointercancel",q),n("pointerdown",j),n("pointerenter",$),n("pointerleave",B),n("pointerup",L)}},[a,k,f,C,g]);const h=r.useCallback(({pointerType:e})=>e==="touch",[]),u=r.useCallback(e=>{var c,n;if(a||(n=(c=o.current)==null?void 0:c.parentElement)!=null&&n.disabled||!e.isPrimary||R.current&&R.current.pointerId!==e.pointerId)return!1;if(e.type==="pointerenter"||e.type==="pointerleave")return!h(e);const t=e.buttons===1;return h(e)||t},[a,h]),M=r.useCallback(({x:e,y:t})=>{const c=o.current;if(!c)return!1;const n=c.getBoundingClientRect();return e>=n.left&&e<=n.right&&t>=n.top&&t<=n.bottom},[o]),$=r.useCallback(e=>{u(e)&&A(!0)},[u]),N=r.useCallback(()=>{const e=o.current;if(!e)return;const{height:t,width:c}=e.getBoundingClientRect(),n=Math.max(t,c),l=Math.max(K*n,J),d=Math.floor(n*U),H=Math.sqrt(c**2+t**2)+Z;S.current=d,v.current=(H+l)/d+"",m.current=d+"px"},[o]),_=r.useCallback(e=>{const t=o.current;if(!t)return{x:0,y:0};const c=t.getBoundingClientRect(),n=window.scrollX+c.left,l=window.scrollY+c.top;return{x:e.pageX-n,y:e.pageY-l}},[o]),z=r.useCallback(e=>{const t=o.current.parentElement;if(!t)return{startPoint:{x:0,y:0},endPoint:{x:0,y:0}};const c=t.getBoundingClientRect(),n={x:(c.width-S.current)/2,y:(c.height-S.current)/2};return{startPoint:_(e),endPoint:n}},[o,_]),p=r.useCallback(e=>{var b;const t=x.current;if(!t)return;I(!0),(b=y.current)==null||b.cancel(),N();const{startPoint:c,endPoint:n}=z(e),l=`${c.x}px, ${c.y}px`,d=`${n.x}px, ${n.y}px`;y.current=t.animate({height:[m.current,m.current],width:[m.current,m.current],transform:[`translate(${l}) scale(1)`,`translate(${d}) scale(${v.current})`]},{pseudoElement:"::after",duration:f,easing:k,fill:Q})},[N,f,k,z]),i=r.useCallback(()=>{R.current=void 0,s.current=0;const e=y.current;let t=1/0;if(typeof(e==null?void 0:e.currentTime)=="number"?t=e.currentTime:e!=null&&e.currentTime&&(t=e.currentTime.to("ms").value),t>=C)return void I(!1);setTimeout(()=>{y.current===e&&I(!1)},C-t)},[C]),B=r.useCallback(e=>{u(e)&&(A(!1),s.current!==0&&i())},[i,u]),L=r.useCallback(e=>{if(u(e)){if(s.current===2){s.current=3;return}if(s.current===1){s.current=3,p(R.current);return}}},[u,p]),j=r.useCallback(async e=>{if(u(e)){if(R.current=e,!h(e)){s.current=3,p(e);return}T.current&&!M(e)||(T.current=!1,s.current=1,await new Promise(t=>{setTimeout(t,g)}),s.current===1&&(s.current=2,p(e)))}},[u,h,M,p,g]),G=r.useCallback(()=>{if(!a){if(s.current===3){i();return}s.current===0&&(p(),i())}},[a,i,p]),q=r.useCallback(e=>{u(e)&&i()},[i,u]),F=r.useCallback(()=>{a||(T.current=!0,i())},[a,i]);return O.jsx("div",{ref:o,className:`salty-ripple${w?` ${w}`:""}`,style:X,"aria-hidden":"true",children:O.jsx("div",{ref:x,className:`salty-ripple-surface${Y?" --hover":""}${D?" --press":""}`})})};exports.Ripple=V;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,WAAW;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IAEvB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAE3B;;OAEG;IACH,MAAM,CAAC,EAAE,4BAA4B,CAAA;IAErC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB;;;;;OAKG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAE7B;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB;AA+CD;;GAEG;AACH,eAAO,MAAM,MAAM,GAAI,kHAUpB,WAAW,4CAoVb,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,WAAW;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IAEvB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAE3B;;OAEG;IACH,MAAM,CAAC,EAAE,4BAA4B,CAAA;IAErC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB;;;;;OAKG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAE7B;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;CACtB;AA+CD;;GAEG;AACH,eAAO,MAAM,MAAM,GAAI,kHAUpB,WAAW,4CAqVb,CAAA"}
package/dist/index.js CHANGED
@@ -1,41 +1,42 @@
1
- import { jsx as H } from "react/jsx-runtime";
2
- import { useState as U, useRef as l, useEffect as Z, useCallback as o } from "react";
3
- const W = 0.2, b = 12, ee = 75, te = 0.35, re = "forwards", ce = ({
4
- hoverOpacity: T,
5
- pressedOpacity: w,
1
+ import { jsx as q } from "react/jsx-runtime";
2
+ import { useState as D, useRef as f, useEffect as H, useCallback as o } from "react";
3
+ const Q = 0.2, V = 12, W = 75, b = 0.35, ee = "forwards", ne = ({
4
+ hoverOpacity: I,
5
+ pressedOpacity: g,
6
6
  disabled: a = !1,
7
- className: N = "",
8
- style: J,
9
- easing: S,
10
- duration: f = 150,
11
- minimumPressDuration: E = 225,
12
- touchDelay: C = 150
7
+ className: v = "",
8
+ style: U,
9
+ easing: T,
10
+ duration: p = 150,
11
+ minimumPressDuration: P = 225,
12
+ touchDelay: w = 150
13
13
  }) => {
14
- const [K, _] = U(!1), [Q, A] = U(!1), s = l(null), I = l(null), h = l(""), z = l(""), $ = l(0), g = l(void 0), c = l(
14
+ const [Z, M] = D(!1), [J, S] = D(!1), s = f(null), y = f(null), h = f(""), N = f(""), C = f(0), E = f(void 0), c = f(
15
15
  0
16
16
  /* INACTIVE */
17
- ), x = l(void 0), v = l(!1);
18
- Z(() => {
19
- if (!I.current) return;
20
- const e = I.current.style;
21
- T !== void 0 && e.setProperty("--ripple-hover-opacity", T + ""), w !== void 0 && e.setProperty("--ripple-pressed-opacity", w + ""), f !== void 0 && f !== 150 && e.setProperty("--ripple-duration", f + "ms");
22
- }, [T, w, f]);
23
- const p = (e, t) => parent.addEventListener(e, t, !0), d = (e, t) => parent.removeEventListener(e, t, !0);
24
- Z(() => {
25
- var t;
26
- if ((t = s.current) != null && t.parentElement)
27
- return p("click", j), p("contextmenu", D), p("pointercancel", q), p("pointerdown", O), p("pointerenter", L), p("pointerleave", X), p("pointerup", Y), () => {
28
- d("click", j), d("contextmenu", D), d("pointercancel", q), d("pointerdown", O), d("pointerenter", L), d("pointerleave", X), d("pointerup", Y);
29
- };
30
- }, [a, S, f, E, C]);
17
+ ), x = f(void 0), A = f(!1);
18
+ H(() => {
19
+ if (!y.current) return;
20
+ const e = y.current.style;
21
+ I !== void 0 && e.setProperty("--ripple-hover-opacity", I + ""), g !== void 0 && e.setProperty("--ripple-pressed-opacity", g + ""), p !== void 0 && p !== 150 && e.setProperty("--ripple-duration", p + "ms");
22
+ }, [I, g, p]), H(() => {
23
+ var n;
24
+ const e = (n = s.current) == null ? void 0 : n.parentElement;
25
+ if (!e) return;
26
+ const t = (r, l) => e.addEventListener(r, l, !0);
27
+ return t("click", Y), t("contextmenu", j), t("pointercancel", O), t("pointerdown", X), t("pointerenter", z), t("pointerleave", G), t("pointerup", F), () => {
28
+ const r = (l, m) => e.removeEventListener(l, m, !0);
29
+ r("click", Y), r("contextmenu", j), r("pointercancel", O), r("pointerdown", X), r("pointerenter", z), r("pointerleave", G), r("pointerup", F);
30
+ };
31
+ }, [a, T, p, P, w]);
31
32
  const R = o(
32
33
  ({ pointerType: e }) => e === "touch",
33
34
  []
34
35
  ), i = o(
35
36
  (e) => {
36
- var r, n;
37
+ var n, r;
37
38
  if (a || // @ts-ignore
38
- (n = (r = s.current) == null ? void 0 : r.parentElement) != null && n.disabled || !e.isPrimary || x.current && x.current.pointerId !== e.pointerId)
39
+ (r = (n = s.current) == null ? void 0 : n.parentElement) != null && r.disabled || !e.isPrimary || x.current && x.current.pointerId !== e.pointerId)
39
40
  return !1;
40
41
  if (e.type === "pointerenter" || e.type === "pointerleave")
41
42
  return !R(e);
@@ -43,94 +44,94 @@ const W = 0.2, b = 12, ee = 75, te = 0.35, re = "forwards", ce = ({
43
44
  return R(e) || t;
44
45
  },
45
46
  [a, R]
46
- ), B = o(
47
+ ), _ = o(
47
48
  // @ts-ignore
48
49
  ({ x: e, y: t }) => {
49
- const r = s.current;
50
- if (!r) return !1;
51
- const n = r.getBoundingClientRect();
52
- return e >= n.left && e <= n.right && t >= n.top && t <= n.bottom;
50
+ const n = s.current;
51
+ if (!n) return !1;
52
+ const r = n.getBoundingClientRect();
53
+ return e >= r.left && e <= r.right && t >= r.top && t <= r.bottom;
53
54
  },
54
55
  [s]
55
- ), L = o(
56
+ ), z = o(
56
57
  (e) => {
57
- i(e) && _(!0);
58
+ i(e) && M(!0);
58
59
  },
59
60
  [i]
60
- ), k = o(() => {
61
+ ), B = o(() => {
61
62
  const e = s.current;
62
63
  if (!e) return;
63
- const { height: t, width: r } = e.getBoundingClientRect(), n = Math.max(t, r), P = Math.max(
64
- te * n,
65
- ee
66
- ), y = Math.floor(n * W), V = Math.sqrt(r ** 2 + t ** 2) + b;
67
- $.current = y, z.current = (V + P) / y + "", h.current = y + "px";
68
- }, [s]), G = o(
64
+ const { height: t, width: n } = e.getBoundingClientRect(), r = Math.max(t, n), l = Math.max(
65
+ b * r,
66
+ W
67
+ ), m = Math.floor(r * Q), K = Math.sqrt(n ** 2 + t ** 2) + V;
68
+ C.current = m, N.current = (K + l) / m + "", h.current = m + "px";
69
+ }, [s]), L = o(
69
70
  (e) => {
70
71
  const t = s.current;
71
72
  if (!t) return { x: 0, y: 0 };
72
- const r = t.getBoundingClientRect(), n = window.scrollX + r.left, P = window.scrollY + r.top;
73
+ const n = t.getBoundingClientRect(), r = window.scrollX + n.left, l = window.scrollY + n.top;
73
74
  return {
74
- x: e.pageX - n,
75
- y: e.pageY - P
75
+ x: e.pageX - r,
76
+ y: e.pageY - l
76
77
  };
77
78
  },
78
79
  [s]
79
- ), F = o(
80
+ ), k = o(
80
81
  (e) => {
81
82
  const t = s.current.parentElement;
82
83
  if (!t)
83
84
  return { startPoint: { x: 0, y: 0 }, endPoint: { x: 0, y: 0 } };
84
- const r = t.getBoundingClientRect(), n = {
85
- x: (r.width - $.current) / 2,
86
- y: (r.height - $.current) / 2
85
+ const n = t.getBoundingClientRect(), r = {
86
+ x: (n.width - C.current) / 2,
87
+ y: (n.height - C.current) / 2
87
88
  };
88
89
  return {
89
- startPoint: G(e),
90
- endPoint: n
90
+ startPoint: L(e),
91
+ endPoint: r
91
92
  };
92
93
  },
93
- [s, G]
94
- ), m = o(
94
+ [s, L]
95
+ ), d = o(
95
96
  (e) => {
96
- var M;
97
- const t = I.current;
97
+ var $;
98
+ const t = y.current;
98
99
  if (!t) return;
99
- A(!0), (M = g.current) == null || M.cancel(), k();
100
- const { startPoint: r, endPoint: n } = F(e), P = `${r.x}px, ${r.y}px`, y = `${n.x}px, ${n.y}px`;
101
- g.current = t.animate(
100
+ S(!0), ($ = E.current) == null || $.cancel(), B();
101
+ const { startPoint: n, endPoint: r } = k(e), l = `${n.x}px, ${n.y}px`, m = `${r.x}px, ${r.y}px`;
102
+ E.current = t.animate(
102
103
  {
103
104
  height: [h.current, h.current],
104
105
  width: [h.current, h.current],
105
106
  transform: [
106
- `translate(${P}) scale(1)`,
107
- `translate(${y}) scale(${z.current})`
107
+ `translate(${l}) scale(1)`,
108
+ `translate(${m}) scale(${N.current})`
108
109
  ]
109
110
  },
110
111
  {
111
112
  pseudoElement: "::after",
112
- duration: f,
113
- easing: S,
114
- fill: re
113
+ duration: p,
114
+ easing: T,
115
+ fill: ee
115
116
  }
116
117
  );
117
118
  },
118
- [k, f, S, F]
119
+ [B, p, T, k]
119
120
  ), u = o(() => {
120
121
  x.current = void 0, c.current = 0;
121
- const e = g.current;
122
+ const e = E.current;
122
123
  let t = 1 / 0;
123
- if (typeof (e == null ? void 0 : e.currentTime) == "number" ? t = e.currentTime : e != null && e.currentTime && (t = e.currentTime.to("ms").value), t >= E)
124
- return void A(!1);
124
+ if (typeof (e == null ? void 0 : e.currentTime) == "number" ? t = e.currentTime : e != null && e.currentTime && (t = e.currentTime.to("ms").value), t >= P)
125
+ return void S(!1);
125
126
  setTimeout(() => {
126
- g.current === e && A(!1);
127
- }, E - t);
128
- }, [E]), X = o(
127
+ E.current === e && S(!1);
128
+ }, P - t);
129
+ }, [P]), G = o(
129
130
  (e) => {
130
- i(e) && (_(!1), c.current !== 0 && u());
131
+ i(e) && (M(!1), c.current !== 0 && u());
131
132
  },
132
133
  [u, i]
133
- ), Y = o(
134
+ ), F = o(
134
135
  (e) => {
135
136
  if (i(e)) {
136
137
  if (c.current === 2) {
@@ -138,58 +139,58 @@ const W = 0.2, b = 12, ee = 75, te = 0.35, re = "forwards", ce = ({
138
139
  return;
139
140
  }
140
141
  if (c.current === 1) {
141
- c.current = 3, m(x.current);
142
+ c.current = 3, d(x.current);
142
143
  return;
143
144
  }
144
145
  }
145
146
  },
146
- [i, m]
147
- ), O = o(
147
+ [i, d]
148
+ ), X = o(
148
149
  async (e) => {
149
150
  if (i(e)) {
150
151
  if (x.current = e, !R(e)) {
151
- c.current = 3, m(e);
152
+ c.current = 3, d(e);
152
153
  return;
153
154
  }
154
- v.current && !B(e) || (v.current = !1, c.current = 1, await new Promise((t) => {
155
- setTimeout(t, C);
156
- }), c.current === 1 && (c.current = 2, m(e)));
155
+ A.current && !_(e) || (A.current = !1, c.current = 1, await new Promise((t) => {
156
+ setTimeout(t, w);
157
+ }), c.current === 1 && (c.current = 2, d(e)));
157
158
  }
158
159
  },
159
- [i, R, B, m, C]
160
- ), j = o(() => {
160
+ [i, R, _, d, w]
161
+ ), Y = o(() => {
161
162
  if (!a) {
162
163
  if (c.current === 3) {
163
164
  u();
164
165
  return;
165
166
  }
166
- c.current === 0 && (m(), u());
167
+ c.current === 0 && (d(), u());
167
168
  }
168
- }, [a, u, m]), q = o(
169
+ }, [a, u, d]), O = o(
169
170
  (e) => {
170
171
  i(e) && u();
171
172
  },
172
173
  [u, i]
173
- ), D = o(() => {
174
- a || (v.current = !0, u());
174
+ ), j = o(() => {
175
+ a || (A.current = !0, u());
175
176
  }, [a, u]);
176
- return /* @__PURE__ */ H(
177
+ return /* @__PURE__ */ q(
177
178
  "div",
178
179
  {
179
180
  ref: s,
180
- className: `salty-ripple${N ? ` ${N}` : ""}`,
181
- style: J,
181
+ className: `salty-ripple${v ? ` ${v}` : ""}`,
182
+ style: U,
182
183
  "aria-hidden": "true",
183
- children: /* @__PURE__ */ H(
184
+ children: /* @__PURE__ */ q(
184
185
  "div",
185
186
  {
186
- ref: I,
187
- className: `salty-ripple-surface${K ? " --hover" : ""}${Q ? " --press" : ""}`
187
+ ref: y,
188
+ className: `salty-ripple-surface${Z ? " --hover" : ""}${J ? " --press" : ""}`
188
189
  }
189
190
  )
190
191
  }
191
192
  );
192
193
  };
193
194
  export {
194
- ce as Ripple
195
+ ne as Ripple
195
196
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "m3-ripple",
3
- "version": "1.1.0",
3
+ "version": "1.1.1",
4
4
  "description": "React TypeScript implementation of Material Design 3 Ripple component",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",