@topconsultnpm/sdkui-react 6.20.0-dev1.82 → 6.20.0-dev1.83

package/lib/components/features/assistant/ToppySpeechBubble.js

@@ -1,117 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { forwardRef } from 'react';
-import styled from 'styled-components';
-import { SDKUI_Localizator } from '../../../helper';
-import { IconWindowMinimize } from '../../../helper/TMIcons';
-// Styled component
-const Bubble = styled.div `
-  position: absolute;
-  bottom: 145px;
-  ${({ $align }) => ($align === 'left' ? 'left: 0px;' : 'right: 0px;')}
-  width: max-content;
-  padding: 10px;
-  background: linear-gradient(180deg, rgba(0, 113, 188, 0.45) 0%,rgba(27, 20, 100, 0.65) 100%);
-  border-radius: 18px;
-  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
-  font-size: 14px;
-  line-height: 1.4;
-  color: #333;
-  z-index: 10000;
-
-  &::after {
-    transform: ${({ $align }) => ($align === 'left' ? 'skewX(15deg)' : 'skewX(-15deg)')};
-    content: "";
-    position: absolute;
-    top: 100%;
-    ${({ $align }) => ($align === 'left' ? 'left: 20px;' : 'right: 15px;')}
-    border-width: 32px 32px 0 0;
-    border-style: solid;
-    border-color: #FFFFFF transparent; 
-    display: block;
-    width: 0;
-    height: 0;
-    z-index: 1;
-  }
-  
-  &::before {
-    transform: ${({ $align }) => ($align === 'left' ? 'skewX(15deg)' : 'skewX(-15deg)')};
-    content: "";
-    position: absolute;
-    top: 100%;
-    ${({ $align }) => ($align === 'left' ? 'left: 20px;' : 'right: 15px;')}
-    border-width: 32px 32px 0 0;
-    border-style: solid;
-    border-color: rgba(27, 20, 100, 0.65) transparent; 
-    display: block;
-    width: 0;
-    height: 0;
-    z-index: 2;
-  }
-`;
-const CloseButton = styled.button `
-  position: absolute;
-  top: -8px;
-  right: -8px;
-  width: 24px;
-  height: 24px;
-  border-radius: 50%;
-  border: 2px solid rgba(255, 255, 255, 0.9);
-  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4), 0 0 20px rgba(118, 75, 162, 0.2);
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
-  z-index: 10001;
-  color: white;
-  font-size: 14px;
-  
-  &:hover {
-    background: linear-gradient(135deg, #764ba2 0%, #f093fb 100%);
-    box-shadow: 0 6px 20px rgba(118, 75, 162, 0.6), 0 0 30px rgba(240, 147, 251, 0.4);
-    border-color: rgba(255, 255, 255, 1);
-  }
-  
-  &:active {
-    transform: scale(0.95);
-    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4);
-  }
-  
-  &:focus {
-    outline: none;
-    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4), 0 0 0 3px rgba(102, 126, 234, 0.2);
-  }
-`;
-// Componente con forwardRef
-const ToppySpeechBubble = forwardRef(({ align = 'right', children, className, onClose }, ref) => {
-    const isDraggingRef = React.useRef(false);
-    const mouseDownPosRef = React.useRef(null);
-    const handleMouseDown = (e) => {
-        isDraggingRef.current = false;
-        mouseDownPosRef.current = { x: e.clientX, y: e.clientY };
-    };
-    const handleMouseMove = (e) => {
-        if (!mouseDownPosRef.current)
-            return;
-        const deltaX = Math.abs(e.clientX - mouseDownPosRef.current.x);
-        const deltaY = Math.abs(e.clientY - mouseDownPosRef.current.y);
-        // Considera drag solo se il movimento supera 3px
-        if (deltaX > 3 || deltaY > 3) {
-            isDraggingRef.current = true;
-        }
-    };
-    const handleClick = (e) => {
-        if (isDraggingRef.current) {
-            e.stopPropagation();
-            e.preventDefault();
-            return;
-        }
-        onClose?.();
-    };
-    const handleMouseUp = () => {
-        mouseDownPosRef.current = null;
-    };
-    return (_jsxs(Bubble, { ref: ref, "$align": align, className: className, children: [onClose && (_jsx(CloseButton, { onMouseDown: handleMouseDown, onMouseMove: handleMouseMove, onMouseUp: handleMouseUp, onClick: handleClick, "aria-label": SDKUI_Localizator.Minimize, title: SDKUI_Localizator.Minimize, type: "button", children: _jsx(IconWindowMinimize, {}) })), children] }));
-});
-export default ToppySpeechBubble;