@backstage/ui 0.9.0-next.2 → 0.9.0

package/dist/components/Table/components/Row.esm.js

@@ -1,16 +1,14 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useTableOptions, Row as Row$1, RouterProvider, Cell, Checkbox, Collection } from 'react-aria-components';
 import { useStyles } from '../../../hooks/useStyles.esm.js';
+import { TableDefinition } from '../definition.esm.js';
 import { useNavigate, useHref } from 'react-router-dom';
 import { isExternalLink } from '../../../utils/isExternalLink.esm.js';
 import styles from '../Table.module.css.esm.js';
 import clsx from 'clsx';
 
 function Row(props) {
-  const { classNames, cleanedProps } = useStyles(
-    "Table",
-    props
-  );
+  const { classNames, cleanedProps } = useStyles(TableDefinition, props);
   const { id, columns, children, href, ...rest } = cleanedProps;
   const navigate = useNavigate();
   const isExternal = isExternalLink(href);
@@ -24,6 +22,7 @@ function Row(props) {
       Row$1,
       {
         id,
+        href,
         className: clsx(classNames.row, styles[classNames.row]),
         ...rest,
         children: content
@@ -34,6 +33,7 @@ function Row(props) {
     Row$1,
     {
       id,
+      href,
       className: clsx(classNames.row, styles[classNames.row]),
       "data-react-aria-pressable": "true",
       ...rest,

package/dist/components/Table/components/Row.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Row.esm.js","sources":["../../../../src/components/Table/components/Row.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 {\n  Row as ReactAriaRow,\n  RowProps,\n  useTableOptions,\n  Cell,\n  Collection,\n  Checkbox,\n  RouterProvider,\n} from 'react-aria-components';\nimport { useStyles } from '../../../hooks/useStyles';\nimport { useNavigate } from 'react-router-dom';\nimport { useHref } from 'react-router-dom';\nimport { isExternalLink } from '../../../utils/isExternalLink';\nimport styles from '../Table.module.css';\nimport clsx from 'clsx';\n\n/** @public */\nexport function Row<T extends object>(props: RowProps<T>) {\n  const { classNames, cleanedProps } = useStyles<'Table', RowProps<T>>(\n    'Table',\n    props,\n  );\n  const { id, columns, children, href, ...rest } = cleanedProps;\n  const navigate = useNavigate();\n  const isExternal = isExternalLink(href);\n\n  let { selectionBehavior } = useTableOptions();\n\n  const content = (\n    <>\n      {selectionBehavior === 'toggle' && (\n        <Cell>\n          <Checkbox slot=\"selection\" />\n        </Cell>\n      )}\n      <Collection items={columns}>{children}</Collection>\n    </>\n  );\n\n  if (isExternal) {\n    return (\n      <ReactAriaRow\n        id={id}\n        className={clsx(classNames.row, styles[classNames.row])}\n        {...rest}\n      >\n        {content}\n      </ReactAriaRow>\n    );\n  }\n\n  return (\n    <RouterProvider navigate={navigate} useHref={useHref}>\n      <ReactAriaRow\n        id={id}\n        className={clsx(classNames.row, styles[classNames.row])}\n        data-react-aria-pressable=\"true\"\n        {...rest}\n      >\n        {content}\n      </ReactAriaRow>\n    </RouterProvider>\n  );\n}\n"],"names":["ReactAriaRow"],"mappings":";;;;;;;;AAiCO,SAAS,IAAsB,KAAA,EAAoB;AACxD,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA;AAAA,IACnC,OAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,EAAE,EAAA,EAAI,OAAA,EAAS,UAAU,IAAA,EAAM,GAAG,MAAK,GAAI,YAAA;AACjD,EAAA,MAAM,WAAW,WAAA,EAAY;AAC7B,EAAA,MAAM,UAAA,GAAa,eAAe,IAAI,CAAA;AAEtC,EAAA,IAAI,EAAE,iBAAA,EAAkB,GAAI,eAAA,EAAgB;AAE5C,EAAA,MAAM,0BACJ,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,iBAAA,KAAsB,4BACrB,GAAA,CAAC,IAAA,EAAA,EACC,8BAAC,QAAA,EAAA,EAAS,IAAA,EAAK,aAAY,CAAA,EAC7B,CAAA;AAAA,oBAEF,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAO,OAAA,EAAU,QAAA,EAAS;AAAA,GAAA,EACxC,CAAA;AAGF,EAAA,IAAI,UAAA,EAAY;AACd,IAAA,uBACE,GAAA;AAAA,MAACA,KAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,WAAW,IAAA,CAAK,UAAA,CAAW,KAAK,MAAA,CAAO,UAAA,CAAW,GAAG,CAAC,CAAA;AAAA,QACrD,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA;AAAA,KACH;AAAA,EAEJ;AAEA,EAAA,uBACE,GAAA,CAAC,cAAA,EAAA,EAAe,QAAA,EAAoB,OAAA,EAClC,QAAA,kBAAA,GAAA;AAAA,IAACA,KAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,WAAW,IAAA,CAAK,UAAA,CAAW,KAAK,MAAA,CAAO,UAAA,CAAW,GAAG,CAAC,CAAA;AAAA,MACtD,2BAAA,EAA0B,MAAA;AAAA,MACzB,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA;AAAA,GACH,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"Row.esm.js","sources":["../../../../src/components/Table/components/Row.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 {\n  Row as ReactAriaRow,\n  RowProps,\n  useTableOptions,\n  Cell,\n  Collection,\n  Checkbox,\n  RouterProvider,\n} from 'react-aria-components';\nimport { useStyles } from '../../../hooks/useStyles';\nimport { TableDefinition } from '../definition';\nimport { useNavigate } from 'react-router-dom';\nimport { useHref } from 'react-router-dom';\nimport { isExternalLink } from '../../../utils/isExternalLink';\nimport styles from '../Table.module.css';\nimport clsx from 'clsx';\n\n/** @public */\nexport function Row<T extends object>(props: RowProps<T>) {\n  const { classNames, cleanedProps } = useStyles(TableDefinition, props);\n  const { id, columns, children, href, ...rest } = cleanedProps;\n  const navigate = useNavigate();\n  const isExternal = isExternalLink(href);\n\n  let { selectionBehavior } = useTableOptions();\n\n  const content = (\n    <>\n      {selectionBehavior === 'toggle' && (\n        <Cell>\n          <Checkbox slot=\"selection\" />\n        </Cell>\n      )}\n      <Collection items={columns}>{children}</Collection>\n    </>\n  );\n\n  if (isExternal) {\n    return (\n      <ReactAriaRow\n        id={id}\n        href={href}\n        className={clsx(classNames.row, styles[classNames.row])}\n        {...rest}\n      >\n        {content}\n      </ReactAriaRow>\n    );\n  }\n\n  return (\n    <RouterProvider navigate={navigate} useHref={useHref}>\n      <ReactAriaRow\n        id={id}\n        href={href}\n        className={clsx(classNames.row, styles[classNames.row])}\n        data-react-aria-pressable=\"true\"\n        {...rest}\n      >\n        {content}\n      </ReactAriaRow>\n    </RouterProvider>\n  );\n}\n"],"names":["ReactAriaRow"],"mappings":";;;;;;;;;AAkCO,SAAS,IAAsB,KAAA,EAAoB;AACxD,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,iBAAiB,KAAK,CAAA;AACrE,EAAA,MAAM,EAAE,EAAA,EAAI,OAAA,EAAS,UAAU,IAAA,EAAM,GAAG,MAAK,GAAI,YAAA;AACjD,EAAA,MAAM,WAAW,WAAA,EAAY;AAC7B,EAAA,MAAM,UAAA,GAAa,eAAe,IAAI,CAAA;AAEtC,EAAA,IAAI,EAAE,iBAAA,EAAkB,GAAI,eAAA,EAAgB;AAE5C,EAAA,MAAM,0BACJ,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,iBAAA,KAAsB,4BACrB,GAAA,CAAC,IAAA,EAAA,EACC,8BAAC,QAAA,EAAA,EAAS,IAAA,EAAK,aAAY,CAAA,EAC7B,CAAA;AAAA,oBAEF,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAO,OAAA,EAAU,QAAA,EAAS;AAAA,GAAA,EACxC,CAAA;AAGF,EAAA,IAAI,UAAA,EAAY;AACd,IAAA,uBACE,GAAA;AAAA,MAACA,KAAA;AAAA,MAAA;AAAA,QACC,EAAA;AAAA,QACA,IAAA;AAAA,QACA,WAAW,IAAA,CAAK,UAAA,CAAW,KAAK,MAAA,CAAO,UAAA,CAAW,GAAG,CAAC,CAAA;AAAA,QACrD,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA;AAAA,KACH;AAAA,EAEJ;AAEA,EAAA,uBACE,GAAA,CAAC,cAAA,EAAA,EAAe,QAAA,EAAoB,OAAA,EAClC,QAAA,kBAAA,GAAA;AAAA,IAACA,KAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,IAAA;AAAA,MACA,WAAW,IAAA,CAAK,UAAA,CAAW,KAAK,MAAA,CAAO,UAAA,CAAW,GAAG,CAAC,CAAA;AAAA,MACtD,2BAAA,EAA0B,MAAA;AAAA,MACzB,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA;AAAA,GACH,EACF,CAAA;AAEJ;;;;"}

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

@@ -1,14 +1,12 @@
 import { jsx } from 'react/jsx-runtime';
 import { useStyles } from '../../../hooks/useStyles.esm.js';
+import { TableDefinition } from '../definition.esm.js';
 import { Table as Table$1 } from 'react-aria-components';
 import styles from '../Table.module.css.esm.js';
 import clsx from 'clsx';
 
 const Table = (props) => {
-  const { classNames, cleanedProps } = useStyles(
-    "Table",
-    props
-  );
+  const { classNames, cleanedProps } = useStyles(TableDefinition, props);
   return /* @__PURE__ */ jsx(
     Table$1,
     {

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

@@ -1 +1 @@
-{"version":3,"file":"Table.esm.js","sources":["../../../../src/components/Table/components/Table.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 { useStyles } from '../../../hooks/useStyles';\nimport {\n  Table as ReactAriaTable,\n  type TableProps,\n} from 'react-aria-components';\nimport styles from '../Table.module.css';\nimport clsx from 'clsx';\n\n/** @public */\nexport const Table = (props: TableProps) => {\n  const { classNames, cleanedProps } = useStyles<'Table', TableProps>(\n    'Table',\n    props,\n  );\n\n  return (\n    <ReactAriaTable\n      className={clsx(classNames.table, styles[classNames.table])}\n      aria-label=\"Data table\"\n      {...cleanedProps}\n    />\n  );\n};\n"],"names":["ReactAriaTable"],"mappings":";;;;;;AAyBO,MAAM,KAAA,GAAQ,CAAC,KAAA,KAAsB;AAC1C,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA;AAAA,IACnC,OAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,uBACE,GAAA;AAAA,IAACA,OAAA;AAAA,IAAA;AAAA,MACC,WAAW,IAAA,CAAK,UAAA,CAAW,OAAO,MAAA,CAAO,UAAA,CAAW,KAAK,CAAC,CAAA;AAAA,MAC1D,YAAA,EAAW,YAAA;AAAA,MACV,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}
+{"version":3,"file":"Table.esm.js","sources":["../../../../src/components/Table/components/Table.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 { useStyles } from '../../../hooks/useStyles';\nimport { TableDefinition } from '../definition';\nimport {\n  Table as ReactAriaTable,\n  type TableProps,\n} from 'react-aria-components';\nimport styles from '../Table.module.css';\nimport clsx from 'clsx';\n\n/** @public */\nexport const Table = (props: TableProps) => {\n  const { classNames, cleanedProps } = useStyles(TableDefinition, props);\n\n  return (\n    <ReactAriaTable\n      className={clsx(classNames.table, styles[classNames.table])}\n      aria-label=\"Data table\"\n      {...cleanedProps}\n    />\n  );\n};\n"],"names":["ReactAriaTable"],"mappings":";;;;;;;AA0BO,MAAM,KAAA,GAAQ,CAAC,KAAA,KAAsB;AAC1C,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,iBAAiB,KAAK,CAAA;AAErE,EAAA,uBACE,GAAA;AAAA,IAACA,OAAA;AAAA,IAAA;AAAA,MACC,WAAW,IAAA,CAAK,UAAA,CAAW,OAAO,MAAA,CAAO,UAAA,CAAW,KAAK,CAAC,CAAA;AAAA,MAC1D,YAAA,EAAW,YAAA;AAAA,MACV,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}

package/dist/components/Table/components/TableBody.esm.js

@@ -1,14 +1,12 @@
 import { jsx } from 'react/jsx-runtime';
 import { TableBody as TableBody$1 } from 'react-aria-components';
 import { useStyles } from '../../../hooks/useStyles.esm.js';
+import { TableDefinition } from '../definition.esm.js';
 import styles from '../Table.module.css.esm.js';
 import clsx from 'clsx';
 
 const TableBody = (props) => {
-  const { classNames, cleanedProps } = useStyles(
-    "Table",
-    props
-  );
+  const { classNames, cleanedProps } = useStyles(TableDefinition, props);
   return /* @__PURE__ */ jsx(
     TableBody$1,
     {

package/dist/components/Table/components/TableBody.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.esm.js","sources":["../../../../src/components/Table/components/TableBody.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 {\n  TableBody as ReactAriaTableBody,\n  type TableBodyProps,\n} from 'react-aria-components';\nimport { useStyles } from '../../../hooks/useStyles';\nimport styles from '../Table.module.css';\nimport clsx from 'clsx';\n\n/** @public */\nexport const TableBody = <T extends object>(props: TableBodyProps<T>) => {\n  const { classNames, cleanedProps } = useStyles<'Table', TableBodyProps<T>>(\n    'Table',\n    props,\n  );\n\n  return (\n    <ReactAriaTableBody\n      className={clsx(classNames.body, styles[classNames.body])}\n      {...cleanedProps}\n    />\n  );\n};\n"],"names":["ReactAriaTableBody"],"mappings":";;;;;;AAyBO,MAAM,SAAA,GAAY,CAAmB,KAAA,KAA6B;AACvE,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA;AAAA,IACnC,OAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,uBACE,GAAA;AAAA,IAACA,WAAA;AAAA,IAAA;AAAA,MACC,WAAW,IAAA,CAAK,UAAA,CAAW,MAAM,MAAA,CAAO,UAAA,CAAW,IAAI,CAAC,CAAA;AAAA,MACvD,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}
+{"version":3,"file":"TableBody.esm.js","sources":["../../../../src/components/Table/components/TableBody.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 {\n  TableBody as ReactAriaTableBody,\n  type TableBodyProps,\n} from 'react-aria-components';\nimport { useStyles } from '../../../hooks/useStyles';\nimport { TableDefinition } from '../definition';\nimport styles from '../Table.module.css';\nimport clsx from 'clsx';\n\n/** @public */\nexport const TableBody = <T extends object>(props: TableBodyProps<T>) => {\n  const { classNames, cleanedProps } = useStyles(TableDefinition, props);\n\n  return (\n    <ReactAriaTableBody\n      className={clsx(classNames.body, styles[classNames.body])}\n      {...cleanedProps}\n    />\n  );\n};\n"],"names":["ReactAriaTableBody"],"mappings":";;;;;;;AA0BO,MAAM,SAAA,GAAY,CAAmB,KAAA,KAA6B;AACvE,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,iBAAiB,KAAK,CAAA;AAErE,EAAA,uBACE,GAAA;AAAA,IAACA,WAAA;AAAA,IAAA;AAAA,MACC,WAAW,IAAA,CAAK,UAAA,CAAW,MAAM,MAAA,CAAO,UAAA,CAAW,IAAI,CAAC,CAAA;AAAA,MACvD,GAAG;AAAA;AAAA,GACN;AAEJ;;;;"}

package/dist/components/Table/components/TableHeader.esm.js

@@ -2,15 +2,13 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { useTableOptions, TableHeader as TableHeader$1, Checkbox, Collection } from 'react-aria-components';
 import { Column } from './Column.esm.js';
 import { useStyles } from '../../../hooks/useStyles.esm.js';
+import { TableDefinition } from '../definition.esm.js';
 import styles from '../Table.module.css.esm.js';
 import clsx from 'clsx';
 
 const TableHeader = (props) => {
   let { selectionBehavior, selectionMode, allowsDragging } = useTableOptions();
-  const { classNames, cleanedProps } = useStyles(
-    "Table",
-    props
-  );
+  const { classNames, cleanedProps } = useStyles(TableDefinition, props);
   const { columns, children, ...rest } = cleanedProps;
   return /* @__PURE__ */ jsxs(
     TableHeader$1,

package/dist/components/Table/components/TableHeader.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeader.esm.js","sources":["../../../../src/components/Table/components/TableHeader.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 {\n  TableHeader as ReactAriaTableHeader,\n  type TableHeaderProps,\n  Checkbox,\n} from 'react-aria-components';\nimport { Collection, useTableOptions } from 'react-aria-components';\nimport { Column } from './Column';\nimport { useStyles } from '../../../hooks/useStyles';\nimport styles from '../Table.module.css';\nimport clsx from 'clsx';\n\n/** @public */\nexport const TableHeader = <T extends object>(props: TableHeaderProps<T>) => {\n  let { selectionBehavior, selectionMode, allowsDragging } = useTableOptions();\n\n  const { classNames, cleanedProps } = useStyles<'Table', TableHeaderProps<T>>(\n    'Table',\n    props,\n  );\n  const { columns, children, ...rest } = cleanedProps;\n\n  return (\n    <ReactAriaTableHeader\n      className={clsx(classNames.header, styles[classNames.header])}\n      {...rest}\n    >\n      {/* Add extra columns for drag and drop and selection. */}\n      {allowsDragging && <Column />}\n      {selectionBehavior === 'toggle' && (\n        <Column>\n          {selectionMode === 'multiple' && <Checkbox slot=\"selection\" />}\n        </Column>\n      )}\n      <Collection items={columns}>{children}</Collection>\n    </ReactAriaTableHeader>\n  );\n};\n"],"names":["ReactAriaTableHeader"],"mappings":";;;;;;;AA4BO,MAAM,WAAA,GAAc,CAAmB,KAAA,KAA+B;AAC3E,EAAA,IAAI,EAAE,iBAAA,EAAmB,aAAA,EAAe,cAAA,KAAmB,eAAA,EAAgB;AAE3E,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA;AAAA,IACnC,OAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,EAAE,OAAA,EAAS,QAAA,EAAU,GAAG,MAAK,GAAI,YAAA;AAEvC,EAAA,uBACE,IAAA;AAAA,IAACA,aAAA;AAAA,IAAA;AAAA,MACC,WAAW,IAAA,CAAK,UAAA,CAAW,QAAQ,MAAA,CAAO,UAAA,CAAW,MAAM,CAAC,CAAA;AAAA,MAC3D,GAAG,IAAA;AAAA,MAGH,QAAA,EAAA;AAAA,QAAA,cAAA,wBAAmB,MAAA,EAAA,EAAO,CAAA;AAAA,QAC1B,iBAAA,KAAsB,QAAA,oBACrB,GAAA,CAAC,MAAA,EAAA,EACE,QAAA,EAAA,aAAA,KAAkB,8BAAc,GAAA,CAAC,QAAA,EAAA,EAAS,IAAA,EAAK,WAAA,EAAY,CAAA,EAC9D,CAAA;AAAA,wBAEF,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAO,OAAA,EAAU,QAAA,EAAS;AAAA;AAAA;AAAA,GACxC;AAEJ;;;;"}
+{"version":3,"file":"TableHeader.esm.js","sources":["../../../../src/components/Table/components/TableHeader.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 {\n  TableHeader as ReactAriaTableHeader,\n  type TableHeaderProps,\n  Checkbox,\n} from 'react-aria-components';\nimport { Collection, useTableOptions } from 'react-aria-components';\nimport { Column } from './Column';\nimport { useStyles } from '../../../hooks/useStyles';\nimport { TableDefinition } from '../definition';\nimport styles from '../Table.module.css';\nimport clsx from 'clsx';\n\n/** @public */\nexport const TableHeader = <T extends object>(props: TableHeaderProps<T>) => {\n  let { selectionBehavior, selectionMode, allowsDragging } = useTableOptions();\n\n  const { classNames, cleanedProps } = useStyles(TableDefinition, props);\n  const { columns, children, ...rest } = cleanedProps;\n\n  return (\n    <ReactAriaTableHeader\n      className={clsx(classNames.header, styles[classNames.header])}\n      {...rest}\n    >\n      {/* Add extra columns for drag and drop and selection. */}\n      {allowsDragging && <Column />}\n      {selectionBehavior === 'toggle' && (\n        <Column>\n          {selectionMode === 'multiple' && <Checkbox slot=\"selection\" />}\n        </Column>\n      )}\n      <Collection items={columns}>{children}</Collection>\n    </ReactAriaTableHeader>\n  );\n};\n"],"names":["ReactAriaTableHeader"],"mappings":";;;;;;;;AA6BO,MAAM,WAAA,GAAc,CAAmB,KAAA,KAA+B;AAC3E,EAAA,IAAI,EAAE,iBAAA,EAAmB,aAAA,EAAe,cAAA,KAAmB,eAAA,EAAgB;AAE3E,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,iBAAiB,KAAK,CAAA;AACrE,EAAA,MAAM,EAAE,OAAA,EAAS,QAAA,EAAU,GAAG,MAAK,GAAI,YAAA;AAEvC,EAAA,uBACE,IAAA;AAAA,IAACA,aAAA;AAAA,IAAA;AAAA,MACC,WAAW,IAAA,CAAK,UAAA,CAAW,QAAQ,MAAA,CAAO,UAAA,CAAW,MAAM,CAAC,CAAA;AAAA,MAC3D,GAAG,IAAA;AAAA,MAGH,QAAA,EAAA;AAAA,QAAA,cAAA,wBAAmB,MAAA,EAAA,EAAO,CAAA;AAAA,QAC1B,iBAAA,KAAsB,QAAA,oBACrB,GAAA,CAAC,MAAA,EAAA,EACE,QAAA,EAAA,aAAA,KAAkB,8BAAc,GAAA,CAAC,QAAA,EAAA,EAAS,IAAA,EAAK,WAAA,EAAY,CAAA,EAC9D,CAAA;AAAA,wBAEF,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAO,OAAA,EAAU,QAAA,EAAS;AAAA;AAAA;AAAA,GACxC;AAEJ;;;;"}

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

@@ -0,0 +1,24 @@
+const TableDefinition = {
+  classNames: {
+    table: "bui-Table",
+    header: "bui-TableHeader",
+    body: "bui-TableBody",
+    row: "bui-TableRow",
+    head: "bui-TableHead",
+    headContent: "bui-TableHeadContent",
+    headSortButton: "bui-TableHeadSortButton",
+    caption: "bui-TableCaption",
+    cell: "bui-TableCell",
+    cellContentWrapper: "bui-TableCellContentWrapper",
+    cellContent: "bui-TableCellContent",
+    cellIcon: "bui-TableCellIcon",
+    cellProfileAvatar: "bui-TableCellProfileAvatar",
+    cellProfileAvatarImage: "bui-TableCellProfileAvatarImage",
+    cellProfileAvatarFallback: "bui-TableCellProfileAvatarFallback",
+    cellProfileName: "bui-TableCellProfileName",
+    cellProfileLink: "bui-TableCellProfileLink"
+  }
+};
+
+export { TableDefinition };
+//# sourceMappingURL=definition.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Table/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 type { ComponentDefinition } from '../../types';\n\n/**\n * Component definition for Table\n * @public\n */\nexport const TableDefinition = {\n  classNames: {\n    table: 'bui-Table',\n    header: 'bui-TableHeader',\n    body: 'bui-TableBody',\n    row: 'bui-TableRow',\n    head: 'bui-TableHead',\n    headContent: 'bui-TableHeadContent',\n    headSortButton: 'bui-TableHeadSortButton',\n    caption: 'bui-TableCaption',\n    cell: 'bui-TableCell',\n    cellContentWrapper: 'bui-TableCellContentWrapper',\n    cellContent: 'bui-TableCellContent',\n    cellIcon: 'bui-TableCellIcon',\n    cellProfileAvatar: 'bui-TableCellProfileAvatar',\n    cellProfileAvatarImage: 'bui-TableCellProfileAvatarImage',\n    cellProfileAvatarFallback: 'bui-TableCellProfileAvatarFallback',\n    cellProfileName: 'bui-TableCellProfileName',\n    cellProfileLink: 'bui-TableCellProfileLink',\n  },\n} as const satisfies ComponentDefinition;\n"],"names":[],"mappings":"AAsBO,MAAM,eAAA,GAAkB;AAAA,EAC7B,UAAA,EAAY;AAAA,IACV,KAAA,EAAO,WAAA;AAAA,IACP,MAAA,EAAQ,iBAAA;AAAA,IACR,IAAA,EAAM,eAAA;AAAA,IACN,GAAA,EAAK,cAAA;AAAA,IACL,IAAA,EAAM,eAAA;AAAA,IACN,WAAA,EAAa,sBAAA;AAAA,IACb,cAAA,EAAgB,yBAAA;AAAA,IAChB,OAAA,EAAS,kBAAA;AAAA,IACT,IAAA,EAAM,eAAA;AAAA,IACN,kBAAA,EAAoB,6BAAA;AAAA,IACpB,WAAA,EAAa,sBAAA;AAAA,IACb,QAAA,EAAU,mBAAA;AAAA,IACV,iBAAA,EAAmB,4BAAA;AAAA,IACnB,sBAAA,EAAwB,iCAAA;AAAA,IACxB,yBAAA,EAA2B,oCAAA;AAAA,IAC3B,eAAA,EAAiB,0BAAA;AAAA,IACjB,eAAA,EAAiB;AAAA;AAErB;;;;"}

package/dist/components/TablePagination/TablePagination.esm.js

@@ -1,6 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import { useStyles } from '../../hooks/useStyles.esm.js';
+import { TablePaginationDefinition } from './definition.esm.js';
 import styles from './TablePagination.module.css.esm.js';
 import { RiArrowLeftSLine, RiArrowRightSLine } from '@remixicon/react';
 import { Select } from '../Select/Select.esm.js';
@@ -8,7 +9,7 @@ import { ButtonIcon } from '../ButtonIcon/ButtonIcon.esm.js';
 import { Text } from '../Text/Text.esm.js';
 
 function TablePagination(props) {
-  const { classNames, cleanedProps } = useStyles("TablePagination", {
+  const { classNames, cleanedProps } = useStyles(TablePaginationDefinition, {
     showPageSizeOptions: true,
     ...props
   });

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

@@ -1 +1 @@
-{"version":3,"file":"TablePagination.esm.js","sources":["../../../src/components/TablePagination/TablePagination.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 clsx from 'clsx';\nimport { Text, ButtonIcon, Select } from '../..';\nimport type { TablePaginationProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport styles from './TablePagination.module.css';\nimport { RiArrowLeftSLine, RiArrowRightSLine } from '@remixicon/react';\n\n/**\n * Pagination controls for Table components with page navigation and size selection.\n *\n * @public\n */\nexport function TablePagination(props: TablePaginationProps) {\n  const { classNames, cleanedProps } = useStyles('TablePagination', {\n    showPageSizeOptions: true,\n    ...props,\n  });\n  const {\n    className,\n    offset,\n    pageSize,\n    rowCount,\n    onNextPage,\n    onPreviousPage,\n    onPageSizeChange,\n    setOffset,\n    setPageSize,\n    showPageSizeOptions,\n    ...rest\n  } = cleanedProps;\n\n  const currentOffset = offset ?? 0;\n  const currentPageSize = pageSize ?? 10;\n\n  const fromCount = currentOffset + 1;\n  const toCount = Math.min(currentOffset + currentPageSize, rowCount ?? 0);\n\n  const nextPage = () => {\n    const totalRows = rowCount ?? 0;\n    const nextOffset = currentOffset + currentPageSize;\n\n    // Check if there are more items to navigate to\n    if (nextOffset < totalRows) {\n      onNextPage?.(); // Analytics tracking\n      setOffset?.(nextOffset); // Navigate to next page\n    }\n  };\n\n  const previousPage = () => {\n    // Check if we can go to previous page\n    if (currentOffset > 0) {\n      onPreviousPage?.(); // Analytics tracking\n      const prevOffset = Math.max(0, currentOffset - currentPageSize);\n      setOffset?.(prevOffset); // Navigate to previous page\n    }\n  };\n\n  return (\n    <div\n      className={clsx(classNames.root, styles[classNames.root], className)}\n      {...rest}\n    >\n      <div className={clsx(classNames.left, styles[classNames.left])}>\n        {showPageSizeOptions && (\n          <Select\n            name=\"pageSize\"\n            size=\"small\"\n            placeholder=\"Show 10 results\"\n            options={[\n              { label: 'Show 5 results', value: '5' },\n              { label: 'Show 10 results', value: '10' },\n              { label: 'Show 20 results', value: '20' },\n              { label: 'Show 30 results', value: '30' },\n              { label: 'Show 40 results', value: '40' },\n              { label: 'Show 50 results', value: '50' },\n            ]}\n            selectedKey={pageSize?.toString()}\n            onSelectionChange={value => {\n              const newPageSize = Number(value);\n              setPageSize?.(newPageSize);\n              onPageSizeChange?.(newPageSize);\n            }}\n            className={clsx(classNames.select, styles[classNames.select])}\n          />\n        )}\n      </div>\n      <div className={clsx(classNames.right, styles[classNames.right])}>\n        <Text\n          as=\"p\"\n          variant=\"body-medium\"\n        >{`${fromCount} - ${toCount} of ${rowCount}`}</Text>\n        <ButtonIcon\n          variant=\"secondary\"\n          size=\"small\"\n          onClick={previousPage}\n          isDisabled={currentOffset === 0}\n          icon={<RiArrowLeftSLine />}\n          aria-label=\"Previous\"\n        />\n        <ButtonIcon\n          variant=\"secondary\"\n          size=\"small\"\n          onClick={nextPage}\n          isDisabled={\n            rowCount !== undefined &&\n            currentOffset + currentPageSize >= rowCount\n          }\n          icon={<RiArrowRightSLine />}\n          aria-label=\"Next\"\n        />\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"TablePagination.esm.js","sources":["../../../src/components/TablePagination/TablePagination.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 clsx from 'clsx';\nimport { Text, ButtonIcon, Select } from '../..';\nimport type { TablePaginationProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport { TablePaginationDefinition } from './definition';\nimport styles from './TablePagination.module.css';\nimport { RiArrowLeftSLine, RiArrowRightSLine } from '@remixicon/react';\n\n/**\n * Pagination controls for Table components with page navigation and size selection.\n *\n * @public\n */\nexport function TablePagination(props: TablePaginationProps) {\n  const { classNames, cleanedProps } = useStyles(TablePaginationDefinition, {\n    showPageSizeOptions: true,\n    ...props,\n  });\n  const {\n    className,\n    offset,\n    pageSize,\n    rowCount,\n    onNextPage,\n    onPreviousPage,\n    onPageSizeChange,\n    setOffset,\n    setPageSize,\n    showPageSizeOptions,\n    ...rest\n  } = cleanedProps;\n\n  const currentOffset = offset ?? 0;\n  const currentPageSize = pageSize ?? 10;\n\n  const fromCount = currentOffset + 1;\n  const toCount = Math.min(currentOffset + currentPageSize, rowCount ?? 0);\n\n  const nextPage = () => {\n    const totalRows = rowCount ?? 0;\n    const nextOffset = currentOffset + currentPageSize;\n\n    // Check if there are more items to navigate to\n    if (nextOffset < totalRows) {\n      onNextPage?.(); // Analytics tracking\n      setOffset?.(nextOffset); // Navigate to next page\n    }\n  };\n\n  const previousPage = () => {\n    // Check if we can go to previous page\n    if (currentOffset > 0) {\n      onPreviousPage?.(); // Analytics tracking\n      const prevOffset = Math.max(0, currentOffset - currentPageSize);\n      setOffset?.(prevOffset); // Navigate to previous page\n    }\n  };\n\n  return (\n    <div\n      className={clsx(classNames.root, styles[classNames.root], className)}\n      {...rest}\n    >\n      <div className={clsx(classNames.left, styles[classNames.left])}>\n        {showPageSizeOptions && (\n          <Select\n            name=\"pageSize\"\n            size=\"small\"\n            placeholder=\"Show 10 results\"\n            options={[\n              { label: 'Show 5 results', value: '5' },\n              { label: 'Show 10 results', value: '10' },\n              { label: 'Show 20 results', value: '20' },\n              { label: 'Show 30 results', value: '30' },\n              { label: 'Show 40 results', value: '40' },\n              { label: 'Show 50 results', value: '50' },\n            ]}\n            selectedKey={pageSize?.toString()}\n            onSelectionChange={value => {\n              const newPageSize = Number(value);\n              setPageSize?.(newPageSize);\n              onPageSizeChange?.(newPageSize);\n            }}\n            className={clsx(classNames.select, styles[classNames.select])}\n          />\n        )}\n      </div>\n      <div className={clsx(classNames.right, styles[classNames.right])}>\n        <Text\n          as=\"p\"\n          variant=\"body-medium\"\n        >{`${fromCount} - ${toCount} of ${rowCount}`}</Text>\n        <ButtonIcon\n          variant=\"secondary\"\n          size=\"small\"\n          onClick={previousPage}\n          isDisabled={currentOffset === 0}\n          icon={<RiArrowLeftSLine />}\n          aria-label=\"Previous\"\n        />\n        <ButtonIcon\n          variant=\"secondary\"\n          size=\"small\"\n          onClick={nextPage}\n          isDisabled={\n            rowCount !== undefined &&\n            currentOffset + currentPageSize >= rowCount\n          }\n          icon={<RiArrowRightSLine />}\n          aria-label=\"Next\"\n        />\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,11 @@
+const TablePaginationDefinition = {
+  classNames: {
+    root: "bui-TablePagination",
+    left: "bui-TablePaginationLeft",
+    right: "bui-TablePaginationRight",
+    select: "bui-TablePaginationSelect"
+  }
+};
+
+export { TablePaginationDefinition };
+//# sourceMappingURL=definition.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"definition.esm.js","sources":["../../../src/components/TablePagination/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 type { ComponentDefinition } from '../../types';\n\n/**\n * Component definition for TablePagination\n * @public\n */\nexport const TablePaginationDefinition = {\n  classNames: {\n    root: 'bui-TablePagination',\n    left: 'bui-TablePaginationLeft',\n    right: 'bui-TablePaginationRight',\n    select: 'bui-TablePaginationSelect',\n  },\n} as const satisfies ComponentDefinition;\n"],"names":[],"mappings":"AAsBO,MAAM,yBAAA,GAA4B;AAAA,EACvC,UAAA,EAAY;AAAA,IACV,IAAA,EAAM,qBAAA;AAAA,IACN,IAAA,EAAM,yBAAA;AAAA,IACN,KAAA,EAAO,0BAAA;AAAA,IACP,MAAA,EAAQ;AAAA;AAEZ;;;;"}

package/dist/components/Tabs/Tabs.esm.js

@@ -4,6 +4,7 @@ import { useNavigate, useLocation, useHref } from 'react-router-dom';
 import { TabsIndicators } from './TabsIndicators.esm.js';
 import { RouterProvider, Tabs as Tabs$1, TabList as TabList$1, Tab as Tab$1, TabPanel as TabPanel$1 } from 'react-aria-components';
 import { useStyles } from '../../hooks/useStyles.esm.js';
+import { TabsDefinition } from './definition.esm.js';
 import styles from './Tabs.module.css.esm.js';
 import clsx from 'clsx';
 
@@ -25,7 +26,7 @@ const isTabActive = (tabHref, currentPathname, matchStrategy) => {
   return currentPathname.startsWith(`${tabHref}/`);
 };
 const Tabs = (props) => {
-  const { classNames, cleanedProps } = useStyles("Tabs", props);
+  const { classNames, cleanedProps } = useStyles(TabsDefinition, props);
   const { className, children, ...rest } = cleanedProps;
   const tabsRef = useRef(null);
   const tabRefs = useRef(/* @__PURE__ */ new Map());
@@ -87,7 +88,7 @@ const Tabs = (props) => {
   ) }) });
 };
 const TabList = (props) => {
-  const { classNames, cleanedProps } = useStyles("Tabs", props);
+  const { classNames, cleanedProps } = useStyles(TabsDefinition, props);
   const { className, children, ...rest } = cleanedProps;
   const { setHoveredKey, tabRefs, tabsRef, hoveredKey, prevHoveredKey } = useTabsContext();
   const handleHover = (key) => {
@@ -134,7 +135,7 @@ const TabList = (props) => {
   );
 };
 const Tab = (props) => {
-  const { classNames, cleanedProps } = useStyles("Tabs", props);
+  const { classNames, cleanedProps } = useStyles(TabsDefinition, props);
   const {
     className,
     href,
@@ -157,7 +158,7 @@ const Tab = (props) => {
   );
 };
 const TabPanel = (props) => {
-  const { classNames, cleanedProps } = useStyles("Tabs", props);
+  const { classNames, cleanedProps } = useStyles(TabsDefinition, props);
   const { className, children, ...rest } = cleanedProps;
   return /* @__PURE__ */ jsx(
     TabPanel$1,

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

@@ -1 +1 @@
-{"version":3,"file":"Tabs.esm.js","sources":["../../../src/components/Tabs/Tabs.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 {\n  useRef,\n  useState,\n  Children,\n  cloneElement,\n  isValidElement,\n  ReactNode,\n  createContext,\n  useContext,\n} from 'react';\nimport type {\n  TabsProps,\n  TabListProps,\n  TabPanelProps,\n  TabsContextValue,\n  TabProps,\n} from './types';\nimport { useLocation, useNavigate, useHref } from 'react-router-dom';\nimport { TabsIndicators } from './TabsIndicators';\nimport {\n  Tabs as AriaTabs,\n  TabList as AriaTabList,\n  Tab as AriaTab,\n  TabPanel as AriaTabPanel,\n  RouterProvider,\n  TabProps as AriaTabProps,\n} from 'react-aria-components';\nimport { useStyles } from '../../hooks/useStyles';\nimport styles from './Tabs.module.css';\nimport clsx from 'clsx';\n\nconst TabsContext = createContext<TabsContextValue | undefined>(undefined);\n\nconst useTabsContext = () => {\n  const context = useContext(TabsContext);\n  if (!context) {\n    throw new Error('Tab components must be used within a Tabs component');\n  }\n  return context;\n};\n\n/**\n * Utility function to determine if a tab should be active based on the matching strategy.\n * This follows the pattern used in WorkaroundNavLink from the sidebar.\n */\nconst isTabActive = (\n  tabHref: string,\n  currentPathname: string,\n  matchStrategy: 'exact' | 'prefix',\n): boolean => {\n  if (matchStrategy === 'exact') {\n    return tabHref === currentPathname;\n  }\n\n  // Prefix matching - similar to WorkaroundNavLink behavior\n  if (tabHref === currentPathname) {\n    return true;\n  }\n\n  // Check if current path starts with tab href followed by a slash\n  // This prevents /foo matching /foobar\n  return currentPathname.startsWith(`${tabHref}/`);\n};\n\n/**\n * A component that renders a list of tabs.\n *\n * @public\n */\nexport const Tabs = (props: TabsProps) => {\n  const { classNames, cleanedProps } = useStyles('Tabs', props);\n  const { className, children, ...rest } = cleanedProps;\n  const tabsRef = useRef<HTMLDivElement>(null);\n  const tabRefs = useRef<Map<string, HTMLDivElement>>(new Map());\n  const [hoveredKey, setHoveredKey] = useState<string | null>(null);\n  const prevHoveredKey = useRef<string | null>(null);\n  let navigate = useNavigate();\n  const location = useLocation();\n\n  const setTabRef = (key: string, element: HTMLDivElement | null) => {\n    if (element) {\n      tabRefs.current.set(key, element);\n    } else {\n      tabRefs.current.delete(key);\n    }\n  };\n\n  // If selectedKey is not provided, try to determine it from the current route\n  const computedSelectedKey = (() => {\n    const childrenArray = Children.toArray(children as ReactNode);\n    for (const child of childrenArray) {\n      if (isValidElement(child) && child.type === TabList) {\n        const tabListChildren = Children.toArray(child.props.children);\n        for (const tabChild of tabListChildren) {\n          if (isValidElement(tabChild) && tabChild.props.href) {\n            // Use tab-specific strategy, defaulting to 'exact'\n            const strategy = tabChild.props.matchStrategy || 'exact';\n            if (isTabActive(tabChild.props.href, location.pathname, strategy)) {\n              return tabChild.props.id;\n            }\n          }\n        }\n\n        //No route matches - check if all tabs have hrefs (pure navigation)\n        const allTabsHaveHref = tabListChildren.every(\n          child => isValidElement(child) && child.props.href,\n        );\n\n        if (allTabsHaveHref) {\n          // Pure navigation tabs, no route match\n          return null;\n        } else {\n          // Mixed tabs or pure local state\n          return undefined;\n        }\n      }\n    }\n    return undefined;\n  })();\n\n  if (!children) return null;\n\n  const contextValue: TabsContextValue = {\n    tabsRef,\n    tabRefs,\n    hoveredKey,\n    prevHoveredKey,\n    setHoveredKey,\n    setTabRef,\n  };\n\n  return (\n    <TabsContext.Provider value={contextValue}>\n      <RouterProvider navigate={navigate} useHref={useHref}>\n        <AriaTabs\n          className={clsx(classNames.tabs, styles[classNames.tabs], className)}\n          keyboardActivation=\"manual\"\n          selectedKey={computedSelectedKey}\n          ref={tabsRef}\n          {...rest}\n        >\n          {children as ReactNode}\n        </AriaTabs>\n      </RouterProvider>\n    </TabsContext.Provider>\n  );\n};\n\n/**\n * A component that renders a list of tabs.\n *\n * @public\n */\nexport const TabList = (props: TabListProps) => {\n  const { classNames, cleanedProps } = useStyles('Tabs', props);\n  const { className, children, ...rest } = cleanedProps;\n  const { setHoveredKey, tabRefs, tabsRef, hoveredKey, prevHoveredKey } =\n    useTabsContext();\n\n  const handleHover = (key: string | null) => {\n    setHoveredKey(key);\n  };\n\n  // Clone children with additional props for hover and ref management\n  const enhancedChildren = Children.map(children as ReactNode, child => {\n    if (isValidElement(child)) {\n      return cloneElement(child, {\n        onHoverStart: () => handleHover(child.props.id as string),\n        onHoverEnd: () => handleHover(null),\n      } as Partial<AriaTabProps>);\n    }\n    return child;\n  });\n\n  return (\n    <div\n      className={clsx(\n        classNames.tabListWrapper,\n        styles[classNames.tabListWrapper],\n        className,\n      )}\n    >\n      <AriaTabList\n        className={clsx(classNames.tabList, styles[classNames.tabList])}\n        aria-label=\"Toolbar tabs\"\n        {...rest}\n      >\n        {enhancedChildren}\n      </AriaTabList>\n      <TabsIndicators\n        tabRefs={tabRefs}\n        tabsRef={tabsRef}\n        hoveredKey={hoveredKey}\n        prevHoveredKey={prevHoveredKey}\n      />\n    </div>\n  );\n};\n\n/**\n * A component that renders a tab.\n *\n * @public\n */\nexport const Tab = (props: TabProps) => {\n  const { classNames, cleanedProps } = useStyles('Tabs', props);\n  const {\n    className,\n    href,\n    children,\n    id,\n    matchStrategy: _matchStrategy,\n    ...rest\n  } = cleanedProps;\n  const { setTabRef } = useTabsContext();\n\n  return (\n    <AriaTab\n      id={id}\n      className={clsx(classNames.tab, styles[classNames.tab], className)}\n      ref={el => setTabRef(id as string, el as HTMLDivElement)}\n      href={href}\n      {...rest}\n    >\n      {children}\n    </AriaTab>\n  );\n};\n\n/**\n * A component that renders the content of a tab.\n *\n * @public\n */\nexport const TabPanel = (props: TabPanelProps) => {\n  const { classNames, cleanedProps } = useStyles('Tabs', props);\n  const { className, children, ...rest } = cleanedProps;\n\n  return (\n    <AriaTabPanel\n      className={clsx(classNames.panel, styles[classNames.panel], className)}\n      {...rest}\n    >\n      {children}\n    </AriaTabPanel>\n  );\n};\n"],"names":["child","AriaTabs","AriaTabList","AriaTab","AriaTabPanel"],"mappings":"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"}
+{"version":3,"file":"Tabs.esm.js","sources":["../../../src/components/Tabs/Tabs.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 {\n  useRef,\n  useState,\n  Children,\n  cloneElement,\n  isValidElement,\n  ReactNode,\n  createContext,\n  useContext,\n} from 'react';\nimport type {\n  TabsProps,\n  TabListProps,\n  TabPanelProps,\n  TabsContextValue,\n  TabProps,\n} from './types';\nimport { useLocation, useNavigate, useHref } from 'react-router-dom';\nimport { TabsIndicators } from './TabsIndicators';\nimport {\n  Tabs as AriaTabs,\n  TabList as AriaTabList,\n  Tab as AriaTab,\n  TabPanel as AriaTabPanel,\n  RouterProvider,\n  TabProps as AriaTabProps,\n} from 'react-aria-components';\nimport { useStyles } from '../../hooks/useStyles';\nimport { TabsDefinition } from './definition';\nimport styles from './Tabs.module.css';\nimport clsx from 'clsx';\n\nconst TabsContext = createContext<TabsContextValue | undefined>(undefined);\n\nconst useTabsContext = () => {\n  const context = useContext(TabsContext);\n  if (!context) {\n    throw new Error('Tab components must be used within a Tabs component');\n  }\n  return context;\n};\n\n/**\n * Utility function to determine if a tab should be active based on the matching strategy.\n * This follows the pattern used in WorkaroundNavLink from the sidebar.\n */\nconst isTabActive = (\n  tabHref: string,\n  currentPathname: string,\n  matchStrategy: 'exact' | 'prefix',\n): boolean => {\n  if (matchStrategy === 'exact') {\n    return tabHref === currentPathname;\n  }\n\n  // Prefix matching - similar to WorkaroundNavLink behavior\n  if (tabHref === currentPathname) {\n    return true;\n  }\n\n  // Check if current path starts with tab href followed by a slash\n  // This prevents /foo matching /foobar\n  return currentPathname.startsWith(`${tabHref}/`);\n};\n\n/**\n * A component that renders a list of tabs.\n *\n * @public\n */\nexport const Tabs = (props: TabsProps) => {\n  const { classNames, cleanedProps } = useStyles(TabsDefinition, props);\n  const { className, children, ...rest } = cleanedProps;\n  const tabsRef = useRef<HTMLDivElement>(null);\n  const tabRefs = useRef<Map<string, HTMLDivElement>>(new Map());\n  const [hoveredKey, setHoveredKey] = useState<string | null>(null);\n  const prevHoveredKey = useRef<string | null>(null);\n  let navigate = useNavigate();\n  const location = useLocation();\n\n  const setTabRef = (key: string, element: HTMLDivElement | null) => {\n    if (element) {\n      tabRefs.current.set(key, element);\n    } else {\n      tabRefs.current.delete(key);\n    }\n  };\n\n  // If selectedKey is not provided, try to determine it from the current route\n  const computedSelectedKey = (() => {\n    const childrenArray = Children.toArray(children as ReactNode);\n    for (const child of childrenArray) {\n      if (isValidElement(child) && child.type === TabList) {\n        const tabListChildren = Children.toArray(child.props.children);\n        for (const tabChild of tabListChildren) {\n          if (isValidElement(tabChild) && tabChild.props.href) {\n            // Use tab-specific strategy, defaulting to 'exact'\n            const strategy = tabChild.props.matchStrategy || 'exact';\n            if (isTabActive(tabChild.props.href, location.pathname, strategy)) {\n              return tabChild.props.id;\n            }\n          }\n        }\n\n        //No route matches - check if all tabs have hrefs (pure navigation)\n        const allTabsHaveHref = tabListChildren.every(\n          child => isValidElement(child) && child.props.href,\n        );\n\n        if (allTabsHaveHref) {\n          // Pure navigation tabs, no route match\n          return null;\n        } else {\n          // Mixed tabs or pure local state\n          return undefined;\n        }\n      }\n    }\n    return undefined;\n  })();\n\n  if (!children) return null;\n\n  const contextValue: TabsContextValue = {\n    tabsRef,\n    tabRefs,\n    hoveredKey,\n    prevHoveredKey,\n    setHoveredKey,\n    setTabRef,\n  };\n\n  return (\n    <TabsContext.Provider value={contextValue}>\n      <RouterProvider navigate={navigate} useHref={useHref}>\n        <AriaTabs\n          className={clsx(classNames.tabs, styles[classNames.tabs], className)}\n          keyboardActivation=\"manual\"\n          selectedKey={computedSelectedKey}\n          ref={tabsRef}\n          {...rest}\n        >\n          {children as ReactNode}\n        </AriaTabs>\n      </RouterProvider>\n    </TabsContext.Provider>\n  );\n};\n\n/**\n * A component that renders a list of tabs.\n *\n * @public\n */\nexport const TabList = (props: TabListProps) => {\n  const { classNames, cleanedProps } = useStyles(TabsDefinition, props);\n  const { className, children, ...rest } = cleanedProps;\n  const { setHoveredKey, tabRefs, tabsRef, hoveredKey, prevHoveredKey } =\n    useTabsContext();\n\n  const handleHover = (key: string | null) => {\n    setHoveredKey(key);\n  };\n\n  // Clone children with additional props for hover and ref management\n  const enhancedChildren = Children.map(children as ReactNode, child => {\n    if (isValidElement(child)) {\n      return cloneElement(child, {\n        onHoverStart: () => handleHover(child.props.id as string),\n        onHoverEnd: () => handleHover(null),\n      } as Partial<AriaTabProps>);\n    }\n    return child;\n  });\n\n  return (\n    <div\n      className={clsx(\n        classNames.tabListWrapper,\n        styles[classNames.tabListWrapper],\n        className,\n      )}\n    >\n      <AriaTabList\n        className={clsx(classNames.tabList, styles[classNames.tabList])}\n        aria-label=\"Toolbar tabs\"\n        {...rest}\n      >\n        {enhancedChildren}\n      </AriaTabList>\n      <TabsIndicators\n        tabRefs={tabRefs}\n        tabsRef={tabsRef}\n        hoveredKey={hoveredKey}\n        prevHoveredKey={prevHoveredKey}\n      />\n    </div>\n  );\n};\n\n/**\n * A component that renders a tab.\n *\n * @public\n */\nexport const Tab = (props: TabProps) => {\n  const { classNames, cleanedProps } = useStyles(TabsDefinition, props);\n  const {\n    className,\n    href,\n    children,\n    id,\n    matchStrategy: _matchStrategy,\n    ...rest\n  } = cleanedProps;\n  const { setTabRef } = useTabsContext();\n\n  return (\n    <AriaTab\n      id={id}\n      className={clsx(classNames.tab, styles[classNames.tab], className)}\n      ref={el => setTabRef(id as string, el as HTMLDivElement)}\n      href={href}\n      {...rest}\n    >\n      {children}\n    </AriaTab>\n  );\n};\n\n/**\n * A component that renders the content of a tab.\n *\n * @public\n */\nexport const TabPanel = (props: TabPanelProps) => {\n  const { classNames, cleanedProps } = useStyles(TabsDefinition, props);\n  const { className, children, ...rest } = cleanedProps;\n\n  return (\n    <AriaTabPanel\n      className={clsx(classNames.panel, styles[classNames.panel], className)}\n      {...rest}\n    >\n      {children}\n    </AriaTabPanel>\n  );\n};\n"],"names":["child","AriaTabs","AriaTabList","AriaTab","AriaTabPanel"],"mappings":";;;;;;;;;;AAgDA,MAAM,WAAA,GAAc,cAA4C,MAAS,CAAA;AAEzE,MAAM,iBAAiB,MAAM;AAC3B,EAAA,MAAM,OAAA,GAAU,WAAW,WAAW,CAAA;AACtC,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,MAAM,IAAI,MAAM,qDAAqD,CAAA;AAAA,EACvE;AACA,EAAA,OAAO,OAAA;AACT,CAAA;AAMA,MAAM,WAAA,GAAc,CAClB,OAAA,EACA,eAAA,EACA,aAAA,KACY;AACZ,EAAA,IAAI,kBAAkB,OAAA,EAAS;AAC7B,IAAA,OAAO,OAAA,KAAY,eAAA;AAAA,EACrB;AAGA,EAAA,IAAI,YAAY,eAAA,EAAiB;AAC/B,IAAA,OAAO,IAAA;AAAA,EACT;AAIA,EAAA,OAAO,eAAA,CAAgB,UAAA,CAAW,CAAA,EAAG,OAAO,CAAA,CAAA,CAAG,CAAA;AACjD,CAAA;AAOO,MAAM,IAAA,GAAO,CAAC,KAAA,KAAqB;AACxC,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,gBAAgB,KAAK,CAAA;AACpE,EAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,GAAG,MAAK,GAAI,YAAA;AACzC,EAAA,MAAM,OAAA,GAAU,OAAuB,IAAI,CAAA;AAC3C,EAAA,MAAM,OAAA,GAAU,MAAA,iBAAoC,IAAI,GAAA,EAAK,CAAA;AAC7D,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAwB,IAAI,CAAA;AAChE,EAAA,MAAM,cAAA,GAAiB,OAAsB,IAAI,CAAA;AACjD,EAAA,IAAI,WAAW,WAAA,EAAY;AAC3B,EAAA,MAAM,WAAW,WAAA,EAAY;AAE7B,EAAA,MAAM,SAAA,GAAY,CAAC,GAAA,EAAa,OAAA,KAAmC;AACjE,IAAA,IAAI,OAAA,EAAS;AACX,MAAA,OAAA,CAAQ,OAAA,CAAQ,GAAA,CAAI,GAAA,EAAK,OAAO,CAAA;AAAA,IAClC,CAAA,MAAO;AACL,MAAA,OAAA,CAAQ,OAAA,CAAQ,OAAO,GAAG,CAAA;AAAA,IAC5B;AAAA,EACF,CAAA;AAGA,EAAA,MAAM,uBAAuB,MAAM;AACjC,IAAA,MAAM,aAAA,GAAgB,QAAA,CAAS,OAAA,CAAQ,QAAqB,CAAA;AAC5D,IAAA,KAAA,MAAW,SAAS,aAAA,EAAe;AACjC,MAAA,IAAI,cAAA,CAAe,KAAK,CAAA,IAAK,KAAA,CAAM,SAAS,OAAA,EAAS;AACnD,QAAA,MAAM,eAAA,GAAkB,QAAA,CAAS,OAAA,CAAQ,KAAA,CAAM,MAAM,QAAQ,CAAA;AAC7D,QAAA,KAAA,MAAW,YAAY,eAAA,EAAiB;AACtC,UAAA,IAAI,cAAA,CAAe,QAAQ,CAAA,IAAK,QAAA,CAAS,MAAM,IAAA,EAAM;AAEnD,YAAA,MAAM,QAAA,GAAW,QAAA,CAAS,KAAA,CAAM,aAAA,IAAiB,OAAA;AACjD,YAAA,IAAI,YAAY,QAAA,CAAS,KAAA,CAAM,MAAM,QAAA,CAAS,QAAA,EAAU,QAAQ,CAAA,EAAG;AACjE,cAAA,OAAO,SAAS,KAAA,CAAM,EAAA;AAAA,YACxB;AAAA,UACF;AAAA,QACF;AAGA,QAAA,MAAM,kBAAkB,eAAA,CAAgB,KAAA;AAAA,UACtC,CAAAA,MAAAA,KAAS,cAAA,CAAeA,MAAK,CAAA,IAAKA,OAAM,KAAA,CAAM;AAAA,SAChD;AAEA,QAAA,IAAI,eAAA,EAAiB;AAEnB,UAAA,OAAO,IAAA;AAAA,QACT,CAAA,MAAO;AAEL,UAAA,OAAO,MAAA;AAAA,QACT;AAAA,MACF;AAAA,IACF;AACA,IAAA,OAAO,MAAA;AAAA,EACT,CAAA,GAAG;AAEH,EAAA,IAAI,CAAC,UAAU,OAAO,IAAA;AAEtB,EAAA,MAAM,YAAA,GAAiC;AAAA,IACrC,OAAA;AAAA,IACA,OAAA;AAAA,IACA,UAAA;AAAA,IACA,cAAA;AAAA,IACA,aAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,YAAY,QAAA,EAAZ,EAAqB,OAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,cAAA,EAAA,EAAe,QAAA,EAAoB,OAAA,EAClC,QAAA,kBAAA,GAAA;AAAA,IAACC,MAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,KAAK,UAAA,CAAW,IAAA,EAAM,OAAO,UAAA,CAAW,IAAI,GAAG,SAAS,CAAA;AAAA,MACnE,kBAAA,EAAmB,QAAA;AAAA,MACnB,WAAA,EAAa,mBAAA;AAAA,MACb,GAAA,EAAK,OAAA;AAAA,MACJ,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,KAEL,CAAA,EACF,CAAA;AAEJ;AAOO,MAAM,OAAA,GAAU,CAAC,KAAA,KAAwB;AAC9C,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,gBAAgB,KAAK,CAAA;AACpE,EAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,GAAG,MAAK,GAAI,YAAA;AACzC,EAAA,MAAM,EAAE,aAAA,EAAe,OAAA,EAAS,SAAS,UAAA,EAAY,cAAA,KACnD,cAAA,EAAe;AAEjB,EAAA,MAAM,WAAA,GAAc,CAAC,GAAA,KAAuB;AAC1C,IAAA,aAAA,CAAc,GAAG,CAAA;AAAA,EACnB,CAAA;AAGA,EAAA,MAAM,gBAAA,GAAmB,QAAA,CAAS,GAAA,CAAI,QAAA,EAAuB,CAAA,KAAA,KAAS;AACpE,IAAA,IAAI,cAAA,CAAe,KAAK,CAAA,EAAG;AACzB,MAAA,OAAO,aAAa,KAAA,EAAO;AAAA,QACzB,YAAA,EAAc,MAAM,WAAA,CAAY,KAAA,CAAM,MAAM,EAAY,CAAA;AAAA,QACxD,UAAA,EAAY,MAAM,WAAA,CAAY,IAAI;AAAA,OACV,CAAA;AAAA,IAC5B;AACA,IAAA,OAAO,KAAA;AAAA,EACT,CAAC,CAAA;AAED,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,IAAA;AAAA,QACT,UAAA,CAAW,cAAA;AAAA,QACX,MAAA,CAAO,WAAW,cAAc,CAAA;AAAA,QAChC;AAAA,OACF;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAACC,SAAA;AAAA,UAAA;AAAA,YACC,WAAW,IAAA,CAAK,UAAA,CAAW,SAAS,MAAA,CAAO,UAAA,CAAW,OAAO,CAAC,CAAA;AAAA,YAC9D,YAAA,EAAW,cAAA;AAAA,YACV,GAAG,IAAA;AAAA,YAEH,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,wBACA,GAAA;AAAA,UAAC,cAAA;AAAA,UAAA;AAAA,YACC,OAAA;AAAA,YACA,OAAA;AAAA,YACA,UAAA;AAAA,YACA;AAAA;AAAA;AACF;AAAA;AAAA,GACF;AAEJ;AAOO,MAAM,GAAA,GAAM,CAAC,KAAA,KAAoB;AACtC,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,gBAAgB,KAAK,CAAA;AACpE,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,EAAA;AAAA,IACA,aAAA,EAAe,cAAA;AAAA,IACf,GAAG;AAAA,GACL,GAAI,YAAA;AACJ,EAAA,MAAM,EAAE,SAAA,EAAU,GAAI,cAAA,EAAe;AAErC,EAAA,uBACE,GAAA;AAAA,IAACC,KAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,SAAA,EAAW,KAAK,UAAA,CAAW,GAAA,EAAK,OAAO,UAAA,CAAW,GAAG,GAAG,SAAS,CAAA;AAAA,MACjE,GAAA,EAAK,CAAA,EAAA,KAAM,SAAA,CAAU,EAAA,EAAc,EAAoB,CAAA;AAAA,MACvD,IAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ;AAOO,MAAM,QAAA,GAAW,CAAC,KAAA,KAAyB;AAChD,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,gBAAgB,KAAK,CAAA;AACpE,EAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,GAAG,MAAK,GAAI,YAAA;AAEzC,EAAA,uBACE,GAAA;AAAA,IAACC,UAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,KAAK,UAAA,CAAW,KAAA,EAAO,OAAO,UAAA,CAAW,KAAK,GAAG,SAAS,CAAA;AAAA,MACpE,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ;;;;"}

package/dist/components/Tabs/TabsIndicators.esm.js

@@ -1,13 +1,14 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { TabListStateContext } from 'react-aria-components';
 import { useStyles } from '../../hooks/useStyles.esm.js';
+import { TabsDefinition } from './definition.esm.js';
 import { useContext, useRef, useCallback, useEffect } from 'react';
 import styles from './Tabs.module.css.esm.js';
 import clsx from 'clsx';
 
 const TabsIndicators = (props) => {
   const { tabRefs, tabsRef, hoveredKey, prevHoveredKey } = props;
-  const { classNames } = useStyles("Tabs");
+  const { classNames } = useStyles(TabsDefinition);
   const state = useContext(TabListStateContext);
   const prevSelectedKey = useRef(null);
   const updateCSSVariables = useCallback(() => {

package/dist/components/Tabs/TabsIndicators.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabsIndicators.esm.js","sources":["../../../src/components/Tabs/TabsIndicators.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 { TabListStateContext } from 'react-aria-components';\nimport { useStyles } from '../../hooks/useStyles';\nimport { useContext, useEffect, useCallback, useRef } from 'react';\nimport type { TabsIndicatorsProps } from './types';\nimport styles from './Tabs.module.css';\nimport clsx from 'clsx';\n\n/**\n * A component that renders the indicators for the toolbar.\n *\n * @internal\n */\nexport const TabsIndicators = (props: TabsIndicatorsProps) => {\n  const { tabRefs, tabsRef, hoveredKey, prevHoveredKey } = props;\n  const { classNames } = useStyles('Tabs');\n  const state = useContext(TabListStateContext);\n  const prevSelectedKey = useRef<string | null>(null);\n\n  const updateCSSVariables = useCallback(() => {\n    if (!tabsRef.current) return;\n\n    const tabsRect = tabsRef.current.getBoundingClientRect();\n\n    // Set active tab variables\n    if (state?.selectedKey) {\n      const activeTab = tabRefs.current.get(state.selectedKey.toString());\n\n      if (activeTab) {\n        const activeRect = activeTab.getBoundingClientRect();\n        const relativeLeft = activeRect.left - tabsRect.left;\n        const relativeTop = activeRect.top - tabsRect.top;\n\n        // Control transition timing based on whether this is the first time setting active tab\n        const isFirstActiveTab = prevSelectedKey.current === null;\n\n        if (isFirstActiveTab) {\n          // First time setting active tab: no transitions for position\n          tabsRef.current.style.setProperty(\n            '--active-transition-duration',\n            '0s',\n          );\n          // Enable transitions on next frame for future tab switches\n          requestAnimationFrame(() => {\n            if (tabsRef.current) {\n              tabsRef.current.style.setProperty(\n                '--active-transition-duration',\n                '0.25s',\n              );\n            }\n          });\n        } else {\n          // Switching between tabs: full transitions\n          tabsRef.current.style.setProperty(\n            '--active-transition-duration',\n            '0.25s',\n          );\n        }\n\n        // Update previous selected key for next time\n        prevSelectedKey.current = state.selectedKey.toString();\n\n        tabsRef.current.style.setProperty(\n          '--active-tab-left',\n          `${relativeLeft}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-right',\n          `${relativeLeft + activeRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-top',\n          `${relativeTop}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-bottom',\n          `${relativeTop + activeRect.height}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-width',\n          `${activeRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-height',\n          `${activeRect.height}px`,\n        );\n      }\n    }\n\n    // Set hovered tab variables\n    if (hoveredKey) {\n      const hoveredTab = tabRefs.current.get(hoveredKey);\n      if (hoveredTab) {\n        const hoveredRect = hoveredTab.getBoundingClientRect();\n        const relativeLeft = hoveredRect.left - tabsRect.left;\n        const relativeTop = hoveredRect.top - tabsRect.top;\n\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-left',\n          `${relativeLeft}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-right',\n          `${relativeLeft + hoveredRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-top',\n          `${relativeTop}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-bottom',\n          `${relativeTop + hoveredRect.height}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-width',\n          `${hoveredRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-height',\n          `${hoveredRect.height}px`,\n        );\n        // Control transition timing based on whether this is a new hover session\n        const isNewHoverSession = prevHoveredKey.current === null;\n\n        if (isNewHoverSession) {\n          // Starting new hover session: no transitions for position\n          tabsRef.current.style.setProperty(\n            '--hovered-transition-duration',\n            '0s',\n          );\n          // Enable transitions on next frame for future tab switches\n          requestAnimationFrame(() => {\n            if (tabsRef.current) {\n              tabsRef.current.style.setProperty(\n                '--hovered-transition-duration',\n                '0.2s',\n              );\n            }\n          });\n        } else {\n          // Moving between tabs in same session: full transitions\n          tabsRef.current.style.setProperty(\n            '--hovered-transition-duration',\n            '0.2s',\n          );\n        }\n\n        // Update previous hover key for next time\n        prevHoveredKey.current = hoveredKey;\n\n        tabsRef.current.style.setProperty('--hovered-tab-opacity', '1');\n      }\n    } else {\n      // When not hovering, hide with opacity and reset for next hover session\n      tabsRef.current.style.setProperty('--hovered-tab-opacity', '0');\n\n      // Reset previous hover key so next hover is treated as new session\n      prevHoveredKey.current = null;\n    }\n  }, [state?.selectedKey, hoveredKey, tabRefs.current]);\n\n  useEffect(() => {\n    updateCSSVariables();\n  }, [updateCSSVariables, tabRefs.current.size]);\n\n  useEffect(() => {\n    const handleResize = () => updateCSSVariables();\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [updateCSSVariables]);\n\n  return (\n    <>\n      <div\n        className={clsx(classNames.tabActive, styles[classNames.tabActive])}\n      />\n      <div\n        className={clsx(classNames.tabHovered, styles[classNames.tabHovered])}\n      />\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AA4BO,MAAM,cAAA,GAAiB,CAAC,KAAA,KAA+B;AAC5D,EAAA,MAAM,EAAE,OAAA,EAAS,OAAA,EAAS,UAAA,EAAY,gBAAe,GAAI,KAAA;AACzD,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,MAAM,CAAA;AACvC,EAAA,MAAM,KAAA,GAAQ,WAAW,mBAAmB,CAAA;AAC5C,EAAA,MAAM,eAAA,GAAkB,OAAsB,IAAI,CAAA;AAElD,EAAA,MAAM,kBAAA,GAAqB,YAAY,MAAM;AAC3C,IAAA,IAAI,CAAC,QAAQ,OAAA,EAAS;AAEtB,IAAA,MAAM,QAAA,GAAW,OAAA,CAAQ,OAAA,CAAQ,qBAAA,EAAsB;AAGvD,IAAA,IAAI,OAAO,WAAA,EAAa;AACtB,MAAA,MAAM,YAAY,OAAA,CAAQ,OAAA,CAAQ,IAAI,KAAA,CAAM,WAAA,CAAY,UAAU,CAAA;AAElE,MAAA,IAAI,SAAA,EAAW;AACb,QAAA,MAAM,UAAA,GAAa,UAAU,qBAAA,EAAsB;AACnD,QAAA,MAAM,YAAA,GAAe,UAAA,CAAW,IAAA,GAAO,QAAA,CAAS,IAAA;AAChD,QAAA,MAAM,WAAA,GAAc,UAAA,CAAW,GAAA,GAAM,QAAA,CAAS,GAAA;AAG9C,QAAA,MAAM,gBAAA,GAAmB,gBAAgB,OAAA,KAAY,IAAA;AAErD,QAAA,IAAI,gBAAA,EAAkB;AAEpB,UAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,YACpB,8BAAA;AAAA,YACA;AAAA,WACF;AAEA,UAAA,qBAAA,CAAsB,MAAM;AAC1B,YAAA,IAAI,QAAQ,OAAA,EAAS;AACnB,cAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,gBACpB,8BAAA;AAAA,gBACA;AAAA,eACF;AAAA,YACF;AAAA,UACF,CAAC,CAAA;AAAA,QACH,CAAA,MAAO;AAEL,UAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,YACpB,8BAAA;AAAA,YACA;AAAA,WACF;AAAA,QACF;AAGA,QAAA,eAAA,CAAgB,OAAA,GAAU,KAAA,CAAM,WAAA,CAAY,QAAA,EAAS;AAErD,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,mBAAA;AAAA,UACA,GAAG,YAAY,CAAA,EAAA;AAAA,SACjB;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,oBAAA;AAAA,UACA,CAAA,EAAG,YAAA,GAAe,UAAA,CAAW,KAAK,CAAA,EAAA;AAAA,SACpC;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,kBAAA;AAAA,UACA,GAAG,WAAW,CAAA,EAAA;AAAA,SAChB;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,qBAAA;AAAA,UACA,CAAA,EAAG,WAAA,GAAc,UAAA,CAAW,MAAM,CAAA,EAAA;AAAA,SACpC;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,oBAAA;AAAA,UACA,CAAA,EAAG,WAAW,KAAK,CAAA,EAAA;AAAA,SACrB;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,qBAAA;AAAA,UACA,CAAA,EAAG,WAAW,MAAM,CAAA,EAAA;AAAA,SACtB;AAAA,MACF;AAAA,IACF;AAGA,IAAA,IAAI,UAAA,EAAY;AACd,MAAA,MAAM,UAAA,GAAa,OAAA,CAAQ,OAAA,CAAQ,GAAA,CAAI,UAAU,CAAA;AACjD,MAAA,IAAI,UAAA,EAAY;AACd,QAAA,MAAM,WAAA,GAAc,WAAW,qBAAA,EAAsB;AACrD,QAAA,MAAM,YAAA,GAAe,WAAA,CAAY,IAAA,GAAO,QAAA,CAAS,IAAA;AACjD,QAAA,MAAM,WAAA,GAAc,WAAA,CAAY,GAAA,GAAM,QAAA,CAAS,GAAA;AAE/C,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,oBAAA;AAAA,UACA,GAAG,YAAY,CAAA,EAAA;AAAA,SACjB;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,qBAAA;AAAA,UACA,CAAA,EAAG,YAAA,GAAe,WAAA,CAAY,KAAK,CAAA,EAAA;AAAA,SACrC;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,mBAAA;AAAA,UACA,GAAG,WAAW,CAAA,EAAA;AAAA,SAChB;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,sBAAA;AAAA,UACA,CAAA,EAAG,WAAA,GAAc,WAAA,CAAY,MAAM,CAAA,EAAA;AAAA,SACrC;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,qBAAA;AAAA,UACA,CAAA,EAAG,YAAY,KAAK,CAAA,EAAA;AAAA,SACtB;AACA,QAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,UACpB,sBAAA;AAAA,UACA,CAAA,EAAG,YAAY,MAAM,CAAA,EAAA;AAAA,SACvB;AAEA,QAAA,MAAM,iBAAA,GAAoB,eAAe,OAAA,KAAY,IAAA;AAErD,QAAA,IAAI,iBAAA,EAAmB;AAErB,UAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,YACpB,+BAAA;AAAA,YACA;AAAA,WACF;AAEA,UAAA,qBAAA,CAAsB,MAAM;AAC1B,YAAA,IAAI,QAAQ,OAAA,EAAS;AACnB,cAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,gBACpB,+BAAA;AAAA,gBACA;AAAA,eACF;AAAA,YACF;AAAA,UACF,CAAC,CAAA;AAAA,QACH,CAAA,MAAO;AAEL,UAAA,OAAA,CAAQ,QAAQ,KAAA,CAAM,WAAA;AAAA,YACpB,+BAAA;AAAA,YACA;AAAA,WACF;AAAA,QACF;AAGA,QAAA,cAAA,CAAe,OAAA,GAAU,UAAA;AAEzB,QAAA,OAAA,CAAQ,OAAA,CAAQ,KAAA,CAAM,WAAA,CAAY,uBAAA,EAAyB,GAAG,CAAA;AAAA,MAChE;AAAA,IACF,CAAA,MAAO;AAEL,MAAA,OAAA,CAAQ,OAAA,CAAQ,KAAA,CAAM,WAAA,CAAY,uBAAA,EAAyB,GAAG,CAAA;AAG9D,MAAA,cAAA,CAAe,OAAA,GAAU,IAAA;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,KAAA,EAAO,aAAa,UAAA,EAAY,OAAA,CAAQ,OAAO,CAAC,CAAA;AAEpD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,kBAAA,EAAmB;AAAA,EACrB,GAAG,CAAC,kBAAA,EAAoB,OAAA,CAAQ,OAAA,CAAQ,IAAI,CAAC,CAAA;AAE7C,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,YAAA,GAAe,MAAM,kBAAA,EAAmB;AAC9C,IAAA,MAAA,CAAO,gBAAA,CAAiB,UAAU,YAAY,CAAA;AAC9C,IAAA,OAAO,MAAM,MAAA,CAAO,mBAAA,CAAoB,QAAA,EAAU,YAAY,CAAA;AAAA,EAChE,CAAA,EAAG,CAAC,kBAAkB,CAAC,CAAA;AAEvB,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,WAAW,IAAA,CAAK,UAAA,CAAW,WAAW,MAAA,CAAO,UAAA,CAAW,SAAS,CAAC;AAAA;AAAA,KACpE;AAAA,oBACA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,WAAW,IAAA,CAAK,UAAA,CAAW,YAAY,MAAA,CAAO,UAAA,CAAW,UAAU,CAAC;AAAA;AAAA;AACtE,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"TabsIndicators.esm.js","sources":["../../../src/components/Tabs/TabsIndicators.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 { TabListStateContext } from 'react-aria-components';\nimport { useStyles } from '../../hooks/useStyles';\nimport { TabsDefinition } from './definition';\nimport { useContext, useEffect, useCallback, useRef } from 'react';\nimport type { TabsIndicatorsProps } from './types';\nimport styles from './Tabs.module.css';\nimport clsx from 'clsx';\n\n/**\n * A component that renders the indicators for the toolbar.\n *\n * @internal\n */\nexport const TabsIndicators = (props: TabsIndicatorsProps) => {\n  const { tabRefs, tabsRef, hoveredKey, prevHoveredKey } = props;\n  const { classNames } = useStyles(TabsDefinition);\n  const state = useContext(TabListStateContext);\n  const prevSelectedKey = useRef<string | null>(null);\n\n  const updateCSSVariables = useCallback(() => {\n    if (!tabsRef.current) return;\n\n    const tabsRect = tabsRef.current.getBoundingClientRect();\n\n    // Set active tab variables\n    if (state?.selectedKey) {\n      const activeTab = tabRefs.current.get(state.selectedKey.toString());\n\n      if (activeTab) {\n        const activeRect = activeTab.getBoundingClientRect();\n        const relativeLeft = activeRect.left - tabsRect.left;\n        const relativeTop = activeRect.top - tabsRect.top;\n\n        // Control transition timing based on whether this is the first time setting active tab\n        const isFirstActiveTab = prevSelectedKey.current === null;\n\n        if (isFirstActiveTab) {\n          // First time setting active tab: no transitions for position\n          tabsRef.current.style.setProperty(\n            '--active-transition-duration',\n            '0s',\n          );\n          // Enable transitions on next frame for future tab switches\n          requestAnimationFrame(() => {\n            if (tabsRef.current) {\n              tabsRef.current.style.setProperty(\n                '--active-transition-duration',\n                '0.25s',\n              );\n            }\n          });\n        } else {\n          // Switching between tabs: full transitions\n          tabsRef.current.style.setProperty(\n            '--active-transition-duration',\n            '0.25s',\n          );\n        }\n\n        // Update previous selected key for next time\n        prevSelectedKey.current = state.selectedKey.toString();\n\n        tabsRef.current.style.setProperty(\n          '--active-tab-left',\n          `${relativeLeft}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-right',\n          `${relativeLeft + activeRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-top',\n          `${relativeTop}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-bottom',\n          `${relativeTop + activeRect.height}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-width',\n          `${activeRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--active-tab-height',\n          `${activeRect.height}px`,\n        );\n      }\n    }\n\n    // Set hovered tab variables\n    if (hoveredKey) {\n      const hoveredTab = tabRefs.current.get(hoveredKey);\n      if (hoveredTab) {\n        const hoveredRect = hoveredTab.getBoundingClientRect();\n        const relativeLeft = hoveredRect.left - tabsRect.left;\n        const relativeTop = hoveredRect.top - tabsRect.top;\n\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-left',\n          `${relativeLeft}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-right',\n          `${relativeLeft + hoveredRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-top',\n          `${relativeTop}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-bottom',\n          `${relativeTop + hoveredRect.height}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-width',\n          `${hoveredRect.width}px`,\n        );\n        tabsRef.current.style.setProperty(\n          '--hovered-tab-height',\n          `${hoveredRect.height}px`,\n        );\n        // Control transition timing based on whether this is a new hover session\n        const isNewHoverSession = prevHoveredKey.current === null;\n\n        if (isNewHoverSession) {\n          // Starting new hover session: no transitions for position\n          tabsRef.current.style.setProperty(\n            '--hovered-transition-duration',\n            '0s',\n          );\n          // Enable transitions on next frame for future tab switches\n          requestAnimationFrame(() => {\n            if (tabsRef.current) {\n              tabsRef.current.style.setProperty(\n                '--hovered-transition-duration',\n                '0.2s',\n              );\n            }\n          });\n        } else {\n          // Moving between tabs in same session: full transitions\n          tabsRef.current.style.setProperty(\n            '--hovered-transition-duration',\n            '0.2s',\n          );\n        }\n\n        // Update previous hover key for next time\n        prevHoveredKey.current = hoveredKey;\n\n        tabsRef.current.style.setProperty('--hovered-tab-opacity', '1');\n      }\n    } else {\n      // When not hovering, hide with opacity and reset for next hover session\n      tabsRef.current.style.setProperty('--hovered-tab-opacity', '0');\n\n      // Reset previous hover key so next hover is treated as new session\n      prevHoveredKey.current = null;\n    }\n  }, [state?.selectedKey, hoveredKey, tabRefs.current]);\n\n  useEffect(() => {\n    updateCSSVariables();\n  }, [updateCSSVariables, tabRefs.current.size]);\n\n  useEffect(() => {\n    const handleResize = () => updateCSSVariables();\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [updateCSSVariables]);\n\n  return (\n    <>\n      <div\n        className={clsx(classNames.tabActive, styles[classNames.tabActive])}\n      />\n      <div\n        className={clsx(classNames.tabHovered, styles[classNames.tabHovered])}\n      />\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,14 @@
+const TabsDefinition = {
+  classNames: {
+    tabs: "bui-Tabs",
+    tabList: "bui-TabList",
+    tabListWrapper: "bui-TabListWrapper",
+    tab: "bui-Tab",
+    tabActive: "bui-TabActive",
+    tabHovered: "bui-TabHovered",
+    panel: "bui-TabPanel"
+  }
+};
+
+export { TabsDefinition };
+//# sourceMappingURL=definition.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Tabs/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 type { ComponentDefinition } from '../../types';\n\n/**\n * Component definition for Tabs\n * @public\n */\nexport const TabsDefinition = {\n  classNames: {\n    tabs: 'bui-Tabs',\n    tabList: 'bui-TabList',\n    tabListWrapper: 'bui-TabListWrapper',\n    tab: 'bui-Tab',\n    tabActive: 'bui-TabActive',\n    tabHovered: 'bui-TabHovered',\n    panel: 'bui-TabPanel',\n  },\n} as const satisfies ComponentDefinition;\n"],"names":[],"mappings":"AAsBO,MAAM,cAAA,GAAiB;AAAA,EAC5B,UAAA,EAAY;AAAA,IACV,IAAA,EAAM,UAAA;AAAA,IACN,OAAA,EAAS,aAAA;AAAA,IACT,cAAA,EAAgB,oBAAA;AAAA,IAChB,GAAA,EAAK,SAAA;AAAA,IACL,SAAA,EAAW,eAAA;AAAA,IACX,UAAA,EAAY,gBAAA;AAAA,IACZ,KAAA,EAAO;AAAA;AAEX;;;;"}

package/dist/components/TagGroup/TagGroup.esm.js

@@ -3,12 +3,13 @@ import { TagGroup as TagGroup$1, TagList, Tag as Tag$1, Button, RouterProvider }
 import { RiCloseCircleLine } from '@remixicon/react';
 import clsx from 'clsx';
 import { useStyles } from '../../hooks/useStyles.esm.js';
+import { TagGroupDefinition } from './definition.esm.js';
 import { isExternalLink } from '../../utils/isExternalLink.esm.js';
 import { useNavigate, useHref } from 'react-router-dom';
 import styles from './TagGroup.module.css.esm.js';
 
 const TagGroup = (props) => {
-  const { classNames, cleanedProps } = useStyles("TagGroup", props);
+  const { classNames, cleanedProps } = useStyles(TagGroupDefinition, props);
   const { items, children, renderEmptyState, ...rest } = cleanedProps;
   return /* @__PURE__ */ jsx(
     TagGroup$1,
@@ -28,7 +29,7 @@ const TagGroup = (props) => {
   );
 };
 const Tag = (props) => {
-  const { classNames, cleanedProps } = useStyles("TagGroup", {
+  const { classNames, cleanedProps } = useStyles(TagGroupDefinition, {
     size: "small",
     ...props
   });

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

@@ -1 +1 @@
-{"version":3,"file":"TagGroup.esm.js","sources":["../../../src/components/TagGroup/TagGroup.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 { TagProps, TagGroupProps } from './types';\nimport {\n  TagGroup as ReactAriaTagGroup,\n  TagList as ReactAriaTagList,\n  Tag as ReactAriaTag,\n  Button as ReactAriaButton,\n  RouterProvider,\n} from 'react-aria-components';\nimport type { ReactNode } from 'react';\nimport { RiCloseCircleLine } from '@remixicon/react';\nimport clsx from 'clsx';\nimport { useStyles } from '../../hooks/useStyles';\nimport { isExternalLink } from '../../utils/isExternalLink';\nimport { useNavigate, useHref } from 'react-router-dom';\nimport styles from './TagGroup.module.css';\n\n/**\n * A component that renders a list of tags.\n *\n * @public\n */\nexport const TagGroup = <T extends object>(props: TagGroupProps<T>) => {\n  const { classNames, cleanedProps } = useStyles('TagGroup', props);\n  const { items, children, renderEmptyState, ...rest } = cleanedProps;\n\n  return (\n    <ReactAriaTagGroup\n      className={clsx(classNames.group, styles[classNames.group])}\n      {...rest}\n    >\n      <ReactAriaTagList\n        className={clsx(classNames.list, styles[classNames.list])}\n        items={items}\n        renderEmptyState={renderEmptyState}\n      >\n        {children}\n      </ReactAriaTagList>\n    </ReactAriaTagGroup>\n  );\n};\n\n/**\n * A component that renders a tag.\n *\n * @public\n */\nexport const Tag = (props: TagProps) => {\n  const { classNames, cleanedProps } = useStyles('TagGroup', {\n    size: 'small',\n    ...props,\n  });\n  const { children, className, icon, size, href, ...rest } = cleanedProps;\n  const textValue = typeof children === 'string' ? children : undefined;\n  const navigate = useNavigate();\n  const isLink = href !== undefined;\n  const isExternal = isExternalLink(href);\n\n  const content = (\n    <ReactAriaTag\n      textValue={textValue}\n      className={clsx(classNames.tag, styles[classNames.tag], className)}\n      data-size={size}\n      href={href}\n      {...rest}\n    >\n      {({ allowsRemoving }) => (\n        <>\n          {icon && (\n            <span\n              className={clsx(classNames.tagIcon, styles[classNames.tagIcon])}\n            >\n              {icon}\n            </span>\n          )}\n          {children as ReactNode}\n          {allowsRemoving && (\n            <ReactAriaButton\n              className={clsx(\n                classNames.tagRemoveButton,\n                styles[classNames.tagRemoveButton],\n              )}\n              slot=\"remove\"\n            >\n              <RiCloseCircleLine size={16} />\n            </ReactAriaButton>\n          )}\n        </>\n      )}\n    </ReactAriaTag>\n  );\n\n  if (isLink && !isExternal) {\n    return (\n      <RouterProvider navigate={navigate} useHref={useHref}>\n        {content}\n      </RouterProvider>\n    );\n  }\n\n  return content;\n};\n"],"names":["ReactAriaTagGroup","ReactAriaTagList","ReactAriaTag","ReactAriaButton"],"mappings":";;;;;;;;;AAqCO,MAAM,QAAA,GAAW,CAAmB,KAAA,KAA4B;AACrE,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,YAAY,KAAK,CAAA;AAChE,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,gBAAA,EAAkB,GAAG,MAAK,GAAI,YAAA;AAEvD,EAAA,uBACE,GAAA;AAAA,IAACA,UAAA;AAAA,IAAA;AAAA,MACC,WAAW,IAAA,CAAK,UAAA,CAAW,OAAO,MAAA,CAAO,UAAA,CAAW,KAAK,CAAC,CAAA;AAAA,MACzD,GAAG,IAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAACC,OAAA;AAAA,QAAA;AAAA,UACC,WAAW,IAAA,CAAK,UAAA,CAAW,MAAM,MAAA,CAAO,UAAA,CAAW,IAAI,CAAC,CAAA;AAAA,UACxD,KAAA;AAAA,UACA,gBAAA;AAAA,UAEC;AAAA;AAAA;AACH;AAAA,GACF;AAEJ;AAOO,MAAM,GAAA,GAAM,CAAC,KAAA,KAAoB;AACtC,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,UAAU,UAAA,EAAY;AAAA,IACzD,IAAA,EAAM,OAAA;AAAA,IACN,GAAG;AAAA,GACJ,CAAA;AACD,EAAA,MAAM,EAAE,UAAU,SAAA,EAAW,IAAA,EAAM,MAAM,IAAA,EAAM,GAAG,MAAK,GAAI,YAAA;AAC3D,EAAA,MAAM,SAAA,GAAY,OAAO,QAAA,KAAa,QAAA,GAAW,QAAA,GAAW,MAAA;AAC5D,EAAA,MAAM,WAAW,WAAA,EAAY;AAC7B,EAAA,MAAM,SAAS,IAAA,KAAS,MAAA;AACxB,EAAA,MAAM,UAAA,GAAa,eAAe,IAAI,CAAA;AAEtC,EAAA,MAAM,OAAA,mBACJ,GAAA;AAAA,IAACC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,SAAA,EAAW,KAAK,UAAA,CAAW,GAAA,EAAK,OAAO,UAAA,CAAW,GAAG,GAAG,SAAS,CAAA;AAAA,MACjE,WAAA,EAAW,IAAA;AAAA,MACX,IAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA,CAAC,EAAE,cAAA,EAAe,qBACjB,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,QAAA,IAAA,oBACC,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,WAAW,IAAA,CAAK,UAAA,CAAW,SAAS,MAAA,CAAO,UAAA,CAAW,OAAO,CAAC,CAAA;AAAA,YAE7D,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,QAED,QAAA;AAAA,QACA,cAAA,oBACC,GAAA;AAAA,UAACC,MAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,IAAA;AAAA,cACT,UAAA,CAAW,eAAA;AAAA,cACX,MAAA,CAAO,WAAW,eAAe;AAAA,aACnC;AAAA,YACA,IAAA,EAAK,QAAA;AAAA,YAEL,QAAA,kBAAA,GAAA,CAAC,iBAAA,EAAA,EAAkB,IAAA,EAAM,EAAA,EAAI;AAAA;AAAA;AAC/B,OAAA,EAEJ;AAAA;AAAA,GAEJ;AAGF,EAAA,IAAI,MAAA,IAAU,CAAC,UAAA,EAAY;AACzB,IAAA,uBACE,GAAA,CAAC,cAAA,EAAA,EAAe,QAAA,EAAoB,OAAA,EACjC,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,EAEJ;AAEA,EAAA,OAAO,OAAA;AACT;;;;"}
+{"version":3,"file":"TagGroup.esm.js","sources":["../../../src/components/TagGroup/TagGroup.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 { TagProps, TagGroupProps } from './types';\nimport {\n  TagGroup as ReactAriaTagGroup,\n  TagList as ReactAriaTagList,\n  Tag as ReactAriaTag,\n  Button as ReactAriaButton,\n  RouterProvider,\n} from 'react-aria-components';\nimport type { ReactNode } from 'react';\nimport { RiCloseCircleLine } from '@remixicon/react';\nimport clsx from 'clsx';\nimport { useStyles } from '../../hooks/useStyles';\nimport { TagGroupDefinition } from './definition';\nimport { isExternalLink } from '../../utils/isExternalLink';\nimport { useNavigate, useHref } from 'react-router-dom';\nimport styles from './TagGroup.module.css';\n\n/**\n * A component that renders a list of tags.\n *\n * @public\n */\nexport const TagGroup = <T extends object>(props: TagGroupProps<T>) => {\n  const { classNames, cleanedProps } = useStyles(TagGroupDefinition, props);\n  const { items, children, renderEmptyState, ...rest } = cleanedProps;\n\n  return (\n    <ReactAriaTagGroup\n      className={clsx(classNames.group, styles[classNames.group])}\n      {...rest}\n    >\n      <ReactAriaTagList\n        className={clsx(classNames.list, styles[classNames.list])}\n        items={items}\n        renderEmptyState={renderEmptyState}\n      >\n        {children}\n      </ReactAriaTagList>\n    </ReactAriaTagGroup>\n  );\n};\n\n/**\n * A component that renders a tag.\n *\n * @public\n */\nexport const Tag = (props: TagProps) => {\n  const { classNames, cleanedProps } = useStyles(TagGroupDefinition, {\n    size: 'small',\n    ...props,\n  });\n  const { children, className, icon, size, href, ...rest } = cleanedProps;\n  const textValue = typeof children === 'string' ? children : undefined;\n  const navigate = useNavigate();\n  const isLink = href !== undefined;\n  const isExternal = isExternalLink(href);\n\n  const content = (\n    <ReactAriaTag\n      textValue={textValue}\n      className={clsx(classNames.tag, styles[classNames.tag], className)}\n      data-size={size}\n      href={href}\n      {...rest}\n    >\n      {({ allowsRemoving }) => (\n        <>\n          {icon && (\n            <span\n              className={clsx(classNames.tagIcon, styles[classNames.tagIcon])}\n            >\n              {icon}\n            </span>\n          )}\n          {children as ReactNode}\n          {allowsRemoving && (\n            <ReactAriaButton\n              className={clsx(\n                classNames.tagRemoveButton,\n                styles[classNames.tagRemoveButton],\n              )}\n              slot=\"remove\"\n            >\n              <RiCloseCircleLine size={16} />\n            </ReactAriaButton>\n          )}\n        </>\n      )}\n    </ReactAriaTag>\n  );\n\n  if (isLink && !isExternal) {\n    return (\n      <RouterProvider navigate={navigate} useHref={useHref}>\n        {content}\n      </RouterProvider>\n    );\n  }\n\n  return content;\n};\n"],"names":["ReactAriaTagGroup","ReactAriaTagList","ReactAriaTag","ReactAriaButton"],"mappings":";;;;;;;;;;AAsCO,MAAM,QAAA,GAAW,CAAmB,KAAA,KAA4B;AACrE,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,oBAAoB,KAAK,CAAA;AACxE,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,gBAAA,EAAkB,GAAG,MAAK,GAAI,YAAA;AAEvD,EAAA,uBACE,GAAA;AAAA,IAACA,UAAA;AAAA,IAAA;AAAA,MACC,WAAW,IAAA,CAAK,UAAA,CAAW,OAAO,MAAA,CAAO,UAAA,CAAW,KAAK,CAAC,CAAA;AAAA,MACzD,GAAG,IAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAACC,OAAA;AAAA,QAAA;AAAA,UACC,WAAW,IAAA,CAAK,UAAA,CAAW,MAAM,MAAA,CAAO,UAAA,CAAW,IAAI,CAAC,CAAA;AAAA,UACxD,KAAA;AAAA,UACA,gBAAA;AAAA,UAEC;AAAA;AAAA;AACH;AAAA,GACF;AAEJ;AAOO,MAAM,GAAA,GAAM,CAAC,KAAA,KAAoB;AACtC,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,UAAU,kBAAA,EAAoB;AAAA,IACjE,IAAA,EAAM,OAAA;AAAA,IACN,GAAG;AAAA,GACJ,CAAA;AACD,EAAA,MAAM,EAAE,UAAU,SAAA,EAAW,IAAA,EAAM,MAAM,IAAA,EAAM,GAAG,MAAK,GAAI,YAAA;AAC3D,EAAA,MAAM,SAAA,GAAY,OAAO,QAAA,KAAa,QAAA,GAAW,QAAA,GAAW,MAAA;AAC5D,EAAA,MAAM,WAAW,WAAA,EAAY;AAC7B,EAAA,MAAM,SAAS,IAAA,KAAS,MAAA;AACxB,EAAA,MAAM,UAAA,GAAa,eAAe,IAAI,CAAA;AAEtC,EAAA,MAAM,OAAA,mBACJ,GAAA;AAAA,IAACC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,SAAA,EAAW,KAAK,UAAA,CAAW,GAAA,EAAK,OAAO,UAAA,CAAW,GAAG,GAAG,SAAS,CAAA;AAAA,MACjE,WAAA,EAAW,IAAA;AAAA,MACX,IAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA,CAAC,EAAE,cAAA,EAAe,qBACjB,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,QAAA,IAAA,oBACC,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,WAAW,IAAA,CAAK,UAAA,CAAW,SAAS,MAAA,CAAO,UAAA,CAAW,OAAO,CAAC,CAAA;AAAA,YAE7D,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,QAED,QAAA;AAAA,QACA,cAAA,oBACC,GAAA;AAAA,UAACC,MAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,IAAA;AAAA,cACT,UAAA,CAAW,eAAA;AAAA,cACX,MAAA,CAAO,WAAW,eAAe;AAAA,aACnC;AAAA,YACA,IAAA,EAAK,QAAA;AAAA,YAEL,QAAA,kBAAA,GAAA,CAAC,iBAAA,EAAA,EAAkB,IAAA,EAAM,EAAA,EAAI;AAAA;AAAA;AAC/B,OAAA,EAEJ;AAAA;AAAA,GAEJ;AAGF,EAAA,IAAI,MAAA,IAAU,CAAC,UAAA,EAAY;AACzB,IAAA,uBACE,GAAA,CAAC,cAAA,EAAA,EAAe,QAAA,EAAoB,OAAA,EACjC,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,EAEJ;AAEA,EAAA,OAAO,OAAA;AACT;;;;"}

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

@@ -0,0 +1,12 @@
+const TagGroupDefinition = {
+  classNames: {
+    group: "bui-TagGroup",
+    list: "bui-TagList",
+    tag: "bui-Tag",
+    tagIcon: "bui-TagIcon",
+    tagRemoveButton: "bui-TagRemoveButton"
+  }
+};
+
+export { TagGroupDefinition };
+//# sourceMappingURL=definition.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"definition.esm.js","sources":["../../../src/components/TagGroup/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 type { ComponentDefinition } from '../../types';\n\n/**\n * Component definition for TagGroup\n * @public\n */\nexport const TagGroupDefinition = {\n  classNames: {\n    group: 'bui-TagGroup',\n    list: 'bui-TagList',\n    tag: 'bui-Tag',\n    tagIcon: 'bui-TagIcon',\n    tagRemoveButton: 'bui-TagRemoveButton',\n  },\n} as const satisfies ComponentDefinition;\n"],"names":[],"mappings":"AAsBO,MAAM,kBAAA,GAAqB;AAAA,EAChC,UAAA,EAAY;AAAA,IACV,KAAA,EAAO,cAAA;AAAA,IACP,IAAA,EAAM,aAAA;AAAA,IACN,GAAA,EAAK,SAAA;AAAA,IACL,OAAA,EAAS,aAAA;AAAA,IACT,eAAA,EAAiB;AAAA;AAErB;;;;"}

package/dist/components/Text/Text.esm.js

@@ -3,15 +3,19 @@ import { forwardRef } from 'react';
 import clsx from 'clsx';
 import { useStyles } from '../../hooks/useStyles.esm.js';
 import styles from './Text.module.css.esm.js';
+import { TextDefinition } from './definition.esm.js';
 
 function TextComponent(props, ref) {
   const Component = props.as || "span";
-  const { classNames, dataAttributes, cleanedProps } = useStyles("Text", {
-    variant: "body-medium",
-    weight: "regular",
-    color: "primary",
-    ...props
-  });
+  const { classNames, dataAttributes, cleanedProps } = useStyles(
+    TextDefinition,
+    {
+      variant: "body-medium",
+      weight: "regular",
+      color: "primary",
+      ...props
+    }
+  );
   const { className, truncate, ...restProps } = cleanedProps;
   return /* @__PURE__ */ jsx(
     Component,

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

@@ -1 +1 @@
-{"version":3,"file":"Text.esm.js","sources":["../../../src/components/Text/Text.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 type { ElementType } from 'react';\nimport type { TextProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport styles from './Text.module.css';\n\nfunction TextComponent<T extends ElementType = 'span'>(\n  props: TextProps<T>,\n  ref: React.Ref<any>,\n) {\n  const Component = props.as || 'span';\n\n  const { classNames, dataAttributes, cleanedProps } = useStyles('Text', {\n    variant: 'body-medium',\n    weight: 'regular',\n    color: 'primary',\n    ...props,\n  });\n\n  const { className, truncate, ...restProps } = cleanedProps;\n\n  return (\n    <Component\n      ref={ref}\n      className={clsx(classNames.root, styles[classNames.root], className)}\n      {...dataAttributes}\n      {...restProps}\n    />\n  );\n}\n\nTextComponent.displayName = 'Text';\n\n/** @public */\nexport const Text = forwardRef(TextComponent) as {\n  <T extends ElementType = 'p'>(\n    props: TextProps<T> & { ref?: React.ComponentPropsWithRef<T>['ref'] },\n  ): React.ReactElement<TextProps<T>, T>;\n  displayName: string;\n};\n\nText.displayName = 'Text';\n"],"names":[],"mappings":";;;;;;AAuBA,SAAS,aAAA,CACP,OACA,GAAA,EACA;AACA,EAAA,MAAM,SAAA,GAAY,MAAM,EAAA,IAAM,MAAA;AAE9B,EAAA,MAAM,EAAE,UAAA,EAAY,cAAA,EAAgB,YAAA,EAAa,GAAI,UAAU,MAAA,EAAQ;AAAA,IACrE,OAAA,EAAS,aAAA;AAAA,IACT,MAAA,EAAQ,SAAA;AAAA,IACR,KAAA,EAAO,SAAA;AAAA,IACP,GAAG;AAAA,GACJ,CAAA;AAED,EAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,GAAG,WAAU,GAAI,YAAA;AAE9C,EAAA,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,KAAK,UAAA,CAAW,IAAA,EAAM,OAAO,UAAA,CAAW,IAAI,GAAG,SAAS,CAAA;AAAA,MAClE,GAAG,cAAA;AAAA,MACH,GAAG;AAAA;AAAA,GACN;AAEJ;AAEA,aAAA,CAAc,WAAA,GAAc,MAAA;AAGrB,MAAM,IAAA,GAAO,WAAW,aAAa;AAO5C,IAAA,CAAK,WAAA,GAAc,MAAA;;;;"}
+{"version":3,"file":"Text.esm.js","sources":["../../../src/components/Text/Text.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 type { ElementType } from 'react';\nimport type { TextProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport styles from './Text.module.css';\nimport { TextDefinition } from './definition';\n\nfunction TextComponent<T extends ElementType = 'span'>(\n  props: TextProps<T>,\n  ref: React.Ref<any>,\n) {\n  const Component = props.as || 'span';\n\n  const { classNames, dataAttributes, cleanedProps } = useStyles(\n    TextDefinition,\n    {\n      variant: 'body-medium',\n      weight: 'regular',\n      color: 'primary',\n      ...props,\n    },\n  );\n\n  const { className, truncate, ...restProps } = cleanedProps;\n\n  return (\n    <Component\n      ref={ref}\n      className={clsx(classNames.root, styles[classNames.root], className)}\n      {...dataAttributes}\n      {...restProps}\n    />\n  );\n}\n\nTextComponent.displayName = 'Text';\n\n/** @public */\nexport const Text = forwardRef(TextComponent) as {\n  <T extends ElementType = 'p'>(\n    props: TextProps<T> & { ref?: React.ComponentPropsWithRef<T>['ref'] },\n  ): React.ReactElement<TextProps<T>, T>;\n  displayName: string;\n};\n\nText.displayName = 'Text';\n"],"names":[],"mappings":";;;;;;;AAwBA,SAAS,aAAA,CACP,OACA,GAAA,EACA;AACA,EAAA,MAAM,SAAA,GAAY,MAAM,EAAA,IAAM,MAAA;AAE9B,EAAA,MAAM,EAAE,UAAA,EAAY,cAAA,EAAgB,YAAA,EAAa,GAAI,SAAA;AAAA,IACnD,cAAA;AAAA,IACA;AAAA,MACE,OAAA,EAAS,aAAA;AAAA,MACT,MAAA,EAAQ,SAAA;AAAA,MACR,KAAA,EAAO,SAAA;AAAA,MACP,GAAG;AAAA;AACL,GACF;AAEA,EAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,GAAG,WAAU,GAAI,YAAA;AAE9C,EAAA,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,KAAK,UAAA,CAAW,IAAA,EAAM,OAAO,UAAA,CAAW,IAAI,GAAG,SAAS,CAAA;AAAA,MAClE,GAAG,cAAA;AAAA,MACH,GAAG;AAAA;AAAA,GACN;AAEJ;AAEA,aAAA,CAAc,WAAA,GAAc,MAAA;AAGrB,MAAM,IAAA,GAAO,WAAW,aAAa;AAO5C,IAAA,CAAK,WAAA,GAAc,MAAA;;;;"}

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

@@ -0,0 +1,14 @@
+const TextDefinition = {
+  classNames: {
+    root: "bui-Text"
+  },
+  dataAttributes: {
+    variant: ["subtitle", "body", "caption", "label"],
+    weight: ["regular", "bold"],
+    color: ["primary", "secondary", "danger", "warning", "success"],
+    truncate: [true, false]
+  }
+};
+
+export { TextDefinition };
+//# sourceMappingURL=definition.esm.js.map