@solid-primitives/styles 0.0.102 → 0.0.104

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/dev.cjs +5 -2
  2. package/dist/dev.js +6 -3
  3. package/dist/index.cjs +5 -2
  4. package/dist/index.d.ts +2 -1
  5. package/dist/index.js +6 -3
  6. package/dist/server.cjs +1 -0
  7. package/dist/server.js +1 -0
  8. package/package.json +6 -3
package/dist/dev.cjs CHANGED
@@ -2,8 +2,10 @@
2
2
 
3
3
  var rootless = require('@solid-primitives/rootless');
4
4
  var solidJs = require('solid-js');
5
+ var utils = require('@solid-primitives/utils');
5
6
 
6
7
  // src/index.ts
8
+ var serverRemSize = 16;
7
9
  var totallyHiddenStyles = {
8
10
  border: "0",
9
11
  padding: "0",
@@ -14,7 +16,7 @@ var totallyHiddenStyles = {
14
16
  };
15
17
  exports.getRemSize = () => parseFloat(getComputedStyle(document.documentElement).fontSize);
16
18
  function createRemSize() {
17
- const [remSize, setRemSize] = solidJs.createSignal(exports.getRemSize());
19
+ const [remSize, setRemSize] = utils.createHydrateSignal(serverRemSize, exports.getRemSize);
18
20
  const el = document.createElement("div");
19
21
  Object.assign(el.style, totallyHiddenStyles, { width: "1rem" });
20
22
  document.body.appendChild(el);
@@ -31,7 +33,8 @@ function createRemSize() {
31
33
  });
32
34
  return remSize;
33
35
  }
34
- exports.useRemSize = /* @__PURE__ */ rootless.createSharedRoot(createRemSize);
36
+ var sharedRemSize = /* @__PURE__ */ rootless.createSharedRoot(createRemSize);
37
+ exports.useRemSize = () => solidJs.sharedConfig.context ? createRemSize() : sharedRemSize();
35
38
  exports.setServerRemSize = () => {
36
39
  };
37
40
 
package/dist/dev.js CHANGED
@@ -1,7 +1,9 @@
1
1
  import { createSharedRoot } from '@solid-primitives/rootless';
2
- import { createSignal, onCleanup } from 'solid-js';
2
+ import { onCleanup, sharedConfig } from 'solid-js';
3
+ import { createHydrateSignal } from '@solid-primitives/utils';
3
4
 
4
5
  // src/index.ts
6
+ var serverRemSize = 16;
5
7
  var totallyHiddenStyles = {
6
8
  border: "0",
7
9
  padding: "0",
@@ -12,7 +14,7 @@ var totallyHiddenStyles = {
12
14
  };
13
15
  var getRemSize = () => parseFloat(getComputedStyle(document.documentElement).fontSize);
14
16
  function createRemSize() {
15
- const [remSize, setRemSize] = createSignal(getRemSize());
17
+ const [remSize, setRemSize] = createHydrateSignal(serverRemSize, getRemSize);
16
18
  const el = document.createElement("div");
17
19
  Object.assign(el.style, totallyHiddenStyles, { width: "1rem" });
18
20
  document.body.appendChild(el);
@@ -29,7 +31,8 @@ function createRemSize() {
29
31
  });
30
32
  return remSize;
31
33
  }
32
- var useRemSize = /* @__PURE__ */ createSharedRoot(createRemSize);
34
+ var sharedRemSize = /* @__PURE__ */ createSharedRoot(createRemSize);
35
+ var useRemSize = () => sharedConfig.context ? createRemSize() : sharedRemSize();
33
36
  var setServerRemSize = () => {
34
37
  };
35
38
 
package/dist/index.cjs CHANGED
@@ -2,8 +2,10 @@
2
2
 
3
3
  var rootless = require('@solid-primitives/rootless');
4
4
  var solidJs = require('solid-js');
5
+ var utils = require('@solid-primitives/utils');
5
6
 
6
7
  // src/index.ts
8
+ var serverRemSize = 16;
7
9
  var totallyHiddenStyles = {
8
10
  border: "0",
9
11
  padding: "0",
@@ -14,7 +16,7 @@ var totallyHiddenStyles = {
14
16
  };
15
17
  exports.getRemSize = () => parseFloat(getComputedStyle(document.documentElement).fontSize);
16
18
  function createRemSize() {
17
- const [remSize, setRemSize] = solidJs.createSignal(exports.getRemSize());
19
+ const [remSize, setRemSize] = utils.createHydrateSignal(serverRemSize, exports.getRemSize);
18
20
  const el = document.createElement("div");
19
21
  Object.assign(el.style, totallyHiddenStyles, { width: "1rem" });
20
22
  document.body.appendChild(el);
@@ -31,7 +33,8 @@ function createRemSize() {
31
33
  });
32
34
  return remSize;
33
35
  }
