@chayns-components/typewriter 5.0.0-beta.66 → 5.0.0-beta.661

package/lib/esm/components/typewriter/Typewriter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typewriter.js","names":["ColorSchemeProvider","React","useCallback","useEffect","useLayoutEffect","useMemo","useState","createPortal","renderToString","StyledTypewriter","StyledTypewriterPseudoText","StyledTypewriterText","getCharactersCount","getSubTextFromHTML","shuffleArray","TypewriterResetDelay","TypewriterSpeed","Typewriter","_ref","children","onFinish","pseudoChildren","resetDelay","Medium","shouldForceCursorAnimation","shouldHideCursor","shouldSortChildrenRandomly","shouldUseAnimationHeight","shouldUseResetAnimation","shouldWaitForContent","speed","textStyle","currentChildrenIndex","setCurrentChildrenIndex","shouldCount","setShouldCount","hasRenderedChildrenOnce","setHasRenderedChildrenOnce","sortedChildren","Array","isArray","areMultipleChildrenGiven","childrenCount","length","textContent","currentChildren","isValidElement","createElement","color","colorMode","style","display","charactersCount","isResetAnimationActive","setIsResetAnimationActive","shownCharCount","setShownCharCount","shouldStopAnimation","setShouldStopAnimation","prevChildren","setPrevChildren","isAnimatingText","handleClick","handleSetNextChildrenIndex","newIndex","interval","window","setInterval","prevState","nextState","clearInterval","setTimeout","shownText","pseudoTextHTML","pseudoText","onClick","dangerouslySetInnerHTML","__html","$isAnimatingText","$shouldHideCursor","position","visibility","document","body","displayName"],"sources":["../../../../src/components/typewriter/Typewriter.tsx"],"sourcesContent":["import { ColorSchemeProvider } from '@chayns-components/core';\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 {\n    StyledTypewriter,\n    StyledTypewriterPseudoText,\n    StyledTypewriterText,\n} from './Typewriter.styles';\nimport { getCharactersCount, getSubTextFromHTML, shuffleArray } from './utils';\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterResetDelay {\n    Slow = 4000,\n    Medium = 2000,\n    Fast = 1000,\n}\n\n// noinspection JSUnusedGlobalSymbols\nexport enum TypewriterSpeed {\n    Slow = 30,\n    Medium = 20,\n    Fast = 10,\n}\n\nexport type TypewriterProps = {\n    /**\n     * The text to type\n     */\n    children: ReactElement | ReactElement[] | string | string[];\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     * 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 before the typewriter resets the content if multiple texts are given\n     */\n    resetDelay?: TypewriterResetDelay;\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 style of the typewriter text element\n     */\n    textStyle?: React.CSSProperties;\n};\n\nconst Typewriter: FC<TypewriterProps> = ({\n    children,\n    onFinish,\n    pseudoChildren,\n    resetDelay = TypewriterResetDelay.Medium,\n    shouldForceCursorAnimation = false,\n    shouldHideCursor = false,\n    shouldSortChildrenRandomly = false,\n    shouldUseAnimationHeight = false,\n    shouldUseResetAnimation = false,\n    shouldWaitForContent,\n    speed = TypewriterSpeed.Medium,\n    textStyle,\n}) => {\n    const [currentChildrenIndex, setCurrentChildrenIndex] = useState(0);\n    const [shouldCount, setShouldCount] = useState(true);\n    const [hasRenderedChildrenOnce, setHasRenderedChildrenOnce] = useState(false);\n\n    useLayoutEffect(() => {\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                          <ColorSchemeProvider\n                              color=\"#005EB8\"\n                              colorMode={0}\n                              style={{ display: 'inline' }}\n                          >\n                              {currentChildren}\n                          </ColorSchemeProvider>,\n                      )\n                    : (currentChildren as string);\n            }\n\n            return '';\n        }\n\n        return React.isValidElement(sortedChildren)\n            ? renderToString(\n                  <ColorSchemeProvider color=\"#005EB8\" colorMode={0} style={{ display: 'inline' }}>\n                      {sortedChildren}\n                  </ColorSchemeProvider>,\n              )\n            : (sortedChildren as string);\n    }, [areMultipleChildrenGiven, currentChildrenIndex, sortedChildren]);\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    const [prevChildren, setPrevChildren] = useState<TypewriterProps['children']>(children);\n\n    useEffect(() => {\n        if (children !== prevChildren) {\n            setShouldCount(true);\n            setPrevChildren(children);\n        }\n    }, [children, prevChildren]);\n\n    const isAnimatingText =\n        shownCharCount < textContent.length ||\n        shouldForceCursorAnimation ||\n        areMultipleChildrenGiven ||\n        textContent.length === 0;\n\n    const handleClick = useCallback(() => {\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            interval = window.setInterval(() => {\n                setShownCharCount((prevState) => {\n                    const nextState = prevState - 1;\n\n                    if (nextState === 0) {\n                        window.clearInterval(interval);\n\n                        if (areMultipleChildrenGiven) {\n                            setTimeout(() => {\n                                setIsResetAnimationActive(false);\n                                handleSetNextChildrenIndex();\n                            }, resetDelay);\n                        }\n                    }\n\n                    return nextState;\n                });\n            }, speed);\n        } else {\n            interval = window.setInterval(() => {\n                setShownCharCount((prevState) => {\n                    let nextState = prevState;\n\n                    if (shouldCount) {\n                        nextState = prevState + 1;\n                    }\n\n                    if (nextState >= charactersCount) {\n                        if (shouldWaitForContent) {\n                            setShouldCount(false);\n                        } else {\n                            window.clearInterval(interval);\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, resetDelay / 2);\n                                    }\n                                }, resetDelay);\n                            }\n                        }\n                    }\n\n                    return nextState;\n                });\n            }, speed);\n        }\n\n        return () => {\n            window.clearInterval(interval);\n        };\n    }, [\n        shouldStopAnimation,\n        speed,\n        textContent.length,\n        charactersCount,\n        isResetAnimationActive,\n        areMultipleChildrenGiven,\n        resetDelay,\n        childrenCount,\n        handleSetNextChildrenIndex,\n        shouldUseResetAnimation,\n        shouldCount,\n        shouldWaitForContent,\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                      <ColorSchemeProvider\n                          color=\"#005EB8\"\n                          colorMode={0}\n                          style={{ display: 'inline' }}\n                      >\n                          {pseudoChildren}\n                      </ColorSchemeProvider>,\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    }, [pseudoChildren, shouldUseAnimationHeight, shownCharCount, textContent]);\n\n    return useMemo(\n        () => (\n            <StyledTypewriter onClick={handleClick}>\n                {isAnimatingText ? (\n                    <StyledTypewriterText\n                        dangerouslySetInnerHTML={{ __html: shownText }}\n                        $isAnimatingText\n                        $shouldHideCursor={shouldHideCursor}\n                        style={textStyle}\n                    />\n                ) : (\n                    <StyledTypewriterText style={textStyle}>{sortedChildren}</StyledTypewriterText>\n                )}\n                {isAnimatingText && (\n                    <StyledTypewriterPseudoText\n                        dangerouslySetInnerHTML={{ __html: pseudoTextHTML }}\n                        $isAnimatingText\n                        $shouldHideCursor={shouldHideCursor}\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            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":[]}

