markdown-flow-ui 0.1.115-beta.0 → 0.1.115

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.
@@ -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 } 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 useTypewriterStateMachine from \"./useTypewriterStateMachine\";\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\";\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// Define component Props type\nexport interface ContentRenderProps {\n content: string;\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 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 onTypeFinished?: () => void;\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 // 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\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 ContentRender: React.FC<ContentRenderProps> = ({\n content,\n customRenderBar,\n onSend,\n typingSpeed = 30,\n enableTypewriter = false,\n userInput,\n interactionDefaultValueOptions,\n defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n readonly = false,\n onTypeFinished,\n confirmButtonText,\n copyButtonText,\n copiedButtonText,\n sandboxLoadingText,\n sandboxStyleLoadingText,\n sandboxScriptLoadingText,\n disableSandboxLoadingOverlay = false,\n sandboxFullscreenButtonText,\n sandboxMode = \"content\",\n onClickCustomButtonAfterContent,\n beforeSend,\n // tooltipMinLength,\n}) => {\n const normalizedContent = useMemo(\n () => normalizeInlineHtml(content),\n [content]\n );\n\n const interactionDefaults = useMemo(\n () =>\n getInteractionDefaultValues(\n content,\n userInput,\n interactionDefaultValueOptions\n ),\n [content, interactionDefaultValueOptions, 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 const resolvedDefaultSelectedValuesKey =\n resolvedDefaultSelectedValues?.join(\"\\u0001\") ?? \"\";\n const stableResolvedDefaultSelectedValues = useMemo(\n () => resolvedDefaultSelectedValues,\n // Preserve the same array reference when markdown is reparsed with equal values.\n [resolvedDefaultSelectedValuesKey]\n );\n\n // Keep markdown component identities stable so focused interaction inputs are not remounted by parent re-renders.\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={stableResolvedDefaultSelectedValues}\n onSend={onSend}\n beforeSend={beforeSend}\n confirmButtonText={confirmButtonText}\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(content, 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={copyButtonText}\n copiedButtonText={copiedButtonText}\n />\n ),\n }),\n [\n beforeSend,\n confirmButtonText,\n content,\n copiedButtonText,\n copyButtonText,\n onClickCustomButtonAfterContent,\n onSend,\n readonly,\n resolvedDefaultButtonText,\n resolvedDefaultInputText,\n stableResolvedDefaultSelectedValues,\n ]\n );\n\n const { displayContent, isComplete } = useTypewriterStateMachine({\n // processMarkdownText will let code block printf(\"You win!\\n\") become printf(\"You win!<br/>\");\n // content: processMarkdownText(content),\n content: normalizedContent,\n typingSpeed,\n disabled: !enableTypewriter,\n });\n // Render the full content synchronously when typewriter is disabled\n // to avoid a first-paint flash where content appears after helper actions.\n const resolvedDisplayContent = enableTypewriter\n ? displayContent\n : normalizedContent;\n\n const hasPotentialSandboxTags = useMemo(\n () => SANDBOX_TAG_HINT_PATTERN.test(content),\n [content]\n );\n\n const renderSegments = useMemo(\n () => (hasPotentialSandboxTags ? splitContentSegments(content, true) : []),\n [content, 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(resolvedDisplayContent),\n [resolvedDisplayContent]\n );\n\n const hasCompleted = useRef(false);\n\n useEffect(() => {\n if (hasSandbox) return;\n if (isComplete && !hasCompleted.current) {\n hasCompleted.current = true; // Mark as completed\n onTypeFinished?.(); // Call the passed callback\n }\n }, [hasSandbox, isComplete, onTypeFinished]);\n\n useEffect(() => {\n if (hasSandbox) return;\n hasCompleted.current = false; // Reset completion status when content changes\n }, [hasSandbox, content]);\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 loadingText={sandboxLoadingText}\n styleLoadingText={sandboxStyleLoadingText}\n scriptLoadingText={sandboxScriptLoadingText}\n disableLoadingOverlay={disableSandboxLoadingOverlay}\n fullScreenButtonText={sandboxFullscreenButtonText}\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,\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","ContentRender","content","customRenderBar","onSend","typingSpeed","enableTypewriter","userInput","interactionDefaultValueOptions","defaultButtonText","defaultInputText","defaultSelectedValues","readonly","onTypeFinished","confirmButtonText","copyButtonText","copiedButtonText","sandboxLoadingText","sandboxStyleLoadingText","sandboxScriptLoadingText","disableSandboxLoadingOverlay","sandboxFullscreenButtonText","sandboxMode","onClickCustomButtonAfterContent","beforeSend","normalizedContent","useMemo","normalizeInlineHtml","interactionDefaults","getInteractionDefaultValues","resolvedDefaultButtonText","resolvedDefaultInputText","fallbackSelectedValues","resolvedDefaultSelectedValues","resolvedDefaultSelectedValuesKey","stableResolvedDefaultSelectedValues","children","props","CustomButtonInputVariable","className","rest","chartContent","frozen","mermaidBlockIsComplete","MermaidChart","CodeBlock","displayContent","isComplete","useTypewriterStateMachine","resolvedDisplayContent","hasPotentialSandboxTags","renderSegments","splitContentSegments","hasSandbox","mergedRenderSegments","parseMarkdownSegments","hasCompleted","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 } 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 useTypewriterStateMachine from \"./useTypewriterStateMachine\";\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\";\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// Define component Props type\nexport interface ContentRenderProps {\n content: string;\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 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 onTypeFinished?: () => void;\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 // 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\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 ContentRender: React.FC<ContentRenderProps> = ({\n content,\n customRenderBar,\n onSend,\n typingSpeed = 30,\n enableTypewriter = false,\n userInput,\n interactionDefaultValueOptions,\n defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n readonly = false,\n onTypeFinished,\n confirmButtonText,\n copyButtonText,\n copiedButtonText,\n sandboxLoadingText,\n sandboxStyleLoadingText,\n sandboxScriptLoadingText,\n disableSandboxLoadingOverlay = false,\n sandboxFullscreenButtonText,\n sandboxMode = \"content\",\n onClickCustomButtonAfterContent,\n beforeSend,\n // tooltipMinLength,\n}) => {\n const normalizedContent = useMemo(\n () => normalizeInlineHtml(content),\n [content]\n );\n\n const interactionDefaults = useMemo(\n () =>\n getInteractionDefaultValues(\n content,\n userInput,\n interactionDefaultValueOptions\n ),\n [content, interactionDefaultValueOptions, 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 // Use custom Hook to handle typewriter effect\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 confirmButtonText={confirmButtonText}\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(content, 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={copyButtonText}\n copiedButtonText={copiedButtonText}\n />\n ),\n };\n\n const { displayContent, isComplete } = useTypewriterStateMachine({\n // processMarkdownText will let code block printf(\"You win!\\n\") become printf(\"You win!<br/>\");\n // content: processMarkdownText(content),\n content: normalizedContent,\n typingSpeed,\n disabled: !enableTypewriter,\n });\n // Render the full content synchronously when typewriter is disabled\n // to avoid a first-paint flash where content appears after helper actions.\n const resolvedDisplayContent = enableTypewriter\n ? displayContent\n : normalizedContent;\n\n const hasPotentialSandboxTags = useMemo(\n () => SANDBOX_TAG_HINT_PATTERN.test(content),\n [content]\n );\n\n const renderSegments = useMemo(\n () => (hasPotentialSandboxTags ? splitContentSegments(content, true) : []),\n [content, 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(resolvedDisplayContent),\n [resolvedDisplayContent]\n );\n\n const hasCompleted = useRef(false);\n\n useEffect(() => {\n if (hasSandbox) return;\n if (isComplete && !hasCompleted.current) {\n hasCompleted.current = true; // Mark as completed\n onTypeFinished?.(); // Call the passed callback\n }\n }, [hasSandbox, isComplete, onTypeFinished]);\n\n useEffect(() => {\n if (hasSandbox) return;\n hasCompleted.current = false; // Reset completion status when content changes\n }, [hasSandbox, content]);\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 loadingText={sandboxLoadingText}\n styleLoadingText={sandboxStyleLoadingText}\n scriptLoadingText={sandboxScriptLoadingText}\n disableLoadingOverlay={disableSandboxLoadingOverlay}\n fullScreenButtonText={sandboxFullscreenButtonText}\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,\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","ContentRender","content","customRenderBar","onSend","typingSpeed","enableTypewriter","userInput","interactionDefaultValueOptions","defaultButtonText","defaultInputText","defaultSelectedValues","readonly","onTypeFinished","confirmButtonText","copyButtonText","copiedButtonText","sandboxLoadingText","sandboxStyleLoadingText","sandboxScriptLoadingText","disableSandboxLoadingOverlay","sandboxFullscreenButtonText","sandboxMode","onClickCustomButtonAfterContent","beforeSend","normalizedContent","useMemo","normalizeInlineHtml","interactionDefaults","getInteractionDefaultValues","resolvedDefaultButtonText","resolvedDefaultInputText","fallbackSelectedValues","resolvedDefaultSelectedValues","children","props","CustomButtonInputVariable","className","rest","chartContent","frozen","mermaidBlockIsComplete","MermaidChart","CodeBlock","displayContent","isComplete","useTypewriterStateMachine","resolvedDisplayContent","hasPotentialSandboxTags","renderSegments","splitContentSegments","hasSandbox","mergedRenderSegments","parseMarkdownSegments","hasCompleted","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"),b=require("react"),F=require("../../ui/button.cjs.js"),_=require("../../ui/checkbox.cjs.js"),q=require("../MarkdownFlowInput.cjs.js"),I=require("../../ui/inputGroup/input-group.cjs.js"),B=require("../../../lib/utils.cjs.js"),z=({node:e,readonly:r,selectedValues:n,inputValue:a,confirmButtonText:c,handleCheckboxChange:m,handleInputChange:f,handleKeyDown:u,handleConfirmClick:l})=>{const p=e.properties?.placeholder,x=r||n.length===0&&!a?.trim(),j=i=>s.jsxRuntimeExports.jsx("span",{className:B.cn("multi-select-confirm-wrapper flex flex-col items-center",x?"opacity-50 cursor-not-allowed":"cursor-pointer",i),children:s.jsxRuntimeExports.jsx("button",{type:"button",className:"multi-select-confirm-button text-sm font-medium text-primary",disabled:x,onClick:l,children:c})});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((i,h)=>{const d=e.properties?.buttonValues?.[h],g=d!==void 0?d:i;return s.jsxRuntimeExports.jsx(_.Checkbox,{label:i,disabled:r,checked:n.includes(g),onCheckedChange:N=>m(g,N),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(I.InputGroup,{"data-disabled":r,className:"flex-1",children:s.jsxRuntimeExports.jsx(I.InputGroupTextarea,{disabled:r,placeholder:p,value:a,onChange:f,onKeyDown:u,className:"text-sm px-3",title:p})}),j("shrink-0")]})}):j("self-start multi-select-confirm-wrapper--stacked")]})},L=({node:e,readonly:r,resolvedDefaultButtonText:n,handleButtonClick:a,inputValue:c,handleInputChange:m,handleSendClick:f})=>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,l)=>{const p=e.properties?.buttonValues?.[l],x=p!==void 0?p:u;return s.jsxRuntimeExports.jsx(F.Button,{disabled:r,variant:"outline",type:"button",size:"sm",onClick:()=>a(x),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},l)})}),e.properties?.placeholder&&s.jsxRuntimeExports.jsx("span",{className:"mt-[9px] mb-1",children:s.jsxRuntimeExports.jsx(q.default,{disabled:r,placeholder:e.properties.placeholder,value:c,onChange:m,onSend:f,title:e.properties.placeholder})})]}),P=({readonly:e,placeholder:r,value:n,onChange:a,onSend:c})=>r?s.jsxRuntimeExports.jsx(q.default,{disabled:e,placeholder:r,value:n,onChange:a,onSend:c,title:r}):null,U=({node:e,readonly:r,defaultButtonText:n,defaultInputText:a,defaultSelectedValues:c,onSend:m,confirmButtonText:f="Submit",beforeSend:u=()=>!0})=>{const[l,p]=b.useState(a||""),[x,j]=b.useState(c||[]),i=e.properties?.isMultiSelect??!1,h=e.properties?.buttonTexts||[],d=e.properties?.buttonValues||[],g=b.useMemo(()=>[e.properties?.variableName??"",e.properties?.placeholder??"",i?"multi":"single",h.join(""),d.join("")].join(""),[h,d,i,e.properties?.placeholder,e.properties?.variableName]),N=(c||[]).join(""),w=!i&&h.length===0&&!e.properties?.placeholder,E=e.properties?.variableName?.trim()||n||"Submit",R=b.useMemo(()=>w?{...e,properties:{...e.properties||{},buttonTexts:[E],buttonValues:[E]}}:e,[E,e,w]),v=R.properties?.buttonTexts||[],C=R.properties?.buttonValues||[],V=!i&&v.length>0,T=t=>{const o={variableName:e.properties?.variableName||"",buttonText:t};u?.(o)&&m?.(o)},D=(t,o)=>{j(M=>o?[...M,t]:M.filter(O=>O!==t))},y=()=>{const t=x.length===0&&!l?.trim(),o={variableName:e.properties?.variableName||"",selectedValues:x,inputText:l?.trim()||void 0};r||t||u?.(o)&&m?.(o)},S=t=>{p(t.target.value)},K=t=>{t.nativeEvent.isComposing||t.keyCode===229||t.key==="Enter"&&!t.shiftKey&&(t.preventDefault(),i?x.length===0&&!l.trim()||y():k())},k=()=>{const t={variableName:e.properties?.variableName||"",inputText:l};u?.(t)&&m?.(t)},G=b.useMemo(()=>{if(!n)return;const t=C.indexOf(n);if(t>-1)return v[t]??n;const o=v.indexOf(n);if(o>-1)return v[o]},[n,v,C]);return b.useEffect(()=>{p(a||"")},[a,g]),b.useEffect(()=>{j(c||[])},[N,g]),s.jsxRuntimeExports.jsxs("span",{className:"custom-variable-container inline-flex items-center flex-wrap",children:[i&&s.jsxRuntimeExports.jsx(z,{node:e,readonly:r,selectedValues:x,inputValue:l,confirmButtonText:f,handleCheckboxChange:D,handleInputChange:S,handleKeyDown:K,handleConfirmClick:y}),!i&&V&&s.jsxRuntimeExports.jsx(L,{node:R,readonly:r,resolvedDefaultButtonText:G,handleButtonClick:T,inputValue:l,handleInputChange:S,handleSendClick:k}),!i&&!V&&e.properties?.placeholder&&s.jsxRuntimeExports.jsx(P,{readonly:r,placeholder:e.properties.placeholder,value:l,onChange:S,onSend:k})]})};exports.default=U;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../../_virtual/jsx-runtime.cjs.js"),b=require("react"),G=require("../../ui/button.cjs.js"),K=require("../../ui/checkbox.cjs.js"),V=require("../MarkdownFlowInput.cjs.js"),M=require("../../ui/inputGroup/input-group.cjs.js"),q=require("../../../lib/utils.cjs.js"),O=({node:e,readonly:r,selectedValues:n,inputValue:a,confirmButtonText:c,handleCheckboxChange:m,handleInputChange:f,handleKeyDown:u,handleConfirmClick:i})=>{const p=e.properties?.placeholder,x=r||n.length===0&&!a?.trim(),j=l=>s.jsxRuntimeExports.jsx("span",{className:q.cn("multi-select-confirm-wrapper flex flex-col items-center",x?"opacity-50 cursor-not-allowed":"cursor-pointer",l),children:s.jsxRuntimeExports.jsx("button",{type:"button",className:"multi-select-confirm-button text-sm font-medium text-primary",disabled:x,onClick:i,children:c})});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((l,E)=>{const d=e.properties?.buttonValues?.[E],h=d!==void 0?d:l;return s.jsxRuntimeExports.jsx(K.Checkbox,{label:l,disabled:r,checked:n.includes(h),onCheckedChange:g=>m(h,g),className:"text-sm"},E)})}),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(M.InputGroup,{"data-disabled":r,className:"flex-1",children:s.jsxRuntimeExports.jsx(M.InputGroupTextarea,{disabled:r,placeholder:p,value:a,onChange:f,onKeyDown:u,className:"text-sm px-3",title:p})}),j("shrink-0")]})}):j("self-start multi-select-confirm-wrapper--stacked")]})},F=({node:e,readonly:r,resolvedDefaultButtonText:n,handleButtonClick:a,inputValue:c,handleInputChange:m,handleSendClick:f})=>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,i)=>{const p=e.properties?.buttonValues?.[i],x=p!==void 0?p:u;return s.jsxRuntimeExports.jsx(G.Button,{disabled:r,variant:"outline",type:"button",size:"sm",onClick:()=>a(x),className:q.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},i)})}),e.properties?.placeholder&&s.jsxRuntimeExports.jsx("span",{className:"mt-[9px] mb-1",children:s.jsxRuntimeExports.jsx(V.default,{disabled:r,placeholder:e.properties.placeholder,value:c,onChange:m,onSend:f,title:e.properties.placeholder})})]}),_=({readonly:e,placeholder:r,value:n,onChange:a,onSend:c})=>r?s.jsxRuntimeExports.jsx(V.default,{disabled:e,placeholder:r,value:n,onChange:a,onSend:c,title:r}):null,z=({node:e,readonly:r,defaultButtonText:n,defaultInputText:a,defaultSelectedValues:c,onSend:m,confirmButtonText:f="Submit",beforeSend:u=()=>!0})=>{const[i,p]=b.useState(a||""),[x,j]=b.useState(c||[]),l=e.properties?.isMultiSelect??!1,E=e.properties?.buttonTexts||[],d=!l&&E.length===0&&!e.properties?.placeholder,h=e.properties?.variableName?.trim()||n||"Submit",g=b.useMemo(()=>d?{...e,properties:{...e.properties||{},buttonTexts:[h],buttonValues:[h]}}:e,[h,e,d]),v=g.properties?.buttonTexts||[],k=g.properties?.buttonValues||[],S=!l&&v.length>0,y=t=>{const o={variableName:e.properties?.variableName||"",buttonText:t};u?.(o)&&m?.(o)},I=(t,o)=>{j(C=>o?[...C,t]:C.filter(D=>D!==t))},w=()=>{const t=x.length===0&&!i?.trim(),o={variableName:e.properties?.variableName||"",selectedValues:x,inputText:i?.trim()||void 0};r||t||u?.(o)&&m?.(o)},N=t=>{p(t.target.value)},T=t=>{t.nativeEvent.isComposing||t.keyCode===229||t.key==="Enter"&&!t.shiftKey&&(t.preventDefault(),l?x.length===0&&!i.trim()||w():R())},R=()=>{const t={variableName:e.properties?.variableName||"",inputText:i};u?.(t)&&m?.(t)},B=b.useMemo(()=>{if(!n)return;const t=k.indexOf(n);if(t>-1)return v[t]??n;const o=v.indexOf(n);if(o>-1)return v[o]},[n,v,k]);return b.useEffect(()=>{p(a||"")},[a,e]),b.useEffect(()=>{j(c||[])},[c,e]),s.jsxRuntimeExports.jsxs("span",{className:"custom-variable-container inline-flex items-center flex-wrap",children:[l&&s.jsxRuntimeExports.jsx(O,{node:e,readonly:r,selectedValues:x,inputValue:i,confirmButtonText:f,handleCheckboxChange:I,handleInputChange:N,handleKeyDown:T,handleConfirmClick:w}),!l&&S&&s.jsxRuntimeExports.jsx(F,{node:g,readonly:r,resolvedDefaultButtonText:B,handleButtonClick:y,inputValue:i,handleInputChange:N,handleSendClick:R}),!l&&!S&&e.properties?.placeholder&&s.jsxRuntimeExports.jsx(_,{readonly:r,placeholder:e.properties.placeholder,value:i,onChange:N,onSend:R})]})};exports.default=z;
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 { cn } from \"../../../lib/utils\";\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 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 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 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 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 placeholder?: string;\n value: string;\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n onSend: () => void;\n}\n\nconst InputSection = ({\n readonly,\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 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 defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n onSend,\n confirmButtonText = \"Submit\", // Default to English, can be overridden\n beforeSend = () => true,\n}: CustomVariableProps) => {\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 baseButtonValues = node.properties?.buttonValues || [];\n const interactionIdentity = React.useMemo(\n () =>\n [\n node.properties?.variableName ?? \"\",\n node.properties?.placeholder ?? \"\",\n isMultiSelect ? \"multi\" : \"single\",\n baseButtonTexts.join(\"\\u0001\"),\n baseButtonValues.join(\"\\u0001\"),\n ].join(\"\\u0002\"),\n [\n baseButtonTexts,\n baseButtonValues,\n isMultiSelect,\n node.properties?.placeholder,\n node.properties?.variableName,\n ]\n );\n const defaultSelectedValuesKey = (defaultSelectedValues || []).join(\"\\u0001\");\n const shouldUseFallbackButton =\n !isMultiSelect &&\n baseButtonTexts.length === 0 &&\n !node.properties?.placeholder;\n const fallbackButtonLabel =\n node.properties?.variableName?.trim() || defaultButtonText || \"Submit\";\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, interactionIdentity]);\n\n React.useEffect(() => {\n setSelectedValues(defaultSelectedValues || []);\n }, [defaultSelectedValuesKey, interactionIdentity]);\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={confirmButtonText}\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 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 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","resolvedDefaultButtonText","handleButtonClick","handleSendClick","Button","MarkdownFlowInput","InputSection","onChange","onSend","CustomButtonInputVariable","defaultButtonText","defaultInputText","defaultSelectedValues","beforeSend","setInputValue","React","setSelectedValues","isMultiSelect","baseButtonTexts","baseButtonValues","interactionIdentity","defaultSelectedValuesKey","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 { cn } from \"../../../lib/utils\";\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 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 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 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 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 placeholder?: string;\n value: string;\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n onSend: () => void;\n}\n\nconst InputSection = ({\n readonly,\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 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 defaultButtonText,\n defaultInputText,\n defaultSelectedValues,\n onSend,\n confirmButtonText = \"Submit\", // Default to English, can be overridden\n beforeSend = () => true,\n}: CustomVariableProps) => {\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() || defaultButtonText || \"Submit\";\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={confirmButtonText}\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 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 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","resolvedDefaultButtonText","handleButtonClick","handleSendClick","Button","MarkdownFlowInput","InputSection","onChange","onSend","CustomButtonInputVariable","defaultButtonText","defaultInputText","defaultSelectedValues","beforeSend","setInputValue","React","setSelectedValues","isMultiSelect","baseButtonTexts","shouldUseFallbackButton","fallbackButtonLabel","singleSelectNode","singleSelectButtonTexts","singleSelectButtonValues","isSingleSelect","param","prev","v","noSelection","e","valueIndex","textIndex"],"mappings":"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"}
@@ -1,11 +1,11 @@
1
1
  import { j as s } from "../../../_virtual/jsx-runtime.es.js";
