@backstage/ui 0.15.0-next.0 → 0.15.0-next.2

package/dist/components/Header/Header.esm.js

@@ -5,38 +5,197 @@ import '../Text/Text.module.css.esm.js';
 import { RiArrowRightSLine } from '@remixicon/react';
 import { HeaderNav } from './HeaderNav.esm.js';
 import { HeaderDefinition } from './definition.esm.js';
-import { Container } from '../Container/Container.esm.js';
-import '../Container/Container.module.css.esm.js';
+import { sanitizeUrl } from '@braintree/sanitize-url';
+import { Lexer } from 'marked';
 import { Link } from '../Link/Link.esm.js';
 import '../Link/Link.module.css.esm.js';
+import { useMemo, useRef, useState, useEffect, Fragment as Fragment$1 } from 'react';
 
+const getScrollParent = (element) => {
+  let parent = element?.parentElement;
+  while (parent) {
+    const { overflow, overflowX, overflowY } = window.getComputedStyle(parent);
+    if (/(auto|scroll|overlay|hidden)/.test(`${overflow}${overflowX}${overflowY}`)) {
+      return parent;
+    }
+    parent = parent.parentElement;
+  }
+  return null;
+};
+const isStickySentinelOutOfView = (sentinel, root) => {
+  const sentinelRect = sentinel.getBoundingClientRect();
+  const rootTop = root ? root.getBoundingClientRect().top : 0;
+  return sentinelRect.bottom <= rootTop;
+};
+function renderInlineMarkdown(text) {
+  return Lexer.lexInline(text).map((token, i) => {
+    if (token.type === "link") {
+      const href = sanitizeUrl(token.href);
+      if (href === "about:blank") return token.text;
+      return /* @__PURE__ */ jsx(Link, { href, standalone: true, children: token.text }, i);
+    }
+    return token.raw;
+  });
+}
 const Header = (props) => {
-  const { ownProps } = useDefinition(HeaderDefinition, props);
-  const { classes, title, tabs, activeTabId, customActions, breadcrumbs } = ownProps;
-  return /* @__PURE__ */ jsxs(Container, { className: classes.root, children: [
-    /* @__PURE__ */ jsxs("div", { className: classes.content, children: [
-      /* @__PURE__ */ jsxs("div", { className: classes.breadcrumbs, children: [
-        breadcrumbs && breadcrumbs.map((breadcrumb) => /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(
-            Link,
-            {
-              href: breadcrumb.href,
-              variant: "title-small",
-              weight: "bold",
-              color: "secondary",
-              truncate: true,
-              style: { maxWidth: "240px" },
-              standalone: true,
-              children: breadcrumb.label
-            }
-          ),
-          /* @__PURE__ */ jsx(RiArrowRightSLine, { size: 16, color: "var(--bui-fg-secondary)" })
-        ] }, breadcrumb.label)),
-        /* @__PURE__ */ jsx(Text, { variant: "title-small", weight: "bold", as: "h2", children: title })
-      ] }),
-      /* @__PURE__ */ jsx("div", { className: classes.controls, children: customActions })
-    ] }),
-    tabs && /* @__PURE__ */ jsx("div", { className: classes.tabsWrapper, children: /* @__PURE__ */ jsx(HeaderNav, { tabs, activeTabId }) })
+  const { ownProps, dataAttributes } = useDefinition(HeaderDefinition, props, {
+    classNameTarget: "content"
+  });
+  const {
+    classes,
+    title,
+    tabs,
+    activeTabId,
+    customActions,
+    breadcrumbs,
+    description,
+    tags,
+    metadata,
+    sticky
+  } = ownProps;
+  const descriptionNodes = useMemo(
+    () => description ? renderInlineMarkdown(description) : null,
+    [description]
+  );
+  const stickySentinelRef = useRef(null);
+  const [isStuck, setIsStuck] = useState(false);
+  useEffect(() => {
+    if (!sticky) {
+      setIsStuck(false);
+      return;
+    }
+    const sentinel = stickySentinelRef.current;
+    if (!sentinel) {
+      return;
+    }
+    const root = getScrollParent(sentinel);
+    if (typeof IntersectionObserver === "undefined") {
+      const updateStuckState = () => {
+        setIsStuck(isStickySentinelOutOfView(sentinel, root));
+      };
+      const scrollTarget = root ?? window;
+      updateStuckState();
+      scrollTarget.addEventListener("scroll", updateStuckState, {
+        passive: true
+      });
+      window.addEventListener("resize", updateStuckState);
+      return () => {
+        scrollTarget.removeEventListener("scroll", updateStuckState);
+        window.removeEventListener("resize", updateStuckState);
+      };
+    }
+    const observer = new IntersectionObserver(
+      ([entry]) => {
+        setIsStuck(!entry.isIntersecting);
+      },
+      { root, threshold: 0 }
+    );
+    observer.observe(sentinel);
+    return () => {
+      observer.disconnect();
+    };
+  }, [sticky]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: classes.headerTop, "data-sticky": sticky || void 0, children: tags && tags.length > 0 && /* @__PURE__ */ jsx("ul", { className: classes.tags, children: tags.map((tag, i) => /* @__PURE__ */ jsx(
+      "li",
+      {
+        className: classes.tag,
+        children: tag.href ? /* @__PURE__ */ jsx(
+          Link,
+          {
+            href: tag.href,
+            variant: "body-medium",
+            color: "secondary",
+            standalone: true,
+            children: tag.label
+          }
+        ) : /* @__PURE__ */ jsx(Text, { variant: "body-medium", color: "secondary", children: tag.label })
+      },
+      `${i}:${tag.label}:${tag.href ?? ""}`
+    )) }) }),
+    sticky && /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: stickySentinelRef,
+        className: classes.stickySentinel,
+        "data-sticky": "",
+        "aria-hidden": "true"
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: classes.content,
+        "data-sticky": sticky || void 0,
+        "data-stuck": isStuck || void 0,
+        "data-has-tags": tags && tags.length > 0 ? "" : void 0,
+        ...dataAttributes,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: classes.titleStack, children: isStuck ? /* @__PURE__ */ jsxs("div", { className: classes.breadcrumbsSmall, children: [
+            breadcrumbs && breadcrumbs.map((breadcrumb) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
+              /* @__PURE__ */ jsx(
+                Link,
+                {
+                  href: breadcrumb.href,
+                  color: "secondary",
+                  className: classes.breadcrumbLinkSmall,
+                  standalone: true,
+                  children: breadcrumb.label
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                RiArrowRightSLine,
+                {
+                  className: classes.breadcrumbSeparator,
+                  size: 16,
+                  color: "var(--bui-fg-secondary)"
+                }
+              )
+            ] }, breadcrumb.label)),
+            /* @__PURE__ */ jsx("h2", { className: classes.titleSmall, children: title })
+          ] }) : /* @__PURE__ */ jsxs("div", { className: classes.breadcrumbs, children: [
+            breadcrumbs && breadcrumbs.map((breadcrumb) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
+              /* @__PURE__ */ jsx(
+                Link,
+                {
+                  href: breadcrumb.href,
+                  color: "secondary",
+                  className: classes.breadcrumbLink,
+                  standalone: true,
+                  children: breadcrumb.label
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                RiArrowRightSLine,
+                {
+                  className: classes.breadcrumbSeparator,
+                  size: 16,
+                  color: "var(--bui-fg-secondary)"
+                }
+              )
+            ] }, breadcrumb.label)),
+            /* @__PURE__ */ jsx("h2", { className: classes.title, children: title })
+          ] }) }),
+          /* @__PURE__ */ jsx("div", { className: classes.controls, children: customActions })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: classes.headerBottom, "data-sticky": sticky || void 0, children: [
+      description && /* @__PURE__ */ jsx(
+        Text,
+        {
+          variant: "body-medium",
+          color: "secondary",
+          className: classes.description,
+          children: descriptionNodes
+        }
+      ),
+      metadata && metadata.length > 0 && /* @__PURE__ */ jsx("dl", { className: classes.metaRow, children: metadata.map((item, i) => /* @__PURE__ */ jsxs("div", { className: classes.metaItem, children: [
+        /* @__PURE__ */ jsx("dt", { children: /* @__PURE__ */ jsx(Text, { variant: "body-medium", color: "secondary", children: item.label }) }),
+        /* @__PURE__ */ jsx("dd", { children: typeof item.value === "string" ? /* @__PURE__ */ jsx(Text, { variant: "body-medium", children: item.value }) : item.value })
+      ] }, `${i}:${item.label}`)) }),
+      tabs && /* @__PURE__ */ jsx("div", { className: classes.tabsWrapper, children: /* @__PURE__ */ jsx(HeaderNav, { tabs, activeTabId }) })
+    ] })
   ] });
 };
 const HeaderPage = Header;

