@uipath/apollo-react 6.43.0 → 6.44.0

package/dist/canvas/components/NodePropertyPanel/EditableText.cjs

@@ -31,6 +31,7 @@ const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
 const external_react_namespaceObject = require("react");
 const useIsomorphicLayoutEffect_cjs_namespaceObject = require("../../hooks/useIsomorphicLayoutEffect.cjs");
 const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
+const stripNewlines = (text)=>text.replace(/\n+/g, ' ');
 const READ_CLASS = {
     lg: 'text-base font-semibold leading-5 tracking-[-0.3px] text-foreground',
     sm: 'text-xs leading-4 text-foreground-muted'
@@ -47,34 +48,43 @@ const VERTICAL_PADDING = 4;
 const CLAMP_CLASS = 'line-clamp-[var(--editable-text-lines)] whitespace-pre-line wrap-break-word';
 const INTERACTIVE_CLASS = 'rounded px-1.5 py-0.5 -mx-1.5';
 const ERROR_RING_CLASS = 'ring-1 ring-error';
-function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3, onChange, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId }) {
+function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3, onChange, onSubmit, disabled, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId }) {
+    const allowNewlines = true === multiline;
+    const editable = !!onChange && !!onSubmit;
     const [isEditing, setIsEditing] = (0, external_react_namespaceObject.useState)(false);
-    const [draft, setDraft] = (0, external_react_namespaceObject.useState)(value);
     const inputRef = (0, external_react_namespaceObject.useRef)(null);
+    const openedWith = (0, external_react_namespaceObject.useRef)(value);
     const errorId = `editable-text-${(0, external_react_namespaceObject.useId)().replace(/:/g, '')}-error`;
     const hasError = !!error;
     const describedBy = hasError ? errorId : void 0;
     (0, useIsomorphicLayoutEffect_cjs_namespaceObject.useIsomorphicLayoutEffect)(()=>{
+        if (disabled) return setIsEditing(false);
         if (!isEditing) return;
         inputRef.current?.focus();
         inputRef.current?.select();
     }, [
-        isEditing
+        isEditing,
+        disabled
     ]);
     const commit = (0, external_react_namespaceObject.useCallback)(()=>{
         setIsEditing(false);
-        const next = draft.trim();
+        const next = value.trim();
         if (next !== value) onChange?.(next);
+        if (next !== openedWith.current) onSubmit?.(next);
     }, [
-        draft,
         value,
-        onChange
+        onChange,
+        onSubmit
     ]);
     const cancel = (0, external_react_namespaceObject.useCallback)(()=>{
         setIsEditing(false);
-    }, []);
+        if (openedWith.current !== value) onChange?.(openedWith.current);
+    }, [
+        value,
+        onChange
+    ]);
     const handleKeyDown = (0, external_react_namespaceObject.useCallback)((e)=>{
-        if ('Enter' !== e.key || multiline && e.shiftKey) {
+        if ('Enter' !== e.key || allowNewlines && e.shiftKey) {
             if ('Escape' === e.key) {
                 e.preventDefault();
                 cancel();
@@ -87,7 +97,7 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
     }, [
         commit,
         cancel,
-        multiline
+        allowNewlines
     ]);
     const editorMaxHeight = multiline ? {
         maxHeight: maxLines * LINE_HEIGHT[size] + VERTICAL_PADDING
@@ -102,7 +112,7 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
         className: "-ml-1 mt-1",
         children: error
     });
-    if (!onChange) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+    if (!editable) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
         children: [
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
                 content: value || placeholder,
@@ -120,11 +130,11 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
             message
         ]
     });
