@uipath/apollo-react 4.13.1 → 4.14.0-pr593.59e5bb0

package/dist/canvas/components/Edges/SequenceEdge.cjs

@@ -88,6 +88,8 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ (0, external_react_namespaceObje
     const status = executionStatus ? executionStatus?.status ?? executionStatus : validationStatus;
     const isDiffAdded = data?.isDiffAdded === true;
     const isDiffRemoved = data?.isDiffRemoved === true;
+    const hideArrowHead = data?.hideArrowHead === true;
+    const hideToolbar = data?.hideToolbar === true;
     const angle = ANGLE_MAP[targetPosition];
     const { x: offsetX, y: offsetY } = ARROW_OFFSETS[targetPosition];
     const { edgePath, labelX, labelY } = (0, index_cjs_namespaceObject.useEdgePath)({
@@ -98,8 +100,8 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ (0, external_react_namespaceObje
         sourceX,
         sourceY,
         sourcePosition,
-        targetX,
-        targetY,
+        targetX: hideArrowHead ? targetX + offsetX : targetX,
+        targetY: hideArrowHead ? targetY + offsetY : targetY,
         targetPosition
     });
     const { showToolbar, toolbarPositioning, config: toolbarConfig, handleMouseMoveOnPath } = (0, external_Toolbar_index_cjs_namespaceObject.useEdgeToolbarState)({
@@ -166,12 +168,12 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ (0, external_react_namespaceObje
                         },
                         ref: pathElementRef
                     }),
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("polygon", {
+                    !hideArrowHead && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("polygon", {
                         points: `
-            ${targetX},${targetY}
-            ${targetX - ARROW_SIZE * Math.cos(angle - Math.PI / 6)},${targetY - ARROW_SIZE * Math.sin(angle - Math.PI / 6)}
-            ${targetX - ARROW_SIZE * Math.cos(angle + Math.PI / 6)},${targetY - ARROW_SIZE * Math.sin(angle + Math.PI / 6)}
-          `,
+              ${targetX},${targetY}
+              ${targetX - ARROW_SIZE * Math.cos(angle - Math.PI / 6)},${targetY - ARROW_SIZE * Math.sin(angle - Math.PI / 6)}
+              ${targetX - ARROW_SIZE * Math.cos(angle + Math.PI / 6)},${targetY - ARROW_SIZE * Math.sin(angle + Math.PI / 6)}
+            `,
                         fill: edgeColor,
                         style: {
                             pointerEvents: 'none',
@@ -211,7 +213,7 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ (0, external_react_namespaceObje
                     })
                 ]
             }),
-            showToolbar && toolbarPositioning && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_Toolbar_index_cjs_namespaceObject.EdgeToolbar, {
+            !hideToolbar && showToolbar && toolbarPositioning && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_Toolbar_index_cjs_namespaceObject.EdgeToolbar, {
                 edgeId: id,
                 visible: showToolbar,
                 positioning: toolbarPositioning,

package/dist/canvas/components/Edges/SequenceEdge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SequenceEdge.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Edges/SequenceEdge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAY,MAAM,0CAA0C,CAAC;AAoDpF,eAAO,MAAM,YAAY,iDAuMJ,CAAC"}
+{"version":3,"file":"SequenceEdge.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Edges/SequenceEdge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAY,MAAM,0CAA0C,CAAC;AAoDpF,eAAO,MAAM,YAAY,iDA+MJ,CAAC"}

package/dist/canvas/components/Edges/SequenceEdge.js

@@ -60,6 +60,8 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ memo(function({ id, selected, so
     const status = executionStatus ? executionStatus?.status ?? executionStatus : validationStatus;
     const isDiffAdded = data?.isDiffAdded === true;
     const isDiffRemoved = data?.isDiffRemoved === true;
+    const hideArrowHead = data?.hideArrowHead === true;
+    const hideToolbar = data?.hideToolbar === true;
     const angle = ANGLE_MAP[targetPosition];
     const { x: offsetX, y: offsetY } = ARROW_OFFSETS[targetPosition];
     const { edgePath, labelX, labelY } = useEdgePath({
@@ -70,8 +72,8 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ memo(function({ id, selected, so
         sourceX,
         sourceY,
         sourcePosition,
-        targetX,
-        targetY,
+        targetX: hideArrowHead ? targetX + offsetX : targetX,
+        targetY: hideArrowHead ? targetY + offsetY : targetY,
         targetPosition
     });
     const { showToolbar, toolbarPositioning, config: toolbarConfig, handleMouseMoveOnPath } = useEdgeToolbarState({
@@ -138,12 +140,12 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ memo(function({ id, selected, so
                         },
                         ref: pathElementRef
                     }),
-                    /*#__PURE__*/ jsx("polygon", {
+                    !hideArrowHead && /*#__PURE__*/ jsx("polygon", {
                         points: `
-            ${targetX},${targetY}
-            ${targetX - ARROW_SIZE * Math.cos(angle - Math.PI / 6)},${targetY - ARROW_SIZE * Math.sin(angle - Math.PI / 6)}
-            ${targetX - ARROW_SIZE * Math.cos(angle + Math.PI / 6)},${targetY - ARROW_SIZE * Math.sin(angle + Math.PI / 6)}
-          `,
+              ${targetX},${targetY}
+              ${targetX - ARROW_SIZE * Math.cos(angle - Math.PI / 6)},${targetY - ARROW_SIZE * Math.sin(angle - Math.PI / 6)}
+              ${targetX - ARROW_SIZE * Math.cos(angle + Math.PI / 6)},${targetY - ARROW_SIZE * Math.sin(angle + Math.PI / 6)}
+            `,
                         fill: edgeColor,
                         style: {
                             pointerEvents: 'none',
@@ -183,7 +185,7 @@ const SequenceEdge_SequenceEdge = /*#__PURE__*/ memo(function({ id, selected, so
                     })
                 ]
             }),
-            showToolbar && toolbarPositioning && /*#__PURE__*/ jsx(EdgeToolbar, {
+            !hideToolbar && showToolbar && toolbarPositioning && /*#__PURE__*/ jsx(EdgeToolbar, {
                 edgeId: id,
                 visible: showToolbar,
                 positioning: toolbarPositioning,

package/dist/material/components/ap-chat/components/common/action-button.cjs

@@ -65,13 +65,9 @@ const StyledButtonContainer = (0, material_namespaceObject.styled)('div')(()=>({
             }
         }
     }));
-const AutopilotChatActionButtonComponent = /*#__PURE__*/ external_react_default().forwardRef(({ iconName, disabled, iconSize, preventHover, overrideColor, variant = 'outlined', text, tooltip, tooltipPlacement = 'bottom', ariaLabel, ariaDescribedby, title, tabIndex, onMouseEnter, onMouseLeave, onFocus, onBlur, onMouseDown, onMouseUp, onKeyDown, disableInteractiveTooltip = false, 'data-testid': dataTestId, ...props }, ref)=>{
+const AutopilotChatActionButtonComponent = /*#__PURE__*/ external_react_default().forwardRef(({ iconName, disabled, iconSize, preventHover, overrideColor, variant = 'outlined', text, tooltip, tooltipPlacement = 'bottom', ariaLabel, ariaDescribedby, ariaPressed, title, tabIndex, onClick, onMouseEnter, onMouseLeave, onFocus, onBlur, onMouseDown, onMouseUp, onKeyDown, disableInteractiveTooltip = false, 'data-testid': dataTestId }, ref)=>{
     const [iconColor, setIconColor] = external_react_default().useState('var(--color-icon-default)');
     const { chatMode } = (0, chat_state_provider_cjs_namespaceObject.useChatState)();
-    const [isPressed, setIsPressed] = external_react_default().useState(false);
-    const onClick = 'onClick' in props ? props.onClick : ()=>{};
-    const onPress = 'onPress' in props ? props.onPress : ()=>{};
-    const onRelease = 'onRelease' in props ? props.onRelease : ()=>{};
     const showTooltip = tooltip && chatMode !== index_cjs_namespaceObject.AutopilotChatMode.Closed && !disabled;
     const button = text ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(StyledButtonContainer, {
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(material_namespaceObject.Button, {
@@ -82,10 +78,6 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ external_react_default(
             },
             onMouseLeave: (event)=>{
                 onMouseLeave?.(event);
-                if (isPressed) {
-                    setIsPressed(false);
-                    onRelease(event);
-                }
                 if (!preventHover) setIconColor('var(--color-icon-default)');
             },
             startIcon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_index_cjs_namespaceObject.ApIcon, {
@@ -96,6 +88,7 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ external_react_default(
             }),
             "aria-label": ariaLabel,
             "aria-describedby": ariaDescribedby,
+            "aria-pressed": ariaPressed,
             title: showTooltip ? void 0 : title,
             variant: "text",
             size: "small",
@@ -103,16 +96,8 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ external_react_default(
             onClick: onClick,
             onFocus: onFocus,
             onBlur: onBlur,
-            onMouseDown: (event)=>{
-                onMouseDown?.(event);
-                setIsPressed(true);
-                onPress(event);
-            },
-            onMouseUp: (event)=>{
-                onMouseUp?.(event);
-                setIsPressed(false);
-                onRelease(event);
-            },
+            onMouseDown: onMouseDown,
+            onMouseUp: onMouseUp,
             tabIndex: tabIndex,
             onKeyDown: onKeyDown,
             "data-testid": dataTestId,
@@ -125,20 +110,13 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ external_react_default(
         onClick: onClick,
         onFocus: onFocus,
         onBlur: onBlur,
-        onMouseDown: (event)=>{
-            onMouseDown?.(event);
-            setIsPressed(true);
-            onPress(event);
-        },
-        onMouseUp: (event)=>{
-            onMouseUp?.(event);
-            setIsPressed(false);
-            onRelease(event);
-        },
+        onMouseDown: onMouseDown,
+        onMouseUp: onMouseUp,
         tabIndex: tabIndex,
         onKeyDown: onKeyDown,
         "aria-label": ariaLabel,
         "aria-describedby": ariaDescribedby,
+        "aria-pressed": ariaPressed,
         title: showTooltip ? void 0 : title,
         onMouseEnter: (event)=>{
             onMouseEnter?.(event);
@@ -146,10 +124,6 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ external_react_default(
         },
         onMouseLeave: (event)=>{
             onMouseLeave?.(event);
-            if (isPressed) {
-                setIsPressed(false);
-                onRelease(event);
-            }
             if (!preventHover) setIconColor('var(--color-icon-default)');
         },
         "data-testid": dataTestId,

package/dist/material/components/ap-chat/components/common/action-button.d.ts

@@ -1,7 +1,6 @@
 import { type TooltipProps } from '@mui/material';
 import React from 'react';
-type AutopilotChatActionButtonProps = AutopilotChatActionButtonBaseProps & (AutopilotChatActionButtonClickProps | AutopilotChatActionButtonPressProps);
-interface AutopilotChatActionButtonBaseProps {
+interface AutopilotChatActionButtonProps {
     iconName: string;
     iconSize?: string;
     disabled?: boolean;
@@ -13,9 +12,11 @@ interface AutopilotChatActionButtonBaseProps {
     tooltipPlacement?: TooltipProps['placement'];
     ariaLabel?: string;
     ariaDescribedby?: string;
+    ariaPressed?: boolean;
     title?: string;
     tabIndex?: number;
     disableInteractiveTooltip?: boolean;
+    onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
     onFocus?: (event: React.FocusEvent<HTMLButtonElement>) => void;
     onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;
     onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;
@@ -25,13 +26,6 @@ interface AutopilotChatActionButtonBaseProps {
     onMouseLeave?: (event: React.MouseEvent<HTMLElement>) => void;
     'data-testid'?: string;
 }
-interface AutopilotChatActionButtonClickProps {
-    onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
-}
-interface AutopilotChatActionButtonPressProps {
-    onPress: (event: React.MouseEvent<HTMLButtonElement>) => void;
-    onRelease: (event: React.MouseEvent<HTMLButtonElement>) => void;
-}
 export declare const AutopilotChatActionButton: React.NamedExoticComponent<AutopilotChatActionButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export {};
 //# sourceMappingURL=action-button.d.ts.map

package/dist/material/components/ap-chat/components/common/action-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"action-button.d.ts","sourceRoot":"","sources":["../../../../../../src/material/components/ap-chat/components/common/action-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAGlE,OAAO,KAAK,MAAM,OAAO,CAAC;AA4B1B,KAAK,8BAA8B,GAAG,kCAAkC,GACtE,CAAC,mCAAmC,GAAG,mCAAmC,CAAC,CAAC;AAE9E,UAAU,kCAAkC;IAC1C,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC3C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,gBAAgB,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC/D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC9D,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACnE,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACjE,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACpE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC9D,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC9D,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,mCAAmC;IAC3C,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CAC/D;AAED,UAAU,mCAAmC;IAC3C,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC9D,SAAS,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CACjE;AAwKD,eAAO,MAAM,yBAAyB,qGAAiD,CAAC"}
+{"version":3,"file":"action-button.d.ts","sourceRoot":"","sources":["../../../../../../src/material/components/ap-chat/components/common/action-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAGlE,OAAO,KAAK,MAAM,OAAO,CAAC;AAyB1B,UAAU,8BAA8B;IACtC,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC3C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,gBAAgB,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC9D,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC/D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC9D,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACnE,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACjE,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACpE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC9D,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC9D,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AA0ID,eAAO,MAAM,yBAAyB,qGAAiD,CAAC"}

package/dist/material/components/ap-chat/components/common/action-button.js

@@ -26,13 +26,9 @@ const StyledButtonContainer = styled('div')(()=>({
             }
         }
     }));
-const AutopilotChatActionButtonComponent = /*#__PURE__*/ react.forwardRef(({ iconName, disabled, iconSize, preventHover, overrideColor, variant = 'outlined', text, tooltip, tooltipPlacement = 'bottom', ariaLabel, ariaDescribedby, title, tabIndex, onMouseEnter, onMouseLeave, onFocus, onBlur, onMouseDown, onMouseUp, onKeyDown, disableInteractiveTooltip = false, 'data-testid': dataTestId, ...props }, ref)=>{
+const AutopilotChatActionButtonComponent = /*#__PURE__*/ react.forwardRef(({ iconName, disabled, iconSize, preventHover, overrideColor, variant = 'outlined', text, tooltip, tooltipPlacement = 'bottom', ariaLabel, ariaDescribedby, ariaPressed, title, tabIndex, onClick, onMouseEnter, onMouseLeave, onFocus, onBlur, onMouseDown, onMouseUp, onKeyDown, disableInteractiveTooltip = false, 'data-testid': dataTestId }, ref)=>{
     const [iconColor, setIconColor] = react.useState('var(--color-icon-default)');
     const { chatMode } = useChatState();
-    const [isPressed, setIsPressed] = react.useState(false);
-    const onClick = 'onClick' in props ? props.onClick : ()=>{};
-    const onPress = 'onPress' in props ? props.onPress : ()=>{};
-    const onRelease = 'onRelease' in props ? props.onRelease : ()=>{};
     const showTooltip = tooltip && chatMode !== AutopilotChatMode.Closed && !disabled;
     const button = text ? /*#__PURE__*/ jsx(StyledButtonContainer, {
         children: /*#__PURE__*/ jsx(Button, {
@@ -43,10 +39,6 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ react.forwardRef(({ ico
             },
             onMouseLeave: (event)=>{
                 onMouseLeave?.(event);
-                if (isPressed) {
-                    setIsPressed(false);
-                    onRelease(event);
-                }
                 if (!preventHover) setIconColor('var(--color-icon-default)');
             },
             startIcon: /*#__PURE__*/ jsx(ApIcon, {
@@ -57,6 +49,7 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ react.forwardRef(({ ico
             }),
             "aria-label": ariaLabel,
             "aria-describedby": ariaDescribedby,
+            "aria-pressed": ariaPressed,
             title: showTooltip ? void 0 : title,
             variant: "text",
             size: "small",
@@ -64,16 +57,8 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ react.forwardRef(({ ico
             onClick: onClick,
             onFocus: onFocus,
             onBlur: onBlur,
-            onMouseDown: (event)=>{
-                onMouseDown?.(event);
-                setIsPressed(true);
-                onPress(event);
-            },
-            onMouseUp: (event)=>{
-                onMouseUp?.(event);
-                setIsPressed(false);
-                onRelease(event);
-            },
+            onMouseDown: onMouseDown,
+            onMouseUp: onMouseUp,
             tabIndex: tabIndex,
             onKeyDown: onKeyDown,
             "data-testid": dataTestId,
@@ -86,20 +71,13 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ react.forwardRef(({ ico
         onClick: onClick,
         onFocus: onFocus,
         onBlur: onBlur,
-        onMouseDown: (event)=>{
-            onMouseDown?.(event);
-            setIsPressed(true);
-            onPress(event);
-        },
-        onMouseUp: (event)=>{
-            onMouseUp?.(event);
-            setIsPressed(false);
-            onRelease(event);
-        },
+        onMouseDown: onMouseDown,
+        onMouseUp: onMouseUp,
         tabIndex: tabIndex,
         onKeyDown: onKeyDown,
         "aria-label": ariaLabel,
         "aria-describedby": ariaDescribedby,
+        "aria-pressed": ariaPressed,
         title: showTooltip ? void 0 : title,
         onMouseEnter: (event)=>{
             onMouseEnter?.(event);
@@ -107,10 +85,6 @@ const AutopilotChatActionButtonComponent = /*#__PURE__*/ react.forwardRef(({ ico
         },
         onMouseLeave: (event)=>{
             onMouseLeave?.(event);
-            if (isPressed) {
-                setIsPressed(false);
-                onRelease(event);
-            }
             if (!preventHover) setIconColor('var(--color-icon-default)');
         },
         "data-testid": dataTestId,

package/dist/material/components/ap-chat/components/input/always-on-voice-button.cjs

@@ -0,0 +1,183 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.n = (module)=>{
+        var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
+        __webpack_require__.d(getter, {
+            a: getter
+        });
+        return getter;
+    };
+})();
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    AlwaysOnVoiceButton: ()=>AlwaysOnVoiceButton,
+    VoiceButtonContainer: ()=>VoiceButtonContainer
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const react_namespaceObject = require("@lingui/react");
+const material_namespaceObject = require("@mui/material");
+const apollo_core_namespaceObject = require("@uipath/apollo-core");
+var apollo_core_default = /*#__PURE__*/ __webpack_require__.n(apollo_core_namespaceObject);
+const external_react_namespaceObject = require("react");
+const chat_service_provider_cjs_namespaceObject = require("../../providers/chat-service.provider.cjs");
+const index_cjs_namespaceObject = require("../../service/index.cjs");
+const chat_audio_input_cjs_namespaceObject = require("../audio/chat-audio-input.cjs");
+const chat_audio_output_cjs_namespaceObject = require("../audio/chat-audio-output.cjs");
+const action_button_cjs_namespaceObject = require("../common/action-button.cjs");
+const VoiceButtonContainer = (0, material_namespaceObject.styled)('div', {
+    shouldForwardProp: (prop)=>'active' !== prop
+})(({ active })=>({
+        '& .MuiIconButton-root': {
+            borderRadius: apollo_core_default().Border.BorderRadiusM,
+            ...active && {
+                backgroundColor: "var(--color-foreground) !important",
+                '&:hover, &:active, &:focus': {
+                    backgroundColor: "var(--color-foreground-de-emp) !important"
+                }
+            }
+        }
+    }));
+const AlwaysOnVoiceButton = ({ disabled = false, onActiveChange })=>{
+    const { _ } = (0, react_namespaceObject.useLingui)();
+    const [isActive, setIsActive] = (0, external_react_namespaceObject.useState)(false);
+    const chatService = (0, chat_service_provider_cjs_namespaceObject.useChatService)();
+    const isActiveRef = (0, external_react_namespaceObject.useRef)(false);
+    const onActiveChangeRef = (0, external_react_namespaceObject.useRef)(onActiveChange);
+    onActiveChangeRef.current = onActiveChange;
+    const { queueOutputAudio, clearOutputAudioQueue } = (0, chat_audio_output_cjs_namespaceObject.useAudioOutput)();
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!chatService) return;
+        return chatService.on(index_cjs_namespaceObject.AutopilotChatEvent.OutputStream, (event)=>{
+            if (!isActiveRef.current) return;
+            if (event.mediaChunks) {
+                for (const chunk of event.mediaChunks)if (chunk.mimeType.startsWith('audio/pcm;')) queueOutputAudio(chunk.mimeType, chunk.data, chunk.sequenceNumber);
+            }
+            if (event.interrupted) clearOutputAudioQueue();
+        });
+    }, [
+        chatService,
+        queueOutputAudio,
+        clearOutputAudioQueue
+    ]);
+    const handleAudioInputStart = (0, external_react_namespaceObject.useCallback)((automaticActivityDetectionEnabled)=>{
+        if (!chatService) return;
+        isActiveRef.current = true;
+        setIsActive(true);
+        onActiveChangeRef.current?.(true);
+        chatService.sendInputStreamEvent({
+            activityStart: {
+                automaticActivityDetectionEnabled
+            }
+        });
+    }, [
+        chatService
+    ]);
+    const handleAudioInputEnd = (0, external_react_namespaceObject.useCallback)((sequenceNumber)=>{
+        if (!chatService) return;
+        isActiveRef.current = false;
+        setIsActive(false);
+        onActiveChangeRef.current?.(false);
+        clearOutputAudioQueue();
+        chatService.sendInputStreamEvent({
+            activityEnd: {
+                sequenceNumber
+            }
+        });
+    }, [
+        chatService,
+        clearOutputAudioQueue
+    ]);
+    const handleAudioInputData = (0, external_react_namespaceObject.useCallback)((mimeType, data, sequenceNumber)=>{
+        if (!chatService) return;
+        chatService.sendInputStreamEvent({
+            mediaChunks: [
+                {
+                    mimeType,
+                    data,
+                    sequenceNumber
+                }
+            ]
+        });
+    }, [
+        chatService
+    ]);
+    const { startAudioInput, stopAudioInput } = (0, chat_audio_input_cjs_namespaceObject.useAudioInput)({
+        handleAudioInputData,
+        handleAudioInputStart,
+        handleAudioInputEnd
+    });
+    (0, external_react_namespaceObject.useEffect)(()=>()=>{
+            if (isActiveRef.current) {
+                isActiveRef.current = false;
+                stopAudioInput();
+                clearOutputAudioQueue();
+                onActiveChangeRef.current?.(false);
+            }
+        }, [
+        stopAudioInput,
+        clearOutputAudioQueue
+    ]);
+    const handleClick = (0, external_react_namespaceObject.useCallback)(async ()=>{
+        if (disabled) return;
+        if (isActive) stopAudioInput();
+        else await startAudioInput(true);
+    }, [
+        disabled,
+        isActive,
+        startAudioInput,
+        stopAudioInput
+    ]);
+    const iconColor = disabled ? 'var(--color-foreground-disable)' : isActive ? 'var(--color-background)' : void 0;
+    const stopLabel = _({
+        id: 'autopilot-chat.input.actions.stop'
+    });
+    const voiceLabel = _({
+        id: 'autopilot-chat.input.actions.voice-interaction'
+    });
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(VoiceButtonContainer, {
+        active: isActive,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(action_button_cjs_namespaceObject.AutopilotChatActionButton, {
+            iconName: isActive ? 'stop' : 'graphic_eq',
+            tooltip: isActive ? stopLabel : voiceLabel,
+            overrideColor: iconColor,
+            preventHover: true,
+            disabled: disabled,
+            onClick: handleClick,
+            "data-testid": "autopilot-chat-always-on-voice-button",
+            ariaLabel: isActive ? stopLabel : voiceLabel,
+            ariaPressed: isActive
+        })
+    });
+};
+exports.AlwaysOnVoiceButton = __webpack_exports__.AlwaysOnVoiceButton;
+exports.VoiceButtonContainer = __webpack_exports__.VoiceButtonContainer;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "AlwaysOnVoiceButton",
+    "VoiceButtonContainer"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/material/components/ap-chat/components/input/always-on-voice-button.d.ts

@@ -0,0 +1,10 @@
+export declare const VoiceButtonContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
+    active?: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+interface AlwaysOnVoiceButtonProps {
+    disabled?: boolean;
+    onActiveChange?: (isActive: boolean) => void;
+}
+export declare const AlwaysOnVoiceButton: ({ disabled, onActiveChange, }: AlwaysOnVoiceButtonProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=always-on-voice-button.d.ts.map

package/dist/material/components/ap-chat/components/input/always-on-voice-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"always-on-voice-button.d.ts","sourceRoot":"","sources":["../../../../../../src/material/components/ap-chat/components/input/always-on-voice-button.tsx"],"names":[],"mappings":"AAiBA,eAAO,MAAM,oBAAoB;aAEnB,OAAO;yGAUlB,CAAC;AAEJ,UAAU,wBAAwB;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAOD,eAAO,MAAM,mBAAmB,GAAI,+BAGjC,wBAAwB,4CA4I1B,CAAC"}

package/dist/material/components/ap-chat/components/input/always-on-voice-button.js

@@ -0,0 +1,136 @@
+import { jsx } from "react/jsx-runtime";
+import { useLingui } from "@lingui/react";
+import { styled } from "@mui/material";
+import apollo_core from "@uipath/apollo-core";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { useChatService } from "../../providers/chat-service.provider.js";
+import { AutopilotChatEvent } from "../../service/index.js";
+import { useAudioInput } from "../audio/chat-audio-input.js";
+import { useAudioOutput } from "../audio/chat-audio-output.js";
+import { AutopilotChatActionButton } from "../common/action-button.js";
+const VoiceButtonContainer = styled('div', {
+    shouldForwardProp: (prop)=>'active' !== prop
+})(({ active })=>({
+        '& .MuiIconButton-root': {
+            borderRadius: apollo_core.Border.BorderRadiusM,
+            ...active && {
+                backgroundColor: "var(--color-foreground) !important",
+                '&:hover, &:active, &:focus': {
+                    backgroundColor: "var(--color-foreground-de-emp) !important"
+                }
+            }
+        }
+    }));
+const AlwaysOnVoiceButton = ({ disabled = false, onActiveChange })=>{
+    const { _ } = useLingui();
+    const [isActive, setIsActive] = useState(false);
+    const chatService = useChatService();
+    const isActiveRef = useRef(false);
+    const onActiveChangeRef = useRef(onActiveChange);
+    onActiveChangeRef.current = onActiveChange;
+    const { queueOutputAudio, clearOutputAudioQueue } = useAudioOutput();
+    useEffect(()=>{
+        if (!chatService) return;
+        return chatService.on(AutopilotChatEvent.OutputStream, (event)=>{
+            if (!isActiveRef.current) return;
+            if (event.mediaChunks) {
+                for (const chunk of event.mediaChunks)if (chunk.mimeType.startsWith('audio/pcm;')) queueOutputAudio(chunk.mimeType, chunk.data, chunk.sequenceNumber);
+            }
+            if (event.interrupted) clearOutputAudioQueue();
+        });
+    }, [
+        chatService,
+        queueOutputAudio,
+        clearOutputAudioQueue
+    ]);
+    const handleAudioInputStart = useCallback((automaticActivityDetectionEnabled)=>{
+        if (!chatService) return;
+        isActiveRef.current = true;
+        setIsActive(true);
+        onActiveChangeRef.current?.(true);
+        chatService.sendInputStreamEvent({
+            activityStart: {
+                automaticActivityDetectionEnabled
+            }
+        });
+    }, [
+        chatService
+    ]);
+    const handleAudioInputEnd = useCallback((sequenceNumber)=>{
+        if (!chatService) return;
+        isActiveRef.current = false;
+        setIsActive(false);
+        onActiveChangeRef.current?.(false);
+        clearOutputAudioQueue();
+        chatService.sendInputStreamEvent({
+            activityEnd: {
+                sequenceNumber
+            }
+        });
+    }, [
+        chatService,
+        clearOutputAudioQueue
+    ]);
+    const handleAudioInputData = useCallback((mimeType, data, sequenceNumber)=>{
+        if (!chatService) return;
+        chatService.sendInputStreamEvent({
+            mediaChunks: [
+                {
+                    mimeType,
+                    data,
+                    sequenceNumber
+                }
+            ]
+        });
+    }, [
+        chatService
+    ]);
+    const { startAudioInput, stopAudioInput } = useAudioInput({
+        handleAudioInputData,
+        handleAudioInputStart,
+        handleAudioInputEnd
+    });
+    useEffect(()=>()=>{
+            if (isActiveRef.current) {
+                isActiveRef.current = false;
+                stopAudioInput();
+                clearOutputAudioQueue();
+                onActiveChangeRef.current?.(false);
+            }
+        }, [
+        stopAudioInput,
+        clearOutputAudioQueue
+    ]);
+    const handleClick = useCallback(async ()=>{
+        if (disabled) return;
+        if (isActive) stopAudioInput();
+        else await startAudioInput(true);
+    }, [
+        disabled,
+        isActive,
+        startAudioInput,
+        stopAudioInput
+    ]);
+    const iconColor = disabled ? 'var(--color-foreground-disable)' : isActive ? 'var(--color-background)' : void 0;
+    const stopLabel = _({
+        id: 'autopilot-chat.input.actions.stop'
+    });
+    const voiceLabel = _({
+        id: 'autopilot-chat.input.actions.voice-interaction'
+    });
+    return /*#__PURE__*/ jsx(VoiceButtonContainer, {
+        active: isActive,
+        children: /*#__PURE__*/ jsx(AutopilotChatActionButton, {
+            iconName: isActive ? 'stop' : 'graphic_eq',
+            tooltip: isActive ? stopLabel : voiceLabel,
+            overrideColor: iconColor,
+            preventHover: true,
+            disabled: disabled,
+            onClick: handleClick,
+            "data-testid": "autopilot-chat-always-on-voice-button",
+            ariaLabel: isActive ? stopLabel : voiceLabel,
+            ariaPressed: isActive
+        })
+    });
+};
+export { AlwaysOnVoiceButton, VoiceButtonContainer };