package/dist/components/Header/Header.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.esm.js","sources":["../../../src/components/Header/Header.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { HeaderProps } from './types';\nimport { Text } from '../Text';\nimport { RiArrowRightSLine } from '@remixicon/react';\nimport { HeaderNav } from './HeaderNav';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { HeaderDefinition } from './definition';\nimport { Container } from '../Container';\nimport { Link } from '../Link';\nimport { Fragment } from 'react/jsx-runtime';\n\n/**\n * A secondary header with title, breadcrumbs, tabs, and actions.\n *\n * @public\n */\nexport const Header = (props: HeaderProps) => {\n  const { ownProps } = useDefinition(HeaderDefinition, props);\n  const { classes, title, tabs, activeTabId, customActions, breadcrumbs } =\n    ownProps;\n\n  return (\n    <Container className={classes.root}>\n      <div className={classes.content}>\n        <div className={classes.breadcrumbs}>\n          {breadcrumbs &&\n            breadcrumbs.map(breadcrumb => (\n              <Fragment key={breadcrumb.label}>\n                <Link\n                  href={breadcrumb.href}\n                  variant=\"title-small\"\n                  weight=\"bold\"\n                  color=\"secondary\"\n                  truncate\n                  style={{ maxWidth: '240px' }}\n                  standalone\n                >\n                  {breadcrumb.label}\n                </Link>\n                <RiArrowRightSLine size={16} color=\"var(--bui-fg-secondary)\" />\n              </Fragment>\n            ))}\n          <Text variant=\"title-small\" weight=\"bold\" as=\"h2\">\n            {title}\n          </Text>\n        </div>\n        <div className={classes.controls}>{customActions}</div>\n      </div>\n      {tabs && (\n        <div className={classes.tabsWrapper}>\n          <HeaderNav tabs={tabs} activeTabId={activeTabId} />\n        </div>\n      )}\n    </Container>\n  );\n};\n\n/**\n * @public\n * @deprecated Use {@link Header} instead.\n */\nexport const HeaderPage = Header;\n"],"names":[],"mappings":";;;;;;;;;;;;AA+BO,MAAM,MAAA,GAAS,CAAC,KAAA,KAAuB;AAC5C,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,aAAA,CAAc,kBAAkB,KAAK,CAAA;AAC1D,EAAA,MAAM,EAAE,OAAA,EAAS,KAAA,EAAO,MAAM,WAAA,EAAa,aAAA,EAAe,aAAY,GACpE,QAAA;AAEF,EAAA,uBACE,IAAA,CAAC,SAAA,EAAA,EAAU,SAAA,EAAW,OAAA,CAAQ,IAAA,EAC5B,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,OAAA,EACtB,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,WAAA,EACrB,QAAA,EAAA;AAAA,QAAA,WAAA,IACC,WAAA,CAAY,GAAA,CAAI,CAAA,UAAA,qBACd,IAAA,CAAC,QAAA,EAAA,EACC,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,IAAA;AAAA,YAAA;AAAA,cACC,MAAM,UAAA,CAAW,IAAA;AAAA,cACjB,OAAA,EAAQ,aAAA;AAAA,cACR,MAAA,EAAO,MAAA;AAAA,cACP,KAAA,EAAM,WAAA;AAAA,cACN,QAAA,EAAQ,IAAA;AAAA,cACR,KAAA,EAAO,EAAE,QAAA,EAAU,OAAA,EAAQ;AAAA,cAC3B,UAAA,EAAU,IAAA;AAAA,cAET,QAAA,EAAA,UAAA,CAAW;AAAA;AAAA,WACd;AAAA,0BACA,GAAA,CAAC,iBAAA,EAAA,EAAkB,IAAA,EAAM,EAAA,EAAI,OAAM,yBAAA,EAA0B;AAAA,SAAA,EAAA,EAZhD,UAAA,CAAW,KAa1B,CACD,CAAA;AAAA,wBACH,GAAA,CAAC,QAAK,OAAA,EAAQ,aAAA,EAAc,QAAO,MAAA,EAAO,EAAA,EAAG,MAC1C,QAAA,EAAA,KAAA,EACH;AAAA,OAAA,EACF,CAAA;AAAA,sBACA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,UAAW,QAAA,EAAA,aAAA,EAAc;AAAA,KAAA,EACnD,CAAA;AAAA,IACC,IAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,aACtB,QAAA,kBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,IAAA,EAAY,WAAA,EAA0B,CAAA,EACnD;AAAA,GAAA,EAEJ,CAAA;AAEJ;AAMO,MAAM,UAAA,GAAa;;;;"}
+{"version":3,"file":"Header.esm.js","sources":["../../../src/components/Header/Header.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { HeaderProps } from './types';\nimport { Text } from '../Text';\nimport { RiArrowRightSLine } from '@remixicon/react';\nimport { HeaderNav } from './HeaderNav';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { HeaderDefinition } from './definition';\nimport { sanitizeUrl } from '@braintree/sanitize-url';\nimport { Lexer } from 'marked';\nimport { Link } from '../Link';\nimport { Fragment, useEffect, useMemo, useRef, useState } from 'react';\n\nconst getScrollParent = (element: HTMLElement | null): Element | null => {\n  let parent = element?.parentElement;\n\n  while (parent) {\n    const { overflow, overflowX, overflowY } = window.getComputedStyle(parent);\n\n    if (\n      /(auto|scroll|overlay|hidden)/.test(`${overflow}${overflowX}${overflowY}`)\n    ) {\n      return parent;\n    }\n\n    parent = parent.parentElement;\n  }\n\n  return null;\n};\n\nconst isStickySentinelOutOfView = (\n  sentinel: HTMLElement,\n  root: Element | null,\n) => {\n  const sentinelRect = sentinel.getBoundingClientRect();\n  const rootTop = root ? root.getBoundingClientRect().top : 0;\n\n  return sentinelRect.bottom <= rootTop;\n};\n\n/**\n * Parses inline Markdown links in a string and returns an array of React nodes.\n * URLs are sanitized via `@braintree/sanitize-url`; unsafe URLs are rendered as\n * plain text. Uses `marked` instead of `react-markdown` to avoid ESM issues.\n */\nfunction renderInlineMarkdown(text: string): React.ReactNode[] {\n  return Lexer.lexInline(text).map((token, i) => {\n    if (token.type === 'link') {\n      const href = sanitizeUrl(token.href);\n      if (href === 'about:blank') return token.text;\n      return (\n        <Link key={i} href={href} standalone>\n          {token.text}\n        </Link>\n      );\n    }\n    return token.raw;\n  });\n}\n\n/**\n * A secondary header with title, breadcrumbs, tabs, and actions.\n *\n * @public\n */\nexport const Header = (props: HeaderProps) => {\n  const { ownProps, dataAttributes } = useDefinition(HeaderDefinition, props, {\n    classNameTarget: 'content',\n  });\n  const {\n    classes,\n    title,\n    tabs,\n    activeTabId,\n    customActions,\n    breadcrumbs,\n    description,\n    tags,\n    metadata,\n    sticky,\n  } = ownProps;\n\n  const descriptionNodes = useMemo(\n    () => (description ? renderInlineMarkdown(description) : null),\n    [description],\n  );\n\n  // The sentinel sits directly before the sticky content and leaves the\n  // viewport when the content becomes stuck, letting us toggle stuck styling.\n  const stickySentinelRef = useRef<HTMLDivElement>(null);\n  const [isStuck, setIsStuck] = useState(false);\n\n  useEffect(() => {\n    if (!sticky) {\n      setIsStuck(false);\n      return;\n    }\n\n    const sentinel = stickySentinelRef.current;\n    if (!sentinel) {\n      return;\n    }\n\n    const root = getScrollParent(sentinel);\n\n    if (typeof IntersectionObserver === 'undefined') {\n      const updateStuckState = () => {\n        setIsStuck(isStickySentinelOutOfView(sentinel, root));\n      };\n      const scrollTarget = root ?? window;\n\n      updateStuckState();\n      scrollTarget.addEventListener('scroll', updateStuckState, {\n        passive: true,\n      });\n      window.addEventListener('resize', updateStuckState);\n\n      return () => {\n        scrollTarget.removeEventListener('scroll', updateStuckState);\n        window.removeEventListener('resize', updateStuckState);\n      };\n    }\n\n    const observer = new IntersectionObserver(\n      ([entry]) => {\n        setIsStuck(!entry.isIntersecting);\n      },\n      { root, threshold: 0 },\n    );\n\n    observer.observe(sentinel);\n\n    return () => {\n      observer.disconnect();\n    };\n  }, [sticky]);\n\n  return (\n    <>\n      <div className={classes.headerTop} data-sticky={sticky || undefined}>\n        {tags && tags.length > 0 && (\n          <ul className={classes.tags}>\n            {tags.map((tag, i) => (\n              <li\n                key={`${i}:${tag.label}:${tag.href ?? ''}`}\n                className={classes.tag}\n              >\n                {tag.href ? (\n                  <Link\n                    href={tag.href}\n                    variant=\"body-medium\"\n                    color=\"secondary\"\n                    standalone\n                  >\n                    {tag.label}\n                  </Link>\n                ) : (\n                  <Text variant=\"body-medium\" color=\"secondary\">\n                    {tag.label}\n                  </Text>\n                )}\n              </li>\n            ))}\n          </ul>\n        )}\n      </div>\n      {sticky && (\n        <div\n          ref={stickySentinelRef}\n          className={classes.stickySentinel}\n          data-sticky=\"\"\n          aria-hidden=\"true\"\n        />\n      )}\n      <div\n        className={classes.content}\n        data-sticky={sticky || undefined}\n        data-stuck={isStuck || undefined}\n        data-has-tags={tags && tags.length > 0 ? '' : undefined}\n        {...dataAttributes}\n      >\n        <div className={classes.titleStack}>\n          {isStuck ? (\n            <div className={classes.breadcrumbsSmall}>\n              {breadcrumbs &&\n                breadcrumbs.map(breadcrumb => (\n                  <Fragment key={breadcrumb.label}>\n                    <Link\n                      href={breadcrumb.href}\n                      color=\"secondary\"\n                      className={classes.breadcrumbLinkSmall}\n                      standalone\n                    >\n                      {breadcrumb.label}\n                    </Link>\n                    <RiArrowRightSLine\n                      className={classes.breadcrumbSeparator}\n                      size={16}\n                      color=\"var(--bui-fg-secondary)\"\n                    />\n                  </Fragment>\n                ))}\n              <h2 className={classes.titleSmall}>{title}</h2>\n            </div>\n          ) : (\n            <div className={classes.breadcrumbs}>\n              {breadcrumbs &&\n                breadcrumbs.map(breadcrumb => (\n                  <Fragment key={breadcrumb.label}>\n                    <Link\n                      href={breadcrumb.href}\n                      color=\"secondary\"\n                      className={classes.breadcrumbLink}\n                      standalone\n                    >\n                      {breadcrumb.label}\n                    </Link>\n                    <RiArrowRightSLine\n                      className={classes.breadcrumbSeparator}\n                      size={16}\n                      color=\"var(--bui-fg-secondary)\"\n                    />\n                  </Fragment>\n                ))}\n              <h2 className={classes.title}>{title}</h2>\n            </div>\n          )}\n        </div>\n        <div className={classes.controls}>{customActions}</div>\n      </div>\n      <div className={classes.headerBottom} data-sticky={sticky || undefined}>\n        {description && (\n          <Text\n            variant=\"body-medium\"\n            color=\"secondary\"\n            className={classes.description}\n          >\n            {descriptionNodes}\n          </Text>\n        )}\n        {metadata && metadata.length > 0 && (\n          <dl className={classes.metaRow}>\n            {metadata.map((item, i) => (\n              <div key={`${i}:${item.label}`} className={classes.metaItem}>\n                <dt>\n                  <Text variant=\"body-medium\" color=\"secondary\">\n                    {item.label}\n                  </Text>\n                </dt>\n                <dd>\n                  {typeof item.value === 'string' ? (\n                    <Text variant=\"body-medium\">{item.value}</Text>\n                  ) : (\n                    item.value\n                  )}\n                </dd>\n              </div>\n            ))}\n          </dl>\n        )}\n        {tabs && (\n          <div className={classes.tabsWrapper}>\n            <HeaderNav tabs={tabs} activeTabId={activeTabId} />\n          </div>\n        )}\n      </div>\n    </>\n  );\n};\n\n/**\n * @public\n * @deprecated Use {@link Header} instead.\n */\nexport const HeaderPage = Header;\n"],"names":["Fragment"],"mappings":"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"}

package/dist/components/Header/Header.module.css.esm.js

@@ -1,7 +1,7 @@
 import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
 
-var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n  .Header_bui-Header__6fa2a92baa {\n    display: flex;\n    flex-direction: column;\n    gap: var(--bui-space-1);\n    margin-top: var(--bui-space-6);\n  }\n\n  .Header_bui-HeaderContent__6fa2a92baa {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n  }\n\n  .Header_bui-HeaderTabsWrapper__6fa2a92baa {\n    margin-left: -8px;\n  }\n\n  .Header_bui-HeaderControls__6fa2a92baa {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-2);\n  }\n\n  .Header_bui-HeaderBreadcrumbs__6fa2a92baa {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-2);\n  }\n}\n";
-var styles = {"bui-Header":"Header_bui-Header__6fa2a92baa","bui-HeaderContent":"Header_bui-HeaderContent__6fa2a92baa","bui-HeaderTabsWrapper":"Header_bui-HeaderTabsWrapper__6fa2a92baa","bui-HeaderControls":"Header_bui-HeaderControls__6fa2a92baa","bui-HeaderBreadcrumbs":"Header_bui-HeaderBreadcrumbs__6fa2a92baa"};
+var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n  .Header_bui-HeaderBottom__88cf7f55e4 {\n    display: flex;\n    flex-direction: column;\n    gap: var(--bui-space-3);\n    margin-bottom: var(--bui-space-5);\n  }\n\n  .Header_bui-HeaderTop__88cf7f55e4,\n  .Header_bui-HeaderContent__88cf7f55e4,\n  .Header_bui-HeaderBottom__88cf7f55e4 {\n    width: 100%;\n    padding-inline: var(--bui-space-5);\n    box-sizing: border-box;\n  }\n\n  .Header_bui-HeaderStickySentinel__88cf7f55e4 {\n    height: 1px;\n    margin-bottom: -1px;\n    pointer-events: none;\n  }\n\n  .Header_bui-HeaderContent__88cf7f55e4 {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    gap: var(--bui-space-3);\n    padding-top: var(--bui-space-3);\n    padding-bottom: var(--bui-space-3);\n  }\n\n  .Header_bui-HeaderContent__88cf7f55e4[data-has-tags] {\n    padding-top: var(--bui-space-2);\n  }\n\n  .Header_bui-HeaderContent__88cf7f55e4[data-sticky] {\n    position: sticky;\n    top: 0;\n    z-index: 10;\n    background-color: var(--bui-bg-app);\n\n    &[data-on-bg='neutral-1'] {\n      background-color: var(--bui-bg-neutral-1);\n    }\n\n    &[data-on-bg='neutral-2'] {\n      background-color: var(--bui-bg-neutral-2);\n    }\n\n    &[data-on-bg='neutral-3'] {\n      background-color: var(--bui-bg-neutral-3);\n    }\n  }\n\n  .Header_bui-HeaderContent__88cf7f55e4[data-sticky]::after {\n    position: absolute;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    height: 1px;\n    content: '';\n    background-color: var(--bui-border-1);\n    opacity: 0;\n    transition: opacity 200ms ease;\n  }\n\n  .Header_bui-HeaderContent__88cf7f55e4[data-stuck]::after {\n    opacity: 1;\n  }\n\n  .Header_bui-HeaderTabsWrapper__88cf7f55e4 {\n    margin-left: -8px;\n  }\n\n  .Header_bui-HeaderControls__88cf7f55e4 {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-2);\n    flex-shrink: 0;\n  }\n\n  .Header_bui-HeaderTitleStack__88cf7f55e4 {\n    position: relative;\n    flex: 1 1 auto;\n    height: 1lh;\n    min-width: 0;\n    font-size: var(--bui-font-size-6);\n    line-height: 140%;\n    overflow: hidden;\n  }\n\n  .Header_bui-HeaderBreadcrumbs__88cf7f55e4,\n  .Header_bui-HeaderBreadcrumbsSmall__88cf7f55e4 {\n    position: absolute;\n    inset-inline: 0;\n    top: 50%;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-2);\n    min-width: 0;\n    transform: translateY(-50%);\n  }\n\n  .Header_bui-HeaderBreadcrumbsSmall__88cf7f55e4 {\n    gap: var(--bui-space-1);\n  }\n\n  .Header_bui-HeaderBreadcrumbs__88cf7f55e4 .Header_bui-HeaderBreadcrumbLink__88cf7f55e4,\n  .Header_bui-HeaderBreadcrumbsSmall__88cf7f55e4 .Header_bui-HeaderBreadcrumbLinkSmall__88cf7f55e4 {\n    max-width: 240px;\n    overflow: hidden;\n    font-family: var(--bui-font-regular);\n    font-weight: var(--bui-font-weight-bold);\n    line-height: inherit;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .Header_bui-HeaderBreadcrumbs__88cf7f55e4 .Header_bui-HeaderBreadcrumbLink__88cf7f55e4 {\n    font-size: inherit;\n  }\n\n  .Header_bui-HeaderBreadcrumbsSmall__88cf7f55e4 .Header_bui-HeaderBreadcrumbLinkSmall__88cf7f55e4 {\n    font-size: var(--bui-font-size-4);\n  }\n\n  .Header_bui-HeaderBreadcrumbSeparator__88cf7f55e4 {\n    flex-shrink: 0;\n  }\n\n  .Header_bui-HeaderTitle__88cf7f55e4,\n  .Header_bui-HeaderTitleSmall__88cf7f55e4 {\n    margin: 0;\n    padding: 0;\n    flex: 1 1 auto;\n    min-width: 0;\n    font-family: var(--bui-font-regular);\n    font-weight: var(--bui-font-weight-bold);\n    line-height: inherit;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .Header_bui-HeaderTitle__88cf7f55e4 {\n    font-size: inherit;\n  }\n\n  .Header_bui-HeaderTitleSmall__88cf7f55e4 {\n    font-size: var(--bui-font-size-4);\n  }\n\n  .Header_bui-HeaderTags__88cf7f55e4 {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-2);\n    flex-wrap: wrap;\n    list-style: none;\n    margin: 0;\n    padding: 0;\n  }\n\n  .Header_bui-HeaderTag__88cf7f55e4 {\n    display: flex;\n    align-items: center;\n    gap: var(--bui-space-2);\n  }\n\n  .Header_bui-HeaderTag__88cf7f55e4 + .Header_bui-HeaderTag__88cf7f55e4::before {\n    content: '';\n    width: 3px;\n    height: 3px;\n    border-radius: 50%;\n    background-color: var(--bui-fg-secondary);\n    flex-shrink: 0;\n  }\n\n  .Header_bui-HeaderMetaRow__88cf7f55e4 {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-5);\n    flex-wrap: wrap;\n    margin: 0;\n  }\n\n  .Header_bui-HeaderMetaItem__88cf7f55e4 {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-2);\n\n    dd {\n      margin: 0;\n    }\n  }\n}\n";
+var styles = {"bui-HeaderBottom":"Header_bui-HeaderBottom__88cf7f55e4","bui-HeaderTop":"Header_bui-HeaderTop__88cf7f55e4","bui-HeaderContent":"Header_bui-HeaderContent__88cf7f55e4","bui-HeaderStickySentinel":"Header_bui-HeaderStickySentinel__88cf7f55e4","bui-HeaderTabsWrapper":"Header_bui-HeaderTabsWrapper__88cf7f55e4","bui-HeaderControls":"Header_bui-HeaderControls__88cf7f55e4","bui-HeaderTitleStack":"Header_bui-HeaderTitleStack__88cf7f55e4","bui-HeaderBreadcrumbs":"Header_bui-HeaderBreadcrumbs__88cf7f55e4","bui-HeaderBreadcrumbsSmall":"Header_bui-HeaderBreadcrumbsSmall__88cf7f55e4","bui-HeaderBreadcrumbLink":"Header_bui-HeaderBreadcrumbLink__88cf7f55e4","bui-HeaderBreadcrumbLinkSmall":"Header_bui-HeaderBreadcrumbLinkSmall__88cf7f55e4","bui-HeaderBreadcrumbSeparator":"Header_bui-HeaderBreadcrumbSeparator__88cf7f55e4","bui-HeaderTitle":"Header_bui-HeaderTitle__88cf7f55e4","bui-HeaderTitleSmall":"Header_bui-HeaderTitleSmall__88cf7f55e4","bui-HeaderTags":"Header_bui-HeaderTags__88cf7f55e4","bui-HeaderTag":"Header_bui-HeaderTag__88cf7f55e4","bui-HeaderMetaRow":"Header_bui-HeaderMetaRow__88cf7f55e4","bui-HeaderMetaItem":"Header_bui-HeaderMetaItem__88cf7f55e4"};
 styleInject(css_248z);
 
 export { styles as default };