-    if (isEditing) {
+    if (isEditing && !disabled) {
         const sharedProps = {
             'data-slot': 'editable-text-input',
             'data-testid': dataTestId ? `${dataTestId}-input` : void 0,
-            value: draft,
+            value,
             placeholder,
             'aria-label': ariaLabel,
             'aria-describedby': describedBy,
@@ -142,12 +152,12 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
                     rows: 1,
                     style: editorMaxHeight,
                     className: (0, apollo_wind_namespaceObject.cn)(sharedProps.className, 'field-sizing-content max-w-full resize-none overflow-y-auto wrap-break-word'),
-                    onChange: (e)=>setDraft(e.target.value)
+                    onChange: (e)=>onChange?.(allowNewlines ? e.target.value : stripNewlines(e.target.value))
                 }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("input", {
                     ...sharedProps,
                     ref: inputRef,
                     autoComplete: "off",
-                    onChange: (e)=>setDraft(e.target.value)
+                    onChange: (e)=>onChange?.(e.target.value)
                 }),
                 message
             ]
@@ -167,12 +177,14 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
                     "aria-describedby": describedBy,
                     "aria-errormessage": hasError ? errorId : void 0,
                     "aria-invalid": hasError || void 0,
+                    "aria-disabled": disabled || void 0,
                     onClick: ()=>{
-                        setDraft(value);
+                        if (disabled) return;
+                        openedWith.current = value;
                         setIsEditing(true);
                     },
                     style: readClampStyle,
-                    className: (0, apollo_wind_namespaceObject.cn)('nodrag max-w-full cursor-text border-none bg-transparent text-left transition hover:bg-surface-overlay', readClampClass, INTERACTIVE_CLASS, READ_CLASS[size], !value && 'text-foreground-subtle', hasError && ERROR_RING_CLASS, className),
+                    className: (0, apollo_wind_namespaceObject.cn)('nodrag max-w-full cursor-text border-none bg-transparent text-left transition hover:bg-surface-overlay', 'aria-disabled:cursor-not-allowed aria-disabled:opacity-50 aria-disabled:hover:bg-transparent', readClampClass, INTERACTIVE_CLASS, READ_CLASS[size], !value && 'text-foreground-subtle', hasError && ERROR_RING_CLASS, className),
                     children: value || placeholder
                 })
             }),

package/dist/canvas/components/NodePropertyPanel/EditableText.d.ts

@@ -3,13 +3,15 @@ export interface EditableTextProps {
     value: string;
     placeholder?: string;
     size?: 'sm' | 'lg';
-    multiline?: boolean;
+    multiline?: boolean | 'wrap';
     maxLines?: number;
     onChange?: (next: string) => void;
+    onSubmit?: (next: string) => void;
+    disabled?: boolean;
     error?: ReactNode;
     'aria-label'?: string;
     className?: string;
     'data-testid'?: string;
 }