package/lib/esm/components/typewriter/Typewriter.styles.js

@@ -0,0 +1,54 @@
+import styled, { css, keyframes } from 'styled-components';
+export const StyledTypewriter = styled.div`
+    align-items: inherit;
+    display: flex;
+    position: relative;
+    width: 100%;
+`;
+const blinkAnimation = keyframes`
+  100% {
+    visibility: hidden;
+  }
+`;
+const typewriterCursorElement = _ref => {
+  let {
+    $isAnimatingText,
+    $shouldHideCursor
+  } = _ref;
+  return $isAnimatingText && !$shouldHideCursor && css`
+        &:after {
+            animation: ${blinkAnimation} 1s steps(5, start) infinite;
+            color: ${_ref2 => {
+    let {
+      theme
+    } = _ref2;
+    return theme.text;
+  }};
+            content: '▋';
+            margin-left: 0.25rem;
+            opacity: 0.85;
+            position: relative;
+            vertical-align: baseline;
+        }
+    `;
+};
+export const StyledTypewriterPseudoText = styled.span`
+    opacity: 0;
+    pointer-events: none;
+    user-select: none;
+
+    ${typewriterCursorElement}
+`;
+export const StyledTypewriterText = styled.span`
+    color: inherit;
+    position: ${_ref3 => {
+  let {
+    $isAnimatingText
+  } = _ref3;
+  return $isAnimatingText ? 'absolute' : 'relative';
+}};
+    width: 100%;
+
+    ${typewriterCursorElement}
+`;
+//# sourceMappingURL=Typewriter.styles.js.map

