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

Comparing version 2.0.11 to 2.0.12

dist/index.d.ts

@@ -54,3 +54,3 @@ import { Accessor } from 'solid-js';
  *
- * This is a [shared root](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSharedRoot) primitive.
+ * This is a [singleton root](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSingletonRoot) primitive.
  *
@@ -57,0 +57,0 @@ * @example

dist/index.js

@@ -1,4 +0,4 @@
-import { onCleanup, $PROXY, createEffect, on, onMount, $TRACK } from 'solid-js';
-import { asArray, handleDiffArray, createStaticStore } from '@solid-primitives/utils';
-import { createSharedRoot } from '@solid-primitives/rootless';
+import { onCleanup, $PROXY, createEffect, on, sharedConfig, onMount, $TRACK } from 'solid-js';
+import { asArray, handleDiffArray, createHydratableStaticStore, createStaticStore, access } from '@solid-primitives/utils';
+import { createHydratableSingletonRoot } from '@solid-primitives/rootless';
 import { makeEventListener } from '@solid-primitives/event-listener';
@@ -46,2 +46,3 @@
 }
+var WINDOW_SIZE_FALLBACK = { width: 0, height: 0 };
 function getWindowSize() {
@@ -54,11 +55,12 @@ return {
 function createWindowSize() {
-  const [size, setSize] = createStaticStore(getWindowSize());
-  const updateSize = () => setSize(getWindowSize());
-  makeEventListener(window, "resize", updateSize);
+  const [size, setSize] = createHydratableStaticStore(WINDOW_SIZE_FALLBACK, getWindowSize);
+  makeEventListener(window, "resize", () => setSize(getWindowSize()));
   return size;
 }
-var useWindowSize = /* @__PURE__ */ createSharedRoot(createWindowSize);
+var useWindowSize = /* @__PURE__ */ createHydratableSingletonRoot(createWindowSize);
+var ELEMENT_SIZE_FALLBACK = { width: null, height: null };
 function getElementSize(target) {
-  if (!target)
-    return { width: null, height: null };
+  if (!target) {
+    return { ...ELEMENT_SIZE_FALLBACK };
+  }
   const { width, height } = target.getBoundingClientRect();
@@ -68,10 +70,12 @@ return { width, height };
 function createElementSize(target) {
+  const isFn = typeof target === "function";
+  const initWithFallback = isFn || sharedConfig.context;
   const [size, setSize] = createStaticStore(
-    typeof target !== "function" ? getElementSize(target) : (() => {
-      onMount(() => setSize(getElementSize(target())));
-      return { width: null, height: null };
-    })()
+    initWithFallback ? ELEMENT_SIZE_FALLBACK : getElementSize(target)
   );
-  const updateSize = (e) => setSize({ width: e.width, height: e.height });
-  createResizeObserver(typeof target === "function" ? () => target() || [] : target, updateSize);
+  initWithFallback && onMount(() => setSize(getElementSize(access(target))));
+  createResizeObserver(
+    isFn ? () => target() || [] : target,
+    (e) => setSize({ width: e.width, height: e.height })
+  );
   return size;
@@ -78,0 +82,0 @@ }

dist/server.js

 import 'solid-js';
 import '@solid-primitives/utils';
-import { createSharedRoot } from '@solid-primitives/rootless';
+import { createHydratableSingletonRoot } from '@solid-primitives/rootless';
 import '@solid-primitives/event-listener';
@@ -20,17 +20,21 @@
 }
+var WINDOW_SIZE_FALLBACK = { width: 0, height: 0 };
 function getWindowSize() {
-  return { width: 0, height: 0 };
+  return { ...WINDOW_SIZE_FALLBACK };
 }
 function createWindowSize() {
   {
-    return getWindowSize();
+    return WINDOW_SIZE_FALLBACK;
   }
 }
-var useWindowSize = /* @__PURE__ */ createSharedRoot(createWindowSize);
+var useWindowSize = /* @__PURE__ */ createHydratableSingletonRoot(createWindowSize);
+var ELEMENT_SIZE_FALLBACK = { width: null, height: null };
 function getElementSize(target) {
-  return { width: null, height: null };
+  {
+    return { ...ELEMENT_SIZE_FALLBACK };
+  }
 }
 function createElementSize(target) {
   {
-    return { width: null, height: null };
+    return ELEMENT_SIZE_FALLBACK;
   }
@@ -37,0 +41,0 @@ }

package.json

 {
   "name": "@solid-primitives/resize-observer",
-  "version": "2.0.11",
+  "version": "2.0.12",
   "description": "Reactive primitives for observing resizing of HTML elements.",
@@ -81,4 +81,4 @@ "author": "Moshe Udimar",
     "@solid-primitives/event-listener": "^2.2.8",
-    "@solid-primitives/rootless": "^1.2.6",
-    "@solid-primitives/utils": "^5.4.0"
+    "@solid-primitives/rootless": "^1.3.0",
+    "@solid-primitives/utils": "^5.5.0"
   },
@@ -85,0 +85,0 @@ "peerDependencies": {

README.md

@@ -122,3 +122,3 @@ <p>
 
-`useWindowSize` is a [shared root](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSharedRoot) primitive. It is providing the same reactive object as `createWindowSize`, but the object instance, signals and event-listeners are shared between dependents, making it more optimized to use in multiple places at once.
+`useWindowSize` is a [singleton root](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSingletonRoot) primitive. It is providing the same reactive object as `createWindowSize`, but the object instance, signals and event-listeners are shared between dependents, making it more optimized to use in multiple places at once.
 
@@ -125,0 +125,0 @@ ```ts

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

21181

increased by3.3%

Lines of code

344

increased by4.88%

Dependency changes

• Updated@solid-primitives/rootless@^1.3.0

• Updated@solid-primitives/utils@^5.5.0