-export declare function EditableText({ value, placeholder, size, multiline, maxLines, onChange, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId, }: EditableTextProps): import("react/jsx-runtime").JSX.Element;
+export declare function EditableText({ value, placeholder, size, multiline, maxLines, onChange, onSubmit, disabled, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId, }: EditableTextProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=EditableText.d.ts.map

package/dist/canvas/components/NodePropertyPanel/EditableText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditableText.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/EditableText.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,SAAS,EAAwC,MAAM,OAAO,CAAC;AAI7E,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAEnB,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAElC,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAgCD,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,WAAW,EACX,IAAW,EACX,SAAS,EACT,QAAY,EACZ,QAAQ,EACR,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,SAAS,EACT,aAAa,EAAE,UAAU,GAC1B,EAAE,iBAAiB,2CAmKnB"}
+{"version":3,"file":"EditableText.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/EditableText.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,SAAS,EAAwC,MAAM,OAAO,CAAC;AAI7E,MAAM,WAAW,iBAAiB;IAEhC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAKnB,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAE7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAElC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAElC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAuCD,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,WAAW,EACX,IAAW,EACX,SAAS,EACT,QAAY,EACZ,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,SAAS,EACT,aAAa,EAAE,UAAU,GAC1B,EAAE,iBAAiB,2CAoLnB"}

package/dist/canvas/components/NodePropertyPanel/EditableText.js

@@ -3,6 +3,7 @@ import { FormFieldError, cn } from "@uipath/apollo-wind";
 import { useCallback, useId, useRef, useState } from "react";
 import { useIsomorphicLayoutEffect } from "../../hooks/useIsomorphicLayoutEffect.js";
 import { CanvasTooltip } from "../CanvasTooltip.js";
+const stripNewlines = (text)=>text.replace(/\n+/g, ' ');
 const READ_CLASS = {
     lg: 'text-base font-semibold leading-5 tracking-[-0.3px] text-foreground',
     sm: 'text-xs leading-4 text-foreground-muted'
@@ -19,34 +20,43 @@ const VERTICAL_PADDING = 4;
 const CLAMP_CLASS = 'line-clamp-[var(--editable-text-lines)] whitespace-pre-line wrap-break-word';
 const INTERACTIVE_CLASS = 'rounded px-1.5 py-0.5 -mx-1.5';
 const ERROR_RING_CLASS = 'ring-1 ring-error';
-function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3, onChange, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId }) {
+function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3, onChange, onSubmit, disabled, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId }) {
+    const allowNewlines = true === multiline;
+    const editable = !!onChange && !!onSubmit;
     const [isEditing, setIsEditing] = useState(false);
-    const [draft, setDraft] = useState(value);
     const inputRef = useRef(null);
+    const openedWith = useRef(value);
     const errorId = `editable-text-${useId().replace(/:/g, '')}-error`;
     const hasError = !!error;
     const describedBy = hasError ? errorId : void 0;
     useIsomorphicLayoutEffect(()=>{
+        if (disabled) return setIsEditing(false);
         if (!isEditing) return;
         inputRef.current?.focus();
         inputRef.current?.select();
     }, [
-        isEditing
+        isEditing,
+        disabled
     ]);
     const commit = useCallback(()=>{
         setIsEditing(false);
-        const next = draft.trim();
+        const next = value.trim();
         if (next !== value) onChange?.(next);
+        if (next !== openedWith.current) onSubmit?.(next);
     }, [
-        draft,
         value,
-        onChange
+        onChange,
+        onSubmit
     ]);
     const cancel = useCallback(()=>{
         setIsEditing(false);
-    }, []);
+        if (openedWith.current !== value) onChange?.(openedWith.current);
+    }, [
+        value,
+        onChange
+    ]);
     const handleKeyDown = useCallback((e)=>{
-        if ('Enter' !== e.key || multiline && e.shiftKey) {
+        if ('Enter' !== e.key || allowNewlines && e.shiftKey) {
             if ('Escape' === e.key) {
                 e.preventDefault();
                 cancel();
@@ -59,7 +69,7 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
     }, [
         commit,
         cancel,
-        multiline
+        allowNewlines
     ]);
     const editorMaxHeight = multiline ? {
         maxHeight: maxLines * LINE_HEIGHT[size] + VERTICAL_PADDING
@@ -74,7 +84,7 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
         className: "-ml-1 mt-1",
         children: error
     });
-    if (!onChange) return /*#__PURE__*/ jsxs(Fragment, {
+    if (!editable) return /*#__PURE__*/ jsxs(Fragment, {
         children: [
             /*#__PURE__*/ jsx(CanvasTooltip, {
                 content: value || placeholder,
@@ -92,11 +102,11 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
             message
         ]
     });
-    if (isEditing) {
+    if (isEditing && !disabled) {
         const sharedProps = {
             'data-slot': 'editable-text-input',
             'data-testid': dataTestId ? `${dataTestId}-input` : void 0,
-            value: draft,
+            value,
             placeholder,
             'aria-label': ariaLabel,
             'aria-describedby': describedBy,
@@ -114,12 +124,12 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
                     rows: 1,
                     style: editorMaxHeight,
                     className: cn(sharedProps.className, 'field-sizing-content max-w-full resize-none overflow-y-auto wrap-break-word'),
-                    onChange: (e)=>setDraft(e.target.value)
+                    onChange: (e)=>onChange?.(allowNewlines ? e.target.value : stripNewlines(e.target.value))
                 }) : /*#__PURE__*/ jsx("input", {
                     ...sharedProps,
                     ref: inputRef,
                     autoComplete: "off",
-                    onChange: (e)=>setDraft(e.target.value)
+                    onChange: (e)=>onChange?.(e.target.value)
                 }),
                 message
             ]
@@ -139,12 +149,14 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
                     "aria-describedby": describedBy,
                     "aria-errormessage": hasError ? errorId : void 0,
                     "aria-invalid": hasError || void 0,
+                    "aria-disabled": disabled || void 0,
                     onClick: ()=>{
-                        setDraft(value);
+                        if (disabled) return;
+                        openedWith.current = value;
                         setIsEditing(true);
                     },
                     style: readClampStyle,
-                    className: cn('nodrag max-w-full cursor-text border-none bg-transparent text-left transition hover:bg-surface-overlay', readClampClass, INTERACTIVE_CLASS, READ_CLASS[size], !value && 'text-foreground-subtle', hasError && ERROR_RING_CLASS, className),
+                    className: cn('nodrag max-w-full cursor-text border-none bg-transparent text-left transition hover:bg-surface-overlay', 'aria-disabled:cursor-not-allowed aria-disabled:opacity-50 aria-disabled:hover:bg-transparent', readClampClass, INTERACTIVE_CLASS, READ_CLASS[size], !value && 'text-foreground-subtle', hasError && ERROR_RING_CLASS, className),
                     children: value || placeholder
                 })
             }),

package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.cjs

@@ -33,10 +33,10 @@ const external_react_namespaceObject = require("react");
 const index_cjs_namespaceObject = require("../../../i18n/index.cjs");
 const external_EditableText_cjs_namespaceObject = require("./EditableText.cjs");
 const SURFACE_REMAP = 'future:[--surface-raised:var(--surface-overlay)]';
-function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeDescriptionChange, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange }) {
+function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeLabelSubmit, onNodeDescriptionChange, onNodeDescriptionSubmit, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange }) {
     const { _ } = (0, index_cjs_namespaceObject.useSafeLingui)();
-    const isLabelEditable = !!onNodeLabelChange;
-    const isDescriptionEditable = !!onNodeDescriptionChange;
+    const isLabelEditable = !!onNodeLabelChange && !!onNodeLabelSubmit;
+    const isDescriptionEditable = !!onNodeDescriptionChange && !!onNodeDescriptionSubmit;
     const showsDescription = !!nodeDescription || isDescriptionEditable || !!nodeDescriptionError;
     const showsLabel = !!nodeLabel || isLabelEditable || !!nodeLabelError;
     const hasNodeHeader = !!(showsLabel || nodeCategory || nodeIcon || action || showsDescription);
@@ -118,6 +118,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
                                         }),
                                         size: "lg",
                                         onChange: onNodeLabelChange,
