@atomico/hooks - npm Package Compare versions

Comparing version 3.36.0 to 3.36.1

package.json

 {
   "name": "@atomico/hooks",
   "description": "Series of utilities in hooks format to extend the operation of Atomico",
-  "version": "3.36.0",
+  "version": "3.36.1",
   "type": "module",
@@ -20,4 +20,3 @@ "workspaces": [
     "atomico": "^1.45.0",
-    "@lit/reactive-element": "^1.0.2",
-    "@atomico/design-tokens": "latest"
+    "@lit/reactive-element": "^1.0.2"
   },
@@ -72,3 +71,2 @@ "devDependencies": {
     "@atomico/channel": "^0.0.0",
-    "@atomico/design-tokens": "latest",
     "dollars.js": "^0.6.2",
@@ -75,0 +73,0 @@ "element-internals-polyfill": "^0.1.49",

src/use-channel/package.json

 {
+  "type": "module",
   "dependencies": {
@@ -3,0 +4,0 @@ "@atomico/channel": "^0.0.0"

src/use-controller/package.json

 {
+  "type": "module",
   "devDependencies": {
@@ -3,0 +4,0 @@ "@lit/reactive-element": "^1.0.2"

src/use-css-light-dom/src/utils.js

@@ -49,1 +49,51 @@ /**
 }
+
+/***
+ * @type {HTMLIFrameElement}
+ */
+let sandbox;
+
+/**
+ *
+ * @param {import("atomico").Sheet} style
+ * @returns
+ */
+export function getSheet(style) {
+  if (style instanceof CSSStyleSheet) {
+    return style;
+  }
+
+  if (style.sheet) {
+    return style.sheet;
+  }
+
+  if (!sandbox) {
+    sandbox = document.createElement("iframe");
+    sandbox.style.display = "none";
+    document.body.appendChild(sandbox);
+  }
+
+  const { contentDocument } = sandbox;
+
+  contentDocument.head.appendChild(style);
+
+  const { sheet } = style;
+
+  const { cloneNode } = style;
+
+  /**
+   *
+   * @param {boolean} [deep]
+   * @returns {HTMLElement}
+   */
+  style.cloneNode = (deep) => {
+    const copy = cloneNode.call(style);
+    const { cssRules } = sheet;
+    for (let i = 0; i < cssRules.length; i++) {
+      copy.textContent += cssRules[i].cssText;
+    }
+    return copy;
+  };
+
+  return sheet;
+}

src/use-css-light-dom/use-css-light-dom.js

 import { useHost, useLayoutEffect } from "atomico";
-import { getSheet } from "@atomico/design-tokens";
-import { getRules } from "./src/utils.js";
+import { getRules, getSheet } from "./src/utils.js";
 
@@ -5,0 +4,0 @@ let ID = 0;

src/use-dollars/package.json

 {
+  "type": "module",
   "dependencies": {
@@ -3,0 +4,0 @@ "dollars.js": "^0.6.2"

src/use-form-submitter/package.json

 {
+  "type": "module",
   "dependencies": {
@@ -3,0 +4,0 @@ "@uppercod/form-tools": "^0.0.0"

src/use-form/package.json

 {
+  "type": "module",
   "dependencies": {
@@ -3,0 +4,0 @@ "element-internals-polyfill": "^0.1.49"

src/use-router/package.json

 {
+  "type": "module",
   "dependencies": {
@@ -3,0 +4,0 @@ "@uppercod/exp-route": "^1.3.0"

src/use-unique-id-selector/package.json

 {
+  "type": "module",
   "dependencies": {
@@ -3,0 +4,0 @@ "@uppercod/hash": "^1.1.1"

types/use-css-light-dom/src/utils.d.ts

@@ -5,1 +5,7 @@ /**
 export function getRules(Sheet: any, scopeSelector: any): any;
+/**
+ *
+ * @param {import("atomico").Sheet} style
+ * @returns
+ */
+export function getSheet(style: import("atomico").Sheet): CSSStyleSheet | null;

No alert changes

Improved metrics

Total package byte prevSize

94899

increased by0.96%

Dependency count

8

decreased by-20%

Lines of code

2806

increased by1.63%

Worsened metrics

Number of package files

115

decreased by-0.86%

Dependency changes

• - Removed@atomico/design-tokens@latest

• - Removed@atomico/design-tokens@1.5.2(transitive)