@supermousejs/stick 2.0.0 → 2.0.2

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @supermousejs/stick
 
+## 2.0.2
+
+### Patch Changes
+
+- ae219a0: Update READMEs with correct link to documentation
+- Updated dependencies [ae219a0]
+  - @supermousejs/utils@2.0.2
+  - @supermousejs/core@2.0.2
+
+## 2.0.1
+
+### Patch Changes
+
+- Add minimal README.md files to packages
+- Updated dependencies
+  - @supermousejs/utils@2.0.1
+  - @supermousejs/core@2.0.1
+
 ## 2.0.0
 
 ### Major Changes

package/README.md

@@ -0,0 +1,33 @@
+
+# @supermousejs/stick
+
+A **Logic Plugin** that calculates the bounding box of hovered elements.
+Used in combination with `@supermousejs/ring` (or SmartRing) to create a morphing effect.
+
+## Installation
+
+```bash
+pnpm add @supermousejs/stick
+```
+
+## Usage
+
+```ts
+import { Supermouse } from '@supermousejs/core';
+import { Stick } from '@supermousejs/stick';
+import { Ring } from '@supermousejs/ring';
+
+const app = new Supermouse();
+
+app.use(Stick({ padding: 10 }));
+app.use(Ring()); // Ring automatically detects 'stick' state and morphs
+```
+
+**HTML:**
+```html
+<button data-supermouse-stick="true">Sticky Element</button>
+```
+
+## Documentation
+
+Full documentation and interactive playground available at [supermouse](https://supermouse.vercel.app) or [check out the repo](https://github.com/Whitestar14/supermouse-js).

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@supermousejs/stick",
-  "version": "2.0.0",
+  "version": "2.0.2",
   "main": "dist/index.umd.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@supermousejs/core": "2.0.0",
-    "@supermousejs/utils": "2.0.0"
+    "@supermousejs/core": "2.0.2",
+    "@supermousejs/utils": "2.0.2"
   },
   "devDependencies": {},
   "peerDependencies": {},

package/src/index.ts

@@ -1,73 +1,73 @@
-
-import type { ValueOrGetter } from '@supermousejs/core';
-import { definePlugin, normalize, dom } from '@supermousejs/utils';
-
-export interface StickOptions {
-  name?: string;
-  isEnabled?: boolean;
-  /** Extra padding around the element when calculating shape. Default 10. */
-  padding?: ValueOrGetter<number>;
-}
-
-export const Stick = (options: StickOptions = {}) => {
-  const getPadding = normalize(options.padding, 10);
-  
-  let lastTarget: HTMLElement | null = null;
-  let cache: { width: number; height: number; radius: number; x: number; y: number } | null = null;
-
-  return definePlugin({
-    name: options.name || 'stick',
-    // Logic plugin: must run before visuals to set the shape state
-    priority: -10, 
-    
-    install(app) {
-      app.registerHoverTarget('[data-supermouse-stick]');
-    },
-
-    update(app) {
-      // Check normalized interaction key (camelCase, no prefix)
-      const target = app.state.hoverTarget;
-      const isSticky = app.state.interaction.stick === true || app.state.interaction.stick === 'true';
-      
-      if (target && isSticky) {
-        
-        // Recalculate only if target changed or on first frame
-        if (target !== lastTarget || !cache) {
-          lastTarget = target;
-          
-          const rect = dom.projectRect(target, app.container);
-          const style = window.getComputedStyle(target);
-          const padding = getPadding(app.state);
-
-          cache = {
-            width: rect.width + padding,
-            height: rect.height + padding,
-            radius: parseFloat(style.borderRadius) || 0,
-            x: rect.left + rect.width / 2,
-            y: rect.top + rect.height / 2
-          };
-        }
-
-        if (cache) {
-          // 1. Override Target (Physics) - Snap target to center of element
-          app.state.target.x = cache.x;
-          app.state.target.y = cache.y;
-
-          // 2. Set Shape (Visuals) - Visual plugins like Ring will read this
-          app.state.shape = {
-            width: cache.width,
-            height: cache.height,
-            borderRadius: cache.radius
-          };
-        }
-      } else {
-        // Reset
-        if (lastTarget) {
-          lastTarget = null;
-          cache = null;
-        }
-        app.state.shape = null;
-      }
-    }
-  }, options);
-};
+
+import type { ValueOrGetter } from '@supermousejs/core';
+import { definePlugin, normalize, dom } from '@supermousejs/utils';
+
+export interface StickOptions {
+  name?: string;
+  isEnabled?: boolean;
+  /** Extra padding around the element when calculating shape. Default 10. */
+  padding?: ValueOrGetter<number>;
+}
+
+export const Stick = (options: StickOptions = {}) => {
+  const getPadding = normalize(options.padding, 10);
+  
+  let lastTarget: HTMLElement | null = null;
+  let cache: { width: number; height: number; radius: number; x: number; y: number } | null = null;
+
+  return definePlugin({
+    name: options.name || 'stick',
+    // Logic plugin: must run before visuals to set the shape state
+    priority: -10, 
+    
+    install(app) {
+      app.registerHoverTarget('[data-supermouse-stick]');
+    },
+
+    update(app) {
+      // Check normalized interaction key (camelCase, no prefix)
+      const target = app.state.hoverTarget;
+      const isSticky = app.state.interaction.stick === true || app.state.interaction.stick === 'true';
+      
+      if (target && isSticky) {
+        
+        // Recalculate only if target changed or on first frame
+        if (target !== lastTarget || !cache) {
+          lastTarget = target;
+          
+          const rect = dom.projectRect(target, app.container);
+          const style = window.getComputedStyle(target);
+          const padding = getPadding(app.state);
+
+          cache = {
+            width: rect.width + padding,
+            height: rect.height + padding,
+            radius: parseFloat(style.borderRadius) || 0,
+            x: rect.left + rect.width / 2,
+            y: rect.top + rect.height / 2
+          };
+        }
+
+        if (cache) {
+          // 1. Override Target (Physics) - Snap target to center of element
+          app.state.target.x = cache.x;
+          app.state.target.y = cache.y;
+
+          // 2. Set Shape (Visuals) - Visual plugins like Ring will read this
+          app.state.shape = {
+            width: cache.width,
+            height: cache.height,
+            borderRadius: cache.radius
+          };
+        }
+      } else {
+        // Reset
+        if (lastTarget) {
+          lastTarget = null;
+          cache = null;
+        }
+        app.state.shape = null;
+      }
+    }
+  }, options);
+};

