@chayns-components/typewriter 5.0.0-beta.939 → 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.
- package/lib/cjs/components/typewriter/Typewriter.js +33 -4
- package/lib/cjs/components/typewriter/Typewriter.js.map +1 -1
- package/lib/cjs/components/typewriter/Typewriter.styles.js +53 -16
- package/lib/cjs/components/typewriter/Typewriter.styles.js.map +1 -1
- package/lib/cjs/index.js +7 -0
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/types/cursor.js +12 -0
- package/lib/cjs/types/cursor.js.map +1 -0
- package/lib/esm/components/typewriter/Typewriter.js +33 -4
- package/lib/esm/components/typewriter/Typewriter.js.map +1 -1
- package/lib/esm/components/typewriter/Typewriter.styles.js +56 -18
- package/lib/esm/components/typewriter/Typewriter.styles.js.map +1 -1
- package/lib/esm/index.js +1 -0
- package/lib/esm/index.js.map +1 -1
- package/lib/esm/types/cursor.js +6 -0
- package/lib/esm/types/cursor.js.map +1 -0
- package/lib/types/components/typewriter/Typewriter.d.ts +25 -0
- package/lib/types/components/typewriter/Typewriter.styles.d.ts +10 -3
- package/lib/types/index.d.ts +1 -0
- package/lib/types/types/cursor.d.ts +4 -0
- package/package.json +4 -4
|
@@ -9,9 +9,10 @@ var _chaynsApi = require("chayns-api");
|
|
|
9
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
10
|
var _reactDom = require("react-dom");
|
|
11
11
|
var _server = require("react-dom/server");
|
|
12
|
+
var _cursor = require("../../types/cursor");
|
|
13
|
+
var _AnimatedTypewriterText = _interopRequireDefault(require("./AnimatedTypewriterText"));
|
|
12
14
|
var _Typewriter = require("./Typewriter.styles");
|
|
13
15
|
var _utils = require("./utils");
|
|
14
|
-
var _AnimatedTypewriterText = _interopRequireDefault(require("./AnimatedTypewriterText"));
|
|
15
16
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
17
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
17
18
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
@@ -37,8 +38,13 @@ let TypewriterSpeed = exports.TypewriterSpeed = /*#__PURE__*/function (Typewrite
|
|
|
37
38
|
}({});
|
|
38
39
|
const Typewriter = ({
|
|
39
40
|
children,
|
|
41
|
+
cursorType = _cursor.CursorType.Default,
|
|
40
42
|
nextTextDelay = TypewriterDelay.Medium,
|
|
41
43
|
onFinish,
|
|
44
|
+
onResetAnimationEnd,
|
|
45
|
+
onResetAnimationStart,
|
|
46
|
+
onTypingAnimationEnd,
|
|
47
|
+
onTypingAnimationStart,
|
|
42
48
|
pseudoChildren,
|
|
43
49
|
resetDelay = TypewriterDelay.Medium,
|
|
44
50
|
shouldForceCursorAnimation = false,
|
|
@@ -54,6 +60,7 @@ const Typewriter = ({
|
|
|
54
60
|
}) => {
|
|
55
61
|
const [currentChildrenIndex, setCurrentChildrenIndex] = (0, _react.useState)(0);
|
|
56
62
|
const [hasRenderedChildrenOnce, setHasRenderedChildrenOnce] = (0, _react.useState)(false);
|
|
63
|
+
const [shouldPreventBlinkingCursor, setShouldPreventBlinkingCursor] = (0, _react.useState)(false);
|
|
57
64
|
const functions = (0, _chaynsApi.useFunctions)();
|
|
58
65
|
const values = (0, _chaynsApi.useValues)();
|
|
59
66
|
useIsomorphicLayoutEffect(() => {
|
|
@@ -121,11 +128,17 @@ const Typewriter = ({
|
|
|
121
128
|
if (shouldStopAnimation || charactersCount === 0) {
|
|
122
129
|
setShownCharCount(textContent.length);
|
|
123
130
|
} else if (isResetAnimationActive) {
|
|
131
|
+
if (typeof onResetAnimationStart === 'function') {
|
|
132
|
+
onResetAnimationStart();
|
|
133
|
+
}
|
|
124
134
|
interval = window.setInterval(() => {
|
|
125
135
|
setShownCharCount(prevState => {
|
|
126
136
|
const nextState = prevState - 1;
|
|
127
137
|
if (nextState === 0) {
|
|
128
138
|
window.clearInterval(interval);
|
|
139
|
+
if (typeof onResetAnimationEnd === 'function') {
|
|
140
|
+
onResetAnimationEnd();
|
|
141
|
+
}
|
|
129
142
|
if (areMultipleChildrenGiven) {
|
|
130
143
|
setTimeout(() => {
|
|
131
144
|
setIsResetAnimationActive(false);
|
|
@@ -138,11 +151,23 @@ const Typewriter = ({
|
|
|
138
151
|
}, resetSpeed);
|
|
139
152
|
} else {
|
|
140
153
|
const setInterval = () => {
|
|
154
|
+
if (cursorType === _cursor.CursorType.Thin) {
|
|
155
|
+
setShouldPreventBlinkingCursor(true);
|
|
156
|
+
}
|
|
157
|
+
if (typeof onTypingAnimationStart === 'function') {
|
|
158
|
+
onTypingAnimationStart();
|
|
159
|
+
}
|
|
141
160
|
interval = window.setInterval(() => {
|
|
142
161
|
setShownCharCount(prevState => {
|
|
143
162
|
let nextState = Math.min(prevState + 1, charactersCount);
|
|
144
163
|
if (nextState >= charactersCount && !shouldWaitForContent) {
|
|
145
164
|
window.clearInterval(interval);
|
|
165
|
+
if (cursorType === _cursor.CursorType.Thin) {
|
|
166
|
+
setShouldPreventBlinkingCursor(false);
|
|
167
|
+
}
|
|
168
|
+
if (typeof onTypingAnimationEnd === 'function') {
|
|
169
|
+
onTypingAnimationEnd();
|
|
170
|
+
}
|
|
146
171
|
|
|
147
172
|
/**
|
|
148
173
|
* At this point, the next value for "shownCharCount" is deliberately set to
|
|
@@ -174,7 +199,7 @@ const Typewriter = ({
|
|
|
174
199
|
return () => {
|
|
175
200
|
window.clearInterval(interval);
|
|
176
201
|
};
|
|
177
|
-
}, [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]);
|
|
178
203
|
(0, _react.useEffect)(() => {
|
|
179
204
|
if (!isAnimatingText && typeof onFinish === 'function') {
|
|
180
205
|
onFinish();
|
|
@@ -205,9 +230,11 @@ const Typewriter = ({
|
|
|
205
230
|
return textContent || '​';
|
|
206
231
|
}, [functions, pseudoChildren, shouldUseAnimationHeight, shownCharCount, textContent, values]);
|
|
207
232
|
return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_Typewriter.StyledTypewriter, {
|
|
233
|
+
$cursorType: cursorType,
|
|
208
234
|
onClick: isAnimatingText ? handleClick : undefined,
|
|
209
235
|
$isAnimatingText: isAnimatingText,
|
|
210
|
-
$shouldHideCursor: shouldHideCursor
|
|
236
|
+
$shouldHideCursor: shouldHideCursor,
|
|
237
|
+
$shouldPreventBlinkAnimation: shouldPreventBlinkingCursor
|
|
211
238
|
}, isAnimatingText ? /*#__PURE__*/_react.default.createElement(_AnimatedTypewriterText.default, {
|
|
212
239
|
shouldHideCursor: shouldHideCursor,
|
|
213
240
|
shownText: shownText,
|
|
@@ -215,6 +242,8 @@ const Typewriter = ({
|
|
|
215
242
|
}) : /*#__PURE__*/_react.default.createElement(_Typewriter.StyledTypewriterText, {
|
|
216
243
|
style: textStyle
|
|
217
244
|
}, sortedChildren), isAnimatingText && /*#__PURE__*/_react.default.createElement(_Typewriter.StyledTypewriterPseudoText, {
|
|
245
|
+
$isAnimatingText: isAnimatingText,
|
|
246
|
+
$shouldHideCursor: shouldHideCursor,
|
|
218
247
|
dangerouslySetInnerHTML: {
|
|
219
248
|
__html: pseudoTextHTML
|
|
220
249
|
}
|
|
@@ -223,7 +252,7 @@ const Typewriter = ({
|
|
|
223
252
|
position: 'absolute',
|
|
224
253
|
visibility: 'hidden'
|
|
225
254
|
}
|
|
226
|
-
}, children), document.body)), [children, handleClick, hasRenderedChildrenOnce, isAnimatingText, pseudoTextHTML, shouldHideCursor, shownText, sortedChildren, textStyle]);
|
|
255
|
+
}, children), document.body)), [children, cursorType, handleClick, hasRenderedChildrenOnce, isAnimatingText, pseudoTextHTML, shouldHideCursor, shouldPreventBlinkingCursor, shownText, sortedChildren, textStyle]);
|
|
227
256
|
};
|
|
228
257
|
Typewriter.displayName = 'Typewriter';
|
|
229
258
|
var _default = exports.default = Typewriter;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Typewriter.js","names":["_core","require","_chaynsApi","_react","_interopRequireWildcard","_reactDom","_server","_Typewriter","_utils","_AnimatedTypewriterText","_interopRequireDefault","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","nextTextDelay","Medium","onFinish","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","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 useRef,\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';\nimport AnimatedTypewriterText from \"./AnimatedTypewriterText\";\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 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 * 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 nextTextDelay = TypewriterDelay.Medium,\n onFinish,\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 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 }, nextTextDelay);\n }\n }\n\n return nextState;\n });\n }, resetSpeed);\n } else {\n const setInterval = () => {\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 /**\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 }, [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 || '​';\n }, [functions, pseudoChildren, shouldUseAnimationHeight, shownCharCount, textContent, values]);\n\n return useMemo(\n () => (\n <StyledTypewriter\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 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 || '​';\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":[]}
|
|
@@ -5,26 +5,48 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.StyledTypewriterText = exports.StyledTypewriterPseudoText = exports.StyledTypewriter = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
8
|
+
var _cursor = require("../../types/cursor");
|
|
8
9
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
9
10
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
10
11
|
const typewriterCursorElement = ({
|
|
12
|
+
$cursorType,
|
|
11
13
|
$isAnimatingText,
|
|
12
|
-
$shouldHideCursor
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
14
|
+
$shouldHideCursor,
|
|
15
|
+
$shouldPreventBlinkAnimation
|
|
16
|
+
}) => {
|
|
17
|
+
if (!$isAnimatingText || $shouldHideCursor) {
|
|
18
|
+
return '';
|
|
19
|
+
}
|
|
20
|
+
if ($cursorType === _cursor.CursorType.Thin) {
|
|
21
|
+
return (0, _styledComponents.css)`
|
|
22
|
+
.typewriter-lastWithContent {
|
|
23
|
+
&:after {
|
|
24
|
+
animation: ${$shouldPreventBlinkAnimation ? 'none' : blinkAnimation} 1s steps(2, start) infinite;
|
|
25
|
+
color: inherit;
|
|
26
|
+
content: '|';
|
|
27
|
+
font-size: 25px;
|
|
28
|
+
position: relative;
|
|
29
|
+
line-height: 0;
|
|
30
|
+
vertical-align: baseline;
|
|
31
|
+
}
|
|
32
|
+
`;
|
|
33
|
+
}
|
|
34
|
+
return (0, _styledComponents.css)`
|
|
35
|
+
.typewriter-lastWithContent {
|
|
36
|
+
&:after {
|
|
37
|
+
animation: ${blinkAnimation} 1s steps(2, start) infinite;
|
|
38
|
+
color: ${({
|
|
39
|
+
theme
|
|
40
|
+
}) => theme.text};
|
|
41
|
+
content: '▋';
|
|
42
|
+
margin-left: 0.25rem;
|
|
43
|
+
opacity: 0.85;
|
|
44
|
+
position: relative;
|
|
45
|
+
vertical-align: baseline;
|
|
46
|
+
}
|
|
25
47
|
}
|
|
26
|
-
}
|
|
27
48
|
`;
|
|
49
|
+
};
|
|
28
50
|
const StyledTypewriter = exports.StyledTypewriter = _styledComponents.default.div`
|
|
29
51
|
align-items: inherit;
|
|
30
52
|
display: flex;
|
|
@@ -41,14 +63,29 @@ const StyledTypewriterPseudoText = exports.StyledTypewriterPseudoText = _styledC
|
|
|
41
63
|
opacity: 0;
|
|
42
64
|
pointer-events: none;
|
|
43
65
|
user-select: none;
|
|
44
|
-
width:
|
|
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
|
+
`}
|
|
45
82
|
`;
|
|
46
83
|
const StyledTypewriterText = exports.StyledTypewriterText = _styledComponents.default.span`
|
|
47
84
|
color: inherit;
|
|
48
85
|
position: ${({
|
|
49
86
|
$isAnimatingText
|
|
50
87
|
}) => $isAnimatingText ? 'absolute' : 'relative'};
|
|
51
|
-
width:
|
|
88
|
+
width: fit-content;
|
|
52
89
|
|
|
53
90
|
${({
|
|
54
91
|
$isAnimatingText
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Typewriter.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","typewriterCursorElement","$isAnimatingText","$shouldHideCursor","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';\n\nconst typewriterCursorElement = ({\n $isAnimatingText,\n $shouldHideCursor,\n}: {\n
|
|
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":[]}
|
package/lib/cjs/index.js
CHANGED
|
@@ -3,6 +3,12 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
+
Object.defineProperty(exports, "CursorType", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _cursor.CursorType;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
6
12
|
Object.defineProperty(exports, "Typewriter", {
|
|
7
13
|
enumerable: true,
|
|
8
14
|
get: function () {
|
|
@@ -22,6 +28,7 @@ Object.defineProperty(exports, "TypewriterSpeed", {
|
|
|
22
28
|
}
|
|
23
29
|
});
|
|
24
30
|
var _Typewriter = _interopRequireWildcard(require("./components/typewriter/Typewriter"));
|
|
31
|
+
var _cursor = require("./types/cursor");
|
|
25
32
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
26
33
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
27
34
|
//# sourceMappingURL=index.js.map
|
package/lib/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_Typewriter","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set"],"sources":["../../src/index.ts"],"sourcesContent":["export {\n default as Typewriter,\n TypewriterDelay,\n TypewriterSpeed,\n} from './components/typewriter/Typewriter';\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","names":["_Typewriter","_interopRequireWildcard","require","_cursor","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set"],"sources":["../../src/index.ts"],"sourcesContent":["export {\n default as Typewriter,\n TypewriterDelay,\n TypewriterSpeed,\n} from './components/typewriter/Typewriter';\nexport { CursorType } from './types/cursor';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,WAAA,GAAAC,uBAAA,CAAAC,OAAA;AAKA,IAAAC,OAAA,GAAAD,OAAA;AAA4C,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","ignoreList":[]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.CursorType = void 0;
|
|
7
|
+
let CursorType = exports.CursorType = /*#__PURE__*/function (CursorType) {
|
|
8
|
+
CursorType["Default"] = "default";
|
|
9
|
+
CursorType["Thin"] = "thin";
|
|
10
|
+
return CursorType;
|
|
11
|
+
}({});
|
|
12
|
+
//# sourceMappingURL=cursor.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cursor.js","names":["CursorType","exports"],"sources":["../../../src/types/cursor.ts"],"sourcesContent":["export enum CursorType {\n Default = 'default',\n Thin = 'thin',\n}\n"],"mappings":";;;;;;IAAYA,UAAU,GAAAC,OAAA,CAAAD,UAAA,0BAAVA,UAAU;EAAVA,UAAU;EAAVA,UAAU;EAAA,OAAVA,UAAU;AAAA","ignoreList":[]}
|
|
@@ -3,9 +3,10 @@ import { ChaynsProvider, useFunctions, useValues } from 'chayns-api';
|
|
|
3
3
|
import React, { useCallback, useEffect, useLayoutEffect, useMemo, useState } from 'react';
|
|
4
4
|
import { createPortal } from 'react-dom';
|
|
5
5
|
import { renderToString } from 'react-dom/server';
|
|
6
|
+
import { CursorType } from '../../types/cursor';
|
|
7
|
+
import AnimatedTypewriterText from './AnimatedTypewriterText';
|
|
6
8
|
import { StyledTypewriter, StyledTypewriterPseudoText, StyledTypewriterText } from './Typewriter.styles';
|
|
7
9
|
import { getCharactersCount, getSubTextFromHTML, shuffleArray } from './utils';
|
|
8
|
-
import AnimatedTypewriterText from "./AnimatedTypewriterText";
|
|
9
10
|
const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
|
|
10
11
|
|
|
11
12
|
// noinspection JSUnusedGlobalSymbols
|
|
@@ -31,8 +32,13 @@ export let TypewriterSpeed = /*#__PURE__*/function (TypewriterSpeed) {
|
|
|
31
32
|
const Typewriter = _ref => {
|
|
32
33
|
let {
|
|
33
34
|
children,
|
|
35
|
+
cursorType = CursorType.Default,
|
|
34
36
|
nextTextDelay = TypewriterDelay.Medium,
|
|
35
37
|
onFinish,
|
|
38
|
+
onResetAnimationEnd,
|
|
39
|
+
onResetAnimationStart,
|
|
40
|
+
onTypingAnimationEnd,
|
|
41
|
+
onTypingAnimationStart,
|
|
36
42
|
pseudoChildren,
|
|
37
43
|
resetDelay = TypewriterDelay.Medium,
|
|
38
44
|
shouldForceCursorAnimation = false,
|
|
@@ -48,6 +54,7 @@ const Typewriter = _ref => {
|
|
|
48
54
|
} = _ref;
|
|
49
55
|
const [currentChildrenIndex, setCurrentChildrenIndex] = useState(0);
|
|
50
56
|
const [hasRenderedChildrenOnce, setHasRenderedChildrenOnce] = useState(false);
|
|
57
|
+
const [shouldPreventBlinkingCursor, setShouldPreventBlinkingCursor] = useState(false);
|
|
51
58
|
const functions = useFunctions();
|
|
52
59
|
const values = useValues();
|
|
53
60
|
useIsomorphicLayoutEffect(() => {
|
|
@@ -115,11 +122,17 @@ const Typewriter = _ref => {
|
|
|
115
122
|
if (shouldStopAnimation || charactersCount === 0) {
|
|
116
123
|
setShownCharCount(textContent.length);
|
|
117
124
|
} else if (isResetAnimationActive) {
|
|
125
|
+
if (typeof onResetAnimationStart === 'function') {
|
|
126
|
+
onResetAnimationStart();
|
|
127
|
+
}
|
|
118
128
|
interval = window.setInterval(() => {
|
|
119
129
|
setShownCharCount(prevState => {
|
|
120
130
|
const nextState = prevState - 1;
|
|
121
131
|
if (nextState === 0) {
|
|
122
132
|
window.clearInterval(interval);
|
|
133
|
+
if (typeof onResetAnimationEnd === 'function') {
|
|
134
|
+
onResetAnimationEnd();
|
|
135
|
+
}
|
|
123
136
|
if (areMultipleChildrenGiven) {
|
|
124
137
|
setTimeout(() => {
|
|
125
138
|
setIsResetAnimationActive(false);
|
|
@@ -132,11 +145,23 @@ const Typewriter = _ref => {
|
|
|
132
145
|
}, resetSpeed);
|
|
133
146
|
} else {
|
|
134
147
|
const setInterval = () => {
|
|
148
|
+
if (cursorType === CursorType.Thin) {
|
|
149
|
+
setShouldPreventBlinkingCursor(true);
|
|
150
|
+
}
|
|
151
|
+
if (typeof onTypingAnimationStart === 'function') {
|
|
152
|
+
onTypingAnimationStart();
|
|
153
|
+
}
|
|
135
154
|
interval = window.setInterval(() => {
|
|
136
155
|
setShownCharCount(prevState => {
|
|
137
156
|
let nextState = Math.min(prevState + 1, charactersCount);
|
|
138
157
|
if (nextState >= charactersCount && !shouldWaitForContent) {
|
|
139
158
|
window.clearInterval(interval);
|
|
159
|
+
if (cursorType === CursorType.Thin) {
|
|
160
|
+
setShouldPreventBlinkingCursor(false);
|
|
161
|
+
}
|
|
162
|
+
if (typeof onTypingAnimationEnd === 'function') {
|
|
163
|
+
onTypingAnimationEnd();
|
|
164
|
+
}
|
|
140
165
|
|
|
141
166
|
/**
|
|
142
167
|
* At this point, the next value for "shownCharCount" is deliberately set to
|
|
@@ -168,7 +193,7 @@ const Typewriter = _ref => {
|
|
|
168
193
|
return () => {
|
|
169
194
|
window.clearInterval(interval);
|
|
170
195
|
};
|
|
171
|
-
}, [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]);
|
|
172
197
|
useEffect(() => {
|
|
173
198
|
if (!isAnimatingText && typeof onFinish === 'function') {
|
|
174
199
|
onFinish();
|
|
@@ -199,9 +224,11 @@ const Typewriter = _ref => {
|
|
|
199
224
|
return textContent || '​';
|
|
200
225
|
}, [functions, pseudoChildren, shouldUseAnimationHeight, shownCharCount, textContent, values]);
|
|
201
226
|
return useMemo(() => /*#__PURE__*/React.createElement(StyledTypewriter, {
|
|
227
|
+
$cursorType: cursorType,
|
|
202
228
|
onClick: isAnimatingText ? handleClick : undefined,
|
|
203
229
|
$isAnimatingText: isAnimatingText,
|
|
204
|
-
$shouldHideCursor: shouldHideCursor
|
|
230
|
+
$shouldHideCursor: shouldHideCursor,
|
|
231
|
+
$shouldPreventBlinkAnimation: shouldPreventBlinkingCursor
|
|
205
232
|
}, isAnimatingText ? /*#__PURE__*/React.createElement(AnimatedTypewriterText, {
|
|
206
233
|
shouldHideCursor: shouldHideCursor,
|
|
207
234
|
shownText: shownText,
|
|
@@ -209,6 +236,8 @@ const Typewriter = _ref => {
|
|
|
209
236
|
}) : /*#__PURE__*/React.createElement(StyledTypewriterText, {
|
|
210
237
|
style: textStyle
|
|
211
238
|
}, sortedChildren), isAnimatingText && /*#__PURE__*/React.createElement(StyledTypewriterPseudoText, {
|
|
239
|
+
$isAnimatingText: isAnimatingText,
|
|
240
|
+
$shouldHideCursor: shouldHideCursor,
|
|
212
241
|
dangerouslySetInnerHTML: {
|
|
213
242
|
__html: pseudoTextHTML
|
|
214
243
|
}
|
|
@@ -217,7 +246,7 @@ const Typewriter = _ref => {
|
|
|
217
246
|
position: 'absolute',
|
|
218
247
|
visibility: 'hidden'
|
|
219
248
|
}
|
|
220
|
-
}, children), document.body)), [children, handleClick, hasRenderedChildrenOnce, isAnimatingText, pseudoTextHTML, shouldHideCursor, shownText, sortedChildren, textStyle]);
|
|
249
|
+
}, children), document.body)), [children, cursorType, handleClick, hasRenderedChildrenOnce, isAnimatingText, pseudoTextHTML, shouldHideCursor, shouldPreventBlinkingCursor, shownText, sortedChildren, textStyle]);
|
|
221
250
|
};
|
|
222
251
|
Typewriter.displayName = 'Typewriter';
|
|
223
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","StyledTypewriter","StyledTypewriterPseudoText","StyledTypewriterText","getCharactersCount","getSubTextFromHTML","shuffleArray","AnimatedTypewriterText","useIsomorphicLayoutEffect","window","TypewriterDelay","TypewriterSpeed","Typewriter","_ref","children","nextTextDelay","Medium","onFinish","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","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 useRef,\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';\nimport AnimatedTypewriterText from \"./AnimatedTypewriterText\";\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 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 * 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 nextTextDelay = TypewriterDelay.Medium,\n onFinish,\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 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 }, nextTextDelay);\n }\n }\n\n return nextState;\n });\n }, resetSpeed);\n } else {\n const setInterval = () => {\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 /**\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 }, [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 || '​';\n }, [functions, pseudoChildren, shouldUseAnimationHeight, shownCharCount, textContent, values]);\n\n return useMemo(\n () => (\n <StyledTypewriter\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 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 || '​';\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":[]}
|
|
@@ -1,26 +1,46 @@
|
|
|
1
1
|
import styled, { css, keyframes } from 'styled-components';
|
|
2
|
+
import { CursorType } from '../../types/cursor';
|
|
2
3
|
const typewriterCursorElement = _ref => {
|
|
3
4
|
let {
|
|
5
|
+
$cursorType,
|
|
4
6
|
$isAnimatingText,
|
|
5
|
-
$shouldHideCursor
|
|
7
|
+
$shouldHideCursor,
|
|
8
|
+
$shouldPreventBlinkAnimation
|
|
6
9
|
} = _ref;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
10
|
+
if (!$isAnimatingText || $shouldHideCursor) {
|
|
11
|
+
return '';
|
|
12
|
+
}
|
|
13
|
+
if ($cursorType === CursorType.Thin) {
|
|
14
|
+
return css`
|
|
15
|
+
.typewriter-lastWithContent {
|
|
16
|
+
&:after {
|
|
17
|
+
animation: ${$shouldPreventBlinkAnimation ? 'none' : blinkAnimation} 1s steps(2, start) infinite;
|
|
18
|
+
color: inherit;
|
|
19
|
+
content: '|';
|
|
20
|
+
font-size: 25px;
|
|
21
|
+
position: relative;
|
|
22
|
+
line-height: 0;
|
|
23
|
+
vertical-align: baseline;
|
|
24
|
+
}
|
|
25
|
+
`;
|
|
26
|
+
}
|
|
27
|
+
return css`
|
|
28
|
+
.typewriter-lastWithContent {
|
|
29
|
+
&:after {
|
|
30
|
+
animation: ${blinkAnimation} 1s steps(2, start) infinite;
|
|
31
|
+
color: ${_ref2 => {
|
|
12
32
|
let {
|
|
13
33
|
theme
|
|
14
34
|
} = _ref2;
|
|
15
35
|
return theme.text;
|
|
16
36
|
}};
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
37
|
+
content: '▋';
|
|
38
|
+
margin-left: 0.25rem;
|
|
39
|
+
opacity: 0.85;
|
|
40
|
+
position: relative;
|
|
41
|
+
vertical-align: baseline;
|
|
42
|
+
}
|
|
22
43
|
}
|
|
23
|
-
}
|
|
24
44
|
`;
|
|
25
45
|
};
|
|
26
46
|
export const StyledTypewriter = styled.div`
|
|
@@ -39,22 +59,40 @@ export const StyledTypewriterPseudoText = styled.span`
|
|
|
39
59
|
opacity: 0;
|
|
40
60
|
pointer-events: none;
|
|
41
61
|
user-select: none;
|
|
42
|
-
width:
|
|
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
|
+
}}
|
|
43
81
|
`;
|
|
44
82
|
export const StyledTypewriterText = styled.span`
|
|
45
83
|
color: inherit;
|
|
46
|
-
position: ${
|
|
84
|
+
position: ${_ref4 => {
|
|
47
85
|
let {
|
|
48
86
|
$isAnimatingText
|
|
49
|
-
} =
|
|
87
|
+
} = _ref4;
|
|
50
88
|
return $isAnimatingText ? 'absolute' : 'relative';
|
|
51
89
|
}};
|
|
52
|
-
width:
|
|
90
|
+
width: fit-content;
|
|
53
91
|
|
|
54
|
-
${
|
|
92
|
+
${_ref5 => {
|
|
55
93
|
let {
|
|
56
94
|
$isAnimatingText
|
|
57
|
-
} =
|
|
95
|
+
} = _ref5;
|
|
58
96
|
return $isAnimatingText && css`
|
|
59
97
|
pointer-events: none;
|
|
60
98
|
`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Typewriter.styles.js","names":["styled","css","keyframes","typewriterCursorElement","_ref","$isAnimatingText","$shouldHideCursor","blinkAnimation","_ref2","theme","text","StyledTypewriter","div","StyledTypewriterPseudoText","span","
|
|
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":[]}
|
package/lib/esm/index.js
CHANGED
package/lib/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["default","Typewriter","TypewriterDelay","TypewriterSpeed"],"sources":["../../src/index.ts"],"sourcesContent":["export {\n default as Typewriter,\n TypewriterDelay,\n TypewriterSpeed,\n} from './components/typewriter/Typewriter';\n"],"mappings":"AAAA,SACIA,OAAO,IAAIC,UAAU,EACrBC,eAAe,EACfC,eAAe,QACZ,oCAAoC","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["default","Typewriter","TypewriterDelay","TypewriterSpeed","CursorType"],"sources":["../../src/index.ts"],"sourcesContent":["export {\n default as Typewriter,\n TypewriterDelay,\n TypewriterSpeed,\n} from './components/typewriter/Typewriter';\nexport { CursorType } from './types/cursor';\n"],"mappings":"AAAA,SACIA,OAAO,IAAIC,UAAU,EACrBC,eAAe,EACfC,eAAe,QACZ,oCAAoC;AAC3C,SAASC,UAAU,QAAQ,gBAAgB","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cursor.js","names":["CursorType"],"sources":["../../../src/types/cursor.ts"],"sourcesContent":["export enum CursorType {\n Default = 'default',\n Thin = 'thin',\n}\n"],"mappings":"AAAA,WAAYA,UAAU,0BAAVA,UAAU;EAAVA,UAAU;EAAVA,UAAU;EAAA,OAAVA,UAAU;AAAA","ignoreList":[]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React, { FC, ReactElement } from 'react';
|
|
2
|
+
import { CursorType } from '../../types/cursor';
|
|
2
3
|
export declare enum TypewriterDelay {
|
|
3
4
|
ExtraSlow = 4000,
|
|
4
5
|
Slow = 2000,
|
|
@@ -19,6 +20,10 @@ export type TypewriterProps = {
|
|
|
19
20
|
* The text to type
|
|
20
21
|
*/
|
|
21
22
|
children: ReactElement | ReactElement[] | string | string[];
|
|
23
|
+
/**
|
|
24
|
+
* The type of the cursor. Use the CursorType enum for this prop.
|
|
25
|
+
*/
|
|
26
|
+
cursorType?: CursorType;
|
|
22
27
|
/**
|
|
23
28
|
* The delay in milliseconds before the next text is shown.
|
|
24
29
|
* This prop is only used if multiple texts are given.
|
|
@@ -29,6 +34,26 @@ export type TypewriterProps = {
|
|
|
29
34
|
* be executed if multiple texts are used.
|
|
30
35
|
*/
|
|
31
36
|
onFinish?: VoidFunction;
|
|
37
|
+
/**
|
|
38
|
+
* Function that is executed when the reset animation has finished. This function will not be
|
|
39
|
+
* executed if `shouldUseResetAnimation` is not set to `true`.
|
|
40
|
+
*/
|
|
41
|
+
onResetAnimationEnd?: VoidFunction;
|
|
42
|
+
/**
|
|
43
|
+
* Function that is executed when the reset animation has started. This function will not be
|
|
44
|
+
* executed if `shouldUseResetAnimation` is not set to `true`.
|
|
45
|
+
*/
|
|
46
|
+
onResetAnimationStart?: VoidFunction;
|
|
47
|
+
/**
|
|
48
|
+
* Function that is executed when the typing animation has finished. If multiple texts are given,
|
|
49
|
+
* this function will be executed for each text.
|
|
50
|
+
*/
|
|
51
|
+
onTypingAnimationEnd?: VoidFunction;
|
|
52
|
+
/**
|
|
53
|
+
* Function that is executed when the typing animation has started. If multiple texts are given,
|
|
54
|
+
* this function will be executed for each text.
|
|
55
|
+
*/
|
|
56
|
+
onTypingAnimationStart?: VoidFunction;
|
|
32
57
|
/**
|
|
33
58
|
* Pseudo-element to be rendered invisible during animation to define the size of the element
|
|
34
59
|
* for the typewriter effect. By default, the "children" is used for this purpose.
|
|
@@ -1,10 +1,17 @@
|
|
|
1
1
|
import type { WithTheme } from '@chayns-components/core';
|
|
2
|
+
import type { TypewriterProps } from './Typewriter';
|
|
2
3
|
type StyledTypewriterProps = WithTheme<{
|
|
3
|
-
$
|
|
4
|
-
$
|
|
4
|
+
$cursorType: TypewriterProps['cursorType'];
|
|
5
|
+
$isAnimatingText: boolean;
|
|
6
|
+
$shouldHideCursor: TypewriterProps['shouldHideCursor'];
|
|
7
|
+
$shouldPreventBlinkAnimation: boolean;
|
|
5
8
|
}>;
|
|
6
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;
|
|
7
|
-
|
|
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;
|
|
8
15
|
type StyledTypewriterTextProps = WithTheme<{
|
|
9
16
|
$isAnimatingText?: boolean;
|
|
10
17
|
}>;
|
package/lib/types/index.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/typewriter",
|
|
3
|
-
"version": "5.0.0-beta.
|
|
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": [
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
"@babel/preset-env": "^7.26.0",
|
|
57
57
|
"@babel/preset-react": "^7.26.3",
|
|
58
58
|
"@babel/preset-typescript": "^7.26.0",
|
|
59
|
-
"@types/react": "^18.3.
|
|
59
|
+
"@types/react": "^18.3.18",
|
|
60
60
|
"@types/react-dom": "^18.3.5",
|
|
61
61
|
"@types/styled-components": "^5.1.34",
|
|
62
62
|
"@types/uuid": "^10.0.0",
|
|
@@ -69,7 +69,7 @@
|
|
|
69
69
|
"typescript": "^5.7.2"
|
|
70
70
|
},
|
|
71
71
|
"dependencies": {
|
|
72
|
-
"@chayns-components/core": "^5.0.0-beta.
|
|
72
|
+
"@chayns-components/core": "^5.0.0-beta.940"
|
|
73
73
|
},
|
|
74
74
|
"peerDependencies": {
|
|
75
75
|
"chayns-api": ">=1.0.73",
|
|
@@ -81,5 +81,5 @@
|
|
|
81
81
|
"publishConfig": {
|
|
82
82
|
"access": "public"
|
|
83
83
|
},
|
|
84
|
-
"gitHead": "
|
|
84
|
+
"gitHead": "380e32862d38e6d3ac36ddb61a79dcb9116bc75b"
|
|
85
85
|
}
|