\n {({ inView, ref }) => (\n animationStyles)(inView)}\n style={Object.assign({}, style, {\n animationDelay: nodeDelay + \"ms\",\n })}\n >\n \n {({ cx }) => (\n \n )}\n \n
\n )}\n \n );\n }\n })}\n >\n );\n};\n\nconst textBaseStyles: CSSProperties = {\n display: \"inline-block\",\n whiteSpace: \"pre\",\n};\n\nconst TextReveal: React.FC<\n RevealProps & { animationStyles: SerializedStyles; children: string }\n> = (props) => {\n const {\n animationStyles,\n cascade = false,\n damping = 0.5,\n delay = 0,\n duration = 1000,\n fraction = 0,\n triggerOnce = false,\n className,\n style,\n children,\n onVisibilityChange,\n } = props;\n\n const { ref, inView } = useInView({\n triggerOnce,\n threshold: fraction,\n onChange: onVisibilityChange,\n });\n\n return matchIf(\n () => (\n