package/lib/esm/components/typewriter/Typewriter.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typewriter.styles.js","names":["styled","css","keyframes","StyledTypewriter","div","blinkAnimation","typewriterCursorElement","_ref","$isAnimatingText","$shouldHideCursor","_ref2","theme","text","StyledTypewriterPseudoText","span","StyledTypewriterText","_ref3"],"sources":["../../../../src/components/typewriter/Typewriter.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { css, keyframes } from 'styled-components';\n\nexport const StyledTypewriter = styled.div`\n    align-items: inherit;\n    display: flex;\n    position: relative;\n    width: 100%;\n`;\n\nconst blinkAnimation = keyframes`\n  100% {\n    visibility: hidden;\n  }\n`;\n\nconst typewriterCursorElement = ({\n    $isAnimatingText,\n    $shouldHideCursor,\n}: {\n    $isAnimatingText?: boolean;\n    $shouldHideCursor?: boolean;\n}) =>\n    $isAnimatingText &&\n    !$shouldHideCursor &&\n    css`\n        &:after {\n            animation: ${blinkAnimation} 1s steps(5, 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\nexport const StyledTypewriterPseudoText = styled.span<StyledTypewriterTextProps>`\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n\n    ${typewriterCursorElement}\n`;\n\ntype StyledTypewriterTextProps = WithTheme<{\n    $isAnimatingText?: boolean;\n    $shouldHideCursor?: boolean;\n}>;\n\nexport const StyledTypewriterText = styled.span<StyledTypewriterTextProps>`\n    color: inherit;\n    position: ${({ $isAnimatingText }) => ($isAnimatingText ? 'absolute' : 'relative')};\n    width: 100%;\n\n    ${typewriterCursorElement}\n`;\n"],"mappings":"AACA,OAAOA,MAAM,IAAIC,GAAG,EAAEC,SAAS,QAAQ,mBAAmB;AAE1D,OAAO,MAAMC,gBAAgB,GAAGH,MAAM,CAACI,GAAG;AAC1C;AACA;AACA;AACA;AACA,CAAC;AAED,MAAMC,cAAc,GAAGH,SAAS;AAChC;AACA;AACA;AACA,CAAC;AAED,MAAMI,uBAAuB,GAAGC,IAAA;EAAA,IAAC;IAC7BC,gBAAgB;IAChBC;EAIJ,CAAC,GAAAF,IAAA;EAAA,OACGC,gBAAgB,IAChB,CAACC,iBAAiB,IAClBR,GAAG;AACP;AACA,yBAAyBI,cAAc;AACvC,qBAAqBK,KAAA;IAAA,IAAC;MAAEC;IAAiC,CAAC,GAAAD,KAAA;IAAA,OAAKC,KAAK,CAACC,IAAI;EAAA;AACzE;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AAAA;AAEL,OAAO,MAAMC,0BAA0B,GAAGb,MAAM,CAACc,IAA+B;AAChF;AACA;AACA;AACA;AACA,MAAMR,uBAAuB;AAC7B,CAAC;AAOD,OAAO,MAAMS,oBAAoB,GAAGf,MAAM,CAACc,IAA+B;AAC1E;AACA,gBAAgBE,KAAA;EAAA,IAAC;IAAER;EAAiB,CAAC,GAAAQ,KAAA;EAAA,OAAMR,gBAAgB,GAAG,UAAU,GAAG,UAAU;AAAA,CAAC;AACtF;AACA;AACA,MAAMF,uBAAuB;AAC7B,CAAC","ignoreList":[]}

package/lib/esm/components/typewriter/utils.js

@@ -0,0 +1,81 @@
+/**
+ * This function extracts a part of the text from an HTML text. The HTML elements themselves are
+ * returned in the result. In addition, the function ensures that the closing tag of the Bold HTML
+ * element is also returned for text that is cut off in the middle of a Bold element, for example.
+ *
+ * @param html - The text from which a part should be taken
+ * @param length - The length of the text to be extracted
+ *
+ * @return string - The text part with the specified length - additionally the HTML elements are added
+ */
+export const getSubTextFromHTML = (html, length) => {
+  const div = document.createElement('div');
+  div.innerHTML = html;
+  let text = '';
+  let currLength = 0;
+  const traverse = element => {
+    if (element.nodeType === 3 && typeof element.textContent === 'string') {
+      const nodeText = element.textContent;
+      if (currLength + nodeText.length <= length) {
+        text += nodeText;
+        currLength += nodeText.length;
+      } else {
+        text += nodeText.substring(0, length - currLength);
+        return false;
+      }
+    } else if (element.nodeType === 1) {
+      const nodeName = element.nodeName.toLowerCase();
+      let attributes = '';
+
+      // @ts-expect-error: Type is correct here
+      // eslint-disable-next-line no-restricted-syntax
+      for (const attribute of element.attributes) {
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access,@typescript-eslint/restrict-template-expressions
+        attributes += ` ${attribute.name}="${attribute.value}"`;
+      }
+      text += `<${nodeName}${attributes}>`;
+      for (let i = 0; i < element.childNodes.length; i++) {
+        const childNode = element.childNodes[i];
+        if (childNode && !traverse(childNode)) {
+          return false;
+        }
+      }
+      text += `</${nodeName}>`;
+    }
+    return true;
+  };
+  for (let i = 0; i < div.childNodes.length; i++) {
+    const childNode = div.childNodes[i];
+    if (childNode && !traverse(childNode)) {
+      return text;
+    }
+  }
+  return text;
+};
+export const getCharactersCount = html => {
+  const div = document.createElement('div');
+  div.innerHTML = html;
+  let count = 0;
+  const traverse = node => {
+    if (node.nodeType === 3 && typeof node.textContent === 'string') {
+      count += node.textContent.trim().length;
+    } else if (node.nodeType === 1) {
+      if (node.nodeName === 'CODE' && node.textContent !== null) {
+        count += node.textContent.length;
+        return;
+      }
+      Array.from(node.childNodes).forEach(traverse);
+    }
+  };
+  Array.from(div.childNodes).forEach(traverse);
+  return count;
+};
+export const shuffleArray = array => {
+  const result = Array.from(array);
+  for (let i = result.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1));
+    [result[i], result[j]] = [result[j], result[i]];
+  }
+  return result;
+};
+//# sourceMappingURL=utils.js.map

package/lib/esm/components/typewriter/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","names":["getSubTextFromHTML","html","length","div","document","createElement","innerHTML","text","currLength","traverse","element","nodeType","textContent","nodeText","substring","nodeName","toLowerCase","attributes","attribute","name","value","i","childNodes","childNode","getCharactersCount","count","node","trim","Array","from","forEach","shuffleArray","array","result","j","Math","floor","random"],"sources":["../../../../src/components/typewriter/utils.ts"],"sourcesContent":["/**\n * This function extracts a part of the text from an HTML text. The HTML elements themselves are\n * returned in the result. In addition, the function ensures that the closing tag of the Bold HTML\n * element is also returned for text that is cut off in the middle of a Bold element, for example.\n *\n * @param html - The text from which a part should be taken\n * @param length - The length of the text to be extracted\n *\n * @return string - The text part with the specified length - additionally the HTML elements are added\n */\nexport const getSubTextFromHTML = (html: string, length: number): string => {\n    const div = document.createElement('div');\n\n    div.innerHTML = html;\n\n    let text = '';\n    let currLength = 0;\n\n    const traverse = (element: Element): boolean => {\n        if (element.nodeType === 3 && typeof element.textContent === 'string') {\n            const nodeText = element.textContent;\n\n            if (currLength + nodeText.length <= length) {\n                text += nodeText;\n                currLength += nodeText.length;\n            } else {\n                text += nodeText.substring(0, length - currLength);\n\n                return false;\n            }\n        } else if (element.nodeType === 1) {\n            const nodeName = element.nodeName.toLowerCase();\n\n            let attributes = '';\n\n            // @ts-expect-error: Type is correct here\n            // eslint-disable-next-line no-restricted-syntax\n            for (const attribute of element.attributes) {\n                // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access,@typescript-eslint/restrict-template-expressions\n                attributes += ` ${attribute.name}=\"${attribute.value}\"`;\n            }\n\n            text += `<${nodeName}${attributes}>`;\n\n            for (let i = 0; i < element.childNodes.length; i++) {\n                const childNode = element.childNodes[i];\n\n                if (childNode && !traverse(childNode as Element)) {\n                    return false;\n                }\n            }\n\n            text += `</${nodeName}>`;\n        }\n\n        return true;\n    };\n\n    for (let i = 0; i < div.childNodes.length; i++) {\n        const childNode = div.childNodes[i];\n\n        if (childNode && !traverse(childNode as Element)) {\n            return text;\n        }\n    }\n\n    return text;\n};\n\nexport const getCharactersCount = (html: string): number => {\n    const div = document.createElement('div');\n\n    div.innerHTML = html;\n\n    let count = 0;\n\n    const traverse = (node: Node): void => {\n        if (node.nodeType === 3 && typeof node.textContent === 'string') {\n            count += node.textContent.trim().length;\n        } else if (node.nodeType === 1) {\n            if (node.nodeName === 'CODE' && node.textContent !== null) {\n                count += node.textContent.length;\n\n                return;\n            }\n\n            Array.from(node.childNodes).forEach(traverse);\n        }\n    };\n\n    Array.from(div.childNodes).forEach(traverse);\n\n    return count;\n};\n\nexport const shuffleArray = <T>(array: T[]): T[] => {\n    const result = Array.from(array);\n\n    for (let i = result.length - 1; i > 0; i--) {\n        const j = Math.floor(Math.random() * (i + 1));\n\n        [result[i], result[j]] = [result[j]!, result[i]!];\n    }\n\n    return result;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/index.js