34
- exports.useRemSize = /* @__PURE__ */ rootless.createSharedRoot(createRemSize);
36
+ var sharedRemSize = /* @__PURE__ */ rootless.createSharedRoot(createRemSize);
37
+ exports.useRemSize = () => solidJs.sharedConfig.context ? createRemSize() : sharedRemSize();
35
38
  exports.setServerRemSize = () => {
36
39
  };
37
40
 
package/dist/index.d.ts CHANGED
@@ -16,7 +16,8 @@ declare function createRemSize(): Accessor<number>;
16
16
  /**
17
17
  * Returns a reactive signal with value of the current rem size, and tracks it's changes.
18
18
  *
19
- * This is a [shared root primitive](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSharedRoot).
19
+ * This is a [shared root primitive](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSharedRoot) except if during hydration.
20
+ *
20
21
  * @returns A signal with the current rem size in pixels.
21
22
  * @see [Primitive documentation](https://github.com/solidjs-community/solid-primitives/tree/main/packages/styles#useRemSize).
22
23
  * @example
package/dist/index.js CHANGED
@@ -1,7 +1,9 @@
1
1
  import { createSharedRoot } from '@solid-primitives/rootless';
2
- import { createSignal, onCleanup } from 'solid-js';
2
+ import { onCleanup, sharedConfig } from 'solid-js';
3
+ import { createHydrateSignal } from '@solid-primitives/utils';
3
4
 
4
5
  // src/index.ts
6
+ var serverRemSize = 16;
5
7
  var totallyHiddenStyles = {
6
8
  border: "0",
7
9
  padding: "0",
@@ -12,7 +14,7 @@ var totallyHiddenStyles = {
12
14
  };
13
15
  var getRemSize = () => parseFloat(getComputedStyle(document.documentElement).fontSize);
14
16
  function createRemSize() {
15
- const [remSize, setRemSize] = createSignal(getRemSize());
17
+ const [remSize, setRemSize] = createHydrateSignal(serverRemSize, getRemSize);
16
18
  const el = document.createElement("div");
17
19
  Object.assign(el.style, totallyHiddenStyles, { width: "1rem" });
18
20
  document.body.appendChild(el);
@@ -29,7 +31,8 @@ function createRemSize() {
29
31
  });
30
32
  return remSize;
31
33
  }
32
- var useRemSize = /* @__PURE__ */ createSharedRoot(createRemSize);
34
+ var sharedRemSize = /* @__PURE__ */ createSharedRoot(createRemSize);
35
+ var useRemSize = () => sharedConfig.context ? createRemSize() : sharedRemSize();
33
36
  var setServerRemSize = () => {
34
37
  };
35
38
 
package/dist/server.cjs CHANGED
@@ -2,6 +2,7 @@
2
2
 
3
3
  require('@solid-primitives/rootless');
4
4
  require('solid-js');
5
+ require('@solid-primitives/utils');
5
6
 
6
7
  // src/index.ts
7
8
  var serverRemSize = 16;
package/dist/server.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import '@solid-primitives/rootless';
2
2
  import 'solid-js';
3
+ import '@solid-primitives/utils';
3
4
 
4
5
  // src/index.ts
5
6
  var serverRemSize = 16;
package/package.json CHANGED
@@ -1,9 +1,11 @@
1
1
  {
2
2
  "name": "@solid-primitives/styles",
3
- "version": "0.0.102",
3
+ "version": "0.0.104",
4
4
  "description": "Collection of reactive primitives focused on styles.",
5
5
  "author": "Damian Tarnawski <gthetaranv@gmail.com>",
6
- "contributors": [],
6
+ "contributors": [
7
+ "Tom Pichaud <dev.tompichaud@icloud.com>"
8
+ ],
7
9
  "license": "MIT",
8
10
  "homepage": "https://github.com/solidjs-community/solid-primitives/tree/main/packages/styles#readme",
9
11
  "repository": {
@@ -90,7 +92,8 @@
90
92
  "css"
91
93
  ],
92
94
  "dependencies": {
93
- "@solid-primitives/rootless": "^1.2.2"
95
+ "@solid-primitives/rootless": "^1.2.5",
96
+ "@solid-primitives/utils": "^5.2.1"
94
97
  },
95
98
  "peerDependencies": {
96
99
  "solid-js": "^1.6.0"