()
| 29 | }; |
| 30 | |
| 31 | const ShuffleDemo = () => { |
| 32 | const propData = useMemo( |
| 33 | () => [ |
| 34 | { name: 'text', type: 'string', default: '""', description: 'The text content to shuffle.' }, |
| 35 | { name: 'className', type: 'string', default: '""', description: 'Optional CSS class for the wrapper element.' }, |
| 36 | { name: 'style', type: 'object', default: '{}', description: 'Inline styles applied to the wrapper element.' }, |
| 37 | { |
| 38 | name: 'shuffleDirection', |
| 39 | type: '"left" | "right" | "up" | "down"', |
| 40 | default: '"right"', |
| 41 | description: 'Direction the per-letter strip slides to reveal the final character.' |
| 42 | }, |
| 43 | { name: 'duration', type: 'number', default: '0.35', description: 'Duration (s) of the strip slide per letter.' }, |
| 44 | { |
| 45 | name: 'maxDelay', |
| 46 | type: 'number', |
| 47 | default: '0', |
| 48 | description: 'Max random delay per strip when animationMode = "random".' |
| 49 | }, |
| 50 | { |
| 51 | name: 'ease', |
| 52 | type: 'string | Function', |
| 53 | default: '"power3.out"', |
| 54 | description: 'GSAP ease for sliding and color tween.' |
| 55 | }, |
| 56 | { |
| 57 | name: 'threshold', |
| 58 | type: 'number', |
| 59 | default: '0.1', |
| 60 | description: 'Portion of the element that must enter view before starting.' |
| 61 | }, |
| 62 | { |
| 63 | name: 'rootMargin', |
| 64 | type: 'string', |
| 65 | default: '"-100px"', |
| 66 | description: 'ScrollTrigger start offset (px, %, etc.).' |
| 67 | }, |
| 68 | { |
| 69 | name: 'tag', |
| 70 | type: '"h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span"', |
| 71 | default: '"p"', |
| 72 | description: 'HTML tag to render for the text container.' |
| 73 | }, |
| 74 | { |
| 75 | name: 'textAlign', |
| 76 | type: 'CSS text-align', |
| 77 | default: '"center"', |
| 78 | description: 'Text alignment applied via inline style.' |
| 79 | }, |
| 80 | { |
| 81 | name: 'onShuffleComplete', |
| 82 | type: '() => void', |
| 83 | default: 'undefined', |
| 84 | description: 'Called after a full run completes (and on each loop repeat).' |
| 85 | }, |
| 86 | { |
| 87 | name: 'shuffleTimes', |
| 88 | type: 'number', |
nothing calls this directly
no test coverage detected