@backstage/ui 0.0.0-nightly-20250722024836

package/dist/components/DataTable/Root/DataTableRoot.esm.js

@@ -0,0 +1,24 @@
+import { jsx } from 'react/jsx-runtime';
+import { createContext, forwardRef, useContext } from 'react';
+import clsx from 'clsx';
+
+const DataTableContext = createContext(
+  null
+);
+const DataTableRoot = forwardRef(
+  (props, ref) => {
+    const { className, table, ...rest } = props;
+    return /* @__PURE__ */ jsx(DataTableContext.Provider, { value: { table }, children: /* @__PURE__ */ jsx("div", { ref, className: clsx("bui-DataTable", className), ...rest }) });
+  }
+);
+DataTableRoot.displayName = "DataTableRoot";
+function useDataTable() {
+  const context = useContext(DataTableContext);
+  if (!context) {
+    throw new Error("useDataTable must be used within a DataTableRoot");
+  }
+  return context;
+}
+
+export { DataTableContext, DataTableRoot, useDataTable };
+//# sourceMappingURL=DataTableRoot.esm.js.map

package/dist/components/DataTable/Root/DataTableRoot.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableRoot.esm.js","sources":["../../../../src/components/DataTable/Root/DataTableRoot.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, createContext, useContext } from 'react';\nimport clsx from 'clsx';\nimport { DataTableRootProps } from './types';\nimport { Table } from '@tanstack/react-table';\n\ntype DataTableContextType<TData> = {\n  table: Table<TData>;\n};\n\n/** @public */\nexport const DataTableContext = createContext<DataTableContextType<any> | null>(\n  null,\n);\n\n/** @public */\nconst DataTableRoot = forwardRef(\n  <TData,>(\n    props: DataTableRootProps<TData>,\n    ref: React.ForwardedRef<HTMLDivElement>,\n  ) => {\n    const { className, table, ...rest } = props;\n\n    return (\n      <DataTableContext.Provider value={{ table }}>\n        <div ref={ref} className={clsx('bui-DataTable', className)} {...rest} />\n      </DataTableContext.Provider>\n    );\n  },\n);\n\nDataTableRoot.displayName = 'DataTableRoot';\n\nexport { DataTableRoot };\n\n/** @public */\nexport function useDataTable<TData>() {\n  const context = useContext(DataTableContext);\n  if (!context) {\n    throw new Error('useDataTable must be used within a DataTableRoot');\n  }\n  return context as DataTableContextType<TData>;\n}\n"],"names":[],"mappings":";;;;AA0BO,MAAM,gBAAmB,GAAA,aAAA;AAAA,EAC9B;AACF;AAGA,MAAM,aAAgB,GAAA,UAAA;AAAA,EACpB,CACE,OACA,GACG,KAAA;AACH,IAAA,MAAM,EAAE,SAAA,EAAW,KAAO,EAAA,GAAG,MAAS,GAAA,KAAA;AAEtC,IAAA,2BACG,gBAAiB,CAAA,QAAA,EAAjB,EAA0B,KAAO,EAAA,EAAE,OAClC,EAAA,QAAA,kBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,GAAA,EAAU,WAAW,IAAK,CAAA,eAAA,EAAiB,SAAS,CAAI,EAAA,GAAG,MAAM,CACxE,EAAA,CAAA;AAAA;AAGN;AAEA,aAAA,CAAc,WAAc,GAAA,eAAA;AAKrB,SAAS,YAAsB,GAAA;AACpC,EAAM,MAAA,OAAA,GAAU,WAAW,gBAAgB,CAAA;AAC3C,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAM,MAAA,IAAI,MAAM,kDAAkD,CAAA;AAAA;AAEpE,EAAO,OAAA,OAAA;AACT;;;;"}

package/dist/components/DataTable/Table/DataTableTable.esm.js

@@ -0,0 +1,64 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import clsx from 'clsx';
+import { Table } from '../../Table/Table.esm.js';
+import { useDataTable } from '../Root/DataTableRoot.esm.js';
+import { flexRender } from '@tanstack/react-table';
+
+const DataTableTable = forwardRef(
+  (props, ref) => {
+    const { className, ...rest } = props;
+    const { table } = useDataTable();
+    return /* @__PURE__ */ jsxs(
+      Table.Root,
+      {
+        ref,
+        style: { minWidth: table.getTotalSize() },
+        className: clsx(className),
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsx(Table.Header, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx(Table.Row, { children: headerGroup.headers.map((header) => {
+            return /* @__PURE__ */ jsx(
+              Table.Head,
+              {
+                style: { width: header.getSize() },
+                children: header.isPlaceholder ? null : flexRender(
+                  header.column.columnDef.header,
+                  header.getContext()
+                )
+              },
+              header.id
+            );
+          }) }, headerGroup.id)) }),
+          /* @__PURE__ */ jsx(Table.Body, { children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx(
+            Table.Row,
+            {
+              "data-state": row.getIsSelected() && "selected",
+              children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(
+                Table.Cell,
+                {
+                  style: { width: cell.column.getSize() },
+                  children: flexRender(cell.column.columnDef.cell, cell.getContext())
+                },
+                cell.id
+              ))
+            },
+            row.id
+          )) : /* @__PURE__ */ jsx(Table.Row, { children: /* @__PURE__ */ jsx(
+            Table.Cell,
+            {
+              colSpan: table.getAllColumns().length,
+              className: "h-24 text-center",
+              style: { width: table.getTotalSize() },
+              children: "No results."
+            }
+          ) }) })
+        ]
+      }
+    );
+  }
+);
+DataTableTable.displayName = "DataTableRoot";
+
+export { DataTableTable };
+//# sourceMappingURL=DataTableTable.esm.js.map