@@ -0,0 +1,2 @@
+export { default as Typewriter, TypewriterSpeed } from './components/typewriter/Typewriter';
+//# sourceMappingURL=index.js.map

package/lib/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","Typewriter","TypewriterSpeed"],"sources":["../../src/index.ts"],"sourcesContent":["export { default as Typewriter, TypewriterSpeed } from './components/typewriter/Typewriter';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,UAAU,EAAEC,eAAe,QAAQ,oCAAoC","ignoreList":[]}

package/lib/types/components/typewriter/Typewriter.d.ts

@@ -0,0 +1,69 @@
+import React, { FC, ReactElement } from 'react';
+export declare enum TypewriterResetDelay {
+    Slow = 4000,
+    Medium = 2000,
+    Fast = 1000
+}
+export declare enum TypewriterSpeed {
+    Slow = 30,
+    Medium = 20,
+    Fast = 10
+}
+export type TypewriterProps = {
+    /**
+     * The text to type
+     */
+    children: ReactElement | ReactElement[] | string | string[];
+    /**
+     * Function that is executed when the typewriter animation has finished. This function will not
+     * be executed if multiple texts are used.
+     */
+    onFinish?: VoidFunction;
+    /**
+     * Pseudo-element to be rendered invisible during animation to define the size of the element
+     * for the typewriter effect. By default, the "children" is used for this purpose.
+     */
+    pseudoChildren?: ReactElement | string;
+    /**
+     * Waiting time before the typewriter resets the content if multiple texts are given
+     */
+    resetDelay?: TypewriterResetDelay;
+    /**
+     * Specifies whether the cursor should be forced to animate even if no text is currently animated.
+     */
+    shouldForceCursorAnimation?: boolean;
+    /**
+     * Specifies whether the cursor should be hidden
+     */
+    shouldHideCursor?: boolean;
+    /**
+     * Specifies whether the children should be sorted randomly if there are multiple texts.
+     * This makes the typewriter start with a different text each time and also changes them
+     * in a random order.
+     */
+    shouldSortChildrenRandomly?: boolean;
+    /**
+     * Specifies whether the animation should use its full height or the height of the current
+     * chunk.
+     */
+    shouldUseAnimationHeight?: boolean;
+    /**
+     * Specifies whether the reset of the text should be animated with a backspace animation for
+     * multiple texts.
+     */
+    shouldUseResetAnimation?: boolean;
+    /**
+     * Whether the typewriter should wait for new content
+     */
+    shouldWaitForContent?: boolean;
+    /**
+     * The speed of the animation. Use the TypewriterSpeed enum for this prop.
+     */
+    speed?: TypewriterSpeed | number;
+    /**
+     * The style of the typewriter text element
+     */
+    textStyle?: React.CSSProperties;
+};
+declare const Typewriter: FC<TypewriterProps>;
+export default Typewriter;

