@fusion.dev/helix 0.199.0 → 0.199.1

package/custom-elements.json

@@ -155063,6 +155063,13 @@
               "readonly": true,
               "description": "Stops the dots for a shape the page slotted, and starts them again once it is gone."
             },
+            {
+              "kind": "field",
+              "name": "handleRestyle",
+              "privacy": "private",
+              "readonly": true,
+              "description": "**One frame for a still orb, once a color the canvas carries has moved**,\nas Strands and Aura draw one. A running orb reads the colors on its next\nframe, but one drawn once, under reduced motion or with its loop stopped,\nkept the ink of the theme it was drawn in: after a switch to dark, dark\ndots on a dark ground."
+            },
             {
               "kind": "method",
               "name": "start",
@@ -267716,6 +267723,6 @@
   ],
   "helix": {
     "package": "@fusion.dev/helix",
-    "version": "0.199.0"
+    "version": "0.199.1"
   }
 }

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

@@ -1,2 +1,2 @@
 import { createSheet } from '@fusion.dev/helix-core';
-export const styles = createSheet(`:host {--_orb-size: calc(var(--helix-size-loader-lg) * 1.5);--_orb-color: var(--orb-color, currentColor);--_orb-ground: var(--orb-ground, var(--helix-color-background));block-size: var(--orb-size, var(--_orb-size));display: inline-block;flex-shrink: 0;inline-size: var(--orb-size, var(--_orb-size));position: relative;vertical-align: middle}::slotted(*) {block-size: 100%;inline-size: 100%;inset: 0;position: absolute}:host([size="sm"]) {--_orb-size: var(--helix-size-loader-md)}:host([size="lg"]) {--_orb-size: calc(var(--helix-size-loader-lg) * 2)}[part="canvas"] {animation-iteration-count: var(--orb-speed, 1);block-size: 100%;color: var(--_orb-color);display: block;inline-size: 100%;text-decoration-color: var(--_orb-ground)}[part="canvas"][hidden] {display: none}@media print {:host {display: none}}`);
+export const styles = createSheet(`:host {--_orb-size: calc(var(--helix-size-loader-lg) * 1.5);--_orb-color: var(--orb-color, currentColor);--_orb-ground: var(--orb-ground, var(--helix-color-background));block-size: var(--orb-size, var(--_orb-size));display: inline-block;flex-shrink: 0;inline-size: var(--orb-size, var(--_orb-size));position: relative;vertical-align: middle}::slotted(*) {block-size: 100%;inline-size: 100%;inset: 0;position: absolute}:host([size="sm"]) {--_orb-size: var(--helix-size-loader-md)}:host([size="lg"]) {--_orb-size: calc(var(--helix-size-loader-lg) * 2)}[part="canvas"] {animation-iteration-count: var(--orb-speed, 1);block-size: 100%;color: var(--_orb-color);display: block;inline-size: 100%;text-decoration-color: var(--_orb-ground);transition-duration: var(--helix-duration-fast);transition-property: color, text-decoration-color}[part="canvas"][hidden] {display: none}@media print {:host {display: none}}`);

package/dist/orb/root/orb-root.d.ts

@@ -203,6 +203,14 @@ export declare class HelixOrb extends HelixElement {
     protected firstUpdated(changed: PropertyValues): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /**
+     * **One frame for a still orb, once a color the canvas carries has moved**,
+     * as Strands and Aura draw one. A running orb reads the colors on its next
+     * frame, but one drawn once, under reduced motion or with its loop stopped,
+     * kept the ink of the theme it was drawn in: after a switch to dark, dark
+     * dots on a dark ground.
+     */
+    private readonly handleRestyle;
     private start;
     /**
      * Matches the drawing buffer to the box, and reports whether it changed.

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

@@ -63,6 +63,11 @@ let HelixOrb = class HelixOrb extends HelixElement {
                 this.gate.play();
             }
         };
+        this.handleRestyle = () => {
+            if (!this.gate.running) {
+                this.paint(0);
+            }
+        };
         this.handleLost = () => {
             this.lost = true;
             this.gate.stop();
@@ -125,6 +130,7 @@ let HelixOrb = class HelixOrb extends HelixElement {
         this.box = 0;
         this.canvas?.removeEventListener('contextlost', this.handleLost);
         this.canvas?.removeEventListener('contextrestored', this.handleRestored);
+        this.canvas?.removeEventListener('transitionend', this.handleRestyle);
     }
     start() {
         if (!this.isConnected) {
@@ -143,6 +149,7 @@ let HelixOrb = class HelixOrb extends HelixElement {
         }
         canvas.addEventListener('contextlost', this.handleLost);
         canvas.addEventListener('contextrestored', this.handleRestored);
+        canvas.addEventListener('transitionend', this.handleRestyle);
         if (this.lost && !this.context.isContextLost()) {
             this.lost = false;
             canvas.toggleAttribute('hidden', this.own);