Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-next-tilt

Package Overview
Dependencies
Maintainers
1
Versions
17
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-next-tilt - npm Package Compare versions

Comparing version 0.0.5 to 0.0.6

6

dist/index.d.ts

@@ -480,2 +480,8 @@ import { HTMLAttributes, CSSProperties, PropsWithChildren, MouseEventHandler, TouchEventHandler, FocusEventHandler, FC, RefObject } from 'react';

onTilt?: (angle: Angle) => void;
/**
* Callback function that is called when the tilt angle is reset
*
* @default undefined
*/
onReset?: () => void;
[data: `data-${string}`]: string | undefined;

@@ -482,0 +488,0 @@ onMouseEnter?: MouseEventHandler<HTMLDivElement>;

791

dist/react-next-tilt.js

@@ -1,3 +0,3 @@

import ur, { forwardRef as pr, useRef as Ce, useCallback as b, useMemo as ar, useImperativeHandle as mr, useEffect as or, memo as hr } from "react";
var tr = { exports: {} }, Le = {};
import cr, { forwardRef as pr, useRef as xe, useCallback as R, useMemo as or, useImperativeHandle as mr, useEffect as ir, memo as hr } from "react";
var nr = { exports: {} }, Ve = {};
/**

@@ -12,21 +12,21 @@ * @license React

*/
var ir;
var fr;
function yr() {
if (ir)
return Le;
ir = 1;
var a = ur, o = Symbol.for("react.element"), v = Symbol.for("react.fragment"), i = Object.prototype.hasOwnProperty, m = a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, h = { key: !0, ref: !0, __self: !0, __source: !0 };
function oe(C, R, ie) {
var j, w = {}, K = null, he = null;
ie !== void 0 && (K = "" + ie), R.key !== void 0 && (K = "" + R.key), R.ref !== void 0 && (he = R.ref);
for (j in R)
i.call(R, j) && !h.hasOwnProperty(j) && (w[j] = R[j]);
if (fr)
return Ve;
fr = 1;
var a = cr, o = Symbol.for("react.element"), v = Symbol.for("react.fragment"), i = Object.prototype.hasOwnProperty, m = a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, h = { key: !0, ref: !0, __self: !0, __source: !0 };
function te(C, w, ne) {
var j, O = {}, A = null, me = null;
ne !== void 0 && (A = "" + ne), w.key !== void 0 && (A = "" + w.key), w.ref !== void 0 && (me = w.ref);
for (j in w)
i.call(w, j) && !h.hasOwnProperty(j) && (O[j] = w[j]);
if (C && C.defaultProps)
for (j in R = C.defaultProps, R)
w[j] === void 0 && (w[j] = R[j]);
return { $$typeof: o, type: C, key: K, ref: he, props: w, _owner: m.current };
for (j in w = C.defaultProps, w)
O[j] === void 0 && (O[j] = w[j]);
return { $$typeof: o, type: C, key: A, ref: me, props: O, _owner: m.current };
}
return Le.Fragment = v, Le.jsx = oe, Le.jsxs = oe, Le;
return Ve.Fragment = v, Ve.jsx = te, Ve.jsxs = te, Ve;
}
var Ie = {};
var We = {};
/**

@@ -41,13 +41,13 @@ * @license React

*/
var fr;
var sr;
function gr() {
return fr || (fr = 1, process.env.NODE_ENV !== "production" && function() {
var a = ur, o = Symbol.for("react.element"), v = Symbol.for("react.portal"), i = Symbol.for("react.fragment"), m = Symbol.for("react.strict_mode"), h = Symbol.for("react.profiler"), oe = Symbol.for("react.provider"), C = Symbol.for("react.context"), R = Symbol.for("react.forward_ref"), ie = Symbol.for("react.suspense"), j = Symbol.for("react.suspense_list"), w = Symbol.for("react.memo"), K = Symbol.for("react.lazy"), he = Symbol.for("react.offscreen"), fe = Symbol.iterator, Qe = "@@iterator";
function Ve(e) {
return sr || (sr = 1, process.env.NODE_ENV !== "production" && function() {
var a = cr, o = Symbol.for("react.element"), v = Symbol.for("react.portal"), i = Symbol.for("react.fragment"), m = Symbol.for("react.strict_mode"), h = Symbol.for("react.profiler"), te = Symbol.for("react.provider"), C = Symbol.for("react.context"), w = Symbol.for("react.forward_ref"), ne = Symbol.for("react.suspense"), j = Symbol.for("react.suspense_list"), O = Symbol.for("react.memo"), A = Symbol.for("react.lazy"), me = Symbol.for("react.offscreen"), ae = Symbol.iterator, Qe = "@@iterator";
function Ne(e) {
if (e === null || typeof e != "object")
return null;
var r = fe && e[fe] || e[Qe];
var r = ae && e[ae] || e[Qe];
return typeof r == "function" ? r : null;
}
var se = a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
var oe = a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
function E(e) {

@@ -62,3 +62,3 @@ {

{
var f = se.ReactDebugCurrentFrame, d = f.getStackAddendum();
var f = oe.ReactDebugCurrentFrame, d = f.getStackAddendum();
d !== "" && (r += "%s", t = t.concat([d]));

@@ -71,10 +71,10 @@ var p = t.map(function(c) {

}
var ye = !1, Ge = !1, We = !1, N = !1, B = !1, ke;
ke = Symbol.for("react.module.reference");
function be(e) {
return !!(typeof e == "string" || typeof e == "function" || e === i || e === h || B || e === m || e === ie || e === j || N || e === he || ye || Ge || We || typeof e == "object" && e !== null && (e.$$typeof === K || e.$$typeof === w || e.$$typeof === oe || e.$$typeof === C || e.$$typeof === R || // This needs to include all possible module reference object
var he = !1, Ge = !1, Be = !1, U = !1, X = !1, $e;
$e = Symbol.for("react.module.reference");
function Re(e) {
return !!(typeof e == "string" || typeof e == "function" || e === i || e === h || X || e === m || e === ne || e === j || U || e === me || he || Ge || Be || typeof e == "object" && e !== null && (e.$$typeof === A || e.$$typeof === O || e.$$typeof === te || e.$$typeof === C || e.$$typeof === w || // This needs to include all possible module reference object
// types supported by any Flight configuration anywhere since
// we don't know which Flight build this will end up being used
// with.
e.$$typeof === ke || e.getModuleId !== void 0));
e.$$typeof === $e || e.getModuleId !== void 0));
}

@@ -88,3 +88,3 @@ function L(e, r, t) {

}
function $(e) {
function x(e) {
return e.displayName || "Context";

@@ -108,3 +108,3 @@ }

return "StrictMode";
case ie:
case ne:
return "Suspense";

@@ -118,12 +118,12 @@ case j:

var r = e;
return $(r) + ".Consumer";
case oe:
return x(r) + ".Consumer";
case te:
var t = e;
return $(t._context) + ".Provider";
case R:
return x(t._context) + ".Provider";
case w:
return L(e, e.render, "ForwardRef");
case w:
case O:
var f = e.displayName || null;
return f !== null ? f : _(e.type) || "Memo";
case K: {
case A: {
var d = e, p = d._payload, c = d._init;

@@ -139,14 +139,14 @@ try {

}
var Z = Object.assign, ge = 0, Ne, I, V, xe, O, Be, Re;
function Ue() {
var H = Object.assign, ye = 0, Ue, I, V, Fe, T, Xe, we;
function qe() {
}
Ue.__reactDisabledLog = !0;
function F() {
qe.__reactDisabledLog = !0;
function $() {
{
if (ge === 0) {
Ne = console.log, I = console.info, V = console.warn, xe = console.error, O = console.group, Be = console.groupCollapsed, Re = console.groupEnd;
if (ye === 0) {
Ue = console.log, I = console.info, V = console.warn, Fe = console.error, T = console.group, Xe = console.groupCollapsed, we = console.groupEnd;
var e = {
configurable: !0,
enumerable: !0,
value: Ue,
value: qe,
writable: !0

@@ -164,8 +164,8 @@ };

}
ge++;
ye++;
}
}
function U() {
function q() {
{
if (ge--, ge === 0) {
if (ye--, ye === 0) {
var e = {

@@ -177,32 +177,32 @@ configurable: !0,

Object.defineProperties(console, {
log: Z({}, e, {
value: Ne
log: H({}, e, {
value: Ue
}),
info: Z({}, e, {
info: H({}, e, {
value: I
}),
warn: Z({}, e, {
warn: H({}, e, {
value: V
}),
error: Z({}, e, {
value: xe
error: H({}, e, {
value: Fe
}),
group: Z({}, e, {
value: O
group: H({}, e, {
value: T
}),
groupCollapsed: Z({}, e, {
value: Be
groupCollapsed: H({}, e, {
value: Xe
}),
groupEnd: Z({}, e, {
value: Re
groupEnd: H({}, e, {
value: we
})
});
}
ge < 0 && E("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
ye < 0 && E("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
}
}
var $e = se.ReactCurrentDispatcher, X;
function ue(e, r, t) {
var De = oe.ReactCurrentDispatcher, z;
function ie(e, r, t) {
{
if (X === void 0)
if (z === void 0)
try {

@@ -212,18 +212,18 @@ throw Error();

var f = d.stack.trim().match(/\n( *(at )?)/);
X = f && f[1] || "";
z = f && f[1] || "";
}
return `
` + X + e;
` + z + e;
}
}
var Ee = !1, ce;
var ge = !1, fe;
{
var Fe = typeof WeakMap == "function" ? WeakMap : Map;
ce = new Fe();
var Pe = typeof WeakMap == "function" ? WeakMap : Map;
fe = new Pe();
}
function we(e, r) {
if (!e || Ee)
function Oe(e, r) {
if (!e || ge)
return "";
{
var t = ce.get(e);
var t = fe.get(e);
if (t !== void 0)

@@ -233,7 +233,7 @@ return t;

var f;
Ee = !0;
ge = !0;
var d = Error.prepareStackTrace;
Error.prepareStackTrace = void 0;
var p;
p = $e.current, $e.current = null, F();
p = De.current, De.current = null, $();
try {

@@ -251,4 +251,4 @@ if (r) {

Reflect.construct(c, []);
} catch (ne) {
f = ne;
} catch (ee) {
f = ee;
}

@@ -259,4 +259,4 @@ Reflect.construct(e, [], c);

c.call();
} catch (ne) {
f = ne;
} catch (ee) {
f = ee;
}

@@ -268,10 +268,10 @@ e.call(c.prototype);

throw Error();
} catch (ne) {
f = ne;
} catch (ee) {
f = ee;
}
e();
}
} catch (ne) {
if (ne && f && typeof ne.stack == "string") {
for (var u = ne.stack.split(`
} catch (ee) {
if (ee && f && typeof ee.stack == "string") {
for (var u = ee.stack.split(`
`), S = f.stack.split(`

@@ -287,3 +287,3 @@ `), y = u.length - 1, g = S.length - 1; y >= 1 && g >= 0 && u[y] !== S[g]; )

` + u[y].replace(" at new ", " at ");
return e.displayName && Y.includes("<anonymous>") && (Y = Y.replace("<anonymous>", e.displayName)), typeof e == "function" && ce.set(e, Y), Y;
return e.displayName && Y.includes("<anonymous>") && (Y = Y.replace("<anonymous>", e.displayName)), typeof e == "function" && fe.set(e, Y), Y;
}

@@ -295,37 +295,37 @@ while (y >= 1 && g >= 0);

} finally {
Ee = !1, $e.current = p, U(), Error.prepareStackTrace = d;
ge = !1, De.current = p, q(), Error.prepareStackTrace = d;
}
var Se = e ? e.displayName || e.name : "", nr = Se ? ue(Se) : "";
return typeof e == "function" && ce.set(e, nr), nr;
var ke = e ? e.displayName || e.name : "", ar = ke ? ie(ke) : "";
return typeof e == "function" && fe.set(e, ar), ar;
}
function De(e, r, t) {
return we(e, !1);
function Ye(e, r, t) {
return Oe(e, !1);
}
function Pe(e) {
function Le(e) {
var r = e.prototype;
return !!(r && r.isReactComponent);
}
function Oe(e, r, t) {
function se(e, r, t) {
if (e == null)
return "";
if (typeof e == "function")
return we(e, Pe(e));
return Oe(e, Le(e));
if (typeof e == "string")
return ue(e);
return ie(e);
switch (e) {
case ie:
return ue("Suspense");
case ne:
return ie("Suspense");
case j:
return ue("SuspenseList");
return ie("SuspenseList");
}
if (typeof e == "object")
switch (e.$$typeof) {
case R:
return De(e.render);
case w:
return Oe(e.type, r, t);
case K: {
return Ye(e.render);
case O:
return se(e.type, r, t);
case A: {
var f = e, d = f._payload, p = f._init;
try {
return Oe(p(d), r, t);
return se(p(d), r, t);
} catch {

@@ -337,11 +337,11 @@ }

}
var Te = Object.prototype.hasOwnProperty, Xe = {}, T = se.ReactDebugCurrentFrame;
function q(e) {
var Te = Object.prototype.hasOwnProperty, ze = {}, Je = oe.ReactDebugCurrentFrame;
function b(e) {
if (e) {
var r = e._owner, t = Oe(e.type, e._source, r ? r.type : null);
T.setExtraStackFrame(t);
var r = e._owner, t = se(e.type, e._source, r ? r.type : null);
Je.setExtraStackFrame(t);
} else
T.setExtraStackFrame(null);
Je.setExtraStackFrame(null);
}
function le(e, r, t, f, d) {
function Ee(e, r, t, f, d) {
{

@@ -361,11 +361,11 @@ var p = Function.call.bind(Te);

}
u && !(u instanceof Error) && (q(d), E("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", f || "React class", t, c, typeof u), q(null)), u instanceof Error && !(u.message in Xe) && (Xe[u.message] = !0, q(d), E("Failed %s type: %s", t, u.message), q(null));
u && !(u instanceof Error) && (b(d), E("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", f || "React class", t, c, typeof u), b(null)), u instanceof Error && !(u.message in ze) && (ze[u.message] = !0, b(d), E("Failed %s type: %s", t, u.message), b(null));
}
}
}
var _e = Array.isArray;
function k(e) {
return _e(e);
var ue = Array.isArray;
function K(e) {
return ue(e);
}
function D(e) {
function W(e) {
{

@@ -376,5 +376,5 @@ var r = typeof Symbol == "function" && Symbol.toStringTag, t = r && e[Symbol.toStringTag] || e.constructor.name || "Object";

}
function z(e) {
function F(e) {
try {
return qe(e), !1;
return N(e), !1;
} catch {

@@ -384,10 +384,10 @@ return !0;

}
function qe(e) {
function N(e) {
return "" + e;
}
function ze(e) {
if (z(e))
return E("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", D(e)), qe(e);
function Ae(e) {
if (F(e))
return E("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", W(e)), N(e);
}
var J = se.ReactCurrentOwner, Je = {
var _e = oe.ReactCurrentOwner, je = {
key: !0,

@@ -397,5 +397,5 @@ ref: !0,

__source: !0
}, Q, M, A;
A = {};
function Ae(e) {
}, Ie, Z, J;
J = {};
function ce(e) {
if (Te.call(e, "ref")) {

@@ -408,3 +408,3 @@ var r = Object.getOwnPropertyDescriptor(e, "ref").get;

}
function de(e) {
function He(e) {
if (Te.call(e, "key")) {

@@ -417,12 +417,12 @@ var r = Object.getOwnPropertyDescriptor(e, "key").get;

}
function ve(e, r) {
if (typeof e.ref == "string" && J.current && r && J.current.stateNode !== r) {
var t = _(J.current.type);
A[t] || (E('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', _(J.current.type), e.ref), A[t] = !0);
function le(e, r) {
if (typeof e.ref == "string" && _e.current && r && _e.current.stateNode !== r) {
var t = _(_e.current.type);
J[t] || (E('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', _(_e.current.type), e.ref), J[t] = !0);
}
}
function G(e, r) {
function de(e, r) {
{
var t = function() {
Q || (Q = !0, E("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
Ie || (Ie = !0, E("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
};

@@ -435,6 +435,6 @@ t.isReactWarning = !0, Object.defineProperty(e, "key", {

}
function je(e, r) {
function Q(e, r) {
{
var t = function() {
M || (M = !0, E("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
Z || (Z = !0, E("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", r));
};

@@ -447,3 +447,3 @@ t.isReactWarning = !0, Object.defineProperty(e, "ref", {

}
var x = function(e, r, t, f, d, p, c) {
var Se = function(e, r, t, f, d, p, c) {
var u = {

@@ -477,8 +477,8 @@ // This tag allows us to uniquely identify this as a React Element

};
function H(e, r, t, f, d) {
function k(e, r, t, f, d) {
{
var p, c = {}, u = null, S = null;
t !== void 0 && (ze(t), u = "" + t), de(r) && (ze(r.key), u = "" + r.key), Ae(r) && (S = r.ref, ve(r, d));
t !== void 0 && (Ae(t), u = "" + t), He(r) && (Ae(r.key), u = "" + r.key), ce(r) && (S = r.ref, le(r, d));
for (p in r)
Te.call(r, p) && !Je.hasOwnProperty(p) && (c[p] = r[p]);
Te.call(r, p) && !je.hasOwnProperty(p) && (c[p] = r[p]);
if (e && e.defaultProps) {

@@ -491,24 +491,24 @@ var y = e.defaultProps;

var g = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
u && G(c, g), S && je(c, g);
u && de(c, g), S && Q(c, g);
}
return x(e, u, S, d, f, J.current, c);
return Se(e, u, S, d, f, _e.current, c);
}
}
var ee = se.ReactCurrentOwner, pe = se.ReactDebugCurrentFrame;
var D = oe.ReactCurrentOwner, ve = oe.ReactDebugCurrentFrame;
function P(e) {
if (e) {
var r = e._owner, t = Oe(e.type, e._source, r ? r.type : null);
pe.setExtraStackFrame(t);
var r = e._owner, t = se(e.type, e._source, r ? r.type : null);
ve.setExtraStackFrame(t);
} else
pe.setExtraStackFrame(null);
ve.setExtraStackFrame(null);
}
var re;
re = !1;
function te(e) {
var M;
M = !1;
function G(e) {
return typeof e == "object" && e !== null && e.$$typeof === o;
}
function me() {
function pe() {
{
if (ee.current) {
var e = _(ee.current.type);
if (D.current) {
var e = _(D.current.type);
if (e)

@@ -522,3 +522,3 @@ return `

}
function Ye(e) {
function be(e) {
{

@@ -534,6 +534,6 @@ if (e !== void 0) {

}
var n = {};
function s(e) {
var Ce = {};
function n(e) {
{
var r = me();
var r = pe();
if (!r) {

@@ -548,3 +548,3 @@ var t = typeof e == "string" ? e : e.displayName || e.name;

}
function l(e, r) {
function s(e, r) {
{

@@ -554,26 +554,26 @@ if (!e._store || e._store.validated || e.key != null)

e._store.validated = !0;
var t = s(r);
if (n[t])
var t = n(r);
if (Ce[t])
return;
n[t] = !0;
Ce[t] = !0;
var f = "";
e && e._owner && e._owner !== ee.current && (f = " It was passed a child from " + _(e._owner.type) + "."), P(e), E('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', t, f), P(null);
e && e._owner && e._owner !== D.current && (f = " It was passed a child from " + _(e._owner.type) + "."), P(e), E('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', t, f), P(null);
}
}
function He(e, r) {
function l(e, r) {
{
if (typeof e != "object")
return;
if (k(e))
if (K(e))
for (var t = 0; t < e.length; t++) {
var f = e[t];
te(f) && l(f, r);
G(f) && s(f, r);
}
else if (te(e))
else if (G(e))
e._store && (e._store.validated = !0);
else if (e) {
var d = Ve(e);
var d = Ne(e);
if (typeof d == "function" && d !== e.entries)
for (var p = d.call(e), c; !(c = p.next()).done; )
te(c.value) && l(c.value, r);
G(c.value) && s(c.value, r);
}

@@ -590,5 +590,5 @@ }

t = r.propTypes;
else if (typeof r == "object" && (r.$$typeof === R || // Note: Memo only checks outer props here.
else if (typeof r == "object" && (r.$$typeof === w || // Note: Memo only checks outer props here.
// Inner props are checked in the reconciler.
r.$$typeof === w))
r.$$typeof === O))
t = r.propTypes;

@@ -599,5 +599,5 @@ else

var f = _(r);
le(t, e.props, "prop", f, e);
} else if (r.PropTypes !== void 0 && !re) {
re = !0;
Ee(t, e.props, "prop", f, e);
} else if (r.PropTypes !== void 0 && !M) {
M = !0;
var d = _(r);

@@ -623,12 +623,12 @@ E("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", d || "Unknown");

{
var c = be(e);
var c = Re(e);
if (!c) {
var u = "";
(e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (u += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
var S = Ye(d);
S ? u += S : u += me();
var S = be(d);
S ? u += S : u += pe();
var y;
e === null ? y = "null" : k(e) ? y = "array" : e !== void 0 && e.$$typeof === o ? (y = "<" + (_(e.type) || "Unknown") + " />", u = " Did you accidentally export a JSX literal instead of a component?") : y = typeof e, E("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", y, u);
e === null ? y = "null" : K(e) ? y = "array" : e !== void 0 && e.$$typeof === o ? (y = "<" + (_(e.type) || "Unknown") + " />", u = " Did you accidentally export a JSX literal instead of a component?") : y = typeof e, E("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", y, u);
}
var g = H(e, r, t, d, p);
var g = k(e, r, t, d, p);
if (g == null)

@@ -640,5 +640,5 @@ return g;

if (f)
if (k(Y)) {
for (var Se = 0; Se < Y.length; Se++)
He(Y[Se], e);
if (K(Y)) {
for (var ke = 0; ke < Y.length; ke++)
l(Y[ke], e);
Object.freeze && Object.freeze(Y);

@@ -648,3 +648,3 @@ } else

else
He(Y, e);
l(Y, e);
}

@@ -654,3 +654,3 @@ return e === i ? rr(g) : er(g), g;

}
function cr(e, r, t) {
function tr(e, r, t) {
return Ke(e, r, t, !0);

@@ -661,9 +661,9 @@ }

}
var dr = lr, vr = cr;
Ie.Fragment = i, Ie.jsx = dr, Ie.jsxs = vr;
}()), Ie;
var dr = lr, vr = tr;
We.Fragment = i, We.jsx = dr, We.jsxs = vr;
}()), We;
}
process.env.NODE_ENV === "production" ? tr.exports = yr() : tr.exports = gr();
var ae = tr.exports;
const W = (a, o, v) => a < o ? o : a > v ? v : a, Er = (a, o, v) => {
process.env.NODE_ENV === "production" ? nr.exports = yr() : nr.exports = gr();
var re = nr.exports;
const B = (a, o, v) => a < o ? o : a > v ? v : a, Er = (a, o, v) => {
let i = 0;

@@ -684,3 +684,3 @@ return o === "top" ? i = (a.offsetY * 2 - 1) * -1 : o === "bottom" ? i = (a.offsetY - 0.5) * 2 : o === "left" ? i = (a.offsetX * 2 - 1) * -1 : o === "right" ? i = (a.offsetX - 0.5) * 2 : o === "all" && (i = Math.max(

return v ? h = ((i + m) * (3 / 2) - 1) * 100 : h = ((i + m) * (-3 / 2) + 0.5) * 100, `translateX(${h}%)`;
}, sr = (a) => {
}, ur = (a) => {
if (a instanceof HTMLElement)

@@ -762,109 +762,110 @@ return a;

shadowEnable: h = !1,
shadow: oe = "0 0 1rem rgba(0,0,0,0.5)",
shadow: te = "0 0 1rem rgba(0,0,0,0.5)",
lineGlareEnable: C = !0,
lineGlareBlurEnable: R = !0,
lineGlareBlurAmount: ie = "4px",
lineGlareBlurEnable: w = !0,
lineGlareBlurAmount: ne = "4px",
lineGlareMaxOpacity: j = 0.1,
lineGlareWidthPercent: w = 10,
lineGlareMixBlendMode: K = "normal",
lineGlareColor: he = "white",
lineGlareReverse: fe = !1,
lineGlareWidthPercent: O = 10,
lineGlareMixBlendMode: A = "normal",
lineGlareColor: me = "white",
lineGlareReverse: ae = !1,
lineGlareDirection: Qe = "to-bottom-right",
lineGlareHoverPosition: Ve = "top-left",
spotGlareEnable: se = !0,
lineGlareHoverPosition: Ne = "top-left",
spotGlareEnable: oe = !0,
spotGlareMaxOpacity: E = 0.5,
spotGlareMixBlendMode: Me = "normal",
spotGlarePosition: ye = "top",
spotGlarePosition: he = "top",
spotGlareColor: Ge = "white",
spotGlareReverse: We = !1,
tiltMaxAngleX: N = 20,
tiltMaxAngleY: B = 20,
tiltReverse: ke = !1,
tiltReset: be = !0,
spotGlareReverse: Be = !1,
tiltMaxAngleX: U = 20,
tiltMaxAngleY: X = 20,
tiltReverse: $e = !1,
tiltReset: Re = !0,
initialAngleX: L = 0,
initialAngleY: $ = 0,
initialAngleY: x = 0,
disableScrollOnTouch: _ = !0,
style: Z,
tiltStyle: ge,
tiltProps: Ne,
style: H,
tiltStyle: ye,
tiltProps: Ue,
gyroMaxAngleX: I = 0,
gyroMaxAngleY: V = 0,
gyroReverse: xe = !1,
disabled: O = !1,
disabledFilter: Be = "grayscale(1) brightness(125%)",
CSSTransition: Re = "all 0.4s cubic-bezier(0.03, 0.98, 0.52, 0.99)",
TiltWrapper: Ue,
fullPageListening: F = !1,
controlElement: U,
controlElementOnly: $e = !1,
testIdEnable: X = !1,
onTilt: ue,
onMouseEnter: Ee,
onMouseMove: ce,
onMouseLeave: Fe,
onTouchStart: we,
onTouchMove: De,
onTouchEnd: Pe,
children: Oe,
...Te
}, Xe) => {
const T = Ce(), q = Ce(!1), le = !F && (!U || U && !$e), _e = Ce(null), k = Ce(null), D = Ce(null), z = Ce(null), qe = b(
({ children: n }) => /* @__PURE__ */ ae.jsx(ae.Fragment, { children: n }),
gyroReverse: Fe = !1,
disabled: T = !1,
disabledFilter: Xe = "grayscale(1) brightness(125%)",
CSSTransition: we = "all 0.4s cubic-bezier(0.03, 0.98, 0.52, 0.99)",
TiltWrapper: qe,
fullPageListening: $ = !1,
controlElement: q,
controlElementOnly: De = !1,
testIdEnable: z = !1,
onTilt: ie,
onReset: ge,
onMouseEnter: fe,
onMouseMove: Pe,
onMouseLeave: Oe,
onTouchStart: Ye,
onTouchMove: Le,
onTouchEnd: se,
children: Te,
...ze
}, Je) => {
const b = xe(), Ee = xe(!1), ue = !$ && (!q || q && !De), K = xe(null), W = xe(null), F = xe(null), N = xe(null), Ae = R(
({ children: n }) => /* @__PURE__ */ re.jsx(re.Fragment, { children: n }),
[]
), ze = Ue || qe;
C && (w = W(w, 0, 50) / 2), N = W(N, 0, 90), B = W(B, 0, 90), I = W(I, 0, 90), V = W(V, 0, 90), L && (L = W(
), _e = qe || Ae;
C && (O = B(O, 0, 50) / 2), U = B(U, 0, 90), X = B(X, 0, 90), I = B(I, 0, 90), V = B(V, 0, 90), L && (L = B(
L,
-N,
N
)), $ && ($ = W(
$,
-B,
B
-U,
U
)), x && (x = B(
x,
-X,
X
));
const J = ar(() => C ? (100 - w) / 2 : 0, [C, w]), Je = ar(() => C ? J + w : 0, [C, w, J]), Q = b(() => {
if (!_e.current || !D.current || !T.current)
const je = or(() => C ? (100 - O) / 2 : 0, [C, O]), Ie = or(() => C ? je + O : 0, [C, O, je]), Z = R(() => {
if (!K.current || !F.current || !b.current)
return;
const n = Er(
T.current,
ye,
b.current,
he,
E
), s = _r(
T.current,
ye,
We
b.current,
he,
Be
);
requestAnimationFrame(() => {
D.current && (D.current.style.opacity = n, D.current.style.transform = s);
F.current && (F.current.style.opacity = n, F.current.style.transform = s);
});
}, [ye, E, We]), M = b(() => {
if (!_e.current || !z.current || !T.current)
}, [he, E, Be]), J = R(() => {
if (!K.current || !N.current || !b.current)
return;
const n = br(
T.current,
Ve,
fe
b.current,
Ne,
ae
);
requestAnimationFrame(() => {
z.current && (z.current.style.transform = n);
N.current && (N.current.style.transform = n);
});
}, [Ve, fe]), A = b(
}, [Ne, ae]), ce = R(
(n = !0) => {
if (!_e.current || !T.current)
if (!K.current || !b.current)
return { angleX: 0, angleY: 0 };
let s = -(T.current.offsetY - 0.5) * 2 * N, l = (T.current.offsetX - 0.5) * 2 * B;
return ke && n && (s = -s, l = -l), { angleX: s, angleY: l };
let s = -(b.current.offsetY - 0.5) * 2 * U, l = (b.current.offsetX - 0.5) * 2 * X;
return $e && n && (s = -s, l = -l), { angleX: s, angleY: l };
},
[N, B, ke]
), Ae = b(
[U, X, $e]
), He = R(
(n) => {
const s = (n.angleY / B + 1) / 2, l = (-n.angleX / N + 1) / 2;
T.current = { offsetX: s, offsetY: l };
const s = (n.angleY / X + 1) / 2, l = (-n.angleX / U + 1) / 2;
b.current = { offsetX: s, offsetY: l };
},
[N, B]
), de = b(
[U, X]
), le = R(
(n, s = !0) => {
const l = s ? m : 1;
requestAnimationFrame(() => {
k.current && (k.current.style.transform = `rotateX(${n.angleX}deg) rotateY(${n.angleY}deg) scale3d(${l},${l},${l})`);
}), ue && ue({
W.current && (W.current.style.transform = `rotateX(${n.angleX}deg) rotateY(${n.angleY}deg) scale3d(${l},${l},${l})`);
}), ie && ie({
angleX: n.angleX,

@@ -874,21 +875,21 @@ angleY: n.angleY

},
[ue, m]
), ve = b(
[ie, m]
), de = R(
(n, s = !1) => {
Ae(n), de(n, s), M(), Q();
He(n), le(n, s), J(), Z();
},
[M, Ae, Q, de]
), G = b(() => {
L || $ ? ve({
[J, He, Z, le]
), Q = R(() => {
ge && ge(), L || x ? de({
angleX: L || 0,
angleY: $ || 0
}) : (T.current = void 0, requestAnimationFrame(() => {
z.current && (z.current.style.transform = `translateX(${fe ? "50%" : "-100%"})`), D.current && (D.current.style.transform = "translateX(0%) translateY(0%)", D.current.style.opacity = "0"), k.current && (k.current.style.transform = "rotateX(0deg) rotateY(0deg) scale3d(1, 1, 1)");
angleY: x || 0
}) : (b.current = void 0, requestAnimationFrame(() => {
N.current && (N.current.style.transform = `translateX(${ae ? "50%" : "-100%"})`), F.current && (F.current.style.transform = "translateX(0%) translateY(0%)", F.current.style.opacity = "0"), W.current && (W.current.style.transform = "rotateX(0deg) rotateY(0deg) scale3d(1, 1, 1)");
}));
}, [L, $, fe, ve]), je = b(
}, [L, x, ae, ge, de]), Se = R(
(n, s) => {
if (!s)
return;
if (F && s instanceof Document) {
T.current = {
if ($ && s instanceof Document) {
b.current = {
offsetX: n.x / window.innerWidth,

@@ -902,64 +903,64 @@ offsetY: n.y / window.innerHeight

return;
const He = W(
const er = B(
n.x,
l.left,
l.right
), er = W(
), rr = B(
n.y,
l.top,
l.bottom
), rr = (He - l.left) / l.width, Ke = (er - l.top) / l.height;
T.current = { offsetX: rr, offsetY: Ke };
), Ke = (er - l.left) / l.width, tr = (rr - l.top) / l.height;
b.current = { offsetX: Ke, offsetY: tr };
},
[F]
), x = b((n = !0) => {
k.current && (k.current.style.willChange = n ? "transform" : ""), D.current && (D.current.style.willChange = n ? "transform, opacity" : ""), z.current && (z.current.style.willChange = n ? "transform" : "");
}, []), H = b(
[$]
), k = R((n = !0) => {
W.current && (W.current.style.willChange = n ? "transform" : ""), F.current && (F.current.style.willChange = n ? "transform, opacity" : ""), N.current && (N.current.style.willChange = n ? "transform" : "");
}, []), D = R(
(n = !0) => {
k.current && h && (k.current.style.boxShadow = n ? oe : "");
W.current && h && (W.current.style.boxShadow = n ? te : "");
},
[oe, h]
[te, h]
);
mr(
Xe,
Je,
() => ({
tilt: ve,
reset: G,
angle: () => A(!1),
updateWillChange: x,
element: _e.current
tilt: de,
reset: Q,
angle: () => ce(!1),
updateWillChange: k,
element: K.current
}),
[ve, G, x, A]
[de, Q, k, ce]
);
const ee = b(() => {
O || (q.current = !0, x(), H());
}, [O, H, x]), pe = b(() => {
O || (_ && !F && (typeof _ == "boolean" ? document.body.style.overflow = "hidden" : _.style.overflow = "hidden"), q.current = !0, x(), H());
const ve = R(() => {
T || (Ee.current = !0, k(), D());
}, [T, D, k]), P = R(() => {
T || (_ && !$ && (typeof _ == "boolean" ? document.body.style.overflow = "hidden" : _.style.overflow = "hidden"), Ee.current = !0, k(), D());
}, [
_,
O,
F,
H,
x
]), P = b(
T,
$,
D,
k
]), M = R(
(n) => {
O || (je(
T || (Se(
{ x: n.clientX, y: n.clientY },
n.currentTarget
), de(A()), M(), Q());
), le(ce()), J(), Z());
},
[
O,
A,
je,
de,
M,
Q
T,
ce,
Se,
le,
J,
Z
]
), re = b(
), G = R(
(n) => {
if (O)
if (T)
return;
const s = n.changedTouches[0];
s && (je(
s && (Se(
{

@@ -970,56 +971,56 @@ x: s.clientX,

n.currentTarget
), de(A()), M(), Q());
), le(ce()), J(), Z());
},
[
O,
A,
je,
de,
M,
Q
T,
ce,
Se,
le,
J,
Z
]
), te = b(() => {
O || (q.current = !1, x(!1), H(!1), be && G());
}, [O, G, be, H, x]), me = b(() => {
O || (_ && !F && (typeof _ == "boolean" ? document.body.style.overflow = "" : _.style.overflow = ""), q.current = !1, x(!1), H(!1), be && G());
), pe = R(() => {
T || (Ee.current = !1, k(!1), D(!1), Re && Q());
}, [T, Q, Re, D, k]), be = R(() => {
T || (_ && !$ && (typeof _ == "boolean" ? document.body.style.overflow = "" : _.style.overflow = ""), Ee.current = !1, k(!1), D(!1), Re && Q());
}, [
_,
O,
F,
G,
be,
H,
x
T,
$,
Q,
Re,
D,
k
]);
or(() => {
if (!U && !F)
ir(() => {
if (!q && !$)
return;
let n;
F || !U ? n = [document] : n = Array.isArray(U) ? U : [U];
$ || !q ? n = [document] : n = Array.isArray(q) ? q : [q];
for (let s of n) {
const l = sr(s);
l && (s = l, s.addEventListener("mouseenter", ee), s.addEventListener("mousemove", P), s.addEventListener("mouseleave", te), s.addEventListener("touchstart", pe, { passive: !0 }), s.addEventListener("touchmove", re, { passive: !0 }), s.addEventListener("touchend", me, { passive: !0 }));
const l = ur(s);
l && (s = l, s.addEventListener("mouseenter", ve), s.addEventListener("mousemove", M), s.addEventListener("mouseleave", pe), s.addEventListener("touchstart", P, { passive: !0 }), s.addEventListener("touchmove", G, { passive: !0 }), s.addEventListener("touchend", be, { passive: !0 }));
}
return () => {
for (let s of n) {
const l = sr(s);
l && (s = l, s.removeEventListener("mouseenter", ee), s.removeEventListener("mousemove", P), s.removeEventListener("mouseleave", te), s.removeEventListener("touchstart", pe), s.removeEventListener("touchmove", re), s.removeEventListener("touchend", me));
const l = ur(s);
l && (s = l, s.removeEventListener("mouseenter", ve), s.removeEventListener("mousemove", M), s.removeEventListener("mouseleave", pe), s.removeEventListener("touchstart", P), s.removeEventListener("touchmove", G), s.removeEventListener("touchend", be));
}
};
}, [
U,
ee,
q,
ve,
M,
pe,
P,
te,
pe,
re,
me,
F
G,
be,
$
]);
const Ye = b(
const Ce = R(
(n) => {
if (q.current || n.beta === null && n.gamma === null)
if (Ee.current || n.beta === null && n.gamma === null)
return;
let s = I && n.beta ? W(-n.beta, -I, I) : L || 0, l = V && n.gamma ? W(n.gamma, -V, V) : $ || 0;
xe && (s = -s, l = -l), ve({ angleX: s, angleY: l });
let s = I && n.beta ? B(-n.beta, -I, I) : L || 0, l = V && n.gamma ? B(n.gamma, -V, V) : x || 0;
Fe && (s = -s, l = -l), de({ angleX: s, angleY: l });
},

@@ -1030,17 +1031,17 @@ [

L,
$,
xe,
ve
x,
Fe,
de
]
);
return or(() => {
return ir(() => {
if (!(!I && !V))
return window.addEventListener("deviceorientation", Ye), () => window.removeEventListener("deviceorientation", Ye);
}, [I, V, Ye, x]), /* @__PURE__ */ ae.jsx(
return window.addEventListener("deviceorientation", Ce), () => window.removeEventListener("deviceorientation", Ce);
}, [I, V, Ce, k]), /* @__PURE__ */ re.jsx(
"div",
{
ref: (n) => {
n && (_e.current = n, (L || $) && !T.current && G());
n && (K.current = n, (L || x) && !b.current && Q());
},
"data-testid": X ? "container" : void 0,
"data-testid": z ? "container" : void 0,
style: Object.assign(

@@ -1055,30 +1056,30 @@ {

backfaceVisibility: "hidden",
filter: O ? Be : void 0
filter: T ? Xe : void 0
},
Z
H
),
onMouseEnter: le ? Ee ? (n) => {
ee(), Ee(n);
} : ee : Ee,
onTouchStart: le ? we ? (n) => {
pe(), we(n);
} : pe : we,
onMouseMove: le ? ce ? (n) => {
P(n), ce(n);
} : P : ce,
onTouchMove: le ? De ? (n) => {
re(n), De(n);
} : re : De,
onMouseLeave: le ? Fe ? (n) => {
te(), Fe(n);
} : te : Fe,
onTouchEnd: le ? Pe ? (n) => {
me(), Pe(n);
} : me : Pe,
...Te,
children: /* @__PURE__ */ ae.jsx(ze, { children: /* @__PURE__ */ ae.jsxs(
onMouseEnter: ue ? fe ? (n) => {
ve(), fe(n);
} : ve : fe,
onTouchStart: ue ? Ye ? (n) => {
P(), Ye(n);
} : P : Ye,
onMouseMove: ue ? Pe ? (n) => {
M(n), Pe(n);
} : M : Pe,
onTouchMove: ue ? Le ? (n) => {
G(n), Le(n);
} : G : Le,
onMouseLeave: ue ? Oe ? (n) => {
pe(), Oe(n);
} : pe : Oe,
onTouchEnd: ue ? se ? (n) => {
be(), se(n);
} : be : se,
...ze,
children: /* @__PURE__ */ re.jsx(_e, { children: /* @__PURE__ */ re.jsxs(
"div",
{
ref: k,
"data-testid": X ? "tilt" : void 0,
ref: W,
"data-testid": z ? "tilt" : void 0,
style: Object.assign(

@@ -1093,14 +1094,14 @@ {

backfaceVisibility: "hidden",
transition: Re,
transition: we,
transform: "rotateX(0deg) rotateY(0deg) scale3d(1, 1, 1)"
},
ge
ye
),
...Ne,
...Ue,
children: [
Oe,
se && /* @__PURE__ */ ae.jsx(
Te,
oe && /* @__PURE__ */ re.jsx(
"div",
{
"data-testid": X ? "spot-glare-container" : void 0,
"data-testid": z ? "spot-glare-container" : void 0,
style: {

@@ -1115,14 +1116,14 @@ pointerEvents: "none",

},
children: /* @__PURE__ */ ae.jsx(
children: /* @__PURE__ */ re.jsx(
"div",
{
ref: D,
"data-testid": X ? "spot-glare" : void 0,
ref: F,
"data-testid": z ? "spot-glare" : void 0,
style: {
position: "absolute",
left: ye === "all" ? "-50%" : "-100%",
top: ye === "all" ? "-50%" : "-100%",
left: he === "all" ? "-50%" : "-100%",
top: he === "all" ? "-50%" : "-100%",
width: "200%",
height: "200%",
transition: Re,
transition: we,
backgroundImage: `radial-gradient(${Ge}, transparent)`,

@@ -1136,6 +1137,6 @@ transform: "translateX(0%) translateY(0%)",

),
C && /* @__PURE__ */ ae.jsx(
C && /* @__PURE__ */ re.jsx(
"div",
{
"data-testid": X ? "line-glare-container" : void 0,
"data-testid": z ? "line-glare-container" : void 0,
style: {

@@ -1148,9 +1149,9 @@ pointerEvents: "none",

backfaceVisibility: "hidden",
mixBlendMode: K
mixBlendMode: A
},
children: /* @__PURE__ */ ae.jsx(
children: /* @__PURE__ */ re.jsx(
"div",
{
"data-testid": X ? "line-glare" : void 0,
ref: z,
"data-testid": z ? "line-glare" : void 0,
ref: N,
style: {

@@ -1162,7 +1163,7 @@ position: "absolute",

height: "200%",
filter: R ? `blur(${ie})` : "",
transition: Re,
filter: w ? `blur(${ne})` : "",
transition: we,
opacity: String(j),
transform: `translateX(${fe ? "50%" : "-100%"})`,
backgroundImage: `linear-gradient(${Qe === "to-bottom-right" ? "to bottom right" : "to bottom left"}, transparent, transparent ${J}%, ${he} calc(${J}% + 1px), ${he} ${Je}%, transparent calc(${Je}% + 1px), transparent 0%)`
transform: `translateX(${ae ? "50%" : "-100%"})`,
backgroundImage: `linear-gradient(${Qe === "to-bottom-right" ? "to bottom right" : "to bottom left"}, transparent, transparent ${je}%, ${me} calc(${je}% + 1px), ${me} ${Ie}%, transparent calc(${Ie}% + 1px), transparent 0%)`
}

@@ -1169,0 +1170,0 @@ }

{
"name": "react-next-tilt",
"private": false,
"version": "0.0.5",
"version": "0.0.6",
"description": "A Performant Customizable Tilt Component for React",

@@ -6,0 +6,0 @@ "main": "./dist/react-next-tilt.umd.cjs",

@@ -109,3 +109,3 @@ <h1 align="center">

<table aria-hidden="false"><thead><tr><th><span>Name</span></th><th><span>Description</span></th><th><span>Parameters</span></th></tr><tbody><tr><td><span>onTilt</span></td><td><div><span>Callback function that is called with the current tilt angle at every tilt event</span></div><div></div><div><div><code><span>(angle: Angle) => void</span></code></div></div></td><td><div><span>angle: Tilt angle ({angleX: number, angleY: number})</span></div></td></tr></tbody></table>
<table aria-hidden="false"><thead><tr><th><span>Name</span></th><th><span>Description</span></th><th><span>Parameters</span></th></tr><tbody><tr><td><span>onTilt</span></td><td><div><span>Callback function that is called with the current tilt angle at every tilt event</span></div><div></div><div><div><code><span>(angle: Angle) => void</span></code></div></div></td><td><div><span>angle: Tilt angle ({angleX: number, angleY: number})</span></div></td></tr><tr><td><span>onReset</span></td><td><div><span>Callback function that is called when the tilt angle is reset</span></div><div></div><div><div><code><span>() => void</span></code></div></div></td><td><div><span></span></div></td></tr></tbody></table>

@@ -112,0 +112,0 @@ ## Ref

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc