@chayns-components/typewriter 5.0.0-beta.940 → 5.0.0-beta.941

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.
@@ -60,6 +60,7 @@ const Typewriter = ({
60
60
  }) => {
61
61
  const [currentChildrenIndex, setCurrentChildrenIndex] = (0, _react.useState)(0);
62
62
  const [hasRenderedChildrenOnce, setHasRenderedChildrenOnce] = (0, _react.useState)(false);
63
+ const [shouldPreventBlinkingCursor, setShouldPreventBlinkingCursor] = (0, _react.useState)(false);
63
64
  const functions = (0, _chaynsApi.useFunctions)();
64
65
  const values = (0, _chaynsApi.useValues)();
65
66
  useIsomorphicLayoutEffect(() => {
@@ -150,6 +151,9 @@ const Typewriter = ({
150
151
  }, resetSpeed);
151
152
  } else {
152
153
  const setInterval = () => {
154
+ if (cursorType === _cursor.CursorType.Thin) {
155
+ setShouldPreventBlinkingCursor(true);
156
+ }
153
157
  if (typeof onTypingAnimationStart === 'function') {
154
158
  onTypingAnimationStart();
155
159
  }
@@ -158,6 +162,9 @@ const Typewriter = ({
158
162
  let nextState = Math.min(prevState + 1, charactersCount);
159
163
  if (nextState >= charactersCount && !shouldWaitForContent) {
160
164
  window.clearInterval(interval);
165
+ if (cursorType === _cursor.CursorType.Thin) {
166
+ setShouldPreventBlinkingCursor(false);
167
+ }
161
168
  if (typeof onTypingAnimationEnd === 'function') {
162
169
  onTypingAnimationEnd();
163
170
  }
@@ -192,7 +199,7 @@ const Typewriter = ({
192
199
  return () => {
193
200
  window.clearInterval(interval);
194
201
  };
195
- }, [resetSpeed, speed, resetDelay, childrenCount, charactersCount, textContent.length, shouldStopAnimation, shouldWaitForContent, isResetAnimationActive, shouldUseResetAnimation, areMultipleChildrenGiven, handleSetNextChildrenIndex, nextTextDelay, startDelay]);
202
+ }, [resetSpeed, speed, resetDelay, childrenCount, charactersCount, textContent.length, shouldStopAnimation, shouldWaitForContent, isResetAnimationActive, shouldUseResetAnimation, areMultipleChildrenGiven, handleSetNextChildrenIndex, nextTextDelay, startDelay, onResetAnimationStart, onResetAnimationEnd, onTypingAnimationStart, onTypingAnimationEnd, cursorType]);
196
203
  (0, _react.useEffect)(() => {
197
204
  if (!isAnimatingText && typeof onFinish === 'function') {
198
205
  onFinish();
@@ -226,7 +233,8 @@ const Typewriter = ({
226
233
  $cursorType: cursorType,
227
234
  onClick: isAnimatingText ? handleClick : undefined,
228
235
  $isAnimatingText: isAnimatingText,
229
- $shouldHideCursor: shouldHideCursor
236
+ $shouldHideCursor: shouldHideCursor,
237
+ $shouldPreventBlinkAnimation: shouldPreventBlinkingCursor
230
238
  }, isAnimatingText ? /*#__PURE__*/_react.default.createElement(_AnimatedTypewriterText.default, {
231
239
  shouldHideCursor: shouldHideCursor,
232
240
  shownText: shownText,
@@ -234,6 +242,8 @@ const Typewriter = ({
234
242
  }) : /*#__PURE__*/_react.default.createElement(_Typewriter.StyledTypewriterText, {
235
243
  style: textStyle
236
244
  }, sortedChildren), isAnimatingText && /*#__PURE__*/_react.default.createElement(_Typewriter.StyledTypewriterPseudoText, {
245
+ $isAnimatingText: isAnimatingText,
246
+ $shouldHideCursor: shouldHideCursor,
237
247
  dangerouslySetInnerHTML: {
238
248
  __html: pseudoTextHTML
239
249
  }
@@ -242,7 +252,7 @@ const Typewriter = ({
242
252
  position: 'absolute',
243
253
  visibility: 'hidden'
244
254
  }
245
- }, children), document.body)), [children, cursorType, handleClick, hasRenderedChildrenOnce, isAnimatingText, pseudoTextHTML, shouldHideCursor, shownText, sortedChildren, textStyle]);
255
+ }, children), document.body)), [children, cursorType, handleClick, hasRenderedChildrenOnce, isAnimatingText, pseudoTextHTML, shouldHideCursor, shouldPreventBlinkingCursor, shownText, sortedChildren, textStyle]);
246
256
  };
247
257
  Typewriter.displayName = 'Typewriter';
248
258
  var _default = exports.default = Typewriter;
@@ -1 +1 @@
1
- {"version":3,"file":"Typewriter.js","names":["_core","require","_chaynsApi","_react","_interopRequireWildcard","_reactDom","_server","_cursor","_AnimatedTypewriterText","_interopRequireDefault","_Typewriter","_utils","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","useIsomorphicLayoutEffect","window","useLayoutEffect","useEffect","TypewriterDelay","exports","TypewriterSpeed","Typewriter","children","cursorType","CursorType","Default","nextTextDelay","Medium","onFinish","onResetAnimationEnd","onResetAnimationStart","onTypingAnimationEnd","onTypingAnimationStart","pseudoChildren","resetDelay","shouldForceCursorAnimation","shouldHideCursor","shouldSortChildrenRandomly","shouldUseAnimationHeight","shouldUseResetAnimation","shouldWaitForContent","speed","resetSpeed","startDelay","None","textStyle","currentChildrenIndex","setCurrentChildrenIndex","useState","hasRenderedChildrenOnce","setHasRenderedChildrenOnce","functions","useFunctions","values","useValues","sortedChildren","useMemo","Array","isArray","shuffleArray","areMultipleChildrenGiven","childrenCount","length","textContent","currentChildren","React","isValidElement","renderToString","createElement","ChaynsProvider","data","isModule","ColorSchemeProvider","color","colorMode","style","display","charactersCount","getCharactersCount","isResetAnimationActive","setIsResetAnimationActive","shownCharCount","setShownCharCount","shouldStopAnimation","setShouldStopAnimation","isAnimatingText","handleClick","useCallback","event","stopPropagation","preventDefault","handleSetNextChildrenIndex","newIndex","interval","setInterval","prevState","nextState","clearInterval","setTimeout","Math","min","shownText","getSubTextFromHTML","pseudoTextHTML","pseudoText","StyledTypewriter","$cursorType","onClick","undefined","$isAnimatingText","$shouldHideCursor","StyledTypewriterText","StyledTypewriterPseudoText","dangerouslySetInnerHTML","__html","createPortal","position","visibility","document","body","displayName","_default"],"sources":["../../../../src/components/typewriter/Typewriter.tsx"],"sourcesContent":["import { ColorSchemeProvider } from '@chayns-components/core';\nimport { ChaynsProvider, useFunctions, useValues } from 'chayns-api';\nimport React, {\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { renderToString } from 'react-dom/server';\nimport { CursorType } from '../../types/cursor';\nimport AnimatedTypewriterText from './AnimatedTypewriterText';\nimport {\n StyledTypewriter,\n StyledTypewriterPseudoText,\n StyledTypewriterText,\n} from './Typewriter.styles';\nimport { getCharactersCount, getSubTextFromHTML, shuffleArray } from './utils';\n\nconst useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterDelay {\n ExtraSlow = 4000,\n Slow = 2000,\n Medium = 1000,\n Fast = 500,\n ExtraFast = 250,\n None = 0,\n}\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterSpeed {\n ExtraSlow = 40,\n Slow = 20,\n Medium = 10,\n Fast = 5,\n ExtraFast = 2.5,\n}\n\nexport type TypewriterProps = {\n /**\n * The text to type\n */\n children: ReactElement | ReactElement[] | string | string[];\n /**\n * The type of the cursor. Use the CursorType enum for this prop.\n */\n cursorType?: CursorType;\n /**\n * The delay in milliseconds before the next text is shown.\n * This prop is only used if multiple texts are given.\n */\n nextTextDelay?: TypewriterDelay;\n /**\n * Function that is executed when the typewriter animation has finished. This function will not\n * be executed if multiple texts are used.\n */\n onFinish?: VoidFunction;\n /**\n * Function that is executed when the reset animation has finished. This function will not be\n * executed if `shouldUseResetAnimation` is not set to `true`.\n */\n onResetAnimationEnd?: VoidFunction;\n /**\n * Function that is executed when the reset animation has started. This function will not be\n * executed if `shouldUseResetAnimation` is not set to `true`.\n */\n onResetAnimationStart?: VoidFunction;\n /**\n * Function that is executed when the typing animation has finished. If multiple texts are given,\n * this function will be executed for each text.\n */\n onTypingAnimationEnd?: VoidFunction;\n /**\n * Function that is executed when the typing animation has started. If multiple texts are given,\n * this function will be executed for each text.\n */\n onTypingAnimationStart?: VoidFunction;\n /**\n * Pseudo-element to be rendered invisible during animation to define the size of the element\n * for the typewriter effect. By default, the \"children\" is used for this purpose.\n */\n pseudoChildren?: ReactElement | string;\n /**\n * Waiting time in milliseconds before the typewriter resets the text.\n * This prop is only used if multiple texts are given.\n */\n resetDelay?: TypewriterDelay;\n /**\n * The reset speed of the animation. Use the TypewriterSpeed enum for this prop.\n */\n resetSpeed?: TypewriterSpeed | number;\n /**\n * Specifies whether the cursor should be forced to animate even if no text is currently animated.\n */\n shouldForceCursorAnimation?: boolean;\n /**\n * Specifies whether the cursor should be hidden\n */\n shouldHideCursor?: boolean;\n /**\n * Specifies whether the children should be sorted randomly if there are multiple texts.\n * This makes the typewriter start with a different text each time and also changes them\n * in a random order.\n */\n shouldSortChildrenRandomly?: boolean;\n /**\n * Specifies whether the animation should use its full height or the height of the current\n * chunk.\n */\n shouldUseAnimationHeight?: boolean;\n /**\n * Specifies whether the reset of the text should be animated with a backspace animation for\n * multiple texts.\n */\n shouldUseResetAnimation?: boolean;\n /**\n * Whether the typewriter should wait for new content\n */\n shouldWaitForContent?: boolean;\n /**\n * The speed of the animation. Use the TypewriterSpeed enum for this prop.\n */\n speed?: TypewriterSpeed | number;\n /**\n * The delay in milliseconds before the typewriter starts typing.\n */\n startDelay?: TypewriterDelay;\n /**\n * The style of the typewriter text element\n */\n textStyle?: React.CSSProperties;\n};\n\nconst Typewriter: FC<TypewriterProps> = ({\n children,\n cursorType = CursorType.Default,\n nextTextDelay = TypewriterDelay.Medium,\n onFinish,\n onResetAnimationEnd,\n onResetAnimationStart,\n onTypingAnimationEnd,\n onTypingAnimationStart,\n pseudoChildren,\n resetDelay = TypewriterDelay.Medium,\n shouldForceCursorAnimation = false,\n shouldHideCursor = false,\n shouldSortChildrenRandomly = false,\n shouldUseAnimationHeight = false,\n shouldUseResetAnimation = false,\n shouldWaitForContent,\n speed = TypewriterSpeed.Medium,\n resetSpeed = speed,\n startDelay = TypewriterDelay.None,\n textStyle,\n}) => {\n const [currentChildrenIndex, setCurrentChildrenIndex] = useState(0);\n const [hasRenderedChildrenOnce, setHasRenderedChildrenOnce] = useState(false);\n\n const functions = useFunctions();\n const values = useValues();\n\n useIsomorphicLayoutEffect(() => {\n if (children) {\n setHasRenderedChildrenOnce(false);\n }\n }, [children]);\n\n useEffect(() => {\n if (!hasRenderedChildrenOnce) {\n setHasRenderedChildrenOnce(true);\n }\n }, [hasRenderedChildrenOnce]);\n\n const sortedChildren = useMemo(\n () =>\n Array.isArray(children) && shouldSortChildrenRandomly\n ? shuffleArray<ReactElement | string>(children)\n : children,\n [children, shouldSortChildrenRandomly],\n );\n\n const areMultipleChildrenGiven = Array.isArray(sortedChildren);\n const childrenCount = areMultipleChildrenGiven ? sortedChildren.length : 1;\n\n const textContent = useMemo(() => {\n if (areMultipleChildrenGiven) {\n const currentChildren = sortedChildren[currentChildrenIndex];\n\n if (currentChildren) {\n return React.isValidElement(currentChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {currentChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (currentChildren as string);\n }\n\n return '';\n }\n\n return React.isValidElement(sortedChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {sortedChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (sortedChildren as string);\n }, [areMultipleChildrenGiven, currentChildrenIndex, functions, sortedChildren, values]);\n\n const charactersCount = useMemo(() => getCharactersCount(textContent), [textContent]);\n\n const [isResetAnimationActive, setIsResetAnimationActive] = useState(false);\n const [shownCharCount, setShownCharCount] = useState(\n charactersCount > 0 ? 0 : textContent.length,\n );\n const [shouldStopAnimation, setShouldStopAnimation] = useState(false);\n\n const isAnimatingText =\n shownCharCount < textContent.length ||\n shouldForceCursorAnimation ||\n areMultipleChildrenGiven ||\n textContent.length === 0;\n\n const handleClick = useCallback((event: React.MouseEvent) => {\n event.stopPropagation();\n event.preventDefault();\n\n setShouldStopAnimation(true);\n }, []);\n\n const handleSetNextChildrenIndex = useCallback(\n () =>\n setCurrentChildrenIndex(() => {\n let newIndex = currentChildrenIndex + 1;\n\n if (newIndex > childrenCount - 1) {\n newIndex = 0;\n }\n\n return newIndex;\n }),\n [childrenCount, currentChildrenIndex],\n );\n\n useEffect(() => {\n let interval: number | undefined;\n\n if (shouldStopAnimation || charactersCount === 0) {\n setShownCharCount(textContent.length);\n } else if (isResetAnimationActive) {\n if (typeof onResetAnimationStart === 'function') {\n onResetAnimationStart();\n }\n\n interval = window.setInterval(() => {\n setShownCharCount((prevState) => {\n const nextState = prevState - 1;\n\n if (nextState === 0) {\n window.clearInterval(interval);\n\n if (typeof onResetAnimationEnd === 'function') {\n onResetAnimationEnd();\n }\n\n if (areMultipleChildrenGiven) {\n setTimeout(() => {\n setIsResetAnimationActive(false);\n handleSetNextChildrenIndex();\n }, nextTextDelay);\n }\n }\n\n return nextState;\n });\n }, resetSpeed);\n } else {\n const setInterval = () => {\n if (typeof onTypingAnimationStart === 'function') {\n onTypingAnimationStart();\n }\n\n interval = window.setInterval(() => {\n setShownCharCount((prevState) => {\n let nextState = Math.min(prevState + 1, charactersCount);\n\n if (nextState >= charactersCount && !shouldWaitForContent) {\n window.clearInterval(interval);\n\n if (typeof onTypingAnimationEnd === 'function') {\n onTypingAnimationEnd();\n }\n\n /**\n * At this point, the next value for \"shownCharCount\" is deliberately set to\n * the length of the textContent in order to correctly display HTML elements\n * after the last letter.\n */\n nextState = textContent.length;\n\n if (areMultipleChildrenGiven) {\n setTimeout(() => {\n if (shouldUseResetAnimation) {\n setIsResetAnimationActive(true);\n } else {\n setShownCharCount(0);\n setTimeout(handleSetNextChildrenIndex, nextTextDelay);\n }\n }, resetDelay);\n }\n }\n\n return nextState;\n });\n }, speed);\n };\n\n if (startDelay) {\n setTimeout(setInterval, startDelay);\n } else {\n setInterval();\n }\n }\n\n return () => {\n window.clearInterval(interval);\n };\n }, [\n resetSpeed,\n speed,\n resetDelay,\n childrenCount,\n charactersCount,\n textContent.length,\n shouldStopAnimation,\n shouldWaitForContent,\n isResetAnimationActive,\n shouldUseResetAnimation,\n areMultipleChildrenGiven,\n handleSetNextChildrenIndex,\n nextTextDelay,\n startDelay,\n ]);\n\n useEffect(() => {\n if (!isAnimatingText && typeof onFinish === 'function') {\n onFinish();\n }\n }, [isAnimatingText, onFinish]);\n\n const shownText = useMemo(\n () => getSubTextFromHTML(textContent, shownCharCount),\n [shownCharCount, textContent],\n );\n\n const pseudoTextHTML = useMemo(() => {\n if (pseudoChildren) {\n const pseudoText = React.isValidElement(pseudoChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {pseudoChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (pseudoChildren as string);\n\n if (shouldUseAnimationHeight) {\n return getSubTextFromHTML(pseudoText, shownCharCount);\n }\n\n return pseudoText;\n }\n\n if (shouldUseAnimationHeight && textContent) {\n return getSubTextFromHTML(textContent, shownCharCount);\n }\n\n return textContent || '&#8203;';\n }, [functions, pseudoChildren, shouldUseAnimationHeight, shownCharCount, textContent, values]);\n\n return useMemo(\n () => (\n <StyledTypewriter\n $cursorType={cursorType}\n onClick={isAnimatingText ? handleClick : undefined}\n $isAnimatingText={isAnimatingText}\n $shouldHideCursor={shouldHideCursor}\n >\n {isAnimatingText ? (\n <AnimatedTypewriterText\n shouldHideCursor={shouldHideCursor}\n shownText={shownText}\n textStyle={textStyle}\n />\n ) : (\n <StyledTypewriterText style={textStyle}>{sortedChildren}</StyledTypewriterText>\n )}\n {isAnimatingText && (\n <StyledTypewriterPseudoText\n dangerouslySetInnerHTML={{ __html: pseudoTextHTML }}\n />\n )}\n {/*\n The following is needed because some components like the CodeHighlighter will not render correct\n if the element is not rendered on client before...\n */}\n {!hasRenderedChildrenOnce &&\n createPortal(\n <div style={{ position: 'absolute', visibility: 'hidden' }}>\n {children}\n </div>,\n document.body,\n )}\n </StyledTypewriter>\n ),\n [\n children,\n cursorType,\n handleClick,\n hasRenderedChildrenOnce,\n isAnimatingText,\n pseudoTextHTML,\n shouldHideCursor,\n shownText,\n sortedChildren,\n textStyle,\n ],\n );\n};\n\nTypewriter.displayName = 'Typewriter';\n\nexport default Typewriter;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Typewriter.js","names":["_core","require","_chaynsApi","_react","_interopRequireWildcard","_reactDom","_server","_cursor","_AnimatedTypewriterText","_interopRequireDefault","_Typewriter","_utils","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","useIsomorphicLayoutEffect","window","useLayoutEffect","useEffect","TypewriterDelay","exports","TypewriterSpeed","Typewriter","children","cursorType","CursorType","Default","nextTextDelay","Medium","onFinish","onResetAnimationEnd","onResetAnimationStart","onTypingAnimationEnd","onTypingAnimationStart","pseudoChildren","resetDelay","shouldForceCursorAnimation","shouldHideCursor","shouldSortChildrenRandomly","shouldUseAnimationHeight","shouldUseResetAnimation","shouldWaitForContent","speed","resetSpeed","startDelay","None","textStyle","currentChildrenIndex","setCurrentChildrenIndex","useState","hasRenderedChildrenOnce","setHasRenderedChildrenOnce","shouldPreventBlinkingCursor","setShouldPreventBlinkingCursor","functions","useFunctions","values","useValues","sortedChildren","useMemo","Array","isArray","shuffleArray","areMultipleChildrenGiven","childrenCount","length","textContent","currentChildren","React","isValidElement","renderToString","createElement","ChaynsProvider","data","isModule","ColorSchemeProvider","color","colorMode","style","display","charactersCount","getCharactersCount","isResetAnimationActive","setIsResetAnimationActive","shownCharCount","setShownCharCount","shouldStopAnimation","setShouldStopAnimation","isAnimatingText","handleClick","useCallback","event","stopPropagation","preventDefault","handleSetNextChildrenIndex","newIndex","interval","setInterval","prevState","nextState","clearInterval","setTimeout","Thin","Math","min","shownText","getSubTextFromHTML","pseudoTextHTML","pseudoText","StyledTypewriter","$cursorType","onClick","undefined","$isAnimatingText","$shouldHideCursor","$shouldPreventBlinkAnimation","StyledTypewriterText","StyledTypewriterPseudoText","dangerouslySetInnerHTML","__html","createPortal","position","visibility","document","body","displayName","_default"],"sources":["../../../../src/components/typewriter/Typewriter.tsx"],"sourcesContent":["import { ColorSchemeProvider } from '@chayns-components/core';\nimport { ChaynsProvider, useFunctions, useValues } from 'chayns-api';\nimport React, {\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { renderToString } from 'react-dom/server';\nimport { CursorType } from '../../types/cursor';\nimport AnimatedTypewriterText from './AnimatedTypewriterText';\nimport {\n StyledTypewriter,\n StyledTypewriterPseudoText,\n StyledTypewriterText,\n} from './Typewriter.styles';\nimport { getCharactersCount, getSubTextFromHTML, shuffleArray } from './utils';\n\nconst useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterDelay {\n ExtraSlow = 4000,\n Slow = 2000,\n Medium = 1000,\n Fast = 500,\n ExtraFast = 250,\n None = 0,\n}\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterSpeed {\n ExtraSlow = 40,\n Slow = 20,\n Medium = 10,\n Fast = 5,\n ExtraFast = 2.5,\n}\n\nexport type TypewriterProps = {\n /**\n * The text to type\n */\n children: ReactElement | ReactElement[] | string | string[];\n /**\n * The type of the cursor. Use the CursorType enum for this prop.\n */\n cursorType?: CursorType;\n /**\n * The delay in milliseconds before the next text is shown.\n * This prop is only used if multiple texts are given.\n */\n nextTextDelay?: TypewriterDelay;\n /**\n * Function that is executed when the typewriter animation has finished. This function will not\n * be executed if multiple texts are used.\n */\n onFinish?: VoidFunction;\n /**\n * Function that is executed when the reset animation has finished. This function will not be\n * executed if `shouldUseResetAnimation` is not set to `true`.\n */\n onResetAnimationEnd?: VoidFunction;\n /**\n * Function that is executed when the reset animation has started. This function will not be\n * executed if `shouldUseResetAnimation` is not set to `true`.\n */\n onResetAnimationStart?: VoidFunction;\n /**\n * Function that is executed when the typing animation has finished. If multiple texts are given,\n * this function will be executed for each text.\n */\n onTypingAnimationEnd?: VoidFunction;\n /**\n * Function that is executed when the typing animation has started. If multiple texts are given,\n * this function will be executed for each text.\n */\n onTypingAnimationStart?: VoidFunction;\n /**\n * Pseudo-element to be rendered invisible during animation to define the size of the element\n * for the typewriter effect. By default, the \"children\" is used for this purpose.\n */\n pseudoChildren?: ReactElement | string;\n /**\n * Waiting time in milliseconds before the typewriter resets the text.\n * This prop is only used if multiple texts are given.\n */\n resetDelay?: TypewriterDelay;\n /**\n * The reset speed of the animation. Use the TypewriterSpeed enum for this prop.\n */\n resetSpeed?: TypewriterSpeed | number;\n /**\n * Specifies whether the cursor should be forced to animate even if no text is currently animated.\n */\n shouldForceCursorAnimation?: boolean;\n /**\n * Specifies whether the cursor should be hidden\n */\n shouldHideCursor?: boolean;\n /**\n * Specifies whether the children should be sorted randomly if there are multiple texts.\n * This makes the typewriter start with a different text each time and also changes them\n * in a random order.\n */\n shouldSortChildrenRandomly?: boolean;\n /**\n * Specifies whether the animation should use its full height or the height of the current\n * chunk.\n */\n shouldUseAnimationHeight?: boolean;\n /**\n * Specifies whether the reset of the text should be animated with a backspace animation for\n * multiple texts.\n */\n shouldUseResetAnimation?: boolean;\n /**\n * Whether the typewriter should wait for new content\n */\n shouldWaitForContent?: boolean;\n /**\n * The speed of the animation. Use the TypewriterSpeed enum for this prop.\n */\n speed?: TypewriterSpeed | number;\n /**\n * The delay in milliseconds before the typewriter starts typing.\n */\n startDelay?: TypewriterDelay;\n /**\n * The style of the typewriter text element\n */\n textStyle?: React.CSSProperties;\n};\n\nconst Typewriter: FC<TypewriterProps> = ({\n children,\n cursorType = CursorType.Default,\n nextTextDelay = TypewriterDelay.Medium,\n onFinish,\n onResetAnimationEnd,\n onResetAnimationStart,\n onTypingAnimationEnd,\n onTypingAnimationStart,\n pseudoChildren,\n resetDelay = TypewriterDelay.Medium,\n shouldForceCursorAnimation = false,\n shouldHideCursor = false,\n shouldSortChildrenRandomly = false,\n shouldUseAnimationHeight = false,\n shouldUseResetAnimation = false,\n shouldWaitForContent,\n speed = TypewriterSpeed.Medium,\n resetSpeed = speed,\n startDelay = TypewriterDelay.None,\n textStyle,\n}) => {\n const [currentChildrenIndex, setCurrentChildrenIndex] = useState(0);\n const [hasRenderedChildrenOnce, setHasRenderedChildrenOnce] = useState(false);\n const [shouldPreventBlinkingCursor, setShouldPreventBlinkingCursor] = useState(false);\n\n const functions = useFunctions();\n const values = useValues();\n\n useIsomorphicLayoutEffect(() => {\n if (children) {\n setHasRenderedChildrenOnce(false);\n }\n }, [children]);\n\n useEffect(() => {\n if (!hasRenderedChildrenOnce) {\n setHasRenderedChildrenOnce(true);\n }\n }, [hasRenderedChildrenOnce]);\n\n const sortedChildren = useMemo(\n () =>\n Array.isArray(children) && shouldSortChildrenRandomly\n ? shuffleArray<ReactElement | string>(children)\n : children,\n [children, shouldSortChildrenRandomly],\n );\n\n const areMultipleChildrenGiven = Array.isArray(sortedChildren);\n const childrenCount = areMultipleChildrenGiven ? sortedChildren.length : 1;\n\n const textContent = useMemo(() => {\n if (areMultipleChildrenGiven) {\n const currentChildren = sortedChildren[currentChildrenIndex];\n\n if (currentChildren) {\n return React.isValidElement(currentChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {currentChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (currentChildren as string);\n }\n\n return '';\n }\n\n return React.isValidElement(sortedChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {sortedChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (sortedChildren as string);\n }, [areMultipleChildrenGiven, currentChildrenIndex, functions, sortedChildren, values]);\n\n const charactersCount = useMemo(() => getCharactersCount(textContent), [textContent]);\n\n const [isResetAnimationActive, setIsResetAnimationActive] = useState(false);\n const [shownCharCount, setShownCharCount] = useState(\n charactersCount > 0 ? 0 : textContent.length,\n );\n const [shouldStopAnimation, setShouldStopAnimation] = useState(false);\n\n const isAnimatingText =\n shownCharCount < textContent.length ||\n shouldForceCursorAnimation ||\n areMultipleChildrenGiven ||\n textContent.length === 0;\n\n const handleClick = useCallback((event: React.MouseEvent) => {\n event.stopPropagation();\n event.preventDefault();\n\n setShouldStopAnimation(true);\n }, []);\n\n const handleSetNextChildrenIndex = useCallback(\n () =>\n setCurrentChildrenIndex(() => {\n let newIndex = currentChildrenIndex + 1;\n\n if (newIndex > childrenCount - 1) {\n newIndex = 0;\n }\n\n return newIndex;\n }),\n [childrenCount, currentChildrenIndex],\n );\n\n useEffect(() => {\n let interval: number | undefined;\n\n if (shouldStopAnimation || charactersCount === 0) {\n setShownCharCount(textContent.length);\n } else if (isResetAnimationActive) {\n if (typeof onResetAnimationStart === 'function') {\n onResetAnimationStart();\n }\n\n interval = window.setInterval(() => {\n setShownCharCount((prevState) => {\n const nextState = prevState - 1;\n\n if (nextState === 0) {\n window.clearInterval(interval);\n\n if (typeof onResetAnimationEnd === 'function') {\n onResetAnimationEnd();\n }\n\n if (areMultipleChildrenGiven) {\n setTimeout(() => {\n setIsResetAnimationActive(false);\n handleSetNextChildrenIndex();\n }, nextTextDelay);\n }\n }\n\n return nextState;\n });\n }, resetSpeed);\n } else {\n const setInterval = () => {\n if (cursorType === CursorType.Thin) {\n setShouldPreventBlinkingCursor(true);\n }\n\n if (typeof onTypingAnimationStart === 'function') {\n onTypingAnimationStart();\n }\n\n interval = window.setInterval(() => {\n setShownCharCount((prevState) => {\n let nextState = Math.min(prevState + 1, charactersCount);\n\n if (nextState >= charactersCount && !shouldWaitForContent) {\n window.clearInterval(interval);\n\n if (cursorType === CursorType.Thin) {\n setShouldPreventBlinkingCursor(false);\n }\n\n if (typeof onTypingAnimationEnd === 'function') {\n onTypingAnimationEnd();\n }\n\n /**\n * At this point, the next value for \"shownCharCount\" is deliberately set to\n * the length of the textContent in order to correctly display HTML elements\n * after the last letter.\n */\n nextState = textContent.length;\n\n if (areMultipleChildrenGiven) {\n setTimeout(() => {\n if (shouldUseResetAnimation) {\n setIsResetAnimationActive(true);\n } else {\n setShownCharCount(0);\n setTimeout(handleSetNextChildrenIndex, nextTextDelay);\n }\n }, resetDelay);\n }\n }\n\n return nextState;\n });\n }, speed);\n };\n\n if (startDelay) {\n setTimeout(setInterval, startDelay);\n } else {\n setInterval();\n }\n }\n\n return () => {\n window.clearInterval(interval);\n };\n }, [\n resetSpeed,\n speed,\n resetDelay,\n childrenCount,\n charactersCount,\n textContent.length,\n shouldStopAnimation,\n shouldWaitForContent,\n isResetAnimationActive,\n shouldUseResetAnimation,\n areMultipleChildrenGiven,\n handleSetNextChildrenIndex,\n nextTextDelay,\n startDelay,\n onResetAnimationStart,\n onResetAnimationEnd,\n onTypingAnimationStart,\n onTypingAnimationEnd,\n cursorType,\n ]);\n\n useEffect(() => {\n if (!isAnimatingText && typeof onFinish === 'function') {\n onFinish();\n }\n }, [isAnimatingText, onFinish]);\n\n const shownText = useMemo(\n () => getSubTextFromHTML(textContent, shownCharCount),\n [shownCharCount, textContent],\n );\n\n const pseudoTextHTML = useMemo(() => {\n if (pseudoChildren) {\n const pseudoText = React.isValidElement(pseudoChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {pseudoChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (pseudoChildren as string);\n\n if (shouldUseAnimationHeight) {\n return getSubTextFromHTML(pseudoText, shownCharCount);\n }\n\n return pseudoText;\n }\n\n if (shouldUseAnimationHeight && textContent) {\n return getSubTextFromHTML(textContent, shownCharCount);\n }\n\n return textContent || '&#8203;';\n }, [functions, pseudoChildren, shouldUseAnimationHeight, shownCharCount, textContent, values]);\n\n return useMemo(\n () => (\n <StyledTypewriter\n $cursorType={cursorType}\n onClick={isAnimatingText ? handleClick : undefined}\n $isAnimatingText={isAnimatingText}\n $shouldHideCursor={shouldHideCursor}\n $shouldPreventBlinkAnimation={shouldPreventBlinkingCursor}\n >\n {isAnimatingText ? (\n <AnimatedTypewriterText\n shouldHideCursor={shouldHideCursor}\n shownText={shownText}\n textStyle={textStyle}\n />\n ) : (\n <StyledTypewriterText style={textStyle}>{sortedChildren}</StyledTypewriterText>\n )}\n {isAnimatingText && (\n <StyledTypewriterPseudoText\n $isAnimatingText={isAnimatingText}\n $shouldHideCursor={shouldHideCursor}\n dangerouslySetInnerHTML={{ __html: pseudoTextHTML }}\n />\n )}\n {/*\n The following is needed because some components like the CodeHighlighter will not render correct\n if the element is not rendered on client before...\n */}\n {!hasRenderedChildrenOnce &&\n createPortal(\n <div style={{ position: 'absolute', visibility: 'hidden' }}>\n {children}\n </div>,\n document.body,\n )}\n </StyledTypewriter>\n ),\n [\n children,\n cursorType,\n handleClick,\n hasRenderedChildrenOnce,\n isAnimatingText,\n pseudoTextHTML,\n shouldHideCursor,\n shouldPreventBlinkingCursor,\n shownText,\n sortedChildren,\n textStyle,\n ],\n );\n};\n\nTypewriter.displayName = 'Typewriter';\n\nexport default Typewriter;\n"],"mappings":"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","ignoreList":[]}
@@ -11,7 +11,8 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
11
11
  const typewriterCursorElement = ({
12
12
  $cursorType,
13
13
  $isAnimatingText,
14
- $shouldHideCursor
14
+ $shouldHideCursor,
15
+ $shouldPreventBlinkAnimation
15
16
  }) => {
16
17
  if (!$isAnimatingText || $shouldHideCursor) {
17
18
  return '';
@@ -20,7 +21,7 @@ const typewriterCursorElement = ({
20
21
  return (0, _styledComponents.css)`
21
22
  .typewriter-lastWithContent {
22
23
  &:after {
23
- animation: ${blinkAnimation} 1s steps(2, start) infinite;
24
+ animation: ${$shouldPreventBlinkAnimation ? 'none' : blinkAnimation} 1s steps(2, start) infinite;
24
25
  color: inherit;
25
26
  content: '|';
26
27
  font-size: 25px;
@@ -62,14 +63,29 @@ const StyledTypewriterPseudoText = exports.StyledTypewriterPseudoText = _styledC
62
63
  opacity: 0;
63
64
  pointer-events: none;
64
65
  user-select: none;
65
- width: 100%;
66
+ width: fit-content;
67
+
68
+ ${({
69
+ $isAnimatingText,
70
+ $shouldHideCursor
71
+ }) => $isAnimatingText && !$shouldHideCursor && (0, _styledComponents.css)`
72
+ &:after {
73
+ animation: ${blinkAnimation} 1s steps(2, start) infinite;
74
+ color: inherit;
75
+ content: '|';
76
+ font-size: 25px;
77
+ position: relative;
78
+ line-height: 0;
79
+ vertical-align: baseline;
80
+ }
81
+ `}
66
82
  `;
67
83
  const StyledTypewriterText = exports.StyledTypewriterText = _styledComponents.default.span`
68
84
  color: inherit;
69
85
  position: ${({
70
86
  $isAnimatingText
71
87
  }) => $isAnimatingText ? 'absolute' : 'relative'};
72
- width: 100%;
88
+ width: fit-content;
73
89
 
74
90
  ${({
75
91
  $isAnimatingText
@@ -1 +1 @@
1
- {"version":3,"file":"Typewriter.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_cursor","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","typewriterCursorElement","$cursorType","$isAnimatingText","$shouldHideCursor","CursorType","Thin","css","blinkAnimation","theme","text","StyledTypewriter","exports","styled","div","keyframes","StyledTypewriterPseudoText","span","StyledTypewriterText"],"sources":["../../../../src/components/typewriter/Typewriter.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { css, keyframes } from 'styled-components';\nimport { CursorType } from '../../types/cursor';\nimport type { TypewriterProps } from './Typewriter';\n\ntype StyledTypewriterProps = WithTheme<{\n $cursorType: TypewriterProps['cursorType'];\n $isAnimatingText: boolean;\n $shouldHideCursor: TypewriterProps['shouldHideCursor'];\n}>;\n\nconst typewriterCursorElement = ({\n $cursorType,\n $isAnimatingText,\n $shouldHideCursor,\n}: StyledTypewriterProps) => {\n if (!$isAnimatingText || $shouldHideCursor) {\n return '';\n }\n\n if ($cursorType === CursorType.Thin) {\n return css`\n .typewriter-lastWithContent {\n &:after {\n animation: ${blinkAnimation} 1s steps(2, start) infinite;\n color: inherit;\n content: '|';\n font-size: 25px;\n position: relative;\n line-height: 0;\n vertical-align: baseline;\n }\n `;\n }\n\n return css`\n .typewriter-lastWithContent {\n &:after {\n animation: ${blinkAnimation} 1s steps(2, start) infinite;\n color: ${({ theme }: StyledTypewriterTextProps) => theme.text};\n content: '▋';\n margin-left: 0.25rem;\n opacity: 0.85;\n position: relative;\n vertical-align: baseline;\n }\n }\n `;\n};\n\nexport const StyledTypewriter = styled.div<StyledTypewriterProps>`\n align-items: inherit;\n display: flex;\n position: relative;\n width: 100%;\n ${typewriterCursorElement}\n`;\n\nconst blinkAnimation = keyframes`\n 100% {\n visibility: hidden;\n }\n`;\n\nexport const StyledTypewriterPseudoText = styled.span`\n opacity: 0;\n pointer-events: none;\n user-select: none;\n width: 100%;\n`;\n\ntype StyledTypewriterTextProps = WithTheme<{\n $isAnimatingText?: boolean;\n}>;\n\nexport const StyledTypewriterText = styled.span<StyledTypewriterTextProps>`\n color: inherit;\n position: ${({ $isAnimatingText }) => ($isAnimatingText ? 'absolute' : 'relative')};\n width: 100%;\n\n ${({ $isAnimatingText }) =>\n $isAnimatingText &&\n css`\n pointer-events: none;\n `}\n`;\n"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAAgD,SAAAE,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAJ,wBAAAI,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAShD,MAAMW,uBAAuB,GAAGA,CAAC;EAC7BC,WAAW;EACXC,gBAAgB;EAChBC;AACmB,CAAC,KAAK;EACzB,IAAI,CAACD,gBAAgB,IAAIC,iBAAiB,EAAE;IACxC,OAAO,EAAE;EACb;EAEA,IAAIF,WAAW,KAAKG,kBAAU,CAACC,IAAI,EAAE;IACjC,OAAO,IAAAC,qBAAG;AAClB;AACA;AACA,iCAAiCC,cAAc;AAC/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;EACL;EAEA,OAAO,IAAAD,qBAAG;AACd;AACA;AACA,6BAA6BC,cAAc;AAC3C,yBAAyB,CAAC;IAAEC;EAAiC,CAAC,KAAKA,KAAK,CAACC,IAAI;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL,CAAC;AAEM,MAAMC,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAGE,yBAAM,CAACC,GAA0B;AACjE;AACA;AACA;AACA;AACA,MAAMb,uBAAuB;AAC7B,CAAC;AAED,MAAMO,cAAc,GAAG,IAAAO,2BAAS;AAChC;AACA;AACA;AACA,CAAC;AAEM,MAAMC,0BAA0B,GAAAJ,OAAA,CAAAI,0BAAA,GAAGH,yBAAM,CAACI,IAAI;AACrD;AACA;AACA;AACA;AACA,CAAC;AAMM,MAAMC,oBAAoB,GAAAN,OAAA,CAAAM,oBAAA,GAAGL,yBAAM,CAACI,IAA+B;AAC1E;AACA,gBAAgB,CAAC;EAAEd;AAAiB,CAAC,KAAMA,gBAAgB,GAAG,UAAU,GAAG,UAAW;AACtF;AACA;AACA,MAAM,CAAC;EAAEA;AAAiB,CAAC,KACnBA,gBAAgB,IAChB,IAAAI,qBAAG;AACX;AACA,SAAS;AACT,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"Typewriter.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_cursor","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","typewriterCursorElement","$cursorType","$isAnimatingText","$shouldHideCursor","$shouldPreventBlinkAnimation","CursorType","Thin","css","blinkAnimation","theme","text","StyledTypewriter","exports","styled","div","keyframes","StyledTypewriterPseudoText","span","StyledTypewriterText"],"sources":["../../../../src/components/typewriter/Typewriter.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { css, keyframes } from 'styled-components';\nimport { CursorType } from '../../types/cursor';\nimport type { TypewriterProps } from './Typewriter';\n\ntype StyledTypewriterProps = WithTheme<{\n $cursorType: TypewriterProps['cursorType'];\n $isAnimatingText: boolean;\n $shouldHideCursor: TypewriterProps['shouldHideCursor'];\n $shouldPreventBlinkAnimation: boolean;\n}>;\n\nconst typewriterCursorElement = ({\n $cursorType,\n $isAnimatingText,\n $shouldHideCursor,\n $shouldPreventBlinkAnimation,\n}: StyledTypewriterProps) => {\n if (!$isAnimatingText || $shouldHideCursor) {\n return '';\n }\n\n if ($cursorType === CursorType.Thin) {\n return css`\n .typewriter-lastWithContent {\n &:after {\n animation: ${$shouldPreventBlinkAnimation ? 'none' : blinkAnimation} 1s steps(2, start) infinite;\n color: inherit;\n content: '|';\n font-size: 25px;\n position: relative;\n line-height: 0;\n vertical-align: baseline;\n }\n `;\n }\n\n return css`\n .typewriter-lastWithContent {\n &:after {\n animation: ${blinkAnimation} 1s steps(2, start) infinite;\n color: ${({ theme }: StyledTypewriterTextProps) => theme.text};\n content: '▋';\n margin-left: 0.25rem;\n opacity: 0.85;\n position: relative;\n vertical-align: baseline;\n }\n }\n `;\n};\n\nexport const StyledTypewriter = styled.div<StyledTypewriterProps>`\n align-items: inherit;\n display: flex;\n position: relative;\n width: 100%;\n ${typewriterCursorElement}\n`;\n\nconst blinkAnimation = keyframes`\n 100% {\n visibility: hidden;\n }\n`;\n\ntype StyledTypewriterPseudoTextProps = WithTheme<{\n $isAnimatingText?: boolean;\n $shouldHideCursor: TypewriterProps['shouldHideCursor'];\n}>;\n\nexport const StyledTypewriterPseudoText = styled.span<StyledTypewriterPseudoTextProps>`\n opacity: 0;\n pointer-events: none;\n user-select: none;\n width: fit-content;\n\n ${({ $isAnimatingText, $shouldHideCursor }) =>\n $isAnimatingText &&\n !$shouldHideCursor &&\n css`\n &:after {\n animation: ${blinkAnimation} 1s steps(2, start) infinite;\n color: inherit;\n content: '|';\n font-size: 25px;\n position: relative;\n line-height: 0;\n vertical-align: baseline;\n }\n `}\n`;\n\ntype StyledTypewriterTextProps = WithTheme<{\n $isAnimatingText?: boolean;\n}>;\n\nexport const StyledTypewriterText = styled.span<StyledTypewriterTextProps>`\n color: inherit;\n position: ${({ $isAnimatingText }) => ($isAnimatingText ? 'absolute' : 'relative')};\n width: fit-content;\n\n ${({ $isAnimatingText }) =>\n $isAnimatingText &&\n css`\n pointer-events: none;\n `}\n`;\n"],"mappings":"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","ignoreList":[]}
@@ -54,6 +54,7 @@ const Typewriter = _ref => {
54
54
  } = _ref;
55
55
  const [currentChildrenIndex, setCurrentChildrenIndex] = useState(0);
56
56
  const [hasRenderedChildrenOnce, setHasRenderedChildrenOnce] = useState(false);
57
+ const [shouldPreventBlinkingCursor, setShouldPreventBlinkingCursor] = useState(false);
57
58
  const functions = useFunctions();
58
59
  const values = useValues();
59
60
  useIsomorphicLayoutEffect(() => {
@@ -144,6 +145,9 @@ const Typewriter = _ref => {
144
145
  }, resetSpeed);
145
146
  } else {
146
147
  const setInterval = () => {
148
+ if (cursorType === CursorType.Thin) {
149
+ setShouldPreventBlinkingCursor(true);
150
+ }
147
151
  if (typeof onTypingAnimationStart === 'function') {
148
152
  onTypingAnimationStart();
149
153
  }
@@ -152,6 +156,9 @@ const Typewriter = _ref => {
152
156
  let nextState = Math.min(prevState + 1, charactersCount);
153
157
  if (nextState >= charactersCount && !shouldWaitForContent) {
154
158
  window.clearInterval(interval);
159
+ if (cursorType === CursorType.Thin) {
160
+ setShouldPreventBlinkingCursor(false);
161
+ }
155
162
  if (typeof onTypingAnimationEnd === 'function') {
156
163
  onTypingAnimationEnd();
157
164
  }
@@ -186,7 +193,7 @@ const Typewriter = _ref => {
186
193
  return () => {
187
194
  window.clearInterval(interval);
188
195
  };
189
- }, [resetSpeed, speed, resetDelay, childrenCount, charactersCount, textContent.length, shouldStopAnimation, shouldWaitForContent, isResetAnimationActive, shouldUseResetAnimation, areMultipleChildrenGiven, handleSetNextChildrenIndex, nextTextDelay, startDelay]);
196
+ }, [resetSpeed, speed, resetDelay, childrenCount, charactersCount, textContent.length, shouldStopAnimation, shouldWaitForContent, isResetAnimationActive, shouldUseResetAnimation, areMultipleChildrenGiven, handleSetNextChildrenIndex, nextTextDelay, startDelay, onResetAnimationStart, onResetAnimationEnd, onTypingAnimationStart, onTypingAnimationEnd, cursorType]);
190
197
  useEffect(() => {
191
198
  if (!isAnimatingText && typeof onFinish === 'function') {
192
199
  onFinish();
@@ -220,7 +227,8 @@ const Typewriter = _ref => {
220
227
  $cursorType: cursorType,
221
228
  onClick: isAnimatingText ? handleClick : undefined,
222
229
  $isAnimatingText: isAnimatingText,
223
- $shouldHideCursor: shouldHideCursor
230
+ $shouldHideCursor: shouldHideCursor,
231
+ $shouldPreventBlinkAnimation: shouldPreventBlinkingCursor
224
232
  }, isAnimatingText ? /*#__PURE__*/React.createElement(AnimatedTypewriterText, {
225
233
  shouldHideCursor: shouldHideCursor,
226
234
  shownText: shownText,
@@ -228,6 +236,8 @@ const Typewriter = _ref => {
228
236
  }) : /*#__PURE__*/React.createElement(StyledTypewriterText, {
229
237
  style: textStyle
230
238
  }, sortedChildren), isAnimatingText && /*#__PURE__*/React.createElement(StyledTypewriterPseudoText, {
239
+ $isAnimatingText: isAnimatingText,
240
+ $shouldHideCursor: shouldHideCursor,
231
241
  dangerouslySetInnerHTML: {
232
242
  __html: pseudoTextHTML
233
243
  }
@@ -236,7 +246,7 @@ const Typewriter = _ref => {
236
246
  position: 'absolute',
237
247
  visibility: 'hidden'
238
248
  }
239
- }, children), document.body)), [children, cursorType, handleClick, hasRenderedChildrenOnce, isAnimatingText, pseudoTextHTML, shouldHideCursor, shownText, sortedChildren, textStyle]);
249
+ }, children), document.body)), [children, cursorType, handleClick, hasRenderedChildrenOnce, isAnimatingText, pseudoTextHTML, shouldHideCursor, shouldPreventBlinkingCursor, shownText, sortedChildren, textStyle]);
240
250
  };
241
251
  Typewriter.displayName = 'Typewriter';
242
252
  export default Typewriter;
@@ -1 +1 @@
1
- {"version":3,"file":"Typewriter.js","names":["ColorSchemeProvider","ChaynsProvider","useFunctions","useValues","React","useCallback","useEffect","useLayoutEffect","useMemo","useState","createPortal","renderToString","CursorType","AnimatedTypewriterText","StyledTypewriter","StyledTypewriterPseudoText","StyledTypewriterText","getCharactersCount","getSubTextFromHTML","shuffleArray","useIsomorphicLayoutEffect","window","TypewriterDelay","TypewriterSpeed","Typewriter","_ref","children","cursorType","Default","nextTextDelay","Medium","onFinish","onResetAnimationEnd","onResetAnimationStart","onTypingAnimationEnd","onTypingAnimationStart","pseudoChildren","resetDelay","shouldForceCursorAnimation","shouldHideCursor","shouldSortChildrenRandomly","shouldUseAnimationHeight","shouldUseResetAnimation","shouldWaitForContent","speed","resetSpeed","startDelay","None","textStyle","currentChildrenIndex","setCurrentChildrenIndex","hasRenderedChildrenOnce","setHasRenderedChildrenOnce","functions","values","sortedChildren","Array","isArray","areMultipleChildrenGiven","childrenCount","length","textContent","currentChildren","isValidElement","createElement","data","isModule","color","colorMode","style","display","charactersCount","isResetAnimationActive","setIsResetAnimationActive","shownCharCount","setShownCharCount","shouldStopAnimation","setShouldStopAnimation","isAnimatingText","handleClick","event","stopPropagation","preventDefault","handleSetNextChildrenIndex","newIndex","interval","setInterval","prevState","nextState","clearInterval","setTimeout","Math","min","shownText","pseudoTextHTML","pseudoText","$cursorType","onClick","undefined","$isAnimatingText","$shouldHideCursor","dangerouslySetInnerHTML","__html","position","visibility","document","body","displayName"],"sources":["../../../../src/components/typewriter/Typewriter.tsx"],"sourcesContent":["import { ColorSchemeProvider } from '@chayns-components/core';\nimport { ChaynsProvider, useFunctions, useValues } from 'chayns-api';\nimport React, {\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { renderToString } from 'react-dom/server';\nimport { CursorType } from '../../types/cursor';\nimport AnimatedTypewriterText from './AnimatedTypewriterText';\nimport {\n StyledTypewriter,\n StyledTypewriterPseudoText,\n StyledTypewriterText,\n} from './Typewriter.styles';\nimport { getCharactersCount, getSubTextFromHTML, shuffleArray } from './utils';\n\nconst useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterDelay {\n ExtraSlow = 4000,\n Slow = 2000,\n Medium = 1000,\n Fast = 500,\n ExtraFast = 250,\n None = 0,\n}\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterSpeed {\n ExtraSlow = 40,\n Slow = 20,\n Medium = 10,\n Fast = 5,\n ExtraFast = 2.5,\n}\n\nexport type TypewriterProps = {\n /**\n * The text to type\n */\n children: ReactElement | ReactElement[] | string | string[];\n /**\n * The type of the cursor. Use the CursorType enum for this prop.\n */\n cursorType?: CursorType;\n /**\n * The delay in milliseconds before the next text is shown.\n * This prop is only used if multiple texts are given.\n */\n nextTextDelay?: TypewriterDelay;\n /**\n * Function that is executed when the typewriter animation has finished. This function will not\n * be executed if multiple texts are used.\n */\n onFinish?: VoidFunction;\n /**\n * Function that is executed when the reset animation has finished. This function will not be\n * executed if `shouldUseResetAnimation` is not set to `true`.\n */\n onResetAnimationEnd?: VoidFunction;\n /**\n * Function that is executed when the reset animation has started. This function will not be\n * executed if `shouldUseResetAnimation` is not set to `true`.\n */\n onResetAnimationStart?: VoidFunction;\n /**\n * Function that is executed when the typing animation has finished. If multiple texts are given,\n * this function will be executed for each text.\n */\n onTypingAnimationEnd?: VoidFunction;\n /**\n * Function that is executed when the typing animation has started. If multiple texts are given,\n * this function will be executed for each text.\n */\n onTypingAnimationStart?: VoidFunction;\n /**\n * Pseudo-element to be rendered invisible during animation to define the size of the element\n * for the typewriter effect. By default, the \"children\" is used for this purpose.\n */\n pseudoChildren?: ReactElement | string;\n /**\n * Waiting time in milliseconds before the typewriter resets the text.\n * This prop is only used if multiple texts are given.\n */\n resetDelay?: TypewriterDelay;\n /**\n * The reset speed of the animation. Use the TypewriterSpeed enum for this prop.\n */\n resetSpeed?: TypewriterSpeed | number;\n /**\n * Specifies whether the cursor should be forced to animate even if no text is currently animated.\n */\n shouldForceCursorAnimation?: boolean;\n /**\n * Specifies whether the cursor should be hidden\n */\n shouldHideCursor?: boolean;\n /**\n * Specifies whether the children should be sorted randomly if there are multiple texts.\n * This makes the typewriter start with a different text each time and also changes them\n * in a random order.\n */\n shouldSortChildrenRandomly?: boolean;\n /**\n * Specifies whether the animation should use its full height or the height of the current\n * chunk.\n */\n shouldUseAnimationHeight?: boolean;\n /**\n * Specifies whether the reset of the text should be animated with a backspace animation for\n * multiple texts.\n */\n shouldUseResetAnimation?: boolean;\n /**\n * Whether the typewriter should wait for new content\n */\n shouldWaitForContent?: boolean;\n /**\n * The speed of the animation. Use the TypewriterSpeed enum for this prop.\n */\n speed?: TypewriterSpeed | number;\n /**\n * The delay in milliseconds before the typewriter starts typing.\n */\n startDelay?: TypewriterDelay;\n /**\n * The style of the typewriter text element\n */\n textStyle?: React.CSSProperties;\n};\n\nconst Typewriter: FC<TypewriterProps> = ({\n children,\n cursorType = CursorType.Default,\n nextTextDelay = TypewriterDelay.Medium,\n onFinish,\n onResetAnimationEnd,\n onResetAnimationStart,\n onTypingAnimationEnd,\n onTypingAnimationStart,\n pseudoChildren,\n resetDelay = TypewriterDelay.Medium,\n shouldForceCursorAnimation = false,\n shouldHideCursor = false,\n shouldSortChildrenRandomly = false,\n shouldUseAnimationHeight = false,\n shouldUseResetAnimation = false,\n shouldWaitForContent,\n speed = TypewriterSpeed.Medium,\n resetSpeed = speed,\n startDelay = TypewriterDelay.None,\n textStyle,\n}) => {\n const [currentChildrenIndex, setCurrentChildrenIndex] = useState(0);\n const [hasRenderedChildrenOnce, setHasRenderedChildrenOnce] = useState(false);\n\n const functions = useFunctions();\n const values = useValues();\n\n useIsomorphicLayoutEffect(() => {\n if (children) {\n setHasRenderedChildrenOnce(false);\n }\n }, [children]);\n\n useEffect(() => {\n if (!hasRenderedChildrenOnce) {\n setHasRenderedChildrenOnce(true);\n }\n }, [hasRenderedChildrenOnce]);\n\n const sortedChildren = useMemo(\n () =>\n Array.isArray(children) && shouldSortChildrenRandomly\n ? shuffleArray<ReactElement | string>(children)\n : children,\n [children, shouldSortChildrenRandomly],\n );\n\n const areMultipleChildrenGiven = Array.isArray(sortedChildren);\n const childrenCount = areMultipleChildrenGiven ? sortedChildren.length : 1;\n\n const textContent = useMemo(() => {\n if (areMultipleChildrenGiven) {\n const currentChildren = sortedChildren[currentChildrenIndex];\n\n if (currentChildren) {\n return React.isValidElement(currentChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {currentChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (currentChildren as string);\n }\n\n return '';\n }\n\n return React.isValidElement(sortedChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {sortedChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (sortedChildren as string);\n }, [areMultipleChildrenGiven, currentChildrenIndex, functions, sortedChildren, values]);\n\n const charactersCount = useMemo(() => getCharactersCount(textContent), [textContent]);\n\n const [isResetAnimationActive, setIsResetAnimationActive] = useState(false);\n const [shownCharCount, setShownCharCount] = useState(\n charactersCount > 0 ? 0 : textContent.length,\n );\n const [shouldStopAnimation, setShouldStopAnimation] = useState(false);\n\n const isAnimatingText =\n shownCharCount < textContent.length ||\n shouldForceCursorAnimation ||\n areMultipleChildrenGiven ||\n textContent.length === 0;\n\n const handleClick = useCallback((event: React.MouseEvent) => {\n event.stopPropagation();\n event.preventDefault();\n\n setShouldStopAnimation(true);\n }, []);\n\n const handleSetNextChildrenIndex = useCallback(\n () =>\n setCurrentChildrenIndex(() => {\n let newIndex = currentChildrenIndex + 1;\n\n if (newIndex > childrenCount - 1) {\n newIndex = 0;\n }\n\n return newIndex;\n }),\n [childrenCount, currentChildrenIndex],\n );\n\n useEffect(() => {\n let interval: number | undefined;\n\n if (shouldStopAnimation || charactersCount === 0) {\n setShownCharCount(textContent.length);\n } else if (isResetAnimationActive) {\n if (typeof onResetAnimationStart === 'function') {\n onResetAnimationStart();\n }\n\n interval = window.setInterval(() => {\n setShownCharCount((prevState) => {\n const nextState = prevState - 1;\n\n if (nextState === 0) {\n window.clearInterval(interval);\n\n if (typeof onResetAnimationEnd === 'function') {\n onResetAnimationEnd();\n }\n\n if (areMultipleChildrenGiven) {\n setTimeout(() => {\n setIsResetAnimationActive(false);\n handleSetNextChildrenIndex();\n }, nextTextDelay);\n }\n }\n\n return nextState;\n });\n }, resetSpeed);\n } else {\n const setInterval = () => {\n if (typeof onTypingAnimationStart === 'function') {\n onTypingAnimationStart();\n }\n\n interval = window.setInterval(() => {\n setShownCharCount((prevState) => {\n let nextState = Math.min(prevState + 1, charactersCount);\n\n if (nextState >= charactersCount && !shouldWaitForContent) {\n window.clearInterval(interval);\n\n if (typeof onTypingAnimationEnd === 'function') {\n onTypingAnimationEnd();\n }\n\n /**\n * At this point, the next value for \"shownCharCount\" is deliberately set to\n * the length of the textContent in order to correctly display HTML elements\n * after the last letter.\n */\n nextState = textContent.length;\n\n if (areMultipleChildrenGiven) {\n setTimeout(() => {\n if (shouldUseResetAnimation) {\n setIsResetAnimationActive(true);\n } else {\n setShownCharCount(0);\n setTimeout(handleSetNextChildrenIndex, nextTextDelay);\n }\n }, resetDelay);\n }\n }\n\n return nextState;\n });\n }, speed);\n };\n\n if (startDelay) {\n setTimeout(setInterval, startDelay);\n } else {\n setInterval();\n }\n }\n\n return () => {\n window.clearInterval(interval);\n };\n }, [\n resetSpeed,\n speed,\n resetDelay,\n childrenCount,\n charactersCount,\n textContent.length,\n shouldStopAnimation,\n shouldWaitForContent,\n isResetAnimationActive,\n shouldUseResetAnimation,\n areMultipleChildrenGiven,\n handleSetNextChildrenIndex,\n nextTextDelay,\n startDelay,\n ]);\n\n useEffect(() => {\n if (!isAnimatingText && typeof onFinish === 'function') {\n onFinish();\n }\n }, [isAnimatingText, onFinish]);\n\n const shownText = useMemo(\n () => getSubTextFromHTML(textContent, shownCharCount),\n [shownCharCount, textContent],\n );\n\n const pseudoTextHTML = useMemo(() => {\n if (pseudoChildren) {\n const pseudoText = React.isValidElement(pseudoChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {pseudoChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (pseudoChildren as string);\n\n if (shouldUseAnimationHeight) {\n return getSubTextFromHTML(pseudoText, shownCharCount);\n }\n\n return pseudoText;\n }\n\n if (shouldUseAnimationHeight && textContent) {\n return getSubTextFromHTML(textContent, shownCharCount);\n }\n\n return textContent || '&#8203;';\n }, [functions, pseudoChildren, shouldUseAnimationHeight, shownCharCount, textContent, values]);\n\n return useMemo(\n () => (\n <StyledTypewriter\n $cursorType={cursorType}\n onClick={isAnimatingText ? handleClick : undefined}\n $isAnimatingText={isAnimatingText}\n $shouldHideCursor={shouldHideCursor}\n >\n {isAnimatingText ? (\n <AnimatedTypewriterText\n shouldHideCursor={shouldHideCursor}\n shownText={shownText}\n textStyle={textStyle}\n />\n ) : (\n <StyledTypewriterText style={textStyle}>{sortedChildren}</StyledTypewriterText>\n )}\n {isAnimatingText && (\n <StyledTypewriterPseudoText\n dangerouslySetInnerHTML={{ __html: pseudoTextHTML }}\n />\n )}\n {/*\n The following is needed because some components like the CodeHighlighter will not render correct\n if the element is not rendered on client before...\n */}\n {!hasRenderedChildrenOnce &&\n createPortal(\n <div style={{ position: 'absolute', visibility: 'hidden' }}>\n {children}\n </div>,\n document.body,\n )}\n </StyledTypewriter>\n ),\n [\n children,\n cursorType,\n handleClick,\n hasRenderedChildrenOnce,\n isAnimatingText,\n pseudoTextHTML,\n shouldHideCursor,\n shownText,\n sortedChildren,\n textStyle,\n ],\n );\n};\n\nTypewriter.displayName = 'Typewriter';\n\nexport default Typewriter;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Typewriter.js","names":["ColorSchemeProvider","ChaynsProvider","useFunctions","useValues","React","useCallback","useEffect","useLayoutEffect","useMemo","useState","createPortal","renderToString","CursorType","AnimatedTypewriterText","StyledTypewriter","StyledTypewriterPseudoText","StyledTypewriterText","getCharactersCount","getSubTextFromHTML","shuffleArray","useIsomorphicLayoutEffect","window","TypewriterDelay","TypewriterSpeed","Typewriter","_ref","children","cursorType","Default","nextTextDelay","Medium","onFinish","onResetAnimationEnd","onResetAnimationStart","onTypingAnimationEnd","onTypingAnimationStart","pseudoChildren","resetDelay","shouldForceCursorAnimation","shouldHideCursor","shouldSortChildrenRandomly","shouldUseAnimationHeight","shouldUseResetAnimation","shouldWaitForContent","speed","resetSpeed","startDelay","None","textStyle","currentChildrenIndex","setCurrentChildrenIndex","hasRenderedChildrenOnce","setHasRenderedChildrenOnce","shouldPreventBlinkingCursor","setShouldPreventBlinkingCursor","functions","values","sortedChildren","Array","isArray","areMultipleChildrenGiven","childrenCount","length","textContent","currentChildren","isValidElement","createElement","data","isModule","color","colorMode","style","display","charactersCount","isResetAnimationActive","setIsResetAnimationActive","shownCharCount","setShownCharCount","shouldStopAnimation","setShouldStopAnimation","isAnimatingText","handleClick","event","stopPropagation","preventDefault","handleSetNextChildrenIndex","newIndex","interval","setInterval","prevState","nextState","clearInterval","setTimeout","Thin","Math","min","shownText","pseudoTextHTML","pseudoText","$cursorType","onClick","undefined","$isAnimatingText","$shouldHideCursor","$shouldPreventBlinkAnimation","dangerouslySetInnerHTML","__html","position","visibility","document","body","displayName"],"sources":["../../../../src/components/typewriter/Typewriter.tsx"],"sourcesContent":["import { ColorSchemeProvider } from '@chayns-components/core';\nimport { ChaynsProvider, useFunctions, useValues } from 'chayns-api';\nimport React, {\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { renderToString } from 'react-dom/server';\nimport { CursorType } from '../../types/cursor';\nimport AnimatedTypewriterText from './AnimatedTypewriterText';\nimport {\n StyledTypewriter,\n StyledTypewriterPseudoText,\n StyledTypewriterText,\n} from './Typewriter.styles';\nimport { getCharactersCount, getSubTextFromHTML, shuffleArray } from './utils';\n\nconst useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterDelay {\n ExtraSlow = 4000,\n Slow = 2000,\n Medium = 1000,\n Fast = 500,\n ExtraFast = 250,\n None = 0,\n}\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterSpeed {\n ExtraSlow = 40,\n Slow = 20,\n Medium = 10,\n Fast = 5,\n ExtraFast = 2.5,\n}\n\nexport type TypewriterProps = {\n /**\n * The text to type\n */\n children: ReactElement | ReactElement[] | string | string[];\n /**\n * The type of the cursor. Use the CursorType enum for this prop.\n */\n cursorType?: CursorType;\n /**\n * The delay in milliseconds before the next text is shown.\n * This prop is only used if multiple texts are given.\n */\n nextTextDelay?: TypewriterDelay;\n /**\n * Function that is executed when the typewriter animation has finished. This function will not\n * be executed if multiple texts are used.\n */\n onFinish?: VoidFunction;\n /**\n * Function that is executed when the reset animation has finished. This function will not be\n * executed if `shouldUseResetAnimation` is not set to `true`.\n */\n onResetAnimationEnd?: VoidFunction;\n /**\n * Function that is executed when the reset animation has started. This function will not be\n * executed if `shouldUseResetAnimation` is not set to `true`.\n */\n onResetAnimationStart?: VoidFunction;\n /**\n * Function that is executed when the typing animation has finished. If multiple texts are given,\n * this function will be executed for each text.\n */\n onTypingAnimationEnd?: VoidFunction;\n /**\n * Function that is executed when the typing animation has started. If multiple texts are given,\n * this function will be executed for each text.\n */\n onTypingAnimationStart?: VoidFunction;\n /**\n * Pseudo-element to be rendered invisible during animation to define the size of the element\n * for the typewriter effect. By default, the \"children\" is used for this purpose.\n */\n pseudoChildren?: ReactElement | string;\n /**\n * Waiting time in milliseconds before the typewriter resets the text.\n * This prop is only used if multiple texts are given.\n */\n resetDelay?: TypewriterDelay;\n /**\n * The reset speed of the animation. Use the TypewriterSpeed enum for this prop.\n */\n resetSpeed?: TypewriterSpeed | number;\n /**\n * Specifies whether the cursor should be forced to animate even if no text is currently animated.\n */\n shouldForceCursorAnimation?: boolean;\n /**\n * Specifies whether the cursor should be hidden\n */\n shouldHideCursor?: boolean;\n /**\n * Specifies whether the children should be sorted randomly if there are multiple texts.\n * This makes the typewriter start with a different text each time and also changes them\n * in a random order.\n */\n shouldSortChildrenRandomly?: boolean;\n /**\n * Specifies whether the animation should use its full height or the height of the current\n * chunk.\n */\n shouldUseAnimationHeight?: boolean;\n /**\n * Specifies whether the reset of the text should be animated with a backspace animation for\n * multiple texts.\n */\n shouldUseResetAnimation?: boolean;\n /**\n * Whether the typewriter should wait for new content\n */\n shouldWaitForContent?: boolean;\n /**\n * The speed of the animation. Use the TypewriterSpeed enum for this prop.\n */\n speed?: TypewriterSpeed | number;\n /**\n * The delay in milliseconds before the typewriter starts typing.\n */\n startDelay?: TypewriterDelay;\n /**\n * The style of the typewriter text element\n */\n textStyle?: React.CSSProperties;\n};\n\nconst Typewriter: FC<TypewriterProps> = ({\n children,\n cursorType = CursorType.Default,\n nextTextDelay = TypewriterDelay.Medium,\n onFinish,\n onResetAnimationEnd,\n onResetAnimationStart,\n onTypingAnimationEnd,\n onTypingAnimationStart,\n pseudoChildren,\n resetDelay = TypewriterDelay.Medium,\n shouldForceCursorAnimation = false,\n shouldHideCursor = false,\n shouldSortChildrenRandomly = false,\n shouldUseAnimationHeight = false,\n shouldUseResetAnimation = false,\n shouldWaitForContent,\n speed = TypewriterSpeed.Medium,\n resetSpeed = speed,\n startDelay = TypewriterDelay.None,\n textStyle,\n}) => {\n const [currentChildrenIndex, setCurrentChildrenIndex] = useState(0);\n const [hasRenderedChildrenOnce, setHasRenderedChildrenOnce] = useState(false);\n const [shouldPreventBlinkingCursor, setShouldPreventBlinkingCursor] = useState(false);\n\n const functions = useFunctions();\n const values = useValues();\n\n useIsomorphicLayoutEffect(() => {\n if (children) {\n setHasRenderedChildrenOnce(false);\n }\n }, [children]);\n\n useEffect(() => {\n if (!hasRenderedChildrenOnce) {\n setHasRenderedChildrenOnce(true);\n }\n }, [hasRenderedChildrenOnce]);\n\n const sortedChildren = useMemo(\n () =>\n Array.isArray(children) && shouldSortChildrenRandomly\n ? shuffleArray<ReactElement | string>(children)\n : children,\n [children, shouldSortChildrenRandomly],\n );\n\n const areMultipleChildrenGiven = Array.isArray(sortedChildren);\n const childrenCount = areMultipleChildrenGiven ? sortedChildren.length : 1;\n\n const textContent = useMemo(() => {\n if (areMultipleChildrenGiven) {\n const currentChildren = sortedChildren[currentChildrenIndex];\n\n if (currentChildren) {\n return React.isValidElement(currentChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {currentChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (currentChildren as string);\n }\n\n return '';\n }\n\n return React.isValidElement(sortedChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {sortedChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (sortedChildren as string);\n }, [areMultipleChildrenGiven, currentChildrenIndex, functions, sortedChildren, values]);\n\n const charactersCount = useMemo(() => getCharactersCount(textContent), [textContent]);\n\n const [isResetAnimationActive, setIsResetAnimationActive] = useState(false);\n const [shownCharCount, setShownCharCount] = useState(\n charactersCount > 0 ? 0 : textContent.length,\n );\n const [shouldStopAnimation, setShouldStopAnimation] = useState(false);\n\n const isAnimatingText =\n shownCharCount < textContent.length ||\n shouldForceCursorAnimation ||\n areMultipleChildrenGiven ||\n textContent.length === 0;\n\n const handleClick = useCallback((event: React.MouseEvent) => {\n event.stopPropagation();\n event.preventDefault();\n\n setShouldStopAnimation(true);\n }, []);\n\n const handleSetNextChildrenIndex = useCallback(\n () =>\n setCurrentChildrenIndex(() => {\n let newIndex = currentChildrenIndex + 1;\n\n if (newIndex > childrenCount - 1) {\n newIndex = 0;\n }\n\n return newIndex;\n }),\n [childrenCount, currentChildrenIndex],\n );\n\n useEffect(() => {\n let interval: number | undefined;\n\n if (shouldStopAnimation || charactersCount === 0) {\n setShownCharCount(textContent.length);\n } else if (isResetAnimationActive) {\n if (typeof onResetAnimationStart === 'function') {\n onResetAnimationStart();\n }\n\n interval = window.setInterval(() => {\n setShownCharCount((prevState) => {\n const nextState = prevState - 1;\n\n if (nextState === 0) {\n window.clearInterval(interval);\n\n if (typeof onResetAnimationEnd === 'function') {\n onResetAnimationEnd();\n }\n\n if (areMultipleChildrenGiven) {\n setTimeout(() => {\n setIsResetAnimationActive(false);\n handleSetNextChildrenIndex();\n }, nextTextDelay);\n }\n }\n\n return nextState;\n });\n }, resetSpeed);\n } else {\n const setInterval = () => {\n if (cursorType === CursorType.Thin) {\n setShouldPreventBlinkingCursor(true);\n }\n\n if (typeof onTypingAnimationStart === 'function') {\n onTypingAnimationStart();\n }\n\n interval = window.setInterval(() => {\n setShownCharCount((prevState) => {\n let nextState = Math.min(prevState + 1, charactersCount);\n\n if (nextState >= charactersCount && !shouldWaitForContent) {\n window.clearInterval(interval);\n\n if (cursorType === CursorType.Thin) {\n setShouldPreventBlinkingCursor(false);\n }\n\n if (typeof onTypingAnimationEnd === 'function') {\n onTypingAnimationEnd();\n }\n\n /**\n * At this point, the next value for \"shownCharCount\" is deliberately set to\n * the length of the textContent in order to correctly display HTML elements\n * after the last letter.\n */\n nextState = textContent.length;\n\n if (areMultipleChildrenGiven) {\n setTimeout(() => {\n if (shouldUseResetAnimation) {\n setIsResetAnimationActive(true);\n } else {\n setShownCharCount(0);\n setTimeout(handleSetNextChildrenIndex, nextTextDelay);\n }\n }, resetDelay);\n }\n }\n\n return nextState;\n });\n }, speed);\n };\n\n if (startDelay) {\n setTimeout(setInterval, startDelay);\n } else {\n setInterval();\n }\n }\n\n return () => {\n window.clearInterval(interval);\n };\n }, [\n resetSpeed,\n speed,\n resetDelay,\n childrenCount,\n charactersCount,\n textContent.length,\n shouldStopAnimation,\n shouldWaitForContent,\n isResetAnimationActive,\n shouldUseResetAnimation,\n areMultipleChildrenGiven,\n handleSetNextChildrenIndex,\n nextTextDelay,\n startDelay,\n onResetAnimationStart,\n onResetAnimationEnd,\n onTypingAnimationStart,\n onTypingAnimationEnd,\n cursorType,\n ]);\n\n useEffect(() => {\n if (!isAnimatingText && typeof onFinish === 'function') {\n onFinish();\n }\n }, [isAnimatingText, onFinish]);\n\n const shownText = useMemo(\n () => getSubTextFromHTML(textContent, shownCharCount),\n [shownCharCount, textContent],\n );\n\n const pseudoTextHTML = useMemo(() => {\n if (pseudoChildren) {\n const pseudoText = React.isValidElement(pseudoChildren)\n ? renderToString(\n <ChaynsProvider data={values} functions={functions} isModule>\n <ColorSchemeProvider\n color=\"#005EB8\"\n colorMode={0}\n style={{ display: 'inline' }}\n >\n {pseudoChildren}\n </ColorSchemeProvider>\n </ChaynsProvider>,\n )\n : (pseudoChildren as string);\n\n if (shouldUseAnimationHeight) {\n return getSubTextFromHTML(pseudoText, shownCharCount);\n }\n\n return pseudoText;\n }\n\n if (shouldUseAnimationHeight && textContent) {\n return getSubTextFromHTML(textContent, shownCharCount);\n }\n\n return textContent || '&#8203;';\n }, [functions, pseudoChildren, shouldUseAnimationHeight, shownCharCount, textContent, values]);\n\n return useMemo(\n () => (\n <StyledTypewriter\n $cursorType={cursorType}\n onClick={isAnimatingText ? handleClick : undefined}\n $isAnimatingText={isAnimatingText}\n $shouldHideCursor={shouldHideCursor}\n $shouldPreventBlinkAnimation={shouldPreventBlinkingCursor}\n >\n {isAnimatingText ? (\n <AnimatedTypewriterText\n shouldHideCursor={shouldHideCursor}\n shownText={shownText}\n textStyle={textStyle}\n />\n ) : (\n <StyledTypewriterText style={textStyle}>{sortedChildren}</StyledTypewriterText>\n )}\n {isAnimatingText && (\n <StyledTypewriterPseudoText\n $isAnimatingText={isAnimatingText}\n $shouldHideCursor={shouldHideCursor}\n dangerouslySetInnerHTML={{ __html: pseudoTextHTML }}\n />\n )}\n {/*\n The following is needed because some components like the CodeHighlighter will not render correct\n if the element is not rendered on client before...\n */}\n {!hasRenderedChildrenOnce &&\n createPortal(\n <div style={{ position: 'absolute', visibility: 'hidden' }}>\n {children}\n </div>,\n document.body,\n )}\n </StyledTypewriter>\n ),\n [\n children,\n cursorType,\n handleClick,\n hasRenderedChildrenOnce,\n isAnimatingText,\n pseudoTextHTML,\n shouldHideCursor,\n shouldPreventBlinkingCursor,\n shownText,\n sortedChildren,\n textStyle,\n ],\n );\n};\n\nTypewriter.displayName = 'Typewriter';\n\nexport default Typewriter;\n"],"mappings":"AAAA,SAASA,mBAAmB,QAAQ,yBAAyB;AAC7D,SAASC,cAAc,EAAEC,YAAY,EAAEC,SAAS,QAAQ,YAAY;AACpE,OAAOC,KAAK,IAGRC,WAAW,EACXC,SAAS,EACTC,eAAe,EACfC,OAAO,EACPC,QAAQ,QACL,OAAO;AACd,SAASC,YAAY,QAAQ,WAAW;AACxC,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,UAAU,QAAQ,oBAAoB;AAC/C,OAAOC,sBAAsB,MAAM,0BAA0B;AAC7D,SACIC,gBAAgB,EAChBC,0BAA0B,EAC1BC,oBAAoB,QACjB,qBAAqB;AAC5B,SAASC,kBAAkB,EAAEC,kBAAkB,EAAEC,YAAY,QAAQ,SAAS;AAE9E,MAAMC,yBAAyB,GAAG,OAAOC,MAAM,KAAK,WAAW,GAAGd,eAAe,GAAGD,SAAS;;AAE7F;AACA,WAAYgB,eAAe,0BAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;;AAS3B;AACA,WAAYC,eAAe,0BAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAfA,eAAe,CAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAuG3B,MAAMC,UAA+B,GAAGC,IAAA,IAqBlC;EAAA,IArBmC;IACrCC,QAAQ;IACRC,UAAU,GAAGf,UAAU,CAACgB,OAAO;IAC/BC,aAAa,GAAGP,eAAe,CAACQ,MAAM;IACtCC,QAAQ;IACRC,mBAAmB;IACnBC,qBAAqB;IACrBC,oBAAoB;IACpBC,sBAAsB;IACtBC,cAAc;IACdC,UAAU,GAAGf,eAAe,CAACQ,MAAM;IACnCQ,0BAA0B,GAAG,KAAK;IAClCC,gBAAgB,GAAG,KAAK;IACxBC,0BAA0B,GAAG,KAAK;IAClCC,wBAAwB,GAAG,KAAK;IAChCC,uBAAuB,GAAG,KAAK;IAC/BC,oBAAoB;IACpBC,KAAK,GAAGrB,eAAe,CAACO,MAAM;IAC9Be,UAAU,GAAGD,KAAK;IAClBE,UAAU,GAAGxB,eAAe,CAACyB,IAAI;IACjCC;EACJ,CAAC,GAAAvB,IAAA;EACG,MAAM,CAACwB,oBAAoB,EAAEC,uBAAuB,CAAC,GAAGzC,QAAQ,CAAC,CAAC,CAAC;EACnE,MAAM,CAAC0C,uBAAuB,EAAEC,0BAA0B,CAAC,GAAG3C,QAAQ,CAAC,KAAK,CAAC;EAC7E,MAAM,CAAC4C,2BAA2B,EAAEC,8BAA8B,CAAC,GAAG7C,QAAQ,CAAC,KAAK,CAAC;EAErF,MAAM8C,SAAS,GAAGrD,YAAY,CAAC,CAAC;EAChC,MAAMsD,MAAM,GAAGrD,SAAS,CAAC,CAAC;EAE1BiB,yBAAyB,CAAC,MAAM;IAC5B,IAAIM,QAAQ,EAAE;MACV0B,0BAA0B,CAAC,KAAK,CAAC;IACrC;EACJ,CAAC,EAAE,CAAC1B,QAAQ,CAAC,CAAC;EAEdpB,SAAS,CAAC,MAAM;IACZ,IAAI,CAAC6C,uBAAuB,EAAE;MAC1BC,0BAA0B,CAAC,IAAI,CAAC;IACpC;EACJ,CAAC,EAAE,CAACD,uBAAuB,CAAC,CAAC;EAE7B,MAAMM,cAAc,GAAGjD,OAAO,CAC1B,MACIkD,KAAK,CAACC,OAAO,CAACjC,QAAQ,CAAC,IAAIc,0BAA0B,GAC/CrB,YAAY,CAAwBO,QAAQ,CAAC,GAC7CA,QAAQ,EAClB,CAACA,QAAQ,EAAEc,0BAA0B,CACzC,CAAC;EAED,MAAMoB,wBAAwB,GAAGF,KAAK,CAACC,OAAO,CAACF,cAAc,CAAC;EAC9D,MAAMI,aAAa,GAAGD,wBAAwB,GAAGH,cAAc,CAACK,MAAM,GAAG,CAAC;EAE1E,MAAMC,WAAW,GAAGvD,OAAO,CAAC,MAAM;IAC9B,IAAIoD,wBAAwB,EAAE;MAC1B,MAAMI,eAAe,GAAGP,cAAc,CAACR,oBAAoB,CAAC;MAE5D,IAAIe,eAAe,EAAE;QACjB,OAAO,aAAA5D,KAAK,CAAC6D,cAAc,CAACD,eAAe,CAAC,GACtCrD,cAAc,cACVP,KAAA,CAAA8D,aAAA,CAACjE,cAAc;UAACkE,IAAI,EAAEX,MAAO;UAACD,SAAS,EAAEA,SAAU;UAACa,QAAQ;QAAA,gBACxDhE,KAAA,CAAA8D,aAAA,CAAClE,mBAAmB;UAChBqE,KAAK,EAAC,SAAS;UACfC,SAAS,EAAE,CAAE;UACbC,KAAK,EAAE;YAAEC,OAAO,EAAE;UAAS;QAAE,GAE5BR,eACgB,CACT,CACpB,CAAC,GACAA,eAA0B;MACrC;MAEA,OAAO,EAAE;IACb;IAEA,OAAO,aAAA5D,KAAK,CAAC6D,cAAc,CAACR,cAAc,CAAC,GACrC9C,cAAc,cACVP,KAAA,CAAA8D,aAAA,CAACjE,cAAc;MAACkE,IAAI,EAAEX,MAAO;MAACD,SAAS,EAAEA,SAAU;MAACa,QAAQ;IAAA,gBACxDhE,KAAA,CAAA8D,aAAA,CAAClE,mBAAmB;MAChBqE,KAAK,EAAC,SAAS;MACfC,SAAS,EAAE,CAAE;MACbC,KAAK,EAAE;QAAEC,OAAO,EAAE;MAAS;IAAE,GAE5Bf,cACgB,CACT,CACpB,CAAC,GACAA,cAAyB;EACpC,CAAC,EAAE,CAACG,wBAAwB,EAAEX,oBAAoB,EAAEM,SAAS,EAAEE,cAAc,EAAED,MAAM,CAAC,CAAC;EAEvF,MAAMiB,eAAe,GAAGjE,OAAO,CAAC,MAAMS,kBAAkB,CAAC8C,WAAW,CAAC,EAAE,CAACA,WAAW,CAAC,CAAC;EAErF,MAAM,CAACW,sBAAsB,EAAEC,yBAAyB,CAAC,GAAGlE,QAAQ,CAAC,KAAK,CAAC;EAC3E,MAAM,CAACmE,cAAc,EAAEC,iBAAiB,CAAC,GAAGpE,QAAQ,CAChDgE,eAAe,GAAG,CAAC,GAAG,CAAC,GAAGV,WAAW,CAACD,MAC1C,CAAC;EACD,MAAM,CAACgB,mBAAmB,EAAEC,sBAAsB,CAAC,GAAGtE,QAAQ,CAAC,KAAK,CAAC;EAErE,MAAMuE,eAAe,GACjBJ,cAAc,GAAGb,WAAW,CAACD,MAAM,IACnCxB,0BAA0B,IAC1BsB,wBAAwB,IACxBG,WAAW,CAACD,MAAM,KAAK,CAAC;EAE5B,MAAMmB,WAAW,GAAG5E,WAAW,CAAE6E,KAAuB,IAAK;IACzDA,KAAK,CAACC,eAAe,CAAC,CAAC;IACvBD,KAAK,CAACE,cAAc,CAAC,CAAC;IAEtBL,sBAAsB,CAAC,IAAI,CAAC;EAChC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMM,0BAA0B,GAAGhF,WAAW,CAC1C,MACI6C,uBAAuB,CAAC,MAAM;IAC1B,IAAIoC,QAAQ,GAAGrC,oBAAoB,GAAG,CAAC;IAEvC,IAAIqC,QAAQ,GAAGzB,aAAa,GAAG,CAAC,EAAE;MAC9ByB,QAAQ,GAAG,CAAC;IAChB;IAEA,OAAOA,QAAQ;EACnB,CAAC,CAAC,EACN,CAACzB,aAAa,EAAEZ,oBAAoB,CACxC,CAAC;EAED3C,SAAS,CAAC,MAAM;IACZ,IAAIiF,QAA4B;IAEhC,IAAIT,mBAAmB,IAAIL,eAAe,KAAK,CAAC,EAAE;MAC9CI,iBAAiB,CAACd,WAAW,CAACD,MAAM,CAAC;IACzC,CAAC,MAAM,IAAIY,sBAAsB,EAAE;MAC/B,IAAI,OAAOzC,qBAAqB,KAAK,UAAU,EAAE;QAC7CA,qBAAqB,CAAC,CAAC;MAC3B;MAEAsD,QAAQ,GAAGlE,MAAM,CAACmE,WAAW,CAAC,MAAM;QAChCX,iBAAiB,CAAEY,SAAS,IAAK;UAC7B,MAAMC,SAAS,GAAGD,SAAS,GAAG,CAAC;UAE/B,IAAIC,SAAS,KAAK,CAAC,EAAE;YACjBrE,MAAM,CAACsE,aAAa,CAACJ,QAAQ,CAAC;YAE9B,IAAI,OAAOvD,mBAAmB,KAAK,UAAU,EAAE;cAC3CA,mBAAmB,CAAC,CAAC;YACzB;YAEA,IAAI4B,wBAAwB,EAAE;cAC1BgC,UAAU,CAAC,MAAM;gBACbjB,yBAAyB,CAAC,KAAK,CAAC;gBAChCU,0BAA0B,CAAC,CAAC;cAChC,CAAC,EAAExD,aAAa,CAAC;YACrB;UACJ;UAEA,OAAO6D,SAAS;QACpB,CAAC,CAAC;MACN,CAAC,EAAE7C,UAAU,CAAC;IAClB,CAAC,MAAM;MACH,MAAM2C,WAAW,GAAGA,CAAA,KAAM;QACtB,IAAI7D,UAAU,KAAKf,UAAU,CAACiF,IAAI,EAAE;UAChCvC,8BAA8B,CAAC,IAAI,CAAC;QACxC;QAEA,IAAI,OAAOnB,sBAAsB,KAAK,UAAU,EAAE;UAC9CA,sBAAsB,CAAC,CAAC;QAC5B;QAEAoD,QAAQ,GAAGlE,MAAM,CAACmE,WAAW,CAAC,MAAM;UAChCX,iBAAiB,CAAEY,SAAS,IAAK;YAC7B,IAAIC,SAAS,GAAGI,IAAI,CAACC,GAAG,CAACN,SAAS,GAAG,CAAC,EAAEhB,eAAe,CAAC;YAExD,IAAIiB,SAAS,IAAIjB,eAAe,IAAI,CAAC9B,oBAAoB,EAAE;cACvDtB,MAAM,CAACsE,aAAa,CAACJ,QAAQ,CAAC;cAE9B,IAAI5D,UAAU,KAAKf,UAAU,CAACiF,IAAI,EAAE;gBAChCvC,8BAA8B,CAAC,KAAK,CAAC;cACzC;cAEA,IAAI,OAAOpB,oBAAoB,KAAK,UAAU,EAAE;gBAC5CA,oBAAoB,CAAC,CAAC;cAC1B;;cAEA;AAC5B;AACA;AACA;AACA;cAC4BwD,SAAS,GAAG3B,WAAW,CAACD,MAAM;cAE9B,IAAIF,wBAAwB,EAAE;gBAC1BgC,UAAU,CAAC,MAAM;kBACb,IAAIlD,uBAAuB,EAAE;oBACzBiC,yBAAyB,CAAC,IAAI,CAAC;kBACnC,CAAC,MAAM;oBACHE,iBAAiB,CAAC,CAAC,CAAC;oBACpBe,UAAU,CAACP,0BAA0B,EAAExD,aAAa,CAAC;kBACzD;gBACJ,CAAC,EAAEQ,UAAU,CAAC;cAClB;YACJ;YAEA,OAAOqD,SAAS;UACpB,CAAC,CAAC;QACN,CAAC,EAAE9C,KAAK,CAAC;MACb,CAAC;MAED,IAAIE,UAAU,EAAE;QACZ8C,UAAU,CAACJ,WAAW,EAAE1C,UAAU,CAAC;MACvC,CAAC,MAAM;QACH0C,WAAW,CAAC,CAAC;MACjB;IACJ;IAEA,OAAO,MAAM;MACTnE,MAAM,CAACsE,aAAa,CAACJ,QAAQ,CAAC;IAClC,CAAC;EACL,CAAC,EAAE,CACC1C,UAAU,EACVD,KAAK,EACLP,UAAU,EACVwB,aAAa,EACbY,eAAe,EACfV,WAAW,CAACD,MAAM,EAClBgB,mBAAmB,EACnBnC,oBAAoB,EACpB+B,sBAAsB,EACtBhC,uBAAuB,EACvBkB,wBAAwB,EACxByB,0BAA0B,EAC1BxD,aAAa,EACbiB,UAAU,EACVb,qBAAqB,EACrBD,mBAAmB,EACnBG,sBAAsB,EACtBD,oBAAoB,EACpBP,UAAU,CACb,CAAC;EAEFrB,SAAS,CAAC,MAAM;IACZ,IAAI,CAAC0E,eAAe,IAAI,OAAOjD,QAAQ,KAAK,UAAU,EAAE;MACpDA,QAAQ,CAAC,CAAC;IACd;EACJ,CAAC,EAAE,CAACiD,eAAe,EAAEjD,QAAQ,CAAC,CAAC;EAE/B,MAAMiE,SAAS,GAAGxF,OAAO,CACrB,MAAMU,kBAAkB,CAAC6C,WAAW,EAAEa,cAAc,CAAC,EACrD,CAACA,cAAc,EAAEb,WAAW,CAChC,CAAC;EAED,MAAMkC,cAAc,GAAGzF,OAAO,CAAC,MAAM;IACjC,IAAI4B,cAAc,EAAE;MAChB,MAAM8D,UAAU,GAAG,aAAA9F,KAAK,CAAC6D,cAAc,CAAC7B,cAAc,CAAC,GACjDzB,cAAc,cACVP,KAAA,CAAA8D,aAAA,CAACjE,cAAc;QAACkE,IAAI,EAAEX,MAAO;QAACD,SAAS,EAAEA,SAAU;QAACa,QAAQ;MAAA,gBACxDhE,KAAA,CAAA8D,aAAA,CAAClE,mBAAmB;QAChBqE,KAAK,EAAC,SAAS;QACfC,SAAS,EAAE,CAAE;QACbC,KAAK,EAAE;UAAEC,OAAO,EAAE;QAAS;MAAE,GAE5BpC,cACgB,CACT,CACpB,CAAC,GACAA,cAAyB;MAEhC,IAAIK,wBAAwB,EAAE;QAC1B,OAAOvB,kBAAkB,CAACgF,UAAU,EAAEtB,cAAc,CAAC;MACzD;MAEA,OAAOsB,UAAU;IACrB;IAEA,IAAIzD,wBAAwB,IAAIsB,WAAW,EAAE;MACzC,OAAO7C,kBAAkB,CAAC6C,WAAW,EAAEa,cAAc,CAAC;IAC1D;IAEA,OAAOb,WAAW,IAAI,SAAS;EACnC,CAAC,EAAE,CAACR,SAAS,EAAEnB,cAAc,EAAEK,wBAAwB,EAAEmC,cAAc,EAAEb,WAAW,EAAEP,MAAM,CAAC,CAAC;EAE9F,OAAOhD,OAAO,CACV,mBACIJ,KAAA,CAAA8D,aAAA,CAACpD,gBAAgB;IACbqF,WAAW,EAAExE,UAAW;IACxByE,OAAO,EAAEpB,eAAe,GAAGC,WAAW,GAAGoB,SAAU;IACnDC,gBAAgB,EAAEtB,eAAgB;IAClCuB,iBAAiB,EAAEhE,gBAAiB;IACpCiE,4BAA4B,EAAEnD;EAA4B,GAEzD2B,eAAe,gBACZ5E,KAAA,CAAA8D,aAAA,CAACrD,sBAAsB;IACnB0B,gBAAgB,EAAEA,gBAAiB;IACnCyD,SAAS,EAAEA,SAAU;IACrBhD,SAAS,EAAEA;EAAU,CACxB,CAAC,gBAEF5C,KAAA,CAAA8D,aAAA,CAAClD,oBAAoB;IAACuD,KAAK,EAAEvB;EAAU,GAAES,cAAqC,CACjF,EACAuB,eAAe,iBACZ5E,KAAA,CAAA8D,aAAA,CAACnD,0BAA0B;IACvBuF,gBAAgB,EAAEtB,eAAgB;IAClCuB,iBAAiB,EAAEhE,gBAAiB;IACpCkE,uBAAuB,EAAE;MAAEC,MAAM,EAAET;IAAe;EAAE,CACvD,CACJ,EAKA,CAAC9C,uBAAuB,iBACrBzC,YAAY,cACRN,KAAA,CAAA8D,aAAA;IAAKK,KAAK,EAAE;MAAEoC,QAAQ,EAAE,UAAU;MAAEC,UAAU,EAAE;IAAS;EAAE,GACtDlF,QACA,CAAC,EACNmF,QAAQ,CAACC,IACb,CACU,CACrB,EACD,CACIpF,QAAQ,EACRC,UAAU,EACVsD,WAAW,EACX9B,uBAAuB,EACvB6B,eAAe,EACfiB,cAAc,EACd1D,gBAAgB,EAChBc,2BAA2B,EAC3B2C,SAAS,EACTvC,cAAc,EACdT,SAAS,CAEjB,CAAC;AACL,CAAC;AAEDxB,UAAU,CAACuF,WAAW,GAAG,YAAY;AAErC,eAAevF,UAAU","ignoreList":[]}
@@ -4,7 +4,8 @@ const typewriterCursorElement = _ref => {
4
4
  let {
5
5
  $cursorType,
6
6
  $isAnimatingText,
7
- $shouldHideCursor
7
+ $shouldHideCursor,
8
+ $shouldPreventBlinkAnimation
8
9
  } = _ref;
9
10
  if (!$isAnimatingText || $shouldHideCursor) {
10
11
  return '';
@@ -13,7 +14,7 @@ const typewriterCursorElement = _ref => {
13
14
  return css`
14
15
  .typewriter-lastWithContent {
15
16
  &:after {
16
- animation: ${blinkAnimation} 1s steps(2, start) infinite;
17
+ animation: ${$shouldPreventBlinkAnimation ? 'none' : blinkAnimation} 1s steps(2, start) infinite;
17
18
  color: inherit;
18
19
  content: '|';
19
20
  font-size: 25px;
@@ -58,22 +59,40 @@ export const StyledTypewriterPseudoText = styled.span`
58
59
  opacity: 0;
59
60
  pointer-events: none;
60
61
  user-select: none;
61
- width: 100%;
62
+ width: fit-content;
63
+
64
+ ${_ref3 => {
65
+ let {
66
+ $isAnimatingText,
67
+ $shouldHideCursor
68
+ } = _ref3;
69
+ return $isAnimatingText && !$shouldHideCursor && css`
70
+ &:after {
71
+ animation: ${blinkAnimation} 1s steps(2, start) infinite;
72
+ color: inherit;
73
+ content: '|';
74
+ font-size: 25px;
75
+ position: relative;
76
+ line-height: 0;
77
+ vertical-align: baseline;
78
+ }
79
+ `;
80
+ }}
62
81
  `;
63
82
  export const StyledTypewriterText = styled.span`
64
83
  color: inherit;
65
- position: ${_ref3 => {
84
+ position: ${_ref4 => {
66
85
  let {
67
86
  $isAnimatingText
68
- } = _ref3;
87
+ } = _ref4;
69
88
  return $isAnimatingText ? 'absolute' : 'relative';
70
89
  }};
71
- width: 100%;
90
+ width: fit-content;
72
91
 
73
- ${_ref4 => {
92
+ ${_ref5 => {
74
93
  let {
75
94
  $isAnimatingText
76
- } = _ref4;
95
+ } = _ref5;
77
96
  return $isAnimatingText && css`
78
97
  pointer-events: none;
79
98
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"Typewriter.styles.js","names":["styled","css","keyframes","CursorType","typewriterCursorElement","_ref","$cursorType","$isAnimatingText","$shouldHideCursor","Thin","blinkAnimation","_ref2","theme","text","StyledTypewriter","div","StyledTypewriterPseudoText","span","StyledTypewriterText","_ref3","_ref4"],"sources":["../../../../src/components/typewriter/Typewriter.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { css, keyframes } from 'styled-components';\nimport { CursorType } from '../../types/cursor';\nimport type { TypewriterProps } from './Typewriter';\n\ntype StyledTypewriterProps = WithTheme<{\n $cursorType: TypewriterProps['cursorType'];\n $isAnimatingText: boolean;\n $shouldHideCursor: TypewriterProps['shouldHideCursor'];\n}>;\n\nconst typewriterCursorElement = ({\n $cursorType,\n $isAnimatingText,\n $shouldHideCursor,\n}: StyledTypewriterProps) => {\n if (!$isAnimatingText || $shouldHideCursor) {\n return '';\n }\n\n if ($cursorType === CursorType.Thin) {\n return css`\n .typewriter-lastWithContent {\n &:after {\n animation: ${blinkAnimation} 1s steps(2, start) infinite;\n color: inherit;\n content: '|';\n font-size: 25px;\n position: relative;\n line-height: 0;\n vertical-align: baseline;\n }\n `;\n }\n\n return css`\n .typewriter-lastWithContent {\n &:after {\n animation: ${blinkAnimation} 1s steps(2, start) infinite;\n color: ${({ theme }: StyledTypewriterTextProps) => theme.text};\n content: '▋';\n margin-left: 0.25rem;\n opacity: 0.85;\n position: relative;\n vertical-align: baseline;\n }\n }\n `;\n};\n\nexport const StyledTypewriter = styled.div<StyledTypewriterProps>`\n align-items: inherit;\n display: flex;\n position: relative;\n width: 100%;\n ${typewriterCursorElement}\n`;\n\nconst blinkAnimation = keyframes`\n 100% {\n visibility: hidden;\n }\n`;\n\nexport const StyledTypewriterPseudoText = styled.span`\n opacity: 0;\n pointer-events: none;\n user-select: none;\n width: 100%;\n`;\n\ntype StyledTypewriterTextProps = WithTheme<{\n $isAnimatingText?: boolean;\n}>;\n\nexport const StyledTypewriterText = styled.span<StyledTypewriterTextProps>`\n color: inherit;\n position: ${({ $isAnimatingText }) => ($isAnimatingText ? 'absolute' : 'relative')};\n width: 100%;\n\n ${({ $isAnimatingText }) =>\n $isAnimatingText &&\n css`\n pointer-events: none;\n `}\n`;\n"],"mappings":"AACA,OAAOA,MAAM,IAAIC,GAAG,EAAEC,SAAS,QAAQ,mBAAmB;AAC1D,SAASC,UAAU,QAAQ,oBAAoB;AAS/C,MAAMC,uBAAuB,GAAGC,IAAA,IAIH;EAAA,IAJI;IAC7BC,WAAW;IACXC,gBAAgB;IAChBC;EACmB,CAAC,GAAAH,IAAA;EACpB,IAAI,CAACE,gBAAgB,IAAIC,iBAAiB,EAAE;IACxC,OAAO,EAAE;EACb;EAEA,IAAIF,WAAW,KAAKH,UAAU,CAACM,IAAI,EAAE;IACjC,OAAOR,GAAG;AAClB;AACA;AACA,iCAAiCS,cAAc;AAC/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;EACL;EAEA,OAAOT,GAAG;AACd;AACA;AACA,6BAA6BS,cAAc;AAC3C,yBAAyBC,KAAA;IAAA,IAAC;MAAEC;IAAiC,CAAC,GAAAD,KAAA;IAAA,OAAKC,KAAK,CAACC,IAAI;EAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL,CAAC;AAED,OAAO,MAAMC,gBAAgB,GAAGd,MAAM,CAACe,GAA0B;AACjE;AACA;AACA;AACA;AACA,MAAMX,uBAAuB;AAC7B,CAAC;AAED,MAAMM,cAAc,GAAGR,SAAS;AAChC;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMc,0BAA0B,GAAGhB,MAAM,CAACiB,IAAI;AACrD;AACA;AACA;AACA;AACA,CAAC;AAMD,OAAO,MAAMC,oBAAoB,GAAGlB,MAAM,CAACiB,IAA+B;AAC1E;AACA,gBAAgBE,KAAA;EAAA,IAAC;IAAEZ;EAAiB,CAAC,GAAAY,KAAA;EAAA,OAAMZ,gBAAgB,GAAG,UAAU,GAAG,UAAU;AAAA,CAAC;AACtF;AACA;AACA,MAAMa,KAAA;EAAA,IAAC;IAAEb;EAAiB,CAAC,GAAAa,KAAA;EAAA,OACnBb,gBAAgB,IAChBN,GAAG;AACX;AACA,SAAS;AAAA;AACT,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"Typewriter.styles.js","names":["styled","css","keyframes","CursorType","typewriterCursorElement","_ref","$cursorType","$isAnimatingText","$shouldHideCursor","$shouldPreventBlinkAnimation","Thin","blinkAnimation","_ref2","theme","text","StyledTypewriter","div","StyledTypewriterPseudoText","span","_ref3","StyledTypewriterText","_ref4","_ref5"],"sources":["../../../../src/components/typewriter/Typewriter.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { css, keyframes } from 'styled-components';\nimport { CursorType } from '../../types/cursor';\nimport type { TypewriterProps } from './Typewriter';\n\ntype StyledTypewriterProps = WithTheme<{\n $cursorType: TypewriterProps['cursorType'];\n $isAnimatingText: boolean;\n $shouldHideCursor: TypewriterProps['shouldHideCursor'];\n $shouldPreventBlinkAnimation: boolean;\n}>;\n\nconst typewriterCursorElement = ({\n $cursorType,\n $isAnimatingText,\n $shouldHideCursor,\n $shouldPreventBlinkAnimation,\n}: StyledTypewriterProps) => {\n if (!$isAnimatingText || $shouldHideCursor) {\n return '';\n }\n\n if ($cursorType === CursorType.Thin) {\n return css`\n .typewriter-lastWithContent {\n &:after {\n animation: ${$shouldPreventBlinkAnimation ? 'none' : blinkAnimation} 1s steps(2, start) infinite;\n color: inherit;\n content: '|';\n font-size: 25px;\n position: relative;\n line-height: 0;\n vertical-align: baseline;\n }\n `;\n }\n\n return css`\n .typewriter-lastWithContent {\n &:after {\n animation: ${blinkAnimation} 1s steps(2, start) infinite;\n color: ${({ theme }: StyledTypewriterTextProps) => theme.text};\n content: '▋';\n margin-left: 0.25rem;\n opacity: 0.85;\n position: relative;\n vertical-align: baseline;\n }\n }\n `;\n};\n\nexport const StyledTypewriter = styled.div<StyledTypewriterProps>`\n align-items: inherit;\n display: flex;\n position: relative;\n width: 100%;\n ${typewriterCursorElement}\n`;\n\nconst blinkAnimation = keyframes`\n 100% {\n visibility: hidden;\n }\n`;\n\ntype StyledTypewriterPseudoTextProps = WithTheme<{\n $isAnimatingText?: boolean;\n $shouldHideCursor: TypewriterProps['shouldHideCursor'];\n}>;\n\nexport const StyledTypewriterPseudoText = styled.span<StyledTypewriterPseudoTextProps>`\n opacity: 0;\n pointer-events: none;\n user-select: none;\n width: fit-content;\n\n ${({ $isAnimatingText, $shouldHideCursor }) =>\n $isAnimatingText &&\n !$shouldHideCursor &&\n css`\n &:after {\n animation: ${blinkAnimation} 1s steps(2, start) infinite;\n color: inherit;\n content: '|';\n font-size: 25px;\n position: relative;\n line-height: 0;\n vertical-align: baseline;\n }\n `}\n`;\n\ntype StyledTypewriterTextProps = WithTheme<{\n $isAnimatingText?: boolean;\n}>;\n\nexport const StyledTypewriterText = styled.span<StyledTypewriterTextProps>`\n color: inherit;\n position: ${({ $isAnimatingText }) => ($isAnimatingText ? 'absolute' : 'relative')};\n width: fit-content;\n\n ${({ $isAnimatingText }) =>\n $isAnimatingText &&\n css`\n pointer-events: none;\n `}\n`;\n"],"mappings":"AACA,OAAOA,MAAM,IAAIC,GAAG,EAAEC,SAAS,QAAQ,mBAAmB;AAC1D,SAASC,UAAU,QAAQ,oBAAoB;AAU/C,MAAMC,uBAAuB,GAAGC,IAAA,IAKH;EAAA,IALI;IAC7BC,WAAW;IACXC,gBAAgB;IAChBC,iBAAiB;IACjBC;EACmB,CAAC,GAAAJ,IAAA;EACpB,IAAI,CAACE,gBAAgB,IAAIC,iBAAiB,EAAE;IACxC,OAAO,EAAE;EACb;EAEA,IAAIF,WAAW,KAAKH,UAAU,CAACO,IAAI,EAAE;IACjC,OAAOT,GAAG;AAClB;AACA;AACA,iCAAiCQ,4BAA4B,GAAG,MAAM,GAAGE,cAAc;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;EACL;EAEA,OAAOV,GAAG;AACd;AACA;AACA,6BAA6BU,cAAc;AAC3C,yBAAyBC,KAAA;IAAA,IAAC;MAAEC;IAAiC,CAAC,GAAAD,KAAA;IAAA,OAAKC,KAAK,CAACC,IAAI;EAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL,CAAC;AAED,OAAO,MAAMC,gBAAgB,GAAGf,MAAM,CAACgB,GAA0B;AACjE;AACA;AACA;AACA;AACA,MAAMZ,uBAAuB;AAC7B,CAAC;AAED,MAAMO,cAAc,GAAGT,SAAS;AAChC;AACA;AACA;AACA,CAAC;AAOD,OAAO,MAAMe,0BAA0B,GAAGjB,MAAM,CAACkB,IAAqC;AACtF;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEZ,gBAAgB;IAAEC;EAAkB,CAAC,GAAAW,KAAA;EAAA,OACtCZ,gBAAgB,IAChB,CAACC,iBAAiB,IAClBP,GAAG;AACX;AACA,6BAA6BU,cAAc;AAC3C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAAS;AAAA;AACT,CAAC;AAMD,OAAO,MAAMS,oBAAoB,GAAGpB,MAAM,CAACkB,IAA+B;AAC1E;AACA,gBAAgBG,KAAA;EAAA,IAAC;IAAEd;EAAiB,CAAC,GAAAc,KAAA;EAAA,OAAMd,gBAAgB,GAAG,UAAU,GAAG,UAAU;AAAA,CAAC;AACtF;AACA;AACA,MAAMe,KAAA;EAAA,IAAC;IAAEf;EAAiB,CAAC,GAAAe,KAAA;EAAA,OACnBf,gBAAgB,IAChBN,GAAG;AACX;AACA,SAAS;AAAA;AACT,CAAC","ignoreList":[]}
@@ -4,9 +4,14 @@ type StyledTypewriterProps = WithTheme<{
4
4
  $cursorType: TypewriterProps['cursorType'];
5
5
  $isAnimatingText: boolean;
6
6
  $shouldHideCursor: TypewriterProps['shouldHideCursor'];
7
+ $shouldPreventBlinkAnimation: boolean;
7
8
  }>;
8
9
  export declare const StyledTypewriter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledTypewriterProps>> & string;
9
- export declare const StyledTypewriterPseudoText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
10
+ type StyledTypewriterPseudoTextProps = WithTheme<{
11
+ $isAnimatingText?: boolean;
12
+ $shouldHideCursor: TypewriterProps['shouldHideCursor'];
13
+ }>;
14
+ export declare const StyledTypewriterPseudoText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, StyledTypewriterPseudoTextProps>> & string;
10
15
  type StyledTypewriterTextProps = WithTheme<{
11
16
  $isAnimatingText?: boolean;
12
17
  }>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/typewriter",
3
- "version": "5.0.0-beta.940",
3
+ "version": "5.0.0-beta.941",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "sideEffects": false,
6
6
  "browserslist": [
@@ -81,5 +81,5 @@
81
81
  "publishConfig": {
82
82
  "access": "public"
83
83
  },
84
- "gitHead": "8cdbd6072312b59f71698401b5eab20214a48c62"
84
+ "gitHead": "380e32862d38e6d3ac36ddb61a79dcb9116bc75b"
85
85
  }