package/tsconfig.json

@@ -1,18 +1,18 @@
-{
-  "extends": "../../tsconfig.base.json",
-  "include": [
-    "src"
-  ],
-  "compilerOptions": {
-    "outDir": "dist",
-    "baseUrl": ".",
-    "paths": {
-      "@supermousejs/core": [
-        "../core/src/index.ts"
-      ],
-      "@supermousejs/utils": [
-        "../utils/src/index.ts"
-      ]
-    }
-  }
+{
+  "extends": "../../tsconfig.base.json",
+  "include": [
+    "src"
+  ],
+  "compilerOptions": {
+    "outDir": "dist",
+    "baseUrl": ".",
+    "paths": {
+      "@supermousejs/core": [
+        "../core/src/index.ts"
+      ],
+      "@supermousejs/utils": [
+        "../utils/src/index.ts"
+      ]
+    }
+  }
 }

package/vite.config.ts

@@ -1,22 +1,22 @@
-import { defineConfig } from 'vite';
-import dts from 'vite-plugin-dts';
-import path from 'path';
-
-export default defineConfig({
-  build: {
-    lib: {
-      entry: path.resolve(__dirname, 'src/index.ts'),
-      name: 'SupermouseStick',
-      fileName: (format) => format === 'es' ? 'index.mjs' : 'index.umd.js',
-    },
-    rollupOptions: {
-      external: ['@supermousejs/core', '@supermousejs/utils'],
-      output: {
-        globals: {
-          '@supermousejs/core': 'SupermouseCore'
-        , '@supermousejs/utils': 'SupermouseUtils'}
-      }
-    }
-  },
-  plugins: [dts({ rollupTypes: true })]
+import { defineConfig } from 'vite';
+import dts from 'vite-plugin-dts';
+import path from 'path';
+
+export default defineConfig({
+  build: {
+    lib: {
+      entry: path.resolve(__dirname, 'src/index.ts'),
+      name: 'SupermouseStick',
+      fileName: (format) => format === 'es' ? 'index.mjs' : 'index.umd.js',
+    },
+    rollupOptions: {
+      external: ['@supermousejs/core', '@supermousejs/utils'],
+      output: {
+        globals: {
+          '@supermousejs/core': 'SupermouseCore'
+        , '@supermousejs/utils': 'SupermouseUtils'}
+      }
+    }
+  },
+  plugins: [dts({ rollupTypes: true })]
 });