@fusion.dev/helix 0.25.1 → 0.30.0

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

@@ -6,6 +6,6 @@ flex-direction: column;
 
 @media print {
 :host {
-box-shadow: none;
+print-color-adjust: economy;
 }
 }`);

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

@@ -41,6 +41,7 @@ scale: 1;
 
 [part="arrow"] {
 background-color: var(--tooltip-background-color, var(--helix-color-surface-inverse));
+
 block-size: var(--tooltip-arrow-size, 0.5rem);
 inline-size: var(--tooltip-arrow-size, 0.5rem);
 position: absolute;

package/dist/tour/stop/tour-stop.css.js

@@ -45,8 +45,9 @@ margin-inline-end: auto;
 
 [part="arrow"] {
 background-color: var(--tour-surface-color, var(--helix-color-surface-raised));
-block-size: var(--tour-arrow-size, 0.625rem);
-inline-size: var(--tour-arrow-size, 0.625rem);
+
+block-size: var(--tour-arrow-size, 0.5rem);
+inline-size: var(--tour-arrow-size, 0.5rem);
 position: absolute;
 rotate: 45deg;
 }
@@ -54,23 +55,23 @@ rotate: 45deg;
 [part="bubble"][data-placement^="bottom"] [part="arrow"] {
 border-block-start: var(--helix-border-thin) solid var(--helix-color-border);
 border-inline-start: var(--helix-border-thin) solid var(--helix-color-border);
-inset-block-start: calc(var(--tour-arrow-size, 0.625rem) / -2);
+inset-block-start: calc(var(--tour-arrow-size, 0.5rem) / -2);
 }
 
 [part="bubble"][data-placement^="top"] [part="arrow"] {
 border-block-end: var(--helix-border-thin) solid var(--helix-color-border);
 border-inline-end: var(--helix-border-thin) solid var(--helix-color-border);
-inset-block-end: calc(var(--tour-arrow-size, 0.625rem) / -2);
+inset-block-end: calc(var(--tour-arrow-size, 0.5rem) / -2);
 }
 
 [part="bubble"][data-placement^="right"] [part="arrow"] {
 border-block-end: var(--helix-border-thin) solid var(--helix-color-border);
 border-inline-start: var(--helix-border-thin) solid var(--helix-color-border);
-inset-inline-start: calc(var(--tour-arrow-size, 0.625rem) / -2);
+inset-inline-start: calc(var(--tour-arrow-size, 0.5rem) / -2);
 }
 
 [part="bubble"][data-placement^="left"] [part="arrow"] {
 border-block-start: var(--helix-border-thin) solid var(--helix-color-border);
 border-inline-end: var(--helix-border-thin) solid var(--helix-color-border);
-inset-inline-end: calc(var(--tour-arrow-size, 0.625rem) / -2);
+inset-inline-end: calc(var(--tour-arrow-size, 0.5rem) / -2);
 }`);

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

@@ -20,23 +20,12 @@ flex-direction: column;
 --_tree-reserve: var(--helix-space-none);
 }
 
-[part="empty"],
-[part="loading"] {
-color: var(--helix-color-foreground-subtle);
-font-family: var(--helix-font-sans);
-font-size: var(--helix-text-sm);
-margin: var(--helix-space-none);
-padding-block: var(--helix-space-md);
-padding-inline: var(--helix-space-sm);
-text-align: center;
-}
-
 :host([loading]) [part="tree"] {
 opacity: 0.5;
 }
 
 @media print {
 :host {
-box-shadow: none;
+print-color-adjust: economy;
 }
 }`);

package/dist/tree/root/tree-root.js

@@ -7,9 +7,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTree } from '@fusion.dev/helix-headless/tree';
 import { property } from 'lit/decorators.js';
+import { styles as collectionStateStyles } from '../../shared/collection/state.css.js';
 import { styles } from './tree-root.css.js';
 let HelixTree = class HelixTree extends HelixHeadlessTree {
-    static { this.styles = styles; }
+    static { this.styles = [collectionStateStyles, styles]; }
 };
 __decorate([
     property({ attribute: 'chevron-placement', reflect: true })

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

@@ -44,6 +44,6 @@ font-weight: var(--helix-weight-regular);
 
 @media print {
 :host {
-box-shadow: none;
+print-color-adjust: economy;
 }
 }`);

package/dist/trend/root/trend-root.js

@@ -7,7 +7,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessTrend } from '@fusion.dev/helix-headless/trend';
 import '../../icon/index.js';