package/lib/types/components/typewriter/Typewriter.styles.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { WithTheme } from '@chayns-components/core';
+export declare const StyledTypewriter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+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>, StyledTypewriterTextProps>> & string;
+type StyledTypewriterTextProps = WithTheme<{
+    $isAnimatingText?: boolean;
+    $shouldHideCursor?: boolean;
+}>;
+export declare const StyledTypewriterText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, StyledTypewriterTextProps>> & string;
+export {};

package/lib/{components → types/components}/typewriter/utils.d.ts

@@ -10,3 +10,4 @@
  */
 export declare const getSubTextFromHTML: (html: string, length: number) => string;
 export declare const getCharactersCount: (html: string) => number;
+export declare const shuffleArray: <T>(array: T[]) => T[];

package/package.json

@@ -1,7 +1,14 @@
 {
     "name": "@chayns-components/typewriter",
-    "version": "5.0.0-beta.66",
+    "version": "5.0.0-beta.661",
     "description": "A set of beautiful React components for developing your own applications with chayns.",
+    "sideEffects": false,
+    "browserslist": [
+        ">0.5%",
+        "not dead",
+        "not op_mini all",
+        "not IE 11"
+    ],
     "keywords": [
         "chayns",
         "react",
@@ -10,8 +17,16 @@
     "author": "Tobit.Software",
     "homepage": "https://github.com/TobitSoftware/chayns-components/tree/main/packages/typewriter#readme",
     "license": "MIT",
-    "main": "lib/index.js",
-    "types": "lib/index.d.ts",
+    "main": "lib/cjs/index.js",
+    "module": "lib/esm/index.js",
+    "types": "lib/types/index.d.ts",
+    "exports": {
+        ".": {
+            "require": "./lib/cjs/index.js",
+            "import": "./lib/esm/index.js",
+            "types": "./lib/types/index.d.ts"
+        }
+    },
     "directories": {
         "lib": "lib",
         "test": "__tests__"
@@ -24,44 +39,45 @@
         "url": "git+https://github.com/TobitSoftware/chayns-components.git"
     },
     "scripts": {
-        "build": "npm run build:js && npm run build:types",
-        "build:js": "babel src --out-dir lib --extensions=.ts,.tsx --source-maps --ignore=src/stories",
+        "build": "npm run build:cjs && npm run build:esm && npm run build:types",
         "build:types": "tsc",
+        "build:cjs": "cross-env NODE_ENV=cjs babel src --out-dir lib/cjs --extensions=.ts,.tsx --source-maps --ignore=src/stories",
+        "build:esm": "cross-env NODE_ENV=esm babel src --out-dir lib/esm --extensions=.ts,.tsx --source-maps --ignore=src/stories",
         "prepublishOnly": "npm run build"
     },
     "bugs": {
         "url": "https://github.com/TobitSoftware/chayns-components/issues"
     },
     "devDependencies": {
-        "@babel/cli": "^7.21.0",
-        "@babel/core": "^7.21.0",
-        "@babel/preset-env": "^7.20.2",
-        "@babel/preset-react": "^7.18.6",
-        "@babel/preset-typescript": "^7.21.0",
-        "@types/react": "^17.0.53",
-        "@types/react-dom": "^17.0.19",
-        "@types/styled-components": "^5.1.26",
-        "@types/uuid": "^9.0.0",
-        "babel-loader": "^8.3.0",
-        "lerna": "^6.5.1",
-        "react": "^17.0.2",
-        "react-dom": "^17.0.2",
-        "typescript": "^4.9.5"
+        "@babel/cli": "^7.24.6",
+        "@babel/core": "^7.24.6",
+        "@babel/preset-env": "^7.24.6",
+        "@babel/preset-react": "^7.24.6",
+        "@babel/preset-typescript": "^7.24.6",
+        "@types/react": "^18.3.3",
+        "@types/react-dom": "^18.3.0",
+        "@types/styled-components": "^5.1.34",
+        "@types/uuid": "^9.0.8",
+        "babel-loader": "^9.1.3",
+        "cross-env": "^7.0.3",
+        "lerna": "^8.1.3",
+        "react": "^18.3.1",
+        "react-dom": "^18.3.1",
+        "styled-components": "^6.1.11",
+        "typescript": "^5.4.5"
     },
     "dependencies": {
-        "@chayns-components/core": "^5.0.0-beta.66",
-        "@chayns/colors": "^2.0.0",
-        "clsx": "^1.2.1",
-        "framer-motion": "^6.5.1",
-        "styled-components": "^5.3.6",
-        "uuid": "^9.0.0"
+        "@chayns-components/core": "^5.0.0-beta.661"
     },
     "peerDependencies": {
+        "chayns-api": ">=1.0.50",
+        "framer-motion": ">=10.18.0",
         "react": ">=16.14.0",
-        "react-dom": ">=16.14.0"
+        "react-dom": ">=16.14.0",
+        "styled-components": ">=5.3.11"
     },
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "f876f20f2a14ef7d6db38205c18fe3554a503e16"
+    "gitHead": "abed9a83e68e93e9c80d3ee9c2363186fbabd502"
 }

package/lib/components/typewriter/Typewriter.d.ts

@@ -1,15 +0,0 @@
-import { FC, ReactElement } from 'react';
-export declare enum TypewriterSpeed {
-    Slow = 40,
-    Medium = 30,
-    Fast = 20
-}
-export type TypewriterProps = {
-    /**
-     * The text to type
-     */
-    children: ReactElement | string;
-    speed?: TypewriterSpeed;
-};
-declare const Typewriter: FC<TypewriterProps>;
-export default Typewriter;

package/lib/components/typewriter/Typewriter.js

@@ -1,77 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.TypewriterSpeed = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _server = require("react-dom/server");
-var _Typewriter = require("./Typewriter.styles");
-var _utils = require("./utils");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-let TypewriterSpeed;
-exports.TypewriterSpeed = TypewriterSpeed;
-(function (TypewriterSpeed) {
-  TypewriterSpeed[TypewriterSpeed["Slow"] = 40] = "Slow";
-  TypewriterSpeed[TypewriterSpeed["Medium"] = 30] = "Medium";
-  TypewriterSpeed[TypewriterSpeed["Fast"] = 20] = "Fast";
-})(TypewriterSpeed || (exports.TypewriterSpeed = TypewriterSpeed = {}));
-const Typewriter = _ref => {
-  let {
-    children,
-    speed = TypewriterSpeed.Medium
-  } = _ref;
-  const textContent = /*#__PURE__*/_react.default.isValidElement(children) ? (0, _server.renderToString)(children) : children;
-  const charactersCount = (0, _react.useMemo)(() => (0, _utils.getCharactersCount)(textContent), [textContent]);
-  const [shownCharCount, setShownCharCount] = (0, _react.useState)(charactersCount > 0 ? 0 : textContent.length);
-  const [shouldStopAnimation, setShouldStopAnimation] = (0, _react.useState)(false);
-  const isAnimatingText = shownCharCount !== textContent.length;
-  const handleClick = (0, _react.useCallback)(() => {
-    setShouldStopAnimation(true);
-  }, []);
-  (0, _react.useEffect)(() => {
-    let interval;
-    if (shouldStopAnimation || charactersCount === 0) {
-      setShownCharCount(textContent.length);
-    } else {
-      setShownCharCount(0);
-      interval = window.setInterval(() => {
-        setShownCharCount(prevState => {
-          let nextState = prevState + 1;
-          if (nextState === charactersCount) {
-            window.clearInterval(interval);
-
-            /**
-             * At this point, the next value for "shownCharCount" is deliberately set to
-             * the length of the textContent in order to correctly display HTML elements
-             * after the last letter.
-             */
-            nextState = textContent.length;
-          }
-          return nextState;
-        });
-      }, speed);
-    }
-    return () => {
-      window.clearInterval(interval);
-    };
-  }, [shouldStopAnimation, speed, textContent.length, charactersCount]);
-  const shownText = (0, _react.useMemo)(() => (0, _utils.getSubTextFromHTML)(textContent, shownCharCount), [shownCharCount, textContent]);
-  return /*#__PURE__*/_react.default.createElement(_Typewriter.StyledTypewriter, {
-    onClick: handleClick
-  }, isAnimatingText ? /*#__PURE__*/_react.default.createElement(_Typewriter.StyledTypewriterText, {
-    dangerouslySetInnerHTML: {
-      __html: shownText
-    },
-    isAnimatingText: true
-  }) : /*#__PURE__*/_react.default.createElement(_Typewriter.StyledTypewriterText, null, children), isAnimatingText && /*#__PURE__*/_react.default.createElement(_Typewriter.StyledTypewriterPseudoText, {
-    dangerouslySetInnerHTML: {
-      __html: textContent
-    }
-  }));
-};
-Typewriter.displayName = 'Typewriter';
-var _default = Typewriter;
-exports.default = _default;
-//# sourceMappingURL=Typewriter.js.map

package/lib/components/typewriter/Typewriter.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Typewriter.js","names":["_react","_interopRequireWildcard","require","_server","_Typewriter","_utils","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","TypewriterSpeed","exports","Typewriter","_ref","children","speed","Medium","textContent","React","isValidElement","renderToString","charactersCount","useMemo","getCharactersCount","shownCharCount","setShownCharCount","useState","length","shouldStopAnimation","setShouldStopAnimation","isAnimatingText","handleClick","useCallback","useEffect","interval","window","setInterval","prevState","nextState","clearInterval","shownText","getSubTextFromHTML","createElement","StyledTypewriter","onClick","StyledTypewriterText","dangerouslySetInnerHTML","__html","StyledTypewriterPseudoText","displayName","_default"],"sources":["../../../src/components/typewriter/Typewriter.tsx"],"sourcesContent":["import React, { FC, ReactElement, useCallback, useEffect, useMemo, useState } from 'react';\nimport { renderToString } from 'react-dom/server';\nimport {\n    StyledTypewriter,\n    StyledTypewriterPseudoText,\n    StyledTypewriterText,\n} from './Typewriter.styles';\nimport { getCharactersCount, getSubTextFromHTML } from './utils';\n\nexport enum TypewriterSpeed {\n    Slow = 40,\n    Medium = 30,\n    Fast = 20,\n}\n\nexport type TypewriterProps = {\n    /**\n     * The text to type\n     */\n    children: ReactElement | string;\n    speed?: TypewriterSpeed;\n};\n\nconst Typewriter: FC<TypewriterProps> = ({ children, speed = TypewriterSpeed.Medium }) => {\n    const textContent = React.isValidElement(children) ? renderToString(children) : children;\n\n    const charactersCount = useMemo(() => getCharactersCount(textContent), [textContent]);\n\n    const [shownCharCount, setShownCharCount] = useState(\n        charactersCount > 0 ? 0 : textContent.length\n    );\n    const [shouldStopAnimation, setShouldStopAnimation] = useState(false);\n\n    const isAnimatingText = shownCharCount !== textContent.length;\n\n    const handleClick = useCallback(() => {\n        setShouldStopAnimation(true);\n    }, []);\n\n    useEffect(() => {\n        let interval: number | undefined;\n\n        if (shouldStopAnimation || charactersCount === 0) {\n            setShownCharCount(textContent.length);\n        } else {\n            setShownCharCount(0);\n\n            interval = window.setInterval(() => {\n                setShownCharCount((prevState) => {\n                    let nextState = prevState + 1;\n\n                    if (nextState === charactersCount) {\n                        window.clearInterval(interval);\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\n                    return nextState;\n                });\n            }, speed);\n        }\n\n        return () => {\n            window.clearInterval(interval);\n        };\n    }, [shouldStopAnimation, speed, textContent.length, charactersCount]);\n\n    const shownText = useMemo(\n        () => getSubTextFromHTML(textContent, shownCharCount),\n        [shownCharCount, textContent]\n    );\n\n    return (\n        <StyledTypewriter onClick={handleClick}>\n            {isAnimatingText ? (\n                <StyledTypewriterText\n                    dangerouslySetInnerHTML={{ __html: shownText }}\n                    isAnimatingText\n                />\n            ) : (\n                <StyledTypewriterText>{children}</StyledTypewriterText>\n            )}\n            {isAnimatingText && (\n                <StyledTypewriterPseudoText dangerouslySetInnerHTML={{ __html: textContent }} />\n            )}\n        </StyledTypewriter>\n    );\n};\n\nTypewriter.displayName = 'Typewriter';\n\nexport default Typewriter;\n"],"mappings":"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"}

package/lib/components/typewriter/Typewriter.styles.d.ts

@@ -1,7 +0,0 @@
-export declare const StyledTypewriter: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StyledTypewriterPseudoText: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const StyledTypewriterText: import("styled-components").StyledComponent<"span", any, {
-    isAnimatingText?: boolean | undefined;
-} & {
-    theme: import("@chayns-components/core/lib/components/color-scheme-provider/ColorSchemeProvider").Theme;
-}, never>;

package/lib/components/typewriter/Typewriter.styles.js

@@ -1,62 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StyledTypewriterText = exports.StyledTypewriterPseudoText = exports.StyledTypewriter = void 0;
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const StyledTypewriter = _styledComponents.default.div`
-    position: relative;
-`;
-exports.StyledTypewriter = StyledTypewriter;
-const blinkAnimation = (0, _styledComponents.keyframes)`
-  100% {
-    visibility: hidden;
-  }
-`;
-const StyledTypewriterPseudoText = _styledComponents.default.span`
-    opacity: 0;
-    pointer-events: none;
-    user-select: none;
-`;
-exports.StyledTypewriterPseudoText = StyledTypewriterPseudoText;
-const StyledTypewriterText = _styledComponents.default.span`
-    color: ${_ref => {
-  let {
-    theme
-  } = _ref;
-  return theme.text;
-}};
-    position: ${_ref2 => {
-  let {
-    isAnimatingText
-  } = _ref2;
-  return isAnimatingText ? 'absolute' : 'relative';
-}};
-    width: 100%;
-
-    ${_ref3 => {
-  let {
-    isAnimatingText
-  } = _ref3;
-  return isAnimatingText && (0, _styledComponents.css)`
-            &:after {
-                animation: ${blinkAnimation} 1s steps(5, start) infinite;
-                color: ${_ref4 => {
-    let {
-      theme
-    } = _ref4;
-    return theme.text;
-  }};
-                content: '▋';
-                margin-left: 0.25rem;
-                opacity: 0.85;
-                vertical-align: baseline;
-            }
-        `;
-}}
-`;
-exports.StyledTypewriterText = StyledTypewriterText;
-//# sourceMappingURL=Typewriter.styles.js.map

package/lib/components/typewriter/Typewriter.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Typewriter.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","StyledTypewriter","styled","div","exports","blinkAnimation","keyframes","StyledTypewriterPseudoText","span","StyledTypewriterText","_ref","theme","text","_ref2","isAnimatingText","_ref3","css","_ref4"],"sources":["../../../src/components/typewriter/Typewriter.styles.ts"],"sourcesContent":["import type { WithTheme } from '@chayns-components/core';\nimport styled, { css, keyframes } from 'styled-components';\n\nexport const StyledTypewriter = styled.div`\n    position: relative;\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`;\n\ntype StyledTypewriterTextProps = WithTheme<{\n    isAnimatingText?: boolean;\n}>;\n\nexport const StyledTypewriterText = styled.span<StyledTypewriterTextProps>`\n    color: ${({ theme }: StyledTypewriterTextProps) => theme.text};\n    position: ${({ isAnimatingText }) => (isAnimatingText ? 'absolute' : 'relative')};\n    width: 100%;\n\n    ${({ isAnimatingText }) =>\n        isAnimatingText &&\n        css`\n            &:after {\n                animation: ${blinkAnimation} 1s steps(5, start) infinite;\n                color: ${({ theme }: StyledTypewriterTextProps) => theme.text};\n                content: '▋';\n                margin-left: 0.25rem;\n                opacity: 0.85;\n                vertical-align: baseline;\n            }\n        `}\n`;\n"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAA2D,SAAAC,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAH,wBAAAO,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAEpD,MAAMW,gBAAgB,GAAGC,yBAAM,CAACC,GAAI;AAC3C;AACA,CAAC;AAACC,OAAA,CAAAH,gBAAA,GAAAA,gBAAA;AAEF,MAAMI,cAAc,GAAG,IAAAC,2BAAS,CAAC;AACjC;AACA;AACA;AACA,CAAC;AAEM,MAAMC,0BAA0B,GAAGL,yBAAM,CAACM,IAAK;AACtD;AACA;AACA;AACA,CAAC;AAACJ,OAAA,CAAAG,0BAAA,GAAAA,0BAAA;AAMK,MAAME,oBAAoB,GAAGP,yBAAM,CAACM,IAAgC;AAC3E,aAAaE,IAAA;EAAA,IAAC;IAAEC;EAAiC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA,CAAC;AAClE,gBAAgBC,KAAA;EAAA,IAAC;IAAEC;EAAgB,CAAC,GAAAD,KAAA;EAAA,OAAMC,eAAe,GAAG,UAAU,GAAG,UAAU;AAAA,CAAE;AACrF;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAED;EAAgB,CAAC,GAAAC,KAAA;EAAA,OAClBD,eAAe,IACf,IAAAE,qBAAG,CAAC;AACZ;AACA,6BAA6BX,cAAe;AAC5C,yBAAyBY,KAAA;IAAA,IAAC;MAAEN;IAAiC,CAAC,GAAAM,KAAA;IAAA,OAAKN,KAAK,CAACC,IAAI;EAAA,CAAC;AAC9E;AACA;AACA;AACA;AACA;AACA,SAAS;AAAA,CAAC;AACV,CAAC;AAACR,OAAA,CAAAK,oBAAA,GAAAA,oBAAA"}

package/lib/components/typewriter/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","names":["getSubTextFromHTML","html","length","div","document","createElement","innerHTML","text","currLength","traverse","element","nodeType","textContent","nodeText","substring","nodeName","toLowerCase","attributes","attribute","name","value","i","childNodes","childNode","exports","getCharactersCount","count","node","trim","Array","from","forEach"],"sources":["../../../src/components/typewriter/utils.ts"],"sourcesContent":["/**\n * This function extracts a part of the text from an HTML text. The HTML elements themselves are\n * returned in the result. In addition, the function ensures that the closing tag of the Bold HTML\n * element is also returned for text that is cut off in the middle of a Bold element, for example.\n *\n * @param html - The text from which a part should be taken\n * @param length - The length of the text to be extracted\n *\n * @return string - The text part with the specified length - additionally the HTML elements are added\n */\nexport const getSubTextFromHTML = (html: string, length: number): string => {\n    const div = document.createElement('div');\n\n    div.innerHTML = html;\n\n    let text = '';\n    let currLength = 0;\n\n    const traverse = (element: Element): boolean => {\n        if (element.nodeType === 3 && typeof element.textContent === 'string') {\n            const nodeText = element.textContent;\n\n            if (currLength + nodeText.length <= length) {\n                text += nodeText;\n                currLength += nodeText.length;\n            } else {\n                text += nodeText.substring(0, length - currLength);\n\n                return false;\n            }\n        } else if (element.nodeType === 1) {\n            const nodeName = element.nodeName.toLowerCase();\n\n            let attributes = '';\n\n            // @ts-expect-error: Type is correct here\n            // eslint-disable-next-line no-restricted-syntax\n            for (const attribute of element.attributes) {\n                // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access,@typescript-eslint/restrict-template-expressions\n                attributes += ` ${attribute.name}=\"${attribute.value}\"`;\n            }\n\n            text += `<${nodeName}${attributes}>`;\n\n            for (let i = 0; i < element.childNodes.length; i++) {\n                const childNode = element.childNodes[i];\n\n                if (childNode && !traverse(childNode as Element)) {\n                    return false;\n                }\n            }\n\n            text += `</${nodeName}>`;\n        }\n\n        return true;\n    };\n\n    for (let i = 0; i < div.childNodes.length; i++) {\n        const childNode = div.childNodes[i];\n\n        if (childNode && !traverse(childNode as Element)) {\n            return text;\n        }\n    }\n\n    return text;\n};\n\nexport const getCharactersCount = (html: string): number => {\n    const div = document.createElement('div');\n\n    div.innerHTML = html;\n\n    let count = 0;\n\n    const traverse = (node: Node): void => {\n        if (node.nodeType === 3 && typeof node.textContent === 'string') {\n            count += node.textContent.trim().length;\n        } else if (node.nodeType === 1) {\n            Array.from(node.childNodes).forEach(traverse);\n        }\n    };\n\n    Array.from(div.childNodes).forEach(traverse);\n\n    return count;\n};\n"],"mappings":"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"}