@fusion.dev/helix 0.19.0 → 0.19.1

package/custom-elements.json

@@ -1040,6 +1040,10 @@
           "description": "Full width and flat, with the severity carried by a tinted fill and a\nhairline beneath rather than by a border on four sides: an announcement is a\nband across the top of the page, not a box that happens to be wide.",
           "name": "HelixAnnouncement",
           "cssProperties": [
+            {
+              "description": "How tall the band is at its shortest, so adding a control to it does not move the page down. A floor, not a cap: a message long enough to wrap still gets the room.",
+              "name": "--announcement-block-size"
+            },
             {
               "description": "Inline padding, matched to the page.",
               "name": "--announcement-inset"

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

@@ -16,6 +16,11 @@ font-size: var(--helix-text-sm);
 
 font-weight: var(--helix-weight-medium);
 inline-size: 100%;
+
+min-block-size: var(
+--announcement-block-size,
+calc(var(--helix-size-control) + var(--helix-space-xs) * 2)
+);
 padding-block: var(--helix-space-xs);
 padding-inline: var(--announcement-inset, var(--helix-space-lg));
 

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

@@ -14,6 +14,7 @@ import type { CSSResultGroup } from 'lit';
  * @aliases Banner, Notification bar, Alert bar
  * @documentation https://helix.fusion.dev/components/announcement
  *
+ * @cssproperty --announcement-block-size - How tall the band is at its shortest, so adding a control to it does not move the page down. A floor, not a cap: a message long enough to wrap still gets the room.
  * @cssproperty --announcement-inset - Inline padding, matched to the page.
  */
 export declare class HelixAnnouncement extends HelixHeadlessAnnouncement {

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.19.0",
+  "version": "0.19.1",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -46,14 +46,14 @@
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.19.0",
-    "@fusion.dev/helix-headless": "0.19.0",
-    "@fusion.dev/helix-styles": "0.19.0"
+    "@fusion.dev/helix-core": "0.19.1",
+    "@fusion.dev/helix-headless": "0.19.1",
+    "@fusion.dev/helix-styles": "0.19.1"
   },
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "^0.11.0",
-    "@fusion.dev/helix-cem": "0.19.0",
-    "@fusion.dev/helix-testing": "0.19.0",
+    "@fusion.dev/helix-cem": "0.19.1",
+    "@fusion.dev/helix-testing": "0.19.1",
     "@fusion.dev/scripts": "0.0.0-dev",
     "@happy-dom/global-registrator": "^20.0.0",
     "@lit-labs/ssr": "^3.3.0",

package/types/jsx.d.ts

@@ -18559,6 +18559,7 @@ export type CustomElements = {
    *
    * CSS variables available for styling the component.
    *
+   * - `--announcement-block-size`: How tall the band is at its shortest, so adding a control to it does not move the page down. A floor, not a cap: a message long enough to wrap still gets the room. (default: `undefined`)
    * - `--announcement-inset`: Inline padding, matched to the page. (default: `undefined`)
    *
    * ## CSS Parts
@@ -34513,6 +34514,7 @@ export type CustomElementsSolidJs = {
    *
    * CSS variables available for styling the component.
    *
+   * - `--announcement-block-size`: How tall the band is at its shortest, so adding a control to it does not move the page down. A floor, not a cap: a message long enough to wrap still gets the room. (default: `undefined`)
    * - `--announcement-inset`: Inline padding, matched to the page. (default: `undefined`)
    *
    * ## CSS Parts
@@ -50589,6 +50591,8 @@ export type CustomCssProperties = {
   "--accordion-gap"?: (string) | undefined;
   /** Corner radius of each item, when outlined. */
   "--accordion-radius"?: (string) | undefined;
+  /** How tall the band is at its shortest, so adding a control to it does not move the page down. A floor, not a cap: a message long enough to wrap still gets the room. */
+  "--announcement-block-size"?: (string) | undefined;
   /** Inline padding, matched to the page. */
   "--announcement-inset"?: (string) | undefined;
   /** The filter behind it. `none` to pair it with a panel. */

package/types/vue.d.ts

@@ -9367,6 +9367,8 @@ export type CustomCssProperties = {
   "--accordion-gap"?: (string) | undefined;
   /** Corner radius of each item, when outlined. */
   "--accordion-radius"?: (string) | undefined;
+  /** How tall the band is at its shortest, so adding a control to it does not move the page down. A floor, not a cap: a message long enough to wrap still gets the room. */
+  "--announcement-block-size"?: (string) | undefined;
   /** Inline padding, matched to the page. */
   "--announcement-inset"?: (string) | undefined;
   /** The filter behind it. `none` to pair it with a panel. */