@hua-labs/motion-core 2.1.0-alpha.6 → 2.1.0-alpha.8

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.
Files changed (174) hide show
  1. package/README.md +16 -10
  2. package/dist/index.d.mts +1091 -0
  3. package/dist/index.d.ts +1091 -35
  4. package/dist/index.js +4241 -65
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +4187 -0
  7. package/dist/index.mjs.map +1 -0
  8. package/package.json +7 -4
  9. package/dist/.tsbuildinfo +0 -1
  10. package/dist/core/MotionEngine.d.ts +0 -111
  11. package/dist/core/MotionEngine.d.ts.map +0 -1
  12. package/dist/core/MotionEngine.js +0 -206
  13. package/dist/core/MotionEngine.js.map +0 -1
  14. package/dist/core/PerformanceOptimizer.d.ts +0 -124
  15. package/dist/core/PerformanceOptimizer.d.ts.map +0 -1
  16. package/dist/core/PerformanceOptimizer.js +0 -334
  17. package/dist/core/PerformanceOptimizer.js.map +0 -1
  18. package/dist/core/TransitionEffects.d.ts +0 -76
  19. package/dist/core/TransitionEffects.d.ts.map +0 -1
  20. package/dist/core/TransitionEffects.js +0 -321
  21. package/dist/core/TransitionEffects.js.map +0 -1
  22. package/dist/hooks/useBounceIn.d.ts +0 -12
  23. package/dist/hooks/useBounceIn.d.ts.map +0 -1
  24. package/dist/hooks/useBounceIn.js +0 -75
  25. package/dist/hooks/useBounceIn.js.map +0 -1
  26. package/dist/hooks/useButtonEffect.d.ts +0 -48
  27. package/dist/hooks/useButtonEffect.d.ts.map +0 -1
  28. package/dist/hooks/useButtonEffect.js +0 -311
  29. package/dist/hooks/useButtonEffect.js.map +0 -1
  30. package/dist/hooks/useCardList.d.ts +0 -23
  31. package/dist/hooks/useCardList.d.ts.map +0 -1
  32. package/dist/hooks/useCardList.js +0 -119
  33. package/dist/hooks/useCardList.js.map +0 -1
  34. package/dist/hooks/useClickToggle.d.ts +0 -30
  35. package/dist/hooks/useClickToggle.d.ts.map +0 -1
  36. package/dist/hooks/useClickToggle.js +0 -137
  37. package/dist/hooks/useClickToggle.js.map +0 -1
  38. package/dist/hooks/useFadeIn.d.ts +0 -3
  39. package/dist/hooks/useFadeIn.d.ts.map +0 -1
  40. package/dist/hooks/useFadeIn.js +0 -107
  41. package/dist/hooks/useFadeIn.js.map +0 -1
  42. package/dist/hooks/useFocusToggle.d.ts +0 -30
  43. package/dist/hooks/useFocusToggle.d.ts.map +0 -1
  44. package/dist/hooks/useFocusToggle.js +0 -137
  45. package/dist/hooks/useFocusToggle.js.map +0 -1
  46. package/dist/hooks/useGesture.d.ts +0 -45
  47. package/dist/hooks/useGesture.d.ts.map +0 -1
  48. package/dist/hooks/useGesture.js +0 -274
  49. package/dist/hooks/useGesture.js.map +0 -1
  50. package/dist/hooks/useGestureMotion.d.ts +0 -26
  51. package/dist/hooks/useGestureMotion.d.ts.map +0 -1
  52. package/dist/hooks/useGestureMotion.js +0 -167
  53. package/dist/hooks/useGestureMotion.js.map +0 -1
  54. package/dist/hooks/useGradient.d.ts +0 -14
  55. package/dist/hooks/useGradient.d.ts.map +0 -1
  56. package/dist/hooks/useGradient.js +0 -87
  57. package/dist/hooks/useGradient.js.map +0 -1
  58. package/dist/hooks/useHoverMotion.d.ts +0 -5
  59. package/dist/hooks/useHoverMotion.d.ts.map +0 -1
  60. package/dist/hooks/useHoverMotion.js +0 -48
  61. package/dist/hooks/useHoverMotion.js.map +0 -1
  62. package/dist/hooks/useLoadingSpinner.d.ts +0 -30
  63. package/dist/hooks/useLoadingSpinner.d.ts.map +0 -1
  64. package/dist/hooks/useLoadingSpinner.js +0 -283
  65. package/dist/hooks/useLoadingSpinner.js.map +0 -1
  66. package/dist/hooks/useMotion.d.ts +0 -103
  67. package/dist/hooks/useMotion.d.ts.map +0 -1
  68. package/dist/hooks/useMotion.js +0 -266
  69. package/dist/hooks/useMotion.js.map +0 -1
  70. package/dist/hooks/useMotionState.d.ts +0 -29
  71. package/dist/hooks/useMotionState.d.ts.map +0 -1
  72. package/dist/hooks/useMotionState.js +0 -202
  73. package/dist/hooks/useMotionState.js.map +0 -1
  74. package/dist/hooks/useNavigation.d.ts +0 -40
  75. package/dist/hooks/useNavigation.d.ts.map +0 -1
  76. package/dist/hooks/useNavigation.js +0 -212
  77. package/dist/hooks/useNavigation.js.map +0 -1
  78. package/dist/hooks/usePageMotions.d.ts +0 -17
  79. package/dist/hooks/usePageMotions.d.ts.map +0 -1
  80. package/dist/hooks/usePageMotions.js +0 -352
  81. package/dist/hooks/usePageMotions.js.map +0 -1
  82. package/dist/hooks/usePulse.d.ts +0 -10
  83. package/dist/hooks/usePulse.d.ts.map +0 -1
  84. package/dist/hooks/usePulse.js +0 -108
  85. package/dist/hooks/usePulse.js.map +0 -1
  86. package/dist/hooks/useRepeat.d.ts +0 -21
  87. package/dist/hooks/useRepeat.d.ts.map +0 -1
  88. package/dist/hooks/useRepeat.js +0 -65
  89. package/dist/hooks/useRepeat.js.map +0 -1
  90. package/dist/hooks/useScaleIn.d.ts +0 -13
  91. package/dist/hooks/useScaleIn.d.ts.map +0 -1
  92. package/dist/hooks/useScaleIn.js +0 -72
  93. package/dist/hooks/useScaleIn.js.map +0 -1
  94. package/dist/hooks/useScrollProgress.d.ts +0 -11
  95. package/dist/hooks/useScrollProgress.d.ts.map +0 -1
  96. package/dist/hooks/useScrollProgress.js +0 -37
  97. package/dist/hooks/useScrollProgress.js.map +0 -1
  98. package/dist/hooks/useScrollReveal.d.ts +0 -14
  99. package/dist/hooks/useScrollReveal.d.ts.map +0 -1
  100. package/dist/hooks/useScrollReveal.js +0 -116
  101. package/dist/hooks/useScrollReveal.js.map +0 -1
  102. package/dist/hooks/useScrollToggle.d.ts +0 -17
  103. package/dist/hooks/useScrollToggle.d.ts.map +0 -1
  104. package/dist/hooks/useScrollToggle.js +0 -119
  105. package/dist/hooks/useScrollToggle.js.map +0 -1
  106. package/dist/hooks/useSimplePageMotion.d.ts +0 -29
  107. package/dist/hooks/useSimplePageMotion.d.ts.map +0 -1
  108. package/dist/hooks/useSimplePageMotion.js +0 -145
  109. package/dist/hooks/useSimplePageMotion.js.map +0 -1
  110. package/dist/hooks/useSkeleton.d.ts +0 -21
  111. package/dist/hooks/useSkeleton.d.ts.map +0 -1
  112. package/dist/hooks/useSkeleton.js +0 -139
  113. package/dist/hooks/useSkeleton.js.map +0 -1
  114. package/dist/hooks/useSlideDown.d.ts +0 -25
  115. package/dist/hooks/useSlideDown.d.ts.map +0 -1
  116. package/dist/hooks/useSlideDown.js +0 -263
  117. package/dist/hooks/useSlideDown.js.map +0 -1
  118. package/dist/hooks/useSlideLeft.d.ts +0 -13
  119. package/dist/hooks/useSlideLeft.d.ts.map +0 -1
  120. package/dist/hooks/useSlideLeft.js +0 -72
  121. package/dist/hooks/useSlideLeft.js.map +0 -1
  122. package/dist/hooks/useSlideRight.d.ts +0 -13
  123. package/dist/hooks/useSlideRight.d.ts.map +0 -1
  124. package/dist/hooks/useSlideRight.js +0 -72
  125. package/dist/hooks/useSlideRight.js.map +0 -1
  126. package/dist/hooks/useSlideUp.d.ts +0 -3
  127. package/dist/hooks/useSlideUp.d.ts.map +0 -1
  128. package/dist/hooks/useSlideUp.js +0 -122
  129. package/dist/hooks/useSlideUp.js.map +0 -1
  130. package/dist/hooks/useSmartMotion.d.ts +0 -31
  131. package/dist/hooks/useSmartMotion.d.ts.map +0 -1
  132. package/dist/hooks/useSmartMotion.js +0 -257
  133. package/dist/hooks/useSmartMotion.js.map +0 -1
  134. package/dist/hooks/useSpringMotion.d.ts +0 -22
  135. package/dist/hooks/useSpringMotion.d.ts.map +0 -1
  136. package/dist/hooks/useSpringMotion.js +0 -133
  137. package/dist/hooks/useSpringMotion.js.map +0 -1
  138. package/dist/hooks/useStaggerMotion.d.ts +0 -81
  139. package/dist/hooks/useStaggerMotion.d.ts.map +0 -1
  140. package/dist/hooks/useStaggerMotion.js +0 -113
  141. package/dist/hooks/useStaggerMotion.js.map +0 -1
  142. package/dist/hooks/useToggleMotion.d.ts +0 -16
  143. package/dist/hooks/useToggleMotion.d.ts.map +0 -1
  144. package/dist/hooks/useToggleMotion.js +0 -53
  145. package/dist/hooks/useToggleMotion.js.map +0 -1
  146. package/dist/hooks/useUnifiedMotion.d.ts +0 -51
  147. package/dist/hooks/useUnifiedMotion.d.ts.map +0 -1
  148. package/dist/hooks/useUnifiedMotion.js +0 -106
  149. package/dist/hooks/useUnifiedMotion.js.map +0 -1
  150. package/dist/hooks/useVisibilityToggle.d.ts +0 -15
  151. package/dist/hooks/useVisibilityToggle.d.ts.map +0 -1
  152. package/dist/hooks/useVisibilityToggle.js +0 -106
  153. package/dist/hooks/useVisibilityToggle.js.map +0 -1
  154. package/dist/index.d.ts.map +0 -1
  155. package/dist/managers/MotionStateManager.d.ts +0 -63
  156. package/dist/managers/MotionStateManager.d.ts.map +0 -1
  157. package/dist/managers/MotionStateManager.js +0 -159
  158. package/dist/managers/MotionStateManager.js.map +0 -1
  159. package/dist/presets/index.d.ts +0 -16
  160. package/dist/presets/index.d.ts.map +0 -1
  161. package/dist/presets/index.js +0 -120
  162. package/dist/presets/index.js.map +0 -1
  163. package/dist/types/common.d.ts +0 -155
  164. package/dist/types/common.d.ts.map +0 -1
  165. package/dist/types/common.js +0 -5
  166. package/dist/types/common.js.map +0 -1
  167. package/dist/types/index.d.ts +0 -77
  168. package/dist/types/index.d.ts.map +0 -1
  169. package/dist/types/index.js +0 -5
  170. package/dist/types/index.js.map +0 -1
  171. package/dist/utils/easing.d.ts +0 -98
  172. package/dist/utils/easing.d.ts.map +0 -1
  173. package/dist/utils/easing.js +0 -233
  174. package/dist/utils/easing.js.map +0 -1
