@uipath/apollo-wind 2.46.0 → 2.47.0

package/dist/components/ui/prompt-editor/prompt-editor.js

@@ -1,10 +1,13 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { LexicalComposer } from "@lexical/react/LexicalComposer";
 import { ContentEditable } from "@lexical/react/LexicalContentEditable";
 import { LexicalErrorBoundary } from "@lexical/react/LexicalErrorBoundary";
 import { HistoryPlugin } from "@lexical/react/LexicalHistoryPlugin";
+import { ListPlugin } from "@lexical/react/LexicalListPlugin";
+import { MarkdownShortcutPlugin } from "@lexical/react/LexicalMarkdownShortcutPlugin";
 import { OnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
 import { PlainTextPlugin } from "@lexical/react/LexicalPlainTextPlugin";
+import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
 import { $getSelection, $isRangeSelection } from "lexical";
 import { forwardRef, useCallback, useEffect, useId, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { FormFieldError } from "../form-field.js";
@@ -22,15 +25,19 @@ import { ToolbarActionsPlugin } from "./plugins/ToolbarActionsPlugin.js";
 import { ValidateTokensPlugin } from "./plugins/ValidateTokensPlugin.js";
 import { ValueSyncPlugin } from "./plugins/ValueSyncPlugin.js";
 import { VariableDropPlugin } from "./plugins/VariableDropPlugin.js";
+import { DEFAULT_PROMPT_EDITOR_STRINGS, PromptEditorConfigProvider } from "./prompt-editor-config.js";
 import { $getEditorTokensInternal, $insertTokenAtCursor, $setEditorTokensInternal, areTokensEqual } from "./utils/index.js";
+import { $getRichEditorTokensInternal, $setRichEditorTokensInternal, PROMPT_EDITOR_RICH_TRANSFORMERS, RICH_EDITOR_EXTRA_NODES } from "./utils/rich-serialization.js";
 const DEFAULT_MIN_ROWS = 4;
 const DEFAULT_MAX_ROWS = 20;
 const LINE_HEIGHT = 20;
 const EMPTY_AUTOCOMPLETE_OPTIONS = [];
 const EMPTY_TOKENS = [];
 const toTokenArray = (v)=>void 0 === v ? void 0 : Array.isArray(v) ? v : EMPTY_TOKENS;
-const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, autoCompleteOptions = EMPTY_AUTOCOMPLETE_OPTIONS, multiline = true, minRows = DEFAULT_MIN_ROWS, maxRows = DEFAULT_MAX_ROWS, placeholder, disabled, ariaLabel, fillHeight, borderless, error, errorId, ariaDescribedBy, mapVarDropToToken, toolbarActionsRef, showToolbar }, ref)=>{
+const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, autoCompleteOptions = EMPTY_AUTOCOMPLETE_OPTIONS, multiline = true, minRows = DEFAULT_MIN_ROWS, maxRows = DEFAULT_MAX_ROWS, placeholder, disabled, ariaLabel, fillHeight, borderless, error, errorId, ariaDescribedBy, mapVarDropToToken, validationOptions, renderAutocompleteMenu, toolbarActionsRef, showToolbar, children, richText, onActiveFormatsChange }, ref)=>{
     const editorRef = useRef(null);
+    const $getTokens = richText ? $getRichEditorTokensInternal : $getEditorTokensInternal;
+    const $setTokens = richText ? $setRichEditorTokensInternal : $setEditorTokensInternal;
     const [isEmpty, setIsEmpty] = useState(()=>{
         const seed = initialValue ?? value;
         return !seed || 0 === seed.length;
@@ -48,7 +55,7 @@ const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, a
     useImperativeHandle(ref, ()=>({
             setTokens: (tokens)=>{
                 if (editorRef.current) editorRef.current.update(()=>{
-                    $setEditorTokensInternal(tokens);
+                    $setTokens(tokens);
                 });
                 else onChangeRef.current?.(tokens);
             },
@@ -69,7 +76,9 @@ const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, a
                     $insertTokenAtCursor(option);
                 });
             }
-        }), []);
+        }), [
+        $setTokens
+    ]);
     const contentEditableStyle = useMemo(()=>{
         const verticalPadding = 8;
         const textColor = borderless ? 'inherit' : 'var(--color-foreground)';
@@ -118,7 +127,7 @@ const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, a
     const handleChange = useCallback(()=>{
         if (!editorRef.current) return;
         editorRef.current.getEditorState().read(()=>{
-            const tokens = $getEditorTokensInternal();
+            const tokens = $getTokens();
             const newIsEmpty = 0 === tokens.length || 1 === tokens.length && 'text' === tokens[0].type && '' === tokens[0].value;
             if (newIsEmpty !== isEmptyRef.current) setIsEmpty(newIsEmpty);
             if (!isSyncingRef.current) pendingTokensRef.current = tokens;
@@ -155,7 +164,7 @@ const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, a
         queueMicrotask(()=>{
             if (!editorRef.current || initializedRef.current) return;
             editorRef.current.update(()=>{
-                $setEditorTokensInternal(valueToSet);
+                $setTokens(valueToSet);
                 setIsEmpty(0 === valueToSet.length);
                 initializedRef.current = true;
             });
@@ -168,7 +177,8 @@ const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, a
         disabled
     ]);
     const options = Array.isArray(autoCompleteOptions) ? autoCompleteOptions : EMPTY_AUTOCOMPLETE_OPTIONS;
-    const wrapperClassName = borderless ? 'flex flex-col w-full relative' : `prompt-editor-shell flex flex-col w-full relative border bg-background future:border-0 future:bg-surface-overlay ${showToolbar ? 'border-t-0 rounded-b-md future:rounded-b-xl' : 'rounded-md future:rounded-xl'} ${error ? 'border-error ring-1 ring-error/20 future:ring-error/40' : ''}`;
+    const shellFocusClasses = showToolbar ? '' : ' focus-within:ring-2 focus-within:ring-ring future:focus-within:ring-offset-2 future:focus-within:ring-offset-background';
+    const wrapperClassName = borderless ? 'flex flex-col w-full relative' : `prompt-editor-shell flex flex-col w-full relative border bg-background future:border-0 future:bg-surface-overlay ${showToolbar ? 'border-t-0 rounded-b-md future:rounded-b-xl' : 'rounded-md future:rounded-xl'} ${error ? 'border-error ring-1 ring-error/20 future:ring-error/40' : ''}${shellFocusClasses}`;
     return /*#__PURE__*/ jsxs("div", {
         className: wrapperClassName,
         "data-invalid": error ? 'true' : void 0,
@@ -185,8 +195,18 @@ const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, a
             /*#__PURE__*/ jsx("style", {
                 children: `
           .prompt-editor-paragraph { padding: 0; margin: 0; }
-          ${borderless ? '' : '.prompt-editor-shell:not([data-invalid="true"]):focus-within { border-color: var(--color-ring); box-shadow: 0 0 0 1px var(--color-ring); } .future .prompt-editor-shell:not([data-invalid="true"]):focus-within { box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-ring) 35%, transparent); }'}
           .prompt-editor-root *::selection { background-color: color-mix(in srgb, var(--color-primary) 30%, transparent); }
+          ${richText ? `
+          /* Rich-mode formatting — metrics mirror MarkdownPreview so editing matches rendering. */
+          .prompt-editor-text-bold { font-weight: 700; }
+          .prompt-editor-text-italic { font-style: italic; }
+          .prompt-editor-text-strikethrough { text-decoration: line-through; }
+          .prompt-editor-list-ul, .prompt-editor-list-ol { margin: 0.25em 0; padding-left: 1.5em; }
+          .prompt-editor-list-ul { list-style-type: disc; }
+          .prompt-editor-list-ol { list-style-type: decimal; }
+          .prompt-editor-list-item { margin: 0.125em 0; }
+          .prompt-editor-list-item-nested { list-style-type: none; }
+          ` : ''}
         `
             }),
             /*#__PURE__*/ jsxs("div", {
@@ -201,7 +221,17 @@ const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, a
                     } : {}
                 },
                 children: [
-                    /*#__PURE__*/ jsx(PlainTextPlugin, {
+                    richText ? /*#__PURE__*/ jsx(RichTextPlugin, {
+                        contentEditable: /*#__PURE__*/ jsx(ContentEditable, {
+                            style: contentEditableStyle,
+                            ariaLabel: ariaLabel,
+                            "aria-invalid": error ? true : void 0,
+                            "aria-describedby": ariaDescribedBy,
+                            "aria-errormessage": error ? errorId : void 0
+                        }),
+                        placeholder: null,
+                        ErrorBoundary: LexicalErrorBoundary
+                    }) : /*#__PURE__*/ jsx(PlainTextPlugin, {
                         contentEditable: /*#__PURE__*/ jsx(ContentEditable, {
                             style: contentEditableStyle,
                             ariaLabel: ariaLabel,
@@ -244,23 +274,35 @@ const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, a
                 value: value,
                 editorRef: editorRef,
                 lastEmittedValueRef: lastEmittedValueRef,
-                isSyncingRef: isSyncingRef
+                isSyncingRef: isSyncingRef,
+                richText: richText
             }),
-            /*#__PURE__*/ jsx(MultilinePlugin, {
+            !richText && /*#__PURE__*/ jsx(MultilinePlugin, {
                 multiline: multiline
             }),
+            richText && /*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    /*#__PURE__*/ jsx(ListPlugin, {}),
+                    /*#__PURE__*/ jsx(MarkdownShortcutPlugin, {
+                        transformers: PROMPT_EDITOR_RICH_TRANSFORMERS
+                    })
+                ]
+            }),
             /*#__PURE__*/ jsx(OnChangePlugin, {
                 ignoreSelectionChange: true,
                 onChange: handleChange
             }),
             /*#__PURE__*/ jsx(ToolbarActionsPlugin, {
-                actionsRef: toolbarActionsRef
+                actionsRef: toolbarActionsRef,
+                richText: richText,
+                onActiveFormatsChange: onActiveFormatsChange
             }),
-            options.length > 0 && /*#__PURE__*/ jsx(AutocompletePlugin, {
-                options: options
+            (options.length > 0 || renderAutocompleteMenu) && /*#__PURE__*/ jsx(AutocompletePlugin, {
+                options: options,
+                renderMenu: renderAutocompleteMenu
             }),
             /*#__PURE__*/ jsx(ValidateTokensPlugin, {
-                options: options
+                options: Array.isArray(validationOptions) ? validationOptions : options
             }),
             options.length > 0 && /*#__PURE__*/ jsx(RenameTokensPlugin, {
                 options: options,
@@ -269,17 +311,27 @@ const EditorInner = /*#__PURE__*/ forwardRef(({ initialValue, value, onChange, a
             mapVarDropToToken && /*#__PURE__*/ jsx(VariableDropPlugin, {
                 mapVarDropToToken: mapVarDropToToken,
                 disabled: disabled
-            })
+            }),
+            children
         ]
     });
 });
 EditorInner.displayName = 'PromptEditorInner';
-const PromptEditor = ({ value: rawValue, initialValue: rawInitialValue, onChange, multiline = true, minRows = DEFAULT_MIN_ROWS, maxRows = DEFAULT_MAX_ROWS, placeholder, disabled, ariaLabel, autoCompleteOptions, showToolbar = false, mode: controlledMode, onModeChange, onFullscreen, editorRef, fillHeight, borderless, error, errorId: providedErrorId, 'aria-describedby': nativeAriaDescribedBy, ariaDescribedBy: legacyAriaDescribedBy, mapVarDropToToken })=>{
+const PromptEditor = ({ value: rawValue, initialValue: rawInitialValue, onChange, multiline = true, minRows = DEFAULT_MIN_ROWS, maxRows = DEFAULT_MAX_ROWS, placeholder, disabled, ariaLabel, autoCompleteOptions, showToolbar = false, mode: controlledMode, onModeChange, onFullscreen, editorRef, fillHeight, borderless, error, errorId: providedErrorId, 'aria-describedby': nativeAriaDescribedBy, ariaDescribedBy: legacyAriaDescribedBy, mapVarDropToToken, validationOptions, renderAutocompleteMenu, renderTokenPill, strings: partialStrings, showModeToggle = true, toolbarTrailing, children, richText: richTextProp, previewToken })=>{
     const value = toTokenArray(rawValue);
     const initialValue = toTokenArray(rawInitialValue);
+    const [richText] = useState(()=>{
+        if (richTextProp && !multiline) {
+            console.warn('PromptEditor: richText requires multiline — falling back to the plain editor.');
+            return false;
+        }
+        return !!richTextProp;
+    });
     const [internalMode, setInternalMode] = useState('edit');
-    const mode = controlledMode ?? internalMode;
+    const modeLocked = richText || showToolbar && !showModeToggle;
+    const mode = modeLocked ? 'edit' : controlledMode ?? internalMode;
     const toolbarActionsRef = useRef(null);
+    const [activeFormats, setActiveFormats] = useState(void 0);
     const [uncontrolledPreviewTokens, setUncontrolledPreviewTokens] = useState(initialValue ?? []);
     const handleModeChange = useCallback((newMode)=>{
         if (onModeChange) onModeChange(newMode);
@@ -290,16 +342,34 @@ const PromptEditor = ({ value: rawValue, initialValue: rawInitialValue, onChange
     const initialConfig = useMemo(()=>({
             namespace: 'PromptEditor',
             theme: {
-                paragraph: 'prompt-editor-paragraph'
+                paragraph: 'prompt-editor-paragraph',
+                ...richText ? {
+                    text: {
+                        bold: 'prompt-editor-text-bold',
+                        italic: 'prompt-editor-text-italic',
+                        strikethrough: 'prompt-editor-text-strikethrough'
+                    },
+                    list: {
+                        ul: 'prompt-editor-list-ul',
+                        ol: 'prompt-editor-list-ol',
+                        listitem: 'prompt-editor-list-item',
+                        nested: {
+                            listitem: 'prompt-editor-list-item-nested'
+                        }
+                    }
+                } : {}
             },
             onError: (error)=>console.error('PromptEditor error:', error),
             nodes: [
                 InputTokenNode,
                 OutputTokenNode,
                 StateTokenNode,
-                ResourceTokenNode
+                ResourceTokenNode,
+                ...richText ? RICH_EDITOR_EXTRA_NODES : []
             ]
-        }), []);
+        }), [
+        richText
+    ]);
     const isControlled = void 0 !== value;
     const previewTokens = isControlled ? value : uncontrolledPreviewTokens;
     const generatedErrorId = useId();
@@ -316,75 +386,115 @@ const PromptEditor = ({ value: rawValue, initialValue: rawInitialValue, onChange
         isControlled,
         onChange
     ]);
-    return /*#__PURE__*/ jsx(TooltipProvider, {
-        children: /*#__PURE__*/ jsxs("div", {
-            style: {
-                display: 'flex',
-                flexDirection: 'column',
-                width: '100%',
-                ...fillHeight ? {
-                    flex: 1,
-                    minHeight: 0
-                } : {}
-            },
-            children: [
-                showToolbar && /*#__PURE__*/ jsx(EditorToolbar, {
-                    mode: mode,
-                    disabled: disabled,
-                    error: Boolean(error),
-                    actionsRef: toolbarActionsRef,
-                    onModeChange: handleModeChange,
-                    onFullscreen: onFullscreen
-                }),
-                'preview' === mode && /*#__PURE__*/ jsx("div", {
-                    "data-invalid": error ? 'true' : void 0,
-                    className: borderless ? void 0 : `border bg-background future:border-0 future:bg-surface-overlay ${showToolbar ? 'border-t-0 rounded-b-md future:rounded-b-xl' : 'rounded-md future:rounded-xl'} ${error ? 'border-error ring-1 ring-error/20 future:ring-error/40' : ''}`,
-                    children: /*#__PURE__*/ jsx(MarkdownPreview, {
-                        tokens: previewTokens,
-                        minRows: minRows
-                    })
-                }),
-                /*#__PURE__*/ jsx("div", {
-                    style: {
-                        display: 'preview' === mode ? 'none' : 'flex',
-                        flexDirection: 'column',
-                        ...fillHeight ? {
-                            flex: 1,
-                            minHeight: 0
-                        } : {}
-                    },
-                    children: /*#__PURE__*/ jsx(LexicalComposer, {
-                        initialConfig: initialConfig,
-                        children: /*#__PURE__*/ jsx(EditorInner, {
-                            ref: editorRef,
-                            autoCompleteOptions: autoCompleteOptions,
-                            disabled: disabled,
-                            ariaLabel: ariaLabel,
-                            error: error,
-                            errorId: error ? errorId : void 0,
-                            ariaDescribedBy: describedBy || void 0,
-                            initialValue: initialValue,
-                            maxRows: maxRows,
-                            minRows: minRows,
-                            multiline: multiline,
-                            placeholder: placeholder,
-                            fillHeight: fillHeight,
-                            borderless: borderless,
-                            mapVarDropToToken: mapVarDropToToken,
-                            showToolbar: showToolbar,
-                            toolbarActionsRef: toolbarActionsRef,
-                            value: value,
-                            onChange: handleEditorChange
-                        })
+    const strings = useMemo(()=>({
+            ...DEFAULT_PROMPT_EDITOR_STRINGS,
+            ...partialStrings
+        }), [
+        partialStrings
+    ]);
+    const editorConfig = useMemo(()=>({
+            renderTokenPill,
+            strings
+        }), [
+        renderTokenPill,
+        strings
+    ]);
+    return /*#__PURE__*/ jsx(PromptEditorConfigProvider, {
+        value: editorConfig,
+        children: /*#__PURE__*/ jsx(TooltipProvider, {
+            children: /*#__PURE__*/ jsxs("div", {
+                style: {
+                    display: 'flex',
+                    flexDirection: 'column',
+                    width: '100%',
+                    ...fillHeight ? {
+                        flex: 1,
+                        minHeight: 0
+                    } : {}
+                },
+                children: [
+                    /*#__PURE__*/ jsxs("div", {
+                        className: showToolbar && !borderless ? 'prompt-editor-frame rounded-md future:rounded-xl focus-within:ring-2 focus-within:ring-ring future:focus-within:ring-offset-2 future:focus-within:ring-offset-background' : void 0,
+                        style: {
+                            display: 'flex',
+                            flexDirection: 'column',
+                            width: '100%',
+                            ...fillHeight ? {
+                                flex: 1,
+                                minHeight: 0
+                            } : {}
+                        },
+                        children: [
+                            showToolbar && /*#__PURE__*/ jsx(EditorToolbar, {
+                                mode: mode,
+                                disabled: disabled,
+                                error: Boolean(error),
+                                actionsRef: toolbarActionsRef,
+                                onModeChange: handleModeChange,
+                                onFullscreen: onFullscreen,
+                                showModeToggle: showModeToggle && !richText,
+                                trailing: toolbarTrailing,
+                                strings: strings,
+                                activeFormats: richText ? activeFormats : void 0
+                            }),
+                            'preview' === mode && /*#__PURE__*/ jsx("div", {
+                                "data-invalid": error ? 'true' : void 0,
+                                className: borderless ? void 0 : `border bg-background future:border-0 future:bg-surface-overlay ${showToolbar ? 'border-t-0 rounded-b-md future:rounded-b-xl' : 'rounded-md future:rounded-xl'} ${error ? 'border-error ring-1 ring-error/20 future:ring-error/40' : ''}`,
+                                children: /*#__PURE__*/ jsx(MarkdownPreview, {
+                                    tokens: previewTokens,
+                                    minRows: minRows,
+                                    previewToken: previewToken
+                                })
+                            }),
+                            /*#__PURE__*/ jsx("div", {
+                                style: {
+                                    display: 'preview' === mode ? 'none' : 'flex',
+                                    flexDirection: 'column',
+                                    ...fillHeight ? {
+                                        flex: 1,
+                                        minHeight: 0
+                                    } : {}
+                                },
+                                children: /*#__PURE__*/ jsx(LexicalComposer, {
+                                    initialConfig: initialConfig,
+                                    children: /*#__PURE__*/ jsx(EditorInner, {
+                                        ref: editorRef,
+                                        autoCompleteOptions: autoCompleteOptions,
+                                        disabled: disabled,
+                                        ariaLabel: ariaLabel,
+                                        error: error,
+                                        errorId: error ? errorId : void 0,
+                                        ariaDescribedBy: describedBy || void 0,
+                                        initialValue: initialValue,
+                                        maxRows: maxRows,
+                                        minRows: minRows,
+                                        multiline: multiline,
+                                        placeholder: placeholder,
+                                        fillHeight: fillHeight,
+                                        borderless: borderless,
+                                        mapVarDropToToken: mapVarDropToToken,
+                                        validationOptions: validationOptions,
+                                        renderAutocompleteMenu: renderAutocompleteMenu,
+                                        showToolbar: showToolbar,
+                                        toolbarActionsRef: toolbarActionsRef,
+                                        value: value,
+                                        onChange: handleEditorChange,
+                                        richText: richText,
+                                        onActiveFormatsChange: richText ? setActiveFormats : void 0,
+                                        children: children
+                                    })
+                                })
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ jsx(FormFieldError, {
+                        id: errorId,
+                        "data-slot": "prompt-editor-error",
+                        className: "mt-1",
+                        children: error
                     })
-                }),
-                /*#__PURE__*/ jsx(FormFieldError, {
-                    id: errorId,
-                    "data-slot": "prompt-editor-error",
-                    className: "mt-1",
-                    children: error
-                })
-            ]
+                ]
+            })
         })
     });
 };

package/dist/components/ui/prompt-editor/types.cjs

@@ -43,16 +43,16 @@ const getPromptEditorTokenColors = ()=>({
             icon: 'var(--color-error-icon)'
         }
     });
-const getPromptEditorTokenTypeLabel = (type)=>{
+const getPromptEditorTokenTypeLabel = (type, labels)=>{
     switch(type){
         case 'input':
-            return 'Input variable';
+            return labels?.tokenTypeInput ?? 'Input variable';
         case 'output':
-            return 'Output variable';
+            return labels?.tokenTypeOutput ?? 'Output variable';
         case 'state':
-            return 'State variable';
+            return labels?.tokenTypeState ?? 'State variable';
         case 'resource':
-            return 'Resource';
+            return labels?.tokenTypeResource ?? 'Resource';
         default:
             return 'Text';
     }

package/dist/components/ui/prompt-editor/types.d.ts

@@ -31,6 +31,14 @@ export interface PromptEditorAutoCompleteOption {
     value: string;
 }
 export type PromptEditorMode = 'edit' | 'preview';
+/** Which formats are active at the selection (rich mode) — drives the toolbar's pressed states. */
+export interface PromptEditorToolbarActiveFormats {
+    bold: boolean;
+    italic: boolean;
+    strikethrough: boolean;
+    orderedList: boolean;
+    bulletedList: boolean;
+}
 export interface PromptEditorToolbarActionsRef {
     formatBold: () => void;
     formatItalic: () => void;
@@ -50,8 +58,16 @@ export interface PromptEditorTokenColorConfig {
  * which already resolve per light/dark theme via CSS — no JS theme detection needed.
  */
 export declare const getPromptEditorTokenColors: () => Record<"valid" | "invalid", PromptEditorTokenColorConfig>;
-/** Human-readable label for a token type, used in the chip's hover tooltip. */
-export declare const getPromptEditorTokenTypeLabel: (type: PromptEditorTokenType) => string;
+/** The token-type label subset of `PromptEditorStrings` (structural, to avoid a config↔types cycle). */
+export interface PromptEditorTokenTypeLabels {
+    tokenTypeInput: string;
+    tokenTypeOutput: string;
+    tokenTypeState: string;
+    tokenTypeResource: string;
+}
+/** Human-readable label for a token type, used in the chip's hover tooltip. Pass the editor's
+ *  `strings` to localize; the English defaults apply otherwise. */
+export declare const getPromptEditorTokenTypeLabel: (type: PromptEditorTokenType, labels?: PromptEditorTokenTypeLabels) => string;
 export type PromptEditorDiffType = 'added' | 'removed';
 export declare const isPromptEditorTextToken: (token: PromptEditorToken) => token is PromptEditorTextToken;
 export declare const isPromptEditorNonTextToken: (token: PromptEditorToken) => token is Exclude<PromptEditorToken, PromptEditorTextToken>;

package/dist/components/ui/prompt-editor/types.js

@@ -12,16 +12,16 @@ const getPromptEditorTokenColors = ()=>({
             icon: 'var(--color-error-icon)'
         }
     });
-const getPromptEditorTokenTypeLabel = (type)=>{
+const getPromptEditorTokenTypeLabel = (type, labels)=>{
     switch(type){
         case 'input':
-            return 'Input variable';
+            return labels?.tokenTypeInput ?? 'Input variable';
         case 'output':
-            return 'Output variable';
+            return labels?.tokenTypeOutput ?? 'Output variable';
         case 'state':
-            return 'State variable';
+            return labels?.tokenTypeState ?? 'State variable';
         case 'resource':
-            return 'Resource';
+            return labels?.tokenTypeResource ?? 'Resource';
         default:
             return 'Text';
     }

package/dist/components/ui/prompt-editor/utils/autocomplete-segments.cjs

@@ -26,33 +26,38 @@ __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
     VARIABLE_PATH_REGEX: ()=>VARIABLE_PATH_REGEX,
     inferTokenTypeFromPath: ()=>inferTokenTypeFromPath,
+    normalizeVariablePath: ()=>normalizeVariablePath,
     shouldSuppressOpenForDismissed: ()=>shouldSuppressOpenForDismissed
 });
+const normalizeVariablePath = (path)=>path.replace(/\[\d+\]/g, '[]');
 const NAMESPACE_TOKEN_TYPE = {
     state: 'state',
     resource: 'resource'
 };
 const inferTokenTypeFromPath = (path, options)=>{
-    for (const opt of options)if (opt.value === path) return opt.type;
-    const segments = path.split('.');
+    const target = normalizeVariablePath(path);
+    for (const opt of options)if (normalizeVariablePath(opt.value) === target) return opt.type;
+    const segments = target.split('.');
     while(segments.length > 1){
         segments.pop();
         const prefix = segments.join('.');
-        for (const opt of options)if (opt.value === prefix) return opt.type;
+        for (const opt of options)if (normalizeVariablePath(opt.value) === prefix) return opt.type;
     }
-    return NAMESPACE_TOKEN_TYPE[path.split('.')[0]] ?? 'input';
+    return NAMESPACE_TOKEN_TYPE[target.split('.')[0]] ?? 'input';
 };
-const VARIABLE_PATH_REGEX = /^(?:vars|metadata|agent|state|resource)\.[a-zA-Z_][a-zA-Z0-9_.]*$/;
+const VARIABLE_PATH_REGEX = /^(?:vars|metadata|agent|state|resource)(?:\.[a-zA-Z_][a-zA-Z0-9_]*(?:\[\d+\])*)+$/;
 function shouldSuppressOpenForDismissed(trigger, dismissed) {
     if (!dismissed) return false;
     return dismissed.nodeKey === trigger.nodeKey && dismissed.triggerIndex === trigger.triggerIndex;
 }
 exports.VARIABLE_PATH_REGEX = __webpack_exports__.VARIABLE_PATH_REGEX;
 exports.inferTokenTypeFromPath = __webpack_exports__.inferTokenTypeFromPath;
+exports.normalizeVariablePath = __webpack_exports__.normalizeVariablePath;
 exports.shouldSuppressOpenForDismissed = __webpack_exports__.shouldSuppressOpenForDismissed;
 for(var __rspack_i in __webpack_exports__)if (-1 === [
     "VARIABLE_PATH_REGEX",
     "inferTokenTypeFromPath",
+    "normalizeVariablePath",
     "shouldSuppressOpenForDismissed"
 ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {

package/dist/components/ui/prompt-editor/utils/autocomplete-segments.d.ts

@@ -1,4 +1,17 @@
 import type { PromptEditorAutoCompleteOption, PromptEditorTokenType } from '../types';
+/**
+ * Helpers for the prompt editor's `$`-trigger flow that survived after the bespoke segment-aware
+ * drill-in menu was replaced by `<VariablePickerAutocompleteMenu>`. The picker itself owns search,
+ * keyboard nav, and visual rendering — these helpers cover the parts of the trigger flow that live
+ * in `AutocompletePlugin`: free-form Enter commit (when the typed `$prefix.path` doesn't match any
+ * scope entry) and the dismissal sentinel that suppresses re-opening on cursor returns.
+ */
+/**
+ * Normalize array indices in an expression-ready path (`items[0]` → `items[]`) for lookup, so an
+ * option advertised with the schema's example index (`records[0].id`) also validates user-entered
+ * indices such as `records[1].id`.
+ */
+export declare const normalizeVariablePath: (path: string) => string;
 /**
  * Infer the token type for a typed-but-unmatched path by walking up parent prefixes in the option set.
  * Mirrors `findVariableForPath`'s ancestor-fallback shape so a free-form chip inherits the closest

package/dist/components/ui/prompt-editor/utils/autocomplete-segments.js

@@ -1,20 +1,22 @@
+const normalizeVariablePath = (path)=>path.replace(/\[\d+\]/g, '[]');
 const NAMESPACE_TOKEN_TYPE = {
     state: 'state',
     resource: 'resource'
 };
 const inferTokenTypeFromPath = (path, options)=>{
-    for (const opt of options)if (opt.value === path) return opt.type;
-    const segments = path.split('.');
+    const target = normalizeVariablePath(path);
+    for (const opt of options)if (normalizeVariablePath(opt.value) === target) return opt.type;
+    const segments = target.split('.');
     while(segments.length > 1){
         segments.pop();
         const prefix = segments.join('.');
-        for (const opt of options)if (opt.value === prefix) return opt.type;
+        for (const opt of options)if (normalizeVariablePath(opt.value) === prefix) return opt.type;
     }
-    return NAMESPACE_TOKEN_TYPE[path.split('.')[0]] ?? 'input';
+    return NAMESPACE_TOKEN_TYPE[target.split('.')[0]] ?? 'input';
 };
-const VARIABLE_PATH_REGEX = /^(?:vars|metadata|agent|state|resource)\.[a-zA-Z_][a-zA-Z0-9_.]*$/;
+const VARIABLE_PATH_REGEX = /^(?:vars|metadata|agent|state|resource)(?:\.[a-zA-Z_][a-zA-Z0-9_]*(?:\[\d+\])*)+$/;
 function shouldSuppressOpenForDismissed(trigger, dismissed) {
     if (!dismissed) return false;
     return dismissed.nodeKey === trigger.nodeKey && dismissed.triggerIndex === trigger.triggerIndex;
 }
-export { VARIABLE_PATH_REGEX, inferTokenTypeFromPath, shouldSuppressOpenForDismissed };
+export { VARIABLE_PATH_REGEX, inferTokenTypeFromPath, normalizeVariablePath, shouldSuppressOpenForDismissed };

package/dist/components/ui/prompt-editor/utils/index.cjs

@@ -36,9 +36,9 @@ __webpack_require__.d(__webpack_exports__, {
     WORD_JOINER: ()=>external_serialization_cjs_namespaceObject.WORD_JOINER,
     setEditorTokens: ()=>external_serialization_cjs_namespaceObject.setEditorTokens
 });
-const external_serialization_cjs_namespaceObject = require("./serialization.cjs");
 const external_comparison_cjs_namespaceObject = require("./comparison.cjs");
 const external_insert_token_cjs_namespaceObject = require("./insert-token.cjs");
+const external_serialization_cjs_namespaceObject = require("./serialization.cjs");
 exports.$getEditorTokensInternal = __webpack_exports__.$getEditorTokensInternal;
 exports.$insertTokenAtCursor = __webpack_exports__.$insertTokenAtCursor;
 exports.$setEditorTokensInternal = __webpack_exports__.$setEditorTokensInternal;

package/dist/components/ui/prompt-editor/utils/index.d.ts

@@ -1,3 +1,3 @@
-export { $getEditorTokensInternal, $setEditorTokensInternal, getEditorTokens, setEditorTokens, tokensToClipboardString, clipboardStringToTokens, getEditorTokensFromSelection, WORD_JOINER, } from './serialization';
 export { areTokensEqual } from './comparison';
 export { $insertTokenAtCursor, createTokenNodeForOption } from './insert-token';
+export { $getEditorTokensInternal, $setEditorTokensInternal, clipboardStringToTokens, getEditorTokens, getEditorTokensFromSelection, setEditorTokens, tokensToClipboardString, WORD_JOINER, } from './serialization';

package/dist/components/ui/prompt-editor/utils/index.js

@@ -1,4 +1,4 @@
-import { $getEditorTokensInternal, $setEditorTokensInternal, WORD_JOINER, clipboardStringToTokens, getEditorTokens, getEditorTokensFromSelection, setEditorTokens, tokensToClipboardString } from "./serialization.js";
 import { areTokensEqual } from "./comparison.js";
 import { $insertTokenAtCursor, createTokenNodeForOption } from "./insert-token.js";
+import { $getEditorTokensInternal, $setEditorTokensInternal, WORD_JOINER, clipboardStringToTokens, getEditorTokens, getEditorTokensFromSelection, setEditorTokens, tokensToClipboardString } from "./serialization.js";
 export { $getEditorTokensInternal, $insertTokenAtCursor, $setEditorTokensInternal, WORD_JOINER, areTokensEqual, clipboardStringToTokens, createTokenNodeForOption, getEditorTokens, getEditorTokensFromSelection, setEditorTokens, tokensToClipboardString };

package/dist/components/ui/prompt-editor/utils/insert-token.d.ts

@@ -1,6 +1,6 @@
 import type { PromptEditorAutoCompleteOption } from '../types';
 /** Create the correct Lexical token decorator node for an autocomplete option. */
-export declare const createTokenNodeForOption: (option: PromptEditorAutoCompleteOption) => import("../nodes").InputTokenNode | import("../nodes").OutputTokenNode | import("../nodes").StateTokenNode | import("../nodes").ResourceTokenNode;
+export declare const createTokenNodeForOption: (option: PromptEditorAutoCompleteOption) => import("..").InputTokenNode | import("..").OutputTokenNode | import("..").ResourceTokenNode | import("..").StateTokenNode;
 /**
  * Insert a token pill at the current cursor position. Must be called inside an
  * `editor.update(() => ...)` block.