@neoptocom/neopto-ui 1.4.0 → 1.4.2

package/dist/index.cjs

@@ -1300,13 +1300,14 @@ var AgentButton = ({
       className: `flex justify-end items-center fixed bottom-3 right-8 z-40 h-24 transition-all duration-1000 ease-in-out ${delayedHasNotification ? "w-[432px]" : "w-24"} ${isMounted ? "opacity-100" : "opacity-0"}`,
       style: {
         filter: disabled ? "grayscale(100%)" : "grayscale(0%)",
-        transition: "filter 1s ease-in-out"
+        opacity: disabled ? 0.3 : 1,
+        transition: "filter 0.5s ease-in-out, opacity 0.5s ease-in-out"
       },
       children: [
         circleAnimations.map((circle, index) => /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
-            className: `absolute ${circle.style} h-20 min-w-20 w-20 overflow-visible flex justify-between transition-opacity duration-1000 ease-in-out`,
+            className: `absolute ${circle.style} h-20 min-w-20 w-20 overflow-visible flex justify-between transition-opacity duration-500 ease-in-out`,
             style: { opacity: disabled ? 0 : 1 },
             children: /* @__PURE__ */ jsxRuntime.jsx(
               AnimatedBgCircle_default,
@@ -1325,7 +1326,7 @@ var AgentButton = ({
             className: `absolute ${rect.style} h-20 transition-all ease-in-out ${delayedHasNotification ? "w-[324px] px-0" : "w-20 px-10"} overflow-visible flex justify-between`,
             style: {
               opacity: disabled ? 0 : delayedHasNotification ? 1 : 0,
-              transitionDuration: "1s"
+              transitionDuration: "0.5s"
             },
             children: /* @__PURE__ */ jsxRuntime.jsx(AnimatedBgRectangle_default, { colors: animationColors, delay: rect.delay })
           },
@@ -1336,7 +1337,7 @@ var AgentButton = ({
           {
             onClick: onOpenChat,
             disabled,
-            className: `flex flex-row-reverse items-center gap-1.5 fixed p-3 rounded-full shadow-md h-16 mr-4 transition-all duration-600 ease-in-out border-2 border-[var(--border)] ${delayedHasNotification ? "w-[400px]" : "w-16"} ${disabled ? "cursor-not-allowed" : "cursor-pointer"}`,
+            className: `flex flex-row-reverse items-center gap-1.5 fixed p-3 rounded-full shadow-md h-16 mr-4 transition-all duration-600 ease-in-out border-2 border-[var(--border)] ${delayedHasNotification ? "w-[400px]" : "w-16"} ${disabled ? "cursor-default" : "cursor-pointer"}`,
             style: {
               background: "var(--chat-button-gradient)"
             },

package/dist/index.js

@@ -1279,13 +1279,14 @@ var AgentButton = ({
       className: `flex justify-end items-center fixed bottom-3 right-8 z-40 h-24 transition-all duration-1000 ease-in-out ${delayedHasNotification ? "w-[432px]" : "w-24"} ${isMounted ? "opacity-100" : "opacity-0"}`,
       style: {
         filter: disabled ? "grayscale(100%)" : "grayscale(0%)",
-        transition: "filter 1s ease-in-out"
+        opacity: disabled ? 0.3 : 1,
+        transition: "filter 0.5s ease-in-out, opacity 0.5s ease-in-out"
       },
       children: [
         circleAnimations.map((circle, index) => /* @__PURE__ */ jsx(
           "div",
           {
-            className: `absolute ${circle.style} h-20 min-w-20 w-20 overflow-visible flex justify-between transition-opacity duration-1000 ease-in-out`,
+            className: `absolute ${circle.style} h-20 min-w-20 w-20 overflow-visible flex justify-between transition-opacity duration-500 ease-in-out`,
             style: { opacity: disabled ? 0 : 1 },
             children: /* @__PURE__ */ jsx(
               AnimatedBgCircle_default,
@@ -1304,7 +1305,7 @@ var AgentButton = ({
             className: `absolute ${rect.style} h-20 transition-all ease-in-out ${delayedHasNotification ? "w-[324px] px-0" : "w-20 px-10"} overflow-visible flex justify-between`,
             style: {
               opacity: disabled ? 0 : delayedHasNotification ? 1 : 0,
-              transitionDuration: "1s"
+              transitionDuration: "0.5s"
             },
             children: /* @__PURE__ */ jsx(AnimatedBgRectangle_default, { colors: animationColors, delay: rect.delay })
           },
@@ -1315,7 +1316,7 @@ var AgentButton = ({
           {
             onClick: onOpenChat,
             disabled,
-            className: `flex flex-row-reverse items-center gap-1.5 fixed p-3 rounded-full shadow-md h-16 mr-4 transition-all duration-600 ease-in-out border-2 border-[var(--border)] ${delayedHasNotification ? "w-[400px]" : "w-16"} ${disabled ? "cursor-not-allowed" : "cursor-pointer"}`,
+            className: `flex flex-row-reverse items-center gap-1.5 fixed p-3 rounded-full shadow-md h-16 mr-4 transition-all duration-600 ease-in-out border-2 border-[var(--border)] ${delayedHasNotification ? "w-[400px]" : "w-16"} ${disabled ? "cursor-default" : "cursor-pointer"}`,
             style: {
               background: "var(--chat-button-gradient)"
             },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neoptocom/neopto-ui",
-  "version": "1.4.0",
+  "version": "1.4.2",
   "private": false,
   "description": "A modern React component library built with Tailwind CSS v4 and TypeScript. Features dark mode, design tokens, and comprehensive Storybook documentation. Requires Tailwind v4+.",
   "keywords": [

package/src/components/Chat/AgentButton.tsx

@@ -76,13 +76,14 @@ const AgentButton = ({
       } ${isMounted ? "opacity-100" : "opacity-0"}`}
       style={{
         filter: disabled ? "grayscale(100%)" : "grayscale(0%)",
-        transition: "filter 1s ease-in-out",
+        opacity: disabled ? 0.3 : 1,
+        transition: "filter 0.5s ease-in-out, opacity 0.5s ease-in-out",
       }}
     >
       {circleAnimations.map((circle, index) => (
         <div
           key={`circle-${index}`}
-          className={`absolute ${circle.style} h-20 min-w-20 w-20 overflow-visible flex justify-between transition-opacity duration-1000 ease-in-out`}
+          className={`absolute ${circle.style} h-20 min-w-20 w-20 overflow-visible flex justify-between transition-opacity duration-500 ease-in-out`}
           style={{ opacity: disabled ? 0 : 1 }}
         >
           <AnimatedBgCircle
@@ -102,7 +103,7 @@ const AgentButton = ({
           } overflow-visible flex justify-between`}
           style={{
             opacity: disabled ? 0 : delayedHasNotification ? 1 : 0,
-            transitionDuration: "1s",
+            transitionDuration: "0.5s",
           }}
         >
           <AnimatedBgRectangle colors={animationColors} delay={rect.delay} />
@@ -114,7 +115,7 @@ const AgentButton = ({
           disabled={disabled}
           className={`flex flex-row-reverse items-center gap-1.5 fixed p-3 rounded-full shadow-md h-16 mr-4 transition-all duration-600 ease-in-out border-2 border-[var(--border)] ${
             delayedHasNotification ? "w-[400px]" : "w-16"
-          } ${disabled ? "cursor-not-allowed" : "cursor-pointer"}`}
+          } ${disabled ? "cursor-default" : "cursor-pointer"}`}
           style={{
             background: "var(--chat-button-gradient)",
           }}