package/dist/components/Header/HeaderMetadataStatus.esm.js

@@ -0,0 +1,32 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Text } from '../Text/Text.esm.js';
+import 'clsx';
+import '../../hooks/useBreakpoint.esm.js';
+import '../../hooks/useBg.esm.js';
+import '../../hooks/useDefinition/helpers.esm.js';
+import '../../analytics/useAnalytics.esm.js';
+import 'react-router-dom';
+import '../Text/Text.module.css.esm.js';
+import { Link } from '../Link/Link.esm.js';
+import '../Link/Link.module.css.esm.js';
+import styles from './HeaderMetadataStatus.module.css.esm.js';
+
+const HeaderMetadataStatus = ({
+  label,
+  color,
+  href
+}) => {
+  return /* @__PURE__ */ jsxs("div", { className: styles.single, children: [
+    /* @__PURE__ */ jsx(
+      "span",
+      {
+        "aria-hidden": "true",
+        className: `${styles.dot} ${styles[`dot-${color}`]}`
+      }
+    ),
+    /* @__PURE__ */ jsx(Text, { variant: "body-medium", children: href ? /* @__PURE__ */ jsx(Link, { href, standalone: true, children: label }) : label })
+  ] });
+};
+
+export { HeaderMetadataStatus };
+//# sourceMappingURL=HeaderMetadataStatus.esm.js.map

