@solid-primitives/media - npm Package Compare versions

Comparing version 2.1.3 to 2.1.4

dist/index.d.ts

@@ -46,3 +46,3 @@ import { Accessor } from 'solid-js';
  *
- * This is a [shared root primitive](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSharedRoot) except if during hydration.
+ * This is a [singleton root primitive](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSingletonRoot) except if during hydration.
  *
@@ -49,0 +49,0 @@ * @returns a boolean signal

dist/index.js

@@ -1,5 +0,4 @@
-import { sharedConfig } from 'solid-js';
 import { makeEventListener } from '@solid-primitives/event-listener';
-import { createHydrateSignal, createStaticStore, entries } from '@solid-primitives/utils';
-import { createSharedRoot } from '@solid-primitives/rootless';
+import { createHydratableSignal, createHydratableStaticStore, entries } from '@solid-primitives/utils';
+import { createHydratableSingletonRoot } from '@solid-primitives/rootless';
 
@@ -13,3 +12,3 @@ // src/index.ts
   const mql = window.matchMedia(query);
-  const [state, setState] = createHydrateSignal(serverFallback, () => mql.matches);
+  const [state, setState] = createHydratableSignal(serverFallback, () => mql.matches);
   const update = () => setState(mql.matches);
@@ -22,6 +21,5 @@ makeEventListener(mql, "change", update);
 }
-var sharedPrefersDark = /* @__PURE__ */ createSharedRoot(
+var usePrefersDark = /* @__PURE__ */ createHydratableSingletonRoot(
   createPrefersDark.bind(void 0, false)
 );
-var usePrefersDark = () => sharedConfig.context ? createPrefersDark() : sharedPrefersDark();
 var getEmptyMatchesFromBreakpoints = (breakpoints) => {
@@ -33,17 +31,16 @@ const matches = {};
 function createBreakpoints(breakpoints, options = {}) {
+  const fallback = options.fallbackState ?? getEmptyMatchesFromBreakpoints(breakpoints);
   if (!window.matchMedia)
-    return options.fallbackState ?? getEmptyMatchesFromBreakpoints(breakpoints);
+    return fallback;
   const { mediaFeature = "min-width", watchChange = true } = options;
-  const [matches, setMatches] = createStaticStore(
-    (() => {
-      const matches2 = {};
-      entries(breakpoints).forEach(([token, width]) => {
-        const mql = window.matchMedia(`(${mediaFeature}: ${width})`);
-        matches2[token] = mql.matches;
-        if (watchChange)
-          makeEventListener(mql, "change", (e) => setMatches(token, e.matches));
-      });
-      return matches2;
-    })()
-  );
+  const [matches, setMatches] = createHydratableStaticStore(fallback, () => {
+    const matches2 = {};
+    entries(breakpoints).forEach(([token, width]) => {
+      const mql = window.matchMedia(`(${mediaFeature}: ${width})`);
+      matches2[token] = mql.matches;
+      if (watchChange)
+        makeEventListener(mql, "change", (e) => setMatches(token, e.matches));
+    });
+    return matches2;
+  });
   return matches;
@@ -50,0 +47,0 @@ }

dist/server.js

@@ -1,5 +0,4 @@
-import 'solid-js';
 import '@solid-primitives/event-listener';
 import { noop, entries } from '@solid-primitives/utils';
-import { createSharedRoot } from '@solid-primitives/rootless';
+import { createHydratableSingletonRoot } from '@solid-primitives/rootless';
 
@@ -20,6 +19,5 @@ // src/index.ts
 }
-/* @__PURE__ */ createSharedRoot(
+var usePrefersDark = /* @__PURE__ */ createHydratableSingletonRoot(
   createPrefersDark.bind(void 0, false)
 );
-var usePrefersDark = () => () => false ;
 var getEmptyMatchesFromBreakpoints = (breakpoints) => {
@@ -31,5 +29,6 @@ const matches = {};
 function createBreakpoints(breakpoints, options = {}) {
-  return options.fallbackState ?? getEmptyMatchesFromBreakpoints(breakpoints);
+  const fallback = options.fallbackState ?? getEmptyMatchesFromBreakpoints(breakpoints);
+  return fallback;
 }
 
 export { createBreakpoints, createMediaQuery, createPrefersDark, makeMediaQueryListener, usePrefersDark };

package.json

 {
   "name": "@solid-primitives/media",
-  "version": "2.1.3",
+  "version": "2.1.4",
   "description": "Primitives for media query and device features",
@@ -91,4 +91,4 @@ "author": "David Di Biase <[e-mail]>",
     "@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"
   },
@@ -95,0 +95,0 @@ "peerDependencies": {

README.md

@@ -139,3 +139,3 @@ <p>
 
-This primitive provides a [shared root](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSharedRoot) variant that will reuse the same signal and media query across the whole application.
+This primitive provides a [singleton root](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSingletonRoot) variant that will reuse the same signal and media query across the whole application.
 
@@ -142,0 +142,0 @@ ```ts

No alert changes

Worsened metrics

Total package byte prevSize

18535

-0.81%

Lines of code

242

-3.2%

Dependency changes

• Updated

  @solid-primitives/rootless@^1.3.0

• Updated

  @solid-primitives/utils@^5.5.0