@uipath/apollo-wind 2.46.0 → 2.47.1

package/dist/components/ui/index.cjs

@@ -15,7 +15,7 @@ var __webpack_modules__ = {
     "./avatar" (module) {
         module.exports = require("./avatar.cjs");
     },
-    "./badge" (module) {
+    "@/components/ui/badge" (module) {
         module.exports = require("./badge.cjs");
     },
     "./breadcrumb" (module) {
@@ -24,7 +24,7 @@ var __webpack_modules__ = {
     "./button-group" (module) {
         module.exports = require("./button-group.cjs");
     },
-    "@/components/ui/button" (module) {
+    "./button" (module) {
         module.exports = require("./button.cjs");
     },
     "./calendar" (module) {
@@ -39,16 +39,16 @@ var __webpack_modules__ = {
     "./checkbox" (module) {
         module.exports = require("./checkbox.cjs");
     },
-    "./collapsible" (module) {
+    "@/components/ui/collapsible" (module) {
         module.exports = require("./collapsible.cjs");
     },
     "./combobox" (module) {
         module.exports = require("./combobox.cjs");
     },
-    "./command" (module) {
+    "@/components/ui/command" (module) {
         module.exports = require("./command.cjs");
     },
-    "./context-menu" (module) {
+    "@/components/ui/context-menu" (module) {
         module.exports = require("./context-menu.cjs");
     },
     "./data-table" (module) {
@@ -66,10 +66,10 @@ var __webpack_modules__ = {
     "./drawer" (module) {
         module.exports = require("./drawer.cjs");
     },
-    "./dropdown-menu" (module) {
+    "@/components/ui/dropdown-menu" (module) {
         module.exports = require("./dropdown-menu.cjs");
     },
-    "./editable-cell" (module) {
+    "@/components/ui/editable-cell" (module) {
         module.exports = require("./editable-cell.cjs");
     },
     "./empty-state" (module) {
@@ -81,16 +81,16 @@ var __webpack_modules__ = {
     "./form-field" (module) {
         module.exports = require("./form-field.cjs");
     },
-    "./hover-card" (module) {
+    "@/components/ui/hover-card" (module) {
         module.exports = require("./hover-card.cjs");
     },
-    "./input-group" (module) {
+    "@/components/ui/input-group" (module) {
         module.exports = require("./input-group.cjs");
     },
-    "@/components/ui/input" (module) {
+    "./input" (module) {
         module.exports = require("./input.cjs");
     },
-    "./label" (module) {
+    "@/components/ui/label" (module) {
         module.exports = require("./label.cjs");
     },
     "./layout" (module) {
@@ -105,16 +105,16 @@ var __webpack_modules__ = {
     "./pagination" (module) {
         module.exports = require("./pagination.cjs");
     },
-    "@/components/ui/popover" (module) {
+    "./popover" (module) {
         module.exports = require("./popover.cjs");
     },
-    "./portal-container" (module) {
+    "@/components/ui/portal-container" (module) {
         module.exports = require("./portal-container.cjs");
     },
     "./progress" (module) {
         module.exports = require("./progress.cjs");
     },
-    "./prompt-editor" (module) {
+    "./prompt-editor?2bb4" (module) {
         module.exports = require("./prompt-editor/index.cjs");
     },
     "./radio-group" (module) {
@@ -159,19 +159,19 @@ var __webpack_modules__ = {
     "./switch" (module) {
         module.exports = require("./switch.cjs");
     },
-    "./table" (module) {
+    "@/components/ui/table" (module) {
         module.exports = require("./table.cjs");
     },
     "./tabs" (module) {
         module.exports = require("./tabs.cjs");
     },
-    "@/components/ui/textarea" (module) {
+    "./textarea" (module) {
         module.exports = require("./textarea.cjs");
     },
     "./toggle-group" (module) {
         module.exports = require("./toggle-group.cjs");
     },
-    "./toggle" (module) {
+    "@/components/ui/toggle" (module) {
         module.exports = require("./toggle.cjs");
     },
     "./tooltip" (module) {
@@ -265,7 +265,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_avatar__rspack_import_4[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _badge__rspack_import_5 = __webpack_require__("./badge");
+    var _badge__rspack_import_5 = __webpack_require__("@/components/ui/badge");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _badge__rspack_import_5)if ([
         "TreeView",
@@ -279,7 +279,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_breadcrumb__rspack_import_6[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _button__rspack_import_7 = __webpack_require__("@/components/ui/button");
+    var _button__rspack_import_7 = __webpack_require__("./button");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _button__rspack_import_7)if ([
         "TreeView",
@@ -321,7 +321,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_checkbox__rspack_import_12[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _collapsible__rspack_import_13 = __webpack_require__("./collapsible");
+    var _collapsible__rspack_import_13 = __webpack_require__("@/components/ui/collapsible");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _collapsible__rspack_import_13)if ([
         "TreeView",
@@ -335,14 +335,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_combobox__rspack_import_14[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _command__rspack_import_15 = __webpack_require__("./command");
+    var _command__rspack_import_15 = __webpack_require__("@/components/ui/command");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _command__rspack_import_15)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_command__rspack_import_15[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _context_menu__rspack_import_16 = __webpack_require__("./context-menu");
+    var _context_menu__rspack_import_16 = __webpack_require__("@/components/ui/context-menu");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _context_menu__rspack_import_16)if ([
         "TreeView",
@@ -384,14 +384,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_drawer__rspack_import_21[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _dropdown_menu__rspack_import_22 = __webpack_require__("./dropdown-menu");
+    var _dropdown_menu__rspack_import_22 = __webpack_require__("@/components/ui/dropdown-menu");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _dropdown_menu__rspack_import_22)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_dropdown_menu__rspack_import_22[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _editable_cell__rspack_import_23 = __webpack_require__("./editable-cell");
+    var _editable_cell__rspack_import_23 = __webpack_require__("@/components/ui/editable-cell");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _editable_cell__rspack_import_23)if ([
         "TreeView",
@@ -419,28 +419,28 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_file_upload__rspack_import_26[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _hover_card__rspack_import_27 = __webpack_require__("./hover-card");
+    var _hover_card__rspack_import_27 = __webpack_require__("@/components/ui/hover-card");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _hover_card__rspack_import_27)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_hover_card__rspack_import_27[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _input__rspack_import_28 = __webpack_require__("@/components/ui/input");
+    var _input__rspack_import_28 = __webpack_require__("./input");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _input__rspack_import_28)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_input__rspack_import_28[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _input_group__rspack_import_29 = __webpack_require__("./input-group");
+    var _input_group__rspack_import_29 = __webpack_require__("@/components/ui/input-group");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _input_group__rspack_import_29)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_input_group__rspack_import_29[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _label__rspack_import_30 = __webpack_require__("./label");
+    var _label__rspack_import_30 = __webpack_require__("@/components/ui/label");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _label__rspack_import_30)if ([
         "TreeView",
@@ -475,14 +475,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_pagination__rspack_import_34[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _popover__rspack_import_35 = __webpack_require__("@/components/ui/popover");
+    var _popover__rspack_import_35 = __webpack_require__("./popover");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _popover__rspack_import_35)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_popover__rspack_import_35[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _portal_container__rspack_import_36 = __webpack_require__("./portal-container");
+    var _portal_container__rspack_import_36 = __webpack_require__("@/components/ui/portal-container");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _portal_container__rspack_import_36)if ([
         "TreeView",
@@ -496,7 +496,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_progress__rspack_import_37[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _prompt_editor__rspack_import_38 = __webpack_require__("./prompt-editor");
+    var _prompt_editor__rspack_import_38 = __webpack_require__("./prompt-editor?2bb4");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _prompt_editor__rspack_import_38)if ([
         "TreeView",
@@ -601,7 +601,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_switch__rspack_import_52[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _table__rspack_import_53 = __webpack_require__("./table");
+    var _table__rspack_import_53 = __webpack_require__("@/components/ui/table");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _table__rspack_import_53)if ([
         "TreeView",
@@ -615,14 +615,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_tabs__rspack_import_54[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _textarea__rspack_import_55 = __webpack_require__("@/components/ui/textarea");
+    var _textarea__rspack_import_55 = __webpack_require__("./textarea");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _textarea__rspack_import_55)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_textarea__rspack_import_55[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _toggle__rspack_import_56 = __webpack_require__("./toggle");
+    var _toggle__rspack_import_56 = __webpack_require__("@/components/ui/toggle");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _toggle__rspack_import_56)if ([
         "TreeView",

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

@@ -30,16 +30,18 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_lucide_react_namespaceObject = require("lucide-react");
 const external_tooltip_cjs_namespaceObject = require("../../tooltip.cjs");
 const index_cjs_namespaceObject = require("../../../../lib/index.cjs");
-const ToolbarButton = ({ icon: Icon, label, disabled, onClick })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_tooltip_cjs_namespaceObject.Tooltip, {
+const external_prompt_editor_config_cjs_namespaceObject = require("../prompt-editor-config.cjs");
+const ToolbarButton = ({ icon: Icon, label, disabled, onClick, pressed })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_tooltip_cjs_namespaceObject.Tooltip, {
         children: [
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_tooltip_cjs_namespaceObject.TooltipTrigger, {
                 asChild: true,
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
                     type: "button",
                     "aria-label": label,
+                    "aria-pressed": pressed,
                     disabled: disabled,
                     onClick: onClick,
-                    className: (0, index_cjs_namespaceObject.cn)('inline-flex h-7 w-7 items-center justify-center rounded text-muted-foreground', 'hover:bg-accent hover:text-accent-foreground', 'disabled:opacity-50 disabled:pointer-events-none'),
+                    className: (0, index_cjs_namespaceObject.cn)('inline-flex h-7 w-7 cursor-pointer items-center justify-center rounded text-muted-foreground', 'hover:bg-accent hover:text-accent-foreground', 'disabled:opacity-50 disabled:pointer-events-none', pressed && 'bg-accent text-accent-foreground'),
                     children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Icon, {
                         className: "h-3.5 w-3.5"
                     })
@@ -58,14 +60,65 @@ const ToolbarSeparator = ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
         "aria-hidden": true,
         className: "mx-1 h-4 w-px bg-border/60"
     });
-const EditorToolbar = ({ mode, onModeChange, disabled, error, actionsRef, onFullscreen })=>{
-    const isEditMode = 'edit' === mode;
+const EditorToolbar = ({ mode, onModeChange, disabled, error, actionsRef, onFullscreen, showModeToggle = true, trailing, strings = external_prompt_editor_config_cjs_namespaceObject.DEFAULT_PROMPT_EDITOR_STRINGS, activeFormats })=>{
+    const isEditMode = !showModeToggle || 'edit' === mode;
     const handleFormat = (actionName)=>()=>{
             if (!disabled && isEditMode) {
                 const fn = actionsRef?.current?.[actionName];
                 if ('function' == typeof fn) fn();
             }
         };
+    const formattingCluster = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
+                icon: external_lucide_react_namespaceObject.Bold,
+                pressed: activeFormats?.bold,
+                label: strings.bold,
+                disabled: disabled || !isEditMode,
+                onClick: handleFormat('formatBold')
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
+                icon: external_lucide_react_namespaceObject.Italic,
+                pressed: activeFormats?.italic,
+                label: strings.italic,
+                disabled: disabled || !isEditMode,
+                onClick: handleFormat('formatItalic')
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
+                icon: external_lucide_react_namespaceObject.Strikethrough,
+                pressed: activeFormats?.strikethrough,
+                label: strings.strikethrough,
+                disabled: disabled || !isEditMode,
+                onClick: handleFormat('formatStrikethrough')
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarSeparator, {}),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
+                icon: external_lucide_react_namespaceObject.ListOrdered,
+                pressed: activeFormats?.orderedList,
+                label: strings.numberedList,
+                disabled: disabled || !isEditMode,
+                onClick: handleFormat('formatNumberedList')
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
+                icon: external_lucide_react_namespaceObject.List,
+                pressed: activeFormats?.bulletedList,
+                label: strings.bulletedList,
+                disabled: disabled || !isEditMode,
+                onClick: handleFormat('formatBulletedList')
+            }),
+            onFullscreen && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarSeparator, {}),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
+                        icon: external_lucide_react_namespaceObject.Maximize2,
+                        label: strings.expand,
+                        disabled: disabled,
+                        onClick: onFullscreen
+                    })
+                ]
+            })
+        ]
+    });
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
         className: (0, index_cjs_namespaceObject.cn)('relative flex items-center justify-between gap-1 overflow-hidden rounded-t-md border border-b-0 bg-background px-2 py-1 future:rounded-t-xl future:border-0 future:bg-surface-overlay', error && 'border-error ring-1 ring-error/20 future:ring-error/40'),
         "data-testid": "editor-toolbar",
@@ -75,77 +128,57 @@ const EditorToolbar = ({ mode, onModeChange, disabled, error, actionsRef, onFull
                 "data-testid": "editor-toolbar-separator",
                 className: "pointer-events-none absolute bottom-0 left-0 h-px w-full bg-border/40"
             }),
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                className: "flex items-center gap-1 shrink-0",
-                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("fieldset", {
-                    "aria-label": "Editor mode",
-                    className: "m-0 flex items-center rounded-md border-0 bg-muted p-0.5",
-                    children: [
-                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
-                            type: "button",
-                            "aria-pressed": 'edit' === mode,
-                            className: (0, index_cjs_namespaceObject.cn)('rounded px-2 py-0.5 text-[11px] font-semibold transition-colors', 'edit' === mode ? 'bg-primary/20 text-primary' : 'text-foreground hover:bg-accent'),
-                            disabled: disabled,
-                            onClick: ()=>onModeChange('edit'),
-                            children: "Edit"
-                        }),
-                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
-                            type: "button",
-                            "aria-pressed": 'preview' === mode,
-                            className: (0, index_cjs_namespaceObject.cn)('rounded px-2 py-0.5 text-[11px] font-semibold transition-colors', 'preview' === mode ? 'bg-primary/20 text-primary' : 'text-foreground hover:bg-accent'),
-                            disabled: disabled,
-                            onClick: ()=>onModeChange('preview'),
-                            children: "Preview"
-                        })
-                    ]
-                })
-            }),
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-                className: "flex items-center gap-0.5 overflow-hidden",
+            showModeToggle ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
                 children: [
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
-                        icon: external_lucide_react_namespaceObject.Bold,
-                        label: "Bold",
-                        disabled: disabled || !isEditMode,
-                        onClick: handleFormat('formatBold')
-                    }),
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
-                        icon: external_lucide_react_namespaceObject.Italic,
-                        label: "Italic",
-                        disabled: disabled || !isEditMode,
-                        onClick: handleFormat('formatItalic')
-                    }),
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
-                        icon: external_lucide_react_namespaceObject.Strikethrough,
-                        label: "Strikethrough",
-                        disabled: disabled || !isEditMode,
-                        onClick: handleFormat('formatStrikethrough')
-                    }),
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarSeparator, {}),
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
-                        icon: external_lucide_react_namespaceObject.ListOrdered,
-                        label: "Numbered List",
-                        disabled: disabled || !isEditMode,
-                        onClick: handleFormat('formatNumberedList')
-                    }),
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
-                        icon: external_lucide_react_namespaceObject.List,
-                        label: "Bulleted List",
-                        disabled: disabled || !isEditMode,
-                        onClick: handleFormat('formatBulletedList')
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                        className: "flex items-center gap-1 shrink-0",
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("fieldset", {
+                            "aria-label": strings.editorModeLabel,
+                            className: "m-0 flex items-center rounded-md border-0 bg-muted p-0.5",
+                            children: [
+                                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
+                                    type: "button",
+                                    "aria-pressed": 'edit' === mode,
+                                    className: (0, index_cjs_namespaceObject.cn)('cursor-pointer rounded px-2 py-0.5 text-[11px] font-semibold transition-colors', 'edit' === mode ? 'bg-primary/20 text-primary' : 'text-foreground hover:bg-accent'),
+                                    disabled: disabled,
+                                    onClick: ()=>onModeChange('edit'),
+                                    children: strings.edit
+                                }),
+                                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
+                                    type: "button",
+                                    "aria-pressed": 'preview' === mode,
+                                    className: (0, index_cjs_namespaceObject.cn)('cursor-pointer rounded px-2 py-0.5 text-[11px] font-semibold transition-colors', 'preview' === mode ? 'bg-primary/20 text-primary' : 'text-foreground hover:bg-accent'),
+                                    disabled: disabled,
+                                    onClick: ()=>onModeChange('preview'),
+                                    children: strings.preview
+                                })
+                            ]
+                        })
                     }),
-                    onFullscreen && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                        className: "flex items-center gap-0.5 overflow-hidden",
                         children: [
-                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarSeparator, {}),
-                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarButton, {
-                                icon: external_lucide_react_namespaceObject.Maximize2,
-                                label: "Expand",
-                                disabled: disabled,
-                                onClick: onFullscreen
+                            formattingCluster,
+                            trailing && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+                                children: [
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarSeparator, {}),
+                                    trailing
+                                ]
                             })
                         ]
                     })
                 ]
+            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                        className: "flex items-center gap-0.5 overflow-hidden",
+                        children: formattingCluster
+                    }),
+                    trailing && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                        className: "flex items-center gap-0.5 shrink-0",
+                        children: trailing
+                    })
+                ]
             })
         ]
     });

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

@@ -1,4 +1,5 @@
-import type { PromptEditorMode, PromptEditorToolbarActionsRef } from '../types';
+import { type PromptEditorStrings } from '../prompt-editor-config';
+import type { PromptEditorMode, PromptEditorToolbarActionsRef, PromptEditorToolbarActiveFormats } from '../types';
 export interface EditorToolbarProps {
     mode: PromptEditorMode;
     onModeChange: (mode: PromptEditorMode) => void;
@@ -6,5 +7,18 @@ export interface EditorToolbarProps {
     error?: boolean;
     actionsRef?: React.RefObject<PromptEditorToolbarActionsRef | null>;
     onFullscreen?: () => void;
+    /**
+     * Whether the Edit/Preview switcher renders. When hidden, the formatting cluster moves to the
+     * left edge (there is no preview mode to guard, so buttons follow `disabled` alone) and
+     * `trailing` right-aligns — the layout used by value-mode fields whose mode menu lives in
+     * `trailing`. Defaults to true.
+     */
+    showModeToggle?: boolean;
+    /** Consumer-supplied node rendered at the toolbar's right end (e.g. a value-mode menu). */
+    trailing?: React.ReactNode;
+    /** Overridable labels; every key defaults to the built-in English. */
+    strings?: PromptEditorStrings;
+    /** Rich mode: which formats the selection carries — drives `aria-pressed` on the buttons. */
+    activeFormats?: PromptEditorToolbarActiveFormats;
 }
-export declare const EditorToolbar: ({ mode, onModeChange, disabled, error, actionsRef, onFullscreen, }: EditorToolbarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const EditorToolbar: ({ mode, onModeChange, disabled, error, actionsRef, onFullscreen, showModeToggle, trailing, strings, activeFormats, }: EditorToolbarProps) => import("react/jsx-runtime").JSX.Element;