@fusion.dev/helix 0.93.0 → 0.95.0

package/custom-elements.json

@@ -12094,7 +12094,7 @@
             },
             {
               "description": "A heading above the content.",
-              "name": "title",
+              "name": "heading",
               "inheritedFrom": {
                 "name": "HelixHeadlessCallout",
                 "module": "src/callout/root/callout-root.ts"
@@ -138208,10 +138208,6 @@
                 "description": "A loop with no sound, which is the one video allowed to start on its own.",
                 "slug": "ambient"
               },
-              {
-                "description": "A way out of the set, over the picture at the top left.",
-                "slug": "back"
-              },
               {
                 "description": "A clip with subtitle tracks and the control that chooses between them.",
                 "slug": "captions"
@@ -138228,6 +138224,10 @@
                 "description": "A filled frame around the picture.",
                 "slug": "filled"
               },
+              {
+                "description": "A title over the picture at the top left, with a way out of the set beside it.",
+                "slug": "header"
+              },
               {
                 "description": "The browser's own controls instead of these, which is what `controls` means.",
                 "slug": "native"
@@ -138279,16 +138279,16 @@
               }
             },
             {
-              "description": "Top left over the frame, for a way out of a set.",
-              "name": "back",
+              "description": "Added to the control bar, before fullscreen.",
+              "name": "controls",
               "inheritedFrom": {
                 "name": "HelixHeadlessVideo",
                 "module": "src/video/root/video-root.ts"
               }
             },
             {
-              "description": "Added to the control bar, before fullscreen.",
-              "name": "controls",
+              "description": "Top left over the frame: a heading, and a way out of a set beside it.",
+              "name": "header",
               "inheritedFrom": {
                 "name": "HelixHeadlessVideo",
                 "module": "src/video/root/video-root.ts"
@@ -138304,14 +138304,6 @@
             }
           ],
           "cssParts": [
-            {
-              "description": "The region top left, for a way out of a set.",
-              "name": "back",
-              "inheritedFrom": {
-                "name": "HelixHeadlessVideo",
-                "module": "src/video/root/video-root.ts"
-              }
-            },
             {
               "description": "Subtitles on and off.",
               "name": "captions",
@@ -138464,6 +138456,14 @@
                 "module": "src/video/root/video-root.ts"
               }
             },
+            {
+              "description": "The region top left, for a heading and a way out of a set.",
+              "name": "header",
+              "inheritedFrom": {
+                "name": "HelixHeadlessVideo",
+                "module": "src/video/root/video-root.ts"
+              }
+            },
             {
               "description": "What is said while the picture waits for more of itself. The part of that which spins is drawn on it, which is `::part(loading)::before` from a consumer's sheet: this tier ships no CSS, so a box it renders for one to paint is an empty child costing whatever the consumer's own layout charges for a child. `ListItem` measured that.",
               "name": "loading",

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

@@ -63,7 +63,7 @@ line-height: var(--helix-leading-normal);
 min-inline-size: 0;
 }
 
-slot[name="title"]::slotted(*) {
+slot[name="heading"]::slotted(*) {
 color: var(--helix-color-foreground);
 
 display: block;

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

@@ -380,15 +380,21 @@ animation: none;
 }
 }
 