package/dist/components/DataTable/Table/DataTableTable.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableTable.esm.js","sources":["../../../../src/components/DataTable/Table/DataTableTable.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 } from 'react';\nimport clsx from 'clsx';\nimport { DataTableTableProps } from './types';\nimport { Table } from '../../Table';\nimport { useDataTable } from '../Root/DataTableRoot';\nimport { flexRender } from '@tanstack/react-table';\n\n/** @public */\nconst DataTableTable = forwardRef(\n  (props: DataTableTableProps, ref: React.ForwardedRef<HTMLTableElement>) => {\n    const { className, ...rest } = props;\n    const { table } = useDataTable();\n\n    return (\n      <Table.Root\n        ref={ref}\n        style={{ minWidth: table.getTotalSize() }}\n        className={clsx(className)}\n        {...rest}\n      >\n        <Table.Header>\n          {table.getHeaderGroups().map(headerGroup => (\n            <Table.Row key={headerGroup.id}>\n              {headerGroup.headers.map(header => {\n                return (\n                  <Table.Head\n                    key={header.id}\n                    style={{ width: header.getSize() }}\n                  >\n                    {header.isPlaceholder\n                      ? null\n                      : flexRender(\n                          header.column.columnDef.header,\n                          header.getContext(),\n                        )}\n                  </Table.Head>\n                );\n              })}\n            </Table.Row>\n          ))}\n        </Table.Header>\n        <Table.Body>\n          {table.getRowModel().rows?.length ? (\n            table.getRowModel().rows.map(row => (\n              <Table.Row\n                key={row.id}\n                data-state={row.getIsSelected() && 'selected'}\n              >\n                {row.getVisibleCells().map(cell => (\n                  <Table.Cell\n                    key={cell.id}\n                    style={{ width: cell.column.getSize() }}\n                  >\n                    {flexRender(cell.column.columnDef.cell, cell.getContext())}\n                  </Table.Cell>\n                ))}\n              </Table.Row>\n            ))\n          ) : (\n            <Table.Row>\n              <Table.Cell\n                colSpan={table.getAllColumns().length}\n                className=\"h-24 text-center\"\n                style={{ width: table.getTotalSize() }}\n              >\n                No results.\n              </Table.Cell>\n            </Table.Row>\n          )}\n        </Table.Body>\n      </Table.Root>\n    );\n  },\n);\n\nDataTableTable.displayName = 'DataTableRoot';\n\nexport { DataTableTable };\n"],"names":[],"mappings":";;;;;;;AAwBA,MAAM,cAAiB,GAAA,UAAA;AAAA,EACrB,CAAC,OAA4B,GAA8C,KAAA;AACzE,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAC/B,IAAM,MAAA,EAAE,KAAM,EAAA,GAAI,YAAa,EAAA;AAE/B,IACE,uBAAA,IAAA;AAAA,MAAC,KAAM,CAAA,IAAA;AAAA,MAAN;AAAA,QACC,GAAA;AAAA,QACA,KAAO,EAAA,EAAE,QAAU,EAAA,KAAA,CAAM,cAAe,EAAA;AAAA,QACxC,SAAA,EAAW,KAAK,SAAS,CAAA;AAAA,QACxB,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAM,CAAA,MAAA,EAAN,EACE,QAAA,EAAA,KAAA,CAAM,iBAAkB,CAAA,GAAA,CAAI,CAC3B,WAAA,qBAAA,GAAA,CAAC,MAAM,GAAN,EAAA,EACE,QAAY,EAAA,WAAA,CAAA,OAAA,CAAQ,IAAI,CAAU,MAAA,KAAA;AACjC,YACE,uBAAA,GAAA;AAAA,cAAC,KAAM,CAAA,IAAA;AAAA,cAAN;AAAA,gBAEC,KAAO,EAAA,EAAE,KAAO,EAAA,MAAA,CAAO,SAAU,EAAA;AAAA,gBAEhC,QAAA,EAAA,MAAA,CAAO,gBACJ,IACA,GAAA,UAAA;AAAA,kBACE,MAAA,CAAO,OAAO,SAAU,CAAA,MAAA;AAAA,kBACxB,OAAO,UAAW;AAAA;AACpB,eAAA;AAAA,cARC,MAAO,CAAA;AAAA,aASd;AAAA,WAEH,CAAA,EAAA,EAfa,WAAY,CAAA,EAgB5B,CACD,CACH,EAAA,CAAA;AAAA,0BACC,GAAA,CAAA,KAAA,CAAM,IAAN,EAAA,EACE,gBAAM,WAAY,EAAA,CAAE,IAAM,EAAA,MAAA,GACzB,KAAM,CAAA,WAAA,EAAc,CAAA,IAAA,CAAK,IAAI,CAC3B,GAAA,qBAAA,GAAA;AAAA,YAAC,KAAM,CAAA,GAAA;AAAA,YAAN;AAAA,cAEC,YAAA,EAAY,GAAI,CAAA,aAAA,EAAmB,IAAA,UAAA;AAAA,cAElC,QAAI,EAAA,GAAA,CAAA,eAAA,EAAkB,CAAA,GAAA,CAAI,CACzB,IAAA,qBAAA,GAAA;AAAA,gBAAC,KAAM,CAAA,IAAA;AAAA,gBAAN;AAAA,kBAEC,OAAO,EAAE,KAAA,EAAO,IAAK,CAAA,MAAA,CAAO,SAAU,EAAA;AAAA,kBAErC,qBAAW,IAAK,CAAA,MAAA,CAAO,UAAU,IAAM,EAAA,IAAA,CAAK,YAAY;AAAA,iBAAA;AAAA,gBAHpD,IAAK,CAAA;AAAA,eAKb;AAAA,aAAA;AAAA,YAVI,GAAI,CAAA;AAAA,WAYZ,CAAA,mBAEA,GAAA,CAAA,KAAA,CAAM,KAAN,EACC,QAAA,kBAAA,GAAA;AAAA,YAAC,KAAM,CAAA,IAAA;AAAA,YAAN;AAAA,cACC,OAAA,EAAS,KAAM,CAAA,aAAA,EAAgB,CAAA,MAAA;AAAA,cAC/B,SAAU,EAAA,kBAAA;AAAA,cACV,KAAO,EAAA,EAAE,KAAO,EAAA,KAAA,CAAM,cAAe,EAAA;AAAA,cACtC,QAAA,EAAA;AAAA;AAAA,aAGH,CAEJ,EAAA;AAAA;AAAA;AAAA,KACF;AAAA;AAGN;AAEA,cAAA,CAAe,WAAc,GAAA,eAAA;;;;"}

package/dist/components/FieldError/FieldError.esm.js

@@ -0,0 +1,22 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { FieldError as FieldError$1 } from 'react-aria-components';
+import clsx from 'clsx';
+
+const FieldError = forwardRef(
+  (props, ref) => {
+    const { className, ...rest } = props;
+    return /* @__PURE__ */ jsx(
+      FieldError$1,
+      {
+        className: clsx("bui-FieldError", className),
+        ref,
+        ...rest
+      }
+    );
+  }
+);
+FieldError.displayName = "FieldError";
+
+export { FieldError };
+//# sourceMappingURL=FieldError.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FieldError.esm.js","sources":["../../../src/components/FieldError/FieldError.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 { forwardRef } from 'react';\nimport {\n  FieldError as AriaFieldError,\n  type FieldErrorProps,\n} from 'react-aria-components';\nimport clsx from 'clsx';\n\n/** @public */\nexport const FieldError = forwardRef<HTMLDivElement, FieldErrorProps>(\n  (props: FieldErrorProps, ref) => {\n    const { className, ...rest } = props;\n\n    return (\n      <AriaFieldError\n        className={clsx('bui-FieldError', className)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\n\nFieldError.displayName = 'FieldError';\n"],"names":["AriaFieldError"],"mappings":";;;;;AAwBO,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,CAAC,OAAwB,GAAQ,KAAA;AAC/B,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAE/B,IACE,uBAAA,GAAA;AAAA,MAACA,YAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAK,CAAA,gBAAA,EAAkB,SAAS,CAAA;AAAA,QAC3C,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA;AAGN;AAEA,UAAA,CAAW,WAAc,GAAA,YAAA;;;;"}

package/dist/components/FieldLabel/FieldLabel.esm.js

@@ -0,0 +1,27 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Label } from 'react-aria-components';
+import { forwardRef } from 'react';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const FieldLabel = forwardRef(
+  (props, ref) => {
+    const { label, secondaryLabel, description, htmlFor, id, ...rest } = props;
+    const { classNames } = useStyles("FieldLabel");
+    if (!label) return null;
+    return /* @__PURE__ */ jsxs("div", { className: classNames.root, ...rest, ref, children: [
+      label && /* @__PURE__ */ jsxs(Label, { className: classNames.label, htmlFor, id, children: [
+        label,
+        secondaryLabel && /* @__PURE__ */ jsxs("span", { "aria-hidden": "true", className: classNames.secondaryLabel, children: [
+          "(",
+          secondaryLabel,
+          ")"
+        ] })
+      ] }),
+      description && /* @__PURE__ */ jsx("div", { className: classNames.description, children: description })
+    ] });
+  }
+);
+FieldLabel.displayName = "FieldLabel";
+
+export { FieldLabel };
+//# sourceMappingURL=FieldLabel.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLabel.esm.js","sources":["../../../src/components/FieldLabel/FieldLabel.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 */\nimport { Label } from 'react-aria-components';\nimport { forwardRef } from 'react';\nimport type { FieldLabelProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const FieldLabel = forwardRef<HTMLDivElement, FieldLabelProps>(\n  (props: FieldLabelProps, ref) => {\n    const { label, secondaryLabel, description, htmlFor, id, ...rest } = props;\n\n    const { classNames } = useStyles('FieldLabel');\n\n    if (!label) return null;\n\n    return (\n      <div className={classNames.root} {...rest} ref={ref}>\n        {label && (\n          <Label className={classNames.label} htmlFor={htmlFor} id={id}>\n            {label}\n            {secondaryLabel && (\n              <span aria-hidden=\"true\" className={classNames.secondaryLabel}>\n                ({secondaryLabel})\n              </span>\n            )}\n          </Label>\n        )}\n        {description && (\n          <div className={classNames.description}>{description}</div>\n        )}\n      </div>\n    );\n  },\n);\n\nFieldLabel.displayName = 'FieldLabel';\n"],"names":[],"mappings":";;;;;AAqBO,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,CAAC,OAAwB,GAAQ,KAAA;AAC/B,IAAM,MAAA,EAAE,OAAO,cAAgB,EAAA,WAAA,EAAa,SAAS,EAAI,EAAA,GAAG,MAAS,GAAA,KAAA;AAErE,IAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,YAAY,CAAA;AAE7C,IAAI,IAAA,CAAC,OAAc,OAAA,IAAA;AAEnB,IAAA,4BACG,KAAI,EAAA,EAAA,SAAA,EAAW,WAAW,IAAO,EAAA,GAAG,MAAM,GACxC,EAAA,QAAA,EAAA;AAAA,MAAA,KAAA,yBACE,KAAM,EAAA,EAAA,SAAA,EAAW,UAAW,CAAA,KAAA,EAAO,SAAkB,EACnD,EAAA,QAAA,EAAA;AAAA,QAAA,KAAA;AAAA,QACA,kCACE,IAAA,CAAA,MAAA,EAAA,EAAK,eAAY,MAAO,EAAA,SAAA,EAAW,WAAW,cAAgB,EAAA,QAAA,EAAA;AAAA,UAAA,GAAA;AAAA,UAC3D,cAAA;AAAA,UAAe;AAAA,SACnB,EAAA;AAAA,OAEJ,EAAA,CAAA;AAAA,MAED,+BACE,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,UAAA,CAAW,aAAc,QAAY,EAAA,WAAA,EAAA;AAAA,KAEzD,EAAA,CAAA;AAAA;AAGN;AAEA,UAAA,CAAW,WAAc,GAAA,YAAA;;;;"}

package/dist/components/Flex/Flex.esm.js

@@ -0,0 +1,26 @@
+import { forwardRef, createElement } from 'react';
+import clsx from 'clsx';
+import { flexPropDefs } from './Flex.props.esm.js';
+import { extractProps } from '../../utils/extractProps.esm.js';
+import { gapPropDefs } from '../../props/gap-props.esm.js';
+import { spacingPropDefs } from '../../props/spacing.props.esm.js';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const Flex = forwardRef((props, ref) => {
+  const propDefs = {
+    ...gapPropDefs,
+    ...flexPropDefs,
+    ...spacingPropDefs
+  };
+  const { classNames } = useStyles("Flex");
+  const { className, style } = extractProps(props, propDefs);
+  return createElement("div", {
+    ref,
+    className: clsx(classNames.root, className),
+    style,
+    children: props.children
+  });
+});
+
+export { Flex };
+//# sourceMappingURL=Flex.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Flex.esm.js","sources":["../../../src/components/Flex/Flex.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 { createElement, forwardRef } from 'react';\nimport { FlexProps } from './types';\nimport clsx from 'clsx';\nimport { flexPropDefs } from './Flex.props';\nimport { extractProps } from '../../utils/extractProps';\nimport { gapPropDefs } from '../../props/gap-props';\nimport { spacingPropDefs } from '../../props/spacing.props';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const Flex = forwardRef<HTMLDivElement, FlexProps>((props, ref) => {\n  const propDefs = {\n    ...gapPropDefs,\n    ...flexPropDefs,\n    ...spacingPropDefs,\n  };\n\n  const { classNames } = useStyles('Flex');\n  const { className, style } = extractProps(props, propDefs);\n\n  return createElement('div', {\n    ref,\n    className: clsx(classNames.root, className),\n    style,\n    children: props.children,\n  });\n});\n"],"names":[],"mappings":";;;;;;;;AA0BO,MAAM,IAAO,GAAA,UAAA,CAAsC,CAAC,KAAA,EAAO,GAAQ,KAAA;AACxE,EAAA,MAAM,QAAW,GAAA;AAAA,IACf,GAAG,WAAA;AAAA,IACH,GAAG,YAAA;AAAA,IACH,GAAG;AAAA,GACL;AAEA,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,MAAM,CAAA;AACvC,EAAA,MAAM,EAAE,SAAW,EAAA,KAAA,EAAU,GAAA,YAAA,CAAa,OAAO,QAAQ,CAAA;AAEzD,EAAA,OAAO,cAAc,KAAO,EAAA;AAAA,IAC1B,GAAA;AAAA,IACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,IAC1C,KAAA;AAAA,IACA,UAAU,KAAM,CAAA;AAAA,GACjB,CAAA;AACH,CAAC;;;;"}

package/dist/components/Flex/Flex.props.esm.js

@@ -0,0 +1,31 @@
+const alignValues = ["start", "center", "end", "baseline", "stretch"];
+const directionValues = [
+  "row",
+  "column",
+  "row-reverse",
+  "column-reverse"
+];
+const justifyValues = ["start", "center", "end", "between"];
+const flexPropDefs = {
+  align: {
+    type: "enum",
+    className: "bui-align",
+    values: alignValues,
+    responsive: true
+  },
+  direction: {
+    type: "enum",
+    className: "bui-fd",
+    values: directionValues,
+    responsive: true
+  },
+  justify: {
+    type: "enum",
+    className: "bui-jc",
+    values: justifyValues,
+    responsive: true
+  }
+};
+
+export { flexPropDefs };
+//# sourceMappingURL=Flex.props.esm.js.map

package/dist/components/Flex/Flex.props.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex.props.esm.js","sources":["../../../src/components/Flex/Flex.props.ts"],"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 { PropDef, GetPropDefTypes } from '../../props/prop-def';\n\nconst alignValues = ['start', 'center', 'end', 'baseline', 'stretch'] as const;\nconst directionValues = [\n  'row',\n  'column',\n  'row-reverse',\n  'column-reverse',\n] as const;\nconst justifyValues = ['start', 'center', 'end', 'between'] as const;\n\n/** @public */\nconst flexPropDefs = {\n  align: {\n    type: 'enum',\n    className: 'bui-align',\n    values: alignValues,\n    responsive: true,\n  },\n  direction: {\n    type: 'enum',\n    className: 'bui-fd',\n    values: directionValues,\n    responsive: true,\n  },\n  justify: {\n    type: 'enum',\n    className: 'bui-jc',\n    values: justifyValues,\n    responsive: true,\n  },\n} satisfies {\n  align: PropDef<(typeof alignValues)[number]>;\n  direction: PropDef<(typeof directionValues)[number]>;\n  justify: PropDef<(typeof justifyValues)[number]>;\n};\n\n/** @public */\ntype FlexOwnProps = GetPropDefTypes<typeof flexPropDefs>;\n\nexport { flexPropDefs };\nexport type { FlexOwnProps };\n"],"names":[],"mappings":"AAkBA,MAAM,cAAc,CAAC,OAAA,EAAS,QAAU,EAAA,KAAA,EAAO,YAAY,SAAS,CAAA;AACpE,MAAM,eAAkB,GAAA;AAAA,EACtB,KAAA;AAAA,EACA,QAAA;AAAA,EACA,aAAA;AAAA,EACA;AACF,CAAA;AACA,MAAM,aAAgB,GAAA,CAAC,OAAS,EAAA,QAAA,EAAU,OAAO,SAAS,CAAA;AAG1D,MAAM,YAAe,GAAA;AAAA,EACnB,KAAO,EAAA;AAAA,IACL,IAAM,EAAA,MAAA;AAAA,IACN,SAAW,EAAA,WAAA;AAAA,IACX,MAAQ,EAAA,WAAA;AAAA,IACR,UAAY,EAAA;AAAA,GACd;AAAA,EACA,SAAW,EAAA;AAAA,IACT,IAAM,EAAA,MAAA;AAAA,IACN,SAAW,EAAA,QAAA;AAAA,IACX,MAAQ,EAAA,eAAA;AAAA,IACR,UAAY,EAAA;AAAA,GACd;AAAA,EACA,OAAS,EAAA;AAAA,IACP,IAAM,EAAA,MAAA;AAAA,IACN,SAAW,EAAA,QAAA;AAAA,IACX,MAAQ,EAAA,aAAA;AAAA,IACR,UAAY,EAAA;AAAA;AAEhB;;;;"}

package/dist/components/Grid/Grid.esm.js

@@ -0,0 +1,43 @@
+import { forwardRef, createElement } from 'react';
+import { gapPropDefs } from '../../props/gap-props.esm.js';
+import { extractProps } from '../../utils/extractProps.esm.js';
+import { gridPropDefs, gridItemPropDefs } from './Grid.props.esm.js';
+import clsx from 'clsx';
+import { spacingPropDefs } from '../../props/spacing.props.esm.js';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const GridRoot = forwardRef((props, ref) => {
+  const propDefs = {
+    ...gapPropDefs,
+    ...gridPropDefs,
+    ...spacingPropDefs
+  };
+  const { classNames } = useStyles("Grid");
+  const { className, style } = extractProps(props, propDefs);
+  return createElement("div", {
+    ref,
+    className: clsx(classNames.root, className),
+    style,
+    children: props.children
+  });
+});
+const GridItem = forwardRef((props, ref) => {
+  const propDefs = {
+    ...gridItemPropDefs
+  };
+  const { classNames } = useStyles("Grid");
+  const { className, style } = extractProps(props, propDefs);
+  return createElement("div", {
+    ref,
+    className: clsx(classNames.item, className),
+    style,
+    children: props.children
+  });
+});
+const Grid = {
+  Root: GridRoot,
+  Item: GridItem
+};
+
+export { Grid };
+//# sourceMappingURL=Grid.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Grid.esm.js","sources":["../../../src/components/Grid/Grid.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 { createElement, forwardRef } from 'react';\nimport { gapPropDefs } from '../../props/gap-props';\nimport { extractProps } from '../../utils/extractProps';\nimport { gridItemPropDefs, gridPropDefs } from './Grid.props';\nimport clsx from 'clsx';\nimport type { GridItemProps, GridProps } from './types';\nimport { spacingPropDefs } from '../../props/spacing.props';\nimport { useStyles } from '../../hooks/useStyles';\n\nconst GridRoot = forwardRef<HTMLDivElement, GridProps>((props, ref) => {\n  const propDefs = {\n    ...gapPropDefs,\n    ...gridPropDefs,\n    ...spacingPropDefs,\n  };\n\n  const { classNames } = useStyles('Grid');\n\n  const { className, style } = extractProps(props, propDefs);\n\n  return createElement('div', {\n    ref,\n    className: clsx(classNames.root, className),\n    style,\n    children: props.children,\n  });\n});\n\nconst GridItem = forwardRef<HTMLDivElement, GridItemProps>((props, ref) => {\n  const propDefs = {\n    ...gridItemPropDefs,\n  };\n\n  const { classNames } = useStyles('Grid');\n  const { className, style } = extractProps(props, propDefs);\n\n  return createElement('div', {\n    ref,\n    className: clsx(classNames.item, className),\n    style,\n    children: props.children,\n  });\n});\n\n/** @public */\nexport const Grid = {\n  Root: GridRoot,\n  Item: GridItem,\n};\n"],"names":[],"mappings":";;;;;;;;AAyBA,MAAM,QAAW,GAAA,UAAA,CAAsC,CAAC,KAAA,EAAO,GAAQ,KAAA;AACrE,EAAA,MAAM,QAAW,GAAA;AAAA,IACf,GAAG,WAAA;AAAA,IACH,GAAG,YAAA;AAAA,IACH,GAAG;AAAA,GACL;AAEA,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,MAAM,CAAA;AAEvC,EAAA,MAAM,EAAE,SAAW,EAAA,KAAA,EAAU,GAAA,YAAA,CAAa,OAAO,QAAQ,CAAA;AAEzD,EAAA,OAAO,cAAc,KAAO,EAAA;AAAA,IAC1B,GAAA;AAAA,IACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,IAC1C,KAAA;AAAA,IACA,UAAU,KAAM,CAAA;AAAA,GACjB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,QAAW,GAAA,UAAA,CAA0C,CAAC,KAAA,EAAO,GAAQ,KAAA;AACzE,EAAA,MAAM,QAAW,GAAA;AAAA,IACf,GAAG;AAAA,GACL;AAEA,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,MAAM,CAAA;AACvC,EAAA,MAAM,EAAE,SAAW,EAAA,KAAA,EAAU,GAAA,YAAA,CAAa,OAAO,QAAQ,CAAA;AAEzD,EAAA,OAAO,cAAc,KAAO,EAAA;AAAA,IAC1B,GAAA;AAAA,IACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,IAC1C,KAAA;AAAA,IACA,UAAU,KAAM,CAAA;AAAA,GACjB,CAAA;AACH,CAAC,CAAA;AAGM,MAAM,IAAO,GAAA;AAAA,EAClB,IAAM,EAAA,QAAA;AAAA,EACN,IAAM,EAAA;AACR;;;;"}

package/dist/components/Grid/Grid.props.esm.js

@@ -0,0 +1,58 @@
+const columnsValues = [
+  "1",
+  "2",
+  "3",
+  "4",
+  "5",
+  "6",
+  "7",
+  "8",
+  "9",
+  "10",
+  "11",
+  "12",
+  "auto"
+];
+const gridPropDefs = {
+  columns: {
+    type: "enum | string",
+    className: "bui-columns",
+    customProperties: ["--columns"],
+    values: columnsValues,
+    responsive: true,
+    default: "auto"
+  }
+};
+const gridItemPropDefs = {
+  colSpan: {
+    type: "enum | string",
+    className: "bui-col-span",
+    customProperties: ["--col-span"],
+    values: columnsValues,
+    responsive: true
+  },
+  colEnd: {
+    type: "enum | string",
+    className: "bui-col-end",
+    customProperties: ["--col-end"],
+    values: columnsValues,
+    responsive: true
+  },
+  colStart: {
+    type: "enum | string",
+    className: "bui-col-start",
+    customProperties: ["--col-start"],
+    values: columnsValues,
+    responsive: true
+  },
+  rowSpan: {
+    type: "enum | string",
+    className: "bui-row-span",
+    customProperties: ["--row-span"],
+    values: columnsValues,
+    responsive: true
+  }
+};
+
+export { gridItemPropDefs, gridPropDefs };
+//# sourceMappingURL=Grid.props.esm.js.map

package/dist/components/Grid/Grid.props.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grid.props.esm.js","sources":["../../../src/components/Grid/Grid.props.ts"],"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 { PropDef, GetPropDefTypes } from '../../props/prop-def';\n\nconst columnsValues = [\n  '1',\n  '2',\n  '3',\n  '4',\n  '5',\n  '6',\n  '7',\n  '8',\n  '9',\n  '10',\n  '11',\n  '12',\n  'auto',\n] as const;\n\n/** @public */\nconst gridPropDefs = {\n  columns: {\n    type: 'enum | string',\n    className: 'bui-columns',\n    customProperties: ['--columns'],\n    values: columnsValues,\n    responsive: true,\n    default: 'auto',\n  },\n} satisfies {\n  columns: PropDef<(typeof columnsValues)[number]>;\n};\n\n/** @public */\nconst gridItemPropDefs = {\n  colSpan: {\n    type: 'enum | string',\n    className: 'bui-col-span',\n    customProperties: ['--col-span'],\n    values: columnsValues,\n    responsive: true,\n  },\n  colEnd: {\n    type: 'enum | string',\n    className: 'bui-col-end',\n    customProperties: ['--col-end'],\n    values: columnsValues,\n    responsive: true,\n  },\n  colStart: {\n    type: 'enum | string',\n    className: 'bui-col-start',\n    customProperties: ['--col-start'],\n    values: columnsValues,\n    responsive: true,\n  },\n  rowSpan: {\n    type: 'enum | string',\n    className: 'bui-row-span',\n    customProperties: ['--row-span'],\n    values: columnsValues,\n    responsive: true,\n  },\n} satisfies {\n  colSpan: PropDef<(typeof columnsValues)[number]>;\n  colEnd: PropDef<(typeof columnsValues)[number]>;\n  colStart: PropDef<(typeof columnsValues)[number]>;\n  rowSpan: PropDef<(typeof columnsValues)[number]>;\n};\n\n/** @public */\ntype GridOwnProps = GetPropDefTypes<typeof gridPropDefs>;\n\n/** @public */\ntype GridItemOwnProps = GetPropDefTypes<typeof gridItemPropDefs>;\n\nexport { gridPropDefs, gridItemPropDefs };\nexport type { GridOwnProps, GridItemOwnProps };\n"],"names":[],"mappings":"AAkBA,MAAM,aAAgB,GAAA;AAAA,EACpB,GAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA;AAAA,EACA;AACF,CAAA;AAGA,MAAM,YAAe,GAAA;AAAA,EACnB,OAAS,EAAA;AAAA,IACP,IAAM,EAAA,eAAA;AAAA,IACN,SAAW,EAAA,aAAA;AAAA,IACX,gBAAA,EAAkB,CAAC,WAAW,CAAA;AAAA,IAC9B,MAAQ,EAAA,aAAA;AAAA,IACR,UAAY,EAAA,IAAA;AAAA,IACZ,OAAS,EAAA;AAAA;AAEb;AAKA,MAAM,gBAAmB,GAAA;AAAA,EACvB,OAAS,EAAA;AAAA,IACP,IAAM,EAAA,eAAA;AAAA,IACN,SAAW,EAAA,cAAA;AAAA,IACX,gBAAA,EAAkB,CAAC,YAAY,CAAA;AAAA,IAC/B,MAAQ,EAAA,aAAA;AAAA,IACR,UAAY,EAAA;AAAA,GACd;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,IAAM,EAAA,eAAA;AAAA,IACN,SAAW,EAAA,aAAA;AAAA,IACX,gBAAA,EAAkB,CAAC,WAAW,CAAA;AAAA,IAC9B,MAAQ,EAAA,aAAA;AAAA,IACR,UAAY,EAAA;AAAA,GACd;AAAA,EACA,QAAU,EAAA;AAAA,IACR,IAAM,EAAA,eAAA;AAAA,IACN,SAAW,EAAA,eAAA;AAAA,IACX,gBAAA,EAAkB,CAAC,aAAa,CAAA;AAAA,IAChC,MAAQ,EAAA,aAAA;AAAA,IACR,UAAY,EAAA;AAAA,GACd;AAAA,EACA,OAAS,EAAA;AAAA,IACP,IAAM,EAAA,eAAA;AAAA,IACN,SAAW,EAAA,cAAA;AAAA,IACX,gBAAA,EAAkB,CAAC,YAAY,CAAA;AAAA,IAC/B,MAAQ,EAAA,aAAA;AAAA,IACR,UAAY,EAAA;AAAA;AAEhB;;;;"}

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

@@ -0,0 +1,27 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { HeaderToolbar } from './HeaderToolbar.esm.js';
+import { Tabs, TabList, Tab } from '../Tabs/Tabs.esm.js';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const Header = (props) => {
+  const { tabs, icon, title, menuItems, breadcrumbs, customActions } = props;
+  const { classNames } = useStyles("Header");
+  const hasTabs = tabs && tabs.length > 0;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      HeaderToolbar,
+      {
+        icon,
+        title,
+        menuItems,
+        breadcrumbs,
+        customActions,
+        hasTabs
+      }
+    ),
+    tabs && /* @__PURE__ */ jsx("div", { className: classNames.tabsWrapper, children: /* @__PURE__ */ jsx(Tabs, { onSelectionChange: props.onTabSelectionChange, children: /* @__PURE__ */ jsx(TabList, { children: tabs?.map((tab) => /* @__PURE__ */ jsx(Tab, { id: tab.id, href: tab.href, children: tab.label }, tab.id)) }) }) })
+  ] });
+};
+
+export { Header };
+//# sourceMappingURL=Header.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Header.esm.js","sources":["../../../src/components/Header/Header.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 type { HeaderProps } from './types';\nimport { HeaderToolbar } from './HeaderToolbar';\nimport { Tabs, TabList, Tab } from '../Tabs';\nimport { useStyles } from '../../hooks/useStyles';\nimport { type NavigateOptions } from 'react-router-dom';\n\ndeclare module 'react-aria-components' {\n  interface RouterConfig {\n    routerOptions: NavigateOptions;\n  }\n}\n\n/**\n * A component that renders a toolbar.\n *\n * @public\n */\nexport const Header = (props: HeaderProps) => {\n  const { tabs, icon, title, menuItems, breadcrumbs, customActions } = props;\n\n  const { classNames } = useStyles('Header');\n\n  const hasTabs = tabs && tabs.length > 0;\n\n  return (\n    <>\n      <HeaderToolbar\n        icon={icon}\n        title={title}\n        menuItems={menuItems}\n        breadcrumbs={breadcrumbs}\n        customActions={customActions}\n        hasTabs={hasTabs}\n      />\n      {tabs && (\n        <div className={classNames.tabsWrapper}>\n          <Tabs onSelectionChange={props.onTabSelectionChange}>\n            <TabList>\n              {tabs?.map(tab => (\n                <Tab key={tab.id} id={tab.id} href={tab.href}>\n                  {tab.label}\n                </Tab>\n              ))}\n            </TabList>\n          </Tabs>\n        </div>\n      )}\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;AAiCa,MAAA,MAAA,GAAS,CAAC,KAAuB,KAAA;AAC5C,EAAA,MAAM,EAAE,IAAM,EAAA,IAAA,EAAM,OAAO,SAAW,EAAA,WAAA,EAAa,eAAkB,GAAA,KAAA;AAErE,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,QAAQ,CAAA;AAEzC,EAAM,MAAA,OAAA,GAAU,IAAQ,IAAA,IAAA,CAAK,MAAS,GAAA,CAAA;AAEtC,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA;AAAA,QACA,KAAA;AAAA,QACA,SAAA;AAAA,QACA,WAAA;AAAA,QACA,aAAA;AAAA,QACA;AAAA;AAAA,KACF;AAAA,IACC,IACC,oBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,UAAW,CAAA,WAAA,EACzB,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA,EAAK,iBAAmB,EAAA,KAAA,CAAM,oBAC7B,EAAA,QAAA,kBAAA,GAAA,CAAC,WACE,QAAM,EAAA,IAAA,EAAA,GAAA,CAAI,CACT,GAAA,qBAAA,GAAA,CAAC,GAAiB,EAAA,EAAA,EAAA,EAAI,GAAI,CAAA,EAAA,EAAI,MAAM,GAAI,CAAA,IAAA,EACrC,QAAI,EAAA,GAAA,CAAA,KAAA,EAAA,EADG,GAAI,CAAA,EAEd,CACD,CAAA,EACH,GACF,CACF,EAAA;AAAA,GAEJ,EAAA,CAAA;AAEJ;;;;"}

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