-import { styles as glyphStyles } from '../../icon/glyph.css.js';
+import { styles as glyphStyles } from '../../shared/glyph/glyph.css.js';
 import { styles } from './trend-root.css.js';
 let HelixTrend = class HelixTrend extends HelixHeadlessTrend {
     static { this.styles = [glyphStyles, styles]; }

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

@@ -2,6 +2,10 @@ import { createSheet } from '@fusion.dev/helix-core';
 export const styles = createSheet(`:host {
 color-scheme: dark;
 
+--_video-rail-size: 4px;
+--_video-spin: 0.8s;
+--_video-thumb-size: 12px;
+
 display: block;
 position: relative;
 }
@@ -127,7 +131,7 @@ to right,
 var(--_video-fill) calc(var(--_video-at, 0) * 100%),
 transparent calc(var(--_video-at, 0) * 100%)
 );
-block-size: 4px;
+block-size: var(--_video-rail-size);
 }
 
 [part="scrubber"] {
@@ -166,7 +170,7 @@ var(--_video-fill) calc(var(--_video-at, 1) * 100%),
 transparent calc(var(--_video-at, 1) * 100%)
 );
 
-block-size: 4px;
+block-size: var(--_video-rail-size);
 bottom: var(--_video-level-lift);
 direction: rtl;
 inline-size: var(--_video-level-size);
@@ -215,19 +219,19 @@ translate: -50% 0;
 [part="volume"]::-webkit-slider-thumb {
 appearance: none;
 background-color: currentColor;
-block-size: 12px;
+block-size: var(--_video-thumb-size);
 border: none;
 border-radius: var(--helix-radii-full);
-inline-size: 12px;
+inline-size: var(--_video-thumb-size);
 }
 
 [part="scrubber"]::-moz-range-thumb,
 [part="volume"]::-moz-range-thumb {
 background-color: currentColor;
-block-size: 12px;
+block-size: var(--_video-thumb-size);
 border: none;
 border-radius: var(--helix-radii-full);
-inline-size: 12px;
+inline-size: var(--_video-thumb-size);
 }
 
 :host([separation="filled"]) [part="sound"] {
@@ -350,8 +354,7 @@ translate: -50% -50%;
 }
 
 [part="loading-mark"] {
-
-animation: video-spin 0.8s linear infinite;
+animation: video-spin var(--_video-spin) linear infinite;
 block-size: var(--helix-size-icon-tight);
 border: var(--helix-border-thick) solid
 color-mix(in oklab, var(--helix-color-foreground-media) 30%, transparent);

package/dist/video/root/video-root.js

@@ -9,7 +9,7 @@ import { HelixHeadlessVideo } from '@fusion.dev/helix-headless/video';
 import { property } from 'lit/decorators.js';
 import '../../icon/index.js';
 import '../../menu/index.js';
-import { styles as glyphStyles } from '../../icon/glyph.css.js';
+import { styles as glyphStyles } from '../../shared/glyph/glyph.css.js';
 import { styles } from './video-root.css.js';
 let HelixVideo = class HelixVideo extends HelixHeadlessVideo {
     static { this.tier = 'helix-'; }

package/dist/video-playlist/menu/video-playlist-menu.js

@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessVideoPlaylistMenu } from '@fusion.dev/helix-headless/video-playlist';
-import { styles as glyphStyles } from '../../icon/glyph.css.js';
+import { styles as glyphStyles } from '../../shared/glyph/glyph.css.js';
 import { styles } from './video-playlist-menu.css.js';
 import '../../icon/index.js';
 import '../../menu/index.js';

package/dist/virtual-list/root/virtual-list-root.css.js

@@ -19,8 +19,6 @@ flex: none;
 
 @media print {
 :host {
-box-shadow: none;
-max-block-size: none;
 overflow: visible;
 }
 }`);

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.25.1",
+  "version": "0.30.0",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -42,21 +42,22 @@
     "test:dom": "bun test dom.spec",
     "test:pure": "bun test pure.spec",
     "test:ssr": "bun test ssr.spec",
-    "typecheck": "bun run element-events && tsc -p tsconfig.json --noEmit"
+    "typecheck": "bun run element-events && tsc -p tsconfig.json --noEmit && bun run typecheck:examples",
+    "typecheck:examples": "tsc -p tsconfig.examples.json"
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.25.1",
-    "@fusion.dev/helix-headless": "0.25.1",
-    "@fusion.dev/helix-styles": "0.25.1"
+    "@fusion.dev/helix-core": "0.30.0",
+    "@fusion.dev/helix-headless": "0.30.0",
+    "@fusion.dev/helix-styles": "0.30.0"
   },
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "^0.11.0",
-    "@fusion.dev/helix-cem": "0.25.1",
-    "@fusion.dev/helix-testing": "0.25.1",
+    "@fusion.dev/helix-cem": "0.30.0",
+    "@fusion.dev/helix-testing": "0.30.0",
     "@fusion.dev/scripts": "0.0.0-dev",
     "@happy-dom/global-registrator": "^20.0.0",
-    "@lit-labs/ssr": "^3.3.0",
+    "@lit-labs/ssr": "^4.1.0",
     "@types/bun": "^1.3.0",
     "lit": "^3.2.1"
   },