@webenza/ui 0.0.1 → 0.0.2
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/dist/index.js +24 -21
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +24 -21
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -10,7 +10,8 @@ var gsap__default = /*#__PURE__*/_interopDefault(gsap);
|
|
|
10
10
|
|
|
11
11
|
// src/cursor/CursorFollower/CursorFollower.tsx
|
|
12
12
|
var CursorFollower = ({
|
|
13
|
-
text = "
|
|
13
|
+
text = "",
|
|
14
|
+
// Changed from "PLAY" to empty string for generic usage
|
|
14
15
|
size = 90,
|
|
15
16
|
borderWidth = 2,
|
|
16
17
|
borderColor = "#fff",
|
|
@@ -23,7 +24,8 @@ var CursorFollower = ({
|
|
|
23
24
|
showScale = 1,
|
|
24
25
|
hideScale = 0,
|
|
25
26
|
enabled = true,
|
|
26
|
-
blockSelectors = [],
|
|
27
|
+
blockSelectors = ["button", "a"],
|
|
28
|
+
// Added sensible defaults
|
|
27
29
|
containerRef
|
|
28
30
|
}) => {
|
|
29
31
|
const cursorRef = react.useRef(null);
|
|
@@ -70,31 +72,32 @@ var CursorFollower = ({
|
|
|
70
72
|
target.addEventListener("mouseenter", show);
|
|
71
73
|
target.addEventListener("mouseleave", hide);
|
|
72
74
|
gsap__default.default.ticker.add(update);
|
|
73
|
-
const
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
75
|
+
const cleanupFns = [];
|
|
76
|
+
blockSelectors.forEach((selector) => {
|
|
77
|
+
const elements = document.querySelectorAll(selector);
|
|
78
|
+
elements.forEach((el) => {
|
|
79
|
+
const enter = () => {
|
|
80
|
+
blocked = true;
|
|
81
|
+
hide();
|
|
82
|
+
};
|
|
83
|
+
const leave = () => {
|
|
84
|
+
blocked = false;
|
|
85
|
+
show();
|
|
86
|
+
};
|
|
87
|
+
el.addEventListener("mouseenter", enter);
|
|
88
|
+
el.addEventListener("mouseleave", leave);
|
|
89
|
+
cleanupFns.push(() => {
|
|
90
|
+
el.removeEventListener("mouseenter", enter);
|
|
91
|
+
el.removeEventListener("mouseleave", leave);
|
|
92
|
+
});
|
|
93
|
+
});
|
|
91
94
|
});
|
|
92
95
|
return () => {
|
|
93
96
|
target.removeEventListener("mousemove", move);
|
|
94
97
|
target.removeEventListener("mouseenter", show);
|
|
95
98
|
target.removeEventListener("mouseleave", hide);
|
|
96
99
|
gsap__default.default.ticker.remove(update);
|
|
97
|
-
|
|
100
|
+
cleanupFns.forEach((fn) => fn());
|
|
98
101
|
};
|
|
99
102
|
}, [
|
|
100
103
|
enabled,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/cursor/CursorFollower/CursorFollower.tsx"],"names":["useRef","useEffect","gsap","jsx"],"mappings":";;;;;;;;;;;AAyBO,IAAM,iBAAiB,CAAC;AAAA,EAC3B,IAAA,GAAO,
|
|
1
|
+
{"version":3,"sources":["../src/cursor/CursorFollower/CursorFollower.tsx"],"names":["useRef","useEffect","gsap","jsx"],"mappings":"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","file":"index.js","sourcesContent":["import { useEffect, useRef } from \"react\";\r\nimport gsap from \"gsap\";\r\n\r\nexport type CursorFollowerProps = {\r\n text?: string;\r\n\r\n size?: number;\r\n borderWidth?: number;\r\n borderColor?: string;\r\n background?: string;\r\n\r\n fontFamily?: string;\r\n fontSize?: number;\r\n fontWeight?: number | string;\r\n letterSpacing?: number;\r\n\r\n lerp?: number;\r\n showScale?: number;\r\n hideScale?: number;\r\n\r\n enabled?: boolean;\r\n blockSelectors?: string[];\r\n containerRef?: React.RefObject<HTMLElement>;\r\n};\r\n\r\nexport const CursorFollower = ({\r\n text = \"\", // Changed from \"PLAY\" to empty string for generic usage\r\n\r\n size = 90,\r\n borderWidth = 2,\r\n borderColor = \"#fff\",\r\n background = \"transparent\",\r\n\r\n fontFamily = \"inherit\",\r\n fontSize = 12,\r\n fontWeight = 400,\r\n letterSpacing = 2,\r\n\r\n lerp = 0.035,\r\n showScale = 1,\r\n hideScale = 0,\r\n\r\n enabled = true,\r\n blockSelectors = [\"button\", \"a\"], // Added sensible defaults\r\n containerRef,\r\n}: CursorFollowerProps) => {\r\n const cursorRef = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n if (!enabled) return;\r\n\r\n const cursor = cursorRef.current;\r\n if (!cursor) return;\r\n\r\n let targetX = 0;\r\n let targetY = 0;\r\n let currentX = 0;\r\n let currentY = 0;\r\n let visible = false;\r\n let blocked = false;\r\n\r\n const show = () => {\r\n if (visible || blocked) return;\r\n visible = true;\r\n gsap.to(cursor, { scale: showScale, opacity: 1, duration: 0.25 });\r\n };\r\n\r\n const hide = () => {\r\n if (!visible) return;\r\n visible = false;\r\n gsap.to(cursor, { scale: hideScale, opacity: 0, duration: 0.25 });\r\n };\r\n\r\n const move = (e: MouseEvent) => {\r\n if (containerRef?.current) {\r\n const bounds = containerRef.current.getBoundingClientRect();\r\n // Calculate relative coordinates\r\n targetX = e.clientX - bounds.left;\r\n targetY = e.clientY - bounds.top;\r\n } else {\r\n targetX = e.clientX;\r\n targetY = e.clientY;\r\n }\r\n };\r\n\r\n const update = () => {\r\n currentX += (targetX - currentX) * lerp;\r\n currentY += (targetY - currentY) * lerp;\r\n\r\n gsap.set(cursor, {\r\n x: currentX - size / 2,\r\n y: currentY - size / 2,\r\n });\r\n };\r\n\r\n // Event Listeners Source\r\n const target = containerRef?.current || window;\r\n\r\n target.addEventListener(\"mousemove\", move as any);\r\n target.addEventListener(\"mouseenter\", show as any);\r\n target.addEventListener(\"mouseleave\", hide as any);\r\n\r\n gsap.ticker.add(update);\r\n\r\n // Handle blocked selectors\r\n const cleanupFns: (() => void)[] = [];\r\n\r\n blockSelectors.forEach((selector) => {\r\n const elements = document.querySelectorAll(selector);\r\n elements.forEach((el) => {\r\n const enter = () => {\r\n blocked = true;\r\n hide();\r\n };\r\n const leave = () => {\r\n blocked = false;\r\n show();\r\n };\r\n\r\n el.addEventListener(\"mouseenter\", enter);\r\n el.addEventListener(\"mouseleave\", leave);\r\n\r\n cleanupFns.push(() => {\r\n el.removeEventListener(\"mouseenter\", enter);\r\n el.removeEventListener(\"mouseleave\", leave);\r\n });\r\n });\r\n });\r\n\r\n return () => {\r\n target.removeEventListener(\"mousemove\", move as any);\r\n target.removeEventListener(\"mouseenter\", show as any);\r\n target.removeEventListener(\"mouseleave\", hide as any);\r\n gsap.ticker.remove(update);\r\n cleanupFns.forEach((fn) => fn());\r\n };\r\n }, [\r\n enabled,\r\n size,\r\n lerp,\r\n showScale,\r\n hideScale,\r\n blockSelectors,\r\n containerRef\r\n ]);\r\n\r\n if (!enabled) return null;\r\n\r\n return (\r\n <div\r\n ref={cursorRef}\r\n style={{\r\n position: containerRef ? \"absolute\" : \"fixed\",\r\n top: 0,\r\n left: 0,\r\n width: size,\r\n height: size,\r\n border: `${borderWidth}px solid ${borderColor}`,\r\n background,\r\n borderRadius: \"50%\",\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n justifyContent: \"center\",\r\n pointerEvents: \"none\",\r\n zIndex: 9999,\r\n opacity: 0,\r\n transform: \"scale(0)\",\r\n fontFamily,\r\n fontSize,\r\n fontWeight,\r\n letterSpacing,\r\n textTransform: \"uppercase\",\r\n color: borderColor,\r\n }}\r\n >\r\n {text}\r\n </div>\r\n );\r\n};\r\n"]}
|
package/dist/index.mjs
CHANGED
|
@@ -4,7 +4,8 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
4
4
|
|
|
5
5
|
// src/cursor/CursorFollower/CursorFollower.tsx
|
|
6
6
|
var CursorFollower = ({
|
|
7
|
-
text = "
|
|
7
|
+
text = "",
|
|
8
|
+
// Changed from "PLAY" to empty string for generic usage
|
|
8
9
|
size = 90,
|
|
9
10
|
borderWidth = 2,
|
|
10
11
|
borderColor = "#fff",
|
|
@@ -17,7 +18,8 @@ var CursorFollower = ({
|
|
|
17
18
|
showScale = 1,
|
|
18
19
|
hideScale = 0,
|
|
19
20
|
enabled = true,
|
|
20
|
-
blockSelectors = [],
|
|
21
|
+
blockSelectors = ["button", "a"],
|
|
22
|
+
// Added sensible defaults
|
|
21
23
|
containerRef
|
|
22
24
|
}) => {
|
|
23
25
|
const cursorRef = useRef(null);
|
|
@@ -64,31 +66,32 @@ var CursorFollower = ({
|
|
|
64
66
|
target.addEventListener("mouseenter", show);
|
|
65
67
|
target.addEventListener("mouseleave", hide);
|
|
66
68
|
gsap.ticker.add(update);
|
|
67
|
-
const
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
69
|
+
const cleanupFns = [];
|
|
70
|
+
blockSelectors.forEach((selector) => {
|
|
71
|
+
const elements = document.querySelectorAll(selector);
|
|
72
|
+
elements.forEach((el) => {
|
|
73
|
+
const enter = () => {
|
|
74
|
+
blocked = true;
|
|
75
|
+
hide();
|
|
76
|
+
};
|
|
77
|
+
const leave = () => {
|
|
78
|
+
blocked = false;
|
|
79
|
+
show();
|
|
80
|
+
};
|
|
81
|
+
el.addEventListener("mouseenter", enter);
|
|
82
|
+
el.addEventListener("mouseleave", leave);
|
|
83
|
+
cleanupFns.push(() => {
|
|
84
|
+
el.removeEventListener("mouseenter", enter);
|
|
85
|
+
el.removeEventListener("mouseleave", leave);
|
|
86
|
+
});
|
|
87
|
+
});
|
|
85
88
|
});
|
|
86
89
|
return () => {
|
|
87
90
|
target.removeEventListener("mousemove", move);
|
|
88
91
|
target.removeEventListener("mouseenter", show);
|
|
89
92
|
target.removeEventListener("mouseleave", hide);
|
|
90
93
|
gsap.ticker.remove(update);
|
|
91
|
-
|
|
94
|
+
cleanupFns.forEach((fn) => fn());
|
|
92
95
|
};
|
|
93
96
|
}, [
|
|
94
97
|
enabled,
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/cursor/CursorFollower/CursorFollower.tsx"],"names":[],"mappings":";;;;;AAyBO,IAAM,iBAAiB,CAAC;AAAA,EAC3B,IAAA,GAAO,
|
|
1
|
+
{"version":3,"sources":["../src/cursor/CursorFollower/CursorFollower.tsx"],"names":[],"mappings":"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","file":"index.mjs","sourcesContent":["import { useEffect, useRef } from \"react\";\r\nimport gsap from \"gsap\";\r\n\r\nexport type CursorFollowerProps = {\r\n text?: string;\r\n\r\n size?: number;\r\n borderWidth?: number;\r\n borderColor?: string;\r\n background?: string;\r\n\r\n fontFamily?: string;\r\n fontSize?: number;\r\n fontWeight?: number | string;\r\n letterSpacing?: number;\r\n\r\n lerp?: number;\r\n showScale?: number;\r\n hideScale?: number;\r\n\r\n enabled?: boolean;\r\n blockSelectors?: string[];\r\n containerRef?: React.RefObject<HTMLElement>;\r\n};\r\n\r\nexport const CursorFollower = ({\r\n text = \"\", // Changed from \"PLAY\" to empty string for generic usage\r\n\r\n size = 90,\r\n borderWidth = 2,\r\n borderColor = \"#fff\",\r\n background = \"transparent\",\r\n\r\n fontFamily = \"inherit\",\r\n fontSize = 12,\r\n fontWeight = 400,\r\n letterSpacing = 2,\r\n\r\n lerp = 0.035,\r\n showScale = 1,\r\n hideScale = 0,\r\n\r\n enabled = true,\r\n blockSelectors = [\"button\", \"a\"], // Added sensible defaults\r\n containerRef,\r\n}: CursorFollowerProps) => {\r\n const cursorRef = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n if (!enabled) return;\r\n\r\n const cursor = cursorRef.current;\r\n if (!cursor) return;\r\n\r\n let targetX = 0;\r\n let targetY = 0;\r\n let currentX = 0;\r\n let currentY = 0;\r\n let visible = false;\r\n let blocked = false;\r\n\r\n const show = () => {\r\n if (visible || blocked) return;\r\n visible = true;\r\n gsap.to(cursor, { scale: showScale, opacity: 1, duration: 0.25 });\r\n };\r\n\r\n const hide = () => {\r\n if (!visible) return;\r\n visible = false;\r\n gsap.to(cursor, { scale: hideScale, opacity: 0, duration: 0.25 });\r\n };\r\n\r\n const move = (e: MouseEvent) => {\r\n if (containerRef?.current) {\r\n const bounds = containerRef.current.getBoundingClientRect();\r\n // Calculate relative coordinates\r\n targetX = e.clientX - bounds.left;\r\n targetY = e.clientY - bounds.top;\r\n } else {\r\n targetX = e.clientX;\r\n targetY = e.clientY;\r\n }\r\n };\r\n\r\n const update = () => {\r\n currentX += (targetX - currentX) * lerp;\r\n currentY += (targetY - currentY) * lerp;\r\n\r\n gsap.set(cursor, {\r\n x: currentX - size / 2,\r\n y: currentY - size / 2,\r\n });\r\n };\r\n\r\n // Event Listeners Source\r\n const target = containerRef?.current || window;\r\n\r\n target.addEventListener(\"mousemove\", move as any);\r\n target.addEventListener(\"mouseenter\", show as any);\r\n target.addEventListener(\"mouseleave\", hide as any);\r\n\r\n gsap.ticker.add(update);\r\n\r\n // Handle blocked selectors\r\n const cleanupFns: (() => void)[] = [];\r\n\r\n blockSelectors.forEach((selector) => {\r\n const elements = document.querySelectorAll(selector);\r\n elements.forEach((el) => {\r\n const enter = () => {\r\n blocked = true;\r\n hide();\r\n };\r\n const leave = () => {\r\n blocked = false;\r\n show();\r\n };\r\n\r\n el.addEventListener(\"mouseenter\", enter);\r\n el.addEventListener(\"mouseleave\", leave);\r\n\r\n cleanupFns.push(() => {\r\n el.removeEventListener(\"mouseenter\", enter);\r\n el.removeEventListener(\"mouseleave\", leave);\r\n });\r\n });\r\n });\r\n\r\n return () => {\r\n target.removeEventListener(\"mousemove\", move as any);\r\n target.removeEventListener(\"mouseenter\", show as any);\r\n target.removeEventListener(\"mouseleave\", hide as any);\r\n gsap.ticker.remove(update);\r\n cleanupFns.forEach((fn) => fn());\r\n };\r\n }, [\r\n enabled,\r\n size,\r\n lerp,\r\n showScale,\r\n hideScale,\r\n blockSelectors,\r\n containerRef\r\n ]);\r\n\r\n if (!enabled) return null;\r\n\r\n return (\r\n <div\r\n ref={cursorRef}\r\n style={{\r\n position: containerRef ? \"absolute\" : \"fixed\",\r\n top: 0,\r\n left: 0,\r\n width: size,\r\n height: size,\r\n border: `${borderWidth}px solid ${borderColor}`,\r\n background,\r\n borderRadius: \"50%\",\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n justifyContent: \"center\",\r\n pointerEvents: \"none\",\r\n zIndex: 9999,\r\n opacity: 0,\r\n transform: \"scale(0)\",\r\n fontFamily,\r\n fontSize,\r\n fontWeight,\r\n letterSpacing,\r\n textTransform: \"uppercase\",\r\n color: borderColor,\r\n }}\r\n >\r\n {text}\r\n </div>\r\n );\r\n};\r\n"]}
|