+                                        onSubmit: onNodeLabelSubmit,
+                                        disabled: disabled,
                                         error: nodeLabelError,
                                         "aria-label": _({
                                             id: 'canvas.node_property_panel.node_name',
@@ -135,6 +137,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
                                         multiline: true,
                                         maxLines: 3,
                                         onChange: onNodeDescriptionChange,
+                                        onSubmit: onNodeDescriptionSubmit,
+                                        disabled: disabled,
                                         error: nodeDescriptionError,
                                         "aria-label": _({
                                             id: "canvas.node_property_panel.node_description",

package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.d.ts

@@ -1,3 +1,3 @@
 import type { NodePropertyPanelProps } from './NodePropertyPanel.types';
-export declare function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeDescriptionChange, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset, children, headerExtra, sectionVariant, activeStepId, onActiveStepChange, }: NodePropertyPanelProps): import("react/jsx-runtime").JSX.Element;
+export declare function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeLabelSubmit, onNodeDescriptionChange, onNodeDescriptionSubmit, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset, children, headerExtra, sectionVariant, activeStepId, onActiveStepChange, }: NodePropertyPanelProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=NodePropertyPanel.d.ts.map

package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NodePropertyPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/NodePropertyPanel.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AAuCxE,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,eAAe,EACf,OAAO,EACP,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,oBAAoB,EACpB,0BAA0B,EAC1B,iBAAiB,EACjB,uBAAuB,EACvB,cAAc,EACd,oBAAoB,EACpB,MAAM,EACN,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,YAAuB,EACvB,QAAQ,EACR,WAAW,EACX,cAAc,EACd,YAAY,EACZ,kBAAkB,GACnB,EAAE,sBAAsB,2CAqKxB"}
+{"version":3,"file":"NodePropertyPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/NodePropertyPanel.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AA2CxE,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,eAAe,EACf,OAAO,EACP,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,oBAAoB,EACpB,0BAA0B,EAC1B,iBAAiB,EACjB,iBAAiB,EACjB,uBAAuB,EACvB,uBAAuB,EACvB,cAAc,EACd,oBAAoB,EACpB,MAAM,EACN,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,YAAuB,EACvB,QAAQ,EACR,WAAW,EACX,cAAc,EACd,YAAY,EACZ,kBAAkB,GACnB,EAAE,sBAAsB,2CAyKxB"}

package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.js

@@ -5,10 +5,10 @@ import { useMemo } from "react";
 import { useSafeLingui } from "../../../i18n/index.js";
 import { EditableText } from "./EditableText.js";
 const SURFACE_REMAP = 'future:[--surface-raised:var(--surface-overlay)]';
-function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeDescriptionChange, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange }) {
+function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeLabelSubmit, onNodeDescriptionChange, onNodeDescriptionSubmit, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange }) {
     const { _ } = useSafeLingui();
-    const isLabelEditable = !!onNodeLabelChange;
-    const isDescriptionEditable = !!onNodeDescriptionChange;
+    const isLabelEditable = !!onNodeLabelChange && !!onNodeLabelSubmit;
+    const isDescriptionEditable = !!onNodeDescriptionChange && !!onNodeDescriptionSubmit;
     const showsDescription = !!nodeDescription || isDescriptionEditable || !!nodeDescriptionError;
     const showsLabel = !!nodeLabel || isLabelEditable || !!nodeLabelError;
     const hasNodeHeader = !!(showsLabel || nodeCategory || nodeIcon || action || showsDescription);
@@ -90,6 +90,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
                                         }),
                                         size: "lg",
                                         onChange: onNodeLabelChange,
