@lobehub/ui 5.7.1 → 5.9.0

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.
Files changed (13) hide show
  1. package/es/EmojiPicker/EmojiPicker.mjs +24 -2
  2. package/es/EmojiPicker/EmojiPicker.mjs.map +1 -1
  3. package/es/EmojiPicker/type.d.mts +1 -0
  4. package/es/Markdown/SyntaxMarkdown/StreamdownRender.mjs +39 -44
  5. package/es/Markdown/SyntaxMarkdown/StreamdownRender.mjs.map +1 -1
  6. package/es/Markdown/SyntaxMarkdown/streamAnimationMeta.mjs +3 -7
  7. package/es/Markdown/SyntaxMarkdown/streamAnimationMeta.mjs.map +1 -1
  8. package/es/Markdown/plugins/rehypeStreamAnimated.d.mts +2 -3
  9. package/es/Markdown/plugins/rehypeStreamAnimated.mjs +10 -12
  10. package/es/Markdown/plugins/rehypeStreamAnimated.mjs.map +1 -1
  11. package/es/awesome/GridBackground/components/Grid.mjs +15 -33
  12. package/es/awesome/GridBackground/components/Grid.mjs.map +1 -1
  13. package/package.json +1 -1
package/es/EmojiPicker/EmojiPicker.mjs CHANGED
@@ -18,10 +18,11 @@ import { SmileIcon, TrashIcon, UploadIcon } from "lucide-react";
18
18
  import chroma from "chroma-js";
19
19
  import data from "@emoji-mart/data";
20
20
  import Picker from "@emoji-mart/react";
21
+ import { getLobeIconCDN, toc } from "@lobehub/icons";
21
22
  import useSWR from "swr";
22
23
  //#region src/EmojiPicker/EmojiPicker.tsx
23
24
  const DEFAULT_AVATAR = "🤖";