@@ -1,81 +0,0 @@
1
- import { RefObject } from 'react';
2
- import { BaseMotionOptions, MotionElement } from '../types';
3
- export type StaggerMotionType = 'fadeIn' | 'slideUp' | 'slideLeft' | 'slideRight' | 'scaleIn';
4
- export interface StaggerMotionOptions extends Omit<BaseMotionOptions, 'delay'> {
5
- /**
6
- * Number of items to animate
7
- */
8
- count: number;
9
- /**
10
- * Motion type
11
- * @default 'fadeIn'
12
- */
13
- type?: StaggerMotionType;
14
- /**
15
- * Delay between each item (ms)
16
- * @default 100
17
- */
18
- staggerDelay?: number;
19
- /**
20
- * Initial delay before animation starts (ms)
21
- * @default 0
22
- */
23
- initialDelay?: number;
24
- /**
25
- * Distance for slide animations (px)
26
- * @default 20
27
- */
28
- slideDistance?: number;
29
- /**
30
- * Initial scale for scaleIn animation
31
- * @default 0.9
32
- */
33
- initialScale?: number;
34
- }
35
- export interface StaggerMotionReturn<T extends MotionElement> {
36
- /**
37
- * Array of refs to attach to each item
38
- */
39
- refs: RefObject<T | null>[];
40
- /**
41
- * Array of styles for each item
42
- */
43
- styles: React.CSSProperties[];
44
- /**
45
- * Whether all items are visible
46
- */
47
- isVisible: boolean;
48
- /**
49
- * Whether animation is in progress
50
- */
51
- isAnimating: boolean;
52
- /**
53
- * Start all animations
54
- */
55
- start: () => void;
56
- /**
57
- * Reset all animations
58
- */
59
- reset: () => void;
60
- }
61
- /**
62
- * useStaggerMotion - Animate multiple items with staggered timing
63
- *
64
- * @example
65
- * ```tsx
66
- * const items = ['Item 1', 'Item 2', 'Item 3'];
67
- * const stagger = useStaggerMotion({ count: items.length, type: 'fadeIn', staggerDelay: 100 });
68
- *
69
- * return (
70
- * <div>
71
- * {items.map((item, index) => (
72
- * <div key={index} ref={stagger.refs[index]} style={stagger.styles[index]}>
73
- * {item}
74
- * </div>
75
- * ))}
76
- * </div>
77
- * );
78
- * ```
79
- */
80
- export declare function useStaggerMotion<T extends MotionElement = HTMLDivElement>(options: StaggerMotionOptions): StaggerMotionReturn<T>;
81
- //# sourceMappingURL=useStaggerMotion.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useStaggerMotion.d.ts","sourceRoot":"","sources":["../../src/hooks/useStaggerMotion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC/F,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AAE3D,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,SAAS,GAAG,WAAW,GAAG,YAAY,GAAG,SAAS,CAAA;AAE7F,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,OAAO,CAAC;IAC5E;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IAEb;;;OAGG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAA;IAExB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IAEtB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,aAAa;IAC1D;;OAEG;IACH,IAAI,EAAE,SAAS,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,CAAA;IAE3B;;OAEG;IACH,MAAM,EAAE,KAAK,CAAC,aAAa,EAAE,CAAA;IAE7B;;OAEG;IACH,SAAS,EAAE,OAAO,CAAA;IAElB;;OAEG;IACH,WAAW,EAAE,OAAO,CAAA;IAEpB;;OAEG;IACH,KAAK,EAAE,MAAM,IAAI,CAAA;IAEjB;;OAEG;IACH,KAAK,EAAE,MAAM,IAAI,CAAA;CAClB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,aAAa,GAAG,cAAc,EACvE,OAAO,EAAE,oBAAoB,GAC5B,mBAAmB,CAAC,CAAC,CAAC,CA2HxB"}
@@ -1,113 +0,0 @@
1
- import { useRef, useState, useEffect, useCallback, useMemo, createRef } from 'react';
2
- /**
3
- * useStaggerMotion - Animate multiple items with staggered timing
4
- *
5
- * @example
6
- * ```tsx
7
- * const items = ['Item 1', 'Item 2', 'Item 3'];
8
- * const stagger = useStaggerMotion({ count: items.length, type: 'fadeIn', staggerDelay: 100 });
9
- *
10
- * return (
11
- * <div>
12
- * {items.map((item, index) => (
13
- * <div key={index} ref={stagger.refs[index]} style={stagger.styles[index]}>
14
- * {item}
15
- * </div>
16
- * ))}
17
- * </div>
18
- * );
19
- * ```
20
- */
21
- export function useStaggerMotion(options) {
22
- const { count, type = 'fadeIn', duration = 500, staggerDelay = 100, initialDelay = 0, easing = 'ease-out', slideDistance = 20, initialScale = 0.9, threshold = 0.1, triggerOnce = true, autoStart = true, onComplete, onStart } = options;
23
- const [isVisible, setIsVisible] = useState(false);
24
- const [isAnimating, setIsAnimating] = useState(false);
25
- const containerRef = useRef(null);
26
- const observerRef = useRef(null);
27
- // Create refs array
28
- const refs = useMemo(() => {
29
- return Array.from({ length: count }, () => createRef());
30
- }, [count]);
31
- // Start animation
32
- const start = useCallback(() => {
33
- if (isAnimating || isVisible)
34
- return;
35
- setIsAnimating(true);
36
- onStart?.();
37
- setTimeout(() => {
38
- setIsVisible(true);
39
- // Complete after all animations finish
40
- const totalDuration = initialDelay + (count - 1) * staggerDelay + duration;
41
- setTimeout(() => {
42
- setIsAnimating(false);
43
- onComplete?.();
44
- }, totalDuration - initialDelay);
45
- }, initialDelay);
46
- }, [isAnimating, isVisible, count, staggerDelay, duration, initialDelay, onStart, onComplete]);
47
- // Reset animation
48
- const reset = useCallback(() => {
49
- setIsVisible(false);
50
- setIsAnimating(false);
51
- }, []);
52
- // Intersection Observer for auto-start
53
- useEffect(() => {
54
- if (!autoStart || count === 0)
55
- return;
56
- // Use first ref as trigger
57
- const firstRef = refs[0]?.current;
58
- if (!firstRef)
59
- return;
60
- observerRef.current = new IntersectionObserver((entries) => {
61
- entries.forEach((entry) => {
62
- if (entry.isIntersecting) {
63
- start();
64
- if (triggerOnce) {
65
- observerRef.current?.disconnect();
66
- }
67
- }
68
- });
69
- }, { threshold });
70
- observerRef.current.observe(firstRef);
71
- return () => {
72
- observerRef.current?.disconnect();
73
- };
74
- }, [autoStart, threshold, triggerOnce, start, refs, count]);
75
- // Generate styles based on motion type
76
- const styles = useMemo(() => {
77
- return Array.from({ length: count }, (_, index) => {
78
- const delay = initialDelay + index * staggerDelay;
79
- const baseStyle = {
80
- transition: `all ${duration}ms ${easing} ${delay}ms`,
81
- };
82
- // Initial state (before animation)
83
- const initialState = {
84
- fadeIn: { opacity: 0 },
85
- slideUp: { opacity: 0, transform: `translateY(${slideDistance}px)` },
86
- slideLeft: { opacity: 0, transform: `translateX(${slideDistance}px)` },
87
- slideRight: { opacity: 0, transform: `translateX(-${slideDistance}px)` },
88
- scaleIn: { opacity: 0, transform: `scale(${initialScale})` },
89
- };
90
- // Final state (after animation)
91
- const finalState = {
92
- fadeIn: { opacity: 1 },
93
- slideUp: { opacity: 1, transform: 'translateY(0)' },
94
- slideLeft: { opacity: 1, transform: 'translateX(0)' },
95
- slideRight: { opacity: 1, transform: 'translateX(0)' },
96
- scaleIn: { opacity: 1, transform: 'scale(1)' },
97
- };
98
- return {
99
- ...baseStyle,
100
- ...(isVisible ? finalState[type] : initialState[type]),
101
- };
102
- });
103
- }, [count, isVisible, type, duration, easing, staggerDelay, initialDelay, slideDistance, initialScale]);
104
- return {
105
- refs,
106
- styles,
107
- isVisible,
108
- isAnimating,
109
- start,
110
- reset,
111
- };
112
- }
113
- //# sourceMappingURL=useStaggerMotion.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useStaggerMotion.js","sourceRoot":"","sources":["../../src/hooks/useStaggerMotion.ts"],"names":[],"mappings":"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"}
@@ -1,16 +0,0 @@
1
- import React from 'react';
2
- interface ToggleMotionOptions {
3
- duration?: number;
4
- delay?: number;
5
- easing?: string;
6
- }
7
- export declare function useToggleMotion(options?: ToggleMotionOptions): {
8
- ref: React.RefObject<HTMLDivElement | null>;
9
- isVisible: boolean;
10
- isAnimating: boolean;
11
- show: () => void;
12
- hide: () => void;
13
- toggle: () => void;
14
- };
15
- export {};
16
- //# sourceMappingURL=useToggleMotion.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useToggleMotion.d.ts","sourceRoot":"","sources":["../../src/hooks/useToggleMotion.ts"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAA;AAEvE,UAAU,mBAAmB;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB;AAED,wBAAgB,eAAe,CAAC,OAAO,GAAE,mBAAwB;;;;;;;EAwDhE"}
@@ -1,53 +0,0 @@
1
- import { useRef, useState, useEffect, useCallback } from 'react';
2
- export function useToggleMotion(options = {}) {
3
- const { duration = 300, delay = 0, easing = 'ease-in-out' } = options;
4
- const elementRef = useRef(null);
5
- const [isVisible, setIsVisible] = useState(false);
6
- const [isAnimating, setIsAnimating] = useState(false);
7
- const show = useCallback(() => {
8
- setIsVisible(true);
9
- setIsAnimating(true);
10
- }, []);
11
- const hide = useCallback(() => {
12
- setIsVisible(false);
13
- setIsAnimating(true);
14
- }, []);
15
- const toggle = useCallback(() => {
16
- if (isVisible) {
17
- hide();
18
- }
19
- else {
20
- show();
21
- }
22
- }, [isVisible, show, hide]);
23
- useEffect(() => {
24
- if (!elementRef.current)
25
- return;
26
- const element = elementRef.current;
27
- element.style.transition = `opacity ${duration}ms ${easing}, transform ${duration}ms ${easing}`;
28
- if (isVisible) {
29
- element.style.opacity = '1';
30
- element.style.transform = 'translateY(0) scale(1)';
31
- }
32
- else {
33
- element.style.opacity = '0';
34
- element.style.transform = 'translateY(10px) scale(0.95)';
35
- }
36
- const handleTransitionEnd = () => {
37
- setIsAnimating(false);
38
- };
39
- element.addEventListener('transitionend', handleTransitionEnd);
40
- return () => {
41
- element.removeEventListener('transitionend', handleTransitionEnd);
42
- };
43
- }, [isVisible, duration, easing]);
44
- return {
45
- ref: elementRef,
46
- isVisible,
47
- isAnimating,
48
- show,
49
- hide,
50
- toggle
51
- };
52
- }
53
- //# sourceMappingURL=useToggleMotion.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useToggleMotion.js","sourceRoot":"","sources":["../../src/hooks/useToggleMotion.ts"],"names":[],"mappings":"AAAA,OAAc,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAQvE,MAAM,UAAU,eAAe,CAAC,UAA+B,EAAE;IAC/D,MAAM,EAAE,QAAQ,GAAG,GAAG,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,aAAa,EAAE,GAAG,OAAO,CAAA;IACrE,MAAM,UAAU,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAA;IACtD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACjD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAErD,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,YAAY,CAAC,IAAI,CAAC,CAAA;QAClB,cAAc,CAAC,IAAI,CAAC,CAAA;IACtB,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,YAAY,CAAC,KAAK,CAAC,CAAA;QACnB,cAAc,CAAC,IAAI,CAAC,CAAA;IACtB,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,IAAI,SAAS,EAAE,CAAC;YACd,IAAI,EAAE,CAAA;QACR,CAAC;aAAM,CAAC;YACN,IAAI,EAAE,CAAA;QACR,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC,CAAA;IAE3B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,UAAU,CAAC,OAAO;YAAE,OAAM;QAE/B,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;QAClC,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,WAAW,QAAQ,MAAM,MAAM,eAAe,QAAQ,MAAM,MAAM,EAAE,CAAA;QAE/F,IAAI,SAAS,EAAE,CAAC;YACd,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAA;YAC3B,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,wBAAwB,CAAA;QACpD,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAA;YAC3B,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,8BAA8B,CAAA;QAC1D,CAAC;QAED,MAAM,mBAAmB,GAAG,GAAG,EAAE;YAC/B,cAAc,CAAC,KAAK,CAAC,CAAA;QACvB,CAAC,CAAA;QAED,OAAO,CAAC,gBAAgB,CAAC,eAAe,EAAE,mBAAmB,CAAC,CAAA;QAC9D,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,mBAAmB,CAAC,eAAe,EAAE,mBAAmB,CAAC,CAAA;QACnE,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAA;IAEjC,OAAO;QACL,GAAG,EAAE,UAAU;QACf,SAAS;QACT,WAAW;QACX,IAAI;QACJ,IAAI;QACJ,MAAM;KACP,CAAA;AACH,CAAC"}
@@ -1,51 +0,0 @@
1
- /**
2
- * @hua-labs/motion-core - useUnifiedMotion
3
- *
4
- * 통합 Motion Hook - 단일 타입으로 여러 motion hook 중 하나를 선택
5
- * Unified Motion Hook - Select one of multiple motion hooks with a single type
6
- *
7
- * React Rules of Hooks를 준수하면서 필요한 motion hook만 활성화합니다.
8
- * Respects React Rules of Hooks while only activating the necessary motion hook.
9
- */
10
- import type { BaseMotionReturn, MotionElement, EntranceType, BaseMotionOptions } from '../types';
11
- /**
12
- * useUnifiedMotion options
13
- */
14
- export interface UseUnifiedMotionOptions extends Omit<BaseMotionOptions, 'autoStart'> {
15
- /**
16
- * Motion type to use
17
- */
18
- type: EntranceType;
19
- /**
20
- * Auto start animation
21
- * @default false
22
- */
23
- autoStart?: boolean;
24
- }
25
- /**
26
- * 통합 Motion Hook
27
- *
28
- * 단일 타입으로 여러 motion hook 중 하나를 선택합니다.
29
- * React Rules of Hooks를 준수하기 위해 모든 hook을 호출하지만,
30
- * 실제로는 선택된 hook만 활성화됩니다.
31
- *
32
- * Selects one of multiple motion hooks with a single type.
33
- * All hooks are called to respect React Rules of Hooks,
34
- * but only the selected hook is actually activated.
35
- *
36
- * @param options - Motion options
37
- * @returns Motion result with ref and control functions
38
- *
39
- * @example
40
- * ```tsx
41
- * const motion = useUnifiedMotion({
42
- * type: 'fadeIn',
43
- * duration: 600,
44
- * autoStart: false,
45
- * });
46
- *
47
- * return <div ref={motion.ref} style={motion.style}>Content</div>;
48
- * ```
49
- */
50
- export declare function useUnifiedMotion<T extends MotionElement = HTMLDivElement>(options: UseUnifiedMotionOptions): BaseMotionReturn<T>;
51
- //# sourceMappingURL=useUnifiedMotion.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useUnifiedMotion.d.ts","sourceRoot":"","sources":["../../src/hooks/useUnifiedMotion.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAGH,OAAO,KAAK,EAAE,gBAAgB,EAAE,aAAa,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAQjG;;GAEG;AACH,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,WAAW,CAAC;IACnF;;OAEG;IACH,IAAI,EAAE,YAAY,CAAC;IAEnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,aAAa,GAAG,cAAc,EACvE,OAAO,EAAE,uBAAuB,GAC/B,gBAAgB,CAAC,CAAC,CAAC,CAwErB"}
@@ -1,106 +0,0 @@
1
- /**
2
- * @hua-labs/motion-core - useUnifiedMotion
3
- *
4
- * 통합 Motion Hook - 단일 타입으로 여러 motion hook 중 하나를 선택
5
- * Unified Motion Hook - Select one of multiple motion hooks with a single type
6
- *
7
- * React Rules of Hooks를 준수하면서 필요한 motion hook만 활성화합니다.
8
- * Respects React Rules of Hooks while only activating the necessary motion hook.
9
- */
10
- import { useFadeIn } from './useFadeIn';
11
- import { useSlideUp } from './useSlideUp';
12
- import { useSlideLeft } from './useSlideLeft';
13
- import { useSlideRight } from './useSlideRight';
14
- import { useScaleIn } from './useScaleIn';
15
- import { useBounceIn } from './useBounceIn';
16
- /**
17
- * 통합 Motion Hook
18
- *
19
- * 단일 타입으로 여러 motion hook 중 하나를 선택합니다.
20
- * React Rules of Hooks를 준수하기 위해 모든 hook을 호출하지만,
21
- * 실제로는 선택된 hook만 활성화됩니다.
22
- *
23
- * Selects one of multiple motion hooks with a single type.
24
- * All hooks are called to respect React Rules of Hooks,
25
- * but only the selected hook is actually activated.
26
- *
27
- * @param options - Motion options
28
- * @returns Motion result with ref and control functions
29
- *
30
- * @example
31
- * ```tsx
32
- * const motion = useUnifiedMotion({
33
- * type: 'fadeIn',
34
- * duration: 600,
35
- * autoStart: false,
36
- * });
37
- *
38
- * return <div ref={motion.ref} style={motion.style}>Content</div>;
39
- * ```
40
- */
41
- export function useUnifiedMotion(options) {
42
- const { type, duration = 600, autoStart = false, delay, easing, ...restOptions } = options;
43
- // React Rules of Hooks를 준수하기 위해 모든 hook을 호출
44
- // 하지만 실제로는 선택된 hook만 활성화
45
- // Call all hooks to respect React Rules of Hooks
46
- // But only the selected hook is actually activated
47
- const fadeInResult = useFadeIn({
48
- duration,
49
- autoStart: false, // 항상 false로 설정하고 수동으로 start 호출
50
- delay,
51
- easing,
52
- ...restOptions,
53
- });
54
- const slideUpResult = useSlideUp({
55
- duration,
56
- autoStart: false,
57
- delay,
58
- easing,
59
- ...restOptions,
60
- });
61
- const slideLeftResult = useSlideLeft({
62
- duration,
63
- autoStart: false,
64
- delay,
65
- easing,
66
- ...restOptions,
67
- });
68
- const slideRightResult = useSlideRight({
69
- duration,
70
- autoStart: false,
71
- delay,
72
- easing,
73
- ...restOptions,
74
- });
75
- const scaleInResult = useScaleIn({
76
- duration,
77
- autoStart: false,
78
- delay,
79
- easing,
80
- ...restOptions,
81
- });
82
- const bounceInResult = useBounceIn({
83
- duration,
84
- autoStart: false,
85
- delay,
86
- ...restOptions,
87
- });
88
- // 선택된 motion result 반환
89
- // Return the selected motion result
90
- switch (type) {
91
- case 'slideUp':
92
- return slideUpResult;
93
- case 'slideLeft':
94
- return slideLeftResult;
95
- case 'slideRight':
96
- return slideRightResult;
97
- case 'scaleIn':
98
- return scaleInResult;
99
- case 'bounceIn':
100
- return bounceInResult;
101
- case 'fadeIn':
102
- default:
103
- return fadeInResult;
104
- }
105
- }
106
- //# sourceMappingURL=useUnifiedMotion.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useUnifiedMotion.js","sourceRoot":"","sources":["../../src/hooks/useUnifiedMotion.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAkB5C;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,UAAU,gBAAgB,CAC9B,OAAgC;IAEhC,MAAM,EAAE,IAAI,EAAE,QAAQ,GAAG,GAAG,EAAE,SAAS,GAAG,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,WAAW,EAAE,GAAG,OAAO,CAAC;IAE3F,4CAA4C;IAC5C,yBAAyB;IACzB,iDAAiD;IACjD,mDAAmD;IAEnD,MAAM,YAAY,GAAG,SAAS,CAAI;QAChC,QAAQ;QACR,SAAS,EAAE,KAAK,EAAE,+BAA+B;QACjD,KAAK;QACL,MAAM;QACN,GAAG,WAAW;KACf,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,UAAU,CAAI;QAClC,QAAQ;QACR,SAAS,EAAE,KAAK;QAChB,KAAK;QACL,MAAM;QACN,GAAG,WAAW;KACf,CAAC,CAAC;IAEH,MAAM,eAAe,GAAG,YAAY,CAAI;QACtC,QAAQ;QACR,SAAS,EAAE,KAAK;QAChB,KAAK;QACL,MAAM;QACN,GAAG,WAAW;KACf,CAAC,CAAC;IAEH,MAAM,gBAAgB,GAAG,aAAa,CAAI;QACxC,QAAQ;QACR,SAAS,EAAE,KAAK;QAChB,KAAK;QACL,MAAM;QACN,GAAG,WAAW;KACf,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,UAAU,CAAI;QAClC,QAAQ;QACR,SAAS,EAAE,KAAK;QAChB,KAAK;QACL,MAAM;QACN,GAAG,WAAW;KACf,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,WAAW,CAAI;QACpC,QAAQ;QACR,SAAS,EAAE,KAAK;QAChB,KAAK;QACL,GAAG,WAAW;KACf,CAAC,CAAC;IAEH,uBAAuB;IACvB,oCAAoC;IACpC,QAAQ,IAAI,EAAE,CAAC;QACb,KAAK,SAAS;YACZ,OAAO,aAAa,CAAC;QACvB,KAAK,WAAW;YACd,OAAO,eAAe,CAAC;QACzB,KAAK,YAAY;YACf,OAAO,gBAAgB,CAAC;QAC1B,KAAK,SAAS;YACZ,OAAO,aAAa,CAAC;QACvB,KAAK,UAAU;YACb,OAAO,cAAc,CAAC;QACxB,KAAK,QAAQ,CAAC;QACd;YACE,OAAO,YAAY,CAAC;IACxB,CAAC;AACH,CAAC"}
@@ -1,15 +0,0 @@
1
- import { BaseMotionOptions, InteractionReturn, MotionElement } from '../types';
2
- export interface VisibilityToggleOptions extends BaseMotionOptions {
3
- showScale?: number;
4
- showOpacity?: number;
5
- showRotate?: number;
6
- showTranslateY?: number;
7
- showTranslateX?: number;
8
- hideScale?: number;
9
- hideOpacity?: number;
10
- hideRotate?: number;
11
- hideTranslateY?: number;
12
- hideTranslateX?: number;
13
- }
14
- export declare function useVisibilityToggle<T extends MotionElement = HTMLDivElement>(options?: VisibilityToggleOptions): InteractionReturn<T>;
15
- //# sourceMappingURL=useVisibilityToggle.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useVisibilityToggle.d.ts","sourceRoot":"","sources":["../../src/hooks/useVisibilityToggle.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AAE9E,MAAM,WAAW,uBAAwB,SAAQ,iBAAiB;IAChE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,wBAAgB,mBAAmB,CAAC,CAAC,SAAS,aAAa,GAAG,cAAc,EAC1E,OAAO,GAAE,uBAA4B,GACpC,iBAAiB,CAAC,CAAC,CAAC,CAoItB"}
@@ -1,106 +0,0 @@
1
- import { useRef, useState, useCallback } from 'react';
2
- export function useVisibilityToggle(options = {}) {
3
- const { duration = 300, easing = 'ease-out', showScale = 1, showOpacity = 1, showRotate = 0, showTranslateY = 0, showTranslateX = 0, hideScale = 0.8, hideOpacity = 0, hideRotate = 0, hideTranslateY = 20, hideTranslateX = 0, onComplete, onStart, onStop, onReset } = options;
4
- const ref = useRef(null);
5
- const [isVisible, setIsVisible] = useState(false);
6
- const [isAnimating, setIsAnimating] = useState(false);
7
- const [progress, setProgress] = useState(0);
8
- // 가시성 토글 함수
9
- const toggle = useCallback(() => {
10
- setIsAnimating(true);
11
- setProgress(0);
12
- onStart?.();
13
- const newVisibility = !isVisible;
14
- setIsVisible(newVisibility);
15
- // 애니메이션 완료 시
16
- setTimeout(() => {
17
- setIsAnimating(false);
18
- setProgress(1);
19
- onComplete?.();
20
- }, duration);
21
- }, [isVisible, duration, onStart, onComplete]);
22
- // 표시 함수
23
- const show = useCallback(() => {
24
- if (!isVisible) {
25
- setIsAnimating(true);
26
- setProgress(0);
27
- onStart?.();
28
- setIsVisible(true);
29
- setTimeout(() => {
30
- setIsAnimating(false);
31
- setProgress(1);
32
- onComplete?.();
33
- }, duration);
34
- }
35
- }, [isVisible, duration, onStart, onComplete]);
36
- // 숨김 함수
37
- const hide = useCallback(() => {
38
- if (isVisible) {
39
- setIsAnimating(true);
40
- setProgress(1);
41
- onStart?.();
42
- setIsVisible(false);
43
- setTimeout(() => {
44
- setIsAnimating(false);
45
- setProgress(0);
46
- onComplete?.();
47
- }, duration);
48
- }
49
- }, [isVisible, duration, onStart, onComplete]);
50
- // 모션 시작 함수 (프로그래매틱 제어용)
51
- const start = useCallback(() => {
52
- if (!isVisible) {
53
- toggle();
54
- }
55
- }, [isVisible, toggle]);
56
- // 모션 중단 함수
57
- const stop = useCallback(() => {
58
- setIsAnimating(false);
59
- onStop?.();
60
- }, [onStop]);
61
- // 모션 리셋 함수
62
- const reset = useCallback(() => {
63
- setIsVisible(false);
64
- setIsAnimating(false);
65
- setProgress(0);
66
- onReset?.();
67
- }, [onReset]);
68
- // 모션 일시정지 함수
69
- const pause = useCallback(() => {
70
- setIsAnimating(false);
71
- }, []);
72
- // 모션 재개 함수
73
- const resume = useCallback(() => {
74
- if (isVisible) {
75
- setIsAnimating(true);
76
- }
77
- }, [isVisible]);
78
- // 스타일 계산
79
- const style = {
80
- transform: `
81
- scale(${isVisible ? showScale : hideScale})
82
- rotate(${isVisible ? showRotate : hideRotate}deg)
83
- translate(${isVisible ? showTranslateX : hideTranslateX}px, ${isVisible ? showTranslateY : hideTranslateY}px)
84
- `,
85
- opacity: isVisible ? showOpacity : hideOpacity,
86
- transition: `all ${duration}ms ${easing}`,
87
- willChange: 'transform, opacity'
88
- };
89
- return {
90
- ref,
91
- isVisible,
92
- isAnimating,
93
- style,
94
- progress,
95
- start,
96
- stop,
97
- reset,
98
- pause,
99
- resume,
100
- // 추가 메서드
101
- toggle,
102
- show,
103
- hide
104
- };
105
- }
106
- //# sourceMappingURL=useVisibilityToggle.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useVisibilityToggle.js","sourceRoot":"","sources":["../../src/hooks/useVisibilityToggle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAa,MAAM,OAAO,CAAA;AAgBhE,MAAM,UAAU,mBAAmB,CACjC,UAAmC,EAAE;IAErC,MAAM,EACJ,QAAQ,GAAG,GAAG,EACd,MAAM,GAAG,UAAU,EACnB,SAAS,GAAG,CAAC,EACb,WAAW,GAAG,CAAC,EACf,UAAU,GAAG,CAAC,EACd,cAAc,GAAG,CAAC,EAClB,cAAc,GAAG,CAAC,EAClB,SAAS,GAAG,GAAG,EACf,WAAW,GAAG,CAAC,EACf,UAAU,GAAG,CAAC,EACd,cAAc,GAAG,EAAE,EACnB,cAAc,GAAG,CAAC,EAClB,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EACrC,GAAG,OAAO,CAAA;IAEX,MAAM,GAAG,GAAG,MAAM,CAAI,IAAI,CAAC,CAAA;IAC3B,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACjD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACrD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IAE3C,YAAY;IACZ,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,cAAc,CAAC,IAAI,CAAC,CAAA;QACpB,WAAW,CAAC,CAAC,CAAC,CAAA;QACd,OAAO,EAAE,EAAE,CAAA;QAEX,MAAM,aAAa,GAAG,CAAC,SAAS,CAAA;QAChC,YAAY,CAAC,aAAa,CAAC,CAAA;QAE3B,aAAa;QACb,UAAU,CAAC,GAAG,EAAE;YACd,cAAc,CAAC,KAAK,CAAC,CAAA;YACrB,WAAW,CAAC,CAAC,CAAC,CAAA;YACd,UAAU,EAAE,EAAE,CAAA;QAChB,CAAC,EAAE,QAAQ,CAAC,CAAA;IACd,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,CAAC,CAAC,CAAA;IAE9C,QAAQ;IACR,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,cAAc,CAAC,IAAI,CAAC,CAAA;YACpB,WAAW,CAAC,CAAC,CAAC,CAAA;YACd,OAAO,EAAE,EAAE,CAAA;YACX,YAAY,CAAC,IAAI,CAAC,CAAA;YAElB,UAAU,CAAC,GAAG,EAAE;gBACd,cAAc,CAAC,KAAK,CAAC,CAAA;gBACrB,WAAW,CAAC,CAAC,CAAC,CAAA;gBACd,UAAU,EAAE,EAAE,CAAA;YAChB,CAAC,EAAE,QAAQ,CAAC,CAAA;QACd,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,CAAC,CAAC,CAAA;IAE9C,QAAQ;IACR,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,IAAI,SAAS,EAAE,CAAC;YACd,cAAc,CAAC,IAAI,CAAC,CAAA;YACpB,WAAW,CAAC,CAAC,CAAC,CAAA;YACd,OAAO,EAAE,EAAE,CAAA;YACX,YAAY,CAAC,KAAK,CAAC,CAAA;YAEnB,UAAU,CAAC,GAAG,EAAE;gBACd,cAAc,CAAC,KAAK,CAAC,CAAA;gBACrB,WAAW,CAAC,CAAC,CAAC,CAAA;gBACd,UAAU,EAAE,EAAE,CAAA;YAChB,CAAC,EAAE,QAAQ,CAAC,CAAA;QACd,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,CAAC,CAAC,CAAA;IAE9C,wBAAwB;IACxB,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7B,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,MAAM,EAAE,CAAA;QACV,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAA;IAEvB,WAAW;IACX,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,cAAc,CAAC,KAAK,CAAC,CAAA;QACrB,MAAM,EAAE,EAAE,CAAA;IACZ,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAA;IAEZ,WAAW;IACX,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7B,YAAY,CAAC,KAAK,CAAC,CAAA;QACnB,cAAc,CAAC,KAAK,CAAC,CAAA;QACrB,WAAW,CAAC,CAAC,CAAC,CAAA;QACd,OAAO,EAAE,EAAE,CAAA;IACb,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,aAAa;IACb,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7B,cAAc,CAAC,KAAK,CAAC,CAAA;IACvB,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,WAAW;IACX,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,IAAI,SAAS,EAAE,CAAC;YACd,cAAc,CAAC,IAAI,CAAC,CAAA;QACtB,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;IAEf,SAAS;IACT,MAAM,KAAK,GAAwB;QACjC,SAAS,EAAE;cACD,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;eAChC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU;kBAChC,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,OAAO,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc;KAC1G;QACD,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW;QAC9C,UAAU,EAAE,OAAO,QAAQ,MAAM,MAAM,EAAE;QACzC,UAAU,EAAE,oBAAoB;KACjC,CAAA;IAED,OAAO;QACL,GAAG;QACH,SAAS;QACT,WAAW;QACX,KAAK;QACL,QAAQ;QACR,KAAK;QACL,IAAI;QACJ,KAAK;QACL,KAAK;QACL,MAAM;QACN,SAAS;QACT,MAAM;QACN,IAAI;QACJ,IAAI;KACL,CAAA;AACH,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAWA,OAAO,EACL,YAAY,EACZ,YAAY,EACZ,KAAK,WAAW,EAChB,KAAK,aAAa,EAClB,KAAK,MAAM,EACZ,MAAM,qBAAqB,CAAA;AAG5B,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,KAAK,cAAc,EACnB,KAAK,iBAAiB,EACvB,MAAM,0BAA0B,CAAA;AAGjC,OAAO,EACL,oBAAoB,EACpB,oBAAoB,EACpB,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,EACxB,MAAM,6BAA6B,CAAA;AAOpC,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAGvD,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAGvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAC3D,YAAY,EAAE,uBAAuB,EAAE,MAAM,0BAA0B,CAAA;AAOvE,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AAGjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAC3D,YAAY,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAG5G,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAGvD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAA;AAG7D,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAOzD,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAM3D,cAAc,WAAW,CAAA;AAMzB,OAAO,EACL,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAClC,UAAU,EAAE,WAAW,EAAE,aAAa,EACtC,KAAK,cAAc,EAAE,KAAK,UAAU,EACrC,MAAM,gBAAgB,CAAA;AAEvB,OAAO,EACL,SAAS,EAAE,WAAW,EAAE,eAAe,EAAE,aAAa,EACtD,mBAAmB,EAAE,gBAAgB,EAAE,aAAa,EAAE,eAAe,EACtE,MAAM,gBAAgB,CAAA;AAMvB,YAAY,EAEV,QAAQ,EACR,UAAU,EACV,YAAY,EACZ,iBAAiB,EACjB,iBAAiB,EACjB,WAAW,EACX,SAAS,EAKT,iBAAiB,EACjB,gBAAgB,EAChB,aAAa,EAAE,mBAAmB;AAGlC,YAAY,EACZ,YAAY,EAGZ,YAAY,EACZ,aAAa,EACb,mBAAmB,EAGnB,eAAe,EACf,YAAY,EACZ,aAAa,EACb,cAAc,EACd,sBAAsB,EACtB,mBAAmB,EACpB,MAAM,SAAS,CAAA"}
@@ -1,63 +0,0 @@
1
- import { MotionState, MotionElement } from '../types';
2
- /**
3
- * MotionStateManager - 모션 상태 관리 클래스
4
- *
5
- * 상태 충돌 문제 해결을 위해 3가지 상태를 분리:
6
- * - internalVisibility: 내부 로직 (초기화, 리셋 등)
7
- * - triggeredVisibility: 외부 트리거 (Intersection Observer)
8
- * - finalVisibility: 최종 계산된 상태
9
- */
10
- export declare class MotionStateManager {
11
- private states;
12
- private listeners;
13
- /**
14
- * 요소의 상태를 초기화
15
- */
16
- initializeElement(elementId: string, config: MotionElement): void;
17
- /**
18
- * 내부 가시성 상태 업데이트 (초기화, 리셋 등)
19
- */
20
- setInternalVisibility(elementId: string, visible: boolean): void;
21
- /**
22
- * 외부 트리거 가시성 상태 업데이트 (Intersection Observer)
23
- */
24
- setTriggeredVisibility(elementId: string, visible: boolean): void;
25
- /**
26
- * 모션 값 업데이트
27
- */
28
- updateMotionValues(elementId: string, values: Partial<MotionState>): void;
29
- /**
30
- * 최종 상태 계산
31
- */
32
- private computeFinalState;
33
- /**
34
- * 현재 상태 조회
35
- */
36
- getState(elementId: string): MotionState | undefined;
37
- /**
38
- * 모든 상태 조회
39
- */
40
- getAllStates(): Map<string, MotionState>;
41
- /**
42
- * 상태 변경 리스너 등록
43
- */
44
- subscribe(elementId: string, listener: (state: MotionState) => void): () => void;
45
- /**
46
- * 리스너들에게 상태 변경 알림
47
- */
48
- notifyListeners(elementId: string, state: MotionState): void;
49
- /**
50
- * 모든 상태 초기화
51
- */
52
- reset(): void;
53
- /**
54
- * 특정 요소 상태 초기화
55
- */
56
- resetElement(elementId: string): void;
57
- /**
58
- * 디버그용 상태 출력
59
- */
60
- debug(): void;
61
- }
62
- export declare const motionStateManager: MotionStateManager;
63
- //# sourceMappingURL=MotionStateManager.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"MotionStateManager.d.ts","sourceRoot":"","sources":["../../src/managers/MotionStateManager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AAErD;;;;;;;GAOG;AACH,qBAAa,kBAAkB;IAC7B,OAAO,CAAC,MAAM,CAAsC;IACpD,OAAO,CAAC,SAAS,CAA4D;IAE7E;;OAEG;IACH,iBAAiB,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,aAAa,GAAG,IAAI;IAmBjE;;OAEG;IACH,qBAAqB,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IAShE;;OAEG;IACH,sBAAsB,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IASjE;;OAEG;IACH,kBAAkB,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI;IAQzE;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAWzB;;OAEG;IACH,QAAQ,CAAC,SAAS,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS;IAIpD;;OAEG;IACH,YAAY,IAAI,GAAG,CAAC,MAAM,EAAE,WAAW,CAAC;IAIxC;;OAEG;IACH,SAAS,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,GAAG,MAAM,IAAI;IAgBhF;;OAEG;IACH,eAAe,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,GAAG,IAAI;IAe5D;;OAEG;IACH,KAAK,IAAI,IAAI;IAKb;;OAEG;IACH,YAAY,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI;IAKrC;;OAEG;IACH,KAAK,IAAI,IAAI;CAed;AAGD,eAAO,MAAM,kBAAkB,oBAA2B,CAAA"}