@fusion.dev/helix 0.57.0 → 0.58.1

package/custom-elements.json

@@ -79705,40 +79705,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/orb/color.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "readColor",
-          "return": {
-            "type": {
-              "text": "[number, number, number]"
-            }
-          },
-          "parameters": [
-            {
-              "name": "value",
-              "type": {
-                "text": "string"
-              }
-            }
-          ],
-          "description": "A computed color as three sRGB bytes, whatever space it was written in.\n\n**Painting it is the only way to read it.** A color-typed property is\nresolved before it is reported, but resolved is not the same as converted:\nChrome hands back `lab(100 0 0)` for a token built through `oklab`, and this\nused to scrape the first three numbers out of that and call them red, green\nand blue. White arrived as `rgb(100, 0, 0)`. In light mode the near dots were\n`lab(0 0 0)`, which scrapes to black and looks right, so only dark mode showed\nit: dark red mixed toward black, on a near-black ground.\n\nA 1x1 fill and `getImageData` is a readback, so the answer is cached against\nthe string it came from. There are two per orb and they change when the theme\ndoes."
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "readColor",
-          "declaration": {
-            "name": "readColor",
-            "module": "src/orb/color.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/orb/index.ts",

package/dist/orb/root/orb-root.js

@@ -4,10 +4,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { customElement, HelixElement, hostAria } from '@fusion.dev/helix-core';
+import { customElement, HelixElement, hostAria, readColor, } from '@fusion.dev/helix-core';
 import { html } from 'lit';
 import { property } from 'lit/decorators.js';
-import { readColor } from '../color.js';
 import { blendStaged, evenSphere, fibonacci, meshFor, ORB_STATES, orbPoint, paramsFor, project, smoother, stateDistance, TRAIL, } from '../shapes.js';
 import { styles } from './orb-root.css.js';
 const MORPH_NEAR = 380;
@@ -23,6 +22,7 @@ const LABELS = {
     waiting: 'Waiting',
     working: 'Working',
 };
+const GRAY = [128, 128, 128];
 let HelixOrb = class HelixOrb extends HelixElement {
     constructor() {
         super(...arguments);
@@ -226,8 +226,8 @@ let HelixOrb = class HelixOrb extends HelixElement {
         const params = still ? paramsFor(this.state) : this.paramsNow();
         this.phase += dt * params.rate;
         const painted = getComputedStyle(ctx.canvas);
-        const ink = readColor(painted.color);
-        const ground = readColor(painted.textDecorationColor);
+        const ink = readColor(painted.color) ?? GRAY;
+        const ground = readColor(painted.textDecorationColor) ?? GRAY;
         const mesh = meshFor(size);
         const even = evenSphere(mesh.lanes, mesh.segs);
         const spin = this.phase * 0.9;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix",
   "description": "Styled component tier. Extends the headless tier with token-driven presentation.",
-  "version": "0.57.0",
+  "version": "0.58.1",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -47,14 +47,14 @@
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.57.0",
-    "@fusion.dev/helix-headless": "0.57.0",
-    "@fusion.dev/helix-styles": "0.57.0"
+    "@fusion.dev/helix-core": "0.58.1",
+    "@fusion.dev/helix-headless": "0.58.1",
+    "@fusion.dev/helix-styles": "0.58.1"
   },
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "^0.11.0",
-    "@fusion.dev/helix-cem": "0.57.0",
-    "@fusion.dev/helix-testing": "0.57.0",
+    "@fusion.dev/helix-cem": "0.58.1",
+    "@fusion.dev/helix-testing": "0.58.1",
     "@fusion.dev/scripts": "0.0.0-dev",
     "@happy-dom/global-registrator": "^20.0.0",
     "@lit-labs/ssr": "^4.1.0",

package/dist/orb/color.d.ts

@@ -1,19 +0,0 @@
-/**
- * Reading a computed color the engine has resolved but not converted.
- */
-/**
- * A computed color as three sRGB bytes, whatever space it was written in.
- *
- * **Painting it is the only way to read it.** A color-typed property is
- * resolved before it is reported, but resolved is not the same as converted:
- * Chrome hands back `lab(100 0 0)` for a token built through `oklab`, and this
- * used to scrape the first three numbers out of that and call them red, green
- * and blue. White arrived as `rgb(100, 0, 0)`. In light mode the near dots were
- * `lab(0 0 0)`, which scrapes to black and looks right, so only dark mode showed
- * it: dark red mixed toward black, on a near-black ground.
- *
- * A 1x1 fill and `getImageData` is a readback, so the answer is cached against
- * the string it came from. There are two per orb and they change when the theme
- * does.
- */
-export declare const readColor: (value: string) => [number, number, number];

package/dist/orb/color.js

@@ -1,25 +0,0 @@
-let swatch;
-const known = new Map();
-export const readColor = (value) => {
-    const seen = known.get(value);
-    if (seen) {
-        return seen;
-    }
-    if (swatch === undefined) {
-        swatch = document.createElement('canvas').getContext('2d', { willReadFrequently: true });
-    }
-    if (!swatch) {
-        return [128, 128, 128];
-    }
-    swatch.clearRect(0, 0, 1, 1);
-    swatch.fillStyle = '#808080';
-    swatch.fillStyle = value;
-    swatch.fillRect(0, 0, 1, 1);
-    const [red, green, blue] = swatch.getImageData(0, 0, 1, 1).data;
-    const rgb = [red ?? 128, green ?? 128, blue ?? 128];
-    if (known.size > 64) {
-        known.clear();
-    }
-    known.set(value, rgb);
-    return rgb;
-};