@solid-primitives/resize-observer - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

dist/index.d.ts

@@ -1,6 +0,1 @@
-export declare type ObservedSize = {
-    width: number | undefined;
-    height: number | undefined;
-};
-export declare type ResizeHandler = (size: ObservedSize, ref: Element) => void;
 /**
@@ -18,2 +13,3 @@ * Create resize observer is a helper primitive for binding resize events.
 }): (arg: T) => void;
-export default createResizeObserver;
+
+export { createResizeObserver as default };

dist/index.js

@@ -0,57 +1,52 @@
+// src/index.ts
 import { createEffect, createSignal, onCleanup } from "solid-js";
-/**
- * Create resize observer is a helper primitive for binding resize events.
- *
- * @param opts.refs - Either an `HTMLElement`, an array of `HTMLElement`s, or a signal returning one of these.
- * @param opts.onResize - Function handler to trigger on resize
- * @return A callback that can be used to add refs to observe resizing
- *
- */
 function createResizeObserver(opts) {
-    const [otherRefs, setOtherRefs] = createSignal([]);
-    // @ts-ignore
-    const refCallback = (e) => setOtherRefs((l) => l.concat(e));
-    const previousMap = new Map();
-    const resizeObserver = new ResizeObserver(entries => {
-        if (!Array.isArray(entries)) {
-            return;
-        }
-        for (const entry of entries) {
-            const newWidth = Math.round(entry.contentRect.width);
-            const newHeight = Math.round(entry.contentRect.height);
-            const previous = previousMap.get(entry.target);
-            if (!previous || previous.width !== newWidth || previous.height !== newHeight) {
-                const newSize = { width: newWidth, height: newHeight };
-                opts.onResize(newSize, entry.target);
-                previousMap.set(entry.target, { width: newWidth, height: newHeight });
-            }
-        }
+  const [otherRefs, setOtherRefs] = createSignal([]);
+  const refCallback = (e) => setOtherRefs((l) => l.concat(e));
+  const previousMap = new Map();
+  const resizeObserver = new ResizeObserver((entries) => {
+    if (!Array.isArray(entries)) {
+      return;
+    }
+    for (const entry of entries) {
+      const newWidth = Math.round(entry.contentRect.width);
+      const newHeight = Math.round(entry.contentRect.height);
+      const previous = previousMap.get(entry.target);
+      if (!previous || previous.width !== newWidth || previous.height !== newHeight) {
+        const newSize = { width: newWidth, height: newHeight };
+        opts.onResize(newSize, entry.target);
+        previousMap.set(entry.target, { width: newWidth, height: newHeight });
+      }
+    }
+  });
+  createEffect((oldRefs) => {
+    let refs = [];
+    if (opts.refs) {
+      const optsRefs = typeof opts.refs === "function" ? opts.refs() : opts.refs;
+      if (Array.isArray(optsRefs))
+        refs = refs.concat(optsRefs);
+      else
+        refs.push(optsRefs);
+    }
+    refs = refs.concat(otherRefs());
+    oldRefs = oldRefs || [];
+    oldRefs.forEach((oldRef) => {
+      if (!(oldRef in refs)) {
+        resizeObserver.unobserve(oldRef);
+        previousMap.delete(oldRef);
+      }
     });
-    createEffect((oldRefs) => {
-        let refs = [];
-        if (opts.refs) {
-            const optsRefs = typeof opts.refs === "function" ? opts.refs() : opts.refs;
-            if (Array.isArray(optsRefs))
-                refs = refs.concat(optsRefs);
-            else
-                refs.push(optsRefs);
-        }
-        refs = refs.concat(otherRefs());
-        oldRefs = oldRefs || [];
-        oldRefs.forEach(oldRef => {
-            if (!(oldRef in refs)) {
-                resizeObserver.unobserve(oldRef);
-                previousMap.delete(oldRef);
-            }
-        });
-        refs.forEach(ref => {
-            if (!(ref in oldRefs)) {
-                resizeObserver.observe(ref);
-            }
-        });
-        return refs;
+    refs.forEach((ref) => {
+      if (!(ref in oldRefs)) {
+        resizeObserver.observe(ref);
+      }
     });
-    onCleanup(() => resizeObserver.disconnect());
-    return refCallback;
+    return refs;
+  });
+  onCleanup(() => resizeObserver.disconnect());
+  return refCallback;
 }
-export default createResizeObserver;
+var src_default = createResizeObserver;
+export {
+  src_default as default
+};

package.json

 {
   "name": "@solid-primitives/resize-observer",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Primitive to observer browser resizes",
   "author": "Moshe Udimar",
   "license": "MIT",
-  "homepage": "https://github.com/davedbase/solid-primitives/tree/main/packages/audio",
-  "private": false,
-  "main": "dist/index.js",
-  "module": "dist/index.js",
-  "type": "module",
-  "types": "dist/index.d.ts",
+  "homepage": "https://github.com/davedbase/solid-primitives/tree/main/packages/resize-observer",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/davedbase/solid-primitives.git"
+  },
+  "primitive": {
+    "name": "resiz-observer",
+    "stage": 3,
+    "list": [
+      "createResizeObserver"
+    ],
+    "category": "Display & Media"
+  },
   "files": [
     "dist"
   ],
+  "private": false,
+  "sideEffects": false,
+  "type": "module",
+  "main": "./dist/server.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
   "exports": {
-    "require": "./dist/cjs/index.js",
+    "node": {
+      "import": "./dist/server.js",
+      "require": "./dist/server.cjs"
+    },
     "import": "./dist/index.js",
-    "default": "./dist/index.js"
+    "require": "./dist/index.cjs"
   },
-  "sideEffects": "false",
   "scripts": {
-    "prebuild": "npm run clean",
-    "clean": "rimraf dist/",
-    "build": "tsc && tsc --target es5 --module commonjs --declaration false --outDir ./dist/cjs"
+    "build": "tsup"
   },
@@ -38,2 +51,3 @@ "keywords": [
     "tslib": "^2.0.1",
+    "tsup": "^5.10.1",
     "typescript": "^4.0.2"
@@ -40,0 +54,0 @@ },

README.md

@@ -1,9 +0,1 @@
----
-Name: resize-observer
-Stage: 3
-Package: "@solid-primitives/resize-observer"
-Primitives: createResizeObserver
-Category: Display & Media
----
-
 # solid-primitives/resize-observer
@@ -17,2 +9,12 @@
 
+## Installation
+
+```
+npm install @solid-primitives/resize-observer
+# or
+yarn add @solid-primitives/resize-observer
+```
+
+## How to use it
+
 `createResizeObserver` - Main resize observer primitive.
@@ -29,5 +31,5 @@
 
-1.0.1
+1.0.2
 
-Release initial version for CJS support.
+Release initial version for CJS and SSR support.
 
@@ -34,0 +36,0 @@ </details>

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

9367

increased by9.97%

Number of package files

8

increased by33.33%

Lines of code

169

increased by25.19%

Number of lines in readme file

39

increased by5.41%

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dev dependency count

6

increased by20%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes