@wix/ai-assistant-avatar 0.44.0 → 0.45.0

package/dist/cjs/Astro/Astro.js

@@ -11,6 +11,8 @@ var _DotTrail = require("./components/DotTrail");
 var _ariaAiAvatar = require("@wix/aria-ai-avatar");
 var _jsxFileName = "/home/builduser/work/4baef6c1cf3e5e6a/packages/ai-assistant-avatar/dist/cjs/Astro/Astro.tsx";
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+// Matches the `.astro` opacity transition in Astro.module.css.
+const AVATAR_REVEAL_DURATION = 80;
 const AiAssistantAvatar = exports.AiAssistantAvatar = /*#__PURE__*/(0, _react.forwardRef)(({
   mode,
   variant,
@@ -39,11 +41,39 @@ const AiAssistantAvatar = exports.AiAssistantAvatar = /*#__PURE__*/(0, _react.fo
     moveFromOffsetWithDots,
     moveToOffsetWithDots
   } = (0, _hooks.useDotAnimation)(setCenter, setAvatarHidden, AriaAvatar.setState, mode);
+  const revealRef = (0, _react.useRef)(null);
+  const cancelReveal = () => {
+    var _revealRef$current;
+    (_revealRef$current = revealRef.current) == null || _revealRef$current.cancel();
+    revealRef.current = null;
+  };
+
+  // The dots arrive on the compositor, so the avatar is revealed there too
+  // rather than when the main thread gets to `setAvatarHidden(false)`.
+  const scheduleReveal = () => {
+    cancelReveal();
+    const wrapper = wrapperRef.current;
+    if ((wrapper == null ? void 0 : wrapper.style.opacity) !== '0') {
+      return;
+    }
+    revealRef.current = wrapper.animate([{
+      opacity: 0
+    }, {
+      opacity: 1
+    }], {
+      delay: _config.TIMING.TRAVEL_DURATION,
+      duration: AVATAR_REVEAL_DURATION,
+      fill: 'forwards'
+    });
+  };
   const onTravelHomeFrom = async (x, y, options) => {
     const pos = {
       x,
       y
     };
+    if (typeof x === 'number' && typeof y === 'number') {
+      scheduleReveal();
+    }
     await moveFromOffsetWithDots(pos, options);
   };
   const onTravelAwayTo = async (x, y, options) => {
@@ -51,6 +81,7 @@ const AiAssistantAvatar = exports.AiAssistantAvatar = /*#__PURE__*/(0, _react.fo
       x,
       y
     };
+    cancelReveal();
     await moveToOffsetWithDots(pos, options);
   };
   const onMouseMove = (clientX, clientY) => {
@@ -83,6 +114,7 @@ const AiAssistantAvatar = exports.AiAssistantAvatar = /*#__PURE__*/(0, _react.fo
   const hideAvatar = ({
     withDots = false
   } = {}) => {
+    cancelReveal();
     setAvatarHidden(true);
     if (withDots) {
       hideDots();
@@ -155,7 +187,7 @@ const AiAssistantAvatar = exports.AiAssistantAvatar = /*#__PURE__*/(0, _react.fo
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 173,
+      lineNumber: 203,
       columnNumber: 7
     }
   }, /*#__PURE__*/_react.default.createElement(_DotTrail.DotTrail, {
@@ -164,7 +196,7 @@ const AiAssistantAvatar = exports.AiAssistantAvatar = /*#__PURE__*/(0, _react.fo
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 174,
+      lineNumber: 204,
       columnNumber: 9
     }
   }), /*#__PURE__*/_react.default.createElement("div", {
@@ -176,7 +208,7 @@ const AiAssistantAvatar = exports.AiAssistantAvatar = /*#__PURE__*/(0, _react.fo
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 176,
+      lineNumber: 206,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -187,14 +219,14 @@ const AiAssistantAvatar = exports.AiAssistantAvatar = /*#__PURE__*/(0, _react.fo
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 183,
+      lineNumber: 213,
       columnNumber: 11
     }
   }, /*#__PURE__*/_react.default.createElement(AriaAvatar.AriaAvatar, {
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 184,
+      lineNumber: 214,
       columnNumber: 13
     }
   }))));

package/dist/cjs/Astro/Astro.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_AstroModule","_interopRequireDefault","_config","_hooks","_DotTrail","_ariaAiAvatar","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","AiAssistantAvatar","exports","forwardRef","mode","variant","sleepTimeout","ref","wrapperRef","useRef","typingTimeout","isTyping","setIsTyping","useState","showBg","setShowBg","AriaAvatar","avatarHidden","setAvatarHidden","useAvatarSetup","setCenter","useMovement","ASTRO_SIZE","WIDTH","HEIGHT","leadDotRef","trailRefs","hideDots","moveFromOffsetWithDots","moveToOffsetWithDots","useDotAnimation","setState","onTravelHomeFrom","x","y","options","pos","onTravelAwayTo","onMouseMove","clientX","clientY","lookAt","onUserTyping","caretX","caretY","current","clearTimeout","setTimeout","err","console","error","useEffect","hideAvatar","withDots","showAvatar","useImperativeHandle","trigger","shrink","getState","AvatarState","SMALL","IDLE","smallLoader","SMALL_LOADER","pulse","Promise","resolve","idle","undo","fireEvent","AvatarEvent","UNDO_EVENT","boredom","SLEEPING","bigLoader","BIG_LOADER","ideaSpark","IDEA_SPARK","publish","PUBLISH_EVENT","wrapper","changeAstroColor","color","setAvatarColor","toggleAvatarBackground","hideBg","hide","show","createElement","className","s","avatar","__self","__source","fileName","lineNumber","columnNumber","DotTrail","astro","style","opacity","width","height"],"sources":["../../../src/Astro/Astro.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  Ref,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport s from './Astro.module.css';\nimport type { AstroRef, AstroProps, MoveOptions } from './types';\nimport { ASTRO_SIZE } from './config';\nimport { useAvatarSetup, useMovement, useDotAnimation } from './hooks';\nimport { DotTrail } from './components/DotTrail';\nimport { AvatarEvent, AvatarState } from '@wix/aria-ai-avatar';\n\nexport const AiAssistantAvatar = forwardRef<AstroRef, AstroProps>(\n  ({ mode, variant, sleepTimeout }, ref: Ref<AstroRef> | null) => {\n    const wrapperRef = useRef<HTMLDivElement | null>(null);\n    const typingTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    const [isTyping, setIsTyping] = useState(false);\n\n    const [showBg, setShowBg] = useState(false);\n\n    const { AriaAvatar, avatarHidden, setAvatarHidden } = useAvatarSetup({\n      mode,\n      variant,\n      sleepTimeout,\n    });\n\n    const { setCenter } = useMovement(\n      wrapperRef,\n      ASTRO_SIZE.WIDTH,\n      ASTRO_SIZE.HEIGHT,\n    );\n\n    const {\n      leadDotRef,\n      trailRefs,\n      hideDots,\n      moveFromOffsetWithDots,\n      moveToOffsetWithDots,\n    } = useDotAnimation(setCenter, setAvatarHidden, AriaAvatar.setState, mode);\n\n    const onTravelHomeFrom = async (\n      x: number,\n      y: number,\n      options?: MoveOptions,\n    ) => {\n      const pos = { x, y };\n      await moveFromOffsetWithDots(pos, options);\n    };\n\n    const onTravelAwayTo = async (\n      x: number,\n      y: number,\n      options?: MoveOptions,\n    ) => {\n      const pos = { x, y };\n      await moveToOffsetWithDots(pos, options);\n    };\n\n    const onMouseMove = (clientX: number, clientY: number) => {\n      if (isTyping) {\n        return;\n      }\n\n      AriaAvatar.lookAt(clientX, clientY);\n    };\n\n    const onUserTyping = (caretX: number, caretY: number) => {\n      try {\n        setIsTyping(true);\n        AriaAvatar.lookAt(caretX, caretY);\n\n        if (typingTimeout.current) {\n          clearTimeout(typingTimeout.current);\n        }\n\n        typingTimeout.current = setTimeout(() => {\n          setIsTyping(false);\n        }, 500);\n      } catch (err) {\n        console.error('[Astro] Error tracking typing:', err);\n      }\n    };\n\n    useEffect(() => {\n      return () => {\n        if (typingTimeout.current) {\n          clearTimeout(typingTimeout.current);\n        }\n      };\n    }, []);\n\n    const hideAvatar = ({ withDots = false }: { withDots?: boolean } = {}) => {\n      setAvatarHidden(true);\n\n      if (withDots) {\n        hideDots();\n      }\n    };\n\n    const showAvatar = () => {\n      setAvatarHidden(false);\n    };\n\n    useImperativeHandle(ref, () => ({\n      trigger: {\n        shrink: () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.SMALL);\n        },\n        smallLoader: () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL) {\n            return AriaAvatar.setState(AvatarState.SMALL_LOADER);\n          }\n          return AriaAvatar.setState(AvatarState.SMALL);\n        },\n        pulse: () => Promise.resolve(),\n        idle: async () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL_LOADER) {\n            await AriaAvatar.setState(AvatarState.SMALL);\n          }\n          return AriaAvatar.setState(AvatarState.IDLE);\n        },\n        undo: () => AriaAvatar.fireEvent(AvatarEvent.UNDO_EVENT),\n        boredom: () => {\n          if (AriaAvatar.getState() === AvatarState.SLEEPING) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.SLEEPING);\n        },\n        bigLoader: () => {\n          if (AriaAvatar.getState() === AvatarState.BIG_LOADER) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.BIG_LOADER);\n        },\n        ideaSpark: () => AriaAvatar.fireEvent(AvatarEvent.IDEA_SPARK),\n        publish: () => AriaAvatar.fireEvent(AvatarEvent.PUBLISH_EVENT),\n      },\n      avatarHidden,\n      wrapper: wrapperRef.current,\n      getState: AriaAvatar.getState,\n\n      onMouseMove,\n      onUserTyping,\n      onTravelHomeFrom,\n      onTravelAwayTo,\n\n      changeAstroColor: (color: string) => {\n        AriaAvatar.setAvatarColor(color);\n      },\n\n      toggleAvatarBackground: () => {\n        if (showBg) {\n          setShowBg(false);\n          AriaAvatar.hideBg();\n        } else {\n          setShowBg(true);\n          AriaAvatar.showBg();\n        }\n      },\n\n      hide: hideAvatar,\n      show: showAvatar,\n    }));\n\n    return (\n      <div className={s.avatar}>\n        <DotTrail leadDotRef={leadDotRef} trailRefs={trailRefs} />\n\n        <div\n          ref={wrapperRef}\n          className={s.astro}\n          style={{\n            opacity: avatarHidden ? 0 : 1,\n          }}\n        >\n          <div style={{ width: ASTRO_SIZE.WIDTH, height: ASTRO_SIZE.HEIGHT }}>\n            <AriaAvatar.AriaAvatar />\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_AstroModule","_interopRequireDefault","_config","_hooks","_DotTrail","_ariaAiAvatar","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","AVATAR_REVEAL_DURATION","AiAssistantAvatar","exports","forwardRef","mode","variant","sleepTimeout","ref","wrapperRef","useRef","typingTimeout","isTyping","setIsTyping","useState","showBg","setShowBg","AriaAvatar","avatarHidden","setAvatarHidden","useAvatarSetup","setCenter","useMovement","ASTRO_SIZE","WIDTH","HEIGHT","leadDotRef","trailRefs","hideDots","moveFromOffsetWithDots","moveToOffsetWithDots","useDotAnimation","setState","revealRef","cancelReveal","_revealRef$current","current","cancel","scheduleReveal","wrapper","style","opacity","animate","delay","TIMING","TRAVEL_DURATION","duration","fill","onTravelHomeFrom","x","y","options","pos","onTravelAwayTo","onMouseMove","clientX","clientY","lookAt","onUserTyping","caretX","caretY","clearTimeout","setTimeout","err","console","error","useEffect","hideAvatar","withDots","showAvatar","useImperativeHandle","trigger","shrink","getState","AvatarState","SMALL","IDLE","smallLoader","SMALL_LOADER","pulse","Promise","resolve","idle","undo","fireEvent","AvatarEvent","UNDO_EVENT","boredom","SLEEPING","bigLoader","BIG_LOADER","ideaSpark","IDEA_SPARK","publish","PUBLISH_EVENT","changeAstroColor","color","setAvatarColor","toggleAvatarBackground","hideBg","hide","show","createElement","className","s","avatar","__self","__source","fileName","lineNumber","columnNumber","DotTrail","astro","width","height"],"sources":["../../../src/Astro/Astro.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  Ref,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport s from './Astro.module.css';\nimport type { AstroRef, AstroProps, MoveOptions } from './types';\nimport { ASTRO_SIZE, TIMING } from './config';\n\n// Matches the `.astro` opacity transition in Astro.module.css.\nconst AVATAR_REVEAL_DURATION = 80;\nimport { useAvatarSetup, useMovement, useDotAnimation } from './hooks';\nimport { DotTrail } from './components/DotTrail';\nimport { AvatarEvent, AvatarState } from '@wix/aria-ai-avatar';\n\nexport const AiAssistantAvatar = forwardRef<AstroRef, AstroProps>(\n  ({ mode, variant, sleepTimeout }, ref: Ref<AstroRef> | null) => {\n    const wrapperRef = useRef<HTMLDivElement | null>(null);\n    const typingTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    const [isTyping, setIsTyping] = useState(false);\n\n    const [showBg, setShowBg] = useState(false);\n\n    const { AriaAvatar, avatarHidden, setAvatarHidden } = useAvatarSetup({\n      mode,\n      variant,\n      sleepTimeout,\n    });\n\n    const { setCenter } = useMovement(\n      wrapperRef,\n      ASTRO_SIZE.WIDTH,\n      ASTRO_SIZE.HEIGHT,\n    );\n\n    const {\n      leadDotRef,\n      trailRefs,\n      hideDots,\n      moveFromOffsetWithDots,\n      moveToOffsetWithDots,\n    } = useDotAnimation(setCenter, setAvatarHidden, AriaAvatar.setState, mode);\n\n    const revealRef = useRef<Animation | null>(null);\n\n    const cancelReveal = () => {\n      revealRef.current?.cancel();\n      revealRef.current = null;\n    };\n\n    // The dots arrive on the compositor, so the avatar is revealed there too\n    // rather than when the main thread gets to `setAvatarHidden(false)`.\n    const scheduleReveal = () => {\n      cancelReveal();\n      const wrapper = wrapperRef.current;\n      if (wrapper?.style.opacity !== '0') {\n        return;\n      }\n      revealRef.current = wrapper.animate([{ opacity: 0 }, { opacity: 1 }], {\n        delay: TIMING.TRAVEL_DURATION,\n        duration: AVATAR_REVEAL_DURATION,\n        fill: 'forwards',\n      });\n    };\n\n    const onTravelHomeFrom = async (\n      x: number,\n      y: number,\n      options?: MoveOptions,\n    ) => {\n      const pos = { x, y };\n      if (typeof x === 'number' && typeof y === 'number') {\n        scheduleReveal();\n      }\n      await moveFromOffsetWithDots(pos, options);\n    };\n\n    const onTravelAwayTo = async (\n      x: number,\n      y: number,\n      options?: MoveOptions,\n    ) => {\n      const pos = { x, y };\n      cancelReveal();\n      await moveToOffsetWithDots(pos, options);\n    };\n\n    const onMouseMove = (clientX: number, clientY: number) => {\n      if (isTyping) {\n        return;\n      }\n\n      AriaAvatar.lookAt(clientX, clientY);\n    };\n\n    const onUserTyping = (caretX: number, caretY: number) => {\n      try {\n        setIsTyping(true);\n        AriaAvatar.lookAt(caretX, caretY);\n\n        if (typingTimeout.current) {\n          clearTimeout(typingTimeout.current);\n        }\n\n        typingTimeout.current = setTimeout(() => {\n          setIsTyping(false);\n        }, 500);\n      } catch (err) {\n        console.error('[Astro] Error tracking typing:', err);\n      }\n    };\n\n    useEffect(() => {\n      return () => {\n        if (typingTimeout.current) {\n          clearTimeout(typingTimeout.current);\n        }\n      };\n    }, []);\n\n    const hideAvatar = ({ withDots = false }: { withDots?: boolean } = {}) => {\n      cancelReveal();\n      setAvatarHidden(true);\n\n      if (withDots) {\n        hideDots();\n      }\n    };\n\n    const showAvatar = () => {\n      setAvatarHidden(false);\n    };\n\n    useImperativeHandle(ref, () => ({\n      trigger: {\n        shrink: () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.SMALL);\n        },\n        smallLoader: () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL) {\n            return AriaAvatar.setState(AvatarState.SMALL_LOADER);\n          }\n          return AriaAvatar.setState(AvatarState.SMALL);\n        },\n        pulse: () => Promise.resolve(),\n        idle: async () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL_LOADER) {\n            await AriaAvatar.setState(AvatarState.SMALL);\n          }\n          return AriaAvatar.setState(AvatarState.IDLE);\n        },\n        undo: () => AriaAvatar.fireEvent(AvatarEvent.UNDO_EVENT),\n        boredom: () => {\n          if (AriaAvatar.getState() === AvatarState.SLEEPING) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.SLEEPING);\n        },\n        bigLoader: () => {\n          if (AriaAvatar.getState() === AvatarState.BIG_LOADER) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.BIG_LOADER);\n        },\n        ideaSpark: () => AriaAvatar.fireEvent(AvatarEvent.IDEA_SPARK),\n        publish: () => AriaAvatar.fireEvent(AvatarEvent.PUBLISH_EVENT),\n      },\n      avatarHidden,\n      wrapper: wrapperRef.current,\n      getState: AriaAvatar.getState,\n\n      onMouseMove,\n      onUserTyping,\n      onTravelHomeFrom,\n      onTravelAwayTo,\n\n      changeAstroColor: (color: string) => {\n        AriaAvatar.setAvatarColor(color);\n      },\n\n      toggleAvatarBackground: () => {\n        if (showBg) {\n          setShowBg(false);\n          AriaAvatar.hideBg();\n        } else {\n          setShowBg(true);\n          AriaAvatar.showBg();\n        }\n      },\n\n      hide: hideAvatar,\n      show: showAvatar,\n    }));\n\n    return (\n      <div className={s.avatar}>\n        <DotTrail leadDotRef={leadDotRef} trailRefs={trailRefs} />\n\n        <div\n          ref={wrapperRef}\n          className={s.astro}\n          style={{\n            opacity: avatarHidden ? 0 : 1,\n          }}\n        >\n          <div style={{ width: ASTRO_SIZE.WIDTH, height: ASTRO_SIZE.HEIGHT }}>\n            <AriaAvatar.AriaAvatar />\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/Astro/hooks/useDotAnimation.js

@@ -6,32 +6,74 @@ var _react = require("react");
 var _config = require("../config");
 var _utils = require("../utils");
 var _ariaAiAvatar = require("@wix/aria-ai-avatar");
+const PATH_SAMPLES = 48;
+// Matches the dots' opacity transition in Astro.module.css.
+const DOT_FADE_OUT_DURATION = 150;
+const centerOf = el => {
+  const rect = el.getBoundingClientRect();
+  return {
+    x: rect.left + rect.width / 2,
+    y: rect.top + rect.height / 2
+  };
+};
+
+/**
+ * Where path coordinate (0, 0) lies relative to the dot's own center, i.e.
+ * the translation that puts the dot where `offset-path` with a centered
+ * `offset-anchor` would.
+ */
+const measurePathOrigin = el => {
+  const natural = centerOf(el);
+  el.style.offsetPath = 'path("M 0,0 L 1,0")';
+  el.style.offsetDistance = '0%';
+  el.style.offsetAnchor = '50% 50%';
+  el.style.offsetRotate = '0deg';
+  const origin = centerOf(el);
+  el.style.offsetPath = '';
+  el.style.offsetDistance = '';
+  el.style.offsetAnchor = '';
+  el.style.offsetRotate = '';
+  return {
+    x: origin.x - natural.x,
+    y: origin.y - natural.y
+  };
+};
 const useDotAnimation = (moveToPosition, setAvatarHidden, triggerAvatarAnimationState, mode) => {
   const leadDotRef = (0, _react.useRef)(null);
   const trailRefs = (0, _react.useRef)([]);
   const isMountedRef = (0, _react.useRef)(true);
-  const animateDotsAlongPath = async (start, end, options = {}) => {
+  const travelRunRef = (0, _react.useRef)(0);
+  const isCurrentTravel = run => isMountedRef.current && run === travelRunRef.current;
+
+  /**
+   * Resolves `false` when a newer travel interrupted this one. The dots fade
+   * out on the compositor when they arrive, so a busy main thread doesn't
+   * leave them sitting at the end of the path.
+   */
+  const animateDotsAlongPath = async (run, start, end, options = {}) => {
     if (!isMountedRef.current) {
-      return;
+      return true;
     }
     const lead = leadDotRef.current;
     if (!lead) {
-      return;
+      return true;
     }
     if (!options.skipShrink) {
       try {
         triggerAvatarAnimationState(_ariaAiAvatar.AvatarState.SMALL);
       } catch {}
     }
-    trailRefs.current.forEach((d, i) => {
-      if (!d) {
-        return;
-      }
+    [lead, ...trailRefs.current].forEach(d => d == null ? void 0 : d.getAnimations().forEach(animation => animation.cancel()));
+    const trailStyles = trailRefs.current.map((d, i) => {
       const ratio = (i + 1) / _config.ANIMATION_CONFIG.TRAIL_COUNT;
-      const scale = _config.ANIMATION_CONFIG.TRAIL_MIN_SCALE + (1 - _config.ANIMATION_CONFIG.TRAIL_MIN_SCALE) * (1 - ratio);
       const opacity = _config.ANIMATION_CONFIG.TRAIL_FADE + (1 - _config.ANIMATION_CONFIG.TRAIL_FADE) * (1 - ratio);
-      d.style.opacity = String(opacity);
-      d.style.transform = `scale(${scale})`;
+      if (d) {
+        d.style.opacity = String(opacity);
+      }
+      return {
+        opacity,
+        scale: _config.ANIMATION_CONFIG.TRAIL_MIN_SCALE + (1 - _config.ANIMATION_CONFIG.TRAIL_MIN_SCALE) * (1 - ratio)
+      };
     });
     const leadStartColor = mode === 'dark' ? _config.ANIMATION_CONFIG.DOT_COLOR : '#000000';
     lead.style.opacity = '1';
@@ -45,45 +87,54 @@ const useDotAnimation = (moveToPosition, setAvatarHidden, triggerAvatarAnimation
       easing: 'ease-out',
       fill: 'forwards'
     });
-    const pathD = (0, _utils.buildPathD)(start, end);
-    const prepDot = el => {
-      if (!el) {
-        return;
-      }
-      (0, _utils.setMotionPath)(el, pathD);
-      (0, _utils.setOffsetDistance)(el, '0%');
-      (0, _utils.setOffsetRotate)(el, '0deg');
-      (0, _utils.setOffsetAnchor)(el, '50% 50%');
-    };
-    prepDot(lead);
-    trailRefs.current.forEach(td => td && prepDot(td));
-    const leadAnim = lead.animate([{
-      offsetDistance: '0%'
+    const origin = measurePathOrigin(lead);
+    const points = (0, _utils.samplePathByLength)((0, _utils.buildPathControlPoints)(start, end), PATH_SAMPLES);
+    const pathFrames = (scale = 1) => points.map(({
+      x,
+      y
+    }) => ({
+      transform: `translate3d(${x + origin.x}px, ${y + origin.y}px, 0) scale(${scale})`
+    }));
+    // Once faded, the inline opacity follows, so the next travel's opacity
+    // change runs the dots' CSS fade-in from 0.
+    const fadeOut = (el, opacity) => el.animate([{
+      opacity
     }, {
-      offsetDistance: '100%'
+      opacity: 0
     }], {
+      delay: _config.TIMING.TRAVEL_DURATION,
+      duration: DOT_FADE_OUT_DURATION,
+      easing: 'ease-in-out',
+      fill: 'forwards'
+    }).finished.then(() => {
+      if (run === travelRunRef.current) {
+        el.style.opacity = '0';
+      }
+    }, () => {});
+    const leadAnim = lead.animate(pathFrames(), {
       duration: _config.TIMING.TRAVEL_DURATION,
       easing: _config.ANIMATION_CONFIG.EASING,
-      fill: 'forwards'
+      fill: 'both'
     });
+    fadeOut(lead, 1);
     trailRefs.current.forEach((td, i) => {
       if (!td) {
         return;
       }
-      td.animate([{
-        offsetDistance: '0%'
-      }, {
-        offsetDistance: '100%'
-      }], {
+      td.animate(pathFrames(trailStyles[i].scale), {
         duration: _config.TIMING.TRAVEL_DURATION,
         delay: (i + 1) * _config.ANIMATION_CONFIG.TRAIL_STAGGER,
         easing: _config.ANIMATION_CONFIG.EASING,
-        fill: 'forwards'
+        fill: 'both'
       });
+      fadeOut(td, trailStyles[i].opacity);
     });
-    await leadAnim.finished;
-    lead.style.opacity = '0';
-    trailRefs.current.forEach(td => td && (td.style.opacity = '0'));
+    try {
+      await leadAnim.finished;
+    } catch {
+      return false;
+    }
+    return run === travelRunRef.current;
   };
   const hideDots = () => {
     const lead = leadDotRef.current;
@@ -102,15 +153,18 @@ const useDotAnimation = (moveToPosition, setAvatarHidden, triggerAvatarAnimation
       console.log('[Astro] Invalid position, skipping animation');
       return;
     }
+    const run = ++travelRunRef.current;
     const home = {
       x: 0,
       y: 0
     };
-    await animateDotsAlongPath(currentPosition, home, options);
+    if (!(await animateDotsAlongPath(run, currentPosition, home, options))) {
+      return;
+    }
     moveToPosition(home);
     setAvatarHidden(false);
     await waitForNextFrame();
-    if (isMountedRef.current) {
+    if (isCurrentTravel(run)) {
       if (options.endState) {
         await triggerAvatarAnimationState(options.endState);
       } else {
@@ -123,14 +177,17 @@ const useDotAnimation = (moveToPosition, setAvatarHidden, triggerAvatarAnimation
       console.log('[Astro] Invalid position, skipping animation');
       return;
     }
+    const run = ++travelRunRef.current;
     setAvatarHidden(true);
     await waitForNextFrame();
+    if (!isCurrentTravel(run)) {
+      return;
+    }
     const home = {
       x: 0,
       y: 0
     };
-    await animateDotsAlongPath(home, targetPosition, options);
-    hideDots();
+    await animateDotsAlongPath(run, home, targetPosition, options);
   };
   (0, _react.useEffect)(() => {
     return () => {

package/dist/cjs/Astro/hooks/useDotAnimation.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_config","_utils","_ariaAiAvatar","useDotAnimation","moveToPosition","setAvatarHidden","triggerAvatarAnimationState","mode","leadDotRef","useRef","trailRefs","isMountedRef","animateDotsAlongPath","start","end","options","current","lead","skipShrink","AvatarState","SMALL","forEach","d","i","ratio","ANIMATION_CONFIG","TRAIL_COUNT","scale","TRAIL_MIN_SCALE","opacity","TRAIL_FADE","style","String","transform","leadStartColor","DOT_COLOR","background","animate","duration","TIMING","DOT_FADE_DURATION","easing","fill","pathD","buildPathD","prepDot","el","setMotionPath","setOffsetDistance","setOffsetRotate","setOffsetAnchor","td","leadAnim","offsetDistance","TRAVEL_DURATION","EASING","delay","TRAIL_STAGGER","finished","hideDots","waitForNextFrame","Promise","r","requestAnimationFrame","moveFromOffsetWithDots","currentPosition","x","y","console","log","home","endState","IDLE","moveToOffsetWithDots","targetPosition","useEffect","exports"],"sources":["../../../../src/Astro/hooks/useDotAnimation.ts"],"sourcesContent":["import { useRef, useEffect } from 'react';\nimport type { Position, MoveOptions } from '../types';\nimport { ANIMATION_CONFIG, TIMING } from '../config';\nimport {\n  buildPathD,\n  setMotionPath,\n  setOffsetDistance,\n  setOffsetRotate,\n  setOffsetAnchor,\n} from '../utils';\nimport { AvatarState } from '@wix/aria-ai-avatar';\n\nexport const useDotAnimation = (\n  moveToPosition: (position: Position) => void,\n  setAvatarHidden: (hidden: boolean) => void,\n  triggerAvatarAnimationState: (state: AvatarState) => void,\n  mode?: 'light' | 'dark',\n) => {\n  const leadDotRef = useRef<HTMLDivElement | null>(null);\n  const trailRefs = useRef<(HTMLDivElement | null)[]>([]);\n  const isMountedRef = useRef(true);\n\n  const animateDotsAlongPath = async (\n    start: Position,\n    end: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (!isMountedRef.current) {\n      return;\n    }\n\n    const lead = leadDotRef.current;\n    if (!lead) {\n      return;\n    }\n\n    if (!options.skipShrink) {\n      try {\n        triggerAvatarAnimationState(AvatarState.SMALL);\n      } catch {}\n    }\n\n    trailRefs.current.forEach((d, i) => {\n      if (!d) {\n        return;\n      }\n      const ratio = (i + 1) / ANIMATION_CONFIG.TRAIL_COUNT;\n      const scale =\n        ANIMATION_CONFIG.TRAIL_MIN_SCALE +\n        (1 - ANIMATION_CONFIG.TRAIL_MIN_SCALE) * (1 - ratio);\n      const opacity =\n        ANIMATION_CONFIG.TRAIL_FADE +\n        (1 - ANIMATION_CONFIG.TRAIL_FADE) * (1 - ratio);\n      d.style.opacity = String(opacity);\n      d.style.transform = `scale(${scale})`;\n    });\n\n    const leadStartColor =\n      mode === 'dark' ? ANIMATION_CONFIG.DOT_COLOR : '#000000';\n\n    lead.style.opacity = '1';\n    lead.style.background = leadStartColor;\n\n    lead.animate(\n      [\n        { background: leadStartColor },\n        { background: ANIMATION_CONFIG.DOT_COLOR },\n      ],\n      {\n        duration: TIMING.DOT_FADE_DURATION,\n        easing: 'ease-out',\n        fill: 'forwards',\n      },\n    );\n\n    const pathD = buildPathD(start, end);\n\n    const prepDot = (el: HTMLElement) => {\n      if (!el) {\n        return;\n      }\n      setMotionPath(el, pathD);\n      setOffsetDistance(el, '0%');\n      setOffsetRotate(el, '0deg');\n      setOffsetAnchor(el, '50% 50%');\n    };\n\n    prepDot(lead);\n\n    trailRefs.current.forEach((td) => td && prepDot(td));\n\n    const leadAnim = lead.animate(\n      [{ offsetDistance: '0%' }, { offsetDistance: '100%' }],\n      {\n        duration: TIMING.TRAVEL_DURATION,\n        easing: ANIMATION_CONFIG.EASING,\n        fill: 'forwards',\n      },\n    );\n\n    trailRefs.current.forEach((td, i) => {\n      if (!td) {\n        return;\n      }\n      td.animate([{ offsetDistance: '0%' }, { offsetDistance: '100%' }], {\n        duration: TIMING.TRAVEL_DURATION,\n        delay: (i + 1) * ANIMATION_CONFIG.TRAIL_STAGGER,\n        easing: ANIMATION_CONFIG.EASING,\n        fill: 'forwards',\n      });\n    });\n\n    await leadAnim.finished;\n\n    lead.style.opacity = '0';\n    trailRefs.current.forEach((td) => td && (td.style.opacity = '0'));\n  };\n\n  const hideDots = () => {\n    const lead = leadDotRef.current;\n    if (lead) {\n      lead.style.opacity = '0';\n    }\n    trailRefs.current.forEach((td) => {\n      if (td) {\n        td.style.opacity = '0';\n      }\n    });\n  };\n\n  const waitForNextFrame = () =>\n    new Promise<void>((r) => requestAnimationFrame(() => r()));\n\n  const moveFromOffsetWithDots = async (\n    currentPosition: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (\n      typeof currentPosition.x !== 'number' ||\n      typeof currentPosition.y !== 'number'\n    ) {\n      console.log('[Astro] Invalid position, skipping animation');\n      return;\n    }\n\n    const home = { x: 0, y: 0 };\n    await animateDotsAlongPath(currentPosition, home, options);\n\n    moveToPosition(home);\n    setAvatarHidden(false);\n\n    await waitForNextFrame();\n\n    if (isMountedRef.current) {\n      if (options.endState) {\n        await triggerAvatarAnimationState(options.endState);\n      } else {\n        await triggerAvatarAnimationState(AvatarState.IDLE);\n      }\n    }\n  };\n\n  const moveToOffsetWithDots = async (\n    targetPosition: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (\n      typeof targetPosition.x !== 'number' ||\n      typeof targetPosition.y !== 'number'\n    ) {\n      console.log('[Astro] Invalid position, skipping animation');\n      return;\n    }\n\n    setAvatarHidden(true);\n    await waitForNextFrame();\n\n    const home = { x: 0, y: 0 };\n    await animateDotsAlongPath(home, targetPosition, options);\n\n    hideDots();\n  };\n\n  useEffect(() => {\n    return () => {\n      isMountedRef.current = false;\n    };\n  }, []);\n\n  return {\n    leadDotRef,\n    trailRefs,\n    moveFromOffsetWithDots,\n    moveToOffsetWithDots,\n    hideDots,\n  };\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","require","_config","_utils","_ariaAiAvatar","PATH_SAMPLES","DOT_FADE_OUT_DURATION","centerOf","el","rect","getBoundingClientRect","x","left","width","y","top","height","measurePathOrigin","natural","style","offsetPath","offsetDistance","offsetAnchor","offsetRotate","origin","useDotAnimation","moveToPosition","setAvatarHidden","triggerAvatarAnimationState","mode","leadDotRef","useRef","trailRefs","isMountedRef","travelRunRef","isCurrentTravel","run","current","animateDotsAlongPath","start","end","options","lead","skipShrink","AvatarState","SMALL","forEach","d","getAnimations","animation","cancel","trailStyles","map","i","ratio","ANIMATION_CONFIG","TRAIL_COUNT","opacity","TRAIL_FADE","String","scale","TRAIL_MIN_SCALE","leadStartColor","DOT_COLOR","background","animate","duration","TIMING","DOT_FADE_DURATION","easing","fill","points","samplePathByLength","buildPathControlPoints","pathFrames","transform","fadeOut","delay","TRAVEL_DURATION","finished","then","leadAnim","EASING","td","TRAIL_STAGGER","hideDots","waitForNextFrame","Promise","r","requestAnimationFrame","moveFromOffsetWithDots","currentPosition","console","log","home","endState","IDLE","moveToOffsetWithDots","targetPosition","useEffect","exports"],"sources":["../../../../src/Astro/hooks/useDotAnimation.ts"],"sourcesContent":["import { useRef, useEffect } from 'react';\nimport type { Position, MoveOptions } from '../types';\nimport { ANIMATION_CONFIG, TIMING } from '../config';\nimport { buildPathControlPoints, samplePathByLength } from '../utils';\nimport { AvatarState } from '@wix/aria-ai-avatar';\n\nconst PATH_SAMPLES = 48;\n// Matches the dots' opacity transition in Astro.module.css.\nconst DOT_FADE_OUT_DURATION = 150;\n\nconst centerOf = (el: HTMLElement) => {\n  const rect = el.getBoundingClientRect();\n  return { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 };\n};\n\n/**\n * Where path coordinate (0, 0) lies relative to the dot's own center, i.e.\n * the translation that puts the dot where `offset-path` with a centered\n * `offset-anchor` would.\n */\nconst measurePathOrigin = (el: HTMLElement): Position => {\n  const natural = centerOf(el);\n  el.style.offsetPath = 'path(\"M 0,0 L 1,0\")';\n  el.style.offsetDistance = '0%';\n  (el.style as any).offsetAnchor = '50% 50%';\n  el.style.offsetRotate = '0deg';\n  const origin = centerOf(el);\n  el.style.offsetPath = '';\n  el.style.offsetDistance = '';\n  (el.style as any).offsetAnchor = '';\n  el.style.offsetRotate = '';\n  return { x: origin.x - natural.x, y: origin.y - natural.y };\n};\n\nexport const useDotAnimation = (\n  moveToPosition: (position: Position) => void,\n  setAvatarHidden: (hidden: boolean) => void,\n  triggerAvatarAnimationState: (state: AvatarState) => void,\n  mode?: 'light' | 'dark',\n) => {\n  const leadDotRef = useRef<HTMLDivElement | null>(null);\n  const trailRefs = useRef<(HTMLDivElement | null)[]>([]);\n  const isMountedRef = useRef(true);\n  const travelRunRef = useRef(0);\n\n  const isCurrentTravel = (run: number) =>\n    isMountedRef.current && run === travelRunRef.current;\n\n  /**\n   * Resolves `false` when a newer travel interrupted this one. The dots fade\n   * out on the compositor when they arrive, so a busy main thread doesn't\n   * leave them sitting at the end of the path.\n   */\n  const animateDotsAlongPath = async (\n    run: number,\n    start: Position,\n    end: Position,\n    options: MoveOptions = {},\n  ): Promise<boolean> => {\n    if (!isMountedRef.current) {\n      return true;\n    }\n\n    const lead = leadDotRef.current;\n    if (!lead) {\n      return true;\n    }\n\n    if (!options.skipShrink) {\n      try {\n        triggerAvatarAnimationState(AvatarState.SMALL);\n      } catch {}\n    }\n\n    [lead, ...trailRefs.current].forEach((d) =>\n      d?.getAnimations().forEach((animation) => animation.cancel()),\n    );\n\n    const trailStyles = trailRefs.current.map((d, i) => {\n      const ratio = (i + 1) / ANIMATION_CONFIG.TRAIL_COUNT;\n      const opacity =\n        ANIMATION_CONFIG.TRAIL_FADE +\n        (1 - ANIMATION_CONFIG.TRAIL_FADE) * (1 - ratio);\n      if (d) {\n        d.style.opacity = String(opacity);\n      }\n      return {\n        opacity,\n        scale:\n          ANIMATION_CONFIG.TRAIL_MIN_SCALE +\n          (1 - ANIMATION_CONFIG.TRAIL_MIN_SCALE) * (1 - ratio),\n      };\n    });\n\n    const leadStartColor =\n      mode === 'dark' ? ANIMATION_CONFIG.DOT_COLOR : '#000000';\n\n    lead.style.opacity = '1';\n    lead.style.background = leadStartColor;\n\n    lead.animate(\n      [\n        { background: leadStartColor },\n        { background: ANIMATION_CONFIG.DOT_COLOR },\n      ],\n      {\n        duration: TIMING.DOT_FADE_DURATION,\n        easing: 'ease-out',\n        fill: 'forwards',\n      },\n    );\n\n    const origin = measurePathOrigin(lead);\n    const points = samplePathByLength(\n      buildPathControlPoints(start, end),\n      PATH_SAMPLES,\n    );\n    const pathFrames = (scale = 1): Keyframe[] =>\n      points.map(({ x, y }) => ({\n        transform: `translate3d(${x + origin.x}px, ${\n          y + origin.y\n        }px, 0) scale(${scale})`,\n      }));\n    // Once faded, the inline opacity follows, so the next travel's opacity\n    // change runs the dots' CSS fade-in from 0.\n    const fadeOut = (el: HTMLElement, opacity: number) =>\n      el\n        .animate([{ opacity }, { opacity: 0 }], {\n          delay: TIMING.TRAVEL_DURATION,\n          duration: DOT_FADE_OUT_DURATION,\n          easing: 'ease-in-out',\n          fill: 'forwards',\n        })\n        .finished.then(\n          () => {\n            if (run === travelRunRef.current) {\n              el.style.opacity = '0';\n            }\n          },\n          () => {},\n        );\n\n    const leadAnim = lead.animate(pathFrames(), {\n      duration: TIMING.TRAVEL_DURATION,\n      easing: ANIMATION_CONFIG.EASING,\n      fill: 'both',\n    });\n    fadeOut(lead, 1);\n\n    trailRefs.current.forEach((td, i) => {\n      if (!td) {\n        return;\n      }\n      td.animate(pathFrames(trailStyles[i].scale), {\n        duration: TIMING.TRAVEL_DURATION,\n        delay: (i + 1) * ANIMATION_CONFIG.TRAIL_STAGGER,\n        easing: ANIMATION_CONFIG.EASING,\n        fill: 'both',\n      });\n      fadeOut(td, trailStyles[i].opacity);\n    });\n\n    try {\n      await leadAnim.finished;\n    } catch {\n      return false;\n    }\n    return run === travelRunRef.current;\n  };\n\n  const hideDots = () => {\n    const lead = leadDotRef.current;\n    if (lead) {\n      lead.style.opacity = '0';\n    }\n    trailRefs.current.forEach((td) => {\n      if (td) {\n        td.style.opacity = '0';\n      }\n    });\n  };\n\n  const waitForNextFrame = () =>\n    new Promise<void>((r) => requestAnimationFrame(() => r()));\n\n  const moveFromOffsetWithDots = async (\n    currentPosition: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (\n      typeof currentPosition.x !== 'number' ||\n      typeof currentPosition.y !== 'number'\n    ) {\n      console.log('[Astro] Invalid position, skipping animation');\n      return;\n    }\n\n    const run = ++travelRunRef.current;\n    const home = { x: 0, y: 0 };\n\n    if (!(await animateDotsAlongPath(run, currentPosition, home, options))) {\n      return;\n    }\n\n    moveToPosition(home);\n    setAvatarHidden(false);\n\n    await waitForNextFrame();\n\n    if (isCurrentTravel(run)) {\n      if (options.endState) {\n        await triggerAvatarAnimationState(options.endState);\n      } else {\n        await triggerAvatarAnimationState(AvatarState.IDLE);\n      }\n    }\n  };\n\n  const moveToOffsetWithDots = async (\n    targetPosition: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (\n      typeof targetPosition.x !== 'number' ||\n      typeof targetPosition.y !== 'number'\n    ) {\n      console.log('[Astro] Invalid position, skipping animation');\n      return;\n    }\n\n    const run = ++travelRunRef.current;\n    setAvatarHidden(true);\n    await waitForNextFrame();\n\n    if (!isCurrentTravel(run)) {\n      return;\n    }\n\n    const home = { x: 0, y: 0 };\n    await animateDotsAlongPath(run, home, targetPosition, options);\n  };\n\n  useEffect(() => {\n    return () => {\n      isMountedRef.current = false;\n    };\n  }, []);\n\n  return {\n    leadDotRef,\n    trailRefs,\n    moveFromOffsetWithDots,\n    moveToOffsetWithDots,\n    hideDots,\n  };\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/Astro/utils/pathGeneration.js

@@ -1,22 +1,95 @@
 "use strict";
 
 exports.__esModule = true;
-exports.setOffsetRotate = exports.setOffsetDistance = exports.setOffsetAnchor = exports.setMotionPath = exports.buildPathD = void 0;
+exports.setOffsetRotate = exports.setOffsetDistance = exports.setOffsetAnchor = exports.setMotionPath = exports.samplePathByLength = exports.buildPathD = exports.buildPathControlPoints = void 0;
 var _config = require("../config");
-const buildPathD = (start, end) => {
+const buildPathControlPoints = (start, end) => {
   const dx = end.x - start.x;
   const dy = end.y - start.y;
   const len = Math.max(1, Math.hypot(dx, dy));
   const nx = -dy / len;
   const ny = dx / len;
   const sway = _config.ANIMATION_CONFIG.SWAY_AMOUNT * (0.85 + Math.random() * 0.3);
-  const c1x = start.x + dx * _config.ANIMATION_CONFIG.CONTROL_POINT_1 + nx * sway;
-  const c1y = start.y + dy * _config.ANIMATION_CONFIG.CONTROL_POINT_1 + ny * sway;
-  const c2x = start.x + dx * _config.ANIMATION_CONFIG.CONTROL_POINT_2 - nx * (sway * 0.65);
-  const c2y = start.y + dy * _config.ANIMATION_CONFIG.CONTROL_POINT_2 - ny * (sway * 0.65);
-  return `M ${start.x},${start.y} C ${c1x},${c1y} ${c2x},${c2y} ${end.x},${end.y}`;
+  return {
+    start,
+    c1: {
+      x: start.x + dx * _config.ANIMATION_CONFIG.CONTROL_POINT_1 + nx * sway,
+      y: start.y + dy * _config.ANIMATION_CONFIG.CONTROL_POINT_1 + ny * sway
+    },
+    c2: {
+      x: start.x + dx * _config.ANIMATION_CONFIG.CONTROL_POINT_2 - nx * (sway * 0.65),
+      y: start.y + dy * _config.ANIMATION_CONFIG.CONTROL_POINT_2 - ny * (sway * 0.65)
+    },
+    end
+  };
+};
+exports.buildPathControlPoints = buildPathControlPoints;
+const buildPathD = (start, end) => {
+  const {
+    c1,
+    c2
+  } = buildPathControlPoints(start, end);
+  return `M ${start.x},${start.y} C ${c1.x},${c1.y} ${c2.x},${c2.y} ${end.x},${end.y}`;
 };
 exports.buildPathD = buildPathD;
+const pointOnCubic = ({
+  start,
+  c1,
+  c2,
+  end
+}, t) => {
+  const u = 1 - t;
+  const a = u * u * u;
+  const b = 3 * u * u * t;
+  const c = 3 * u * t * t;
+  const d = t * t * t;
+  return {
+    x: a * start.x + b * c1.x + c * c2.x + d * end.x,
+    y: a * start.y + b * c1.y + c * c2.y + d * end.y
+  };
+};
+
+/**
+ * Points evenly spaced by arc length, so a linear keyframe interpolation
+ * between them moves like `offset-distance` does along the same path.
+ */
+const samplePathByLength = (path, count) => {
+  const STEPS = 200;
+  const lut = [];
+  let length = 0;
+  let prev = pointOnCubic(path, 0);
+  lut.push({
+    point: prev,
+    length: 0
+  });
+  for (let i = 1; i <= STEPS; i++) {
+    const point = pointOnCubic(path, i / STEPS);
+    length += Math.hypot(point.x - prev.x, point.y - prev.y);
+    lut.push({
+      point,
+      length
+    });
+    prev = point;
+  }
+  const points = [];
+  let j = 1;
+  for (let i = 0; i < count; i++) {
+    const target = length * i / (count - 1);
+    while (j < lut.length - 1 && lut[j].length < target) {
+      j++;
+    }
+    const from = lut[j - 1];
+    const to = lut[j];
+    const span = to.length - from.length || 1;
+    const k = Math.min(1, Math.max(0, (target - from.length) / span));
+    points.push({
+      x: from.point.x + (to.point.x - from.point.x) * k,
+      y: from.point.y + (to.point.y - from.point.y) * k
+    });
+  }
+  return points;
+};
+exports.samplePathByLength = samplePathByLength;
 const setMotionPath = (el, pathD) => {
   el.style.offsetPath = `path("${pathD}")`;
 };

package/dist/cjs/Astro/utils/pathGeneration.js.map

@@ -1 +1 @@
-{"version":3,"names":["_config","require","buildPathD","start","end","dx","x","dy","y","len","Math","max","hypot","nx","ny","sway","ANIMATION_CONFIG","SWAY_AMOUNT","random","c1x","CONTROL_POINT_1","c1y","c2x","CONTROL_POINT_2","c2y","exports","setMotionPath","el","pathD","style","offsetPath","setOffsetDistance","value","offsetDistance","setOffsetRotate","offsetRotate","setOffsetAnchor","offsetAnchor"],"sources":["../../../../src/Astro/utils/pathGeneration.ts"],"sourcesContent":["import type { Position } from '../types';\nimport { ANIMATION_CONFIG } from '../config';\n\nexport const buildPathD = (start: Position, end: Position): string => {\n  const dx = end.x - start.x;\n  const dy = end.y - start.y;\n  const len = Math.max(1, Math.hypot(dx, dy));\n  const nx = -dy / len;\n  const ny = dx / len;\n\n  const sway = ANIMATION_CONFIG.SWAY_AMOUNT * (0.85 + Math.random() * 0.3);\n\n  const c1x = start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_1 + nx * sway;\n  const c1y = start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_1 + ny * sway;\n  const c2x =\n    start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_2 - nx * (sway * 0.65);\n  const c2y =\n    start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_2 - ny * (sway * 0.65);\n\n  return `M ${start.x},${start.y} C ${c1x},${c1y} ${c2x},${c2y} ${end.x},${end.y}`;\n};\n\nexport const setMotionPath = (el: HTMLElement, pathD: string): void => {\n  el.style.offsetPath = `path(\"${pathD}\")`;\n};\n\nexport const setOffsetDistance = (el: HTMLElement, value: string): void => {\n  el.style.offsetDistance = value;\n};\n\nexport const setOffsetRotate = (el: HTMLElement, value: string): void => {\n  el.style.offsetRotate = value;\n};\n\nexport const setOffsetAnchor = (el: HTMLElement, value: string): void => {\n  (el.style as any).offsetAnchor = value;\n};\n"],"mappings":";;;;AACA,IAAAA,OAAA,GAAAC,OAAA;AAEO,MAAMC,UAAU,GAAGA,CAACC,KAAe,EAAEC,GAAa,KAAa;EACpE,MAAMC,EAAE,GAAGD,GAAG,CAACE,CAAC,GAAGH,KAAK,CAACG,CAAC;EAC1B,MAAMC,EAAE,GAAGH,GAAG,CAACI,CAAC,GAAGL,KAAK,CAACK,CAAC;EAC1B,MAAMC,GAAG,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,KAAK,CAACP,EAAE,EAAEE,EAAE,CAAC,CAAC;EAC3C,MAAMM,EAAE,GAAG,CAACN,EAAE,GAAGE,GAAG;EACpB,MAAMK,EAAE,GAAGT,EAAE,GAAGI,GAAG;EAEnB,MAAMM,IAAI,GAAGC,wBAAgB,CAACC,WAAW,IAAI,IAAI,GAAGP,IAAI,CAACQ,MAAM,CAAC,CAAC,GAAG,GAAG,CAAC;EAExE,MAAMC,GAAG,GAAGhB,KAAK,CAACG,CAAC,GAAGD,EAAE,GAAGW,wBAAgB,CAACI,eAAe,GAAGP,EAAE,GAAGE,IAAI;EACvE,MAAMM,GAAG,GAAGlB,KAAK,CAACK,CAAC,GAAGD,EAAE,GAAGS,wBAAgB,CAACI,eAAe,GAAGN,EAAE,GAAGC,IAAI;EACvE,MAAMO,GAAG,GACPnB,KAAK,CAACG,CAAC,GAAGD,EAAE,GAAGW,wBAAgB,CAACO,eAAe,GAAGV,EAAE,IAAIE,IAAI,GAAG,IAAI,CAAC;EACtE,MAAMS,GAAG,GACPrB,KAAK,CAACK,CAAC,GAAGD,EAAE,GAAGS,wBAAgB,CAACO,eAAe,GAAGT,EAAE,IAAIC,IAAI,GAAG,IAAI,CAAC;EAEtE,OAAO,KAAKZ,KAAK,CAACG,CAAC,IAAIH,KAAK,CAACK,CAAC,MAAMW,GAAG,IAAIE,GAAG,IAAIC,GAAG,IAAIE,GAAG,IAAIpB,GAAG,CAACE,CAAC,IAAIF,GAAG,CAACI,CAAC,EAAE;AAClF,CAAC;AAACiB,OAAA,CAAAvB,UAAA,GAAAA,UAAA;AAEK,MAAMwB,aAAa,GAAGA,CAACC,EAAe,EAAEC,KAAa,KAAW;EACrED,EAAE,CAACE,KAAK,CAACC,UAAU,GAAG,SAASF,KAAK,IAAI;AAC1C,CAAC;AAACH,OAAA,CAAAC,aAAA,GAAAA,aAAA;AAEK,MAAMK,iBAAiB,GAAGA,CAACJ,EAAe,EAAEK,KAAa,KAAW;EACzEL,EAAE,CAACE,KAAK,CAACI,cAAc,GAAGD,KAAK;AACjC,CAAC;AAACP,OAAA,CAAAM,iBAAA,GAAAA,iBAAA;AAEK,MAAMG,eAAe,GAAGA,CAACP,EAAe,EAAEK,KAAa,KAAW;EACvEL,EAAE,CAACE,KAAK,CAACM,YAAY,GAAGH,KAAK;AAC/B,CAAC;AAACP,OAAA,CAAAS,eAAA,GAAAA,eAAA;AAEK,MAAME,eAAe,GAAGA,CAACT,EAAe,EAAEK,KAAa,KAAW;EACtEL,EAAE,CAACE,KAAK,CAASQ,YAAY,GAAGL,KAAK;AACxC,CAAC;AAACP,OAAA,CAAAW,eAAA,GAAAA,eAAA","ignoreList":[]}
+{"version":3,"names":["_config","require","buildPathControlPoints","start","end","dx","x","dy","y","len","Math","max","hypot","nx","ny","sway","ANIMATION_CONFIG","SWAY_AMOUNT","random","c1","CONTROL_POINT_1","c2","CONTROL_POINT_2","exports","buildPathD","pointOnCubic","t","u","a","b","c","d","samplePathByLength","path","count","STEPS","lut","length","prev","push","point","i","points","j","target","from","to","span","k","min","setMotionPath","el","pathD","style","offsetPath","setOffsetDistance","value","offsetDistance","setOffsetRotate","offsetRotate","setOffsetAnchor","offsetAnchor"],"sources":["../../../../src/Astro/utils/pathGeneration.ts"],"sourcesContent":["import type { Position } from '../types';\nimport { ANIMATION_CONFIG } from '../config';\n\ntype CubicPath = { start: Position; c1: Position; c2: Position; end: Position };\n\nexport const buildPathControlPoints = (\n  start: Position,\n  end: Position,\n): CubicPath => {\n  const dx = end.x - start.x;\n  const dy = end.y - start.y;\n  const len = Math.max(1, Math.hypot(dx, dy));\n  const nx = -dy / len;\n  const ny = dx / len;\n\n  const sway = ANIMATION_CONFIG.SWAY_AMOUNT * (0.85 + Math.random() * 0.3);\n\n  return {\n    start,\n    c1: {\n      x: start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_1 + nx * sway,\n      y: start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_1 + ny * sway,\n    },\n    c2: {\n      x: start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_2 - nx * (sway * 0.65),\n      y: start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_2 - ny * (sway * 0.65),\n    },\n    end,\n  };\n};\n\nexport const buildPathD = (start: Position, end: Position): string => {\n  const { c1, c2 } = buildPathControlPoints(start, end);\n  return `M ${start.x},${start.y} C ${c1.x},${c1.y} ${c2.x},${c2.y} ${end.x},${end.y}`;\n};\n\nconst pointOnCubic = (\n  { start, c1, c2, end }: CubicPath,\n  t: number,\n): Position => {\n  const u = 1 - t;\n  const a = u * u * u;\n  const b = 3 * u * u * t;\n  const c = 3 * u * t * t;\n  const d = t * t * t;\n  return {\n    x: a * start.x + b * c1.x + c * c2.x + d * end.x,\n    y: a * start.y + b * c1.y + c * c2.y + d * end.y,\n  };\n};\n\n/**\n * Points evenly spaced by arc length, so a linear keyframe interpolation\n * between them moves like `offset-distance` does along the same path.\n */\nexport const samplePathByLength = (\n  path: CubicPath,\n  count: number,\n): Position[] => {\n  const STEPS = 200;\n  const lut: { point: Position; length: number }[] = [];\n  let length = 0;\n  let prev = pointOnCubic(path, 0);\n  lut.push({ point: prev, length: 0 });\n  for (let i = 1; i <= STEPS; i++) {\n    const point = pointOnCubic(path, i / STEPS);\n    length += Math.hypot(point.x - prev.x, point.y - prev.y);\n    lut.push({ point, length });\n    prev = point;\n  }\n\n  const points: Position[] = [];\n  let j = 1;\n  for (let i = 0; i < count; i++) {\n    const target = (length * i) / (count - 1);\n    while (j < lut.length - 1 && lut[j].length < target) {\n      j++;\n    }\n    const from = lut[j - 1];\n    const to = lut[j];\n    const span = to.length - from.length || 1;\n    const k = Math.min(1, Math.max(0, (target - from.length) / span));\n    points.push({\n      x: from.point.x + (to.point.x - from.point.x) * k,\n      y: from.point.y + (to.point.y - from.point.y) * k,\n    });\n  }\n  return points;\n};\n\nexport const setMotionPath = (el: HTMLElement, pathD: string): void => {\n  el.style.offsetPath = `path(\"${pathD}\")`;\n};\n\nexport const setOffsetDistance = (el: HTMLElement, value: string): void => {\n  el.style.offsetDistance = value;\n};\n\nexport const setOffsetRotate = (el: HTMLElement, value: string): void => {\n  el.style.offsetRotate = value;\n};\n\nexport const setOffsetAnchor = (el: HTMLElement, value: string): void => {\n  (el.style as any).offsetAnchor = value;\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/Astro/Astro.js

@@ -1,6 +1,9 @@
 import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import s from './Astro.module.css';
-import { ASTRO_SIZE } from './config';
+import { ASTRO_SIZE, TIMING } from './config';
+
+// Matches the `.astro` opacity transition in Astro.module.css.
+const AVATAR_REVEAL_DURATION = 80;
 import { useAvatarSetup, useMovement, useDotAnimation } from './hooks';
 import { DotTrail } from './components/DotTrail';
 import { AvatarEvent, AvatarState } from '@wix/aria-ai-avatar';
@@ -32,11 +35,39 @@ export const AiAssistantAvatar = /*#__PURE__*/forwardRef((_ref, ref) => {
     hideDots = _useDotAnimation.hideDots,
     moveFromOffsetWithDots = _useDotAnimation.moveFromOffsetWithDots,
     moveToOffsetWithDots = _useDotAnimation.moveToOffsetWithDots;
+  const revealRef = useRef(null);
+  const cancelReveal = () => {
+    var _revealRef$current;
+    (_revealRef$current = revealRef.current) == null || _revealRef$current.cancel();
+    revealRef.current = null;
+  };
+
+  // The dots arrive on the compositor, so the avatar is revealed there too
+  // rather than when the main thread gets to `setAvatarHidden(false)`.
+  const scheduleReveal = () => {
+    cancelReveal();
+    const wrapper = wrapperRef.current;
+    if ((wrapper == null ? void 0 : wrapper.style.opacity) !== '0') {
+      return;
+    }
+    revealRef.current = wrapper.animate([{
+      opacity: 0
+    }, {
+      opacity: 1
+    }], {
+      delay: TIMING.TRAVEL_DURATION,
+      duration: AVATAR_REVEAL_DURATION,
+      fill: 'forwards'
+    });
+  };
   const onTravelHomeFrom = async (x, y, options) => {
     const pos = {
       x,
       y
     };
+    if (typeof x === 'number' && typeof y === 'number') {
+      scheduleReveal();
+    }
     await moveFromOffsetWithDots(pos, options);
   };
   const onTravelAwayTo = async (x, y, options) => {
@@ -44,6 +75,7 @@ export const AiAssistantAvatar = /*#__PURE__*/forwardRef((_ref, ref) => {
       x,
       y
     };
+    cancelReveal();
     await moveToOffsetWithDots(pos, options);
   };
   const onMouseMove = (clientX, clientY) => {
@@ -77,6 +109,7 @@ export const AiAssistantAvatar = /*#__PURE__*/forwardRef((_ref, ref) => {
     let _ref2 = _temp === void 0 ? {} : _temp,
       _ref2$withDots = _ref2.withDots,
       withDots = _ref2$withDots === void 0 ? false : _ref2$withDots;
+    cancelReveal();
     setAvatarHidden(true);
     if (withDots) {
       hideDots();

package/dist/esm/Astro/Astro.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","forwardRef","useEffect","useImperativeHandle","useRef","useState","s","ASTRO_SIZE","useAvatarSetup","useMovement","useDotAnimation","DotTrail","AvatarEvent","AvatarState","AiAssistantAvatar","_ref","ref","mode","variant","sleepTimeout","wrapperRef","typingTimeout","_useState","isTyping","setIsTyping","_useState2","showBg","setShowBg","_useAvatarSetup","AriaAvatar","avatarHidden","setAvatarHidden","_useMovement","WIDTH","HEIGHT","setCenter","_useDotAnimation","setState","leadDotRef","trailRefs","hideDots","moveFromOffsetWithDots","moveToOffsetWithDots","onTravelHomeFrom","x","y","options","pos","onTravelAwayTo","onMouseMove","clientX","clientY","lookAt","onUserTyping","caretX","caretY","current","clearTimeout","setTimeout","err","console","error","hideAvatar","_temp","_ref2","_ref2$withDots","withDots","showAvatar","trigger","shrink","getState","SMALL","IDLE","smallLoader","SMALL_LOADER","pulse","Promise","resolve","idle","undo","fireEvent","UNDO_EVENT","boredom","SLEEPING","bigLoader","BIG_LOADER","ideaSpark","IDEA_SPARK","publish","PUBLISH_EVENT","wrapper","changeAstroColor","color","setAvatarColor","toggleAvatarBackground","hideBg","hide","show","createElement","className","avatar","astro","style","opacity","width","height"],"sources":["../../../src/Astro/Astro.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  Ref,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport s from './Astro.module.css';\nimport type { AstroRef, AstroProps, MoveOptions } from './types';\nimport { ASTRO_SIZE } from './config';\nimport { useAvatarSetup, useMovement, useDotAnimation } from './hooks';\nimport { DotTrail } from './components/DotTrail';\nimport { AvatarEvent, AvatarState } from '@wix/aria-ai-avatar';\n\nexport const AiAssistantAvatar = forwardRef<AstroRef, AstroProps>(\n  ({ mode, variant, sleepTimeout }, ref: Ref<AstroRef> | null) => {\n    const wrapperRef = useRef<HTMLDivElement | null>(null);\n    const typingTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    const [isTyping, setIsTyping] = useState(false);\n\n    const [showBg, setShowBg] = useState(false);\n\n    const { AriaAvatar, avatarHidden, setAvatarHidden } = useAvatarSetup({\n      mode,\n      variant,\n      sleepTimeout,\n    });\n\n    const { setCenter } = useMovement(\n      wrapperRef,\n      ASTRO_SIZE.WIDTH,\n      ASTRO_SIZE.HEIGHT,\n    );\n\n    const {\n      leadDotRef,\n      trailRefs,\n      hideDots,\n      moveFromOffsetWithDots,\n      moveToOffsetWithDots,\n    } = useDotAnimation(setCenter, setAvatarHidden, AriaAvatar.setState, mode);\n\n    const onTravelHomeFrom = async (\n      x: number,\n      y: number,\n      options?: MoveOptions,\n    ) => {\n      const pos = { x, y };\n      await moveFromOffsetWithDots(pos, options);\n    };\n\n    const onTravelAwayTo = async (\n      x: number,\n      y: number,\n      options?: MoveOptions,\n    ) => {\n      const pos = { x, y };\n      await moveToOffsetWithDots(pos, options);\n    };\n\n    const onMouseMove = (clientX: number, clientY: number) => {\n      if (isTyping) {\n        return;\n      }\n\n      AriaAvatar.lookAt(clientX, clientY);\n    };\n\n    const onUserTyping = (caretX: number, caretY: number) => {\n      try {\n        setIsTyping(true);\n        AriaAvatar.lookAt(caretX, caretY);\n\n        if (typingTimeout.current) {\n          clearTimeout(typingTimeout.current);\n        }\n\n        typingTimeout.current = setTimeout(() => {\n          setIsTyping(false);\n        }, 500);\n      } catch (err) {\n        console.error('[Astro] Error tracking typing:', err);\n      }\n    };\n\n    useEffect(() => {\n      return () => {\n        if (typingTimeout.current) {\n          clearTimeout(typingTimeout.current);\n        }\n      };\n    }, []);\n\n    const hideAvatar = ({ withDots = false }: { withDots?: boolean } = {}) => {\n      setAvatarHidden(true);\n\n      if (withDots) {\n        hideDots();\n      }\n    };\n\n    const showAvatar = () => {\n      setAvatarHidden(false);\n    };\n\n    useImperativeHandle(ref, () => ({\n      trigger: {\n        shrink: () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.SMALL);\n        },\n        smallLoader: () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL) {\n            return AriaAvatar.setState(AvatarState.SMALL_LOADER);\n          }\n          return AriaAvatar.setState(AvatarState.SMALL);\n        },\n        pulse: () => Promise.resolve(),\n        idle: async () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL_LOADER) {\n            await AriaAvatar.setState(AvatarState.SMALL);\n          }\n          return AriaAvatar.setState(AvatarState.IDLE);\n        },\n        undo: () => AriaAvatar.fireEvent(AvatarEvent.UNDO_EVENT),\n        boredom: () => {\n          if (AriaAvatar.getState() === AvatarState.SLEEPING) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.SLEEPING);\n        },\n        bigLoader: () => {\n          if (AriaAvatar.getState() === AvatarState.BIG_LOADER) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.BIG_LOADER);\n        },\n        ideaSpark: () => AriaAvatar.fireEvent(AvatarEvent.IDEA_SPARK),\n        publish: () => AriaAvatar.fireEvent(AvatarEvent.PUBLISH_EVENT),\n      },\n      avatarHidden,\n      wrapper: wrapperRef.current,\n      getState: AriaAvatar.getState,\n\n      onMouseMove,\n      onUserTyping,\n      onTravelHomeFrom,\n      onTravelAwayTo,\n\n      changeAstroColor: (color: string) => {\n        AriaAvatar.setAvatarColor(color);\n      },\n\n      toggleAvatarBackground: () => {\n        if (showBg) {\n          setShowBg(false);\n          AriaAvatar.hideBg();\n        } else {\n          setShowBg(true);\n          AriaAvatar.showBg();\n        }\n      },\n\n      hide: hideAvatar,\n      show: showAvatar,\n    }));\n\n    return (\n      <div className={s.avatar}>\n        <DotTrail leadDotRef={leadDotRef} trailRefs={trailRefs} />\n\n        <div\n          ref={wrapperRef}\n          className={s.astro}\n          style={{\n            opacity: avatarHidden ? 0 : 1,\n          }}\n        >\n          <div style={{ width: ASTRO_SIZE.WIDTH, height: ASTRO_SIZE.HEIGHT }}>\n            <AriaAvatar.AriaAvatar />\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","forwardRef","useEffect","useImperativeHandle","useRef","useState","s","ASTRO_SIZE","TIMING","AVATAR_REVEAL_DURATION","useAvatarSetup","useMovement","useDotAnimation","DotTrail","AvatarEvent","AvatarState","AiAssistantAvatar","_ref","ref","mode","variant","sleepTimeout","wrapperRef","typingTimeout","_useState","isTyping","setIsTyping","_useState2","showBg","setShowBg","_useAvatarSetup","AriaAvatar","avatarHidden","setAvatarHidden","_useMovement","WIDTH","HEIGHT","setCenter","_useDotAnimation","setState","leadDotRef","trailRefs","hideDots","moveFromOffsetWithDots","moveToOffsetWithDots","revealRef","cancelReveal","_revealRef$current","current","cancel","scheduleReveal","wrapper","style","opacity","animate","delay","TRAVEL_DURATION","duration","fill","onTravelHomeFrom","x","y","options","pos","onTravelAwayTo","onMouseMove","clientX","clientY","lookAt","onUserTyping","caretX","caretY","clearTimeout","setTimeout","err","console","error","hideAvatar","_temp","_ref2","_ref2$withDots","withDots","showAvatar","trigger","shrink","getState","SMALL","IDLE","smallLoader","SMALL_LOADER","pulse","Promise","resolve","idle","undo","fireEvent","UNDO_EVENT","boredom","SLEEPING","bigLoader","BIG_LOADER","ideaSpark","IDEA_SPARK","publish","PUBLISH_EVENT","changeAstroColor","color","setAvatarColor","toggleAvatarBackground","hideBg","hide","show","createElement","className","avatar","astro","width","height"],"sources":["../../../src/Astro/Astro.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  Ref,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport s from './Astro.module.css';\nimport type { AstroRef, AstroProps, MoveOptions } from './types';\nimport { ASTRO_SIZE, TIMING } from './config';\n\n// Matches the `.astro` opacity transition in Astro.module.css.\nconst AVATAR_REVEAL_DURATION = 80;\nimport { useAvatarSetup, useMovement, useDotAnimation } from './hooks';\nimport { DotTrail } from './components/DotTrail';\nimport { AvatarEvent, AvatarState } from '@wix/aria-ai-avatar';\n\nexport const AiAssistantAvatar = forwardRef<AstroRef, AstroProps>(\n  ({ mode, variant, sleepTimeout }, ref: Ref<AstroRef> | null) => {\n    const wrapperRef = useRef<HTMLDivElement | null>(null);\n    const typingTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    const [isTyping, setIsTyping] = useState(false);\n\n    const [showBg, setShowBg] = useState(false);\n\n    const { AriaAvatar, avatarHidden, setAvatarHidden } = useAvatarSetup({\n      mode,\n      variant,\n      sleepTimeout,\n    });\n\n    const { setCenter } = useMovement(\n      wrapperRef,\n      ASTRO_SIZE.WIDTH,\n      ASTRO_SIZE.HEIGHT,\n    );\n\n    const {\n      leadDotRef,\n      trailRefs,\n      hideDots,\n      moveFromOffsetWithDots,\n      moveToOffsetWithDots,\n    } = useDotAnimation(setCenter, setAvatarHidden, AriaAvatar.setState, mode);\n\n    const revealRef = useRef<Animation | null>(null);\n\n    const cancelReveal = () => {\n      revealRef.current?.cancel();\n      revealRef.current = null;\n    };\n\n    // The dots arrive on the compositor, so the avatar is revealed there too\n    // rather than when the main thread gets to `setAvatarHidden(false)`.\n    const scheduleReveal = () => {\n      cancelReveal();\n      const wrapper = wrapperRef.current;\n      if (wrapper?.style.opacity !== '0') {\n        return;\n      }\n      revealRef.current = wrapper.animate([{ opacity: 0 }, { opacity: 1 }], {\n        delay: TIMING.TRAVEL_DURATION,\n        duration: AVATAR_REVEAL_DURATION,\n        fill: 'forwards',\n      });\n    };\n\n    const onTravelHomeFrom = async (\n      x: number,\n      y: number,\n      options?: MoveOptions,\n    ) => {\n      const pos = { x, y };\n      if (typeof x === 'number' && typeof y === 'number') {\n        scheduleReveal();\n      }\n      await moveFromOffsetWithDots(pos, options);\n    };\n\n    const onTravelAwayTo = async (\n      x: number,\n      y: number,\n      options?: MoveOptions,\n    ) => {\n      const pos = { x, y };\n      cancelReveal();\n      await moveToOffsetWithDots(pos, options);\n    };\n\n    const onMouseMove = (clientX: number, clientY: number) => {\n      if (isTyping) {\n        return;\n      }\n\n      AriaAvatar.lookAt(clientX, clientY);\n    };\n\n    const onUserTyping = (caretX: number, caretY: number) => {\n      try {\n        setIsTyping(true);\n        AriaAvatar.lookAt(caretX, caretY);\n\n        if (typingTimeout.current) {\n          clearTimeout(typingTimeout.current);\n        }\n\n        typingTimeout.current = setTimeout(() => {\n          setIsTyping(false);\n        }, 500);\n      } catch (err) {\n        console.error('[Astro] Error tracking typing:', err);\n      }\n    };\n\n    useEffect(() => {\n      return () => {\n        if (typingTimeout.current) {\n          clearTimeout(typingTimeout.current);\n        }\n      };\n    }, []);\n\n    const hideAvatar = ({ withDots = false }: { withDots?: boolean } = {}) => {\n      cancelReveal();\n      setAvatarHidden(true);\n\n      if (withDots) {\n        hideDots();\n      }\n    };\n\n    const showAvatar = () => {\n      setAvatarHidden(false);\n    };\n\n    useImperativeHandle(ref, () => ({\n      trigger: {\n        shrink: () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.SMALL);\n        },\n        smallLoader: () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL) {\n            return AriaAvatar.setState(AvatarState.SMALL_LOADER);\n          }\n          return AriaAvatar.setState(AvatarState.SMALL);\n        },\n        pulse: () => Promise.resolve(),\n        idle: async () => {\n          if (AriaAvatar.getState() === AvatarState.SMALL_LOADER) {\n            await AriaAvatar.setState(AvatarState.SMALL);\n          }\n          return AriaAvatar.setState(AvatarState.IDLE);\n        },\n        undo: () => AriaAvatar.fireEvent(AvatarEvent.UNDO_EVENT),\n        boredom: () => {\n          if (AriaAvatar.getState() === AvatarState.SLEEPING) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.SLEEPING);\n        },\n        bigLoader: () => {\n          if (AriaAvatar.getState() === AvatarState.BIG_LOADER) {\n            return AriaAvatar.setState(AvatarState.IDLE);\n          }\n          return AriaAvatar.setState(AvatarState.BIG_LOADER);\n        },\n        ideaSpark: () => AriaAvatar.fireEvent(AvatarEvent.IDEA_SPARK),\n        publish: () => AriaAvatar.fireEvent(AvatarEvent.PUBLISH_EVENT),\n      },\n      avatarHidden,\n      wrapper: wrapperRef.current,\n      getState: AriaAvatar.getState,\n\n      onMouseMove,\n      onUserTyping,\n      onTravelHomeFrom,\n      onTravelAwayTo,\n\n      changeAstroColor: (color: string) => {\n        AriaAvatar.setAvatarColor(color);\n      },\n\n      toggleAvatarBackground: () => {\n        if (showBg) {\n          setShowBg(false);\n          AriaAvatar.hideBg();\n        } else {\n          setShowBg(true);\n          AriaAvatar.showBg();\n        }\n      },\n\n      hide: hideAvatar,\n      show: showAvatar,\n    }));\n\n    return (\n      <div className={s.avatar}>\n        <DotTrail leadDotRef={leadDotRef} trailRefs={trailRefs} />\n\n        <div\n          ref={wrapperRef}\n          className={s.astro}\n          style={{\n            opacity: avatarHidden ? 0 : 1,\n          }}\n        >\n          <div style={{ width: ASTRO_SIZE.WIDTH, height: ASTRO_SIZE.HEIGHT }}>\n            <AriaAvatar.AriaAvatar />\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/Astro/hooks/useDotAnimation.js

@@ -1,36 +1,78 @@
 import { useRef, useEffect } from 'react';
 import { ANIMATION_CONFIG, TIMING } from '../config';
-import { buildPathD, setMotionPath, setOffsetDistance, setOffsetRotate, setOffsetAnchor } from '../utils';
+import { buildPathControlPoints, samplePathByLength } from '../utils';
 import { AvatarState } from '@wix/aria-ai-avatar';
+const PATH_SAMPLES = 48;
+// Matches the dots' opacity transition in Astro.module.css.
+const DOT_FADE_OUT_DURATION = 150;
+const centerOf = el => {
+  const rect = el.getBoundingClientRect();
+  return {
+    x: rect.left + rect.width / 2,
+    y: rect.top + rect.height / 2
+  };
+};
+
+/**
+ * Where path coordinate (0, 0) lies relative to the dot's own center, i.e.
+ * the translation that puts the dot where `offset-path` with a centered
+ * `offset-anchor` would.
+ */
+const measurePathOrigin = el => {
+  const natural = centerOf(el);
+  el.style.offsetPath = 'path("M 0,0 L 1,0")';
+  el.style.offsetDistance = '0%';
+  el.style.offsetAnchor = '50% 50%';
+  el.style.offsetRotate = '0deg';
+  const origin = centerOf(el);
+  el.style.offsetPath = '';
+  el.style.offsetDistance = '';
+  el.style.offsetAnchor = '';
+  el.style.offsetRotate = '';
+  return {
+    x: origin.x - natural.x,
+    y: origin.y - natural.y
+  };
+};
 export const useDotAnimation = (moveToPosition, setAvatarHidden, triggerAvatarAnimationState, mode) => {
   const leadDotRef = useRef(null);
   const trailRefs = useRef([]);
   const isMountedRef = useRef(true);
-  const animateDotsAlongPath = async function (start, end, options) {
+  const travelRunRef = useRef(0);
+  const isCurrentTravel = run => isMountedRef.current && run === travelRunRef.current;
+
+  /**
+   * Resolves `false` when a newer travel interrupted this one. The dots fade
+   * out on the compositor when they arrive, so a busy main thread doesn't
+   * leave them sitting at the end of the path.
+   */
+  const animateDotsAlongPath = async function (run, start, end, options) {
     if (options === void 0) {
       options = {};
     }
     if (!isMountedRef.current) {
-      return;
+      return true;
     }
     const lead = leadDotRef.current;
     if (!lead) {
-      return;
+      return true;
     }
     if (!options.skipShrink) {
       try {
         triggerAvatarAnimationState(AvatarState.SMALL);
       } catch {}
     }
-    trailRefs.current.forEach((d, i) => {
-      if (!d) {
-        return;
-      }
+    [lead, ...trailRefs.current].forEach(d => d == null ? void 0 : d.getAnimations().forEach(animation => animation.cancel()));
+    const trailStyles = trailRefs.current.map((d, i) => {
       const ratio = (i + 1) / ANIMATION_CONFIG.TRAIL_COUNT;
-      const scale = ANIMATION_CONFIG.TRAIL_MIN_SCALE + (1 - ANIMATION_CONFIG.TRAIL_MIN_SCALE) * (1 - ratio);
       const opacity = ANIMATION_CONFIG.TRAIL_FADE + (1 - ANIMATION_CONFIG.TRAIL_FADE) * (1 - ratio);
-      d.style.opacity = String(opacity);
-      d.style.transform = `scale(${scale})`;
+      if (d) {
+        d.style.opacity = String(opacity);
+      }
+      return {
+        opacity,
+        scale: ANIMATION_CONFIG.TRAIL_MIN_SCALE + (1 - ANIMATION_CONFIG.TRAIL_MIN_SCALE) * (1 - ratio)
+      };
     });
     const leadStartColor = mode === 'dark' ? ANIMATION_CONFIG.DOT_COLOR : '#000000';
     lead.style.opacity = '1';
@@ -44,45 +86,60 @@ export const useDotAnimation = (moveToPosition, setAvatarHidden, triggerAvatarAn
       easing: 'ease-out',
       fill: 'forwards'
     });
-    const pathD = buildPathD(start, end);
-    const prepDot = el => {
-      if (!el) {
-        return;
+    const origin = measurePathOrigin(lead);
+    const points = samplePathByLength(buildPathControlPoints(start, end), PATH_SAMPLES);
+    const pathFrames = function (scale) {
+      if (scale === void 0) {
+        scale = 1;
       }
-      setMotionPath(el, pathD);
-      setOffsetDistance(el, '0%');
-      setOffsetRotate(el, '0deg');
-      setOffsetAnchor(el, '50% 50%');
+      return points.map(_ref => {
+        let x = _ref.x,
+          y = _ref.y;
+        return {
+          transform: `translate3d(${x + origin.x}px, ${y + origin.y}px, 0) scale(${scale})`
+        };
+      });
     };
-    prepDot(lead);
-    trailRefs.current.forEach(td => td && prepDot(td));
-    const leadAnim = lead.animate([{
-      offsetDistance: '0%'
+    // Once faded, the inline opacity follows, so the next travel's opacity
+    // change runs the dots' CSS fade-in from 0.
+    const fadeOut = (el, opacity) => el.animate([{
+      opacity
     }, {
-      offsetDistance: '100%'
+      opacity: 0
     }], {
+      delay: TIMING.TRAVEL_DURATION,
+      duration: DOT_FADE_OUT_DURATION,
+      easing: 'ease-in-out',
+      fill: 'forwards'
+    }).finished.then(() => {
+      if (run === travelRunRef.current) {
+        el.style.opacity = '0';
+      }
+    }, () => {});
+    const leadAnim = lead.animate(pathFrames(), {
       duration: TIMING.TRAVEL_DURATION,
       easing: ANIMATION_CONFIG.EASING,
-      fill: 'forwards'
+      fill: 'both'
     });
+    fadeOut(lead, 1);
     trailRefs.current.forEach((td, i) => {
       if (!td) {
         return;
       }
-      td.animate([{
-        offsetDistance: '0%'
-      }, {
-        offsetDistance: '100%'
-      }], {
+      td.animate(pathFrames(trailStyles[i].scale), {
         duration: TIMING.TRAVEL_DURATION,
         delay: (i + 1) * ANIMATION_CONFIG.TRAIL_STAGGER,
         easing: ANIMATION_CONFIG.EASING,
-        fill: 'forwards'
+        fill: 'both'
       });
+      fadeOut(td, trailStyles[i].opacity);
     });
-    await leadAnim.finished;
-    lead.style.opacity = '0';
-    trailRefs.current.forEach(td => td && (td.style.opacity = '0'));
+    try {
+      await leadAnim.finished;
+    } catch {
+      return false;
+    }
+    return run === travelRunRef.current;
   };
   const hideDots = () => {
     const lead = leadDotRef.current;
@@ -104,15 +161,18 @@ export const useDotAnimation = (moveToPosition, setAvatarHidden, triggerAvatarAn
       console.log('[Astro] Invalid position, skipping animation');
       return;
     }
+    const run = ++travelRunRef.current;
     const home = {
       x: 0,
       y: 0
     };
-    await animateDotsAlongPath(currentPosition, home, options);
+    if (!(await animateDotsAlongPath(run, currentPosition, home, options))) {
+      return;
+    }
     moveToPosition(home);
     setAvatarHidden(false);
     await waitForNextFrame();
-    if (isMountedRef.current) {
+    if (isCurrentTravel(run)) {
       if (options.endState) {
         await triggerAvatarAnimationState(options.endState);
       } else {
@@ -128,14 +188,17 @@ export const useDotAnimation = (moveToPosition, setAvatarHidden, triggerAvatarAn
       console.log('[Astro] Invalid position, skipping animation');
       return;
     }
+    const run = ++travelRunRef.current;
     setAvatarHidden(true);
     await waitForNextFrame();
+    if (!isCurrentTravel(run)) {
+      return;
+    }
     const home = {
       x: 0,
       y: 0
     };
-    await animateDotsAlongPath(home, targetPosition, options);
-    hideDots();
+    await animateDotsAlongPath(run, home, targetPosition, options);
   };
   useEffect(() => {
     return () => {

package/dist/esm/Astro/hooks/useDotAnimation.js.map

@@ -1 +1 @@
-{"version":3,"names":["useRef","useEffect","ANIMATION_CONFIG","TIMING","buildPathD","setMotionPath","setOffsetDistance","setOffsetRotate","setOffsetAnchor","AvatarState","useDotAnimation","moveToPosition","setAvatarHidden","triggerAvatarAnimationState","mode","leadDotRef","trailRefs","isMountedRef","animateDotsAlongPath","start","end","options","current","lead","skipShrink","SMALL","forEach","d","i","ratio","TRAIL_COUNT","scale","TRAIL_MIN_SCALE","opacity","TRAIL_FADE","style","String","transform","leadStartColor","DOT_COLOR","background","animate","duration","DOT_FADE_DURATION","easing","fill","pathD","prepDot","el","td","leadAnim","offsetDistance","TRAVEL_DURATION","EASING","delay","TRAIL_STAGGER","finished","hideDots","waitForNextFrame","Promise","r","requestAnimationFrame","moveFromOffsetWithDots","currentPosition","x","y","console","log","home","endState","IDLE","moveToOffsetWithDots","targetPosition"],"sources":["../../../../src/Astro/hooks/useDotAnimation.ts"],"sourcesContent":["import { useRef, useEffect } from 'react';\nimport type { Position, MoveOptions } from '../types';\nimport { ANIMATION_CONFIG, TIMING } from '../config';\nimport {\n  buildPathD,\n  setMotionPath,\n  setOffsetDistance,\n  setOffsetRotate,\n  setOffsetAnchor,\n} from '../utils';\nimport { AvatarState } from '@wix/aria-ai-avatar';\n\nexport const useDotAnimation = (\n  moveToPosition: (position: Position) => void,\n  setAvatarHidden: (hidden: boolean) => void,\n  triggerAvatarAnimationState: (state: AvatarState) => void,\n  mode?: 'light' | 'dark',\n) => {\n  const leadDotRef = useRef<HTMLDivElement | null>(null);\n  const trailRefs = useRef<(HTMLDivElement | null)[]>([]);\n  const isMountedRef = useRef(true);\n\n  const animateDotsAlongPath = async (\n    start: Position,\n    end: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (!isMountedRef.current) {\n      return;\n    }\n\n    const lead = leadDotRef.current;\n    if (!lead) {\n      return;\n    }\n\n    if (!options.skipShrink) {\n      try {\n        triggerAvatarAnimationState(AvatarState.SMALL);\n      } catch {}\n    }\n\n    trailRefs.current.forEach((d, i) => {\n      if (!d) {\n        return;\n      }\n      const ratio = (i + 1) / ANIMATION_CONFIG.TRAIL_COUNT;\n      const scale =\n        ANIMATION_CONFIG.TRAIL_MIN_SCALE +\n        (1 - ANIMATION_CONFIG.TRAIL_MIN_SCALE) * (1 - ratio);\n      const opacity =\n        ANIMATION_CONFIG.TRAIL_FADE +\n        (1 - ANIMATION_CONFIG.TRAIL_FADE) * (1 - ratio);\n      d.style.opacity = String(opacity);\n      d.style.transform = `scale(${scale})`;\n    });\n\n    const leadStartColor =\n      mode === 'dark' ? ANIMATION_CONFIG.DOT_COLOR : '#000000';\n\n    lead.style.opacity = '1';\n    lead.style.background = leadStartColor;\n\n    lead.animate(\n      [\n        { background: leadStartColor },\n        { background: ANIMATION_CONFIG.DOT_COLOR },\n      ],\n      {\n        duration: TIMING.DOT_FADE_DURATION,\n        easing: 'ease-out',\n        fill: 'forwards',\n      },\n    );\n\n    const pathD = buildPathD(start, end);\n\n    const prepDot = (el: HTMLElement) => {\n      if (!el) {\n        return;\n      }\n      setMotionPath(el, pathD);\n      setOffsetDistance(el, '0%');\n      setOffsetRotate(el, '0deg');\n      setOffsetAnchor(el, '50% 50%');\n    };\n\n    prepDot(lead);\n\n    trailRefs.current.forEach((td) => td && prepDot(td));\n\n    const leadAnim = lead.animate(\n      [{ offsetDistance: '0%' }, { offsetDistance: '100%' }],\n      {\n        duration: TIMING.TRAVEL_DURATION,\n        easing: ANIMATION_CONFIG.EASING,\n        fill: 'forwards',\n      },\n    );\n\n    trailRefs.current.forEach((td, i) => {\n      if (!td) {\n        return;\n      }\n      td.animate([{ offsetDistance: '0%' }, { offsetDistance: '100%' }], {\n        duration: TIMING.TRAVEL_DURATION,\n        delay: (i + 1) * ANIMATION_CONFIG.TRAIL_STAGGER,\n        easing: ANIMATION_CONFIG.EASING,\n        fill: 'forwards',\n      });\n    });\n\n    await leadAnim.finished;\n\n    lead.style.opacity = '0';\n    trailRefs.current.forEach((td) => td && (td.style.opacity = '0'));\n  };\n\n  const hideDots = () => {\n    const lead = leadDotRef.current;\n    if (lead) {\n      lead.style.opacity = '0';\n    }\n    trailRefs.current.forEach((td) => {\n      if (td) {\n        td.style.opacity = '0';\n      }\n    });\n  };\n\n  const waitForNextFrame = () =>\n    new Promise<void>((r) => requestAnimationFrame(() => r()));\n\n  const moveFromOffsetWithDots = async (\n    currentPosition: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (\n      typeof currentPosition.x !== 'number' ||\n      typeof currentPosition.y !== 'number'\n    ) {\n      console.log('[Astro] Invalid position, skipping animation');\n      return;\n    }\n\n    const home = { x: 0, y: 0 };\n    await animateDotsAlongPath(currentPosition, home, options);\n\n    moveToPosition(home);\n    setAvatarHidden(false);\n\n    await waitForNextFrame();\n\n    if (isMountedRef.current) {\n      if (options.endState) {\n        await triggerAvatarAnimationState(options.endState);\n      } else {\n        await triggerAvatarAnimationState(AvatarState.IDLE);\n      }\n    }\n  };\n\n  const moveToOffsetWithDots = async (\n    targetPosition: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (\n      typeof targetPosition.x !== 'number' ||\n      typeof targetPosition.y !== 'number'\n    ) {\n      console.log('[Astro] Invalid position, skipping animation');\n      return;\n    }\n\n    setAvatarHidden(true);\n    await waitForNextFrame();\n\n    const home = { x: 0, y: 0 };\n    await animateDotsAlongPath(home, targetPosition, options);\n\n    hideDots();\n  };\n\n  useEffect(() => {\n    return () => {\n      isMountedRef.current = false;\n    };\n  }, []);\n\n  return {\n    leadDotRef,\n    trailRefs,\n    moveFromOffsetWithDots,\n    moveToOffsetWithDots,\n    hideDots,\n  };\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useRef","useEffect","ANIMATION_CONFIG","TIMING","buildPathControlPoints","samplePathByLength","AvatarState","PATH_SAMPLES","DOT_FADE_OUT_DURATION","centerOf","el","rect","getBoundingClientRect","x","left","width","y","top","height","measurePathOrigin","natural","style","offsetPath","offsetDistance","offsetAnchor","offsetRotate","origin","useDotAnimation","moveToPosition","setAvatarHidden","triggerAvatarAnimationState","mode","leadDotRef","trailRefs","isMountedRef","travelRunRef","isCurrentTravel","run","current","animateDotsAlongPath","start","end","options","lead","skipShrink","SMALL","forEach","d","getAnimations","animation","cancel","trailStyles","map","i","ratio","TRAIL_COUNT","opacity","TRAIL_FADE","String","scale","TRAIL_MIN_SCALE","leadStartColor","DOT_COLOR","background","animate","duration","DOT_FADE_DURATION","easing","fill","points","pathFrames","_ref","transform","fadeOut","delay","TRAVEL_DURATION","finished","then","leadAnim","EASING","td","TRAIL_STAGGER","hideDots","waitForNextFrame","Promise","r","requestAnimationFrame","moveFromOffsetWithDots","currentPosition","console","log","home","endState","IDLE","moveToOffsetWithDots","targetPosition"],"sources":["../../../../src/Astro/hooks/useDotAnimation.ts"],"sourcesContent":["import { useRef, useEffect } from 'react';\nimport type { Position, MoveOptions } from '../types';\nimport { ANIMATION_CONFIG, TIMING } from '../config';\nimport { buildPathControlPoints, samplePathByLength } from '../utils';\nimport { AvatarState } from '@wix/aria-ai-avatar';\n\nconst PATH_SAMPLES = 48;\n// Matches the dots' opacity transition in Astro.module.css.\nconst DOT_FADE_OUT_DURATION = 150;\n\nconst centerOf = (el: HTMLElement) => {\n  const rect = el.getBoundingClientRect();\n  return { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 };\n};\n\n/**\n * Where path coordinate (0, 0) lies relative to the dot's own center, i.e.\n * the translation that puts the dot where `offset-path` with a centered\n * `offset-anchor` would.\n */\nconst measurePathOrigin = (el: HTMLElement): Position => {\n  const natural = centerOf(el);\n  el.style.offsetPath = 'path(\"M 0,0 L 1,0\")';\n  el.style.offsetDistance = '0%';\n  (el.style as any).offsetAnchor = '50% 50%';\n  el.style.offsetRotate = '0deg';\n  const origin = centerOf(el);\n  el.style.offsetPath = '';\n  el.style.offsetDistance = '';\n  (el.style as any).offsetAnchor = '';\n  el.style.offsetRotate = '';\n  return { x: origin.x - natural.x, y: origin.y - natural.y };\n};\n\nexport const useDotAnimation = (\n  moveToPosition: (position: Position) => void,\n  setAvatarHidden: (hidden: boolean) => void,\n  triggerAvatarAnimationState: (state: AvatarState) => void,\n  mode?: 'light' | 'dark',\n) => {\n  const leadDotRef = useRef<HTMLDivElement | null>(null);\n  const trailRefs = useRef<(HTMLDivElement | null)[]>([]);\n  const isMountedRef = useRef(true);\n  const travelRunRef = useRef(0);\n\n  const isCurrentTravel = (run: number) =>\n    isMountedRef.current && run === travelRunRef.current;\n\n  /**\n   * Resolves `false` when a newer travel interrupted this one. The dots fade\n   * out on the compositor when they arrive, so a busy main thread doesn't\n   * leave them sitting at the end of the path.\n   */\n  const animateDotsAlongPath = async (\n    run: number,\n    start: Position,\n    end: Position,\n    options: MoveOptions = {},\n  ): Promise<boolean> => {\n    if (!isMountedRef.current) {\n      return true;\n    }\n\n    const lead = leadDotRef.current;\n    if (!lead) {\n      return true;\n    }\n\n    if (!options.skipShrink) {\n      try {\n        triggerAvatarAnimationState(AvatarState.SMALL);\n      } catch {}\n    }\n\n    [lead, ...trailRefs.current].forEach((d) =>\n      d?.getAnimations().forEach((animation) => animation.cancel()),\n    );\n\n    const trailStyles = trailRefs.current.map((d, i) => {\n      const ratio = (i + 1) / ANIMATION_CONFIG.TRAIL_COUNT;\n      const opacity =\n        ANIMATION_CONFIG.TRAIL_FADE +\n        (1 - ANIMATION_CONFIG.TRAIL_FADE) * (1 - ratio);\n      if (d) {\n        d.style.opacity = String(opacity);\n      }\n      return {\n        opacity,\n        scale:\n          ANIMATION_CONFIG.TRAIL_MIN_SCALE +\n          (1 - ANIMATION_CONFIG.TRAIL_MIN_SCALE) * (1 - ratio),\n      };\n    });\n\n    const leadStartColor =\n      mode === 'dark' ? ANIMATION_CONFIG.DOT_COLOR : '#000000';\n\n    lead.style.opacity = '1';\n    lead.style.background = leadStartColor;\n\n    lead.animate(\n      [\n        { background: leadStartColor },\n        { background: ANIMATION_CONFIG.DOT_COLOR },\n      ],\n      {\n        duration: TIMING.DOT_FADE_DURATION,\n        easing: 'ease-out',\n        fill: 'forwards',\n      },\n    );\n\n    const origin = measurePathOrigin(lead);\n    const points = samplePathByLength(\n      buildPathControlPoints(start, end),\n      PATH_SAMPLES,\n    );\n    const pathFrames = (scale = 1): Keyframe[] =>\n      points.map(({ x, y }) => ({\n        transform: `translate3d(${x + origin.x}px, ${\n          y + origin.y\n        }px, 0) scale(${scale})`,\n      }));\n    // Once faded, the inline opacity follows, so the next travel's opacity\n    // change runs the dots' CSS fade-in from 0.\n    const fadeOut = (el: HTMLElement, opacity: number) =>\n      el\n        .animate([{ opacity }, { opacity: 0 }], {\n          delay: TIMING.TRAVEL_DURATION,\n          duration: DOT_FADE_OUT_DURATION,\n          easing: 'ease-in-out',\n          fill: 'forwards',\n        })\n        .finished.then(\n          () => {\n            if (run === travelRunRef.current) {\n              el.style.opacity = '0';\n            }\n          },\n          () => {},\n        );\n\n    const leadAnim = lead.animate(pathFrames(), {\n      duration: TIMING.TRAVEL_DURATION,\n      easing: ANIMATION_CONFIG.EASING,\n      fill: 'both',\n    });\n    fadeOut(lead, 1);\n\n    trailRefs.current.forEach((td, i) => {\n      if (!td) {\n        return;\n      }\n      td.animate(pathFrames(trailStyles[i].scale), {\n        duration: TIMING.TRAVEL_DURATION,\n        delay: (i + 1) * ANIMATION_CONFIG.TRAIL_STAGGER,\n        easing: ANIMATION_CONFIG.EASING,\n        fill: 'both',\n      });\n      fadeOut(td, trailStyles[i].opacity);\n    });\n\n    try {\n      await leadAnim.finished;\n    } catch {\n      return false;\n    }\n    return run === travelRunRef.current;\n  };\n\n  const hideDots = () => {\n    const lead = leadDotRef.current;\n    if (lead) {\n      lead.style.opacity = '0';\n    }\n    trailRefs.current.forEach((td) => {\n      if (td) {\n        td.style.opacity = '0';\n      }\n    });\n  };\n\n  const waitForNextFrame = () =>\n    new Promise<void>((r) => requestAnimationFrame(() => r()));\n\n  const moveFromOffsetWithDots = async (\n    currentPosition: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (\n      typeof currentPosition.x !== 'number' ||\n      typeof currentPosition.y !== 'number'\n    ) {\n      console.log('[Astro] Invalid position, skipping animation');\n      return;\n    }\n\n    const run = ++travelRunRef.current;\n    const home = { x: 0, y: 0 };\n\n    if (!(await animateDotsAlongPath(run, currentPosition, home, options))) {\n      return;\n    }\n\n    moveToPosition(home);\n    setAvatarHidden(false);\n\n    await waitForNextFrame();\n\n    if (isCurrentTravel(run)) {\n      if (options.endState) {\n        await triggerAvatarAnimationState(options.endState);\n      } else {\n        await triggerAvatarAnimationState(AvatarState.IDLE);\n      }\n    }\n  };\n\n  const moveToOffsetWithDots = async (\n    targetPosition: Position,\n    options: MoveOptions = {},\n  ): Promise<void> => {\n    if (\n      typeof targetPosition.x !== 'number' ||\n      typeof targetPosition.y !== 'number'\n    ) {\n      console.log('[Astro] Invalid position, skipping animation');\n      return;\n    }\n\n    const run = ++travelRunRef.current;\n    setAvatarHidden(true);\n    await waitForNextFrame();\n\n    if (!isCurrentTravel(run)) {\n      return;\n    }\n\n    const home = { x: 0, y: 0 };\n    await animateDotsAlongPath(run, home, targetPosition, options);\n  };\n\n  useEffect(() => {\n    return () => {\n      isMountedRef.current = false;\n    };\n  }, []);\n\n  return {\n    leadDotRef,\n    trailRefs,\n    moveFromOffsetWithDots,\n    moveToOffsetWithDots,\n    hideDots,\n  };\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/Astro/utils/pathGeneration.js

@@ -1,16 +1,85 @@
 import { ANIMATION_CONFIG } from '../config';
-export const buildPathD = (start, end) => {
+export const buildPathControlPoints = (start, end) => {
   const dx = end.x - start.x;
   const dy = end.y - start.y;
   const len = Math.max(1, Math.hypot(dx, dy));
   const nx = -dy / len;
   const ny = dx / len;
   const sway = ANIMATION_CONFIG.SWAY_AMOUNT * (0.85 + Math.random() * 0.3);
-  const c1x = start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_1 + nx * sway;
-  const c1y = start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_1 + ny * sway;
-  const c2x = start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_2 - nx * (sway * 0.65);
-  const c2y = start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_2 - ny * (sway * 0.65);
-  return `M ${start.x},${start.y} C ${c1x},${c1y} ${c2x},${c2y} ${end.x},${end.y}`;
+  return {
+    start,
+    c1: {
+      x: start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_1 + nx * sway,
+      y: start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_1 + ny * sway
+    },
+    c2: {
+      x: start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_2 - nx * (sway * 0.65),
+      y: start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_2 - ny * (sway * 0.65)
+    },
+    end
+  };
+};
+export const buildPathD = (start, end) => {
+  const _buildPathControlPoin = buildPathControlPoints(start, end),
+    c1 = _buildPathControlPoin.c1,
+    c2 = _buildPathControlPoin.c2;
+  return `M ${start.x},${start.y} C ${c1.x},${c1.y} ${c2.x},${c2.y} ${end.x},${end.y}`;
+};
+const pointOnCubic = (_ref, t) => {
+  let start = _ref.start,
+    c1 = _ref.c1,
+    c2 = _ref.c2,
+    end = _ref.end;
+  const u = 1 - t;
+  const a = u * u * u;
+  const b = 3 * u * u * t;
+  const c = 3 * u * t * t;
+  const d = t * t * t;
+  return {
+    x: a * start.x + b * c1.x + c * c2.x + d * end.x,
+    y: a * start.y + b * c1.y + c * c2.y + d * end.y
+  };
+};
+
+/**
+ * Points evenly spaced by arc length, so a linear keyframe interpolation
+ * between them moves like `offset-distance` does along the same path.
+ */
+export const samplePathByLength = (path, count) => {
+  const STEPS = 200;
+  const lut = [];
+  let length = 0;
+  let prev = pointOnCubic(path, 0);
+  lut.push({
+    point: prev,
+    length: 0
+  });
+  for (let i = 1; i <= STEPS; i++) {
+    const point = pointOnCubic(path, i / STEPS);
+    length += Math.hypot(point.x - prev.x, point.y - prev.y);
+    lut.push({
+      point,
+      length
+    });
+    prev = point;
+  }
+  const points = [];
+  let j = 1;
+  for (let i = 0; i < count; i++) {
+    const target = length * i / (count - 1);
+    while (j < lut.length - 1 && lut[j].length < target) {
+      j++;
+    }
+    const from = lut[j - 1];
+    const to = lut[j];
+    const span = to.length - from.length || 1;
+    const k = Math.min(1, Math.max(0, (target - from.length) / span));
+    points.push({
+      x: from.point.x + (to.point.x - from.point.x) * k,
+      y: from.point.y + (to.point.y - from.point.y) * k
+    });
+  }
+  return points;
 };
 export const setMotionPath = (el, pathD) => {
   el.style.offsetPath = `path("${pathD}")`;

package/dist/esm/Astro/utils/pathGeneration.js.map

@@ -1 +1 @@
-{"version":3,"names":["ANIMATION_CONFIG","buildPathD","start","end","dx","x","dy","y","len","Math","max","hypot","nx","ny","sway","SWAY_AMOUNT","random","c1x","CONTROL_POINT_1","c1y","c2x","CONTROL_POINT_2","c2y","setMotionPath","el","pathD","style","offsetPath","setOffsetDistance","value","offsetDistance","setOffsetRotate","offsetRotate","setOffsetAnchor","offsetAnchor"],"sources":["../../../../src/Astro/utils/pathGeneration.ts"],"sourcesContent":["import type { Position } from '../types';\nimport { ANIMATION_CONFIG } from '../config';\n\nexport const buildPathD = (start: Position, end: Position): string => {\n  const dx = end.x - start.x;\n  const dy = end.y - start.y;\n  const len = Math.max(1, Math.hypot(dx, dy));\n  const nx = -dy / len;\n  const ny = dx / len;\n\n  const sway = ANIMATION_CONFIG.SWAY_AMOUNT * (0.85 + Math.random() * 0.3);\n\n  const c1x = start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_1 + nx * sway;\n  const c1y = start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_1 + ny * sway;\n  const c2x =\n    start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_2 - nx * (sway * 0.65);\n  const c2y =\n    start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_2 - ny * (sway * 0.65);\n\n  return `M ${start.x},${start.y} C ${c1x},${c1y} ${c2x},${c2y} ${end.x},${end.y}`;\n};\n\nexport const setMotionPath = (el: HTMLElement, pathD: string): void => {\n  el.style.offsetPath = `path(\"${pathD}\")`;\n};\n\nexport const setOffsetDistance = (el: HTMLElement, value: string): void => {\n  el.style.offsetDistance = value;\n};\n\nexport const setOffsetRotate = (el: HTMLElement, value: string): void => {\n  el.style.offsetRotate = value;\n};\n\nexport const setOffsetAnchor = (el: HTMLElement, value: string): void => {\n  (el.style as any).offsetAnchor = value;\n};\n"],"mappings":"AACA,SAASA,gBAAgB,QAAQ,WAAW;AAE5C,OAAO,MAAMC,UAAU,GAAGA,CAACC,KAAe,EAAEC,GAAa,KAAa;EACpE,MAAMC,EAAE,GAAGD,GAAG,CAACE,CAAC,GAAGH,KAAK,CAACG,CAAC;EAC1B,MAAMC,EAAE,GAAGH,GAAG,CAACI,CAAC,GAAGL,KAAK,CAACK,CAAC;EAC1B,MAAMC,GAAG,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,KAAK,CAACP,EAAE,EAAEE,EAAE,CAAC,CAAC;EAC3C,MAAMM,EAAE,GAAG,CAACN,EAAE,GAAGE,GAAG;EACpB,MAAMK,EAAE,GAAGT,EAAE,GAAGI,GAAG;EAEnB,MAAMM,IAAI,GAAGd,gBAAgB,CAACe,WAAW,IAAI,IAAI,GAAGN,IAAI,CAACO,MAAM,CAAC,CAAC,GAAG,GAAG,CAAC;EAExE,MAAMC,GAAG,GAAGf,KAAK,CAACG,CAAC,GAAGD,EAAE,GAAGJ,gBAAgB,CAACkB,eAAe,GAAGN,EAAE,GAAGE,IAAI;EACvE,MAAMK,GAAG,GAAGjB,KAAK,CAACK,CAAC,GAAGD,EAAE,GAAGN,gBAAgB,CAACkB,eAAe,GAAGL,EAAE,GAAGC,IAAI;EACvE,MAAMM,GAAG,GACPlB,KAAK,CAACG,CAAC,GAAGD,EAAE,GAAGJ,gBAAgB,CAACqB,eAAe,GAAGT,EAAE,IAAIE,IAAI,GAAG,IAAI,CAAC;EACtE,MAAMQ,GAAG,GACPpB,KAAK,CAACK,CAAC,GAAGD,EAAE,GAAGN,gBAAgB,CAACqB,eAAe,GAAGR,EAAE,IAAIC,IAAI,GAAG,IAAI,CAAC;EAEtE,OAAO,KAAKZ,KAAK,CAACG,CAAC,IAAIH,KAAK,CAACK,CAAC,MAAMU,GAAG,IAAIE,GAAG,IAAIC,GAAG,IAAIE,GAAG,IAAInB,GAAG,CAACE,CAAC,IAAIF,GAAG,CAACI,CAAC,EAAE;AAClF,CAAC;AAED,OAAO,MAAMgB,aAAa,GAAGA,CAACC,EAAe,EAAEC,KAAa,KAAW;EACrED,EAAE,CAACE,KAAK,CAACC,UAAU,GAAG,SAASF,KAAK,IAAI;AAC1C,CAAC;AAED,OAAO,MAAMG,iBAAiB,GAAGA,CAACJ,EAAe,EAAEK,KAAa,KAAW;EACzEL,EAAE,CAACE,KAAK,CAACI,cAAc,GAAGD,KAAK;AACjC,CAAC;AAED,OAAO,MAAME,eAAe,GAAGA,CAACP,EAAe,EAAEK,KAAa,KAAW;EACvEL,EAAE,CAACE,KAAK,CAACM,YAAY,GAAGH,KAAK;AAC/B,CAAC;AAED,OAAO,MAAMI,eAAe,GAAGA,CAACT,EAAe,EAAEK,KAAa,KAAW;EACtEL,EAAE,CAACE,KAAK,CAASQ,YAAY,GAAGL,KAAK;AACxC,CAAC","ignoreList":[]}
+{"version":3,"names":["ANIMATION_CONFIG","buildPathControlPoints","start","end","dx","x","dy","y","len","Math","max","hypot","nx","ny","sway","SWAY_AMOUNT","random","c1","CONTROL_POINT_1","c2","CONTROL_POINT_2","buildPathD","_buildPathControlPoin","pointOnCubic","_ref","t","u","a","b","c","d","samplePathByLength","path","count","STEPS","lut","length","prev","push","point","i","points","j","target","from","to","span","k","min","setMotionPath","el","pathD","style","offsetPath","setOffsetDistance","value","offsetDistance","setOffsetRotate","offsetRotate","setOffsetAnchor","offsetAnchor"],"sources":["../../../../src/Astro/utils/pathGeneration.ts"],"sourcesContent":["import type { Position } from '../types';\nimport { ANIMATION_CONFIG } from '../config';\n\ntype CubicPath = { start: Position; c1: Position; c2: Position; end: Position };\n\nexport const buildPathControlPoints = (\n  start: Position,\n  end: Position,\n): CubicPath => {\n  const dx = end.x - start.x;\n  const dy = end.y - start.y;\n  const len = Math.max(1, Math.hypot(dx, dy));\n  const nx = -dy / len;\n  const ny = dx / len;\n\n  const sway = ANIMATION_CONFIG.SWAY_AMOUNT * (0.85 + Math.random() * 0.3);\n\n  return {\n    start,\n    c1: {\n      x: start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_1 + nx * sway,\n      y: start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_1 + ny * sway,\n    },\n    c2: {\n      x: start.x + dx * ANIMATION_CONFIG.CONTROL_POINT_2 - nx * (sway * 0.65),\n      y: start.y + dy * ANIMATION_CONFIG.CONTROL_POINT_2 - ny * (sway * 0.65),\n    },\n    end,\n  };\n};\n\nexport const buildPathD = (start: Position, end: Position): string => {\n  const { c1, c2 } = buildPathControlPoints(start, end);\n  return `M ${start.x},${start.y} C ${c1.x},${c1.y} ${c2.x},${c2.y} ${end.x},${end.y}`;\n};\n\nconst pointOnCubic = (\n  { start, c1, c2, end }: CubicPath,\n  t: number,\n): Position => {\n  const u = 1 - t;\n  const a = u * u * u;\n  const b = 3 * u * u * t;\n  const c = 3 * u * t * t;\n  const d = t * t * t;\n  return {\n    x: a * start.x + b * c1.x + c * c2.x + d * end.x,\n    y: a * start.y + b * c1.y + c * c2.y + d * end.y,\n  };\n};\n\n/**\n * Points evenly spaced by arc length, so a linear keyframe interpolation\n * between them moves like `offset-distance` does along the same path.\n */\nexport const samplePathByLength = (\n  path: CubicPath,\n  count: number,\n): Position[] => {\n  const STEPS = 200;\n  const lut: { point: Position; length: number }[] = [];\n  let length = 0;\n  let prev = pointOnCubic(path, 0);\n  lut.push({ point: prev, length: 0 });\n  for (let i = 1; i <= STEPS; i++) {\n    const point = pointOnCubic(path, i / STEPS);\n    length += Math.hypot(point.x - prev.x, point.y - prev.y);\n    lut.push({ point, length });\n    prev = point;\n  }\n\n  const points: Position[] = [];\n  let j = 1;\n  for (let i = 0; i < count; i++) {\n    const target = (length * i) / (count - 1);\n    while (j < lut.length - 1 && lut[j].length < target) {\n      j++;\n    }\n    const from = lut[j - 1];\n    const to = lut[j];\n    const span = to.length - from.length || 1;\n    const k = Math.min(1, Math.max(0, (target - from.length) / span));\n    points.push({\n      x: from.point.x + (to.point.x - from.point.x) * k,\n      y: from.point.y + (to.point.y - from.point.y) * k,\n    });\n  }\n  return points;\n};\n\nexport const setMotionPath = (el: HTMLElement, pathD: string): void => {\n  el.style.offsetPath = `path(\"${pathD}\")`;\n};\n\nexport const setOffsetDistance = (el: HTMLElement, value: string): void => {\n  el.style.offsetDistance = value;\n};\n\nexport const setOffsetRotate = (el: HTMLElement, value: string): void => {\n  el.style.offsetRotate = value;\n};\n\nexport const setOffsetAnchor = (el: HTMLElement, value: string): void => {\n  (el.style as any).offsetAnchor = value;\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/types/Astro/Astro.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Astro.d.ts","sourceRoot":"","sources":["../../../src/Astro/Astro.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAe,MAAM,SAAS,CAAC;AAMjE,eAAO,MAAM,iBAAiB,6EA8K7B,CAAC"}
+{"version":3,"file":"Astro.d.ts","sourceRoot":"","sources":["../../../src/Astro/Astro.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAe,MAAM,SAAS,CAAC;AASjE,eAAO,MAAM,iBAAiB,6EAyM7B,CAAC"}

package/dist/types/Astro/hooks/useDotAnimation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDotAnimation.d.ts","sourceRoot":"","sources":["../../../../src/Astro/hooks/useDotAnimation.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAStD,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElD,eAAO,MAAM,eAAe,GAC1B,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,EAC5C,iBAAiB,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,EAC1C,6BAA6B,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,EACzD,OAAO,OAAO,GAAG,MAAM;;;8CAsHJ,QAAQ,YAChB,WAAW,KACnB,OAAO,CAAC,IAAI,CAAC;2CA2BE,QAAQ,YACf,WAAW,KACnB,OAAO,CAAC,IAAI,CAAC;;CA+BjB,CAAC"}
+{"version":3,"file":"useDotAnimation.d.ts","sourceRoot":"","sources":["../../../../src/Astro/hooks/useDotAnimation.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAGtD,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AA8BlD,eAAO,MAAM,eAAe,GAC1B,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,EAC5C,iBAAiB,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,EAC1C,6BAA6B,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,EACzD,OAAO,OAAO,GAAG,MAAM;;;8CAoJJ,QAAQ,YAChB,WAAW,KACnB,OAAO,CAAC,IAAI,CAAC;2CA+BE,QAAQ,YACf,WAAW,KACnB,OAAO,CAAC,IAAI,CAAC;;CAkCjB,CAAC"}

package/dist/types/Astro/utils/pathGeneration.d.ts

@@ -1,7 +1,20 @@
 import type { Position } from '../types';
+type CubicPath = {
+    start: Position;
+    c1: Position;
+    c2: Position;
+    end: Position;
+};
+export declare const buildPathControlPoints: (start: Position, end: Position) => CubicPath;
 export declare const buildPathD: (start: Position, end: Position) => string;
+/**
+ * Points evenly spaced by arc length, so a linear keyframe interpolation
+ * between them moves like `offset-distance` does along the same path.
+ */
+export declare const samplePathByLength: (path: CubicPath, count: number) => Position[];
 export declare const setMotionPath: (el: HTMLElement, pathD: string) => void;
 export declare const setOffsetDistance: (el: HTMLElement, value: string) => void;
 export declare const setOffsetRotate: (el: HTMLElement, value: string) => void;
 export declare const setOffsetAnchor: (el: HTMLElement, value: string) => void;
+export {};
 //# sourceMappingURL=pathGeneration.d.ts.map

package/dist/types/Astro/utils/pathGeneration.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pathGeneration.d.ts","sourceRoot":"","sources":["../../../../src/Astro/utils/pathGeneration.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAGzC,eAAO,MAAM,UAAU,GAAI,OAAO,QAAQ,EAAE,KAAK,QAAQ,KAAG,MAiB3D,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,IAAI,WAAW,EAAE,OAAO,MAAM,KAAG,IAE9D,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,IAAI,WAAW,EAAE,OAAO,MAAM,KAAG,IAElE,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,IAAI,WAAW,EAAE,OAAO,MAAM,KAAG,IAEhE,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,IAAI,WAAW,EAAE,OAAO,MAAM,KAAG,IAEhE,CAAC"}
+{"version":3,"file":"pathGeneration.d.ts","sourceRoot":"","sources":["../../../../src/Astro/utils/pathGeneration.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAGzC,KAAK,SAAS,GAAG;IAAE,KAAK,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,QAAQ,CAAC;IAAC,GAAG,EAAE,QAAQ,CAAA;CAAE,CAAC;AAEhF,eAAO,MAAM,sBAAsB,GACjC,OAAO,QAAQ,EACf,KAAK,QAAQ,KACZ,SAqBF,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,QAAQ,EAAE,KAAK,QAAQ,KAAG,MAG3D,CAAC;AAiBF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,GAC7B,MAAM,SAAS,EACf,OAAO,MAAM,KACZ,QAAQ,EA8BV,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,IAAI,WAAW,EAAE,OAAO,MAAM,KAAG,IAE9D,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,IAAI,WAAW,EAAE,OAAO,MAAM,KAAG,IAElE,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,IAAI,WAAW,EAAE,OAAO,MAAM,KAAG,IAEhE,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,IAAI,WAAW,EAAE,OAAO,MAAM,KAAG,IAEhE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/ai-assistant-avatar",
-  "version": "0.44.0",
+  "version": "0.45.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
@@ -83,5 +83,5 @@
   "yoshiFlowLibrary": {
     "buildEsmWithBabel": true
   },
-  "falconPackageHash": "ee4e8d64c4bcf3d3601630411400915769682025c2ad163b34383166"
+  "falconPackageHash": "271c6bfc0b51c51ee58ec4367ac1c27fd9320f63ec494d9655d01b11"
 }