24
- const EmojiPicker = memo(({ value, defaultAvatar = DEFAULT_AVATAR, onChange, locale = "en-US", allowUpload, allowDelete, texts, onDelete, compressSize = 256, customEmojis, className, loading, onUpload, customTabs = [], popupClassName, popupStyle, customRender, open, defaultOpen = false, onOpenChange, popupProps, shape, contentProps, ...rest }) => {
25
+ const EmojiPicker = memo(({ value, defaultAvatar = DEFAULT_AVATAR, onChange, locale = "en-US", allowUpload, allowDelete, allowModelAvatar, texts, onDelete, compressSize = 256, customEmojis, className, loading, onUpload, customTabs = [], popupClassName, popupStyle, customRender, open, defaultOpen = false, onOpenChange, popupProps, shape, contentProps, ...rest }) => {
25
26
  const ref = useRef(null);
26
27
  const { t } = useTranslation(emojiPicker_default);
27
28
  const [visible, setVisible] = useMergeState(defaultOpen, {
@@ -48,6 +49,27 @@ const EmojiPicker = memo(({ value, defaultAvatar = DEFAULT_AVATAR, onChange, loc
48
49
  setAva(emoji);
49
50
  setVisible(false);
50
51
  };
52
+ const mergedCustomEmojis = useMemo(() => {
53
+ if (!allowModelAvatar) return customEmojis;
54
+ const modelEmojisCategory = {
55
+ id: "models",
56
+ name: "Models / Providers",
57
+ emojis: toc.filter((item) => item.group !== "application").map((item) => ({
58
+ id: item.id.toLowerCase(),
59
+ name: item.title,
60
+ keywords: [
61
+ item.title,
62
+ item.id,
63
+ item.fullTitle
64
+ ],
65
+ skins: [{ src: getLobeIconCDN(item.id, {
66
+ format: "avatar",
67
+ cdn: "aliyun"
68
+ }) }]
69
+ }))
70
+ };
71
+ return customEmojis ? [modelEmojisCategory, ...customEmojis] : [modelEmojisCategory];
72
+ }, [allowModelAvatar, customEmojis]);
51
73
  const emojiText = texts?.emoji ?? t("emojiPicker.emoji");
52
74
  const uploadText = texts?.upload ?? t("emojiPicker.upload");
53
75
  const deleteText = texts?.delete ?? t("emojiPicker.delete");
@@ -121,7 +143,7 @@ const EmojiPicker = memo(({ value, defaultAvatar = DEFAULT_AVATAR, onChange, loc
121
143
  })]
122
144
  }),
123
145
  tab === "emoji" && /* @__PURE__ */ jsx(Picker, {
124
- custom: customEmojis,
146
+ custom: mergedCustomEmojis,
125
147
  data,
126
148
  i18n,
127
149
  icons: "outline",
package/es/EmojiPicker/EmojiPicker.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"EmojiPicker.mjs","names":["emojiPickerMessages","Flexbox"],"sources":["../../src/EmojiPicker/EmojiPicker.tsx"],"sourcesContent":["'use client';\n\nimport data from '@emoji-mart/data';\nimport Picker from '@emoji-mart/react';\nimport { cx, useTheme } from 'antd-style';\nimport chroma from 'chroma-js';\nimport { SmileIcon, TrashIcon, UploadIcon } from 'lucide-react';\nimport { memo, useMemo, useRef, useState } from 'react';\nimport useSWR from 'swr';\nimport useMergeState from 'use-merge-value';\n\nimport ActionIcon from '@/ActionIcon';\nimport Avatar from '@/Avatar';\nimport { Flexbox } from '@/Flex';\nimport emojiPickerMessages from '@/i18n/resources/en/emojiPicker';\nimport { useTranslation } from '@/i18n/useTranslation';\nimport Icon from '@/Icon';\nimport Popover from '@/Popover';\nimport Tabs, { type TabsProps } from '@/Tabs';\nimport Tooltip from '@/Tooltip';\n\nimport AvatarUploader from './AvatarUploader';\nimport { styles } from './style';\nimport { type EmojiPickerProps } from './type';\n\nconst DEFAULT_AVATAR = '🤖';\n\nconst EmojiPicker = memo<EmojiPickerProps>(\n ({\n value,\n defaultAvatar = DEFAULT_AVATAR,\n onChange,\n locale = 'en-US',\n allowUpload,\n allowDelete,\n texts,\n onDelete,\n compressSize = 256,\n customEmojis,\n className,\n loading,\n onUpload,\n customTabs = [],\n popupClassName,\n popupStyle,\n customRender,\n open,\n defaultOpen = false,\n onOpenChange,\n popupProps,\n shape,\n contentProps,\n ...rest\n }) => {\n const ref = useRef<HTMLDivElement>(null);\n const { t } = useTranslation(emojiPickerMessages);\n const [visible, setVisible] = useMergeState(defaultOpen, {\n defaultValue: defaultOpen,\n onChange: onOpenChange,\n value: open,\n });\n const [tab, setTab] = useState<'emoji' | 'upload'>('emoji');\n\n const theme = useTheme();\n const pickerCssVariables = useMemo<Record<string, string>>(\n () => ({\n '--emoji-picker-rgb-accent': chroma(theme.colorPrimary).rgb().join(', '),\n '--emoji-picker-rgb-background': chroma(theme.colorBgElevated).rgb().join(', '),\n }),\n [theme.colorPrimary, theme.colorBgElevated],\n );\n\n const { data: i18n } = useSWR(\n locale,\n async () => await import(`@emoji-mart/data/i18n/${locale.split('-')[0]}.json`),\n { revalidateOnFocus: false, revalidateOnMount: false },\n );\n\n const [ava, setAva] = useMergeState(defaultAvatar, {\n defaultValue: defaultAvatar,\n onChange,\n value,\n });\n\n const handleAvatarChange = (emoji: string) => {\n setAva(emoji);\n setVisible(false);\n };\n\n const emojiText = texts?.emoji ?? t('emojiPicker.emoji');\n const uploadText = texts?.upload ?? t('emojiPicker.upload');\n const deleteText = texts?.delete ?? t('emojiPicker.delete');\n\n const hideEmojiTab = typeof allowUpload === 'object' && allowUpload?.enableEmoji === false;\n\n const items: TabsProps['items'] = [\n !hideEmojiTab && {\n key: 'emoji',\n label: (\n <Tooltip title={emojiText}>\n <Icon icon={SmileIcon} size={{ size: 20, strokeWidth: 2.5 }} />\n </Tooltip>\n ),\n },\n allowUpload && {\n key: 'upload',\n label: (\n <Tooltip title={uploadText}>\n <Icon icon={UploadIcon} size={{ size: 20, strokeWidth: 2.5 }} />\n </Tooltip>\n ),\n },\n ...customTabs.map((tab) => ({ key: tab.value, label: tab.label })),\n ].filter(Boolean) as TabsProps['items'];\n\n const showTabs = allowDelete || (items && items.length > 1);\n\n const content = (\n <Flexbox\n className={cx(styles.picker, popupClassName)}\n ref={ref}\n style={{\n minWidth: 310,\n paddingTop: showTabs ? 4 : 0,\n ...pickerCssVariables,\n ...popupStyle,\n }}\n {...contentProps}\n >\n {showTabs && (\n <Flexbox\n horizontal\n align={'center'}\n className={styles.tabs}\n justify={'space-between'}\n paddingInline={10}\n >\n <Tabs\n compact\n activeKey={tab}\n items={items}\n size={'small'}\n onChange={(key) => setTab(key as any)}\n />\n {allowDelete && (\n <ActionIcon\n icon={TrashIcon}\n title={deleteText}\n size={{\n blockSize: 32,\n size: 18,\n }}\n onClick={() => {\n handleAvatarChange(defaultAvatar);\n onDelete?.();\n }}\n />\n )}\n </Flexbox>\n )}\n {tab === 'emoji' && (\n <Picker\n custom={customEmojis}\n data={data}\n i18n={i18n}\n icons={'outline'}\n locale={locale.split('-')[0]}\n navPosition={showTabs ? 'bottom' : 'top'}\n previewPosition={'none'}\n skinTonePosition={'none'}\n theme={theme.isDarkMode ? 'dark' : 'light'}\n onEmojiSelect={(e: any) => handleAvatarChange(e.src || e.native)}\n />\n )}\n {tab === 'upload' && (\n <AvatarUploader\n compressSize={compressSize}\n shape={shape}\n texts={texts}\n onChange={handleAvatarChange}\n onUpload={onUpload}\n />\n )}\n {customTabs.map(\n (item) =>\n tab === item.value && (\n <Flexbox key={item.value} padding={10}>\n {item.render(handleAvatarChange)}\n </Flexbox>\n ),\n )}\n </Flexbox>\n );\n\n return (\n <Popover\n className={cx(styles.popover)}\n content={content}\n defaultOpen={defaultOpen}\n open={visible}\n placement={'bottom'}\n trigger={'click'}\n classNames={{\n content: styles.popover,\n root: styles.positioner,\n }}\n onOpenChange={(v) => {\n if (loading) return;\n setVisible(v);\n }}\n {...popupProps}\n >\n {customRender ? (\n customRender(ava)\n ) : (\n <Avatar\n avatar={ava}\n className={cx(styles.root, className)}\n loading={loading}\n shape={shape}\n {...rest}\n />\n )}\n </Popover>\n );\n },\n);\n\nEmojiPicker.displayName = 'EmojiPicker';\n\nexport default EmojiPicker;\n"],"mappings":"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"}
1
+ {"version":3,"file":"EmojiPicker.mjs","names":["emojiPickerMessages","Flexbox"],"sources":["../../src/EmojiPicker/EmojiPicker.tsx"],"sourcesContent":["'use client';\n\nimport data from '@emoji-mart/data';\nimport Picker from '@emoji-mart/react';\nimport { getLobeIconCDN, toc } from '@lobehub/icons';\nimport { cx, useTheme } from 'antd-style';\nimport chroma from 'chroma-js';\nimport { SmileIcon, TrashIcon, UploadIcon } from 'lucide-react';\nimport { memo, useMemo, useRef, useState } from 'react';\nimport useSWR from 'swr';\nimport useMergeState from 'use-merge-value';\n\nimport ActionIcon from '@/ActionIcon';\nimport Avatar from '@/Avatar';\nimport { Flexbox } from '@/Flex';\nimport emojiPickerMessages from '@/i18n/resources/en/emojiPicker';\nimport { useTranslation } from '@/i18n/useTranslation';\nimport Icon from '@/Icon';\nimport Popover from '@/Popover';\nimport Tabs, { type TabsProps } from '@/Tabs';\nimport Tooltip from '@/Tooltip';\n\nimport AvatarUploader from './AvatarUploader';\nimport { styles } from './style';\nimport { type EmojiPickerProps } from './type';\n\nconst DEFAULT_AVATAR = '🤖';\n\nconst EmojiPicker = memo<EmojiPickerProps>(\n ({\n value,\n defaultAvatar = DEFAULT_AVATAR,\n onChange,\n locale = 'en-US',\n allowUpload,\n allowDelete,\n allowModelAvatar,\n texts,\n onDelete,\n compressSize = 256,\n customEmojis,\n className,\n loading,\n onUpload,\n customTabs = [],\n popupClassName,\n popupStyle,\n customRender,\n open,\n defaultOpen = false,\n onOpenChange,\n popupProps,\n shape,\n contentProps,\n ...rest\n }) => {\n const ref = useRef<HTMLDivElement>(null);\n const { t } = useTranslation(emojiPickerMessages);\n const [visible, setVisible] = useMergeState(defaultOpen, {\n defaultValue: defaultOpen,\n onChange: onOpenChange,\n value: open,\n });\n const [tab, setTab] = useState<'emoji' | 'upload'>('emoji');\n\n const theme = useTheme();\n const pickerCssVariables = useMemo<Record<string, string>>(\n () => ({\n '--emoji-picker-rgb-accent': chroma(theme.colorPrimary).rgb().join(', '),\n '--emoji-picker-rgb-background': chroma(theme.colorBgElevated).rgb().join(', '),\n }),\n [theme.colorPrimary, theme.colorBgElevated],\n );\n\n const { data: i18n } = useSWR(\n locale,\n async () => await import(`@emoji-mart/data/i18n/${locale.split('-')[0]}.json`),\n { revalidateOnFocus: false, revalidateOnMount: false },\n );\n\n const [ava, setAva] = useMergeState(defaultAvatar, {\n defaultValue: defaultAvatar,\n onChange,\n value,\n });\n\n const handleAvatarChange = (emoji: string) => {\n setAva(emoji);\n setVisible(false);\n };\n\n // Generate model avatars from @lobehub/icons when allowModelAvatar is enabled\n const mergedCustomEmojis = useMemo(() => {\n if (!allowModelAvatar) return customEmojis;\n\n const modelIcons = toc.filter((item) => item.group !== 'application');\n\n const modelEmojisCategory = {\n id: 'models',\n name: 'Models / Providers',\n emojis: modelIcons.map((item) => ({\n id: item.id.toLowerCase(),\n name: item.title,\n keywords: [item.title, item.id, item.fullTitle],\n skins: [{ src: getLobeIconCDN(item.id, { format: 'avatar', cdn: 'aliyun' }) }],\n })),\n };\n\n return customEmojis ? [modelEmojisCategory, ...customEmojis] : [modelEmojisCategory];\n }, [allowModelAvatar, customEmojis]);\n\n const emojiText = texts?.emoji ?? t('emojiPicker.emoji');\n const uploadText = texts?.upload ?? t('emojiPicker.upload');\n const deleteText = texts?.delete ?? t('emojiPicker.delete');\n\n const hideEmojiTab = typeof allowUpload === 'object' && allowUpload?.enableEmoji === false;\n\n const items: TabsProps['items'] = [\n !hideEmojiTab && {\n key: 'emoji',\n label: (\n <Tooltip title={emojiText}>\n <Icon icon={SmileIcon} size={{ size: 20, strokeWidth: 2.5 }} />\n </Tooltip>\n ),\n },\n allowUpload && {\n key: 'upload',\n label: (\n <Tooltip title={uploadText}>\n <Icon icon={UploadIcon} size={{ size: 20, strokeWidth: 2.5 }} />\n </Tooltip>\n ),\n },\n ...customTabs.map((tab) => ({ key: tab.value, label: tab.label })),\n ].filter(Boolean) as TabsProps['items'];\n\n const showTabs = allowDelete || (items && items.length > 1);\n\n const content = (\n <Flexbox\n className={cx(styles.picker, popupClassName)}\n ref={ref}\n style={{\n minWidth: 310,\n paddingTop: showTabs ? 4 : 0,\n ...pickerCssVariables,\n ...popupStyle,\n }}\n {...contentProps}\n >\n {showTabs && (\n <Flexbox\n horizontal\n align={'center'}\n className={styles.tabs}\n justify={'space-between'}\n paddingInline={10}\n >\n <Tabs\n compact\n activeKey={tab}\n items={items}\n size={'small'}\n onChange={(key) => setTab(key as any)}\n />\n {allowDelete && (\n <ActionIcon\n icon={TrashIcon}\n title={deleteText}\n size={{\n blockSize: 32,\n size: 18,\n }}\n onClick={() => {\n handleAvatarChange(defaultAvatar);\n onDelete?.();\n }}\n />\n )}\n </Flexbox>\n )}\n {tab === 'emoji' && (\n <Picker\n custom={mergedCustomEmojis}\n data={data}\n i18n={i18n}\n icons={'outline'}\n locale={locale.split('-')[0]}\n navPosition={showTabs ? 'bottom' : 'top'}\n previewPosition={'none'}\n skinTonePosition={'none'}\n theme={theme.isDarkMode ? 'dark' : 'light'}\n onEmojiSelect={(e: any) => handleAvatarChange(e.src || e.native)}\n />\n )}\n {tab === 'upload' && (\n <AvatarUploader\n compressSize={compressSize}\n shape={shape}\n texts={texts}\n onChange={handleAvatarChange}\n onUpload={onUpload}\n />\n )}\n {customTabs.map(\n (item) =>\n tab === item.value && (\n <Flexbox key={item.value} padding={10}>\n {item.render(handleAvatarChange)}\n </Flexbox>\n ),\n )}\n </Flexbox>\n );\n\n return (\n <Popover\n className={cx(styles.popover)}\n content={content}\n defaultOpen={defaultOpen}\n open={visible}\n placement={'bottom'}\n trigger={'click'}\n classNames={{\n content: styles.popover,\n root: styles.positioner,\n }}\n onOpenChange={(v) => {\n if (loading) return;\n setVisible(v);\n }}\n {...popupProps}\n >\n {customRender ? (\n customRender(ava)\n ) : (\n <Avatar\n avatar={ava}\n className={cx(styles.root, className)}\n loading={loading}\n shape={shape}\n {...rest}\n />\n )}\n </Popover>\n );\n },\n);\n\nEmojiPicker.displayName = 'EmojiPicker';\n\nexport default EmojiPicker;\n"],"mappings":"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"}
package/es/EmojiPicker/type.d.mts CHANGED
@@ -34,6 +34,7 @@ interface EmojiPickerCustomTab {
34
34
  }
35
35
  interface EmojiPickerProps extends Omit<AvatarProps, 'onChange' | 'avatar'> {
36
36
  allowDelete?: boolean;
37
+ allowModelAvatar?: boolean;
37
38
  allowUpload?: boolean | {
38
39
  enableEmoji?: boolean;
39
40
  };
package/es/Markdown/SyntaxMarkdown/StreamdownRender.mjs CHANGED
@@ -103,41 +103,43 @@ const StreamdownRender = memo(({ children, ...rest }) => {
103
103
  }, [processedContent, profiler]);
104
104
  const blocks = blocksResult.value;
105
105
  const { getBlockState, charDelay } = useStreamQueue(blocks);
106
- const prevBlockCharCountRef = useRef(/* @__PURE__ */ new Map());
107
106
  const blockCharDelayRef = useRef(/* @__PURE__ */ new Map());
108
- const blockTimelineRef = useRef(/* @__PURE__ */ new Map());
109
- const lastRenderTsRef = useRef(null);
110
- const renderTs = getNow();
111
- const frameDt = lastRenderTsRef.current === null ? 0 : Math.max(0, Math.min(renderTs - lastRenderTsRef.current, 120));
112
- const timelineResult = useMemo(() => {
107
+ const blockBirthsRef = useRef(/* @__PURE__ */ new Map());
108
+ const renderNow = getNow();
109
+ const birthsResult = useMemo(() => {
113
110
  const start = profiler ? getNow() : 0;
114
- const next = /* @__PURE__ */ new Map();
115
- const prevTimeline = blockTimelineRef.current;
116
- const prevCharCounts = prevBlockCharCountRef.current;
117
- for (const block of blocks) {
111
+ const nextBirths = /* @__PURE__ */ new Map();
112
+ const prevBirths = blockBirthsRef.current;
113
+ for (const [index, block] of blocks.entries()) {
114
+ if (getBlockState(index) === "queued") continue;
118
115
  const blockCharCount = countChars(block.content);
119
- const prevCharCount = prevCharCounts.get(block.startOffset) ?? 0;
120
- const prevElapsed = prevTimeline.get(block.startOffset);
121
- const latestCharStart = Math.max(0, (blockCharCount - 1) * charDelay);
122
- if (prevElapsed === void 0 || blockCharCount < prevCharCount) {
123
- next.set(block.startOffset, latestCharStart);
124
- continue;
116
+ const prev = prevBirths.get(block.startOffset);
117
+ let arr;
118
+ if (prev && prev.length === blockCharCount) arr = prev;
119
+ else if (prev && prev.length > blockCharCount) arr = prev.slice(0, blockCharCount);
120
+ else {
121
+ arr = prev ? prev.slice() : [];
122
+ const startIdx = arr.length;
123
+ const cap = renderNow + STREAM_FADE_DURATION;
124
+ for (let i = startIdx; i < blockCharCount; i++) {
125
+ const chained = (i > 0 ? arr[i - 1] : renderNow - charDelay) + charDelay;
126
+ arr.push(Math.min(cap, Math.max(chained, renderNow)));
127
+ }
125
128
  }
126
- const elapsedByTime = prevElapsed + frameDt;
127
- const minElapsed = Math.max(0, latestCharStart - charDelay * 2);
128
- next.set(block.startOffset, Math.max(elapsedByTime, minElapsed));
129
+ nextBirths.set(block.startOffset, arr);
129
130
  }
130
131
  return {
131
132
  durationMs: profiler ? getNow() - start : 0,
132
- value: next
133
+ value: nextBirths
133
134
  };
134
135
  }, [
135
136
  blocks,
136
137
  charDelay,
137
- frameDt,
138
- profiler
138
+ getBlockState,
139
+ profiler,
140
+ renderNow
139
141
  ]);
140
- const timelineForRender = timelineResult.value;
142
+ const birthsForRender = birthsResult.value;
141
143
  useEffect(() => {
142
144
  if (!profiler) return;
143
145
  profiler.recordCalculation({
@@ -167,30 +169,29 @@ const StreamdownRender = memo(({ children, ...rest }) => {
167
169
  useEffect(() => {
168
170
  if (!profiler) return;
169
171
  profiler.recordCalculation({
170
- durationMs: timelineResult.durationMs,
172
+ durationMs: birthsResult.durationMs,
171
173
  itemCount: blocks.length,
172
- name: "block-timeline",
174
+ name: "block-births",
173
175
  textLength: processedContent.length
174
176
  });
175
177
  }, [
178
+ birthsResult.durationMs,
176
179
  blocks.length,
177
180
  processedContent.length,
178
- profiler,
179
- timelineResult.durationMs
181
+ profiler
180
182
  ]);
181
183
  const blockAnimationMetaResult = useMemo(() => {
182
184
  const nextBlockCharDelay = /* @__PURE__ */ new Map();
183
185
  const blockAnimationMeta = /* @__PURE__ */ new Map();
184
186
  for (const [index, block] of blocks.entries()) {
185
187
  const state = getBlockState(index);
186
- const timelineElapsedMs = timelineForRender.get(block.startOffset) ?? 0;
188
+ const births = birthsForRender.get(block.startOffset);
187
189
  const animationMeta = resolveBlockAnimationMeta({
188
- blockCharCount: countChars(block.content),
189
190
  currentCharDelay: charDelay,
190
191
  fadeDuration: STREAM_FADE_DURATION,
192
+ lastElapsedMs: renderNow - (births && births.length > 0 ? births.at(-1) ?? renderNow : renderNow),
191
193
  previousCharDelay: blockCharDelayRef.current.get(block.startOffset),
192
- state,
193
- timelineElapsedMs
194
+ state
194
195
  });
195
196
  nextBlockCharDelay.set(block.startOffset, animationMeta.charDelay);
196
197
  blockAnimationMeta.set(block.startOffset, animationMeta);
@@ -200,23 +201,16 @@ const StreamdownRender = memo(({ children, ...rest }) => {
200
201
  blockCharDelay: nextBlockCharDelay
201
202
  };
202
203
  }, [
204
+ birthsForRender,
203
205
  blocks,
204
206
  charDelay,
205
207
  getBlockState,
206
- timelineForRender
208
+ renderNow
207
209
  ]);
208
210
  useEffect(() => {
209
- const nextCharCount = /* @__PURE__ */ new Map();
210
- for (const block of blocks) nextCharCount.set(block.startOffset, countChars(block.content));
211
211
  blockCharDelayRef.current = blockAnimationMetaResult.blockCharDelay;
212
- prevBlockCharCountRef.current = nextCharCount;
213
- blockTimelineRef.current = timelineForRender;
214
- lastRenderTsRef.current = getNow();
215
- }, [
216
- blockAnimationMetaResult.blockCharDelay,
217
- blocks,
218
- timelineForRender
219
- ]);
212
+ blockBirthsRef.current = birthsForRender;
213
+ }, [birthsForRender, blockAnimationMetaResult.blockCharDelay]);
220
214
  const handleRootRender = useCallback((_, phase, actualDuration, baseDuration) => {
221
215
  profiler?.recordRootCommit({
222
216
  actualDuration,
@@ -257,10 +251,11 @@ const StreamdownRender = memo(({ children, ...rest }) => {
257
251
  if (getBlockState(index) === "queued") return null;
258
252
  const animationMeta = blockAnimationMetaResult.blockAnimationMeta.get(block.startOffset);
259
253
  if (!animationMeta) return null;
254
+ const births = birthsForRender.get(block.startOffset);
260
255
  const plugins = animationMeta.settled ? [...baseRehypePlugins, REVEALED_STREAM_PLUGIN] : [...baseRehypePlugins, [rehypeStreamAnimated, {
261
- charDelay: animationMeta.charDelay,
256
+ births,
262
257
  fadeDuration: STREAM_FADE_DURATION,
263
- timelineElapsedMs: animationMeta.timelineElapsedMs
258
+ nowMs: renderNow
264
259
  }]];
265
260
  const key = `${generatedId}-${block.startOffset}`;
266
261
  const blockNode = /* @__PURE__ */ jsx(StreamdownBlock, {
package/es/Markdown/SyntaxMarkdown/StreamdownRender.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"StreamdownRender.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/StreamdownRender.tsx"],"sourcesContent":["'use client';\n\nimport { marked } from 'marked';\nimport {\n memo,\n Profiler,\n type ProfilerOnRenderCallback,\n useCallback,\n useEffect,\n useId,\n useMemo,\n useRef,\n} from 'react';\nimport Markdown, { type Options } from 'react-markdown';\nimport remend from 'remend';\nimport type { Pluggable, PluggableList } from 'unified';\n\nimport {\n useMarkdownComponents,\n useMarkdownContent,\n useMarkdownRehypePlugins,\n useMarkdownRemarkPlugins,\n} from '@/hooks/useMarkdown';\nimport { useMarkdownContext } from '@/Markdown/components/MarkdownProvider';\nimport { rehypeStreamAnimated } from '@/Markdown/plugins/rehypeStreamAnimated';\nimport { useStreamdownProfiler } from '@/Markdown/streamProfiler';\n\nimport { resolveBlockAnimationMeta } from './streamAnimationMeta';\nimport { styles } from './style';\nimport { useSmoothStreamContent } from './useSmoothStreamContent';\nimport { type BlockInfo, useStreamQueue } from './useStreamQueue';\n\nconst STREAM_FADE_DURATION = 280;\nconst REVEALED_STREAM_PLUGIN: Pluggable = [rehypeStreamAnimated, { revealed: true }];\n\nfunction countChars(text: string): number {\n return [...text].length;\n}\n\nfunction getNow(): number {\n return typeof performance === 'undefined' ? Date.now() : performance.now();\n}\n\nconst isRecord = (value: unknown): value is Record<string, unknown> =>\n typeof value === 'object' && value !== null;\n\nconst isDeepEqualValue = (a: unknown, b: unknown): boolean => {\n if (a === b) return true;\n\n if (Array.isArray(a) || Array.isArray(b)) {\n if (!Array.isArray(a) || !Array.isArray(b)) return false;\n if (a.length !== b.length) return false;\n for (let i = 0; i < a.length; i++) {\n if (!isDeepEqualValue(a[i], b[i])) return false;\n }\n return true;\n }\n\n if (!isRecord(a) || !isRecord(b)) return false;\n\n const keysA = Object.keys(a);\n const keysB = Object.keys(b);\n if (keysA.length !== keysB.length) return false;\n\n for (const key of keysA) {\n if (!isDeepEqualValue(a[key], b[key])) return false;\n }\n\n return true;\n};\n\nconst isSamePlugin = (prevPlugin: Pluggable, nextPlugin: Pluggable): boolean => {\n const prevTuple = Array.isArray(prevPlugin) ? prevPlugin : [prevPlugin];\n const nextTuple = Array.isArray(nextPlugin) ? nextPlugin : [nextPlugin];\n\n if (prevTuple.length !== nextTuple.length) return false;\n if (prevTuple[0] !== nextTuple[0]) return false;\n\n return isDeepEqualValue(prevTuple.slice(1), nextTuple.slice(1));\n};\n\nconst isSamePlugins = (\n prevPlugins?: PluggableList | null,\n nextPlugins?: PluggableList | null,\n): boolean => {\n if (prevPlugins === nextPlugins) return true;\n if (!prevPlugins || !nextPlugins) return !prevPlugins && !nextPlugins;\n if (prevPlugins.length !== nextPlugins.length) return false;\n\n for (let i = 0; i < prevPlugins.length; i++) {\n if (!isSamePlugin(prevPlugins[i], nextPlugins[i])) return false;\n }\n\n return true;\n};\n\nconst useStablePlugins = (plugins: PluggableList): PluggableList => {\n const stableRef = useRef<PluggableList>(plugins);\n\n if (!isSamePlugins(stableRef.current, plugins)) {\n stableRef.current = plugins;\n }\n\n return stableRef.current;\n};\n\nconst StreamdownBlock = memo<Options>(\n ({ children, ...rest }) => {\n return <Markdown {...rest}>{children}</Markdown>;\n },\n (prevProps, nextProps) =>\n prevProps.children === nextProps.children &&\n prevProps.components === nextProps.components &&\n isSamePlugins(prevProps.rehypePlugins, nextProps.rehypePlugins) &&\n isSamePlugins(prevProps.remarkPlugins, nextProps.remarkPlugins),\n);\n\nStreamdownBlock.displayName = 'StreamdownBlock';\n\nexport const StreamdownRender = memo<Options>(({ children, ...rest }) => {\n const { streamSmoothingPreset = 'balanced' } = useMarkdownContext();\n const profiler = useStreamdownProfiler();\n const escapedContent = useMarkdownContent(children || '');\n const components = useMarkdownComponents();\n const baseRehypePlugins = useStablePlugins(useMarkdownRehypePlugins());\n const remarkPlugins = useStablePlugins(useMarkdownRemarkPlugins());\n const generatedId = useId();\n const smoothedContent = useSmoothStreamContent(\n typeof escapedContent === 'string' ? escapedContent : '',\n { preset: streamSmoothingPreset },\n );\n\n const processedContentResult = useMemo(() => {\n const start = profiler ? getNow() : 0;\n const value = remend(smoothedContent);\n\n return {\n durationMs: profiler ? getNow() - start : 0,\n value,\n };\n }, [profiler, smoothedContent]);\n const processedContent = processedContentResult.value;\n\n const blocksResult = useMemo(() => {\n const start = profiler ? getNow() : 0;\n const tokens = marked.lexer(processedContent);\n let offset = 0;\n\n const value = tokens.map((token) => {\n const block = { content: token.raw, startOffset: offset };\n offset += token.raw.length;\n return block;\n });\n\n return {\n durationMs: profiler ? getNow() - start : 0,\n value,\n };\n }, [processedContent, profiler]);\n const blocks: BlockInfo[] = blocksResult.value;\n\n const { getBlockState, charDelay } = useStreamQueue(blocks);\n const prevBlockCharCountRef = useRef<Map<number, number>>(new Map());\n const blockCharDelayRef = useRef<Map<number, number>>(new Map());\n const blockTimelineRef = useRef<Map<number, number>>(new Map());\n const lastRenderTsRef = useRef<number | null>(null);\n\n const renderTs = getNow();\n const frameDt =\n lastRenderTsRef.current === null\n ? 0\n : Math.max(0, Math.min(renderTs - lastRenderTsRef.current, 120));\n\n const timelineResult = useMemo(() => {\n const start = profiler ? getNow() : 0;\n const next = new Map<number, number>();\n const prevTimeline = blockTimelineRef.current;\n const prevCharCounts = prevBlockCharCountRef.current;\n\n for (const block of blocks) {\n const blockCharCount = countChars(block.content);\n const prevCharCount = prevCharCounts.get(block.startOffset) ?? 0;\n const prevElapsed = prevTimeline.get(block.startOffset);\n const latestCharStart = Math.max(0, (blockCharCount - 1) * charDelay);\n\n if (prevElapsed === undefined || blockCharCount < prevCharCount) {\n next.set(block.startOffset, latestCharStart);\n continue;\n }\n\n const elapsedByTime = prevElapsed + frameDt;\n // Avoid huge hidden backlog when stream updates in bursts.\n const minElapsed = Math.max(0, latestCharStart - charDelay * 2);\n next.set(block.startOffset, Math.max(elapsedByTime, minElapsed));\n }\n\n return {\n durationMs: profiler ? getNow() - start : 0,\n value: next,\n };\n }, [blocks, charDelay, frameDt, profiler]);\n const timelineForRender = timelineResult.value;\n\n useEffect(() => {\n if (!profiler) return;\n\n profiler.recordCalculation({\n durationMs: processedContentResult.durationMs,\n name: 'content-normalize',\n textLength: processedContent.length,\n });\n }, [processedContent.length, processedContentResult.durationMs, profiler]);\n\n useEffect(() => {\n if (!profiler) return;\n\n profiler.recordCalculation({\n durationMs: blocksResult.durationMs,\n itemCount: blocks.length,\n name: 'block-lex',\n textLength: processedContent.length,\n });\n }, [blocks.length, blocksResult.durationMs, processedContent.length, profiler]);\n\n useEffect(() => {\n if (!profiler) return;\n\n profiler.recordCalculation({\n durationMs: timelineResult.durationMs,\n itemCount: blocks.length,\n name: 'block-timeline',\n textLength: processedContent.length,\n });\n }, [blocks.length, processedContent.length, profiler, timelineResult.durationMs]);\n\n const blockAnimationMetaResult = useMemo(() => {\n const nextBlockCharDelay = new Map<number, number>();\n const blockAnimationMeta = new Map<number, ReturnType<typeof resolveBlockAnimationMeta>>();\n\n for (const [index, block] of blocks.entries()) {\n const state = getBlockState(index);\n const timelineElapsedMs = timelineForRender.get(block.startOffset) ?? 0;\n const animationMeta = resolveBlockAnimationMeta({\n blockCharCount: countChars(block.content),\n currentCharDelay: charDelay,\n fadeDuration: STREAM_FADE_DURATION,\n previousCharDelay: blockCharDelayRef.current.get(block.startOffset),\n state,\n timelineElapsedMs,\n });\n\n nextBlockCharDelay.set(block.startOffset, animationMeta.charDelay);\n blockAnimationMeta.set(block.startOffset, animationMeta);\n }\n\n return {\n blockAnimationMeta,\n blockCharDelay: nextBlockCharDelay,\n };\n }, [blocks, charDelay, getBlockState, timelineForRender]);\n\n useEffect(() => {\n const nextCharCount = new Map<number, number>();\n for (const block of blocks) {\n nextCharCount.set(block.startOffset, countChars(block.content));\n }\n blockCharDelayRef.current = blockAnimationMetaResult.blockCharDelay;\n prevBlockCharCountRef.current = nextCharCount;\n blockTimelineRef.current = timelineForRender;\n lastRenderTsRef.current = getNow();\n }, [blockAnimationMetaResult.blockCharDelay, blocks, timelineForRender]);\n\n const handleRootRender = useCallback<ProfilerOnRenderCallback>(\n (_, phase, actualDuration, baseDuration) => {\n profiler?.recordRootCommit({\n actualDuration,\n baseDuration,\n blockCount: blocks.length,\n phase,\n textLength: processedContent.length,\n });\n },\n [blocks.length, processedContent.length, profiler],\n );\n\n const handleBlockRender = useCallback<ProfilerOnRenderCallback>(\n (id, phase, actualDuration, baseDuration) => {\n if (!profiler) return;\n\n const [, indexText, offsetText] = id.split(':');\n const blockIndex = Number(indexText);\n\n if (!Number.isFinite(blockIndex)) return;\n\n const block = blocks[blockIndex];\n if (!block) return;\n\n profiler.recordBlockCommit({\n actualDuration,\n baseDuration,\n blockChars: countChars(block.content),\n blockIndex,\n blockKey: offsetText ?? String(block.startOffset),\n phase,\n state: getBlockState(blockIndex),\n });\n },\n [blocks, getBlockState, profiler],\n );\n\n const content = (\n <div className={styles.animated}>\n {blocks.map((block, index) => {\n const state = getBlockState(index);\n if (state === 'queued') return null;\n const animationMeta = blockAnimationMetaResult.blockAnimationMeta.get(block.startOffset);\n if (!animationMeta) return null;\n\n const plugins: Pluggable[] = animationMeta.settled\n ? [...baseRehypePlugins, REVEALED_STREAM_PLUGIN]\n : [\n ...baseRehypePlugins,\n [\n rehypeStreamAnimated,\n {\n charDelay: animationMeta.charDelay,\n fadeDuration: STREAM_FADE_DURATION,\n timelineElapsedMs: animationMeta.timelineElapsedMs,\n },\n ],\n ];\n\n const key = `${generatedId}-${block.startOffset}`;\n const blockNode = (\n <StreamdownBlock\n {...rest}\n components={components}\n rehypePlugins={plugins}\n remarkPlugins={remarkPlugins}\n >\n {block.content}\n </StreamdownBlock>\n );\n\n if (!profiler) {\n return (\n <StreamdownBlock\n {...rest}\n components={components}\n key={key}\n rehypePlugins={plugins}\n remarkPlugins={remarkPlugins}\n >\n {block.content}\n </StreamdownBlock>\n );\n }\n\n return (\n <Profiler\n id={`streamdown-block:${index}:${block.startOffset}`}\n key={key}\n onRender={handleBlockRender}\n >\n {blockNode}\n </Profiler>\n );\n })}\n </div>\n );\n\n if (!profiler) return content;\n\n return (\n <Profiler id={'streamdown-root'} onRender={handleRootRender}>\n {content}\n </Profiler>\n );\n});\n\nStreamdownRender.displayName = 'StreamdownRender';\n\nexport default StreamdownRender;\n"],"mappings":"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"}
1
+ {"version":3,"file":"StreamdownRender.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/StreamdownRender.tsx"],"sourcesContent":["'use client';\n\nimport { marked } from 'marked';\nimport {\n memo,\n Profiler,\n type ProfilerOnRenderCallback,\n useCallback,\n useEffect,\n useId,\n useMemo,\n useRef,\n} from 'react';\nimport Markdown, { type Options } from 'react-markdown';\nimport remend from 'remend';\nimport type { Pluggable, PluggableList } from 'unified';\n\nimport {\n useMarkdownComponents,\n useMarkdownContent,\n useMarkdownRehypePlugins,\n useMarkdownRemarkPlugins,\n} from '@/hooks/useMarkdown';\nimport { useMarkdownContext } from '@/Markdown/components/MarkdownProvider';\nimport { rehypeStreamAnimated } from '@/Markdown/plugins/rehypeStreamAnimated';\nimport { useStreamdownProfiler } from '@/Markdown/streamProfiler';\n\nimport { resolveBlockAnimationMeta } from './streamAnimationMeta';\nimport { styles } from './style';\nimport { useSmoothStreamContent } from './useSmoothStreamContent';\nimport { type BlockInfo, useStreamQueue } from './useStreamQueue';\n\nconst STREAM_FADE_DURATION = 280;\nconst REVEALED_STREAM_PLUGIN: Pluggable = [rehypeStreamAnimated, { revealed: true }];\n\nfunction countChars(text: string): number {\n return [...text].length;\n}\n\nfunction getNow(): number {\n return typeof performance === 'undefined' ? Date.now() : performance.now();\n}\n\nconst isRecord = (value: unknown): value is Record<string, unknown> =>\n typeof value === 'object' && value !== null;\n\nconst isDeepEqualValue = (a: unknown, b: unknown): boolean => {\n if (a === b) return true;\n\n if (Array.isArray(a) || Array.isArray(b)) {\n if (!Array.isArray(a) || !Array.isArray(b)) return false;\n if (a.length !== b.length) return false;\n for (let i = 0; i < a.length; i++) {\n if (!isDeepEqualValue(a[i], b[i])) return false;\n }\n return true;\n }\n\n if (!isRecord(a) || !isRecord(b)) return false;\n\n const keysA = Object.keys(a);\n const keysB = Object.keys(b);\n if (keysA.length !== keysB.length) return false;\n\n for (const key of keysA) {\n if (!isDeepEqualValue(a[key], b[key])) return false;\n }\n\n return true;\n};\n\nconst isSamePlugin = (prevPlugin: Pluggable, nextPlugin: Pluggable): boolean => {\n const prevTuple = Array.isArray(prevPlugin) ? prevPlugin : [prevPlugin];\n const nextTuple = Array.isArray(nextPlugin) ? nextPlugin : [nextPlugin];\n\n if (prevTuple.length !== nextTuple.length) return false;\n if (prevTuple[0] !== nextTuple[0]) return false;\n\n return isDeepEqualValue(prevTuple.slice(1), nextTuple.slice(1));\n};\n\nconst isSamePlugins = (\n prevPlugins?: PluggableList | null,\n nextPlugins?: PluggableList | null,\n): boolean => {\n if (prevPlugins === nextPlugins) return true;\n if (!prevPlugins || !nextPlugins) return !prevPlugins && !nextPlugins;\n if (prevPlugins.length !== nextPlugins.length) return false;\n\n for (let i = 0; i < prevPlugins.length; i++) {\n if (!isSamePlugin(prevPlugins[i], nextPlugins[i])) return false;\n }\n\n return true;\n};\n\nconst useStablePlugins = (plugins: PluggableList): PluggableList => {\n const stableRef = useRef<PluggableList>(plugins);\n\n if (!isSamePlugins(stableRef.current, plugins)) {\n stableRef.current = plugins;\n }\n\n return stableRef.current;\n};\n\nconst StreamdownBlock = memo<Options>(\n ({ children, ...rest }) => {\n return <Markdown {...rest}>{children}</Markdown>;\n },\n (prevProps, nextProps) =>\n prevProps.children === nextProps.children &&\n prevProps.components === nextProps.components &&\n isSamePlugins(prevProps.rehypePlugins, nextProps.rehypePlugins) &&\n isSamePlugins(prevProps.remarkPlugins, nextProps.remarkPlugins),\n);\n\nStreamdownBlock.displayName = 'StreamdownBlock';\n\nexport const StreamdownRender = memo<Options>(({ children, ...rest }) => {\n const { streamSmoothingPreset = 'balanced' } = useMarkdownContext();\n const profiler = useStreamdownProfiler();\n const escapedContent = useMarkdownContent(children || '');\n const components = useMarkdownComponents();\n const baseRehypePlugins = useStablePlugins(useMarkdownRehypePlugins());\n const remarkPlugins = useStablePlugins(useMarkdownRemarkPlugins());\n const generatedId = useId();\n const smoothedContent = useSmoothStreamContent(\n typeof escapedContent === 'string' ? escapedContent : '',\n { preset: streamSmoothingPreset },\n );\n\n const processedContentResult = useMemo(() => {\n const start = profiler ? getNow() : 0;\n const value = remend(smoothedContent);\n\n return {\n durationMs: profiler ? getNow() - start : 0,\n value,\n };\n }, [profiler, smoothedContent]);\n const processedContent = processedContentResult.value;\n\n const blocksResult = useMemo(() => {\n const start = profiler ? getNow() : 0;\n const tokens = marked.lexer(processedContent);\n let offset = 0;\n\n const value = tokens.map((token) => {\n const block = { content: token.raw, startOffset: offset };\n offset += token.raw.length;\n return block;\n });\n\n return {\n durationMs: profiler ? getNow() - start : 0,\n value,\n };\n }, [processedContent, profiler]);\n const blocks: BlockInfo[] = blocksResult.value;\n\n const { getBlockState, charDelay } = useStreamQueue(blocks);\n const blockCharDelayRef = useRef<Map<number, number>>(new Map());\n const blockBirthsRef = useRef<Map<number, number[]>>(new Map());\n\n const renderNow = getNow();\n\n const birthsResult = useMemo(() => {\n const start = profiler ? getNow() : 0;\n const nextBirths = new Map<number, number[]>();\n const prevBirths = blockBirthsRef.current;\n\n for (const [index, block] of blocks.entries()) {\n const state = getBlockState(index);\n // Queued blocks are not rendered. Defer birth assignment so that\n // when the block later transitions to animating/streaming, its\n // chars start fading from that moment instead of having already\n // \"aged out\" of the fade window.\n if (state === 'queued') continue;\n\n const blockCharCount = countChars(block.content);\n const prev = prevBirths.get(block.startOffset);\n let arr: number[];\n\n if (prev && prev.length === blockCharCount) {\n arr = prev;\n } else if (prev && prev.length > blockCharCount) {\n // Block content shrunk (stream restart or upstream rewrite).\n arr = prev.slice(0, blockCharCount);\n } else {\n arr = prev ? prev.slice() : [];\n const startIdx = arr.length;\n // Chain each new char monotonically after the previous one so fades\n // never race out of order. Cap how far the fade queue can run ahead\n // of renderNow to prevent stream-faster-than-fade producing seconds\n // of invisible backlog at the tail.\n const cap = renderNow + STREAM_FADE_DURATION;\n for (let i = startIdx; i < blockCharCount; i++) {\n const prevBirth = i > 0 ? (arr[i - 1] as number) : renderNow - charDelay;\n const chained = prevBirth + charDelay;\n arr.push(Math.min(cap, Math.max(chained, renderNow)));\n }\n }\n\n nextBirths.set(block.startOffset, arr);\n }\n\n return {\n durationMs: profiler ? getNow() - start : 0,\n value: nextBirths,\n };\n }, [blocks, charDelay, getBlockState, profiler, renderNow]);\n const birthsForRender = birthsResult.value;\n\n useEffect(() => {\n if (!profiler) return;\n\n profiler.recordCalculation({\n durationMs: processedContentResult.durationMs,\n name: 'content-normalize',\n textLength: processedContent.length,\n });\n }, [processedContent.length, processedContentResult.durationMs, profiler]);\n\n useEffect(() => {\n if (!profiler) return;\n\n profiler.recordCalculation({\n durationMs: blocksResult.durationMs,\n itemCount: blocks.length,\n name: 'block-lex',\n textLength: processedContent.length,\n });\n }, [blocks.length, blocksResult.durationMs, processedContent.length, profiler]);\n\n useEffect(() => {\n if (!profiler) return;\n\n profiler.recordCalculation({\n durationMs: birthsResult.durationMs,\n itemCount: blocks.length,\n name: 'block-births',\n textLength: processedContent.length,\n });\n }, [birthsResult.durationMs, blocks.length, processedContent.length, profiler]);\n\n const blockAnimationMetaResult = useMemo(() => {\n const nextBlockCharDelay = new Map<number, number>();\n const blockAnimationMeta = new Map<number, ReturnType<typeof resolveBlockAnimationMeta>>();\n\n for (const [index, block] of blocks.entries()) {\n const state = getBlockState(index);\n const births = birthsForRender.get(block.startOffset);\n const lastBirthTs = births && births.length > 0 ? (births.at(-1) ?? renderNow) : renderNow;\n const lastElapsedMs = renderNow - lastBirthTs;\n const animationMeta = resolveBlockAnimationMeta({\n currentCharDelay: charDelay,\n fadeDuration: STREAM_FADE_DURATION,\n lastElapsedMs,\n previousCharDelay: blockCharDelayRef.current.get(block.startOffset),\n state,\n });\n\n nextBlockCharDelay.set(block.startOffset, animationMeta.charDelay);\n blockAnimationMeta.set(block.startOffset, animationMeta);\n }\n\n return {\n blockAnimationMeta,\n blockCharDelay: nextBlockCharDelay,\n };\n }, [birthsForRender, blocks, charDelay, getBlockState, renderNow]);\n\n useEffect(() => {\n blockCharDelayRef.current = blockAnimationMetaResult.blockCharDelay;\n blockBirthsRef.current = birthsForRender;\n }, [birthsForRender, blockAnimationMetaResult.blockCharDelay]);\n\n const handleRootRender = useCallback<ProfilerOnRenderCallback>(\n (_, phase, actualDuration, baseDuration) => {\n profiler?.recordRootCommit({\n actualDuration,\n baseDuration,\n blockCount: blocks.length,\n phase,\n textLength: processedContent.length,\n });\n },\n [blocks.length, processedContent.length, profiler],\n );\n\n const handleBlockRender = useCallback<ProfilerOnRenderCallback>(\n (id, phase, actualDuration, baseDuration) => {\n if (!profiler) return;\n\n const [, indexText, offsetText] = id.split(':');\n const blockIndex = Number(indexText);\n\n if (!Number.isFinite(blockIndex)) return;\n\n const block = blocks[blockIndex];\n if (!block) return;\n\n profiler.recordBlockCommit({\n actualDuration,\n baseDuration,\n blockChars: countChars(block.content),\n blockIndex,\n blockKey: offsetText ?? String(block.startOffset),\n phase,\n state: getBlockState(blockIndex),\n });\n },\n [blocks, getBlockState, profiler],\n );\n\n const content = (\n <div className={styles.animated}>\n {blocks.map((block, index) => {\n const state = getBlockState(index);\n if (state === 'queued') return null;\n const animationMeta = blockAnimationMetaResult.blockAnimationMeta.get(block.startOffset);\n if (!animationMeta) return null;\n\n const births = birthsForRender.get(block.startOffset);\n const plugins: Pluggable[] = animationMeta.settled\n ? [...baseRehypePlugins, REVEALED_STREAM_PLUGIN]\n : [\n ...baseRehypePlugins,\n [\n rehypeStreamAnimated,\n {\n births,\n fadeDuration: STREAM_FADE_DURATION,\n nowMs: renderNow,\n },\n ],\n ];\n\n const key = `${generatedId}-${block.startOffset}`;\n const blockNode = (\n <StreamdownBlock\n {...rest}\n components={components}\n rehypePlugins={plugins}\n remarkPlugins={remarkPlugins}\n >\n {block.content}\n </StreamdownBlock>\n );\n\n if (!profiler) {\n return (\n <StreamdownBlock\n {...rest}\n components={components}\n key={key}\n rehypePlugins={plugins}\n remarkPlugins={remarkPlugins}\n >\n {block.content}\n </StreamdownBlock>\n );\n }\n\n return (\n <Profiler\n id={`streamdown-block:${index}:${block.startOffset}`}\n key={key}\n onRender={handleBlockRender}\n >\n {blockNode}\n </Profiler>\n );\n })}\n </div>\n );\n\n if (!profiler) return content;\n\n return (\n <Profiler id={'streamdown-root'} onRender={handleRootRender}>\n {content}\n </Profiler>\n );\n});\n\nStreamdownRender.displayName = 'StreamdownRender';\n\nexport default StreamdownRender;\n"],"mappings":"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"}
package/es/Markdown/SyntaxMarkdown/streamAnimationMeta.mjs CHANGED
@@ -2,14 +2,10 @@
2
2
  const isActiveBlock = (state) => {
3
3
  return state === "animating" || state === "streaming";
4
4
  };
5
- const resolveBlockAnimationMeta = ({ blockCharCount, currentCharDelay, fadeDuration, previousCharDelay, state, timelineElapsedMs }) => {
6
- const charDelay = isActiveBlock(state) ? currentCharDelay : previousCharDelay ?? currentCharDelay;
7
- const latestCharStart = Math.max(0, (blockCharCount - 1) * charDelay);
8
- const settled = state === "revealed" && timelineElapsedMs >= latestCharStart + fadeDuration;
5
+ const resolveBlockAnimationMeta = ({ currentCharDelay, fadeDuration, lastElapsedMs, previousCharDelay, state }) => {
9
6
  return {
10
- charDelay,
11
- settled,
12
- timelineElapsedMs: settled ? latestCharStart + fadeDuration : timelineElapsedMs
7
+ charDelay: isActiveBlock(state) ? currentCharDelay : previousCharDelay ?? currentCharDelay,
8
+ settled: state === "revealed" && lastElapsedMs >= fadeDuration
13
9
  };
14
10
  };
15
11
  //#endregion
package/es/Markdown/SyntaxMarkdown/streamAnimationMeta.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"streamAnimationMeta.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/streamAnimationMeta.ts"],"sourcesContent":["import { type BlockState } from './useStreamQueue';\n\nexport interface ResolveBlockAnimationMetaOptions {\n blockCharCount: number;\n currentCharDelay: number;\n fadeDuration: number;\n previousCharDelay?: number;\n state: BlockState;\n timelineElapsedMs: number;\n}\n\nexport interface BlockAnimationMeta {\n charDelay: number;\n settled: boolean;\n timelineElapsedMs: number;\n}\n\nconst isActiveBlock = (state: BlockState) => {\n return state === 'animating' || state === 'streaming';\n};\n\nexport const resolveBlockAnimationMeta = ({\n blockCharCount,\n currentCharDelay,\n fadeDuration,\n previousCharDelay,\n state,\n timelineElapsedMs,\n}: ResolveBlockAnimationMetaOptions): BlockAnimationMeta => {\n const charDelay = isActiveBlock(state)\n ? currentCharDelay\n : (previousCharDelay ?? currentCharDelay);\n const latestCharStart = Math.max(0, (blockCharCount - 1) * charDelay);\n const settled = state === 'revealed' && timelineElapsedMs >= latestCharStart + fadeDuration;\n\n return {\n charDelay,\n settled,\n timelineElapsedMs: settled ? latestCharStart + fadeDuration : timelineElapsedMs,\n };\n};\n"],"mappings":";AAiBA,MAAM,iBAAiB,UAAsB;AAC3C,QAAO,UAAU,eAAe,UAAU;;AAG5C,MAAa,6BAA6B,EACxC,gBACA,kBACA,cACA,mBACA,OACA,wBAC0D;CAC1D,MAAM,YAAY,cAAc,MAAM,GAClC,mBACC,qBAAqB;CAC1B,MAAM,kBAAkB,KAAK,IAAI,IAAI,iBAAiB,KAAK,UAAU;CACrE,MAAM,UAAU,UAAU,cAAc,qBAAqB,kBAAkB;AAE/E,QAAO;EACL;EACA;EACA,mBAAmB,UAAU,kBAAkB,eAAe;EAC/D"}
1
+ {"version":3,"file":"streamAnimationMeta.mjs","names":[],"sources":["../../../src/Markdown/SyntaxMarkdown/streamAnimationMeta.ts"],"sourcesContent":["import { type BlockState } from './useStreamQueue';\n\nexport interface ResolveBlockAnimationMetaOptions {\n currentCharDelay: number;\n fadeDuration: number;\n lastElapsedMs: number;\n previousCharDelay?: number;\n state: BlockState;\n}\n\nexport interface BlockAnimationMeta {\n charDelay: number;\n settled: boolean;\n}\n\nconst isActiveBlock = (state: BlockState) => {\n return state === 'animating' || state === 'streaming';\n};\n\nexport const resolveBlockAnimationMeta = ({\n currentCharDelay,\n fadeDuration,\n lastElapsedMs,\n previousCharDelay,\n state,\n}: ResolveBlockAnimationMetaOptions): BlockAnimationMeta => {\n const charDelay = isActiveBlock(state)\n ? currentCharDelay\n : (previousCharDelay ?? currentCharDelay);\n const settled = state === 'revealed' && lastElapsedMs >= fadeDuration;\n\n return {\n charDelay,\n settled,\n };\n};\n"],"mappings":";AAeA,MAAM,iBAAiB,UAAsB;AAC3C,QAAO,UAAU,eAAe,UAAU;;AAG5C,MAAa,6BAA6B,EACxC,kBACA,cACA,eACA,mBACA,YAC0D;AAM1D,QAAO;EACL,WANgB,cAAc,MAAM,GAClC,mBACC,qBAAqB;EAKxB,SAJc,UAAU,cAAc,iBAAiB;EAKxD"}
package/es/Markdown/plugins/rehypeStreamAnimated.d.mts CHANGED
@@ -2,11 +2,10 @@ import { Root } from "../../node_modules/@types/hast/index.mjs";
2
2
 
3
3
  //#region src/Markdown/plugins/rehypeStreamAnimated.d.ts
4
4
  interface StreamAnimatedOptions {
5
- baseCharCount?: number;
6
- charDelay?: number;
5
+ births?: number[];
7
6
  fadeDuration?: number;
7
+ nowMs?: number;
8
8
  revealed?: boolean;
9
- timelineElapsedMs?: number;
10
9
  }
11
10
  declare const rehypeStreamAnimated: (options?: StreamAnimatedOptions) => (tree: Root) => void;
12
11
  //#endregion
package/es/Markdown/plugins/rehypeStreamAnimated.mjs CHANGED
@@ -23,8 +23,8 @@ function hasClass(node, cls) {
23
23
  return false;
24
24
  }
25
25
  const rehypeStreamAnimated = (options = {}) => {
26
- const { charDelay = 20, fadeDuration = 150, baseCharCount = 0, revealed = false, timelineElapsedMs } = options;
27
- const hasTimeline = typeof timelineElapsedMs === "number" && Number.isFinite(timelineElapsedMs);
26
+ const { births, fadeDuration = 150, nowMs, revealed = false } = options;
27
+ const hasBirths = !revealed && Array.isArray(births) && typeof nowMs === "number";
28
28
  return (tree) => {
29
29
  let globalCharIndex = 0;
30
30
  const shouldSkip = (node) => {
@@ -33,19 +33,17 @@ const rehypeStreamAnimated = (options = {}) => {
33
33
  const wrapText = (node) => {
34
34
  const newChildren = [];
35
35
  for (const child of node.children) if (child.type === "text") for (const char of child.value) {
36
- const relativeIndex = globalCharIndex - baseCharCount;
37
36
  let className = "stream-char";
38
37
  let delay;
39
38
  if (revealed) className = "stream-char stream-char-revealed";
40
- else if (hasTimeline) {
41
- const progress = timelineElapsedMs - globalCharIndex * charDelay;
42
- if (progress >= fadeDuration) className = "stream-char stream-char-revealed";
43
- else delay = -progress;
44
- } else if (relativeIndex >= 0) delay = relativeIndex * charDelay;
45
- else {
46
- const elapsed = -relativeIndex * charDelay;
47
- if (elapsed >= fadeDuration) className = "stream-char stream-char-revealed";
48
- else delay = -elapsed;
39
+ else if (hasBirths) {
40
+ const birthTs = births[globalCharIndex];
41
+ if (birthTs === void 0) className = "stream-char stream-char-revealed";
42
+ else {
43
+ const elapsed = nowMs - birthTs;
44
+ if (elapsed >= fadeDuration) className = "stream-char stream-char-revealed";
45
+ else delay = -elapsed;
46
+ }
49
47
  }
50
48
  const properties = { className };
51
49
  if (delay !== void 0 && delay !== 0) properties.style = `animation-delay:${delay}ms`;
package/es/Markdown/plugins/rehypeStreamAnimated.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"rehypeStreamAnimated.mjs","names":[],"sources":["../../../src/Markdown/plugins/rehypeStreamAnimated.ts"],"sourcesContent":["import { type Element, type ElementContent, type Root } from 'hast';\nimport { type BuildVisitor } from 'unist-util-visit';\nimport { visit } from 'unist-util-visit';\n\nexport interface StreamAnimatedOptions {\n baseCharCount?: number;\n charDelay?: number;\n fadeDuration?: number;\n revealed?: boolean;\n timelineElapsedMs?: number;\n}\n\nconst BLOCK_TAGS = new Set(['p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'li']);\nconst SKIP_TAGS = new Set(['pre', 'code', 'table', 'svg']);\n\nfunction hasClass(node: Element, cls: string): boolean {\n const cn = node.properties?.className;\n if (Array.isArray(cn)) return cn.some((c) => String(c).includes(cls));\n if (typeof cn === 'string') return cn.includes(cls);\n return false;\n}\n\nexport const rehypeStreamAnimated = (options: StreamAnimatedOptions = {}) => {\n const {\n charDelay = 20,\n fadeDuration = 150,\n baseCharCount = 0,\n revealed = false,\n timelineElapsedMs,\n } = options;\n const hasTimeline = typeof timelineElapsedMs === 'number' && Number.isFinite(timelineElapsedMs);\n\n return (tree: Root) => {\n let globalCharIndex = 0;\n\n const shouldSkip = (node: Element): boolean => {\n return SKIP_TAGS.has(node.tagName) || hasClass(node, 'katex');\n };\n\n const wrapText = (node: Element) => {\n const newChildren: ElementContent[] = [];\n for (const child of node.children) {\n if (child.type === 'text') {\n for (const char of child.value) {\n const relativeIndex = globalCharIndex - baseCharCount;\n let className = 'stream-char';\n let delay: number | undefined;\n\n if (revealed) {\n className = 'stream-char stream-char-revealed';\n } else if (hasTimeline) {\n const progress = (timelineElapsedMs as number) - globalCharIndex * charDelay;\n if (progress >= fadeDuration) {\n className = 'stream-char stream-char-revealed';\n } else {\n // Positive delay means \"not started yet\", negative keeps\n // the current in-flight progress on rerender.\n delay = -progress;\n }\n } else if (relativeIndex >= 0) {\n // Newly appended chars start with staggered positive delay.\n delay = relativeIndex * charDelay;\n } else {\n // Previously started chars continue fading with negative delay\n // instead of being immediately switched to revealed.\n const elapsed = -relativeIndex * charDelay;\n if (elapsed >= fadeDuration) {\n className = 'stream-char stream-char-revealed';\n } else {\n delay = -elapsed;\n }\n }\n\n const properties: Record<string, any> = { className };\n if (delay !== undefined && delay !== 0) {\n properties.style = `animation-delay:${delay}ms`;\n }\n newChildren.push({\n children: [{ type: 'text', value: char }],\n properties,\n tagName: 'span',\n type: 'element',\n });\n globalCharIndex++;\n }\n } else if (child.type === 'element') {\n if (!shouldSkip(child)) {\n wrapText(child);\n }\n newChildren.push(child);\n } else {\n newChildren.push(child);\n }\n }\n node.children = newChildren;\n };\n\n visit(tree, 'element', ((node: Element) => {\n if (shouldSkip(node)) return 'skip';\n if (BLOCK_TAGS.has(node.tagName)) {\n wrapText(node);\n return 'skip';\n }\n }) as BuildVisitor<Root, 'element'>);\n };\n};\n"],"mappings":";;AAYA,MAAM,aAAa,IAAI,IAAI;CAAC;CAAK;CAAM;CAAM;CAAM;CAAM;CAAM;CAAM;CAAK,CAAC;AAC3E,MAAM,YAAY,IAAI,IAAI;CAAC;CAAO;CAAQ;CAAS;CAAM,CAAC;AAE1D,SAAS,SAAS,MAAe,KAAsB;CACrD,MAAM,KAAK,KAAK,YAAY;AAC5B,KAAI,MAAM,QAAQ,GAAG,CAAE,QAAO,GAAG,MAAM,MAAM,OAAO,EAAE,CAAC,SAAS,IAAI,CAAC;AACrE,KAAI,OAAO,OAAO,SAAU,QAAO,GAAG,SAAS,IAAI;AACnD,QAAO;;AAGT,MAAa,wBAAwB,UAAiC,EAAE,KAAK;CAC3E,MAAM,EACJ,YAAY,IACZ,eAAe,KACf,gBAAgB,GAChB,WAAW,OACX,sBACE;CACJ,MAAM,cAAc,OAAO,sBAAsB,YAAY,OAAO,SAAS,kBAAkB;AAE/F,SAAQ,SAAe;EACrB,IAAI,kBAAkB;EAEtB,MAAM,cAAc,SAA2B;AAC7C,UAAO,UAAU,IAAI,KAAK,QAAQ,IAAI,SAAS,MAAM,QAAQ;;EAG/D,MAAM,YAAY,SAAkB;GAClC,MAAM,cAAgC,EAAE;AACxC,QAAK,MAAM,SAAS,KAAK,SACvB,KAAI,MAAM,SAAS,OACjB,MAAK,MAAM,QAAQ,MAAM,OAAO;IAC9B,MAAM,gBAAgB,kBAAkB;IACxC,IAAI,YAAY;IAChB,IAAI;AAEJ,QAAI,SACF,aAAY;aACH,aAAa;KACtB,MAAM,WAAY,oBAA+B,kBAAkB;AACnE,SAAI,YAAY,aACd,aAAY;SAIZ,SAAQ,CAAC;eAEF,iBAAiB,EAE1B,SAAQ,gBAAgB;SACnB;KAGL,MAAM,UAAU,CAAC,gBAAgB;AACjC,SAAI,WAAW,aACb,aAAY;SAEZ,SAAQ,CAAC;;IAIb,MAAM,aAAkC,EAAE,WAAW;AACrD,QAAI,UAAU,KAAA,KAAa,UAAU,EACnC,YAAW,QAAQ,mBAAmB,MAAM;AAE9C,gBAAY,KAAK;KACf,UAAU,CAAC;MAAE,MAAM;MAAQ,OAAO;MAAM,CAAC;KACzC;KACA,SAAS;KACT,MAAM;KACP,CAAC;AACF;;YAEO,MAAM,SAAS,WAAW;AACnC,QAAI,CAAC,WAAW,MAAM,CACpB,UAAS,MAAM;AAEjB,gBAAY,KAAK,MAAM;SAEvB,aAAY,KAAK,MAAM;AAG3B,QAAK,WAAW;;AAGlB,QAAM,MAAM,aAAa,SAAkB;AACzC,OAAI,WAAW,KAAK,CAAE,QAAO;AAC7B,OAAI,WAAW,IAAI,KAAK,QAAQ,EAAE;AAChC,aAAS,KAAK;AACd,WAAO;;KAEyB"}
1
+ {"version":3,"file":"rehypeStreamAnimated.mjs","names":[],"sources":["../../../src/Markdown/plugins/rehypeStreamAnimated.ts"],"sourcesContent":["import { type Element, type ElementContent, type Root } from 'hast';\nimport { type BuildVisitor } from 'unist-util-visit';\nimport { visit } from 'unist-util-visit';\n\nexport interface StreamAnimatedOptions {\n births?: number[];\n fadeDuration?: number;\n nowMs?: number;\n revealed?: boolean;\n}\n\nconst BLOCK_TAGS = new Set(['p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'li']);\nconst SKIP_TAGS = new Set(['pre', 'code', 'table', 'svg']);\n\nfunction hasClass(node: Element, cls: string): boolean {\n const cn = node.properties?.className;\n if (Array.isArray(cn)) return cn.some((c) => String(c).includes(cls));\n if (typeof cn === 'string') return cn.includes(cls);\n return false;\n}\n\nexport const rehypeStreamAnimated = (options: StreamAnimatedOptions = {}) => {\n const { births, fadeDuration = 150, nowMs, revealed = false } = options;\n const hasBirths = !revealed && Array.isArray(births) && typeof nowMs === 'number';\n\n return (tree: Root) => {\n let globalCharIndex = 0;\n\n const shouldSkip = (node: Element): boolean => {\n return SKIP_TAGS.has(node.tagName) || hasClass(node, 'katex');\n };\n\n const wrapText = (node: Element) => {\n const newChildren: ElementContent[] = [];\n for (const child of node.children) {\n if (child.type === 'text') {\n for (const char of child.value) {\n let className = 'stream-char';\n let delay: number | undefined;\n\n if (revealed) {\n className = 'stream-char stream-char-revealed';\n } else if (hasBirths) {\n const birthTs = births![globalCharIndex];\n if (birthTs === undefined) {\n className = 'stream-char stream-char-revealed';\n } else {\n const elapsed = (nowMs as number) - birthTs;\n if (elapsed >= fadeDuration) {\n className = 'stream-char stream-char-revealed';\n } else {\n // Negative delay = already elapsed ms into the fade.\n // Positive delay = not started yet (char born in the future,\n // i.e. staggered within the same commit).\n delay = -elapsed;\n }\n }\n }\n\n const properties: Record<string, any> = { className };\n if (delay !== undefined && delay !== 0) {\n properties.style = `animation-delay:${delay}ms`;\n }\n newChildren.push({\n children: [{ type: 'text', value: char }],\n properties,\n tagName: 'span',\n type: 'element',\n });\n globalCharIndex++;\n }\n } else if (child.type === 'element') {\n if (!shouldSkip(child)) {\n wrapText(child);\n }\n newChildren.push(child);\n } else {\n newChildren.push(child);\n }\n }\n node.children = newChildren;\n };\n\n visit(tree, 'element', ((node: Element) => {\n if (shouldSkip(node)) return 'skip';\n if (BLOCK_TAGS.has(node.tagName)) {\n wrapText(node);\n return 'skip';\n }\n }) as BuildVisitor<Root, 'element'>);\n };\n};\n"],"mappings":";;AAWA,MAAM,aAAa,IAAI,IAAI;CAAC;CAAK;CAAM;CAAM;CAAM;CAAM;CAAM;CAAM;CAAK,CAAC;AAC3E,MAAM,YAAY,IAAI,IAAI;CAAC;CAAO;CAAQ;CAAS;CAAM,CAAC;AAE1D,SAAS,SAAS,MAAe,KAAsB;CACrD,MAAM,KAAK,KAAK,YAAY;AAC5B,KAAI,MAAM,QAAQ,GAAG,CAAE,QAAO,GAAG,MAAM,MAAM,OAAO,EAAE,CAAC,SAAS,IAAI,CAAC;AACrE,KAAI,OAAO,OAAO,SAAU,QAAO,GAAG,SAAS,IAAI;AACnD,QAAO;;AAGT,MAAa,wBAAwB,UAAiC,EAAE,KAAK;CAC3E,MAAM,EAAE,QAAQ,eAAe,KAAK,OAAO,WAAW,UAAU;CAChE,MAAM,YAAY,CAAC,YAAY,MAAM,QAAQ,OAAO,IAAI,OAAO,UAAU;AAEzE,SAAQ,SAAe;EACrB,IAAI,kBAAkB;EAEtB,MAAM,cAAc,SAA2B;AAC7C,UAAO,UAAU,IAAI,KAAK,QAAQ,IAAI,SAAS,MAAM,QAAQ;;EAG/D,MAAM,YAAY,SAAkB;GAClC,MAAM,cAAgC,EAAE;AACxC,QAAK,MAAM,SAAS,KAAK,SACvB,KAAI,MAAM,SAAS,OACjB,MAAK,MAAM,QAAQ,MAAM,OAAO;IAC9B,IAAI,YAAY;IAChB,IAAI;AAEJ,QAAI,SACF,aAAY;aACH,WAAW;KACpB,MAAM,UAAU,OAAQ;AACxB,SAAI,YAAY,KAAA,EACd,aAAY;UACP;MACL,MAAM,UAAW,QAAmB;AACpC,UAAI,WAAW,aACb,aAAY;UAKZ,SAAQ,CAAC;;;IAKf,MAAM,aAAkC,EAAE,WAAW;AACrD,QAAI,UAAU,KAAA,KAAa,UAAU,EACnC,YAAW,QAAQ,mBAAmB,MAAM;AAE9C,gBAAY,KAAK;KACf,UAAU,CAAC;MAAE,MAAM;MAAQ,OAAO;MAAM,CAAC;KACzC;KACA,SAAS;KACT,MAAM;KACP,CAAC;AACF;;YAEO,MAAM,SAAS,WAAW;AACnC,QAAI,CAAC,WAAW,MAAM,CACpB,UAAS,MAAM;AAEjB,gBAAY,KAAK,MAAM;SAEvB,aAAY,KAAK,MAAM;AAG3B,QAAK,WAAW;;AAGlB,QAAM,MAAM,aAAa,SAAkB;AACzC,OAAI,WAAW,KAAK,CAAE,QAAO;AAC7B,OAAI,WAAW,IAAI,KAAK,QAAQ,EAAE;AAChC,aAAS,KAAK;AACd,WAAO;;KAEyB"}
package/es/awesome/GridBackground/components/Grid.mjs CHANGED
@@ -2,43 +2,25 @@ import { memo, useCallback } from "react";
2
2
  import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
3
3
  import { isUndefined } from "es-toolkit/compat";
4
4
  //#region src/awesome/GridBackground/components/Grid.tsx
5
- var Line = /* @__PURE__ */ function(Line) {
6
- Line[Line["l7"] = 0] = "l7";
7
- Line[Line["l6"] = 1] = "l6";
8
- Line[Line["l5"] = 2] = "l5";
9
- Line[Line["l4"] = 3] = "l4";
10
- Line[Line["l3"] = 4] = "l3";
11
- Line[Line["l2"] = 5] = "l2";
12
- Line[Line["l1"] = 6] = "l1";
13
- Line[Line["center"] = 7] = "center";
14
- Line[Line["r1"] = 8] = "r1";
15
- Line[Line["r2"] = 9] = "r2";
16
- Line[Line["r3"] = 10] = "r3";
17
- Line[Line["r4"] = 11] = "r4";
18
- Line[Line["r5"] = 12] = "r5";
19
- Line[Line["r6"] = 13] = "r6";
20
- Line[Line["r7"] = 14] = "r7";
21
- return Line;
22
- }(Line || {});
23
5
  const Grid = memo(({ color = "#fff", strokeWidth = 3, linePick, ...rest }) => {
24
6
  const isUnpick = isUndefined(linePick);
25
7
  const showLine = useCallback((l) => isUnpick || linePick === l, [linePick]);
26
8
  const vLine = /* @__PURE__ */ jsxs(Fragment$1, { children: [
27
- showLine(Line.l7) && /* @__PURE__ */ jsx("path", { d: "M2 420v-60.343c0-21.82 14.15-41.12 34.959-47.684L1026 0h0" }),
28
- showLine(Line.l6) && /* @__PURE__ */ jsx("path", { d: "M268 420v-62.077c0-20.977 13.094-39.724 32.789-46.944L1149 0h0" }),
29
- showLine(Line.l5) && /* @__PURE__ */ jsx("path", { d: "M534 420v-64.358a50 50 0 0129.884-45.775L1269 0h0" }),
30
- showLine(Line.l4) && /* @__PURE__ */ jsx("path", { d: "M800 420v-67.395a50 50 0 0125.958-43.84L1389 0h0" }),
31
- showLine(Line.l3) && /* @__PURE__ */ jsx("path", { d: "M1066 420v-71.645a50 50 0 0120.456-40.337L1507 0h0" }),
32
- showLine(Line.l2) && /* @__PURE__ */ jsx("path", { d: "M1332 420v-77.506a50 50 0 0113.194-33.843L1629 0h0" }),
33
- showLine(Line.l1) && /* @__PURE__ */ jsx("path", { d: "M1598 420v-86.225a50 50 0 014.438-20.594L1744 0h0" }),
34
- showLine(Line.center) && /* @__PURE__ */ jsx("path", { d: "M1864 420V0h0" }),
35
- showLine(Line.r1) && /* @__PURE__ */ jsx("path", { d: "M2130 420v-86.225a50 50 0 00-4.438-20.594L1984 0h0" }),
36
- showLine(Line.r2) && /* @__PURE__ */ jsx("path", { d: "M2396 420v-77.506a50 50 0 00-13.194-33.843L2099 0h0" }),
37
- showLine(Line.r3) && /* @__PURE__ */ jsx("path", { d: "M2662 420v-71.645a50 50 0 00-20.456-40.337L2221 0h0" }),
38
- showLine(Line.r4) && /* @__PURE__ */ jsx("path", { d: "M2928 420v-67.395a50 50 0 00-25.958-43.84L2339 0h0" }),
39
- showLine(Line.r5) && /* @__PURE__ */ jsx("path", { d: "M3194 420v-64.358a50 50 0 00-29.884-45.775L2459 0h0" }),
40
- showLine(Line.r6) && /* @__PURE__ */ jsx("path", { d: "M3460 420v-62.077c0-20.977-13.094-39.724-32.789-46.944L2579 0h0" }),
41
- showLine(Line.r7) && /* @__PURE__ */ jsx("path", { d: "M3726 420v-60.343c0-21.82-14.15-41.12-34.959-47.684L2702 0h0" })
9
+ showLine(0) && /* @__PURE__ */ jsx("path", { d: "M2 420v-60.343c0-21.82 14.15-41.12 34.959-47.684L1026 0h0" }),
10
+ showLine(1) && /* @__PURE__ */ jsx("path", { d: "M268 420v-62.077c0-20.977 13.094-39.724 32.789-46.944L1149 0h0" }),
11
+ showLine(2) && /* @__PURE__ */ jsx("path", { d: "M534 420v-64.358a50 50 0 0129.884-45.775L1269 0h0" }),
12
+ showLine(3) && /* @__PURE__ */ jsx("path", { d: "M800 420v-67.395a50 50 0 0125.958-43.84L1389 0h0" }),
13
+ showLine(4) && /* @__PURE__ */ jsx("path", { d: "M1066 420v-71.645a50 50 0 0120.456-40.337L1507 0h0" }),
14
+ showLine(5) && /* @__PURE__ */ jsx("path", { d: "M1332 420v-77.506a50 50 0 0113.194-33.843L1629 0h0" }),
15
+ showLine(6) && /* @__PURE__ */ jsx("path", { d: "M1598 420v-86.225a50 50 0 014.438-20.594L1744 0h0" }),
16
+ showLine(7) && /* @__PURE__ */ jsx("path", { d: "M1864 420V0h0" }),
17
+ showLine(8) && /* @__PURE__ */ jsx("path", { d: "M2130 420v-86.225a50 50 0 00-4.438-20.594L1984 0h0" }),
18
+ showLine(9) && /* @__PURE__ */ jsx("path", { d: "M2396 420v-77.506a50 50 0 00-13.194-33.843L2099 0h0" }),
19
+ showLine(10) && /* @__PURE__ */ jsx("path", { d: "M2662 420v-71.645a50 50 0 00-20.456-40.337L2221 0h0" }),
20
+ showLine(11) && /* @__PURE__ */ jsx("path", { d: "M2928 420v-67.395a50 50 0 00-25.958-43.84L2339 0h0" }),
21
+ showLine(12) && /* @__PURE__ */ jsx("path", { d: "M3194 420v-64.358a50 50 0 00-29.884-45.775L2459 0h0" }),
22
+ showLine(13) && /* @__PURE__ */ jsx("path", { d: "M3460 420v-62.077c0-20.977-13.094-39.724-32.789-46.944L2579 0h0" }),
23
+ showLine(14) && /* @__PURE__ */ jsx("path", { d: "M3726 420v-60.343c0-21.82-14.15-41.12-34.959-47.684L2702 0h0" })
42
24
  ] });
43
25
  const hLine = isUnpick && /* @__PURE__ */ jsxs(Fragment$1, { children: [
44
26
  /* @__PURE__ */ jsx("path", { d: "M2835 42H892" }),
package/es/awesome/GridBackground/components/Grid.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Grid.mjs","names":[],"sources":["../../../../src/awesome/GridBackground/components/Grid.tsx"],"sourcesContent":["import { isUndefined } from 'es-toolkit/compat';\nimport { memo, useCallback } from 'react';\n\nimport type { SvgProps } from '@/types';\n\nenum Line {\n l7,\n l6,\n l5,\n l4,\n l3,\n l2,\n l1,\n center,\n r1,\n r2,\n r3,\n r4,\n r5,\n r6,\n r7,\n}\n\nexport interface GridProps extends SvgProps {\n color?: string;\n linePick?: Line;\n strokeWidth?: number;\n}\n\nconst Grid = memo<GridProps>(({ color = '#fff', strokeWidth = 3, linePick, ...rest }) => {\n const isUnpick = isUndefined(linePick);\n\n const showLine = useCallback((l: Line) => isUnpick || linePick === l, [linePick]);\n\n const vLine = (\n <>\n {showLine(Line.l7) && <path d=\"M2 420v-60.343c0-21.82 14.15-41.12 34.959-47.684L1026 0h0\" />}\n {showLine(Line.l6) && (\n <path d=\"M268 420v-62.077c0-20.977 13.094-39.724 32.789-46.944L1149 0h0\" />\n )}\n {showLine(Line.l5) && <path d=\"M534 420v-64.358a50 50 0 0129.884-45.775L1269 0h0\" />}\n {showLine(Line.l4) && <path d=\"M800 420v-67.395a50 50 0 0125.958-43.84L1389 0h0\" />}\n {showLine(Line.l3) && <path d=\"M1066 420v-71.645a50 50 0 0120.456-40.337L1507 0h0\" />}\n {showLine(Line.l2) && <path d=\"M1332 420v-77.506a50 50 0 0113.194-33.843L1629 0h0\" />}\n {showLine(Line.l1) && <path d=\"M1598 420v-86.225a50 50 0 014.438-20.594L1744 0h0\" />}\n {showLine(Line.center) && <path d=\"M1864 420V0h0\" />}\n {showLine(Line.r1) && <path d=\"M2130 420v-86.225a50 50 0 00-4.438-20.594L1984 0h0\" />}\n {showLine(Line.r2) && <path d=\"M2396 420v-77.506a50 50 0 00-13.194-33.843L2099 0h0\" />}\n {showLine(Line.r3) && <path d=\"M2662 420v-71.645a50 50 0 00-20.456-40.337L2221 0h0\" />}\n {showLine(Line.r4) && <path d=\"M2928 420v-67.395a50 50 0 00-25.958-43.84L2339 0h0\" />}\n {showLine(Line.r5) && <path d=\"M3194 420v-64.358a50 50 0 00-29.884-45.775L2459 0h0\" />}\n {showLine(Line.r6) && (\n <path d=\"M3460 420v-62.077c0-20.977-13.094-39.724-32.789-46.944L2579 0h0\" />\n )}\n {showLine(Line.r7) && (\n <path d=\"M3726 420v-60.343c0-21.82-14.15-41.12-34.959-47.684L2702 0h0\" />\n )}\n </>\n );\n\n const hLine = isUnpick && (\n <>\n <path d=\"M2835 42H892\" />\n <path d=\"M595 136h2538\" />\n <path d=\"M237 249h3254\" />\n </>\n );\n\n return (\n <svg\n style={{ width: '100%' }}\n viewBox=\"0 0 3728 422\"\n xmlns=\"http://www.w3.org/2000/svg\"\n {...rest}\n >\n <g fill=\"none\" fillRule=\"evenodd\" stroke={color} strokeWidth={strokeWidth}>\n {vLine}\n {hLine}\n </g>\n </svg>\n );\n});\n\nGrid.displayName = 'Grid';\n\nexport default Grid;\n"],"mappings":";;;;AAKA,IAAK,OAAL,yBAAA,MAAA;AACE,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,YAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,MAAA;AACA,MAAA,KAAA,QAAA,MAAA;AACA,MAAA,KAAA,QAAA,MAAA;AACA,MAAA,KAAA,QAAA,MAAA;AACA,MAAA,KAAA,QAAA,MAAA;;EAfG,QAAA,EAAA,CAgBJ;AAQD,MAAM,OAAO,MAAiB,EAAE,QAAQ,QAAQ,cAAc,GAAG,UAAU,GAAG,WAAW;CACvF,MAAM,WAAW,YAAY,SAAS;CAEtC,MAAM,WAAW,aAAa,MAAY,YAAY,aAAa,GAAG,CAAC,SAAS,CAAC;CAEjF,MAAM,QACJ,qBAAA,YAAA,EAAA,UAAA;EACG,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,6DAA8D,CAAA;EAC3F,SAAS,KAAK,GAAG,IAChB,oBAAC,QAAD,EAAM,GAAE,kEAAmE,CAAA;EAE5E,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,qDAAsD,CAAA;EACnF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,oDAAqD,CAAA;EAClF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,qDAAsD,CAAA;EACnF,SAAS,KAAK,OAAO,IAAI,oBAAC,QAAD,EAAM,GAAE,iBAAkB,CAAA;EACnD,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,uDAAwD,CAAA;EACrF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,uDAAwD,CAAA;EACrF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,uDAAwD,CAAA;EACrF,SAAS,KAAK,GAAG,IAChB,oBAAC,QAAD,EAAM,GAAE,mEAAoE,CAAA;EAE7E,SAAS,KAAK,GAAG,IAChB,oBAAC,QAAD,EAAM,GAAE,gEAAiE,CAAA;EAE1E,EAAA,CAAA;CAGL,MAAM,QAAQ,YACZ,qBAAA,YAAA,EAAA,UAAA;EACE,oBAAC,QAAD,EAAM,GAAE,gBAAiB,CAAA;EACzB,oBAAC,QAAD,EAAM,GAAE,iBAAkB,CAAA;EAC1B,oBAAC,QAAD,EAAM,GAAE,iBAAkB,CAAA;EACzB,EAAA,CAAA;AAGL,QACE,oBAAC,OAAD;EACE,OAAO,EAAE,OAAO,QAAQ;EACxB,SAAQ;EACR,OAAM;EACN,GAAI;YAEJ,qBAAC,KAAD;GAAG,MAAK;GAAO,UAAS;GAAU,QAAQ;GAAoB;aAA9D,CACG,OACA,MACC;;EACA,CAAA;EAER;AAEF,KAAK,cAAc"}
1
+ {"version":3,"file":"Grid.mjs","names":[],"sources":["../../../../src/awesome/GridBackground/components/Grid.tsx"],"sourcesContent":["import { isUndefined } from 'es-toolkit/compat';\nimport { memo, useCallback } from 'react';\n\nimport type { SvgProps } from '@/types';\n\nenum Line {\n l7,\n l6,\n l5,\n l4,\n l3,\n l2,\n l1,\n center,\n r1,\n r2,\n r3,\n r4,\n r5,\n r6,\n r7,\n}\n\nexport interface GridProps extends SvgProps {\n color?: string;\n linePick?: Line;\n strokeWidth?: number;\n}\n\nconst Grid = memo<GridProps>(({ color = '#fff', strokeWidth = 3, linePick, ...rest }) => {\n const isUnpick = isUndefined(linePick);\n\n const showLine = useCallback((l: Line) => isUnpick || linePick === l, [linePick]);\n\n const vLine = (\n <>\n {showLine(Line.l7) && <path d=\"M2 420v-60.343c0-21.82 14.15-41.12 34.959-47.684L1026 0h0\" />}\n {showLine(Line.l6) && (\n <path d=\"M268 420v-62.077c0-20.977 13.094-39.724 32.789-46.944L1149 0h0\" />\n )}\n {showLine(Line.l5) && <path d=\"M534 420v-64.358a50 50 0 0129.884-45.775L1269 0h0\" />}\n {showLine(Line.l4) && <path d=\"M800 420v-67.395a50 50 0 0125.958-43.84L1389 0h0\" />}\n {showLine(Line.l3) && <path d=\"M1066 420v-71.645a50 50 0 0120.456-40.337L1507 0h0\" />}\n {showLine(Line.l2) && <path d=\"M1332 420v-77.506a50 50 0 0113.194-33.843L1629 0h0\" />}\n {showLine(Line.l1) && <path d=\"M1598 420v-86.225a50 50 0 014.438-20.594L1744 0h0\" />}\n {showLine(Line.center) && <path d=\"M1864 420V0h0\" />}\n {showLine(Line.r1) && <path d=\"M2130 420v-86.225a50 50 0 00-4.438-20.594L1984 0h0\" />}\n {showLine(Line.r2) && <path d=\"M2396 420v-77.506a50 50 0 00-13.194-33.843L2099 0h0\" />}\n {showLine(Line.r3) && <path d=\"M2662 420v-71.645a50 50 0 00-20.456-40.337L2221 0h0\" />}\n {showLine(Line.r4) && <path d=\"M2928 420v-67.395a50 50 0 00-25.958-43.84L2339 0h0\" />}\n {showLine(Line.r5) && <path d=\"M3194 420v-64.358a50 50 0 00-29.884-45.775L2459 0h0\" />}\n {showLine(Line.r6) && (\n <path d=\"M3460 420v-62.077c0-20.977-13.094-39.724-32.789-46.944L2579 0h0\" />\n )}\n {showLine(Line.r7) && (\n <path d=\"M3726 420v-60.343c0-21.82-14.15-41.12-34.959-47.684L2702 0h0\" />\n )}\n </>\n );\n\n const hLine = isUnpick && (\n <>\n <path d=\"M2835 42H892\" />\n <path d=\"M595 136h2538\" />\n <path d=\"M237 249h3254\" />\n </>\n );\n\n return (\n <svg\n style={{ width: '100%' }}\n viewBox=\"0 0 3728 422\"\n xmlns=\"http://www.w3.org/2000/svg\"\n {...rest}\n >\n <g fill=\"none\" fillRule=\"evenodd\" stroke={color} strokeWidth={strokeWidth}>\n {vLine}\n {hLine}\n </g>\n </svg>\n );\n});\n\nGrid.displayName = 'Grid';\n\nexport default Grid;\n"],"mappings":";;;;AA6BA,MAAM,OAAO,MAAiB,EAAE,QAAQ,QAAQ,cAAc,GAAG,UAAU,GAAG,WAAW;CACvF,MAAM,WAAW,YAAY,SAAS;CAEtC,MAAM,WAAW,aAAa,MAAY,YAAY,aAAa,GAAG,CAAC,SAAS,CAAC;CAEjF,MAAM,QACJ,qBAAA,YAAA,EAAA,UAAA;EACG,SAAA,EAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,6DAA8D,CAAA;EAC3F,SAAA,EAAiB,IAChB,oBAAC,QAAD,EAAM,GAAE,kEAAmE,CAAA;EAE5E,SAAA,EAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,qDAAsD,CAAA;EACnF,SAAA,EAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,oDAAqD,CAAA;EAClF,SAAA,EAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAA,EAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAA,EAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,qDAAsD,CAAA;EACnF,SAAA,EAAqB,IAAI,oBAAC,QAAD,EAAM,GAAE,iBAAkB,CAAA;EACnD,SAAA,EAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAA,EAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,uDAAwD,CAAA;EACrF,SAAA,GAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,uDAAwD,CAAA;EACrF,SAAA,GAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAA,GAAiB,IAAI,oBAAC,QAAD,EAAM,GAAE,uDAAwD,CAAA;EACrF,SAAA,GAAiB,IAChB,oBAAC,QAAD,EAAM,GAAE,mEAAoE,CAAA;EAE7E,SAAA,GAAiB,IAChB,oBAAC,QAAD,EAAM,GAAE,gEAAiE,CAAA;EAE1E,EAAA,CAAA;CAGL,MAAM,QAAQ,YACZ,qBAAA,YAAA,EAAA,UAAA;EACE,oBAAC,QAAD,EAAM,GAAE,gBAAiB,CAAA;EACzB,oBAAC,QAAD,EAAM,GAAE,iBAAkB,CAAA;EAC1B,oBAAC,QAAD,EAAM,GAAE,iBAAkB,CAAA;EACzB,EAAA,CAAA;AAGL,QACE,oBAAC,OAAD;EACE,OAAO,EAAE,OAAO,QAAQ;EACxB,SAAQ;EACR,OAAM;EACN,GAAI;YAEJ,qBAAC,KAAD;GAAG,MAAK;GAAO,UAAS;GAAU,QAAQ;GAAoB;aAA9D,CACG,OACA,MACC;;EACA,CAAA;EAER;AAEF,KAAK,cAAc"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lobehub/ui",
3
- "version": "5.7.1",
3
+ "version": "5.9.0",
4
4
  "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
5
5
  "keywords": [
6
6
  "lobehub",