-[part="back"] {
+[part="header"] {
+align-items: center;
+
+color: var(--video-controls-color, var(--helix-color-foreground));
+display: flex;
+gap: var(--helix-space-sm);
 inset-block-start: var(--helix-space-sm);
 inset-inline-start: var(--helix-space-sm);
+max-inline-size: calc(100% - 2 * var(--helix-space-sm));
 opacity: inherit;
 position: absolute;
 z-index: var(--helix-layer-raised);
 }
 
-[part="back"]:not(:has(*)) {
+[part="header"]:not(:has(*)) {
 display: none;
 }
 

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.93.0",
+  "version": "0.95.0",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -47,13 +47,13 @@
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.93.0",
-    "@fusion.dev/helix-headless": "0.93.0",
-    "@fusion.dev/helix-styles": "0.93.0"
+    "@fusion.dev/helix-core": "0.95.0",
+    "@fusion.dev/helix-headless": "0.95.0",
+    "@fusion.dev/helix-styles": "0.95.0"
   },
   "devDependencies": {
-    "@fusion.dev/helix-cem": "0.93.0",
-    "@fusion.dev/helix-testing": "0.93.0",
+    "@fusion.dev/helix-cem": "0.95.0",
+    "@fusion.dev/helix-testing": "0.95.0",
     "@fusion.dev/scripts": "0.0.0-dev",
     "@happy-dom/global-registrator": "^20.0.0",
     "@lit-labs/ssr": "^4.1.0",

package/types/jsx.d.ts

@@ -23482,7 +23482,7 @@ export type CustomElements = {
    *
    * - `(default)`: The callout's content.
    * - `icon`: Replaces the icon chosen by `tone`.
-   * - `title`: A heading above the content.
+   * - `heading`: A heading above the content.
    *
    * ## CSS Custom Properties
    *
@@ -40909,8 +40909,8 @@ export type CustomElements = {
    * Areas where markup can be added to the component.
    *
    * - `(default)`: `<source>` and `<track>` elements, which are copied into the video.
-   * - `back`: Top left over the frame, for a way out of a set.
    * - `controls`: Added to the control bar, before fullscreen.
+   * - `header`: Top left over the frame: a heading, and a way out of a set beside it.
    * - `poster`: Shown over the video until it starts.
    *
    * ## Methods
@@ -40946,7 +40946,6 @@ export type CustomElements = {
    *
    * Custom selectors for styling elements within the component.
    *
-   * - `back`: The region top left, for a way out of a set.
    * - `captions`: Subtitles on and off.
    * - `captions-menu`: The language menu, where there is more than one.
    * - `captions-menu-back`: The control that returns from a submenu.
@@ -40966,6 +40965,7 @@ export type CustomElements = {
    * - `failure`: What is said when the source will not play.
    * - `forward`: The control that goes on ten seconds.
    * - `fullscreen`: The whole screen, and back.
+   * - `header`: The region top left, for a heading and a way out of a set.
    * - `loading`: What is said while the picture waits for more of itself. The part of that which spins is drawn on it, which is `::part(loading)::before` from a consumer's sheet: this tier ships no CSS, so a box it renders for one to paint is an empty child costing whatever the consumer's own layout charges for a child. `ListItem` measured that.
    * - `more`: The button that opens it.
    * - `mute`: Sound on and off.
@@ -43185,7 +43185,7 @@ export type CustomElementsSolidJs = {
    *
    * - `(default)`: The callout's content.
    * - `icon`: Replaces the icon chosen by `tone`.
-   * - `title`: A heading above the content.
+   * - `heading`: A heading above the content.
    *
    * ## CSS Custom Properties
    *
@@ -60978,8 +60978,8 @@ export type CustomElementsSolidJs = {
    * Areas where markup can be added to the component.
    *
    * - `(default)`: `<source>` and `<track>` elements, which are copied into the video.
-   * - `back`: Top left over the frame, for a way out of a set.
    * - `controls`: Added to the control bar, before fullscreen.
+   * - `header`: Top left over the frame: a heading, and a way out of a set beside it.
    * - `poster`: Shown over the video until it starts.
    *
    * ## Methods
@@ -61015,7 +61015,6 @@ export type CustomElementsSolidJs = {
    *
    * Custom selectors for styling elements within the component.
    *
-   * - `back`: The region top left, for a way out of a set.
    * - `captions`: Subtitles on and off.
    * - `captions-menu`: The language menu, where there is more than one.
    * - `captions-menu-back`: The control that returns from a submenu.
@@ -61035,6 +61034,7 @@ export type CustomElementsSolidJs = {
    * - `failure`: What is said when the source will not play.
    * - `forward`: The control that goes on ten seconds.
    * - `fullscreen`: The whole screen, and back.
+   * - `header`: The region top left, for a heading and a way out of a set.
    * - `loading`: What is said while the picture waits for more of itself. The part of that which spins is drawn on it, which is `::part(loading)::before` from a consumer's sheet: this tier ships no CSS, so a box it renders for one to paint is an empty child costing whatever the consumer's own layout charges for a child. `ListItem` measured that.
    * - `more`: The button that opens it.
    * - `mute`: Sound on and off.