markdown-flow-ui 0.2.5 → 0.2.7-dev.1

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 (52) hide show
  1. package/dist/_virtual/index.cjs8.js +1 -1
  2. package/dist/_virtual/index.cjs9.js +1 -1
  3. package/dist/_virtual/index.es8.js +2 -2
  4. package/dist/_virtual/index.es9.js +2 -2
  5. package/dist/assets/markdown-flow-ui.css +1 -1
  6. package/dist/components/ContentRender/CodeBlock.cjs.js.map +1 -1
  7. package/dist/components/ContentRender/CodeBlock.d.ts +1 -1
  8. package/dist/components/ContentRender/CodeBlock.es.js.map +1 -1
  9. package/dist/components/ContentRender/ContentRender.cjs.js +2 -2
  10. package/dist/components/ContentRender/ContentRender.cjs.js.map +1 -1
  11. package/dist/components/ContentRender/ContentRender.es.js +212 -191
  12. package/dist/components/ContentRender/ContentRender.es.js.map +1 -1
  13. package/dist/components/ContentRender/plugins/CustomVariable.cjs.js +1 -1
  14. package/dist/components/ContentRender/plugins/CustomVariable.cjs.js.map +1 -1
  15. package/dist/components/ContentRender/plugins/CustomVariable.es.js +49 -43
  16. package/dist/components/ContentRender/plugins/CustomVariable.es.js.map +1 -1
  17. package/dist/components/MarkdownFlowEditor/locales/en-US.json.d.ts +70 -0
  18. package/dist/components/MarkdownFlowEditor/locales/fr-FR.json.d.ts +70 -0
  19. package/dist/components/MarkdownFlowEditor/locales/zh-CN.json.d.ts +70 -0
  20. package/dist/components/Slide/Slide.cjs.js +1 -1
  21. package/dist/components/Slide/Slide.cjs.js.map +1 -1
  22. package/dist/components/Slide/Slide.es.js +258 -254
  23. package/dist/components/Slide/Slide.es.js.map +1 -1
  24. package/dist/components/Slide/diff-utils.cjs.js +4 -4
  25. package/dist/components/Slide/diff-utils.cjs.js.map +1 -1
  26. package/dist/components/Slide/diff-utils.es.js +49 -49
  27. package/dist/components/Slide/diff-utils.es.js.map +1 -1
  28. package/dist/components/Slide/types.d.ts +1 -0
  29. package/dist/components/ui/inputGroup/input-group.cjs.js +1 -1
  30. package/dist/components/ui/inputGroup/input-group.cjs.js.map +1 -1
  31. package/dist/components/ui/inputGroup/input-group.d.ts +21 -1
  32. package/dist/components/ui/inputGroup/input-group.es.js +19 -17
  33. package/dist/components/ui/inputGroup/input-group.es.js.map +1 -1
  34. package/dist/components/ui/inputGroup/textarea.cjs.js.map +1 -1
  35. package/dist/components/ui/inputGroup/textarea.d.ts +2 -1
  36. package/dist/components/ui/inputGroup/textarea.es.js.map +1 -1
  37. package/dist/lib/mobileDevice.cjs.js +1 -1
  38. package/dist/lib/mobileDevice.cjs.js.map +1 -1
  39. package/dist/lib/mobileDevice.d.ts +1 -3
  40. package/dist/lib/mobileDevice.es.js +29 -38
  41. package/dist/lib/mobileDevice.es.js.map +1 -1
  42. package/dist/markdown-flow-ui-lib.css +1 -1
  43. package/dist/node_modules/@braintree/sanitize-url/dist/index.cjs.js +1 -1
  44. package/dist/node_modules/@braintree/sanitize-url/dist/index.es.js +1 -1
  45. package/dist/node_modules/classnames/index.cjs.js +1 -1
  46. package/dist/node_modules/classnames/index.es.js +1 -1
  47. package/package.json +1 -1
  48. package/dist/components/ContentRender/ContentRender.stories.d.ts +0 -37
  49. package/dist/components/ContentRender/MarkdownFlowInput.stories.d.ts +0 -33
  50. package/dist/components/MarkdownFlow/MarkdownFlow.stories.d.ts +0 -31
  51. package/dist/components/MarkdownFlowEditor/MarkdownFlowEditor.stories.d.ts +0 -64
  52. package/dist/components/Slide/Slide.stories.d.ts +0 -2590