2
- import f from "react";
3
- import { Button as R } from "../../ui/button.es.js";
4
- import { Checkbox as _ } from "../../ui/checkbox.es.js";
5
- import D from "../MarkdownFlowInput.es.js";
6
- import { InputGroup as z, InputGroupTextarea as L } from "../../ui/inputGroup/input-group.es.js";
7
- import { cn as E } from "../../../lib/utils.es.js";
8
- const U = ({
2
+ import h from "react";
3
+ import { Button as F } from "../../ui/button.es.js";
4
+ import { Checkbox as G } from "../../ui/checkbox.es.js";
5
+ import y from "../MarkdownFlowInput.es.js";
6
+ import { InputGroup as O, InputGroupTextarea as R } from "../../ui/inputGroup/input-group.es.js";
7
+ import { cn as M } from "../../../lib/utils.es.js";
8
+ const _ = ({
9
9
  node: e,
10
10
  readonly: r,
11
11
  selectedValues: l,
@@ -14,15 +14,15 @@ const U = ({
14
14
  handleCheckboxChange: x,
15
15
  handleInputChange: b,
16
16
  handleKeyDown: p,
17
- handleConfirmClick: i
17
+ handleConfirmClick: n
18
18
  }) => {
19
- const u = e.properties?.placeholder, m = r || l.length === 0 && !o?.trim(), d = (n) => /* @__PURE__ */ s.jsx(
19
+ const u = e.properties?.placeholder, m = r || l.length === 0 && !o?.trim(), d = (i) => /* @__PURE__ */ s.jsx(
20
20
  "span",
21
21
  {
22
- className: E(
22
+ className: M(
23
23
  "multi-select-confirm-wrapper flex flex-col items-center",
24
24
  m ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
25
- n
25
+ i
26
26
  ),
27
27
  children: /* @__PURE__ */ s.jsx(
28
28
  "button",
@@ -30,30 +30,30 @@ const U = ({
30
30
  type: "button",
31
31
  className: "multi-select-confirm-button text-sm font-medium text-primary",
32
32
  disabled: m,
33
- onClick: i,
33
+ onClick: n,
34
34
  children: c
35
35
  }
36
36
  )
37
37
  }
38
38
  );
39
39
  return /* @__PURE__ */ s.jsxs("span", { className: "multi-select-container flex w-full flex-col", children: [
40
- /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-6", children: e.properties?.buttonTexts?.map((n, h) => {
41
- const g = e.properties?.buttonValues?.[h], v = g !== void 0 ? g : n;
40
+ /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-6", children: e.properties?.buttonTexts?.map((i, j) => {
41
+ const g = e.properties?.buttonValues?.[j], f = g !== void 0 ? g : i;
42
42
  return /* @__PURE__ */ s.jsx(
43
- _,
43
+ G,
44
44
  {
45
- label: n,
45
+ label: i,
46
46
  disabled: r,
47
- checked: l.includes(v),
48
- onCheckedChange: (N) => x(v, N),
47
+ checked: l.includes(f),
48
+ onCheckedChange: (v) => x(f, v),
49
49
  className: "text-sm"
50
50
  },
51
- h
51
+ j
52
52
  );
53
53
  }) }),
54
54
  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: [
55
- /* @__PURE__ */ s.jsx(z, { "data-disabled": r, className: "flex-1", children: /* @__PURE__ */ s.jsx(
56
- L,
55
+ /* @__PURE__ */ s.jsx(O, { "data-disabled": r, className: "flex-1", children: /* @__PURE__ */ s.jsx(
56
+ R,
57
57
  {
58
58
  disabled: r,
59
59
  placeholder: u,
@@ -67,7 +67,7 @@ const U = ({
67
67
  d("shrink-0")
68
68
  ] }) }) : d("self-start multi-select-confirm-wrapper--stacked")
69
69
  ] });
70
- }, q = ({
70
+ }, z = ({
71
71
  node: e,
72
72
  readonly: r,
73
73
  resolvedDefaultButtonText: l,
@@ -76,28 +76,28 @@ const U = ({
76
76
  handleInputChange: x,
77
77
  handleSendClick: b
78
78
  }) => /* @__PURE__ */ s.jsxs("span", { className: "single-select-container inline-flex w-full flex-col", children: [
79
- /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-2", children: e.properties?.buttonTexts?.map((p, i) => {
80
- const u = e.properties?.buttonValues?.[i], m = u !== void 0 ? u : p;
79
+ /* @__PURE__ */ s.jsx("span", { className: "flex flex-wrap gap-y-[9px] gap-x-2", children: e.properties?.buttonTexts?.map((p, n) => {
80
+ const u = e.properties?.buttonValues?.[n], m = u !== void 0 ? u : p;
81
81
  return /* @__PURE__ */ s.jsx(
82
- R,
82
+ F,
83
83
  {
84
84
  disabled: r,
85
85
  variant: "outline",
86
86
  type: "button",
87
87
  size: "sm",
88
88
  onClick: () => o(m),
89
- className: E(
89
+ className: M(
90
90
  "max-w-full shrink whitespace-normal break-words text-left leading-5 h-auto min-h-8 px-3 py-1.5",
91
91
  "hover:bg-gray-200",
92
92
  l === p && "select"
93
93
  ),
94
94
  children: p
95
95
  },
96
- i
96
+ n
97
97
  );
98
98
  }) }),
99
99
  e.properties?.placeholder && /* @__PURE__ */ s.jsx("span", { className: "mt-[9px] mb-1", children: /* @__PURE__ */ s.jsx(
100
- D,
100
+ y,
101
101
  {
102
102
  disabled: r,
103
103
  placeholder: e.properties.placeholder,
@@ -107,14 +107,14 @@ const U = ({
107
107
  title: e.properties.placeholder
108
108
  }
109
109
  ) })
110
- ] }), A = ({
110
+ ] }), L = ({
111
111
  readonly: e,
112
112
  placeholder: r,
113
113
  value: l,
114
114
  onChange: o,
115
115
  onSend: c
116
116
  }) => r ? /* @__PURE__ */ s.jsx(
117
- D,
117
+ y,
118
118
  {
119
119
  disabled: e,
120
120
  placeholder: r,
@@ -123,7 +123,7 @@ const U = ({
123
123
  onSend: c,
124
124
  title: r
125
125
  }
126
- ) : null, Z = ({
126
+ ) : null, W = ({
127
127
  node: e,
128
128
  readonly: r,
129
129
  defaultButtonText: l,
@@ -134,109 +134,94 @@ const U = ({
134
134
  // Default to English, can be overridden
135
135
  beforeSend: p = () => !0
136
136
  }) => {
137
- const [i, u] = f.useState(o || ""), [m, d] = f.useState(
137
+ const [n, u] = h.useState(o || ""), [m, d] = h.useState(
138
138
  c || []
139
- ), n = e.properties?.isMultiSelect ?? !1, h = e.properties?.buttonTexts || [], g = e.properties?.buttonValues || [], v = f.useMemo(
140
- () => [
141
- e.properties?.variableName ?? "",
142
- e.properties?.placeholder ?? "",
143
- n ? "multi" : "single",
144
- h.join(""),
145
- g.join("")
146
- ].join(""),
147
- [
148
- h,
149
- g,
150
- n,
151
- e.properties?.placeholder,
152
- e.properties?.variableName
153
- ]
154
- ), N = (c || []).join(""), V = !n && h.length === 0 && !e.properties?.placeholder, k = e.properties?.variableName?.trim() || l || "Submit", w = f.useMemo(() => V ? {
139
+ ), i = e.properties?.isMultiSelect ?? !1, j = e.properties?.buttonTexts || [], g = !i && j.length === 0 && !e.properties?.placeholder, f = e.properties?.variableName?.trim() || l || "Submit", v = h.useMemo(() => g ? {
155
140
  ...e,
156
141
  properties: {
157
142
  ...e.properties || {},
158
- buttonTexts: [k],
159
- buttonValues: [k]
143
+ buttonTexts: [f],
144
+ buttonValues: [f]
160
145
  }
161
- } : e, [k, e, V]), j = w.properties?.buttonTexts || [], y = w.properties?.buttonValues || [], I = !n && j.length > 0, T = (t) => {
146
+ } : e, [f, e, g]), N = v.properties?.buttonTexts || [], C = v.properties?.buttonValues || [], S = !i && N.length > 0, B = (t) => {
162
147
  const a = {
163
148
  variableName: e.properties?.variableName || "",
164
149
  buttonText: t
165
150
  };
166
151
  p?.(a) && x?.(a);
167
- }, K = (t, a) => {
168
- d((B) => a ? [...B, t] : B.filter((O) => O !== t));
169
- }, M = () => {
170
- const t = m.length === 0 && !i?.trim(), a = {
152
+ }, D = (t, a) => {
153
+ d((I) => a ? [...I, t] : I.filter((K) => K !== t));
154
+ }, V = () => {
155
+ const t = m.length === 0 && !n?.trim(), a = {
171
156
  variableName: e.properties?.variableName || "",
172
157
  selectedValues: m,
173
- inputText: i?.trim() || void 0
158
+ inputText: n?.trim() || void 0
174
159
  };
175
160
  r || t || p?.(a) && x?.(a);
176
- }, C = (t) => {
161
+ }, k = (t) => {
177
162
  u(t.target.value);
178
- }, F = (t) => {
179
- t.nativeEvent.isComposing || t.keyCode === 229 || t.key === "Enter" && !t.shiftKey && (t.preventDefault(), n ? m.length === 0 && !i.trim() || M() : S());
180
- }, S = () => {
163
+ }, E = (t) => {
164
+ t.nativeEvent.isComposing || t.keyCode === 229 || t.key === "Enter" && !t.shiftKey && (t.preventDefault(), i ? m.length === 0 && !n.trim() || V() : w());
165
+ }, w = () => {
181
166
  const t = {
182
167
  variableName: e.properties?.variableName || "",
183
- inputText: i
168
+ inputText: n
184
169
  };
185
170
  p?.(t) && x?.(t);
186
- }, G = f.useMemo(() => {
171
+ }, T = h.useMemo(() => {
187
172
  if (!l)
188
173
  return;
189
- const t = y.indexOf(l);
174
+ const t = C.indexOf(l);
190
175
  if (t > -1)
191
- return j[t] ?? l;
192
- const a = j.indexOf(l);
176
+ return N[t] ?? l;
177
+ const a = N.indexOf(l);
193
178
  if (a > -1)
194
- return j[a];
195
- }, [l, j, y]);
196
- return f.useEffect(() => {
179
+ return N[a];
180
+ }, [l, N, C]);
181
+ return h.useEffect(() => {
197
182
  u(o || "");
198
- }, [o, v]), f.useEffect(() => {
183
+ }, [o, e]), h.useEffect(() => {
199
184
  d(c || []);
200
- }, [N, v]), /* @__PURE__ */ s.jsxs("span", { className: "custom-variable-container inline-flex items-center flex-wrap", children: [
201
- n && /* @__PURE__ */ s.jsx(
202
- U,
185
+ }, [c, e]), /* @__PURE__ */ s.jsxs("span", { className: "custom-variable-container inline-flex items-center flex-wrap", children: [
186
+ i && /* @__PURE__ */ s.jsx(
187
+ _,
203
188
  {
204
189
  node: e,
205
190
  readonly: r,
206
191
  selectedValues: m,
207
- inputValue: i,
192
+ inputValue: n,
208
193
  confirmButtonText: b,
209
- handleCheckboxChange: K,
210
- handleInputChange: C,
211
- handleKeyDown: F,
212
- handleConfirmClick: M
194
+ handleCheckboxChange: D,
195
+ handleInputChange: k,
196
+ handleKeyDown: E,
197
+ handleConfirmClick: V
213
198
  }
214
199
  ),
215
- !n && I && /* @__PURE__ */ s.jsx(
216
- q,
200
+ !i && S && /* @__PURE__ */ s.jsx(
201
+ z,
217
202
  {
218
- node: w,
203
+ node: v,
219
204
  readonly: r,
220
- resolvedDefaultButtonText: G,
221
- handleButtonClick: T,
222
- inputValue: i,
223
- handleInputChange: C,
224
- handleSendClick: S
205
+ resolvedDefaultButtonText: T,
206
+ handleButtonClick: B,
207
+ inputValue: n,
208
+ handleInputChange: k,
209
+ handleSendClick: w
225
210
  }
226
211
  ),
227
- !n && !I && e.properties?.placeholder && /* @__PURE__ */ s.jsx(
228
- A,
212
+ !i && !S && e.properties?.placeholder && /* @__PURE__ */ s.jsx(
213
+ L,
229
214
  {
230
215
  readonly: r,
231
216
  placeholder: e.properties.placeholder,
232
- value: i,
233
- onChange: C,
234
- onSend: S
217
+ value: n,
218
+ onChange: k,
219
+ onSend: w
235
220
  }
236
221
  )
237
222
  ] });
238
223
  };
239
224
  export {
240
- Z as default
225
+ W as default
241
226
  };
242
227
  //# sourceMappingURL=CustomVariable.es.js.map