+                                        onSubmit: onNodeLabelSubmit,
+                                        disabled: disabled,
                                         error: nodeLabelError,
                                         "aria-label": _({
                                             id: 'canvas.node_property_panel.node_name',
@@ -107,6 +109,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
                                         multiline: true,
                                         maxLines: 3,
                                         onChange: onNodeDescriptionChange,
+                                        onSubmit: onNodeDescriptionSubmit,
+                                        disabled: disabled,
                                         error: nodeDescriptionError,
                                         "aria-label": _({
                                             id: "canvas.node_property_panel.node_description",

package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.types.d.ts

@@ -11,7 +11,9 @@ export interface NodePropertyPanelProps {
     nodeLabelPlaceholder?: string;
     nodeDescriptionPlaceholder?: string;
     onNodeLabelChange?: (label: string) => void;
+    onNodeLabelSubmit?: (label: string) => void;
     onNodeDescriptionChange?: (description: string) => void;
+    onNodeDescriptionSubmit?: (description: string) => void;
     nodeLabelError?: ReactNode;
     nodeDescriptionError?: ReactNode;
     action?: ReactNode;

package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NodePropertyPanel.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/NodePropertyPanel.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,WAAW,sBAAsB;IAKrC,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,eAAe,CAAC,EAAE,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,WAAW,CAAC,CAAC;IAEpE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B,0BAA0B,CAAC,EAAE,MAAM,CAAC;IAEpC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE5C,uBAAuB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAKxD,cAAc,CAAC,EAAE,SAAS,CAAC;IAE3B,oBAAoB,CAAC,EAAE,SAAS,CAAC;IAEjC,MAAM,CAAC,EAAE,SAAS,CAAC;IAMnB,MAAM,CAAC,EAAE,UAAU,CAAC;IAMpB,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IAOvB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAMlC,YAAY,CAAC,EAAE,MAAM,CAAC;IAKtB,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAE9C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAEnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAMnB,YAAY,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IAM5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAMnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAKtB,WAAW,CAAC,EAAE,SAAS,CAAC;IAQxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB"}
+{"version":3,"file":"NodePropertyPanel.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/NodePropertyPanel.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,WAAW,sBAAsB;IAKrC,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,eAAe,CAAC,EAAE,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,WAAW,CAAC,CAAC;IAEpE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B,0BAA0B,CAAC,EAAE,MAAM,CAAC;IAEpC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE5C,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE5C,uBAAuB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAExD,uBAAuB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAKxD,cAAc,CAAC,EAAE,SAAS,CAAC;IAE3B,oBAAoB,CAAC,EAAE,SAAS,CAAC;IAEjC,MAAM,CAAC,EAAE,SAAS,CAAC;IAMnB,MAAM,CAAC,EAAE,UAAU,CAAC;IAMpB,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IAOvB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAMlC,YAAY,CAAC,EAAE,MAAM,CAAC;IAKtB,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAE9C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAEnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAMnB,YAAY,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IAM5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAMnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAKtB,WAAW,CAAC,EAAE,SAAS,CAAC;IAQxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB"}