@pathscale/ui 0.0.151 → 0.0.153

package/dist/index.js

@@ -10512,7 +10512,7 @@ const FloatingDock_DockItem = (props)=>{
         "function" == typeof _ref$2 ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$2, _el$3) : iconRef = _el$3;
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, ()=>props.item.icon);
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
-            var _v$5 = twMerge("relative flex items-center justify-center rounded-full bg-base-200 transition-[opacity,transform] duration-150 hover:opacity-100 active:scale-90 active:duration-75", "opacity-80", cfg.itemClass), _v$6 = `${cfg.baseSize}px`, _v$7 = `${cfg.baseSize}px`;
+            var _v$5 = twMerge("relative flex items-center justify-center rounded-full bg-base-200 transition-opacity duration-150 hover:opacity-100 active:opacity-60", "opacity-80", cfg.itemClass), _v$6 = `${cfg.baseSize}px`, _v$7 = `${cfg.baseSize}px`;
             _v$5 !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$, _p$.e = _v$5);
             _v$6 !== _p$.t && (null != (_p$.t = _v$6) ? _el$.style.setProperty("width", _v$6) : _el$.style.removeProperty("width"));
             _v$7 !== _p$.a && (null != (_p$.a = _v$7) ? _el$.style.setProperty("height", _v$7) : _el$.style.removeProperty("height"));
@@ -10568,6 +10568,17 @@ const FloatingDockDesktop = (props)=>{
     let prevTime = 0;
     let lastMousePos = 1 / 0;
     let loopRunning = false;
+    let anchorCenters = [];
+    const captureAnchors = ()=>{
+        anchorCenters = [];
+        for(let i = 0; i < itemSprings.length; i++){
+            const wrap = itemSprings[i].wrapRef;
+            if (wrap) {
+                const b = wrap.getBoundingClientRect();
+                anchorCenters[i] = isH() ? b.x + b.width / 2 : b.y + b.height / 2;
+            }
+        }
+    };
     const startLoop = ()=>{
         if (loopRunning || !cfg.magnify) return;
         loopRunning = true;
@@ -10585,18 +10596,10 @@ const FloatingDockDesktop = (props)=>{
         const mp = mousePos();
         if (mp !== lastMousePos) {
             lastMousePos = mp;
-            const centers = [];
-            for(let i = 0; i < itemSprings.length; i++){
-                const wrap = itemSprings[i].wrapRef;
-                if (wrap) {
-                    const b = wrap.getBoundingClientRect();
-                    centers[i] = isH() ? b.x + b.width / 2 : b.y + b.height / 2;
-                } else centers[i] = 0;
-            }
             for(let i = 0; i < itemSprings.length; i++){
                 const s = itemSprings[i];
-                if (!s.wrapRef) continue;
-                const dist = Math.abs(mp - centers[i]);
+                if (!s.wrapRef || void 0 === anchorCenters[i]) continue;
+                const dist = Math.abs(mp - anchorCenters[i]);
                 const ts = mp === 1 / 0 ? cfg.baseSize : mapRange(dist, 0, cfg.magnifyRange, cfg.hoverSize, cfg.baseSize);
                 const ti = mp === 1 / 0 ? cfg.iconSize : mapRange(dist, 0, cfg.magnifyRange, cfg.hoverIconSize, cfg.iconSize);
                 s.sW.set(ts);
@@ -10617,31 +10620,31 @@ const FloatingDockDesktop = (props)=>{
         for(let i = 0; i < itemSprings.length; i++){
             const s = itemSprings[i];
             if (s.wrapRef) {
-                s.wrapRef.style.width = `${s.sW.get()}px`;
-                s.wrapRef.style.height = `${s.sH.get()}px`;
+                const scale = s.sW.get() / cfg.baseSize;
+                s.wrapRef.style.transform = `scale(${scale})`;
             }
             if (s.iconRef) {
-                s.iconRef.style.width = `${s.sIW.get()}px`;
-                s.iconRef.style.height = `${s.sIH.get()}px`;
+                const iconScale = s.sIW.get() / cfg.iconSize;
+                s.iconRef.style.transform = `scale(${iconScale})`;
             }
         }
         if (allSettled) return void stopLoop();
         rafId = requestAnimationFrame(tick);
     };
-    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onMount)(()=>{
-        if (!cfg.magnify) return;
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createEffect)(()=>{
-            mousePos();
-            startLoop();
-        });
-    });
     (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onCleanup)(()=>{
         stopLoop();
     });
     return (()=>{
         var _el$6 = FloatingDock_tmpl$5();
-        _el$6.addEventListener("mouseleave", ()=>setMousePos(1 / 0));
-        _el$6.$$mousemove = (e)=>setMousePos(isH() ? e.clientX : e.clientY);
+        _el$6.addEventListener("mouseleave", ()=>{
+            setMousePos(1 / 0);
+            startLoop();
+        });
+        _el$6.$$mousemove = (e)=>{
+            setMousePos(isH() ? e.clientX : e.clientY);
+            startLoop();
+        };
+        _el$6.addEventListener("mouseenter", captureAnchors);
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$6, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.For, {
             get each () {
                 return props.items;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pathscale/ui",
-  "version": "0.0.151",
+  "version": "0.0.153",
   "author": "pathscale",
   "repository": {
     "type": "git",
@@ -57,6 +57,7 @@
   },
   "dependencies": {
     "@iconify/tailwind4": "^1.2.1",
+    "@pathscale/ui": "0.0.152",
     "rsbuild-plugin-iconify": "^1.0.3"
   },
   "peerDependencies": {