package/dist/components/Header/HeaderMetadataStatus.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderMetadataStatus.esm.js","sources":["../../../src/components/Header/HeaderMetadataStatus.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { HeaderMetadataStatusProps } from './types';\nimport { Text } from '../Text';\nimport { Link } from '../Link';\nimport styles from './HeaderMetadataStatus.module.css';\n\n/**\n * Displays a single status indicator as a coloured dot with a label inside a\n * Header metadata value. Optionally renders the label as a link when href is provided.\n *\n * @public\n */\nexport const HeaderMetadataStatus = ({\n  label,\n  color,\n  href,\n}: HeaderMetadataStatusProps) => {\n  return (\n    <div className={styles.single}>\n      <span\n        aria-hidden=\"true\"\n        className={`${styles.dot} ${styles[`dot-${color}`]}`}\n      />\n      <Text variant=\"body-medium\">\n        {href ? (\n          <Link href={href} standalone>\n            {label}\n          </Link>\n        ) : (\n          label\n        )}\n      </Text>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;AA2BO,MAAM,uBAAuB,CAAC;AAAA,EACnC,KAAA;AAAA,EACA,KAAA;AAAA,EACA;AACF,CAAA,KAAiC;AAC/B,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,MAAA,EACrB,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,aAAA,EAAY,MAAA;AAAA,QACZ,SAAA,EAAW,GAAG,MAAA,CAAO,GAAG,IAAI,MAAA,CAAO,CAAA,IAAA,EAAO,KAAK,CAAA,CAAE,CAAC,CAAA;AAAA;AAAA,KACpD;AAAA,oBACA,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,aAAA,EACX,QAAA,EAAA,IAAA,mBACC,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAY,UAAA,EAAU,IAAA,EACzB,QAAA,EAAA,KAAA,EACH,CAAA,GAEA,KAAA,EAEJ;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/Header/HeaderMetadataStatus.module.css.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n  .HeaderMetadataStatus_single__eb0b2e23ff {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-2);\n  }\n\n  .HeaderMetadataStatus_dot__eb0b2e23ff {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    flex-shrink: 0;\n  }\n\n  .HeaderMetadataStatus_dot-danger__eb0b2e23ff {\n    background-color: var(--bui-fg-danger);\n  }\n\n  .HeaderMetadataStatus_dot-warning__eb0b2e23ff {\n    background-color: var(--bui-fg-warning);\n  }\n\n  .HeaderMetadataStatus_dot-success__eb0b2e23ff {\n    background-color: var(--bui-fg-success);\n  }\n\n  .HeaderMetadataStatus_dot-info__eb0b2e23ff {\n    background-color: var(--bui-fg-info);\n  }\n}\n";
+var styles = {"single":"HeaderMetadataStatus_single__eb0b2e23ff","dot":"HeaderMetadataStatus_dot__eb0b2e23ff","dot-danger":"HeaderMetadataStatus_dot-danger__eb0b2e23ff","dot-warning":"HeaderMetadataStatus_dot-warning__eb0b2e23ff","dot-success":"HeaderMetadataStatus_dot-success__eb0b2e23ff","dot-info":"HeaderMetadataStatus_dot-info__eb0b2e23ff"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=HeaderMetadataStatus.module.css.esm.js.map

package/dist/components/Header/HeaderMetadataStatus.module.css.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderMetadataStatus.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/Header/HeaderMetadataUsers.esm.js

@@ -0,0 +1,92 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Avatar } from '../Avatar/Avatar.esm.js';
+import 'clsx';
+import '../../hooks/useBreakpoint.esm.js';
+import '../../hooks/useBg.esm.js';
+import '../../hooks/useDefinition/helpers.esm.js';
+import '../../analytics/useAnalytics.esm.js';
+import 'react-router-dom';
+import '../Avatar/Avatar.module.css.esm.js';
+import { TooltipTrigger, Tooltip } from '../Tooltip/Tooltip.esm.js';
+import '../Tooltip/Tooltip.module.css.esm.js';
+import { Text } from '../Text/Text.esm.js';
+import '../Text/Text.module.css.esm.js';
+import { Link } from '../Link/Link.esm.js';
+import '../Link/Link.module.css.esm.js';
+import { Pressable } from 'react-aria';
+import styles from './HeaderMetadataUsers.module.css.esm.js';
+
+const HeaderMetadataUsers = ({
+  users
+}) => {
+  if (users.length === 0) return null;
+  if (users.length === 1) {
+    const user = users[0];
+    if (user.href) {
+      return /* @__PURE__ */ jsxs(
+        Link,
+        {
+          href: user.href,
+          variant: "body-medium",
+          standalone: true,
+          className: styles.single,
+          children: [
+            /* @__PURE__ */ jsx(
+              Avatar,
+              {
+                src: user.src ?? "data:,",
+                name: user.name,
+                size: "small",
+                purpose: "decoration"
+              }
+            ),
+            user.name
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxs("div", { className: styles.single, children: [
+      /* @__PURE__ */ jsx(
+        Avatar,
+        {
+          src: user.src ?? "data:,",
+          name: user.name,
+          size: "small",
+          purpose: "decoration"
+        }
+      ),
+      /* @__PURE__ */ jsx(Text, { variant: "body-medium", children: user.name })
+    ] });
+  }
+  return /* @__PURE__ */ jsx("ul", { className: styles.stack, children: users.map((user, i) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(TooltipTrigger, { children: [
+    user.href ? /* @__PURE__ */ jsx(
+      Link,
+      {
+        href: user.href,
+        "aria-label": user.name,
+        className: styles.avatarLink,
+        children: /* @__PURE__ */ jsx(
+          Avatar,
+          {
+            src: user.src ?? "data:,",
+            name: user.name,
+            size: "small",
+            purpose: "decoration"
+          }
+        )
+      }
+    ) : /* @__PURE__ */ jsx(Pressable, { children: /* @__PURE__ */ jsx(
+      Avatar,
+      {
+        src: user.src ?? "data:,",
+        name: user.name,
+        size: "small",
+        purpose: "informative"
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Tooltip, { children: user.name })
+  ] }) }, user.href ?? `${i}:${user.name}`)) });
+};
+
+export { HeaderMetadataUsers };
+//# sourceMappingURL=HeaderMetadataUsers.esm.js.map

package/dist/components/Header/HeaderMetadataUsers.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderMetadataUsers.esm.js","sources":["../../../src/components/Header/HeaderMetadataUsers.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { HeaderMetadataUser } from './types';\nimport { Avatar } from '../Avatar';\nimport { Tooltip, TooltipTrigger } from '../Tooltip';\nimport { Text } from '../Text';\nimport { Link } from '../Link';\nimport { Pressable } from 'react-aria';\nimport styles from './HeaderMetadataUsers.module.css';\n\n/**\n * Displays a list of users as avatars inside a Header metadata value.\n * A single user shows the avatar with their name beside it.\n * Multiple users show avatars in a row with the name revealed on hover via tooltip.\n * When a user has an `href`, the avatar and name become links.\n *\n * @public\n */\nexport const HeaderMetadataUsers = ({\n  users,\n}: {\n  users: HeaderMetadataUser[];\n}) => {\n  if (users.length === 0) return null;\n\n  if (users.length === 1) {\n    const user = users[0];\n    if (user.href) {\n      return (\n        <Link\n          href={user.href}\n          variant=\"body-medium\"\n          standalone\n          className={styles.single}\n        >\n          <Avatar\n            src={user.src ?? 'data:,'}\n            name={user.name}\n            size=\"small\"\n            purpose=\"decoration\"\n          />\n          {user.name}\n        </Link>\n      );\n    }\n\n    return (\n      <div className={styles.single}>\n        <Avatar\n          src={user.src ?? 'data:,'}\n          name={user.name}\n          size=\"small\"\n          purpose=\"decoration\"\n        />\n        <Text variant=\"body-medium\">{user.name}</Text>\n      </div>\n    );\n  }\n\n  return (\n    <ul className={styles.stack}>\n      {users.map((user, i) => (\n        <li key={user.href ?? `${i}:${user.name}`}>\n          <TooltipTrigger>\n            {user.href ? (\n              <Link\n                href={user.href}\n                aria-label={user.name}\n                className={styles.avatarLink}\n              >\n                <Avatar\n                  src={user.src ?? 'data:,'}\n                  name={user.name}\n                  size=\"small\"\n                  purpose=\"decoration\"\n                />\n              </Link>\n            ) : (\n              <Pressable>\n                <Avatar\n                  src={user.src ?? 'data:,'}\n                  name={user.name}\n                  size=\"small\"\n                  purpose=\"informative\"\n                />\n              </Pressable>\n            )}\n            <Tooltip>{user.name}</Tooltip>\n          </TooltipTrigger>\n        </li>\n      ))}\n    </ul>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAgCO,MAAM,sBAAsB,CAAC;AAAA,EAClC;AACF,CAAA,KAEM;AACJ,EAAA,IAAI,KAAA,CAAM,MAAA,KAAW,CAAA,EAAG,OAAO,IAAA;AAE/B,EAAA,IAAI,KAAA,CAAM,WAAW,CAAA,EAAG;AACtB,IAAA,MAAM,IAAA,GAAO,MAAM,CAAC,CAAA;AACpB,IAAA,IAAI,KAAK,IAAA,EAAM;AACb,MAAA,uBACE,IAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,MAAM,IAAA,CAAK,IAAA;AAAA,UACX,OAAA,EAAQ,aAAA;AAAA,UACR,UAAA,EAAU,IAAA;AAAA,UACV,WAAW,MAAA,CAAO,MAAA;AAAA,UAElB,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,GAAA,EAAK,KAAK,GAAA,IAAO,QAAA;AAAA,gBACjB,MAAM,IAAA,CAAK,IAAA;AAAA,gBACX,IAAA,EAAK,OAAA;AAAA,gBACL,OAAA,EAAQ;AAAA;AAAA,aACV;AAAA,YACC,IAAA,CAAK;AAAA;AAAA;AAAA,OACR;AAAA,IAEJ;AAEA,IAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,MAAA,EACrB,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,GAAA,EAAK,KAAK,GAAA,IAAO,QAAA;AAAA,UACjB,MAAM,IAAA,CAAK,IAAA;AAAA,UACX,IAAA,EAAK,OAAA;AAAA,UACL,OAAA,EAAQ;AAAA;AAAA,OACV;AAAA,sBACA,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,aAAA,EAAe,eAAK,IAAA,EAAK;AAAA,KAAA,EACzC,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACE,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAW,MAAA,CAAO,KAAA,EACnB,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,EAAM,CAAA,qBAChB,GAAA,CAAC,IAAA,EAAA,EACC,+BAAC,cAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,IAAA,CAAK,IAAA,mBACJ,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,MAAM,IAAA,CAAK,IAAA;AAAA,QACX,cAAY,IAAA,CAAK,IAAA;AAAA,QACjB,WAAW,MAAA,CAAO,UAAA;AAAA,QAElB,QAAA,kBAAA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,GAAA,EAAK,KAAK,GAAA,IAAO,QAAA;AAAA,YACjB,MAAM,IAAA,CAAK,IAAA;AAAA,YACX,IAAA,EAAK,OAAA;AAAA,YACL,OAAA,EAAQ;AAAA;AAAA;AACV;AAAA,KACF,uBAEC,SAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,KAAK,GAAA,IAAO,QAAA;AAAA,QACjB,MAAM,IAAA,CAAK,IAAA;AAAA,QACX,IAAA,EAAK,OAAA;AAAA,QACL,OAAA,EAAQ;AAAA;AAAA,KACV,EACF,CAAA;AAAA,oBAEF,GAAA,CAAC,OAAA,EAAA,EAAS,QAAA,EAAA,IAAA,CAAK,IAAA,EAAK;AAAA,GAAA,EACtB,CAAA,EAAA,EA1BO,IAAA,CAAK,IAAA,IAAQ,CAAA,EAAG,CAAC,IAAI,IAAA,CAAK,IAAI,CAAA,CA2BvC,CACD,CAAA,EACH,CAAA;AAEJ;;;;"}

package/dist/components/Header/HeaderMetadataUsers.module.css.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n  .HeaderMetadataUsers_single__24e14a3de1 {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-2);\n  }\n\n  .HeaderMetadataUsers_stack__24e14a3de1 {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-1);\n    list-style: none;\n    margin: 0;\n    padding: 0;\n  }\n\n  .HeaderMetadataUsers_avatarLink__24e14a3de1 {\n    display: flex;\n    text-decoration: none;\n  }\n}\n";
+var styles = {"single":"HeaderMetadataUsers_single__24e14a3de1","stack":"HeaderMetadataUsers_stack__24e14a3de1","avatarLink":"HeaderMetadataUsers_avatarLink__24e14a3de1"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=HeaderMetadataUsers.module.css.esm.js.map

package/dist/components/Header/HeaderMetadataUsers.module.css.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderMetadataUsers.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/Header/definition.esm.js

@@ -10,12 +10,27 @@ import styles from './Header.module.css.esm.js';
 
 const HeaderDefinition = defineComponent()({
   styles,
+  bg: "consumer",
   classNames: {
-    root: "bui-Header",
+    headerTop: "bui-HeaderTop",
+    stickySentinel: "bui-HeaderStickySentinel",
     content: "bui-HeaderContent",
+    headerBottom: "bui-HeaderBottom",
     breadcrumbs: "bui-HeaderBreadcrumbs",
+    breadcrumbsSmall: "bui-HeaderBreadcrumbsSmall",
+    breadcrumbLink: "bui-HeaderBreadcrumbLink",
+    breadcrumbLinkSmall: "bui-HeaderBreadcrumbLinkSmall",
+    breadcrumbSeparator: "bui-HeaderBreadcrumbSeparator",
+    titleStack: "bui-HeaderTitleStack",
+    title: "bui-HeaderTitle",
+    titleSmall: "bui-HeaderTitleSmall",
     tabsWrapper: "bui-HeaderTabsWrapper",
-    controls: "bui-HeaderControls"
+    controls: "bui-HeaderControls",
+    tags: "bui-HeaderTags",
+    tag: "bui-HeaderTag",
+    description: "bui-HeaderDescription",
+    metaRow: "bui-HeaderMetaRow",
+    metaItem: "bui-HeaderMetaItem"
   },
   propDefs: {
     title: {},
@@ -23,7 +38,11 @@ const HeaderDefinition = defineComponent()({
     tabs: {},
     activeTabId: {},
     breadcrumbs: {},
-    className: {}
+    description: {},
+    tags: {},
+    metadata: {},
+    className: {},
+    sticky: {}
   }
 });
 const HeaderPageDefinition = HeaderDefinition;

package/dist/components/Header/definition.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Header/definition.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { defineComponent } from '../../hooks/useDefinition';\nimport type { HeaderOwnProps } from './types';\nimport styles from './Header.module.css';\n\n/**\n * Component definition for Header\n * @public\n */\nexport const HeaderDefinition = defineComponent<HeaderOwnProps>()({\n  styles,\n  classNames: {\n    root: 'bui-Header',\n    content: 'bui-HeaderContent',\n    breadcrumbs: 'bui-HeaderBreadcrumbs',\n    tabsWrapper: 'bui-HeaderTabsWrapper',\n    controls: 'bui-HeaderControls',\n  },\n  propDefs: {\n    title: {},\n    customActions: {},\n    tabs: {},\n    activeTabId: {},\n    breadcrumbs: {},\n    className: {},\n  },\n});\n\n/**\n * @public\n * @deprecated Use {@link HeaderDefinition} instead.\n */\nexport const HeaderPageDefinition = HeaderDefinition;\n"],"names":[],"mappings":";;;;;;;;;;AAwBO,MAAM,gBAAA,GAAmB,iBAAgC,CAAE;AAAA,EAChE,MAAA;AAAA,EACA,UAAA,EAAY;AAAA,IACV,IAAA,EAAM,YAAA;AAAA,IACN,OAAA,EAAS,mBAAA;AAAA,IACT,WAAA,EAAa,uBAAA;AAAA,IACb,WAAA,EAAa,uBAAA;AAAA,IACb,QAAA,EAAU;AAAA,GACZ;AAAA,EACA,QAAA,EAAU;AAAA,IACR,OAAO,EAAC;AAAA,IACR,eAAe,EAAC;AAAA,IAChB,MAAM,EAAC;AAAA,IACP,aAAa,EAAC;AAAA,IACd,aAAa,EAAC;AAAA,IACd,WAAW;AAAC;AAEhB,CAAC;AAMM,MAAM,oBAAA,GAAuB;;;;"}
+{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Header/definition.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { defineComponent } from '../../hooks/useDefinition';\nimport type { HeaderOwnProps } from './types';\nimport styles from './Header.module.css';\n\n/**\n * Component definition for Header\n * @public\n */\nexport const HeaderDefinition = defineComponent<HeaderOwnProps>()({\n  styles,\n  bg: 'consumer',\n  classNames: {\n    headerTop: 'bui-HeaderTop',\n    stickySentinel: 'bui-HeaderStickySentinel',\n    content: 'bui-HeaderContent',\n    headerBottom: 'bui-HeaderBottom',\n    breadcrumbs: 'bui-HeaderBreadcrumbs',\n    breadcrumbsSmall: 'bui-HeaderBreadcrumbsSmall',\n    breadcrumbLink: 'bui-HeaderBreadcrumbLink',\n    breadcrumbLinkSmall: 'bui-HeaderBreadcrumbLinkSmall',\n    breadcrumbSeparator: 'bui-HeaderBreadcrumbSeparator',\n    titleStack: 'bui-HeaderTitleStack',\n    title: 'bui-HeaderTitle',\n    titleSmall: 'bui-HeaderTitleSmall',\n    tabsWrapper: 'bui-HeaderTabsWrapper',\n    controls: 'bui-HeaderControls',\n    tags: 'bui-HeaderTags',\n    tag: 'bui-HeaderTag',\n    description: 'bui-HeaderDescription',\n    metaRow: 'bui-HeaderMetaRow',\n    metaItem: 'bui-HeaderMetaItem',\n  },\n  propDefs: {\n    title: {},\n    customActions: {},\n    tabs: {},\n    activeTabId: {},\n    breadcrumbs: {},\n    description: {},\n    tags: {},\n    metadata: {},\n    className: {},\n    sticky: {},\n  },\n});\n\n/**\n * @public\n * @deprecated Use {@link HeaderDefinition} instead.\n */\nexport const HeaderPageDefinition = HeaderDefinition;\n"],"names":[],"mappings":";;;;;;;;;;AAwBO,MAAM,gBAAA,GAAmB,iBAAgC,CAAE;AAAA,EAChE,MAAA;AAAA,EACA,EAAA,EAAI,UAAA;AAAA,EACJ,UAAA,EAAY;AAAA,IACV,SAAA,EAAW,eAAA;AAAA,IACX,cAAA,EAAgB,0BAAA;AAAA,IAChB,OAAA,EAAS,mBAAA;AAAA,IACT,YAAA,EAAc,kBAAA;AAAA,IACd,WAAA,EAAa,uBAAA;AAAA,IACb,gBAAA,EAAkB,4BAAA;AAAA,IAClB,cAAA,EAAgB,0BAAA;AAAA,IAChB,mBAAA,EAAqB,+BAAA;AAAA,IACrB,mBAAA,EAAqB,+BAAA;AAAA,IACrB,UAAA,EAAY,sBAAA;AAAA,IACZ,KAAA,EAAO,iBAAA;AAAA,IACP,UAAA,EAAY,sBAAA;AAAA,IACZ,WAAA,EAAa,uBAAA;AAAA,IACb,QAAA,EAAU,oBAAA;AAAA,IACV,IAAA,EAAM,gBAAA;AAAA,IACN,GAAA,EAAK,eAAA;AAAA,IACL,WAAA,EAAa,uBAAA;AAAA,IACb,OAAA,EAAS,mBAAA;AAAA,IACT,QAAA,EAAU;AAAA,GACZ;AAAA,EACA,QAAA,EAAU;AAAA,IACR,OAAO,EAAC;AAAA,IACR,eAAe,EAAC;AAAA,IAChB,MAAM,EAAC;AAAA,IACP,aAAa,EAAC;AAAA,IACd,aAAa,EAAC;AAAA,IACd,aAAa,EAAC;AAAA,IACd,MAAM,EAAC;AAAA,IACP,UAAU,EAAC;AAAA,IACX,WAAW,EAAC;AAAA,IACZ,QAAQ;AAAC;AAEb,CAAC;AAMM,MAAM,oBAAA,GAAuB;;;;"}

package/dist/components/Link/Link.esm.js

@@ -1,7 +1,8 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useLink } from 'react-aria';
+import { useLink, useFocusRing, mergeProps } from 'react-aria';
 import { useDefinition } from '../../hooks/useDefinition/useDefinition.esm.js';
+import { useResolvedHref } from '../../hooks/useResolvedHref.esm.js';
 import { LinkDefinition } from './definition.esm.js';
 import { getNodeText } from '../../analytics/getNodeText.esm.js';
 
@@ -14,6 +15,8 @@ const LinkInternal = forwardRef((props, ref) => {
   const internalRef = useRef(null);
   const linkRef = ref || internalRef;
   const { linkProps } = useLink(restProps, linkRef);
+  const { isFocusVisible, focusProps } = useFocusRing();
+  const resolvedHref = useResolvedHref(restProps.href);
   const handleClick = (e) => {
     linkProps.onClick?.(e);
     const text = restProps["aria-label"] ?? getNodeText(children) ?? String(restProps.href ?? "");
@@ -24,12 +27,14 @@ const LinkInternal = forwardRef((props, ref) => {
   return /* @__PURE__ */ jsx(
     "a",
     {
-      ...linkProps,
+      ...mergeProps(linkProps, focusProps),
       ...dataAttributes,
       ...restProps,
+      href: resolvedHref,
       ref: linkRef,
       title,
       className: classes.root,
+      "data-focus-visible": isFocusVisible || void 0,
       onClick: handleClick,
       children
     }

package/dist/components/Link/Link.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.esm.js","sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useRef } from 'react';\nimport { useLink } from 'react-aria';\nimport type { LinkProps } from './types';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { LinkDefinition } from './definition';\nimport { getNodeText } from '../../analytics/getNodeText';\n\nconst LinkInternal = forwardRef<HTMLAnchorElement, LinkProps>((props, ref) => {\n  const { ownProps, restProps, dataAttributes, analytics } = useDefinition(\n    LinkDefinition,\n    props,\n  );\n  const { classes, title, children } = ownProps;\n\n  const internalRef = useRef<HTMLAnchorElement>(null);\n  const linkRef = (ref || internalRef) as React.RefObject<HTMLAnchorElement>;\n\n  const { linkProps } = useLink(restProps, linkRef);\n\n  const handleClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n    linkProps.onClick?.(e);\n    const text =\n      restProps['aria-label'] ??\n      getNodeText(children) ??\n      String(restProps.href ?? '');\n    analytics.captureEvent('click', text, {\n      attributes: { to: String(restProps.href ?? '') },\n    });\n  };\n\n  return (\n    <a\n      {...linkProps}\n      {...dataAttributes}\n      {...(restProps as React.AnchorHTMLAttributes<HTMLAnchorElement>)}\n      ref={linkRef}\n      title={title}\n      className={classes.root}\n      onClick={handleClick}\n    >\n      {children}\n    </a>\n  );\n});\n\nLinkInternal.displayName = 'LinkInternal';\n\n/**\n * A styled anchor element that supports analytics event tracking on click.\n *\n * @public\n */\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>((props, ref) => {\n  return <LinkInternal {...props} ref={ref} />;\n});\n\nLink.displayName = 'Link';\n"],"names":[],"mappings":";;;;;;;AAuBA,MAAM,YAAA,GAAe,UAAA,CAAyC,CAAC,KAAA,EAAO,GAAA,KAAQ;AAC5E,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,cAAA,EAAgB,WAAU,GAAI,aAAA;AAAA,IACzD,cAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,EAAE,OAAA,EAAS,KAAA,EAAO,QAAA,EAAS,GAAI,QAAA;AAErC,EAAA,MAAM,WAAA,GAAc,OAA0B,IAAI,CAAA;AAClD,EAAA,MAAM,UAAW,GAAA,IAAO,WAAA;AAExB,EAAA,MAAM,EAAE,SAAA,EAAU,GAAI,OAAA,CAAQ,WAAW,OAAO,CAAA;AAEhD,EAAA,MAAM,WAAA,GAAc,CAAC,CAAA,KAA2C;AAC9D,IAAA,SAAA,CAAU,UAAU,CAAC,CAAA;AACrB,IAAA,MAAM,IAAA,GACJ,SAAA,CAAU,YAAY,CAAA,IACtB,WAAA,CAAY,QAAQ,CAAA,IACpB,MAAA,CAAO,SAAA,CAAU,IAAA,IAAQ,EAAE,CAAA;AAC7B,IAAA,SAAA,CAAU,YAAA,CAAa,SAAS,IAAA,EAAM;AAAA,MACpC,YAAY,EAAE,EAAA,EAAI,OAAO,SAAA,CAAU,IAAA,IAAQ,EAAE,CAAA;AAAE,KAChD,CAAA;AAAA,EACH,CAAA;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACH,GAAG,cAAA;AAAA,MACH,GAAI,SAAA;AAAA,MACL,GAAA,EAAK,OAAA;AAAA,MACL,KAAA;AAAA,MACA,WAAW,OAAA,CAAQ,IAAA;AAAA,MACnB,OAAA,EAAS,WAAA;AAAA,MAER;AAAA;AAAA,GACH;AAEJ,CAAC,CAAA;AAED,YAAA,CAAa,WAAA,GAAc,cAAA;AAOpB,MAAM,IAAA,GAAO,UAAA,CAAyC,CAAC,KAAA,EAAO,GAAA,KAAQ;AAC3E,EAAA,uBAAO,GAAA,CAAC,YAAA,EAAA,EAAc,GAAG,KAAA,EAAO,GAAA,EAAU,CAAA;AAC5C,CAAC;AAED,IAAA,CAAK,WAAA,GAAc,MAAA;;;;"}
+{"version":3,"file":"Link.esm.js","sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useRef } from 'react';\nimport { mergeProps, useFocusRing, useLink } from 'react-aria';\nimport type { LinkProps } from './types';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { useResolvedHref } from '../../hooks/useResolvedHref';\nimport { LinkDefinition } from './definition';\nimport { getNodeText } from '../../analytics/getNodeText';\n\nconst LinkInternal = forwardRef<HTMLAnchorElement, LinkProps>((props, ref) => {\n  const { ownProps, restProps, dataAttributes, analytics } = useDefinition(\n    LinkDefinition,\n    props,\n  );\n  const { classes, title, children } = ownProps;\n\n  const internalRef = useRef<HTMLAnchorElement>(null);\n  const linkRef = (ref || internalRef) as React.RefObject<HTMLAnchorElement>;\n\n  const { linkProps } = useLink(restProps, linkRef);\n  const { isFocusVisible, focusProps } = useFocusRing();\n  const resolvedHref = useResolvedHref(restProps.href);\n\n  const handleClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n    linkProps.onClick?.(e);\n    const text =\n      restProps['aria-label'] ??\n      getNodeText(children) ??\n      String(restProps.href ?? '');\n    analytics.captureEvent('click', text, {\n      attributes: { to: String(restProps.href ?? '') },\n    });\n  };\n\n  return (\n    <a\n      {...mergeProps(linkProps, focusProps)}\n      {...dataAttributes}\n      {...(restProps as React.AnchorHTMLAttributes<HTMLAnchorElement>)}\n      href={resolvedHref}\n      ref={linkRef}\n      title={title}\n      className={classes.root}\n      data-focus-visible={isFocusVisible || undefined}\n      onClick={handleClick}\n    >\n      {children}\n    </a>\n  );\n});\n\nLinkInternal.displayName = 'LinkInternal';\n\n/**\n * A styled anchor element that supports analytics event tracking on click.\n *\n * @public\n */\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>((props, ref) => {\n  return <LinkInternal {...props} ref={ref} />;\n});\n\nLink.displayName = 'Link';\n"],"names":[],"mappings":";;;;;;;;AAwBA,MAAM,YAAA,GAAe,UAAA,CAAyC,CAAC,KAAA,EAAO,GAAA,KAAQ;AAC5E,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,cAAA,EAAgB,WAAU,GAAI,aAAA;AAAA,IACzD,cAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,EAAE,OAAA,EAAS,KAAA,EAAO,QAAA,EAAS,GAAI,QAAA;AAErC,EAAA,MAAM,WAAA,GAAc,OAA0B,IAAI,CAAA;AAClD,EAAA,MAAM,UAAW,GAAA,IAAO,WAAA;AAExB,EAAA,MAAM,EAAE,SAAA,EAAU,GAAI,OAAA,CAAQ,WAAW,OAAO,CAAA;AAChD,EAAA,MAAM,EAAE,cAAA,EAAgB,UAAA,EAAW,GAAI,YAAA,EAAa;AACpD,EAAA,MAAM,YAAA,GAAe,eAAA,CAAgB,SAAA,CAAU,IAAI,CAAA;AAEnD,EAAA,MAAM,WAAA,GAAc,CAAC,CAAA,KAA2C;AAC9D,IAAA,SAAA,CAAU,UAAU,CAAC,CAAA;AACrB,IAAA,MAAM,IAAA,GACJ,SAAA,CAAU,YAAY,CAAA,IACtB,WAAA,CAAY,QAAQ,CAAA,IACpB,MAAA,CAAO,SAAA,CAAU,IAAA,IAAQ,EAAE,CAAA;AAC7B,IAAA,SAAA,CAAU,YAAA,CAAa,SAAS,IAAA,EAAM;AAAA,MACpC,YAAY,EAAE,EAAA,EAAI,OAAO,SAAA,CAAU,IAAA,IAAQ,EAAE,CAAA;AAAE,KAChD,CAAA;AAAA,EACH,CAAA;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA,CAAW,SAAA,EAAW,UAAU,CAAA;AAAA,MACnC,GAAG,cAAA;AAAA,MACH,GAAI,SAAA;AAAA,MACL,IAAA,EAAM,YAAA;AAAA,MACN,GAAA,EAAK,OAAA;AAAA,MACL,KAAA;AAAA,MACA,WAAW,OAAA,CAAQ,IAAA;AAAA,MACnB,sBAAoB,cAAA,IAAkB,MAAA;AAAA,MACtC,OAAA,EAAS,WAAA;AAAA,MAER;AAAA;AAAA,GACH;AAEJ,CAAC,CAAA;AAED,YAAA,CAAa,WAAA,GAAc,cAAA;AAOpB,MAAM,IAAA,GAAO,UAAA,CAAyC,CAAC,KAAA,EAAO,GAAA,KAAQ;AAC3E,EAAA,uBAAO,GAAA,CAAC,YAAA,EAAA,EAAc,GAAG,KAAA,EAAO,GAAA,EAAU,CAAA;AAC5C,CAAC;AAED,IAAA,CAAK,WAAA,GAAc,MAAA;;;;"}

package/dist/components/Link/Link.module.css.esm.js

@@ -1,7 +1,7 @@
 import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
 
-var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n  .Link_bui-Link__bb74dc66c4 {\n    font-family: var(--bui-font-regular);\n    padding: 0;\n    margin: 0;\n    cursor: pointer;\n    display: inline-block;\n\n    text-decoration-line: underline;\n    text-decoration-style: solid;\n    text-decoration-thickness: min(2px, max(1px, 0.05em));\n    text-underline-offset: calc(0.025em + 2px);\n    text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);\n\n    &:hover {\n      text-decoration-line: underline;\n      text-decoration-style: solid;\n      text-decoration-thickness: min(2px, max(1px, 0.05em));\n      text-underline-offset: calc(0.025em + 2px);\n      text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);\n    }\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-variant='title-large'] {\n    font-size: var(--bui-font-size-8);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-variant='title-medium'] {\n    font-size: var(--bui-font-size-7);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-variant='title-small'] {\n    font-size: var(--bui-font-size-6);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-variant='title-x-small'] {\n    font-size: var(--bui-font-size-5);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-variant='body-large'] {\n    font-size: var(--bui-font-size-4);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-variant='body-medium'] {\n    font-size: var(--bui-font-size-3);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-variant='body-small'] {\n    font-size: var(--bui-font-size-2);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-variant='body-x-small'] {\n    font-size: var(--bui-font-size-1);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-weight='regular'] {\n    font-weight: var(--bui-font-weight-regular);\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-weight='bold'] {\n    font-weight: var(--bui-font-weight-bold);\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-color='primary'] {\n    color: var(--bui-fg-primary);\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-color='secondary'] {\n    color: var(--bui-fg-secondary);\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-color='danger'] {\n    color: var(--bui-fg-danger);\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-color='warning'] {\n    color: var(--bui-fg-warning);\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-color='success'] {\n    color: var(--bui-fg-success);\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-color='info'] {\n    color: var(--bui-fg-info);\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-truncate] {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .Link_bui-Link__bb74dc66c4[data-standalone] {\n    text-decoration-line: none;\n\n    &:hover {\n      text-decoration-line: underline;\n      text-decoration-style: solid;\n      text-decoration-thickness: min(2px, max(1px, 0.05em));\n      text-underline-offset: calc(0.025em + 2px);\n      text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);\n    }\n  }\n}\n";
-var styles = {"bui-Link":"Link_bui-Link__bb74dc66c4"};
+var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n  .Link_bui-Link__b9cba1725b {\n    font-family: var(--bui-font-regular);\n    padding: 0;\n    margin: 0;\n    cursor: pointer;\n    display: inline-block;\n\n    text-decoration-line: underline;\n    text-decoration-style: solid;\n    text-decoration-thickness: min(2px, max(1px, 0.05em));\n    text-underline-offset: calc(0.025em + 2px);\n    text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);\n\n    &:hover {\n      text-decoration-line: underline;\n      text-decoration-style: solid;\n      text-decoration-thickness: min(2px, max(1px, 0.05em));\n      text-underline-offset: calc(0.025em + 2px);\n      text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);\n    }\n\n    &[data-focus-visible] {\n      outline: 2px solid var(--bui-ring);\n      outline-offset: 2px;\n    }\n  }\n\n  .Link_bui-Link__b9cba1725b[data-variant='title-large'] {\n    font-size: var(--bui-font-size-8);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__b9cba1725b[data-variant='title-medium'] {\n    font-size: var(--bui-font-size-7);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__b9cba1725b[data-variant='title-small'] {\n    font-size: var(--bui-font-size-6);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__b9cba1725b[data-variant='title-x-small'] {\n    font-size: var(--bui-font-size-5);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__b9cba1725b[data-variant='body-large'] {\n    font-size: var(--bui-font-size-4);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__b9cba1725b[data-variant='body-medium'] {\n    font-size: var(--bui-font-size-3);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__b9cba1725b[data-variant='body-small'] {\n    font-size: var(--bui-font-size-2);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__b9cba1725b[data-variant='body-x-small'] {\n    font-size: var(--bui-font-size-1);\n    line-height: 140%;\n  }\n\n  .Link_bui-Link__b9cba1725b[data-weight='regular'] {\n    font-weight: var(--bui-font-weight-regular);\n  }\n\n  .Link_bui-Link__b9cba1725b[data-weight='bold'] {\n    font-weight: var(--bui-font-weight-bold);\n  }\n\n  .Link_bui-Link__b9cba1725b[data-color='primary'] {\n    color: var(--bui-fg-primary);\n  }\n\n  .Link_bui-Link__b9cba1725b[data-color='secondary'] {\n    color: var(--bui-fg-secondary);\n  }\n\n  .Link_bui-Link__b9cba1725b[data-color='danger'] {\n    color: var(--bui-fg-danger);\n  }\n\n  .Link_bui-Link__b9cba1725b[data-color='warning'] {\n    color: var(--bui-fg-warning);\n  }\n\n  .Link_bui-Link__b9cba1725b[data-color='success'] {\n    color: var(--bui-fg-success);\n  }\n\n  .Link_bui-Link__b9cba1725b[data-color='info'] {\n    color: var(--bui-fg-info);\n  }\n\n  .Link_bui-Link__b9cba1725b[data-truncate] {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .Link_bui-Link__b9cba1725b[data-standalone] {\n    text-decoration-line: none;\n\n    &:hover {\n      text-decoration-line: underline;\n      text-decoration-style: solid;\n      text-decoration-thickness: min(2px, max(1px, 0.05em));\n      text-underline-offset: calc(0.025em + 2px);\n      text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);\n    }\n  }\n}\n";
+var styles = {"bui-Link":"Link_bui-Link__b9cba1725b"};
 styleInject(css_248z);
 
 export { styles as default };