@@ -0,0 +1,121 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Link } from 'react-aria-components';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+import { useRef, useState, useEffect } from 'react';
+import { RiShapesLine, RiArrowRightSLine, RiMore2Line } from '@remixicon/react';
+import { ButtonIcon } from '../ButtonIcon/ButtonIcon.esm.js';
+import { Menu } from '../Menu/Menu.esm.js';
+import { Text } from '../Text/Text.esm.js';
+import { useScroll, useTransform, motion } from 'motion/react';
+
+const HeaderToolbar = (props) => {
+  const { icon, title, menuItems, breadcrumbs, customActions, hasTabs } = props;
+  const { classNames } = useStyles("Header");
+  const { scrollY } = useScroll();
+  const breadcrumbOpacity = useTransform(scrollY, [80, 120], [0, 1]);
+  const toolbarWrapperRef = useRef(null);
+  const toolbarContentRef = useRef(null);
+  const toolbarControlsRef = useRef(null);
+  const [showBreadcrumbs, setShowBreadcrumbs] = useState(true);
+  useEffect(() => {
+    const wrapper = toolbarWrapperRef.current;
+    if (!wrapper) return;
+    const resizeObserver = new ResizeObserver(() => {
+      const wrapper2 = toolbarWrapperRef.current;
+      const content = toolbarContentRef.current;
+      const options = toolbarControlsRef.current;
+      if (!wrapper2 || !content) return;
+      const wrapperRect = wrapper2.getBoundingClientRect();
+      const wrapperWidth = wrapperRect.width;
+      const wrapperPadding = 24;
+      const availableWidth = wrapperWidth - wrapperPadding;
+      const contentRect = content.getBoundingClientRect();
+      const contentWidth = contentRect?.width || 0;
+      const optionsRect = options?.getBoundingClientRect();
+      const optionsWidth = optionsRect?.width || 0;
+      const shouldShowBreadcrumbs = contentWidth + optionsWidth + 32 <= availableWidth;
+      setShowBreadcrumbs(
+        (prev) => prev !== shouldShowBreadcrumbs ? shouldShowBreadcrumbs : prev
+      );
+    });
+    resizeObserver.observe(wrapper);
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, []);
+  return /* @__PURE__ */ jsx("div", { className: classNames.toolbar, "data-has-tabs": hasTabs, children: /* @__PURE__ */ jsxs("div", { className: classNames.toolbarWrapper, ref: toolbarWrapperRef, children: [
+    /* @__PURE__ */ jsxs("div", { className: classNames.toolbarContent, ref: toolbarContentRef, children: [
+      /* @__PURE__ */ jsxs("div", { className: classNames.toolbarName, children: [
+        /* @__PURE__ */ jsx("div", { className: classNames.toolbarIcon, children: icon || /* @__PURE__ */ jsx(RiShapesLine, {}) }),
+        /* @__PURE__ */ jsx(Text, { variant: "body", children: title || "Your plugin" })
+      ] }),
+      breadcrumbs && /* @__PURE__ */ jsxs(
+        motion.div,
+        {
+          className: classNames.breadcrumbs,
+          style: {
+            opacity: breadcrumbOpacity,
+            visibility: showBreadcrumbs ? "visible" : "hidden"
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              RiArrowRightSLine,
+              {
+                size: 16,
+                className: classNames.breadcrumbSeparator
+              }
+            ),
+            breadcrumbs.map((breadcrumb, index) => /* @__PURE__ */ jsxs("div", { className: classNames.breadcrumb, children: [
+              /* @__PURE__ */ jsx(
+                Link,
+                {
+                  href: breadcrumb.href,
+                  className: classNames.breadcrumbLink,
+                  "data-active": index === breadcrumbs.length - 1,
+                  children: breadcrumb.label
+                }
+              ),
+              index < breadcrumbs.length - 1 && /* @__PURE__ */ jsx(
+                RiArrowRightSLine,
+                {
+                  size: 16,
+                  className: classNames.breadcrumbSeparator
+                }
+              )
+            ] }, breadcrumb.label))
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: classNames.toolbarControls, ref: toolbarControlsRef, children: [
+      customActions,
+      menuItems && /* @__PURE__ */ jsxs(Menu.Root, { children: [
+        /* @__PURE__ */ jsx(
+          Menu.Trigger,
+          {
+            render: (props2) => /* @__PURE__ */ jsx(
+              ButtonIcon,
+              {
+                size: "small",
+                icon: /* @__PURE__ */ jsx(RiMore2Line, {}),
+                variant: "tertiary",
+                ...props2
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, { sideOffset: 4, align: "end", children: /* @__PURE__ */ jsx(Menu.Popup, { children: menuItems.map((option) => /* @__PURE__ */ jsx(
+          Menu.Item,
+          {
+            onClick: () => option.onClick?.(),
+            children: option.label
+          },
+          option.value
+        )) }) }) })
+      ] })
+    ] })
+  ] }) });
+};
+
+export { HeaderToolbar };
+//# sourceMappingURL=HeaderToolbar.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderToolbar.esm.js","sources":["../../../src/components/Header/HeaderToolbar.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 { Link } from 'react-aria-components';\nimport { useStyles } from '../../hooks/useStyles';\nimport { useRef, useState, useEffect } from 'react';\nimport { RiArrowRightSLine, RiMore2Line, RiShapesLine } from '@remixicon/react';\nimport type { HeaderToolbarProps } from './types';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Menu } from '../Menu';\nimport { Text } from '../Text';\nimport { motion, useScroll, useTransform } from 'motion/react';\n\n/**\n * A component that renders a toolbar.\n *\n * @internal\n */\nexport const HeaderToolbar = (props: HeaderToolbarProps) => {\n  const { icon, title, menuItems, breadcrumbs, customActions, hasTabs } = props;\n  const { classNames } = useStyles('Header');\n\n  const { scrollY } = useScroll();\n  const breadcrumbOpacity = useTransform(scrollY, [80, 120], [0, 1]);\n\n  // Refs for collision detection\n  const toolbarWrapperRef = useRef<HTMLDivElement>(null);\n  const toolbarContentRef = useRef<HTMLDivElement>(null);\n  const toolbarControlsRef = useRef<HTMLDivElement>(null);\n\n  // State for breadcrumb visibility\n  const [showBreadcrumbs, setShowBreadcrumbs] = useState(true);\n\n  // Set up resize observer\n  useEffect(() => {\n    const wrapper = toolbarWrapperRef.current;\n    if (!wrapper) return;\n\n    const resizeObserver = new ResizeObserver(() => {\n      const wrapper = toolbarWrapperRef.current;\n      const content = toolbarContentRef.current;\n      const options = toolbarControlsRef.current;\n\n      if (!wrapper || !content) return;\n\n      // Get dimensions\n      const wrapperRect = wrapper.getBoundingClientRect();\n      const wrapperWidth = wrapperRect.width;\n      const wrapperPadding = 24; // 12px on each side (var(--bui-space-3))\n      const availableWidth = wrapperWidth - wrapperPadding;\n\n      // Calculate required width for content\n      const contentRect = content.getBoundingClientRect();\n      const contentWidth = contentRect?.width || 0;\n\n      // Calculate options width (if exists)\n      const optionsRect = options?.getBoundingClientRect();\n      const optionsWidth = optionsRect?.width || 0;\n\n      // Check if we need to hide breadcrumbs\n      const shouldShowBreadcrumbs =\n        contentWidth + optionsWidth + 32 <= availableWidth;\n\n      // Only update state if the value actually changed to prevent flickering\n      setShowBreadcrumbs(prev =>\n        prev !== shouldShowBreadcrumbs ? shouldShowBreadcrumbs : prev,\n      );\n    });\n\n    resizeObserver.observe(wrapper);\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, []);\n\n  return (\n    <div className={classNames.toolbar} data-has-tabs={hasTabs}>\n      <div className={classNames.toolbarWrapper} ref={toolbarWrapperRef}>\n        <div className={classNames.toolbarContent} ref={toolbarContentRef}>\n          <div className={classNames.toolbarName}>\n            <div className={classNames.toolbarIcon}>\n              {icon || <RiShapesLine />}\n            </div>\n            <Text variant=\"body\">{title || 'Your plugin'}</Text>\n          </div>\n          {breadcrumbs && (\n            <motion.div\n              className={classNames.breadcrumbs}\n              style={{\n                opacity: breadcrumbOpacity,\n                visibility: showBreadcrumbs ? 'visible' : 'hidden',\n              }}\n            >\n              <RiArrowRightSLine\n                size={16}\n                className={classNames.breadcrumbSeparator}\n              />\n              {breadcrumbs.map((breadcrumb, index) => (\n                <div key={breadcrumb.label} className={classNames.breadcrumb}>\n                  <Link\n                    href={breadcrumb.href}\n                    className={classNames.breadcrumbLink}\n                    data-active={index === breadcrumbs.length - 1}\n                  >\n                    {breadcrumb.label}\n                  </Link>\n                  {index < breadcrumbs.length - 1 && (\n                    <RiArrowRightSLine\n                      size={16}\n                      className={classNames.breadcrumbSeparator}\n                    />\n                  )}\n                </div>\n              ))}\n            </motion.div>\n          )}\n        </div>\n        <div className={classNames.toolbarControls} ref={toolbarControlsRef}>\n          {customActions}\n          {menuItems && (\n            <Menu.Root>\n              <Menu.Trigger\n                render={props => (\n                  <ButtonIcon\n                    size=\"small\"\n                    icon={<RiMore2Line />}\n                    variant=\"tertiary\"\n                    {...props}\n                  />\n                )}\n              />\n              <Menu.Portal>\n                <Menu.Positioner sideOffset={4} align=\"end\">\n                  <Menu.Popup>\n                    {menuItems.map(option => (\n                      <Menu.Item\n                        key={option.value}\n                        onClick={() => option.onClick?.()}\n                      >\n                        {option.label}\n                      </Menu.Item>\n                    ))}\n                  </Menu.Popup>\n                </Menu.Positioner>\n              </Menu.Portal>\n            </Menu.Root>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["wrapper","props"],"mappings":"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"}

package/dist/components/HeaderPage/HeaderPage.esm.js

@@ -0,0 +1,48 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Heading } from '../Heading/Heading.esm.js';
+import { Menu } from '../Menu/Menu.esm.js';
+import { ButtonIcon } from '../ButtonIcon/ButtonIcon.esm.js';
+import { RiMore2Line } from '@remixicon/react';
+import { Tabs, TabList, Tab } from '../Tabs/Tabs.esm.js';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const HeaderPage = (props) => {
+  const { title, menuItems, tabs, customActions } = props;
+  const { classNames } = useStyles("HeaderPage");
+  return /* @__PURE__ */ jsxs("div", { className: classNames.root, children: [
+    /* @__PURE__ */ jsxs("div", { className: classNames.content, children: [
+      /* @__PURE__ */ jsx(Heading, { variant: "title4", children: title }),
+      /* @__PURE__ */ jsxs("div", { className: classNames.controls, children: [
+        customActions,
+        menuItems && /* @__PURE__ */ jsxs(Menu.Root, { children: [
+          /* @__PURE__ */ jsx(
+            Menu.Trigger,
+            {
+              render: (props2) => /* @__PURE__ */ jsx(
+                ButtonIcon,
+                {
+                  ...props2,
+                  size: "small",
+                  icon: /* @__PURE__ */ jsx(RiMore2Line, {}),
+                  variant: "tertiary"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, { sideOffset: 4, align: "end", children: /* @__PURE__ */ jsx(Menu.Popup, { children: menuItems.map((menuItem) => /* @__PURE__ */ jsx(
+            Menu.Item,
+            {
+              onClick: () => menuItem.onClick?.(),
+              children: menuItem.label
+            },
+            menuItem.value
+          )) }) }) })
+        ] })
+      ] })
+    ] }),
+    tabs && /* @__PURE__ */ jsx("div", { className: classNames.tabsWrapper, children: /* @__PURE__ */ jsx(Tabs, { children: /* @__PURE__ */ jsx(TabList, { children: tabs.map((tab) => /* @__PURE__ */ jsx(Tab, { id: tab.id, href: tab.href, children: tab.label }, tab.id)) }) }) })
+  ] });
+};
+
+export { HeaderPage };
+//# sourceMappingURL=HeaderPage.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderPage.esm.js","sources":["../../../src/components/HeaderPage/HeaderPage.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 { HeaderPageProps } from './types';\nimport { Heading } from '../Heading';\nimport { Menu } from '../Menu';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { RiMore2Line } from '@remixicon/react';\nimport { Tabs, TabList, Tab } from '../Tabs';\nimport { useStyles } from '../../hooks/useStyles';\n\n/**\n * A component that renders a header page.\n *\n * @public\n */\nexport const HeaderPage = (props: HeaderPageProps) => {\n  const { title, menuItems, tabs, customActions } = props;\n  const { classNames } = useStyles('HeaderPage');\n\n  return (\n    <div className={classNames.root}>\n      <div className={classNames.content}>\n        <Heading variant=\"title4\">{title}</Heading>\n        <div className={classNames.controls}>\n          {customActions}\n          {menuItems && (\n            <Menu.Root>\n              <Menu.Trigger\n                render={props => (\n                  <ButtonIcon\n                    {...props}\n                    size=\"small\"\n                    icon={<RiMore2Line />}\n                    variant=\"tertiary\"\n                  />\n                )}\n              />\n              <Menu.Portal>\n                <Menu.Positioner sideOffset={4} align=\"end\">\n                  <Menu.Popup>\n                    {menuItems.map(menuItem => (\n                      <Menu.Item\n                        key={menuItem.value}\n                        onClick={() => menuItem.onClick?.()}\n                      >\n                        {menuItem.label}\n                      </Menu.Item>\n                    ))}\n                  </Menu.Popup>\n                </Menu.Positioner>\n              </Menu.Portal>\n            </Menu.Root>\n          )}\n        </div>\n      </div>\n      {tabs && (\n        <div className={classNames.tabsWrapper}>\n          <Tabs>\n            <TabList>\n              {tabs.map(tab => (\n                <Tab key={tab.id} id={tab.id} href={tab.href}>\n                  {tab.label}\n                </Tab>\n              ))}\n            </TabList>\n          </Tabs>\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["props"],"mappings":";;;;;;;;AA6Ba,MAAA,UAAA,GAAa,CAAC,KAA2B,KAAA;AACpD,EAAA,MAAM,EAAE,KAAA,EAAO,SAAW,EAAA,IAAA,EAAM,eAAkB,GAAA,KAAA;AAClD,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,YAAY,CAAA;AAE7C,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,UAAA,CAAW,IACzB,EAAA,QAAA,EAAA;AAAA,oBAAC,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,UAAA,CAAW,OACzB,EAAA,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,OAAA,EAAA,EAAQ,OAAQ,EAAA,QAAA,EAAU,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,sBAChC,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,UAAA,CAAW,QACxB,EAAA,QAAA,EAAA;AAAA,QAAA,aAAA;AAAA,QACA,SACC,oBAAA,IAAA,CAAC,IAAK,CAAA,IAAA,EAAL,EACC,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,IAAK,CAAA,OAAA;AAAA,YAAL;AAAA,cACC,MAAA,EAAQ,CAAAA,MACN,qBAAA,GAAA;AAAA,gBAAC,UAAA;AAAA,gBAAA;AAAA,kBACE,GAAGA,MAAAA;AAAA,kBACJ,IAAK,EAAA,OAAA;AAAA,kBACL,IAAA,sBAAO,WAAY,EAAA,EAAA,CAAA;AAAA,kBACnB,OAAQ,EAAA;AAAA;AAAA;AACV;AAAA,WAEJ;AAAA,8BACC,IAAK,CAAA,MAAA,EAAL,EACC,QAAC,kBAAA,GAAA,CAAA,IAAA,CAAK,YAAL,EAAgB,UAAA,EAAY,CAAG,EAAA,KAAA,EAAM,OACpC,QAAC,kBAAA,GAAA,CAAA,IAAA,CAAK,OAAL,EACE,QAAA,EAAA,SAAA,CAAU,IAAI,CACb,QAAA,qBAAA,GAAA;AAAA,YAAC,IAAK,CAAA,IAAA;AAAA,YAAL;AAAA,cAEC,OAAA,EAAS,MAAM,QAAA,CAAS,OAAU,IAAA;AAAA,cAEjC,QAAS,EAAA,QAAA,CAAA;AAAA,aAAA;AAAA,YAHL,QAAS,CAAA;AAAA,WAKjB,CACH,EAAA,CAAA,EACF,CACF,EAAA;AAAA,SACF,EAAA;AAAA,OAEJ,EAAA;AAAA,KACF,EAAA,CAAA;AAAA,IACC,IACC,oBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,UAAW,CAAA,WAAA,EACzB,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA,EACC,QAAC,kBAAA,GAAA,CAAA,OAAA,EAAA,EACE,QAAK,EAAA,IAAA,CAAA,GAAA,CAAI,CACR,GAAA,qBAAA,GAAA,CAAC,GAAiB,EAAA,EAAA,EAAA,EAAI,GAAI,CAAA,EAAA,EAAI,IAAM,EAAA,GAAA,CAAI,IACrC,EAAA,QAAA,EAAA,GAAA,CAAI,KADG,EAAA,EAAA,GAAA,CAAI,EAEd,CACD,CACH,EAAA,CAAA,EACF,CACF,EAAA;AAAA,GAEJ,EAAA,CAAA;AAEJ;;;;"}