@@ -1 +1 @@
1
- {"version":3,"file":"ContentRender.es.js","sources":["../../../src/components/ContentRender/ContentRender.tsx"],"sourcesContent":["import \"highlight.js/styles/github.css\";\nimport \"katex/dist/katex.min.css\";\nimport React, { useEffect, useMemo, useRef, useState } from \"react\";\nimport ReactMarkdown from \"react-markdown\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeRaw from \"rehype-raw\";\nimport remarkBreaks from \"remark-breaks\";\nimport remarkFlow from \"remark-flow\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport { CustomRenderBarProps, OnSendContentParams } from \"../types\";\nimport { sanitizeInvalidTagName } from \"./utils/sanitize-invalid-tag-name\";\nimport { stripSvgTextLineBreaks } from \"./utils/strip-svg-text-line-breaks\";\nimport \"./contentRender.css\";\nimport \"./github-markdown-light.css\";\nimport CodeBlock from \"./CodeBlock\";\nimport CustomButtonInputVariable, {\n ComponentsWithCustomVariable,\n} from \"./plugins/CustomVariable\";\nimport MermaidChart from \"./plugins/MermaidChart\";\nimport {\n preserveCustomVariableProperties,\n restoreCustomVariableProperties,\n} from \"./utils/custom-variable-props\";\nimport {\n highlightLanguages,\n subsetLanguages,\n} from \"./utils/highlight-languages\";\n// import { processMarkdownText } from \"./utils/process-markdown\";\nimport {\n parseMarkdownSegments,\n mermaidBlockIsComplete,\n} from \"./utils/mermaid-parse\";\nimport { normalizeInlineHtml } from \"./utils/normalize-inline-html\";\nimport IframeSandbox from \"./IframeSandbox\";\nimport {\n splitContentSegments,\n type RenderSegment,\n} from \"./utils/split-content\";\nimport {\n getInteractionDefaultValues,\n type InteractionDefaultValueOptions,\n} from \"../../lib/interaction-defaults\";\nimport type { MarkdownFlowLocale } from \"../../lib/locale\";\nimport { getContentRenderLocaleTexts } from \"./contentRenderI18n\";\n\nconst SANDBOX_TAG_HINT_PATTERN =\n /<(script|style|link|iframe|html|head|body|meta|title|base|template|div|section|article|main)\\b/i;\n\n// Define component Props type\nexport interface ContentRenderProps {\n content: string;\n contentType?: string;\n /** Locale used for built-in UI text when a more specific text prop is not provided. */\n locale?: MarkdownFlowLocale;\n /**\n * Callback invoked when the custom button after content is clicked.\n * This button is rendered via the `<custom-button-after-content>` tag in markdown content.\n * @example\n * ```tsx\n * <ContentRender\n * content=\"Hello <custom-button-after-content>Ask</custom-button-after-content>\"\n * onClickCustomButtonAfterContent={() => console.log('Button clicked')}\n * />\n * ```\n */\n customRenderBar?: CustomRenderBarProps;\n onClickCustomButtonAfterContent?: () => void;\n onSend?: (content: OnSendContentParams) => void;\n typingSpeed?: number;\n enableTypewriter?: boolean;\n onTypeFinished?: () => void;\n onTypewriterStateChange?: (state: ContentRenderTypewriterState) => void;\n userInput?: string;\n interactionDefaultValueOptions?: InteractionDefaultValueOptions;\n defaultButtonText?: string;\n defaultInputText?: string; // Text input by user\n defaultSelectedValues?: string[]; // Default selected values for multi-select\n readonly?: boolean;\n // Multi-select confirm button text (i18n support)\n confirmButtonText?: string;\n // Copy button text (i18n support)\n copyButtonText?: string;\n // Copied state text (i18n support)\n copiedButtonText?: string;\n // Dynamic interaction format for multi-select support\n dynamicInteractionFormat?: string;\n // Loading text before first HTML block renders inside iframe (i18n support)\n sandboxLoadingText?: string;\n // Loading text while styles are being generated inside iframe\n sandboxStyleLoadingText?: string;\n // Loading text while scripts are being cached/executed inside iframe\n sandboxScriptLoadingText?: string;\n // Disable sandbox loading overlays when upper layers have already entered an error state\n disableSandboxLoadingOverlay?: boolean;\n // Fullscreen button text for iframe sandbox\n sandboxFullscreenButtonText?: string;\n // Exit fullscreen button text for iframe sandbox\n sandboxExitFullscreenButtonText?: string;\n // Sandbox render mode\n sandboxMode?: \"content\" | \"blackboard\";\n beforeSend?: (param: OnSendContentParams) => boolean;\n // tooltipMinLength?: number; // Control minimum character length for tooltip display, default 10\n}\n\nexport interface ContentRenderTypewriterState {\n isTypewriterEnabled: boolean;\n isTyping: boolean;\n isComplete: boolean;\n renderedLength: number;\n totalLength: number;\n}\n\n// Render svg string via Shadow DOM to avoid markdown wrapping\nconst SvgBlockInShadow: React.FC<{ svg: string }> = ({ svg }) => {\n const hostRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const host = hostRef.current;\n if (!host) return;\n const shadowRoot = host.shadowRoot ?? host.attachShadow({ mode: \"open\" });\n const styleId = \"content-render-svg-style\";\n let styleEl = shadowRoot.getElementById(styleId) as HTMLStyleElement | null;\n\n if (!styleEl) {\n styleEl = document.createElement(\"style\");\n styleEl.id = styleId;\n // Keep intrinsic SVG width so the wrapper can scroll horizontally when needed\n styleEl.textContent = `\n svg { height: auto; display: inline-block; }\n svg.content-render-svg-el--responsive { width: 100%; max-width: 100%; }\n svg.content-render-svg-el--fixed { max-width: none; }\n `;\n shadowRoot.appendChild(styleEl);\n }\n\n const nodesToRemove = Array.from(shadowRoot.childNodes).filter(\n (node) => node !== styleEl\n );\n nodesToRemove.forEach((node) => shadowRoot.removeChild(node));\n\n const template = document.createElement(\"template\");\n const cleanedSvg = stripSvgTextLineBreaks(svg);\n template.innerHTML = cleanedSvg;\n shadowRoot.append(template.content.cloneNode(true));\n\n let hasResponsiveSvg = false;\n let hasFixedSvg = false;\n\n shadowRoot.querySelectorAll(\"svg\").forEach((svgEl) => {\n // Derive responsive sizing from viewBox so pure viewBox SVGs stay visible and fluid\n const viewBox = svgEl.getAttribute(\"viewBox\");\n if (!viewBox) return;\n\n const dimensions = viewBox\n .trim()\n .split(/[\\s,]+/)\n .map((value) => Number(value));\n\n if (dimensions.length !== 4 || dimensions.some(Number.isNaN)) return;\n\n const [, , viewBoxWidth, viewBoxHeight] = dimensions;\n const widthAttr = svgEl.getAttribute(\"width\");\n const heightAttr = svgEl.getAttribute(\"height\");\n const isRelativeLength = (value?: string | null) => {\n if (!value) return false;\n const normalized = value.trim().toLowerCase();\n return normalized === \"auto\" || normalized.endsWith(\"%\");\n };\n const toNumericLength = (value?: string | null) => {\n if (!value) return null;\n const normalized = value.trim().toLowerCase();\n if (normalized === \"auto\" || normalized.endsWith(\"%\")) {\n return null;\n }\n const parsed = Number.parseFloat(normalized);\n return Number.isNaN(parsed) ? null : parsed;\n };\n // Treat percentage/auto sizing as responsive so viewBox drives the layout\n const isWidthRelative = isRelativeLength(widthAttr);\n const isHeightRelative = isRelativeLength(heightAttr);\n const widthMissing = !widthAttr || widthAttr === \"0\";\n const heightMissing = !heightAttr || heightAttr === \"0\";\n const numericWidth = toNumericLength(widthAttr);\n const numericHeight = toNumericLength(heightAttr);\n const matchesViewBox =\n numericWidth === viewBoxWidth && numericHeight === viewBoxHeight;\n\n // Prefer responsive layout when sizing is relative or matches the viewBox\n const shouldUseResponsiveSize =\n isWidthRelative ||\n isHeightRelative ||\n (widthMissing && heightMissing) ||\n matchesViewBox;\n\n if (shouldUseResponsiveSize) {\n hasResponsiveSvg = true;\n svgEl.classList.add(\"content-render-svg-el--responsive\");\n svgEl.classList.remove(\"content-render-svg-el--fixed\");\n svgEl.style.width = \"100%\";\n svgEl.style.height = \"auto\";\n if (!svgEl.style.aspectRatio && viewBoxHeight > 0) {\n svgEl.style.aspectRatio = `${viewBoxWidth} / ${viewBoxHeight}`;\n }\n return;\n }\n\n hasFixedSvg = true;\n svgEl.classList.add(\"content-render-svg-el--fixed\");\n svgEl.classList.remove(\"content-render-svg-el--responsive\");\n if (widthMissing && viewBoxWidth > 0) {\n svgEl.setAttribute(\"width\", `${viewBoxWidth}`);\n }\n if (heightMissing && viewBoxHeight > 0) {\n svgEl.setAttribute(\"height\", `${viewBoxHeight}`);\n }\n });\n\n const hostResponsive = hasResponsiveSvg && !hasFixedSvg;\n host.classList.toggle(\"content-render-svg--responsive\", hostResponsive);\n host.classList.toggle(\"content-render-svg--fixed\", !hostResponsive);\n }, [svg]);\n\n return (\n <div className=\"content-render-svg-scroll\">\n <div className=\"content-render-svg\" ref={hostRef} />\n </div>\n );\n};\n\n// Extended component interface\ntype CustomComponents = ComponentsWithCustomVariable & {\n \"custom-button-after-content\"?: React.ComponentType<{\n children: React.ReactNode;\n }>;\n};\n\nconst remarkPlugins = [remarkGfm, remarkMath, remarkFlow, remarkBreaks];\n\nconst rehypePlugins = [\n preserveCustomVariableProperties,\n rehypeRaw,\n sanitizeInvalidTagName,\n restoreCustomVariableProperties,\n [rehypeHighlight, { languages: highlightLanguages, subset: subsetLanguages }],\n rehypeKatex,\n];\n\nexport const MarkdownRenderer: React.FC<{\n content: string;\n components: CustomComponents;\n}> = ({ content: markdownContent, components }) => (\n <div className=\"markdown-renderer\">\n <ReactMarkdown\n remarkPlugins={remarkPlugins}\n rehypePlugins={rehypePlugins}\n components={components}\n >\n {markdownContent}\n </ReactMarkdown>\n </div>\n);\n\nconst mergeNonSandboxSegments = (segments: RenderSegment[]) => {\n if (segments.length <= 1) return segments;\n const merged: RenderSegment[] = [];\n\n segments.forEach((segment) => {\n if (segment.type === \"sandbox\") {\n merged.push(segment);\n return;\n }\n\n const last = merged[merged.length - 1];\n if (last && last.type !== \"sandbox\") {\n merged[merged.length - 1] = {\n type: \"markdown\",\n value: `${last.value}${segment.value}`,\n };\n return;\n }\n\n merged.push({ type: \"markdown\", value: segment.value });\n });\n\n return merged;\n};\n\nconst splitTextByCharacterChunk = (value: string, chunkSize: number) => {\n const safeChunkSize = Math.max(1, chunkSize);\n const characters = Array.from(value);\n\n return {\n chunk: characters.slice(0, safeChunkSize).join(\"\"),\n rest: characters.slice(safeChunkSize).join(\"\"),\n };\n};\n\nconst ContentRender: React.FC<ContentRenderProps> = ({\n content,\n contentType,\n locale,\n customRenderBar,\n onSend,\n typingSpeed = 40,\n enableTypewriter = false,\n onTypeFinished,\n onTypewriterStateChange,\n userInput,\n interactionDefaultValueOptions,\n defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n readonly = false,\n confirmButtonText,\n copyButtonText,\n copiedButtonText,\n sandboxLoadingText,\n sandboxStyleLoadingText,\n sandboxScriptLoadingText,\n disableSandboxLoadingOverlay = false,\n sandboxFullscreenButtonText,\n sandboxExitFullscreenButtonText,\n sandboxMode = \"content\",\n onClickCustomButtonAfterContent,\n beforeSend,\n // tooltipMinLength,\n}) => {\n const localeTexts = getContentRenderLocaleTexts(locale);\n const resolvedConfirmButtonText =\n confirmButtonText || localeTexts.confirmButtonText;\n const resolvedCopyButtonText = copyButtonText || localeTexts.copyButtonText;\n const resolvedCopiedButtonText =\n copiedButtonText || localeTexts.copiedButtonText;\n const resolvedSandboxFullscreenButtonText =\n sandboxFullscreenButtonText || localeTexts.sandboxFullscreenButtonText;\n const resolvedSandboxExitFullscreenButtonText =\n sandboxExitFullscreenButtonText ||\n localeTexts.sandboxExitFullscreenButtonText;\n const shouldApplyTypewriterByContentType =\n !contentType || contentType === \"text\";\n const isTypewriterEnabled =\n Boolean(enableTypewriter) && shouldApplyTypewriterByContentType;\n const typewriterChunkSize = 2;\n const typewriterTickMs = Math.max(0, typingSpeed);\n const [displayContent, setDisplayContent] = useState(() =>\n isTypewriterEnabled ? \"\" : content\n );\n const pendingContentRef = useRef(\"\");\n const previousTypewriterEnabledRef = useRef(isTypewriterEnabled);\n const hasReportedTypeFinishedRef = useRef(false);\n\n useEffect(() => {\n const wasTypewriterEnabled = previousTypewriterEnabledRef.current;\n previousTypewriterEnabledRef.current = isTypewriterEnabled;\n hasReportedTypeFinishedRef.current = false;\n\n if (!isTypewriterEnabled) {\n pendingContentRef.current = \"\";\n setDisplayContent(content);\n return;\n }\n\n setDisplayContent((current) => {\n const shouldRestartTyping = !wasTypewriterEnabled;\n const canContinueTyping = content.startsWith(current);\n\n if (!shouldRestartTyping && !canContinueTyping) {\n pendingContentRef.current = \"\";\n return content;\n }\n\n const nextVisibleContent =\n shouldRestartTyping || !canContinueTyping ? \"\" : current;\n\n pendingContentRef.current = content.slice(nextVisibleContent.length);\n return nextVisibleContent;\n });\n }, [content, isTypewriterEnabled]);\n\n useEffect(() => {\n if (!isTypewriterEnabled) {\n return;\n }\n\n if (\n hasReportedTypeFinishedRef.current ||\n pendingContentRef.current ||\n displayContent !== content\n ) {\n return;\n }\n\n hasReportedTypeFinishedRef.current = true;\n onTypeFinished?.();\n }, [content, displayContent, isTypewriterEnabled, onTypeFinished]);\n\n useEffect(() => {\n if (!isTypewriterEnabled || !pendingContentRef.current) {\n return undefined;\n }\n\n const typewriterTimer = window.setTimeout(() => {\n setDisplayContent((current) => {\n const { chunk, rest } = splitTextByCharacterChunk(\n pendingContentRef.current,\n typewriterChunkSize\n );\n\n if (!chunk) {\n return current;\n }\n\n pendingContentRef.current = rest;\n return `${current}${chunk}`;\n });\n }, typewriterTickMs);\n\n return () => window.clearTimeout(typewriterTimer);\n }, [\n content,\n displayContent,\n isTypewriterEnabled,\n typewriterChunkSize,\n typewriterTickMs,\n ]);\n\n const typewriterState = useMemo<ContentRenderTypewriterState>(\n () => ({\n isTypewriterEnabled,\n isTyping: isTypewriterEnabled && displayContent !== content,\n isComplete: displayContent === content,\n renderedLength: displayContent.length,\n totalLength: content.length,\n }),\n [content, displayContent, isTypewriterEnabled]\n );\n\n useEffect(() => {\n onTypewriterStateChange?.(typewriterState);\n }, [onTypewriterStateChange, typewriterState]);\n\n const renderContent = isTypewriterEnabled ? displayContent : content;\n const normalizedContent = useMemo(\n () => normalizeInlineHtml(renderContent),\n [renderContent]\n );\n\n const interactionDefaults = useMemo(\n () =>\n getInteractionDefaultValues(\n renderContent,\n userInput,\n interactionDefaultValueOptions\n ),\n [interactionDefaultValueOptions, renderContent, userInput]\n );\n\n const resolvedDefaultButtonText =\n defaultButtonText?.trim() || interactionDefaults.buttonText;\n const resolvedDefaultInputText =\n defaultInputText?.trim() || interactionDefaults.inputText;\n const fallbackSelectedValues = useMemo(\n () =>\n userInput\n ? userInput\n .split(\",\")\n .map((value) => value.trim())\n .filter(Boolean)\n : undefined,\n [userInput]\n );\n const resolvedDefaultSelectedValues = defaultSelectedValues?.length\n ? defaultSelectedValues\n : interactionDefaults.selectedValues || fallbackSelectedValues;\n\n const components: CustomComponents = {\n \"custom-button-after-content\": ({\n children,\n }: {\n children: React.ReactNode;\n }) => {\n return (\n <button\n className=\"content-render-custom-button-after-content\"\n onClick={onClickCustomButtonAfterContent}\n >\n <span className=\"content-render-custom-button-after-content-inner\">\n {children}\n </span>\n </button>\n );\n },\n \"custom-variable\": (props) => (\n <CustomButtonInputVariable\n {...props}\n readonly={readonly}\n defaultButtonText={resolvedDefaultButtonText}\n defaultInputText={resolvedDefaultInputText}\n defaultSelectedValues={resolvedDefaultSelectedValues}\n onSend={onSend}\n beforeSend={beforeSend}\n locale={locale}\n confirmButtonText={resolvedConfirmButtonText}\n // tooltipMinLength={tooltipMinLength}\n />\n ),\n code: (props) => {\n const { className, children, ...rest } = props as {\n className?: string;\n children?: React.ReactNode;\n };\n const match = /language-(\\w+)/.exec(className || \"\");\n const language = match?.[1];\n if (language === \"mermaid\") {\n const chartContent = children?.toString().replace(/\\n$/, \"\") || \"\";\n const frozen = mermaidBlockIsComplete(renderContent, chartContent);\n return <MermaidChart chart={chartContent} frozen={frozen} />;\n }\n\n return (\n <code className={className} {...rest}>\n {children}\n </code>\n );\n },\n table: ({ ...props }) => (\n <div className=\"content-render-table-container\">\n <table className=\"content-render-table\" {...props} />\n </div>\n ),\n th: ({ ...props }) => <th className=\"content-render-th\" {...props} />,\n td: ({ ...props }) => <td className=\"content-render-td\" {...props} />,\n tr: ({ ...props }) => <tr className=\"content-render-tr\" {...props} />,\n li: ({ node, ...props }) => {\n const className = node?.properties?.className;\n const hasTaskListItem =\n (typeof className === \"string\" &&\n className.includes(\"task-list-item\")) ||\n (Array.isArray(className) && className.includes(\"task-list-item\"));\n if (hasTaskListItem) {\n return <li className=\"content-render-task-list-item\" {...props} />;\n }\n return <li {...props} />;\n },\n ol: ({ ...props }) => <ol className=\"content-render-ol\" {...props} />,\n ul: ({ ...props }) => <ul className=\"content-render-ul\" {...props} />,\n input: ({ ...props }) => {\n if (props.type === \"checkbox\") {\n return (\n <input\n type=\"checkbox\"\n className=\"content-render-checkbox\"\n disabled\n {...props}\n />\n );\n }\n return <input {...props} />;\n },\n a: ({ children, ...props }) => (\n <a target=\"_blank\" rel=\"noopener noreferrer\" {...props}>\n {children}\n </a>\n ),\n pre: (props) => (\n <CodeBlock\n {...props}\n copyButtonText={resolvedCopyButtonText}\n copiedButtonText={resolvedCopiedButtonText}\n />\n ),\n };\n\n const hasPotentialSandboxTags = useMemo(\n () => SANDBOX_TAG_HINT_PATTERN.test(renderContent),\n [renderContent]\n );\n\n const renderSegments = useMemo(\n () =>\n hasPotentialSandboxTags ? splitContentSegments(renderContent, true) : [],\n [renderContent, hasPotentialSandboxTags]\n );\n\n const hasSandbox = renderSegments.some(\n (segment) => segment.type === \"sandbox\"\n );\n const mergedRenderSegments = useMemo(\n () => mergeNonSandboxSegments(renderSegments),\n [renderSegments]\n );\n\n const segments = useMemo(\n () => parseMarkdownSegments(normalizedContent),\n [normalizedContent]\n );\n\n const renderMarkdownSegments = (raw: string, keyPrefix: string) => {\n const normalized = normalizeInlineHtml(raw);\n const parsed = parseMarkdownSegments(normalized);\n\n return parsed.map((seg, index) => {\n const key = `${keyPrefix}-${seg.type}-${index}`;\n\n if (seg.type === \"text\") {\n return (\n <MarkdownRenderer\n key={key}\n components={components}\n content={seg.value}\n />\n );\n }\n\n if (seg.type === \"mermaid\") {\n return (\n <MermaidChart key={key} chart={seg.value} frozen={!seg.complete} />\n );\n }\n\n if (seg.type === \"svg\") {\n return <SvgBlockInShadow key={key} svg={seg.value} />;\n }\n\n return null;\n });\n };\n\n if (hasSandbox) {\n return (\n <div className=\"content-render markdown-body\">\n {mergedRenderSegments.map((segment, idx) =>\n segment.type === \"sandbox\" ? (\n <IframeSandbox\n key={`sandbox-${idx}`}\n hideFullScreen\n type=\"sandbox\"\n content={segment.value}\n className=\"content-render-iframe\"\n locale={locale}\n loadingText={sandboxLoadingText}\n styleLoadingText={sandboxStyleLoadingText}\n scriptLoadingText={sandboxScriptLoadingText}\n disableLoadingOverlay={disableSandboxLoadingOverlay}\n fullScreenButtonText={resolvedSandboxFullscreenButtonText}\n exitFullScreenButtonText={resolvedSandboxExitFullscreenButtonText}\n mode={sandboxMode}\n />\n ) : (\n <React.Fragment key={`md-${idx}`}>\n {renderMarkdownSegments(segment.value, `md-${idx}`)}\n </React.Fragment>\n )\n )}\n </div>\n );\n }\n\n return (\n <div className=\"content-render markdown-body\">\n {segments.map((seg, index) => {\n if (seg.type === \"text\") {\n return (\n <MarkdownRenderer\n key={index}\n components={components}\n content={seg.value}\n />\n );\n }\n\n if (seg.type === \"mermaid\") {\n return (\n <MermaidChart\n key={index}\n chart={seg.value}\n frozen={!seg.complete}\n />\n );\n }\n\n if (seg.type === \"svg\") {\n return <SvgBlockInShadow key={index} svg={seg.value} />;\n }\n })}\n\n {customRenderBar && (\n <div className=\"content-render-custom-bar\">\n {React.createElement(customRenderBar, {\n content,\n displayContent: normalizedContent,\n onSend,\n })}\n </div>\n )}\n </div>\n );\n};\n\nexport default ContentRender;\n"],"names":["SANDBOX_TAG_HINT_PATTERN","SvgBlockInShadow","svg","hostRef","useRef","useEffect","host","shadowRoot","styleId","styleEl","node","template","cleanedSvg","stripSvgTextLineBreaks","hasResponsiveSvg","hasFixedSvg","svgEl","viewBox","dimensions","value","viewBoxWidth","viewBoxHeight","widthAttr","heightAttr","isRelativeLength","normalized","toNumericLength","parsed","isWidthRelative","isHeightRelative","widthMissing","heightMissing","numericWidth","numericHeight","hostResponsive","jsx","remarkPlugins","remarkGfm","remarkMath","remarkFlow","remarkBreaks","rehypePlugins","preserveCustomVariableProperties","rehypeRaw","sanitizeInvalidTagName","restoreCustomVariableProperties","rehypeHighlight","highlightLanguages","subsetLanguages","rehypeKatex","MarkdownRenderer","markdownContent","components","ReactMarkdown","mergeNonSandboxSegments","segments","merged","segment","last","splitTextByCharacterChunk","chunkSize","safeChunkSize","characters","ContentRender","content","contentType","locale","customRenderBar","onSend","typingSpeed","enableTypewriter","onTypeFinished","onTypewriterStateChange","userInput","interactionDefaultValueOptions","defaultButtonText","defaultInputText","defaultSelectedValues","readonly","confirmButtonText","copyButtonText","copiedButtonText","sandboxLoadingText","sandboxStyleLoadingText","sandboxScriptLoadingText","disableSandboxLoadingOverlay","sandboxFullscreenButtonText","sandboxExitFullscreenButtonText","sandboxMode","onClickCustomButtonAfterContent","beforeSend","localeTexts","getContentRenderLocaleTexts","resolvedConfirmButtonText","resolvedCopyButtonText","resolvedCopiedButtonText","resolvedSandboxFullscreenButtonText","resolvedSandboxExitFullscreenButtonText","isTypewriterEnabled","typewriterChunkSize","typewriterTickMs","displayContent","setDisplayContent","useState","pendingContentRef","previousTypewriterEnabledRef","hasReportedTypeFinishedRef","wasTypewriterEnabled","current","shouldRestartTyping","canContinueTyping","nextVisibleContent","typewriterTimer","chunk","rest","typewriterState","useMemo","renderContent","normalizedContent","normalizeInlineHtml","interactionDefaults","getInteractionDefaultValues","resolvedDefaultButtonText","resolvedDefaultInputText","fallbackSelectedValues","resolvedDefaultSelectedValues","children","props","CustomButtonInputVariable","className","chartContent","frozen","mermaidBlockIsComplete","MermaidChart","CodeBlock","hasPotentialSandboxTags","renderSegments","splitContentSegments","hasSandbox","mergedRenderSegments","parseMarkdownSegments","renderMarkdownSegments","raw","keyPrefix","seg","index","key","idx","IframeSandbox","React","jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"ContentRender.es.js","sources":["../../../src/components/ContentRender/ContentRender.tsx"],"sourcesContent":["import \"highlight.js/styles/github.css\";\nimport \"katex/dist/katex.min.css\";\nimport React, { useEffect, useMemo, useRef, useState } from \"react\";\nimport ReactMarkdown from \"react-markdown\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeRaw from \"rehype-raw\";\nimport remarkBreaks from \"remark-breaks\";\nimport remarkFlow from \"remark-flow\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport type { PluggableList } from \"unified\";\nimport { CustomRenderBarProps, OnSendContentParams } from \"../types\";\nimport { sanitizeInvalidTagName } from \"./utils/sanitize-invalid-tag-name\";\nimport { stripSvgTextLineBreaks } from \"./utils/strip-svg-text-line-breaks\";\nimport \"./contentRender.css\";\nimport \"./github-markdown-light.css\";\nimport CodeBlock from \"./CodeBlock\";\nimport CustomButtonInputVariable, {\n ComponentsWithCustomVariable,\n} from \"./plugins/CustomVariable\";\nimport MermaidChart from \"./plugins/MermaidChart\";\nimport {\n preserveCustomVariableProperties,\n restoreCustomVariableProperties,\n} from \"./utils/custom-variable-props\";\nimport {\n highlightLanguages,\n subsetLanguages,\n} from \"./utils/highlight-languages\";\n// import { processMarkdownText } from \"./utils/process-markdown\";\nimport {\n parseMarkdownSegments,\n mermaidBlockIsComplete,\n} from \"./utils/mermaid-parse\";\nimport { normalizeInlineHtml } from \"./utils/normalize-inline-html\";\nimport IframeSandbox from \"./IframeSandbox\";\nimport {\n splitContentSegments,\n type RenderSegment,\n} from \"./utils/split-content\";\nimport {\n getInteractionDefaultValues,\n type InteractionDefaultValueOptions,\n} from \"../../lib/interaction-defaults\";\nimport type { MarkdownFlowLocale } from \"../../lib/locale\";\nimport { getContentRenderLocaleTexts } from \"./contentRenderI18n\";\n\nconst SANDBOX_TAG_HINT_PATTERN =\n /<(script|style|link|iframe|html|head|body|meta|title|base|template|div|section|article|main)\\b/i;\n\n// Define component Props type\nexport interface ContentRenderProps {\n content: string;\n contentType?: string;\n /** Locale used for built-in UI text when a more specific text prop is not provided. */\n locale?: MarkdownFlowLocale;\n /**\n * Callback invoked when the custom button after content is clicked.\n * This button is rendered via the `<custom-button-after-content>` tag in markdown content.\n * @example\n * ```tsx\n * <ContentRender\n * content=\"Hello <custom-button-after-content>Ask</custom-button-after-content>\"\n * onClickCustomButtonAfterContent={() => console.log('Button clicked')}\n * />\n * ```\n */\n customRenderBar?: CustomRenderBarProps;\n onClickCustomButtonAfterContent?: () => void;\n onSend?: (content: OnSendContentParams) => void;\n typingSpeed?: number;\n enableTypewriter?: boolean;\n onTypeFinished?: () => void;\n onTypewriterStateChange?: (state: ContentRenderTypewriterState) => void;\n userInput?: string;\n interactionDefaultValueOptions?: InteractionDefaultValueOptions;\n defaultButtonText?: string;\n defaultInputText?: string; // Text input by user\n defaultSelectedValues?: string[]; // Default selected values for multi-select\n readonly?: boolean;\n // Multi-select confirm button text (i18n support)\n confirmButtonText?: string;\n // Copy button text (i18n support)\n copyButtonText?: string;\n // Copied state text (i18n support)\n copiedButtonText?: string;\n // Dynamic interaction format for multi-select support\n dynamicInteractionFormat?: string;\n // Loading text before first HTML block renders inside iframe (i18n support)\n sandboxLoadingText?: string;\n // Loading text while styles are being generated inside iframe\n sandboxStyleLoadingText?: string;\n // Loading text while scripts are being cached/executed inside iframe\n sandboxScriptLoadingText?: string;\n // Disable sandbox loading overlays when upper layers have already entered an error state\n disableSandboxLoadingOverlay?: boolean;\n // Fullscreen button text for iframe sandbox\n sandboxFullscreenButtonText?: string;\n // Exit fullscreen button text for iframe sandbox\n sandboxExitFullscreenButtonText?: string;\n // Sandbox render mode\n sandboxMode?: \"content\" | \"blackboard\";\n beforeSend?: (param: OnSendContentParams) => boolean;\n // tooltipMinLength?: number; // Control minimum character length for tooltip display, default 10\n}\n\nexport interface ContentRenderTypewriterState {\n isTypewriterEnabled: boolean;\n isTyping: boolean;\n isComplete: boolean;\n renderedLength: number;\n totalLength: number;\n}\n\n// Render svg string via Shadow DOM to avoid markdown wrapping\nconst SvgBlockInShadow: React.FC<{ svg: string }> = ({ svg }) => {\n const hostRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const host = hostRef.current;\n if (!host) return;\n const shadowRoot = host.shadowRoot ?? host.attachShadow({ mode: \"open\" });\n const styleId = \"content-render-svg-style\";\n let styleEl = shadowRoot.getElementById(styleId) as HTMLStyleElement | null;\n\n if (!styleEl) {\n styleEl = document.createElement(\"style\");\n styleEl.id = styleId;\n // Keep intrinsic SVG width so the wrapper can scroll horizontally when needed\n styleEl.textContent = `\n svg { height: auto; display: inline-block; }\n svg.content-render-svg-el--responsive { width: 100%; max-width: 100%; }\n svg.content-render-svg-el--fixed { max-width: none; }\n `;\n shadowRoot.appendChild(styleEl);\n }\n\n const nodesToRemove = Array.from(shadowRoot.childNodes).filter(\n (node) => node !== styleEl\n );\n nodesToRemove.forEach((node) => shadowRoot.removeChild(node));\n\n const template = document.createElement(\"template\");\n const cleanedSvg = stripSvgTextLineBreaks(svg);\n template.innerHTML = cleanedSvg;\n shadowRoot.append(template.content.cloneNode(true));\n\n let hasResponsiveSvg = false;\n let hasFixedSvg = false;\n\n shadowRoot.querySelectorAll(\"svg\").forEach((svgEl) => {\n // Derive responsive sizing from viewBox so pure viewBox SVGs stay visible and fluid\n const viewBox = svgEl.getAttribute(\"viewBox\");\n if (!viewBox) return;\n\n const dimensions = viewBox\n .trim()\n .split(/[\\s,]+/)\n .map((value) => Number(value));\n\n if (dimensions.length !== 4 || dimensions.some(Number.isNaN)) return;\n\n const [, , viewBoxWidth, viewBoxHeight] = dimensions;\n const widthAttr = svgEl.getAttribute(\"width\");\n const heightAttr = svgEl.getAttribute(\"height\");\n const isRelativeLength = (value?: string | null) => {\n if (!value) return false;\n const normalized = value.trim().toLowerCase();\n return normalized === \"auto\" || normalized.endsWith(\"%\");\n };\n const toNumericLength = (value?: string | null) => {\n if (!value) return null;\n const normalized = value.trim().toLowerCase();\n if (normalized === \"auto\" || normalized.endsWith(\"%\")) {\n return null;\n }\n const parsed = Number.parseFloat(normalized);\n return Number.isNaN(parsed) ? null : parsed;\n };\n // Treat percentage/auto sizing as responsive so viewBox drives the layout\n const isWidthRelative = isRelativeLength(widthAttr);\n const isHeightRelative = isRelativeLength(heightAttr);\n const widthMissing = !widthAttr || widthAttr === \"0\";\n const heightMissing = !heightAttr || heightAttr === \"0\";\n const numericWidth = toNumericLength(widthAttr);\n const numericHeight = toNumericLength(heightAttr);\n const matchesViewBox =\n numericWidth === viewBoxWidth && numericHeight === viewBoxHeight;\n\n // Prefer responsive layout when sizing is relative or matches the viewBox\n const shouldUseResponsiveSize =\n isWidthRelative ||\n isHeightRelative ||\n (widthMissing && heightMissing) ||\n matchesViewBox;\n\n if (shouldUseResponsiveSize) {\n hasResponsiveSvg = true;\n svgEl.classList.add(\"content-render-svg-el--responsive\");\n svgEl.classList.remove(\"content-render-svg-el--fixed\");\n svgEl.style.width = \"100%\";\n svgEl.style.height = \"auto\";\n if (!svgEl.style.aspectRatio && viewBoxHeight > 0) {\n svgEl.style.aspectRatio = `${viewBoxWidth} / ${viewBoxHeight}`;\n }\n return;\n }\n\n hasFixedSvg = true;\n svgEl.classList.add(\"content-render-svg-el--fixed\");\n svgEl.classList.remove(\"content-render-svg-el--responsive\");\n if (widthMissing && viewBoxWidth > 0) {\n svgEl.setAttribute(\"width\", `${viewBoxWidth}`);\n }\n if (heightMissing && viewBoxHeight > 0) {\n svgEl.setAttribute(\"height\", `${viewBoxHeight}`);\n }\n });\n\n const hostResponsive = hasResponsiveSvg && !hasFixedSvg;\n host.classList.toggle(\"content-render-svg--responsive\", hostResponsive);\n host.classList.toggle(\"content-render-svg--fixed\", !hostResponsive);\n }, [svg]);\n\n return (\n <div className=\"content-render-svg-scroll\">\n <div className=\"content-render-svg\" ref={hostRef} />\n </div>\n );\n};\n\n// Extended component interface\ntype CustomComponents = ComponentsWithCustomVariable & {\n \"custom-button-after-content\"?: React.ComponentType<{\n children: React.ReactNode;\n }>;\n};\n\nconst remarkPlugins: PluggableList = [\n remarkGfm,\n remarkMath,\n remarkFlow,\n remarkBreaks,\n];\n\nconst rehypePlugins: PluggableList = [\n preserveCustomVariableProperties,\n rehypeRaw,\n sanitizeInvalidTagName,\n restoreCustomVariableProperties,\n [rehypeHighlight, { languages: highlightLanguages, subset: subsetLanguages }],\n rehypeKatex,\n];\n\nexport const MarkdownRenderer: React.FC<{\n content: string;\n components: CustomComponents;\n}> = ({ content: markdownContent, components }) => (\n <div className=\"markdown-renderer\">\n <ReactMarkdown\n remarkPlugins={remarkPlugins}\n rehypePlugins={rehypePlugins}\n components={components}\n >\n {markdownContent}\n </ReactMarkdown>\n </div>\n);\n\nconst mergeNonSandboxSegments = (segments: RenderSegment[]) => {\n if (segments.length <= 1) return segments;\n const merged: RenderSegment[] = [];\n\n segments.forEach((segment) => {\n if (segment.type === \"sandbox\") {\n merged.push(segment);\n return;\n }\n\n const last = merged[merged.length - 1];\n if (last && last.type !== \"sandbox\") {\n merged[merged.length - 1] = {\n type: \"markdown\",\n value: `${last.value}${segment.value}`,\n };\n return;\n }\n\n merged.push({ type: \"markdown\", value: segment.value });\n });\n\n return merged;\n};\n\nconst splitTextByCharacterChunk = (value: string, chunkSize: number) => {\n const safeChunkSize = Math.max(1, chunkSize);\n const characters = Array.from(value);\n\n return {\n chunk: characters.slice(0, safeChunkSize).join(\"\"),\n rest: characters.slice(safeChunkSize).join(\"\"),\n };\n};\n\nconst ContentRender: React.FC<ContentRenderProps> = ({\n content,\n contentType,\n locale,\n customRenderBar,\n onSend,\n typingSpeed = 40,\n enableTypewriter = false,\n onTypeFinished,\n onTypewriterStateChange,\n userInput,\n interactionDefaultValueOptions,\n defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n readonly = false,\n confirmButtonText,\n copyButtonText,\n copiedButtonText,\n sandboxLoadingText,\n sandboxStyleLoadingText,\n sandboxScriptLoadingText,\n disableSandboxLoadingOverlay = false,\n sandboxFullscreenButtonText,\n sandboxExitFullscreenButtonText,\n sandboxMode = \"content\",\n onClickCustomButtonAfterContent,\n beforeSend,\n // tooltipMinLength,\n}) => {\n const localeTexts = getContentRenderLocaleTexts(locale);\n const resolvedConfirmButtonText =\n confirmButtonText || localeTexts.confirmButtonText;\n const resolvedCopyButtonText = copyButtonText || localeTexts.copyButtonText;\n const resolvedCopiedButtonText =\n copiedButtonText || localeTexts.copiedButtonText;\n const resolvedSandboxFullscreenButtonText =\n sandboxFullscreenButtonText || localeTexts.sandboxFullscreenButtonText;\n const resolvedSandboxExitFullscreenButtonText =\n sandboxExitFullscreenButtonText ||\n localeTexts.sandboxExitFullscreenButtonText;\n const shouldApplyTypewriterByContentType =\n !contentType || contentType === \"text\";\n const isTypewriterEnabled =\n Boolean(enableTypewriter) && shouldApplyTypewriterByContentType;\n const typewriterChunkSize = 2;\n const typewriterTickMs = Math.max(0, typingSpeed);\n const [displayContent, setDisplayContent] = useState(() =>\n isTypewriterEnabled ? \"\" : content\n );\n const pendingContentRef = useRef(\"\");\n const previousTypewriterEnabledRef = useRef(isTypewriterEnabled);\n const hasReportedTypeFinishedRef = useRef(false);\n\n useEffect(() => {\n const wasTypewriterEnabled = previousTypewriterEnabledRef.current;\n previousTypewriterEnabledRef.current = isTypewriterEnabled;\n hasReportedTypeFinishedRef.current = false;\n\n if (!isTypewriterEnabled) {\n pendingContentRef.current = \"\";\n setDisplayContent(content);\n return;\n }\n\n setDisplayContent((current) => {\n const shouldRestartTyping = !wasTypewriterEnabled;\n const canContinueTyping = content.startsWith(current);\n\n if (!shouldRestartTyping && !canContinueTyping) {\n pendingContentRef.current = \"\";\n return content;\n }\n\n const nextVisibleContent =\n shouldRestartTyping || !canContinueTyping ? \"\" : current;\n\n pendingContentRef.current = content.slice(nextVisibleContent.length);\n return nextVisibleContent;\n });\n }, [content, isTypewriterEnabled]);\n\n useEffect(() => {\n if (!isTypewriterEnabled) {\n return;\n }\n\n if (\n hasReportedTypeFinishedRef.current ||\n pendingContentRef.current ||\n displayContent !== content\n ) {\n return;\n }\n\n hasReportedTypeFinishedRef.current = true;\n onTypeFinished?.();\n }, [content, displayContent, isTypewriterEnabled, onTypeFinished]);\n\n useEffect(() => {\n if (!isTypewriterEnabled || !pendingContentRef.current) {\n return undefined;\n }\n\n const typewriterTimer = window.setTimeout(() => {\n setDisplayContent((current) => {\n const { chunk, rest } = splitTextByCharacterChunk(\n pendingContentRef.current,\n typewriterChunkSize\n );\n\n if (!chunk) {\n return current;\n }\n\n pendingContentRef.current = rest;\n return `${current}${chunk}`;\n });\n }, typewriterTickMs);\n\n return () => window.clearTimeout(typewriterTimer);\n }, [\n content,\n displayContent,\n isTypewriterEnabled,\n typewriterChunkSize,\n typewriterTickMs,\n ]);\n\n const typewriterState = useMemo<ContentRenderTypewriterState>(\n () => ({\n isTypewriterEnabled,\n isTyping: isTypewriterEnabled && displayContent !== content,\n isComplete: displayContent === content,\n renderedLength: displayContent.length,\n totalLength: content.length,\n }),\n [content, displayContent, isTypewriterEnabled]\n );\n\n useEffect(() => {\n onTypewriterStateChange?.(typewriterState);\n }, [onTypewriterStateChange, typewriterState]);\n\n const renderContent = isTypewriterEnabled ? displayContent : content;\n const normalizedContent = useMemo(\n () => normalizeInlineHtml(renderContent),\n [renderContent]\n );\n\n const interactionDefaults = useMemo(\n () =>\n getInteractionDefaultValues(\n renderContent,\n userInput,\n interactionDefaultValueOptions\n ),\n [interactionDefaultValueOptions, renderContent, userInput]\n );\n\n const resolvedDefaultButtonText =\n defaultButtonText?.trim() || interactionDefaults.buttonText;\n const resolvedDefaultInputText =\n defaultInputText?.trim() || interactionDefaults.inputText;\n const fallbackSelectedValues = useMemo(\n () =>\n userInput\n ? userInput\n .split(\",\")\n .map((value) => value.trim())\n .filter(Boolean)\n : undefined,\n [userInput]\n );\n const resolvedDefaultSelectedValues = defaultSelectedValues?.length\n ? defaultSelectedValues\n : interactionDefaults.selectedValues || fallbackSelectedValues;\n\n const components = useMemo<CustomComponents>(\n () => ({\n \"custom-button-after-content\": ({\n children,\n }: {\n children: React.ReactNode;\n }) => {\n return (\n <button\n className=\"content-render-custom-button-after-content\"\n onClick={onClickCustomButtonAfterContent}\n >\n <span className=\"content-render-custom-button-after-content-inner\">\n {children}\n </span>\n </button>\n );\n },\n \"custom-variable\": (props) => (\n <CustomButtonInputVariable\n {...props}\n readonly={readonly}\n defaultButtonText={resolvedDefaultButtonText}\n defaultInputText={resolvedDefaultInputText}\n defaultSelectedValues={resolvedDefaultSelectedValues}\n onSend={onSend}\n beforeSend={beforeSend}\n locale={locale}\n confirmButtonText={resolvedConfirmButtonText}\n // tooltipMinLength={tooltipMinLength}\n />\n ),\n code: (props) => {\n const { className, children, ...rest } = props as {\n className?: string;\n children?: React.ReactNode;\n };\n const match = /language-(\\w+)/.exec(className || \"\");\n const language = match?.[1];\n if (language === \"mermaid\") {\n const chartContent = children?.toString().replace(/\\n$/, \"\") || \"\";\n const frozen = mermaidBlockIsComplete(renderContent, chartContent);\n return <MermaidChart chart={chartContent} frozen={frozen} />;\n }\n\n return (\n <code className={className} {...rest}>\n {children}\n </code>\n );\n },\n table: ({ ...props }) => (\n <div className=\"content-render-table-container\">\n <table className=\"content-render-table\" {...props} />\n </div>\n ),\n th: ({ ...props }) => <th className=\"content-render-th\" {...props} />,\n td: ({ ...props }) => <td className=\"content-render-td\" {...props} />,\n tr: ({ ...props }) => <tr className=\"content-render-tr\" {...props} />,\n li: ({ node, ...props }) => {\n const className = node?.properties?.className;\n const hasTaskListItem =\n (typeof className === \"string\" &&\n className.includes(\"task-list-item\")) ||\n (Array.isArray(className) && className.includes(\"task-list-item\"));\n if (hasTaskListItem) {\n return <li className=\"content-render-task-list-item\" {...props} />;\n }\n return <li {...props} />;\n },\n ol: ({ ...props }) => <ol className=\"content-render-ol\" {...props} />,\n ul: ({ ...props }) => <ul className=\"content-render-ul\" {...props} />,\n input: ({ ...props }) => {\n if (props.type === \"checkbox\") {\n return (\n <input\n type=\"checkbox\"\n className=\"content-render-checkbox\"\n disabled\n {...props}\n />\n );\n }\n return <input {...props} />;\n },\n a: ({ children, ...props }) => (\n <a target=\"_blank\" rel=\"noopener noreferrer\" {...props}>\n {children}\n </a>\n ),\n pre: (props) => (\n <CodeBlock\n {...props}\n copyButtonText={resolvedCopyButtonText}\n copiedButtonText={resolvedCopiedButtonText}\n />\n ),\n }),\n [\n beforeSend,\n locale,\n onClickCustomButtonAfterContent,\n onSend,\n readonly,\n renderContent,\n resolvedConfirmButtonText,\n resolvedCopiedButtonText,\n resolvedCopyButtonText,\n resolvedDefaultButtonText,\n resolvedDefaultInputText,\n resolvedDefaultSelectedValues,\n ]\n );\n\n const hasPotentialSandboxTags = useMemo(\n () => SANDBOX_TAG_HINT_PATTERN.test(renderContent),\n [renderContent]\n );\n\n const renderSegments = useMemo(\n () =>\n hasPotentialSandboxTags ? splitContentSegments(renderContent, true) : [],\n [renderContent, hasPotentialSandboxTags]\n );\n\n const hasSandbox = renderSegments.some(\n (segment) => segment.type === \"sandbox\"\n );\n const mergedRenderSegments = useMemo(\n () => mergeNonSandboxSegments(renderSegments),\n [renderSegments]\n );\n\n const segments = useMemo(\n () => parseMarkdownSegments(normalizedContent),\n [normalizedContent]\n );\n\n const renderMarkdownSegments = (raw: string, keyPrefix: string) => {\n const normalized = normalizeInlineHtml(raw);\n const parsed = parseMarkdownSegments(normalized);\n\n return parsed.map((seg, index) => {\n const key = `${keyPrefix}-${seg.type}-${index}`;\n\n if (seg.type === \"text\") {\n return (\n <MarkdownRenderer\n key={key}\n components={components}\n content={seg.value}\n />\n );\n }\n\n if (seg.type === \"mermaid\") {\n return (\n <MermaidChart key={key} chart={seg.value} frozen={!seg.complete} />\n );\n }\n\n if (seg.type === \"svg\") {\n return <SvgBlockInShadow key={key} svg={seg.value} />;\n }\n\n return null;\n });\n };\n\n if (hasSandbox) {\n return (\n <div className=\"content-render markdown-body\">\n {mergedRenderSegments.map((segment, idx) =>\n segment.type === \"sandbox\" ? (\n <IframeSandbox\n key={`sandbox-${idx}`}\n hideFullScreen\n type=\"sandbox\"\n content={segment.value}\n className=\"content-render-iframe\"\n locale={locale}\n loadingText={sandboxLoadingText}\n styleLoadingText={sandboxStyleLoadingText}\n scriptLoadingText={sandboxScriptLoadingText}\n disableLoadingOverlay={disableSandboxLoadingOverlay}\n fullScreenButtonText={resolvedSandboxFullscreenButtonText}\n exitFullScreenButtonText={resolvedSandboxExitFullscreenButtonText}\n mode={sandboxMode}\n />\n ) : (\n <React.Fragment key={`md-${idx}`}>\n {renderMarkdownSegments(segment.value, `md-${idx}`)}\n </React.Fragment>\n )\n )}\n </div>\n );\n }\n\n return (\n <div className=\"content-render markdown-body\">\n {segments.map((seg, index) => {\n if (seg.type === \"text\") {\n return (\n <MarkdownRenderer\n key={index}\n components={components}\n content={seg.value}\n />\n );\n }\n\n if (seg.type === \"mermaid\") {\n return (\n <MermaidChart\n key={index}\n chart={seg.value}\n frozen={!seg.complete}\n />\n );\n }\n\n if (seg.type === \"svg\") {\n return <SvgBlockInShadow key={index} svg={seg.value} />;\n }\n })}\n\n {customRenderBar && (\n <div className=\"content-render-custom-bar\">\n {React.createElement(customRenderBar, {\n content,\n displayContent: normalizedContent,\n onSend,\n })}\n </div>\n )}\n </div>\n );\n};\n\nexport default ContentRender;\n"],"names":["SANDBOX_TAG_HINT_PATTERN","SvgBlockInShadow","svg","hostRef","useRef","useEffect","host","shadowRoot","styleId","styleEl","node","template","cleanedSvg","stripSvgTextLineBreaks","hasResponsiveSvg","hasFixedSvg","svgEl","viewBox","dimensions","value","viewBoxWidth","viewBoxHeight","widthAttr","heightAttr","isRelativeLength","normalized","toNumericLength","parsed","isWidthRelative","isHeightRelative","widthMissing","heightMissing","numericWidth","numericHeight","hostResponsive","jsx","remarkPlugins","remarkGfm","remarkMath","remarkFlow","remarkBreaks","rehypePlugins","preserveCustomVariableProperties","rehypeRaw","sanitizeInvalidTagName","restoreCustomVariableProperties","rehypeHighlight","highlightLanguages","subsetLanguages","rehypeKatex","MarkdownRenderer","markdownContent","components","ReactMarkdown","mergeNonSandboxSegments","segments","merged","segment","last","splitTextByCharacterChunk","chunkSize","safeChunkSize","characters","ContentRender","content","contentType","locale","customRenderBar","onSend","typingSpeed","enableTypewriter","onTypeFinished","onTypewriterStateChange","userInput","interactionDefaultValueOptions","defaultButtonText","defaultInputText","defaultSelectedValues","readonly","confirmButtonText","copyButtonText","copiedButtonText","sandboxLoadingText","sandboxStyleLoadingText","sandboxScriptLoadingText","disableSandboxLoadingOverlay","sandboxFullscreenButtonText","sandboxExitFullscreenButtonText","sandboxMode","onClickCustomButtonAfterContent","beforeSend","localeTexts","getContentRenderLocaleTexts","resolvedConfirmButtonText","resolvedCopyButtonText","resolvedCopiedButtonText","resolvedSandboxFullscreenButtonText","resolvedSandboxExitFullscreenButtonText","isTypewriterEnabled","typewriterChunkSize","typewriterTickMs","displayContent","setDisplayContent","useState","pendingContentRef","previousTypewriterEnabledRef","hasReportedTypeFinishedRef","wasTypewriterEnabled","current","shouldRestartTyping","canContinueTyping","nextVisibleContent","typewriterTimer","chunk","rest","typewriterState","useMemo","renderContent","normalizedContent","normalizeInlineHtml","interactionDefaults","getInteractionDefaultValues","resolvedDefaultButtonText","resolvedDefaultInputText","fallbackSelectedValues","resolvedDefaultSelectedValues","children","props","CustomButtonInputVariable","className","chartContent","frozen","mermaidBlockIsComplete","MermaidChart","CodeBlock","hasPotentialSandboxTags","renderSegments","splitContentSegments","hasSandbox","mergedRenderSegments","parseMarkdownSegments","renderMarkdownSegments","raw","keyPrefix","seg","index","key","idx","IframeSandbox","React","jsxs"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../../_virtual/jsx-runtime.cjs.js"),j=require("react"),F=require("../../ui/button.cjs.js"),L=require("../../ui/checkbox.cjs.js"),M=require("../MarkdownFlowInput.cjs.js"),I=require("../../ui/inputGroup/input-group.cjs.js"),V=require("../../../lib/utils.cjs.js"),_=require("../contentRenderI18n.cjs.js"),z=({node:e,readonly:n,selectedValues:i,inputValue:r,confirmButtonText:a,handleCheckboxChange:c,handleInputChange:f,handleKeyDown:d,handleConfirmClick:u})=>{const x=e.properties?.placeholder,m=n||i.length===0&&!r?.trim(),l=h=>s.jsxRuntimeExports.jsx("span",{className:V.cn("multi-select-confirm-wrapper flex flex-col items-center",m?"opacity-50 cursor-not-allowed":"cursor-pointer",h),children:s.jsxRuntimeExports.jsx("button",{type:"button",className:"multi-select-confirm-button text-sm font-medium text-primary",disabled:m,onClick:u,children:a})});return s.jsxRuntimeExports.jsxs("span",{className:"multi-select-container flex w-full flex-col",children:[s.jsxRuntimeExports.jsx("span",{className:"flex flex-wrap gap-y-[9px] gap-x-6",children:e.properties?.buttonTexts?.map((h,b)=>{const g=e.properties?.buttonValues?.[b],p=g!==void 0?g:h;return s.jsxRuntimeExports.jsx(L.Checkbox,{label:h,disabled:n,checked:i.includes(p),onCheckedChange:E=>c(p,E),className:"text-sm"},b)})}),x?s.jsxRuntimeExports.jsx("span",{className:"block mb-1 w-full max-w-[500px]",children:s.jsxRuntimeExports.jsxs("span",{className:"multi-select-input-row flex w-full items-end gap-3",children:[s.jsxRuntimeExports.jsx(I.InputGroup,{"data-disabled":n,className:"flex-1",children:s.jsxRuntimeExports.jsx(I.InputGroupTextarea,{disabled:n,placeholder:x,value:r,onChange:f,onKeyDown:d,className:"text-sm px-3",title:x})}),l("shrink-0")]})}):l("self-start multi-select-confirm-wrapper--stacked")]})},P=({node:e,readonly:n,locale:i,resolvedDefaultButtonText:r,handleButtonClick:a,inputValue:c,handleInputChange:f,handleSendClick:d})=>s.jsxRuntimeExports.jsxs("span",{className:"single-select-container inline-flex w-full flex-col",children:[s.jsxRuntimeExports.jsx("span",{className:"flex flex-wrap gap-y-[9px] gap-x-2",children:e.properties?.buttonTexts?.map((u,x)=>{const m=e.properties?.buttonValues?.[x],l=m!==void 0?m:u;return s.jsxRuntimeExports.jsx(F.Button,{disabled:n,variant:"outline",type:"button",size:"sm",onClick:()=>a(l),className:V.cn("max-w-full shrink whitespace-normal break-words text-left leading-5 h-auto min-h-8 px-3 py-1.5","hover:bg-gray-200",r===u&&"select"),children:u},x)})}),e.properties?.placeholder&&s.jsxRuntimeExports.jsx("span",{className:"mt-[9px] mb-1",children:s.jsxRuntimeExports.jsx(M.default,{disabled:n,locale:i,placeholder:e.properties.placeholder,value:c,onChange:f,onSend:d,title:e.properties.placeholder})})]}),U=({readonly:e,locale:n,placeholder:i,value:r,onChange:a,onSend:c})=>i?s.jsxRuntimeExports.jsx(M.default,{disabled:e,locale:n,placeholder:i,value:r,onChange:a,onSend:c,title:i}):null,A=({node:e,readonly:n,locale:i,defaultButtonText:r,defaultInputText:a,defaultSelectedValues:c,onSend:f,confirmButtonText:d,beforeSend:u=()=>!0})=>{const x=_.getContentRenderLocaleTexts(i),m=d||x.confirmButtonText,[l,h]=j.useState(a||""),[b,g]=j.useState(c||[]),p=e.properties?.isMultiSelect??!1,E=e.properties?.buttonTexts||[],w=!p&&E.length===0&&!e.properties?.placeholder,R=e.properties?.variableName?.trim()||r||m,N=j.useMemo(()=>w?{...e,properties:{...e.properties||{},buttonTexts:[R],buttonValues:[R]}}:e,[R,e,w]),v=N.properties?.buttonTexts||[],S=N.properties?.buttonValues||[],T=!p&&v.length>0,y=t=>{const o={variableName:e.properties?.variableName||"",buttonText:t};u?.(o)&&f?.(o)},D=(t,o)=>{g(B=>o?[...B,t]:B.filter(O=>O!==t))},q=()=>{const t=b.length===0&&!l?.trim(),o={variableName:e.properties?.variableName||"",selectedValues:b,inputText:l?.trim()||void 0};n||t||u?.(o)&&f?.(o)},C=t=>{h(t.target.value)},G=t=>{t.nativeEvent.isComposing||t.keyCode===229||t.key==="Enter"&&!t.shiftKey&&(t.preventDefault(),p?b.length===0&&!l.trim()||q():k())},k=()=>{const t={variableName:e.properties?.variableName||"",inputText:l};u?.(t)&&f?.(t)},K=j.useMemo(()=>{if(!r)return;const t=S.indexOf(r);if(t>-1)return v[t]??r;const o=v.indexOf(r);if(o>-1)return v[o]},[r,v,S]);return j.useEffect(()=>{h(a||"")},[a,e]),j.useEffect(()=>{g(c||[])},[c,e]),s.jsxRuntimeExports.jsxs("span",{className:"custom-variable-container inline-flex items-center flex-wrap",children:[p&&s.jsxRuntimeExports.jsx(z,{node:e,readonly:n,selectedValues:b,inputValue:l,confirmButtonText:m,handleCheckboxChange:D,handleInputChange:C,handleKeyDown:G,handleConfirmClick:q}),!p&&T&&s.jsxRuntimeExports.jsx(P,{node:N,readonly:n,locale:i,resolvedDefaultButtonText:K,handleButtonClick:y,inputValue:l,handleInputChange:C,handleSendClick:k}),!p&&!T&&e.properties?.placeholder&&s.jsxRuntimeExports.jsx(U,{readonly:n,locale:i,placeholder:e.properties.placeholder,value:l,onChange:C,onSend:k})]})};exports.default=A;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../../_virtual/jsx-runtime.cjs.js"),j=require("react"),L=require("../../ui/button.cjs.js"),_=require("../../ui/checkbox.cjs.js"),q=require("../MarkdownFlowInput.cjs.js"),y=require("../../ui/inputGroup/input-group.cjs.js"),B=require("../../../lib/utils.cjs.js"),z=require("../contentRenderI18n.cjs.js"),J=({node:e,readonly:r,selectedValues:i,inputValue:n,confirmButtonText:a,handleCheckboxChange:c,handleInputChange:b,handleKeyDown:d,handleConfirmClick:u})=>{const p=e.properties?.placeholder,x=r||i.length===0&&!n?.trim(),l=f=>s.jsxRuntimeExports.jsx("span",{className:B.cn("multi-select-confirm-wrapper flex flex-col items-center",x?"opacity-50 cursor-not-allowed":"cursor-pointer",f),children:s.jsxRuntimeExports.jsx("button",{type:"button",className:"multi-select-confirm-button text-sm font-medium text-primary",disabled:x,onClick:u,children:a})});return s.jsxRuntimeExports.jsxs("span",{className:"multi-select-container flex w-full flex-col",children:[s.jsxRuntimeExports.jsx("span",{className:"flex flex-wrap gap-y-[9px] gap-x-6",children:e.properties?.buttonTexts?.map((f,h)=>{const g=e.properties?.buttonValues?.[h],v=g!==void 0?g:f;return s.jsxRuntimeExports.jsx(_.Checkbox,{label:f,disabled:r,checked:i.includes(v),onCheckedChange:m=>c(v,m),className:"text-sm"},h)})}),p?s.jsxRuntimeExports.jsx("span",{className:"block mb-1 w-full max-w-[500px]",children:s.jsxRuntimeExports.jsxs("span",{className:"multi-select-input-row flex w-full items-end gap-3",children:[s.jsxRuntimeExports.jsx(y.InputGroup,{"data-disabled":r,className:"flex-1",children:s.jsxRuntimeExports.jsx(y.InputGroupTextarea,{disabled:r,placeholder:p,value:n,onChange:b,onKeyDown:d,className:"text-sm px-3",title:p})}),l("shrink-0")]})}):l("self-start multi-select-confirm-wrapper--stacked")]})},P=({node:e,readonly:r,locale:i,resolvedDefaultButtonText:n,handleButtonClick:a,inputValue:c,handleInputChange:b,handleSendClick:d})=>s.jsxRuntimeExports.jsxs("span",{className:"single-select-container inline-flex w-full flex-col",children:[s.jsxRuntimeExports.jsx("span",{className:"flex flex-wrap gap-y-[9px] gap-x-2",children:e.properties?.buttonTexts?.map((u,p)=>{const x=e.properties?.buttonValues?.[p],l=x!==void 0?x:u;return s.jsxRuntimeExports.jsx(L.Button,{disabled:r,variant:"outline",type:"button",size:"sm",onClick:()=>a(l),className:B.cn("max-w-full shrink whitespace-normal break-words text-left leading-5 h-auto min-h-8 px-3 py-1.5","hover:bg-gray-200",n===u&&"select"),children:u},p)})}),e.properties?.placeholder&&s.jsxRuntimeExports.jsx("span",{className:"mt-[9px] mb-1",children:s.jsxRuntimeExports.jsx(q.default,{disabled:r,locale:i,placeholder:e.properties.placeholder,value:c,onChange:b,onSend:d,title:e.properties.placeholder})})]}),U=({readonly:e,locale:r,placeholder:i,value:n,onChange:a,onSend:c})=>i?s.jsxRuntimeExports.jsx(q.default,{disabled:e,locale:r,placeholder:i,value:n,onChange:a,onSend:c,title:i}):null,A=({node:e,readonly:r,locale:i,defaultButtonText:n,defaultInputText:a,defaultSelectedValues:c,onSend:b,confirmButtonText:d,beforeSend:u=()=>!0})=>{const p=z.getContentRenderLocaleTexts(i),x=d||p.confirmButtonText,[l,f]=j.useState(a||""),[h,g]=j.useState(c||[]),v=JSON.stringify({buttonTexts:e.properties?.buttonTexts,buttonValues:e.properties?.buttonValues,isMultiSelect:e.properties?.isMultiSelect,placeholder:e.properties?.placeholder,variableName:e.properties?.variableName}),m=e.properties?.isMultiSelect??!1,I=e.properties?.buttonTexts||[],k=!m&&I.length===0&&!e.properties?.placeholder,E=e.properties?.variableName?.trim()||n||x,R=j.useMemo(()=>k?{...e,properties:{...e.properties||{},buttonTexts:[E],buttonValues:[E]}}:e,[E,e,k]),N=R.properties?.buttonTexts||[],w=R.properties?.buttonValues||[],T=!m&&N.length>0,D=t=>{const o={variableName:e.properties?.variableName||"",buttonText:t};u?.(o)&&b?.(o)},K=(t,o)=>{g(V=>o?[...V,t]:V.filter(F=>F!==t))},M=()=>{const t=h.length===0&&!l?.trim(),o={variableName:e.properties?.variableName||"",selectedValues:h,inputText:l?.trim()||void 0};r||t||u?.(o)&&b?.(o)},C=t=>{f(t.target.value)},O=t=>{t.nativeEvent.isComposing||t.keyCode===229||t.key==="Enter"&&!t.shiftKey&&(t.preventDefault(),m?h.length===0&&!l.trim()||M():S())},S=()=>{const t={variableName:e.properties?.variableName||"",inputText:l};u?.(t)&&b?.(t)},G=j.useMemo(()=>{if(!n)return;const t=w.indexOf(n);if(t>-1)return N[t]??n;const o=N.indexOf(n);if(o>-1)return N[o]},[n,N,w]);return j.useEffect(()=>{f(a||"")},[a,v]),j.useEffect(()=>{g(c||[])},[c,v]),s.jsxRuntimeExports.jsxs("span",{className:"custom-variable-container inline-flex items-center flex-wrap",children:[m&&s.jsxRuntimeExports.jsx(J,{node:e,readonly:r,selectedValues:h,inputValue:l,confirmButtonText:x,handleCheckboxChange:K,handleInputChange:C,handleKeyDown:O,handleConfirmClick:M}),!m&&T&&s.jsxRuntimeExports.jsx(P,{node:R,readonly:r,locale:i,resolvedDefaultButtonText:G,handleButtonClick:D,inputValue:l,handleInputChange:C,handleSendClick:S}),!m&&!T&&e.properties?.placeholder&&s.jsxRuntimeExports.jsx(U,{readonly:r,locale:i,placeholder:e.properties.placeholder,value:l,onChange:C,onSend:S})]})};exports.default=A;
2
2
  //# sourceMappingURL=CustomVariable.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CustomVariable.cjs.js","sources":["../../../../src/components/ContentRender/plugins/CustomVariable.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Components } from \"react-markdown\";\nimport { OnSendContentParams } from \"../../types\";\nimport { Button } from \"../../ui/button\";\nimport { Checkbox } from \"../../ui/checkbox\";\nimport MarkdownFlowInput from \"../MarkdownFlowInput\";\nimport {\n InputGroup,\n InputGroupTextarea,\n} from \"../../ui/inputGroup/input-group\";\nimport type { MarkdownFlowLocale } from \"../../../lib/locale\";\nimport { cn } from \"../../../lib/utils\";\nimport { getContentRenderLocaleTexts } from \"../contentRenderI18n\";\n\n// Define custom variable node type\ninterface CustomVariableNode {\n tagName: \"custom-variable\";\n properties?: {\n variableName?: string;\n buttonTexts?: string[];\n buttonValues?: string[];\n placeholder?: string;\n isMultiSelect?: boolean;\n };\n}\n\n// Define custom variable component Props type\ninterface CustomVariableProps {\n node: CustomVariableNode;\n defaultButtonText?: string;\n defaultInputText?: string;\n defaultSelectedValues?: string[];\n locale?: MarkdownFlowLocale;\n readonly?: boolean;\n onSend?: (content: OnSendContentParams) => void;\n // Multi-select confirm button text (i18n support)\n confirmButtonText?: string;\n beforeSend?: (param: OnSendContentParams) => boolean;\n}\n\ninterface ComponentsWithCustomVariable extends Components {\n \"custom-variable\"?: React.ComponentType<CustomVariableProps>;\n}\n\n// Multi select section( with checkboxes and input)\ninterface MultiSelectSectionProps {\n node: CustomVariableNode;\n readonly?: boolean;\n selectedValues: string[];\n inputValue: string;\n confirmButtonText: string;\n handleCheckboxChange: (value: string, checked: boolean) => void;\n handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n handleKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n handleConfirmClick: () => void;\n}\n\nconst MultiSelectSection = ({\n node,\n readonly,\n selectedValues,\n inputValue,\n confirmButtonText,\n handleCheckboxChange,\n handleInputChange,\n handleKeyDown,\n handleConfirmClick,\n}: MultiSelectSectionProps) => {\n const placeholder = node.properties?.placeholder;\n const confirmDisabled =\n readonly || (selectedValues.length === 0 && !inputValue?.trim());\n\n const renderConfirmButton = (extraWrapperClassName?: string) => (\n <span\n className={cn(\n \"multi-select-confirm-wrapper flex flex-col items-center\",\n confirmDisabled ? \"opacity-50 cursor-not-allowed\" : \"cursor-pointer\",\n extraWrapperClassName\n )}\n >\n <button\n type=\"button\"\n className=\"multi-select-confirm-button text-sm font-medium text-primary\"\n disabled={confirmDisabled}\n onClick={handleConfirmClick}\n >\n {confirmButtonText}\n </button>\n </span>\n );\n\n return (\n <span className=\"multi-select-container flex w-full flex-col\">\n <span className=\"flex flex-wrap gap-y-[9px] gap-x-6\">\n {node.properties?.buttonTexts?.map((text, index) => {\n const value = node.properties?.buttonValues?.[index];\n const buttonValue = value !== undefined ? value : text;\n return (\n <Checkbox\n key={index}\n label={text}\n disabled={readonly}\n checked={selectedValues.includes(buttonValue)}\n onCheckedChange={(checked) =>\n handleCheckboxChange(buttonValue, checked)\n }\n className=\"text-sm\"\n />\n );\n })}\n </span>\n {placeholder ? (\n <span className=\"block mb-1 w-full max-w-[500px]\">\n <span className=\"multi-select-input-row flex w-full items-end gap-3\">\n <InputGroup data-disabled={readonly} className=\"flex-1\">\n <InputGroupTextarea\n disabled={readonly}\n placeholder={placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n className=\"text-sm px-3\"\n title={placeholder}\n />\n </InputGroup>\n {renderConfirmButton(\"shrink-0\")}\n </span>\n </span>\n ) : (\n renderConfirmButton(\"self-start multi-select-confirm-wrapper--stacked\")\n )}\n </span>\n );\n};\n\n// Single select section( with buttons and input)\ninterface SingleSelectSectionProps {\n node: CustomVariableNode;\n readonly?: boolean;\n locale?: MarkdownFlowLocale;\n resolvedDefaultButtonText?: string;\n handleButtonClick: (value: string) => void;\n inputValue: string;\n handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n handleSendClick: () => void;\n}\n\nconst SingleSelectSection = ({\n node,\n readonly,\n locale,\n resolvedDefaultButtonText,\n handleButtonClick,\n inputValue,\n handleInputChange,\n handleSendClick,\n}: SingleSelectSectionProps) => (\n <span className=\"single-select-container inline-flex w-full flex-col\">\n <span className=\"flex flex-wrap gap-y-[9px] gap-x-2\">\n {node.properties?.buttonTexts?.map((text, index) => {\n const value = node.properties?.buttonValues?.[index];\n const buttonValue = value !== undefined ? value : text;\n return (\n <Button\n key={index}\n disabled={readonly}\n variant=\"outline\"\n type=\"button\"\n size=\"sm\"\n onClick={() => handleButtonClick(buttonValue)}\n className={cn(\n \"max-w-full shrink whitespace-normal break-words text-left leading-5 h-auto min-h-8 px-3 py-1.5\",\n \"hover:bg-gray-200\",\n resolvedDefaultButtonText === text && \"select\"\n )}\n >\n {text}\n </Button>\n );\n })}\n </span>\n {node.properties?.placeholder && (\n <span className=\"mt-[9px] mb-1\">\n <MarkdownFlowInput\n disabled={readonly}\n locale={locale}\n placeholder={node.properties.placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onSend={handleSendClick}\n title={node.properties.placeholder}\n />\n </span>\n )}\n </span>\n);\n\n// Pure input\ninterface InputSectionProps {\n readonly?: boolean;\n locale?: MarkdownFlowLocale;\n placeholder?: string;\n value: string;\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n onSend: () => void;\n}\n\nconst InputSection = ({\n readonly,\n locale,\n placeholder,\n value,\n onChange,\n onSend,\n}: InputSectionProps) => {\n if (!placeholder) {\n return null;\n }\n\n return (\n <MarkdownFlowInput\n disabled={readonly}\n locale={locale}\n placeholder={placeholder}\n value={value}\n onChange={onChange}\n onSend={onSend}\n title={placeholder}\n />\n );\n};\n\n// Define custom variable component\nconst CustomButtonInputVariable = ({\n node,\n readonly,\n locale,\n defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n onSend,\n confirmButtonText,\n beforeSend = () => true,\n}: CustomVariableProps) => {\n const localeTexts = getContentRenderLocaleTexts(locale);\n const resolvedConfirmButtonText =\n confirmButtonText || localeTexts.confirmButtonText;\n const [inputValue, setInputValue] = React.useState(defaultInputText || \"\");\n const [selectedValues, setSelectedValues] = React.useState<string[]>(\n defaultSelectedValues || []\n );\n const isMultiSelect = node.properties?.isMultiSelect ?? false;\n const baseButtonTexts = node.properties?.buttonTexts || [];\n const shouldUseFallbackButton =\n !isMultiSelect &&\n baseButtonTexts.length === 0 &&\n !node.properties?.placeholder;\n const fallbackButtonLabel =\n node.properties?.variableName?.trim() ||\n defaultButtonText ||\n resolvedConfirmButtonText;\n\n const singleSelectNode = React.useMemo<CustomVariableNode>(() => {\n if (!shouldUseFallbackButton) {\n return node;\n }\n return {\n ...node,\n properties: {\n ...(node.properties || {}),\n buttonTexts: [fallbackButtonLabel],\n buttonValues: [fallbackButtonLabel],\n },\n };\n }, [fallbackButtonLabel, node, shouldUseFallbackButton]);\n\n const singleSelectButtonTexts =\n singleSelectNode.properties?.buttonTexts || [];\n const singleSelectButtonValues =\n singleSelectNode.properties?.buttonValues || [];\n const isSingleSelect = !isMultiSelect && singleSelectButtonTexts.length > 0;\n\n const handleButtonClick = (value: string) => {\n const param = {\n variableName: node.properties?.variableName || \"\",\n buttonText: value,\n };\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const handleCheckboxChange = (value: string, checked: boolean) => {\n setSelectedValues((prev) => {\n if (checked) {\n return [...prev, value];\n } else {\n return prev.filter((v) => v !== value);\n }\n });\n };\n\n const handleConfirmClick = () => {\n const noSelection = selectedValues.length === 0 && !inputValue?.trim();\n const param = {\n variableName: node.properties?.variableName || \"\",\n selectedValues,\n inputText: inputValue?.trim() || undefined,\n };\n if (readonly || noSelection) return;\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setInputValue(e.target.value);\n };\n const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.nativeEvent.isComposing || e.keyCode === 229) {\n return;\n }\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n if (isMultiSelect) {\n const noSelection = selectedValues.length === 0 && !inputValue.trim();\n if (!noSelection) handleConfirmClick();\n } else {\n handleSendClick();\n }\n }\n };\n const handleSendClick = () => {\n const param = {\n variableName: node.properties?.variableName || \"\",\n inputText: inputValue,\n };\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const resolvedDefaultButtonText = React.useMemo(() => {\n if (!defaultButtonText) {\n return undefined;\n }\n const valueIndex = singleSelectButtonValues.indexOf(defaultButtonText);\n if (valueIndex > -1) {\n return singleSelectButtonTexts[valueIndex] ?? defaultButtonText;\n }\n const textIndex = singleSelectButtonTexts.indexOf(defaultButtonText);\n if (textIndex > -1) {\n return singleSelectButtonTexts[textIndex];\n }\n return undefined;\n }, [defaultButtonText, singleSelectButtonTexts, singleSelectButtonValues]);\n\n React.useEffect(() => {\n setInputValue(defaultInputText || \"\");\n }, [defaultInputText, node]);\n\n React.useEffect(() => {\n setSelectedValues(defaultSelectedValues || []);\n }, [defaultSelectedValues, node]);\n\n return (\n <span className=\"custom-variable-container inline-flex items-center flex-wrap\">\n {isMultiSelect && (\n <MultiSelectSection\n node={node}\n readonly={readonly}\n selectedValues={selectedValues}\n inputValue={inputValue}\n confirmButtonText={resolvedConfirmButtonText}\n handleCheckboxChange={handleCheckboxChange}\n handleInputChange={handleInputChange}\n handleKeyDown={handleKeyDown}\n handleConfirmClick={handleConfirmClick}\n />\n )}\n\n {!isMultiSelect && isSingleSelect && (\n <SingleSelectSection\n node={singleSelectNode}\n readonly={readonly}\n locale={locale}\n resolvedDefaultButtonText={resolvedDefaultButtonText}\n handleButtonClick={handleButtonClick}\n inputValue={inputValue}\n handleInputChange={handleInputChange}\n handleSendClick={handleSendClick}\n />\n )}\n\n {!isMultiSelect && !isSingleSelect && node.properties?.placeholder && (\n <InputSection\n readonly={readonly}\n locale={locale}\n placeholder={node.properties.placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onSend={handleSendClick}\n />\n )}\n </span>\n );\n};\n\nexport default CustomButtonInputVariable;\nexport type {\n ComponentsWithCustomVariable,\n CustomVariableNode,\n CustomVariableProps,\n};\n"],"names":["MultiSelectSection","node","readonly","selectedValues","inputValue","confirmButtonText","handleCheckboxChange","handleInputChange","handleKeyDown","handleConfirmClick","placeholder","confirmDisabled","renderConfirmButton","extraWrapperClassName","jsx","cn","jsxs","text","index","value","buttonValue","Checkbox","checked","InputGroup","InputGroupTextarea","SingleSelectSection","locale","resolvedDefaultButtonText","handleButtonClick","handleSendClick","Button","MarkdownFlowInput","InputSection","onChange","onSend","CustomButtonInputVariable","defaultButtonText","defaultInputText","defaultSelectedValues","beforeSend","localeTexts","getContentRenderLocaleTexts","resolvedConfirmButtonText","setInputValue","React","setSelectedValues","isMultiSelect","baseButtonTexts","shouldUseFallbackButton","fallbackButtonLabel","singleSelectNode","singleSelectButtonTexts","singleSelectButtonValues","isSingleSelect","param","prev","v","noSelection","e","valueIndex","textIndex"],"mappings":"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"}
1
+ {"version":3,"file":"CustomVariable.cjs.js","sources":["../../../../src/components/ContentRender/plugins/CustomVariable.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Components } from \"react-markdown\";\nimport { OnSendContentParams } from \"../../types\";\nimport { Button } from \"../../ui/button\";\nimport { Checkbox } from \"../../ui/checkbox\";\nimport MarkdownFlowInput from \"../MarkdownFlowInput\";\nimport {\n InputGroup,\n InputGroupTextarea,\n} from \"../../ui/inputGroup/input-group\";\nimport type { MarkdownFlowLocale } from \"../../../lib/locale\";\nimport { cn } from \"../../../lib/utils\";\nimport { getContentRenderLocaleTexts } from \"../contentRenderI18n\";\n\n// Define custom variable node type\ninterface CustomVariableNode {\n tagName: \"custom-variable\";\n properties?: {\n variableName?: string;\n buttonTexts?: string[];\n buttonValues?: string[];\n placeholder?: string;\n isMultiSelect?: boolean;\n };\n}\n\n// Define custom variable component Props type\ninterface CustomVariableProps {\n node: CustomVariableNode;\n defaultButtonText?: string;\n defaultInputText?: string;\n defaultSelectedValues?: string[];\n locale?: MarkdownFlowLocale;\n readonly?: boolean;\n onSend?: (content: OnSendContentParams) => void;\n // Multi-select confirm button text (i18n support)\n confirmButtonText?: string;\n beforeSend?: (param: OnSendContentParams) => boolean;\n}\n\ninterface ComponentsWithCustomVariable extends Components {\n \"custom-variable\"?: React.ComponentType<CustomVariableProps>;\n}\n\n// Multi select section( with checkboxes and input)\ninterface MultiSelectSectionProps {\n node: CustomVariableNode;\n readonly?: boolean;\n selectedValues: string[];\n inputValue: string;\n confirmButtonText: string;\n handleCheckboxChange: (value: string, checked: boolean) => void;\n handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n handleKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n handleConfirmClick: () => void;\n}\n\nconst MultiSelectSection = ({\n node,\n readonly,\n selectedValues,\n inputValue,\n confirmButtonText,\n handleCheckboxChange,\n handleInputChange,\n handleKeyDown,\n handleConfirmClick,\n}: MultiSelectSectionProps) => {\n const placeholder = node.properties?.placeholder;\n const confirmDisabled =\n readonly || (selectedValues.length === 0 && !inputValue?.trim());\n\n const renderConfirmButton = (extraWrapperClassName?: string) => (\n <span\n className={cn(\n \"multi-select-confirm-wrapper flex flex-col items-center\",\n confirmDisabled ? \"opacity-50 cursor-not-allowed\" : \"cursor-pointer\",\n extraWrapperClassName\n )}\n >\n <button\n type=\"button\"\n className=\"multi-select-confirm-button text-sm font-medium text-primary\"\n disabled={confirmDisabled}\n onClick={handleConfirmClick}\n >\n {confirmButtonText}\n </button>\n </span>\n );\n\n return (\n <span className=\"multi-select-container flex w-full flex-col\">\n <span className=\"flex flex-wrap gap-y-[9px] gap-x-6\">\n {node.properties?.buttonTexts?.map((text, index) => {\n const value = node.properties?.buttonValues?.[index];\n const buttonValue = value !== undefined ? value : text;\n return (\n <Checkbox\n key={index}\n label={text}\n disabled={readonly}\n checked={selectedValues.includes(buttonValue)}\n onCheckedChange={(checked) =>\n handleCheckboxChange(buttonValue, checked)\n }\n className=\"text-sm\"\n />\n );\n })}\n </span>\n {placeholder ? (\n <span className=\"block mb-1 w-full max-w-[500px]\">\n <span className=\"multi-select-input-row flex w-full items-end gap-3\">\n <InputGroup data-disabled={readonly} className=\"flex-1\">\n <InputGroupTextarea\n disabled={readonly}\n placeholder={placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onKeyDown={handleKeyDown}\n className=\"text-sm px-3\"\n title={placeholder}\n />\n </InputGroup>\n {renderConfirmButton(\"shrink-0\")}\n </span>\n </span>\n ) : (\n renderConfirmButton(\"self-start multi-select-confirm-wrapper--stacked\")\n )}\n </span>\n );\n};\n\n// Single select section( with buttons and input)\ninterface SingleSelectSectionProps {\n node: CustomVariableNode;\n readonly?: boolean;\n locale?: MarkdownFlowLocale;\n resolvedDefaultButtonText?: string;\n handleButtonClick: (value: string) => void;\n inputValue: string;\n handleInputChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n handleSendClick: () => void;\n}\n\nconst SingleSelectSection = ({\n node,\n readonly,\n locale,\n resolvedDefaultButtonText,\n handleButtonClick,\n inputValue,\n handleInputChange,\n handleSendClick,\n}: SingleSelectSectionProps) => (\n <span className=\"single-select-container inline-flex w-full flex-col\">\n <span className=\"flex flex-wrap gap-y-[9px] gap-x-2\">\n {node.properties?.buttonTexts?.map((text, index) => {\n const value = node.properties?.buttonValues?.[index];\n const buttonValue = value !== undefined ? value : text;\n return (\n <Button\n key={index}\n disabled={readonly}\n variant=\"outline\"\n type=\"button\"\n size=\"sm\"\n onClick={() => handleButtonClick(buttonValue)}\n className={cn(\n \"max-w-full shrink whitespace-normal break-words text-left leading-5 h-auto min-h-8 px-3 py-1.5\",\n \"hover:bg-gray-200\",\n resolvedDefaultButtonText === text && \"select\"\n )}\n >\n {text}\n </Button>\n );\n })}\n </span>\n {node.properties?.placeholder && (\n <span className=\"mt-[9px] mb-1\">\n <MarkdownFlowInput\n disabled={readonly}\n locale={locale}\n placeholder={node.properties.placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onSend={handleSendClick}\n title={node.properties.placeholder}\n />\n </span>\n )}\n </span>\n);\n\n// Pure input\ninterface InputSectionProps {\n readonly?: boolean;\n locale?: MarkdownFlowLocale;\n placeholder?: string;\n value: string;\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n onSend: () => void;\n}\n\nconst InputSection = ({\n readonly,\n locale,\n placeholder,\n value,\n onChange,\n onSend,\n}: InputSectionProps) => {\n if (!placeholder) {\n return null;\n }\n\n return (\n <MarkdownFlowInput\n disabled={readonly}\n locale={locale}\n placeholder={placeholder}\n value={value}\n onChange={onChange}\n onSend={onSend}\n title={placeholder}\n />\n );\n};\n\n// Define custom variable component\nconst CustomButtonInputVariable = ({\n node,\n readonly,\n locale,\n defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n onSend,\n confirmButtonText,\n beforeSend = () => true,\n}: CustomVariableProps) => {\n const localeTexts = getContentRenderLocaleTexts(locale);\n const resolvedConfirmButtonText =\n confirmButtonText || localeTexts.confirmButtonText;\n const [inputValue, setInputValue] = React.useState(defaultInputText || \"\");\n const [selectedValues, setSelectedValues] = React.useState<string[]>(\n defaultSelectedValues || []\n );\n const interactionDefinitionKey = JSON.stringify({\n buttonTexts: node.properties?.buttonTexts,\n buttonValues: node.properties?.buttonValues,\n isMultiSelect: node.properties?.isMultiSelect,\n placeholder: node.properties?.placeholder,\n variableName: node.properties?.variableName,\n });\n const isMultiSelect = node.properties?.isMultiSelect ?? false;\n const baseButtonTexts = node.properties?.buttonTexts || [];\n const shouldUseFallbackButton =\n !isMultiSelect &&\n baseButtonTexts.length === 0 &&\n !node.properties?.placeholder;\n const fallbackButtonLabel =\n node.properties?.variableName?.trim() ||\n defaultButtonText ||\n resolvedConfirmButtonText;\n\n const singleSelectNode = React.useMemo<CustomVariableNode>(() => {\n if (!shouldUseFallbackButton) {\n return node;\n }\n return {\n ...node,\n properties: {\n ...(node.properties || {}),\n buttonTexts: [fallbackButtonLabel],\n buttonValues: [fallbackButtonLabel],\n },\n };\n }, [fallbackButtonLabel, node, shouldUseFallbackButton]);\n\n const singleSelectButtonTexts =\n singleSelectNode.properties?.buttonTexts || [];\n const singleSelectButtonValues =\n singleSelectNode.properties?.buttonValues || [];\n const isSingleSelect = !isMultiSelect && singleSelectButtonTexts.length > 0;\n\n const handleButtonClick = (value: string) => {\n const param = {\n variableName: node.properties?.variableName || \"\",\n buttonText: value,\n };\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const handleCheckboxChange = (value: string, checked: boolean) => {\n setSelectedValues((prev) => {\n if (checked) {\n return [...prev, value];\n } else {\n return prev.filter((v) => v !== value);\n }\n });\n };\n\n const handleConfirmClick = () => {\n const noSelection = selectedValues.length === 0 && !inputValue?.trim();\n const param = {\n variableName: node.properties?.variableName || \"\",\n selectedValues,\n inputText: inputValue?.trim() || undefined,\n };\n if (readonly || noSelection) return;\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setInputValue(e.target.value);\n };\n const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.nativeEvent.isComposing || e.keyCode === 229) {\n return;\n }\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n if (isMultiSelect) {\n const noSelection = selectedValues.length === 0 && !inputValue.trim();\n if (!noSelection) handleConfirmClick();\n } else {\n handleSendClick();\n }\n }\n };\n const handleSendClick = () => {\n const param = {\n variableName: node.properties?.variableName || \"\",\n inputText: inputValue,\n };\n if (!beforeSend?.(param)) return;\n onSend?.(param);\n };\n\n const resolvedDefaultButtonText = React.useMemo(() => {\n if (!defaultButtonText) {\n return undefined;\n }\n const valueIndex = singleSelectButtonValues.indexOf(defaultButtonText);\n if (valueIndex > -1) {\n return singleSelectButtonTexts[valueIndex] ?? defaultButtonText;\n }\n const textIndex = singleSelectButtonTexts.indexOf(defaultButtonText);\n if (textIndex > -1) {\n return singleSelectButtonTexts[textIndex];\n }\n return undefined;\n }, [defaultButtonText, singleSelectButtonTexts, singleSelectButtonValues]);\n\n React.useEffect(() => {\n setInputValue(defaultInputText || \"\");\n }, [defaultInputText, interactionDefinitionKey]);\n\n React.useEffect(() => {\n setSelectedValues(defaultSelectedValues || []);\n }, [defaultSelectedValues, interactionDefinitionKey]);\n\n return (\n <span className=\"custom-variable-container inline-flex items-center flex-wrap\">\n {isMultiSelect && (\n <MultiSelectSection\n node={node}\n readonly={readonly}\n selectedValues={selectedValues}\n inputValue={inputValue}\n confirmButtonText={resolvedConfirmButtonText}\n handleCheckboxChange={handleCheckboxChange}\n handleInputChange={handleInputChange}\n handleKeyDown={handleKeyDown}\n handleConfirmClick={handleConfirmClick}\n />\n )}\n\n {!isMultiSelect && isSingleSelect && (\n <SingleSelectSection\n node={singleSelectNode}\n readonly={readonly}\n locale={locale}\n resolvedDefaultButtonText={resolvedDefaultButtonText}\n handleButtonClick={handleButtonClick}\n inputValue={inputValue}\n handleInputChange={handleInputChange}\n handleSendClick={handleSendClick}\n />\n )}\n\n {!isMultiSelect && !isSingleSelect && node.properties?.placeholder && (\n <InputSection\n readonly={readonly}\n locale={locale}\n placeholder={node.properties.placeholder}\n value={inputValue}\n onChange={handleInputChange}\n onSend={handleSendClick}\n />\n )}\n </span>\n );\n};\n\nexport default CustomButtonInputVariable;\nexport type {\n ComponentsWithCustomVariable,\n CustomVariableNode,\n CustomVariableProps,\n};\n"],"names":["MultiSelectSection","node","readonly","selectedValues","inputValue","confirmButtonText","handleCheckboxChange","handleInputChange","handleKeyDown","handleConfirmClick","placeholder","confirmDisabled","renderConfirmButton","extraWrapperClassName","jsx","cn","jsxs","text","index","value","buttonValue","Checkbox","checked","InputGroup","InputGroupTextarea","SingleSelectSection","locale","resolvedDefaultButtonText","handleButtonClick","handleSendClick","Button","MarkdownFlowInput","InputSection","onChange","onSend","CustomButtonInputVariable","defaultButtonText","defaultInputText","defaultSelectedValues","beforeSend","localeTexts","getContentRenderLocaleTexts","resolvedConfirmButtonText","setInputValue","React","setSelectedValues","interactionDefinitionKey","isMultiSelect","baseButtonTexts","shouldUseFallbackButton","fallbackButtonLabel","singleSelectNode","singleSelectButtonTexts","singleSelectButtonValues","isSingleSelect","param","prev","v","noSelection","e","valueIndex","textIndex"],"mappings":"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"}
@@ -1,9 +1,9 @@
1
1
  import { j as s } from "../../../_virtual/jsx-runtime.es.js";
2
2
  import d from "react";
3
3
  import { Button as L } from "../../ui/button.es.js";
4
- import { Checkbox as O } from "../../ui/checkbox.es.js";
5
- import M from "../MarkdownFlowInput.es.js";
6
- import { InputGroup as _, InputGroupTextarea as z } from "../../ui/inputGroup/input-group.es.js";
4
+ import { Checkbox as _ } from "../../ui/checkbox.es.js";
5
+ import I from "../MarkdownFlowInput.es.js";
6
+ import { InputGroup as z, InputGroupTextarea as J } from "../../ui/inputGroup/input-group.es.js";
7
7
  import { cn as D } from "../../../lib/utils.es.js";
8
8
  import { getContentRenderLocaleTexts as U } from "../contentRenderI18n.es.js";
9
9
  const q = ({
@@ -17,12 +17,12 @@ const q = ({
17
17
  handleKeyDown: g,
18
18
  handleConfirmClick: p
19
19
  }) => {
20
- const m = e.properties?.placeholder, x = r || l.length === 0 && !n?.trim(), i = (h) => /* @__PURE__ */ s.jsx(
20
+ const u = e.properties?.placeholder, m = r || l.length === 0 && !n?.trim(), i = (h) => /* @__PURE__ */ s.jsx(
21
21
  "span",
22
22
  {
23
23
  className: D(
24
24
  "multi-select-confirm-wrapper flex flex-col items-center",
25
- x ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
25
+ m ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
26
26
  h
27
27
  ),
28
28
  children: /* @__PURE__ */ s.jsx(
@@ -30,7 +30,7 @@ const q = ({
30
30
  {
31
31
  type: "button",
32
32
  className: "multi-select-confirm-button text-sm font-medium text-primary",
33
- disabled: x,
33
+ disabled: m,
34
34
  onClick: p,
35
35
  children: a
36
36
  }
@@ -39,30 +39,30 @@ const q = ({
39
39
  );
40
40
  return /* @__PURE__ */ s.jsxs("span", { className: "multi-select-container flex w-full flex-col", children: [
41
41
  /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-6", children: e.properties?.buttonTexts?.map((h, b) => {
42
- const v = e.properties?.buttonValues?.[b], u = v !== void 0 ? v : h;
42
+ const v = e.properties?.buttonValues?.[b], N = v !== void 0 ? v : h;
43
43
  return /* @__PURE__ */ s.jsx(
44
- O,
44
+ _,
45
45
  {
46
46
  label: h,
47
47
  disabled: r,
48
- checked: l.includes(u),
49
- onCheckedChange: (j) => c(u, j),
48
+ checked: l.includes(N),
49
+ onCheckedChange: (x) => c(N, x),
50
50
  className: "text-sm"
51
51
  },
52
52
  b
53
53
  );
54
54
  }) }),
55
- m ? /* @__PURE__ */ s.jsx("span", { className: "block mb-1 w-full max-w-[500px]", children: /* @__PURE__ */ s.jsxs("span", { className: "multi-select-input-row flex w-full items-end gap-3", children: [
56
- /* @__PURE__ */ s.jsx(_, { "data-disabled": r, className: "flex-1", children: /* @__PURE__ */ s.jsx(
57
- z,
55
+ u ? /* @__PURE__ */ s.jsx("span", { className: "block mb-1 w-full max-w-[500px]", children: /* @__PURE__ */ s.jsxs("span", { className: "multi-select-input-row flex w-full items-end gap-3", children: [
56
+ /* @__PURE__ */ s.jsx(z, { "data-disabled": r, className: "flex-1", children: /* @__PURE__ */ s.jsx(
57
+ J,
58
58
  {
59
59
  disabled: r,
60
- placeholder: m,
60
+ placeholder: u,
61
61
  value: n,
62
62
  onChange: f,
63
63
  onKeyDown: g,
64
64
  className: "text-sm px-3",
65
- title: m
65
+ title: u
66
66
  }
67
67
  ) }),
68
68
  i("shrink-0")
@@ -78,8 +78,8 @@ const q = ({
78
78
  handleInputChange: f,
79
79
  handleSendClick: g
80
80
  }) => /* @__PURE__ */ s.jsxs("span", { className: "single-select-container inline-flex w-full flex-col", children: [
81
- /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-2", children: e.properties?.buttonTexts?.map((p, m) => {
82
- const x = e.properties?.buttonValues?.[m], i = x !== void 0 ? x : p;
81
+ /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-2", children: e.properties?.buttonTexts?.map((p, u) => {
82
+ const m = e.properties?.buttonValues?.[u], i = m !== void 0 ? m : p;
83
83
  return /* @__PURE__ */ s.jsx(
84
84
  L,
85
85
  {
@@ -95,11 +95,11 @@ const q = ({
95
95
  ),
96
96
  children: p
97
97
  },
98
- m
98
+ u
99
99
  );
100
100
  }) }),
101
101
  e.properties?.placeholder && /* @__PURE__ */ s.jsx("span", { className: "mt-[9px] mb-1", children: /* @__PURE__ */ s.jsx(
102
- M,
102
+ I,
103
103
  {
104
104
  disabled: r,
105
105
  locale: l,
@@ -118,7 +118,7 @@ const q = ({
118
118
  onChange: a,
119
119
  onSend: c
120
120
  }) => l ? /* @__PURE__ */ s.jsx(
121
- M,
121
+ I,
122
122
  {
123
123
  disabled: e,
124
124
  locale: r,
@@ -128,7 +128,7 @@ const q = ({
128
128
  onSend: c,
129
129
  title: l
130
130
  }
131
- ) : null, ee = ({
131
+ ) : null, te = ({
132
132
  node: e,
133
133
  readonly: r,
134
134
  locale: l,
@@ -139,24 +139,30 @@ const q = ({
139
139
  confirmButtonText: g,
140
140
  beforeSend: p = () => !0
141
141
  }) => {
142
- const m = U(l), x = g || m.confirmButtonText, [i, h] = d.useState(a || ""), [b, v] = d.useState(
142
+ const u = U(l), m = g || u.confirmButtonText, [i, h] = d.useState(a || ""), [b, v] = d.useState(
143
143
  c || []
144
- ), u = e.properties?.isMultiSelect ?? !1, j = e.properties?.buttonTexts || [], T = !u && j.length === 0 && !e.properties?.placeholder, C = e.properties?.variableName?.trim() || n || x, k = d.useMemo(() => T ? {
144
+ ), N = JSON.stringify({
145
+ buttonTexts: e.properties?.buttonTexts,
146
+ buttonValues: e.properties?.buttonValues,
147
+ isMultiSelect: e.properties?.isMultiSelect,
148
+ placeholder: e.properties?.placeholder,
149
+ variableName: e.properties?.variableName
150
+ }), x = e.properties?.isMultiSelect ?? !1, E = e.properties?.buttonTexts || [], T = !x && E.length === 0 && !e.properties?.placeholder, C = e.properties?.variableName?.trim() || n || m, k = d.useMemo(() => T ? {
145
151
  ...e,
146
152
  properties: {
147
153
  ...e.properties || {},
148
154
  buttonTexts: [C],
149
155
  buttonValues: [C]
150
156
  }
151
- } : e, [C, e, T]), N = k.properties?.buttonTexts || [], B = k.properties?.buttonValues || [], V = !u && N.length > 0, E = (t) => {
157
+ } : e, [C, e, T]), j = k.properties?.buttonTexts || [], V = k.properties?.buttonValues || [], y = !x && j.length > 0, K = (t) => {
152
158
  const o = {
153
159
  variableName: e.properties?.variableName || "",
154
160
  buttonText: t
155
161
  };
156
162
  p?.(o) && f?.(o);
157
- }, K = (t, o) => {
158
- v((y) => o ? [...y, t] : y.filter((G) => G !== t));
159
- }, I = () => {
163
+ }, O = (t, o) => {
164
+ v((M) => o ? [...M, t] : M.filter((G) => G !== t));
165
+ }, B = () => {
160
166
  const t = b.length === 0 && !i?.trim(), o = {
161
167
  variableName: e.properties?.variableName || "",
162
168
  selectedValues: b,
@@ -166,7 +172,7 @@ const q = ({
166
172
  }, w = (t) => {
167
173
  h(t.target.value);
168
174
  }, R = (t) => {
169
- t.nativeEvent.isComposing || t.keyCode === 229 || t.key === "Enter" && !t.shiftKey && (t.preventDefault(), u ? b.length === 0 && !i.trim() || I() : S());
175
+ t.nativeEvent.isComposing || t.keyCode === 229 || t.key === "Enter" && !t.shiftKey && (t.preventDefault(), x ? b.length === 0 && !i.trim() || B() : S());
170
176
  }, S = () => {
171
177
  const t = {
172
178
  variableName: e.properties?.variableName || "",
@@ -176,46 +182,46 @@ const q = ({
176
182
  }, F = d.useMemo(() => {
177
183
  if (!n)
178
184
  return;
179
- const t = B.indexOf(n);
185
+ const t = V.indexOf(n);
180
186
  if (t > -1)
181
- return N[t] ?? n;
182
- const o = N.indexOf(n);
187
+ return j[t] ?? n;
188
+ const o = j.indexOf(n);
183
189
  if (o > -1)
184
- return N[o];
185
- }, [n, N, B]);
190
+ return j[o];
191
+ }, [n, j, V]);
186
192
  return d.useEffect(() => {
187
193
  h(a || "");
188
- }, [a, e]), d.useEffect(() => {
194
+ }, [a, N]), d.useEffect(() => {
189
195
  v(c || []);
190
- }, [c, e]), /* @__PURE__ */ s.jsxs("span", { className: "custom-variable-container inline-flex items-center flex-wrap", children: [
191
- u && /* @__PURE__ */ s.jsx(
196
+ }, [c, N]), /* @__PURE__ */ s.jsxs("span", { className: "custom-variable-container inline-flex items-center flex-wrap", children: [
197
+ x && /* @__PURE__ */ s.jsx(
192
198
  q,
193
199
  {
194
200
  node: e,
195
201
  readonly: r,
196
202
  selectedValues: b,
197
203
  inputValue: i,
198
- confirmButtonText: x,
199
- handleCheckboxChange: K,
204
+ confirmButtonText: m,
205
+ handleCheckboxChange: O,
200
206
  handleInputChange: w,
201
207
  handleKeyDown: R,
202
- handleConfirmClick: I
208
+ handleConfirmClick: B
203
209
  }
204
210
  ),
205
- !u && V && /* @__PURE__ */ s.jsx(
211
+ !x && y && /* @__PURE__ */ s.jsx(
206
212
  A,
207
213
  {
208
214
  node: k,
209
215
  readonly: r,
210
216
  locale: l,
211
217
  resolvedDefaultButtonText: F,
212
- handleButtonClick: E,
218
+ handleButtonClick: K,
213
219
  inputValue: i,
214
220
  handleInputChange: w,
215
221
  handleSendClick: S
216
222
  }
217
223
  ),
218
- !u && !V && e.properties?.placeholder && /* @__PURE__ */ s.jsx(
224
+ !x && !y && e.properties?.placeholder && /* @__PURE__ */ s.jsx(
219
225
  H,
220
226
  {
221
227
  readonly: r,
@@ -229,6 +235,6 @@ const q = ({
229
235
  ] });
230
236
  };
231
237
  export {
232
- ee as default
238
+ te as default
233
239
  };
234
240
  //# sourceMappingURL=CustomVariable.es.js.map