@backstage/ui 0.0.0-nightly-20250722024836

package/dist/components/Avatar/Avatar.esm.js

@@ -0,0 +1,29 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Avatar as Avatar$1 } from '@base-ui-components/react/avatar';
+import clsx from 'clsx';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const Avatar = forwardRef((props, ref) => {
+  const { className, src, name, size = "medium", ...rest } = props;
+  const { classNames } = useStyles("Avatar", {
+    size
+  });
+  return /* @__PURE__ */ jsxs(
+    Avatar$1.Root,
+    {
+      ref,
+      className: clsx(classNames.root, className),
+      "data-size": size,
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsx(Avatar$1.Image, { className: classNames.image, src }),
+        /* @__PURE__ */ jsx(Avatar$1.Fallback, { className: classNames.fallback, children: (name || "").split(" ").map((word) => word[0]).join("").toLocaleUpperCase("en-US").slice(0, 2) })
+      ]
+    }
+  );
+});
+Avatar.displayName = Avatar$1.Root.displayName;
+
+export { Avatar };
+//# sourceMappingURL=Avatar.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.esm.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, ElementRef } from 'react';\nimport { Avatar as AvatarPrimitive } from '@base-ui-components/react/avatar';\nimport clsx from 'clsx';\nimport { AvatarProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const Avatar = forwardRef<\n  ElementRef<typeof AvatarPrimitive.Root>,\n  AvatarProps\n>((props, ref) => {\n  const { className, src, name, size = 'medium', ...rest } = props;\n  const { classNames } = useStyles('Avatar', {\n    size,\n  });\n\n  return (\n    <AvatarPrimitive.Root\n      ref={ref}\n      className={clsx(classNames.root, className)}\n      data-size={size}\n      {...rest}\n    >\n      <AvatarPrimitive.Image className={classNames.image} src={src} />\n      <AvatarPrimitive.Fallback className={classNames.fallback}>\n        {(name || '')\n          .split(' ')\n          .map(word => word[0])\n          .join('')\n          .toLocaleUpperCase('en-US')\n          .slice(0, 2)}\n      </AvatarPrimitive.Fallback>\n    </AvatarPrimitive.Root>\n  );\n});\n\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n"],"names":["AvatarPrimitive"],"mappings":";;;;;;AAuBO,MAAM,MAAS,GAAA,UAAA,CAGpB,CAAC,KAAA,EAAO,GAAQ,KAAA;AAChB,EAAM,MAAA,EAAE,WAAW,GAAK,EAAA,IAAA,EAAM,OAAO,QAAU,EAAA,GAAG,MAAS,GAAA,KAAA;AAC3D,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,QAAU,EAAA;AAAA,IACzC;AAAA,GACD,CAAA;AAED,EACE,uBAAA,IAAA;AAAA,IAACA,QAAgB,CAAA,IAAA;AAAA,IAAhB;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,MAC1C,WAAW,EAAA,IAAA;AAAA,MACV,GAAG,IAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA,CAACA,SAAgB,KAAhB,EAAA,EAAsB,SAAW,EAAA,UAAA,CAAW,OAAO,GAAU,EAAA,CAAA;AAAA,wBAC9D,GAAA,CAACA,QAAgB,CAAA,QAAA,EAAhB,EAAyB,SAAA,EAAW,UAAW,CAAA,QAAA,EAC5C,QAAQ,EAAA,CAAA,IAAA,IAAA,EAAA,EACP,KAAM,CAAA,GAAG,CACT,CAAA,GAAA,CAAI,CAAQ,IAAA,KAAA,IAAA,CAAK,CAAC,CAAC,CACnB,CAAA,IAAA,CAAK,EAAE,CAAA,CACP,iBAAkB,CAAA,OAAO,CACzB,CAAA,KAAA,CAAM,CAAG,EAAA,CAAC,CACf,EAAA;AAAA;AAAA;AAAA,GACF;AAEJ,CAAC;AAED,MAAO,CAAA,WAAA,GAAcA,SAAgB,IAAK,CAAA,WAAA;;;;"}

package/dist/components/Box/Box.esm.js

@@ -0,0 +1,34 @@
+import { forwardRef, createElement } from 'react';
+import clsx from 'clsx';
+import { extractProps } from '../../utils/extractProps.esm.js';
+import { spacingPropDefs } from '../../props/spacing.props.esm.js';
+import { boxPropDefs } from './Box.props.esm.js';
+import { widthPropDefs } from '../../props/width.props.esm.js';
+import { heightPropDefs } from '../../props/height.props.esm.js';
+import { positionPropDefs } from '../../props/position.props.esm.js';
+import { displayPropDefs } from '../../props/display.props.esm.js';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const Box = forwardRef((props, ref) => {
+  const { children } = props;
+  const propDefs = {
+    ...spacingPropDefs,
+    ...widthPropDefs,
+    ...heightPropDefs,
+    ...positionPropDefs,
+    ...displayPropDefs,
+    ...boxPropDefs
+  };
+  const { classNames } = useStyles("Box");
+  const { className, style } = extractProps(props, propDefs);
+  return createElement(props.as || "div", {
+    ref,
+    className: clsx(classNames.root, className),
+    style,
+    children
+  });
+});
+Box.displayName = "Box";
+
+export { Box };
+//# sourceMappingURL=Box.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Box.esm.js","sources":["../../../src/components/Box/Box.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { createElement, forwardRef } from 'react';\nimport { BoxProps } from './types';\nimport clsx from 'clsx';\nimport { extractProps } from '../../utils/extractProps';\nimport { spacingPropDefs } from '../../props/spacing.props';\nimport { boxPropDefs } from './Box.props';\nimport { widthPropDefs } from '../../props/width.props';\nimport { heightPropDefs } from '../../props/height.props';\nimport { positionPropDefs } from '../../props/position.props';\nimport { displayPropDefs } from '../../props/display.props';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const Box = forwardRef<HTMLDivElement, BoxProps>((props, ref) => {\n  const { children } = props;\n\n  const propDefs = {\n    ...spacingPropDefs,\n    ...widthPropDefs,\n    ...heightPropDefs,\n    ...positionPropDefs,\n    ...displayPropDefs,\n    ...boxPropDefs,\n  };\n\n  const { classNames } = useStyles('Box');\n  const { className, style } = extractProps(props, propDefs);\n\n  return createElement(props.as || 'div', {\n    ref,\n    className: clsx(classNames.root, className),\n    style,\n    children,\n  });\n});\n\nBox.displayName = 'Box';\n"],"names":[],"mappings":";;;;;;;;;;;AA6BO,MAAM,GAAM,GAAA,UAAA,CAAqC,CAAC,KAAA,EAAO,GAAQ,KAAA;AACtE,EAAM,MAAA,EAAE,UAAa,GAAA,KAAA;AAErB,EAAA,MAAM,QAAW,GAAA;AAAA,IACf,GAAG,eAAA;AAAA,IACH,GAAG,aAAA;AAAA,IACH,GAAG,cAAA;AAAA,IACH,GAAG,gBAAA;AAAA,IACH,GAAG,eAAA;AAAA,IACH,GAAG;AAAA,GACL;AAEA,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,KAAK,CAAA;AACtC,EAAA,MAAM,EAAE,SAAW,EAAA,KAAA,EAAU,GAAA,YAAA,CAAa,OAAO,QAAQ,CAAA;AAEzD,EAAO,OAAA,aAAA,CAAc,KAAM,CAAA,EAAA,IAAM,KAAO,EAAA;AAAA,IACtC,GAAA;AAAA,IACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,IAC1C,KAAA;AAAA,IACA;AAAA,GACD,CAAA;AACH,CAAC;AAED,GAAA,CAAI,WAAc,GAAA,KAAA;;;;"}

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

@@ -0,0 +1,7 @@
+const as = ["div", "span"];
+const boxPropDefs = {
+  as: { type: "enum", values: as, default: "div" }
+};
+
+export { boxPropDefs };
+//# sourceMappingURL=Box.props.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Box.props.esm.js","sources":["../../../src/components/Box/Box.props.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { PropDef, GetPropDefTypes } from '../../props/prop-def';\n\nconst as = ['div', 'span'] as const;\n\n/** @public */\nconst boxPropDefs = {\n  as: { type: 'enum', values: as, default: 'div' },\n} satisfies {\n  as: PropDef<(typeof as)[number]>;\n};\n\n// Use all of the imported prop defs to ensure that JSDoc works\n/** @public */\ntype BoxOwnProps = GetPropDefTypes<typeof boxPropDefs>;\n\nexport { boxPropDefs };\nexport type { BoxOwnProps };\n"],"names":[],"mappings":"AAkBA,MAAM,EAAA,GAAK,CAAC,KAAA,EAAO,MAAM,CAAA;AAGzB,MAAM,WAAc,GAAA;AAAA,EAClB,IAAI,EAAE,IAAA,EAAM,QAAQ,MAAQ,EAAA,EAAA,EAAI,SAAS,KAAM;AACjD;;;;"}

package/dist/components/Button/Button.esm.js

@@ -0,0 +1,41 @@
+import { jsxs } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { Button as Button$1 } from 'react-aria-components';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const Button = forwardRef(
+  (props, ref) => {
+    const {
+      size = "small",
+      variant = "primary",
+      iconStart,
+      iconEnd,
+      children,
+      className,
+      ...rest
+    } = props;
+    const { classNames, dataAttributes } = useStyles("Button", {
+      size,
+      variant
+    });
+    return /* @__PURE__ */ jsxs(
+      Button$1,
+      {
+        className: clsx(classNames.root, className),
+        ref,
+        ...dataAttributes,
+        ...rest,
+        children: [
+          iconStart,
+          children,
+          iconEnd
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+export { Button };
+//# sourceMappingURL=Button.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.esm.js","sources":["../../../src/components/Button/Button.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 clsx from 'clsx';\nimport { forwardRef, Ref } from 'react';\nimport { Button as RAButton } from 'react-aria-components';\nimport type { ButtonProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const Button = forwardRef(\n  (props: ButtonProps, ref: Ref<HTMLButtonElement>) => {\n    const {\n      size = 'small',\n      variant = 'primary',\n      iconStart,\n      iconEnd,\n      children,\n      className,\n      ...rest\n    } = props;\n\n    const { classNames, dataAttributes } = useStyles('Button', {\n      size,\n      variant,\n    });\n\n    return (\n      <RAButton\n        className={clsx(classNames.root, className)}\n        ref={ref}\n        {...dataAttributes}\n        {...rest}\n      >\n        {iconStart}\n        {children}\n        {iconEnd}\n      </RAButton>\n    );\n  },\n);\n\nButton.displayName = 'Button';\n"],"names":["RAButton"],"mappings":";;;;;;AAuBO,MAAM,MAAS,GAAA,UAAA;AAAA,EACpB,CAAC,OAAoB,GAAgC,KAAA;AACnD,IAAM,MAAA;AAAA,MACJ,IAAO,GAAA,OAAA;AAAA,MACP,OAAU,GAAA,SAAA;AAAA,MACV,SAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,KAAA;AAEJ,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,UAAU,QAAU,EAAA;AAAA,MACzD,IAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IACE,uBAAA,IAAA;AAAA,MAACA,QAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,QAC1C,GAAA;AAAA,QACC,GAAG,cAAA;AAAA,QACH,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,SAAA;AAAA,UACA,QAAA;AAAA,UACA;AAAA;AAAA;AAAA,KACH;AAAA;AAGN;AAEA,MAAA,CAAO,WAAc,GAAA,QAAA;;;;"}

package/dist/components/ButtonIcon/ButtonIcon.esm.js

@@ -0,0 +1,37 @@
+import { jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { Button } from 'react-aria-components';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const ButtonIcon = forwardRef(
+  (props, ref) => {
+    const {
+      size = "small",
+      variant = "primary",
+      icon,
+      className,
+      style,
+      ...rest
+    } = props;
+    const { classNames, dataAttributes } = useStyles("Button", {
+      size,
+      variant
+    });
+    const { classNames: classNamesButtonIcon } = useStyles("ButtonIcon");
+    return /* @__PURE__ */ jsx(
+      Button,
+      {
+        className: clsx(classNames.root, classNamesButtonIcon.root, className),
+        ref,
+        ...dataAttributes,
+        ...rest,
+        children: icon
+      }
+    );
+  }
+);
+ButtonIcon.displayName = "ButtonIcon";
+
+export { ButtonIcon };
+//# sourceMappingURL=ButtonIcon.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.esm.js","sources":["../../../src/components/ButtonIcon/ButtonIcon.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 clsx from 'clsx';\nimport { forwardRef, Ref } from 'react';\nimport { Button as RAButton } from 'react-aria-components';\nimport type { ButtonIconProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const ButtonIcon = forwardRef(\n  (props: ButtonIconProps, ref: Ref<HTMLButtonElement>) => {\n    const {\n      size = 'small',\n      variant = 'primary',\n      icon,\n      className,\n      style,\n      ...rest\n    } = props;\n\n    const { classNames, dataAttributes } = useStyles('Button', {\n      size,\n      variant,\n    });\n\n    const { classNames: classNamesButtonIcon } = useStyles('ButtonIcon');\n\n    return (\n      <RAButton\n        className={clsx(classNames.root, classNamesButtonIcon.root, className)}\n        ref={ref}\n        {...dataAttributes}\n        {...rest}\n      >\n        {icon}\n      </RAButton>\n    );\n  },\n);\n\nButtonIcon.displayName = 'ButtonIcon';\n"],"names":["RAButton"],"mappings":";;;;;;AAuBO,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,CAAC,OAAwB,GAAgC,KAAA;AACvD,IAAM,MAAA;AAAA,MACJ,IAAO,GAAA,OAAA;AAAA,MACP,OAAU,GAAA,SAAA;AAAA,MACV,IAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,KAAA;AAEJ,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,UAAU,QAAU,EAAA;AAAA,MACzD,IAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAY,oBAAqB,EAAA,GAAI,UAAU,YAAY,CAAA;AAEnE,IACE,uBAAA,GAAA;AAAA,MAACA,MAAA;AAAA,MAAA;AAAA,QACC,WAAW,IAAK,CAAA,UAAA,CAAW,IAAM,EAAA,oBAAA,CAAqB,MAAM,SAAS,CAAA;AAAA,QACrE,GAAA;AAAA,QACC,GAAG,cAAA;AAAA,QACH,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA;AAAA,KACH;AAAA;AAGN;AAEA,UAAA,CAAW,WAAc,GAAA,YAAA;;;;"}

package/dist/components/ButtonLink/ButtonLink.esm.js

@@ -0,0 +1,42 @@
+import { jsxs } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import { forwardRef } from 'react';
+import { Link } from 'react-aria-components';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const ButtonLink = forwardRef(
+  (props, ref) => {
+    const {
+      size = "small",
+      variant = "primary",
+      iconStart,
+      iconEnd,
+      children,
+      className,
+      ...rest
+    } = props;
+    const { classNames, dataAttributes } = useStyles("Button", {
+      size,
+      variant
+    });
+    const { classNames: classNamesButtonLink } = useStyles("ButtonLink");
+    return /* @__PURE__ */ jsxs(
+      Link,
+      {
+        className: clsx(classNames.root, classNamesButtonLink.root, className),
+        ref,
+        ...dataAttributes,
+        ...rest,
+        children: [
+          iconStart,
+          children,
+          iconEnd
+        ]
+      }
+    );
+  }
+);
+ButtonLink.displayName = "ButtonLink";
+
+export { ButtonLink };
+//# sourceMappingURL=ButtonLink.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonLink.esm.js","sources":["../../../src/components/ButtonLink/ButtonLink.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 clsx from 'clsx';\nimport { forwardRef, Ref } from 'react';\nimport { Link as RALink } from 'react-aria-components';\nimport type { ButtonLinkProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const ButtonLink = forwardRef(\n  (props: ButtonLinkProps, ref: Ref<HTMLAnchorElement>) => {\n    const {\n      size = 'small',\n      variant = 'primary',\n      iconStart,\n      iconEnd,\n      children,\n      className,\n      ...rest\n    } = props;\n\n    const { classNames, dataAttributes } = useStyles('Button', {\n      size,\n      variant,\n    });\n\n    const { classNames: classNamesButtonLink } = useStyles('ButtonLink');\n\n    return (\n      <RALink\n        className={clsx(classNames.root, classNamesButtonLink.root, className)}\n        ref={ref}\n        {...dataAttributes}\n        {...rest}\n      >\n        {iconStart}\n        {children}\n        {iconEnd}\n      </RALink>\n    );\n  },\n);\n\nButtonLink.displayName = 'ButtonLink';\n"],"names":["RALink"],"mappings":";;;;;;AAuBO,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,CAAC,OAAwB,GAAgC,KAAA;AACvD,IAAM,MAAA;AAAA,MACJ,IAAO,GAAA,OAAA;AAAA,MACP,OAAU,GAAA,SAAA;AAAA,MACV,SAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,KAAA;AAEJ,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,UAAU,QAAU,EAAA;AAAA,MACzD,IAAA;AAAA,MACA;AAAA,KACD,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAY,oBAAqB,EAAA,GAAI,UAAU,YAAY,CAAA;AAEnE,IACE,uBAAA,IAAA;AAAA,MAACA,IAAA;AAAA,MAAA;AAAA,QACC,WAAW,IAAK,CAAA,UAAA,CAAW,IAAM,EAAA,oBAAA,CAAqB,MAAM,SAAS,CAAA;AAAA,QACrE,GAAA;AAAA,QACC,GAAG,cAAA;AAAA,QACH,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,SAAA;AAAA,UACA,QAAA;AAAA,UACA;AAAA;AAAA;AAAA,KACH;AAAA;AAGN;AAEA,UAAA,CAAW,WAAc,GAAA,YAAA;;;;"}

package/dist/components/Card/Card.esm.js

@@ -0,0 +1,53 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { ScrollArea } from '../ScrollArea/ScrollArea.esm.js';
+import clsx from 'clsx';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const Card = forwardRef((props, ref) => {
+  const { className, ...rest } = props;
+  const { classNames } = useStyles("Card");
+  return /* @__PURE__ */ jsx("div", { ref, className: clsx(classNames.root, className), ...rest });
+});
+forwardRef(
+  (props, ref) => {
+    const { className, ...rest } = props;
+    const { classNames } = useStyles("Card");
+    return /* @__PURE__ */ jsx("div", { ref, className: clsx(classNames.header, className), ...rest });
+  }
+);
+forwardRef(
+  (props, ref) => {
+    const { children, className, ...rest } = props;
+    const { classNames } = useStyles("Card");
+    return /* @__PURE__ */ jsxs(
+      ScrollArea.Root,
+      {
+        ref,
+        className: clsx(classNames.body, className),
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsx(ScrollArea.Viewport, { style: { paddingInline: "var(--bui-space-3)" }, children }),
+          /* @__PURE__ */ jsx(
+            ScrollArea.Scrollbar,
+            {
+              orientation: "vertical",
+              style: { margin: "0 0.25rem" },
+              children: /* @__PURE__ */ jsx(ScrollArea.Thumb, {})
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+forwardRef(
+  (props, ref) => {
+    const { className, ...rest } = props;
+    const { classNames } = useStyles("Card");
+    return /* @__PURE__ */ jsx("div", { ref, className: clsx(classNames.footer, className), ...rest });
+  }
+);
+
+export { Card };
+//# sourceMappingURL=Card.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Card.esm.js","sources":["../../../src/components/Card/Card.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 { ScrollArea } from '../ScrollArea';\nimport clsx from 'clsx';\nimport { useStyles } from '../../hooks/useStyles';\nimport type {\n  CardProps,\n  CardHeaderProps,\n  CardBodyProps,\n  CardFooterProps,\n} from './types';\n\n/**\n * Card component.\n *\n * @public\n */\nexport const Card = forwardRef<HTMLDivElement, CardProps>((props, ref) => {\n  const { className, ...rest } = props;\n  const { classNames } = useStyles('Card');\n\n  return (\n    <div ref={ref} className={clsx(classNames.root, className)} {...rest} />\n  );\n});\n\n/**\n * CardHeader component.\n *\n * @public\n */\nexport const CardHeader = forwardRef<HTMLDivElement, CardHeaderProps>(\n  (props, ref) => {\n    const { className, ...rest } = props;\n    const { classNames } = useStyles('Card');\n\n    return (\n      <div ref={ref} className={clsx(classNames.header, className)} {...rest} />\n    );\n  },\n);\n\n/**\n * CardBody component.\n *\n * @public\n */\nexport const CardBody = forwardRef<HTMLDivElement, CardBodyProps>(\n  (props, ref) => {\n    const { children, className, ...rest } = props;\n    const { classNames } = useStyles('Card');\n\n    return (\n      <ScrollArea.Root\n        ref={ref}\n        className={clsx(classNames.body, className)}\n        {...rest}\n      >\n        <ScrollArea.Viewport style={{ paddingInline: 'var(--bui-space-3)' }}>\n          {children}\n        </ScrollArea.Viewport>\n        <ScrollArea.Scrollbar\n          orientation=\"vertical\"\n          style={{ margin: '0 0.25rem' }}\n        >\n          <ScrollArea.Thumb />\n        </ScrollArea.Scrollbar>\n      </ScrollArea.Root>\n    );\n  },\n);\n\n/**\n * CardFooter component.\n *\n * @public\n */\nexport const CardFooter = forwardRef<HTMLDivElement, CardFooterProps>(\n  (props, ref) => {\n    const { className, ...rest } = props;\n    const { classNames } = useStyles('Card');\n\n    return (\n      <div ref={ref} className={clsx(classNames.footer, className)} {...rest} />\n    );\n  },\n);\n"],"names":[],"mappings":";;;;;;AAgCO,MAAM,IAAO,GAAA,UAAA,CAAsC,CAAC,KAAA,EAAO,GAAQ,KAAA;AACxE,EAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAC/B,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,MAAM,CAAA;AAEvC,EACE,uBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,GAAA,EAAU,SAAW,EAAA,IAAA,CAAK,WAAW,IAAM,EAAA,SAAS,CAAI,EAAA,GAAG,IAAM,EAAA,CAAA;AAE1E,CAAC;AAOyB,UAAA;AAAA,EACxB,CAAC,OAAO,GAAQ,KAAA;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAC/B,IAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,MAAM,CAAA;AAEvC,IACE,uBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,GAAA,EAAU,SAAW,EAAA,IAAA,CAAK,WAAW,MAAQ,EAAA,SAAS,CAAI,EAAA,GAAG,IAAM,EAAA,CAAA;AAAA;AAG9E;AAOwB,UAAA;AAAA,EACtB,CAAC,OAAO,GAAQ,KAAA;AACd,IAAA,MAAM,EAAE,QAAA,EAAU,SAAW,EAAA,GAAG,MAAS,GAAA,KAAA;AACzC,IAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,MAAM,CAAA;AAEvC,IACE,uBAAA,IAAA;AAAA,MAAC,UAAW,CAAA,IAAA;AAAA,MAAX;AAAA,QACC,GAAA;AAAA,QACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,QACzC,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,UAAA,CAAW,UAAX,EAAoB,KAAA,EAAO,EAAE,aAAe,EAAA,oBAAA,IAC1C,QACH,EAAA,CAAA;AAAA,0BACA,GAAA;AAAA,YAAC,UAAW,CAAA,SAAA;AAAA,YAAX;AAAA,cACC,WAAY,EAAA,UAAA;AAAA,cACZ,KAAA,EAAO,EAAE,MAAA,EAAQ,WAAY,EAAA;AAAA,cAE7B,QAAA,kBAAA,GAAA,CAAC,UAAW,CAAA,KAAA,EAAX,EAAiB;AAAA;AAAA;AACpB;AAAA;AAAA,KACF;AAAA;AAGN;AAO0B,UAAA;AAAA,EACxB,CAAC,OAAO,GAAQ,KAAA;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAC/B,IAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,MAAM,CAAA;AAEvC,IACE,uBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,GAAA,EAAU,SAAW,EAAA,IAAA,CAAK,WAAW,MAAQ,EAAA,SAAS,CAAI,EAAA,GAAG,IAAM,EAAA,CAAA;AAAA;AAG9E;;;;"}

package/dist/components/Checkbox/Checkbox.esm.js

@@ -0,0 +1,74 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Checkbox as Checkbox$1 } from '@base-ui-components/react/checkbox';
+import '../Icon/context.esm.js';
+import '../Box/Box.esm.js';
+import '../Grid/Grid.esm.js';
+import '../Flex/Flex.esm.js';
+import '../Container/Container.esm.js';
+import '../Text/Text.esm.js';
+import '../Heading/Heading.esm.js';
+import '../Avatar/Avatar.esm.js';
+import '../Button/Button.esm.js';
+import '../Card/Card.esm.js';
+import '../Collapsible/Collapsible.esm.js';
+import '../DataTable/DataTable.esm.js';
+import '../FieldLabel/FieldLabel.esm.js';
+import 'react-aria-components';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+import '@remixicon/react';
+import '../ButtonIcon/ButtonIcon.esm.js';
+import '../Menu/Menu.esm.js';
+import 'motion/react';
+import '../Tabs/Tabs.esm.js';
+import { Icon } from '../Icon/Icon.esm.js';
+import '../ButtonLink/ButtonLink.esm.js';
+import '../RadioGroup/RadioGroup.esm.js';
+import '../Table/Table.esm.js';
+import '../TextField/TextField.esm.js';
+import '../Tooltip/Tooltip.esm.js';
+import '../ScrollArea/ScrollArea.esm.js';
+import '../SearchField/SearchField.esm.js';
+import '../Link/Link.esm.js';
+import '../Select/Select.esm.js';
+import '../Switch/Switch.esm.js';
+import clsx from 'clsx';
+
+const Checkbox = forwardRef(
+  (props, ref) => {
+    const {
+      label,
+      checked,
+      onChange,
+      disabled,
+      required,
+      className,
+      name,
+      value,
+      style
+    } = props;
+    const { classNames } = useStyles("Checkbox");
+    const checkboxElement = /* @__PURE__ */ jsx(
+      Checkbox$1.Root,
+      {
+        ref,
+        className: clsx(classNames.root, className),
+        checked,
+        onCheckedChange: onChange,
+        disabled,
+        required,
+        name,
+        value,
+        style,
+        children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, { className: classNames.indicator, children: /* @__PURE__ */ jsx(Icon, { name: "check", size: 12 }) })
+      }
+    );
+    return label ? /* @__PURE__ */ jsxs("label", { className: classNames.label, children: [
+      checkboxElement,
+      label
+    ] }) : checkboxElement;
+  }
+);
+
+export { Checkbox };
+//# sourceMappingURL=Checkbox.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.esm.js","sources":["../../../src/components/Checkbox/Checkbox.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 { Checkbox as CheckboxPrimitive } from '@base-ui-components/react/checkbox';\nimport { Icon } from '../..';\nimport type { CheckboxProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport clsx from 'clsx';\n\n/** @public */\nexport const Checkbox = forwardRef<HTMLButtonElement, CheckboxProps>(\n  (props, ref) => {\n    const {\n      label,\n      checked,\n      onChange,\n      disabled,\n      required,\n      className,\n      name,\n      value,\n      style,\n    } = props;\n\n    const { classNames } = useStyles('Checkbox');\n\n    const checkboxElement = (\n      <CheckboxPrimitive.Root\n        ref={ref}\n        className={clsx(classNames.root, className)}\n        checked={checked}\n        onCheckedChange={onChange}\n        disabled={disabled}\n        required={required}\n        name={name}\n        value={value}\n        style={style}\n      >\n        <CheckboxPrimitive.Indicator className={classNames.indicator}>\n          <Icon name=\"check\" size={12} />\n        </CheckboxPrimitive.Indicator>\n      </CheckboxPrimitive.Root>\n    );\n\n    return label ? (\n      <label className={classNames.label}>\n        {checkboxElement}\n        {label}\n      </label>\n    ) : (\n      checkboxElement\n    );\n  },\n);\n"],"names":["CheckboxPrimitive"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBO,MAAM,QAAW,GAAA,UAAA;AAAA,EACtB,CAAC,OAAO,GAAQ,KAAA;AACd,IAAM,MAAA;AAAA,MACJ,KAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,KACE,GAAA,KAAA;AAEJ,IAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,UAAU,CAAA;AAE3C,IAAA,MAAM,eACJ,mBAAA,GAAA;AAAA,MAACA,UAAkB,CAAA,IAAA;AAAA,MAAlB;AAAA,QACC,GAAA;AAAA,QACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,QAC1C,OAAA;AAAA,QACA,eAAiB,EAAA,QAAA;AAAA,QACjB,QAAA;AAAA,QACA,QAAA;AAAA,QACA,IAAA;AAAA,QACA,KAAA;AAAA,QACA,KAAA;AAAA,QAEA,QAAC,kBAAA,GAAA,CAAAA,UAAA,CAAkB,SAAlB,EAAA,EAA4B,SAAW,EAAA,UAAA,CAAW,SACjD,EAAA,QAAA,kBAAA,GAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAK,OAAQ,EAAA,IAAA,EAAM,IAAI,CAC/B,EAAA;AAAA;AAAA,KACF;AAGF,IAAA,OAAO,KACL,mBAAA,IAAA,CAAC,OAAM,EAAA,EAAA,SAAA,EAAW,WAAW,KAC1B,EAAA,QAAA,EAAA;AAAA,MAAA,eAAA;AAAA,MACA;AAAA,KAAA,EACH,CAEA,GAAA,eAAA;AAAA;AAGN;;;;"}

package/dist/components/Collapsible/Collapsible.esm.js

@@ -0,0 +1,50 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Collapsible as Collapsible$1 } from '@base-ui-components/react/collapsible';
+import clsx from 'clsx';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const CollapsibleRoot = forwardRef(({ className, ...props }, ref) => {
+  const { classNames } = useStyles("Collapsible");
+  return /* @__PURE__ */ jsx(
+    Collapsible$1.Root,
+    {
+      ref,
+      className: clsx(classNames.root, className),
+      ...props
+    }
+  );
+});
+CollapsibleRoot.displayName = Collapsible$1.Root.displayName;
+const CollapsibleTrigger = forwardRef(({ className, ...props }, ref) => {
+  const { classNames } = useStyles("Collapsible");
+  return /* @__PURE__ */ jsx(
+    Collapsible$1.Trigger,
+    {
+      ref,
+      className: clsx(classNames.trigger, className),
+      ...props
+    }
+  );
+});
+CollapsibleTrigger.displayName = Collapsible$1.Trigger.displayName;
+const CollapsiblePanel = forwardRef(({ className, ...props }, ref) => {
+  const { classNames } = useStyles("Collapsible");
+  return /* @__PURE__ */ jsx(
+    Collapsible$1.Panel,
+    {
+      ref,
+      className: clsx(classNames.panel, className),
+      ...props
+    }
+  );
+});
+CollapsiblePanel.displayName = Collapsible$1.Panel.displayName;
+const Collapsible = {
+  Root: CollapsibleRoot,
+  Trigger: CollapsibleTrigger,
+  Panel: CollapsiblePanel
+};
+
+export { Collapsible };
+//# sourceMappingURL=Collapsible.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Collapsible.esm.js","sources":["../../../src/components/Collapsible/Collapsible.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { Collapsible as CollapsiblePrimitive } from '@base-ui-components/react/collapsible';\nimport clsx from 'clsx';\nimport { useStyles } from '../../hooks/useStyles';\n\nconst CollapsibleRoot = forwardRef<\n  React.ElementRef<typeof CollapsiblePrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>\n>(({ className, ...props }, ref) => {\n  const { classNames } = useStyles('Collapsible');\n\n  return (\n    <CollapsiblePrimitive.Root\n      ref={ref}\n      className={clsx(classNames.root, className)}\n      {...props}\n    />\n  );\n});\nCollapsibleRoot.displayName = CollapsiblePrimitive.Root.displayName;\n\nconst CollapsibleTrigger = forwardRef<\n  React.ElementRef<typeof CollapsiblePrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>\n>(({ className, ...props }, ref) => {\n  const { classNames } = useStyles('Collapsible');\n\n  return (\n    <CollapsiblePrimitive.Trigger\n      ref={ref}\n      className={clsx(classNames.trigger, className)}\n      {...props}\n    />\n  );\n});\nCollapsibleTrigger.displayName = CollapsiblePrimitive.Trigger.displayName;\n\nconst CollapsiblePanel = forwardRef<\n  React.ElementRef<typeof CollapsiblePrimitive.Panel>,\n  React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Panel>\n>(({ className, ...props }, ref) => {\n  const { classNames } = useStyles('Collapsible');\n\n  return (\n    <CollapsiblePrimitive.Panel\n      ref={ref}\n      className={clsx(classNames.panel, className)}\n      {...props}\n    />\n  );\n});\nCollapsiblePanel.displayName = CollapsiblePrimitive.Panel.displayName;\n\n/**\n * Collapsible is a component that allows you to collapse and expand content.\n * It is a wrapper around the CollapsiblePrimitive component from base-ui-components.\n *\n * @public\n */\nexport const Collapsible = {\n  Root: CollapsibleRoot,\n  Trigger: CollapsibleTrigger,\n  Panel: CollapsiblePanel,\n};\n"],"names":["CollapsiblePrimitive"],"mappings":";;;;;;AAqBA,MAAM,eAAA,GAAkB,WAGtB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAQ,KAAA;AAClC,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,aAAa,CAAA;AAE9C,EACE,uBAAA,GAAA;AAAA,IAACA,aAAqB,CAAA,IAAA;AAAA,IAArB;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,MACzC,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,eAAgB,CAAA,WAAA,GAAcA,cAAqB,IAAK,CAAA,WAAA;AAExD,MAAM,kBAAA,GAAqB,WAGzB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAQ,KAAA;AAClC,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,aAAa,CAAA;AAE9C,EACE,uBAAA,GAAA;AAAA,IAACA,aAAqB,CAAA,OAAA;AAAA,IAArB;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,OAAA,EAAS,SAAS,CAAA;AAAA,MAC5C,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,kBAAmB,CAAA,WAAA,GAAcA,cAAqB,OAAQ,CAAA,WAAA;AAE9D,MAAM,gBAAA,GAAmB,WAGvB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAQ,KAAA;AAClC,EAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,aAAa,CAAA;AAE9C,EACE,uBAAA,GAAA;AAAA,IAACA,aAAqB,CAAA,KAAA;AAAA,IAArB;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,KAAA,EAAO,SAAS,CAAA;AAAA,MAC1C,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,gBAAiB,CAAA,WAAA,GAAcA,cAAqB,KAAM,CAAA,WAAA;AAQnD,MAAM,WAAc,GAAA;AAAA,EACzB,IAAM,EAAA,eAAA;AAAA,EACN,OAAS,EAAA,kBAAA;AAAA,EACT,KAAO,EAAA;AACT;;;;"}

package/dist/components/Container/Container.esm.js

@@ -0,0 +1,35 @@
+import { forwardRef, createElement } from 'react';
+import clsx from 'clsx';
+import { displayPropDefs } from '../../props/display.props.esm.js';
+import { extractProps } from '../../utils/extractProps.esm.js';
+import { spacingPropDefs } from '../../props/spacing.props.esm.js';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+
+const Container = forwardRef(
+  (props, ref) => {
+    const { children } = props;
+    const { classNames } = useStyles("Container");
+    const containerSpacingProps = {
+      my: spacingPropDefs.my,
+      mt: spacingPropDefs.mt,
+      mb: spacingPropDefs.mb,
+      py: spacingPropDefs.py,
+      pt: spacingPropDefs.pt,
+      pb: spacingPropDefs.pb
+    };
+    const propDefs = {
+      ...displayPropDefs,
+      ...containerSpacingProps
+    };
+    const { className, style } = extractProps(props, propDefs);
+    return createElement("div", {
+      ref,
+      className: clsx(classNames.root, className),
+      style,
+      children
+    });
+  }
+);
+
+export { Container };
+//# sourceMappingURL=Container.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Container.esm.js","sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { createElement, forwardRef } from 'react';\nimport { ContainerProps } from './types';\nimport clsx from 'clsx';\nimport { displayPropDefs } from '../../props/display.props';\nimport { extractProps } from '../../utils/extractProps';\nimport { spacingPropDefs } from '../../props/spacing.props';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const Container = forwardRef<HTMLDivElement, ContainerProps>(\n  (props, ref) => {\n    const { children } = props;\n\n    const { classNames } = useStyles('Container');\n\n    // Create a subset of spacing props that match the interface\n    const containerSpacingProps = {\n      my: spacingPropDefs.my,\n      mt: spacingPropDefs.mt,\n      mb: spacingPropDefs.mb,\n      py: spacingPropDefs.py,\n      pt: spacingPropDefs.pt,\n      pb: spacingPropDefs.pb,\n    };\n\n    const propDefs = {\n      ...displayPropDefs,\n      ...containerSpacingProps,\n    };\n    const { className, style } = extractProps(props, propDefs);\n\n    return createElement('div', {\n      ref,\n      className: clsx(classNames.root, className),\n      style,\n      children,\n    });\n  },\n);\n"],"names":[],"mappings":";;;;;;;AAyBO,MAAM,SAAY,GAAA,UAAA;AAAA,EACvB,CAAC,OAAO,GAAQ,KAAA;AACd,IAAM,MAAA,EAAE,UAAa,GAAA,KAAA;AAErB,IAAA,MAAM,EAAE,UAAA,EAAe,GAAA,SAAA,CAAU,WAAW,CAAA;AAG5C,IAAA,MAAM,qBAAwB,GAAA;AAAA,MAC5B,IAAI,eAAgB,CAAA,EAAA;AAAA,MACpB,IAAI,eAAgB,CAAA,EAAA;AAAA,MACpB,IAAI,eAAgB,CAAA,EAAA;AAAA,MACpB,IAAI,eAAgB,CAAA,EAAA;AAAA,MACpB,IAAI,eAAgB,CAAA,EAAA;AAAA,MACpB,IAAI,eAAgB,CAAA;AAAA,KACtB;AAEA,IAAA,MAAM,QAAW,GAAA;AAAA,MACf,GAAG,eAAA;AAAA,MACH,GAAG;AAAA,KACL;AACA,IAAA,MAAM,EAAE,SAAW,EAAA,KAAA,EAAU,GAAA,YAAA,CAAa,OAAO,QAAQ,CAAA;AAEzD,IAAA,OAAO,cAAc,KAAO,EAAA;AAAA,MAC1B,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,UAAW,CAAA,IAAA,EAAM,SAAS,CAAA;AAAA,MAC1C,KAAA;AAAA,MACA;AAAA,KACD,CAAA;AAAA;AAEL;;;;"}

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

@@ -0,0 +1,26 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Table } from '../Table/Table.esm.js';
+import { DataTableRoot } from './Root/DataTableRoot.esm.js';
+import { DataTablePagination } from './Pagination/DataTablePagination.esm.js';
+import { DataTableTable } from './Table/DataTableTable.esm.js';
+
+const TableRoot = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Table.Root, { ref, ...props }));
+TableRoot.displayName = Table.Root.displayName;
+const DataTable = {
+  Root: DataTableRoot,
+  Pagination: DataTablePagination,
+  Table: DataTableTable,
+  TableRoot,
+  TableHeader: Table.Header,
+  TableBody: Table.Body,
+  TableRow: Table.Row,
+  TableCell: Table.Cell,
+  TableCellText: Table.CellText,
+  TableCellLink: Table.CellLink,
+  TableCellProfile: Table.CellProfile,
+  TableHead: Table.Head
+};
+
+export { DataTable };
+//# sourceMappingURL=DataTable.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.esm.js","sources":["../../../src/components/DataTable/DataTable.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 { Table } from '../Table';\nimport { DataTableRoot } from './Root/DataTableRoot';\nimport { DataTablePagination } from './Pagination/DataTablePagination';\nimport { Table as TanstackTable } from '@tanstack/react-table';\nimport { DataTableTable } from './Table/DataTableTable';\n\nconst TableRoot = forwardRef<\n  React.ElementRef<typeof Table.Root>,\n  React.ComponentPropsWithoutRef<typeof Table.Root>\n>(({ className, ...props }, ref) => <Table.Root ref={ref} {...props} />);\nTableRoot.displayName = Table.Root.displayName;\n\n/**\n * DataTable component for displaying tabular data with pagination\n * @public\n */\nexport const DataTable = {\n  Root: DataTableRoot as <TData>(\n    props: {\n      table: TanstackTable<TData>;\n    } & React.HTMLAttributes<HTMLDivElement>,\n  ) => JSX.Element,\n  Pagination: DataTablePagination,\n  Table: DataTableTable,\n  TableRoot: TableRoot,\n  TableHeader: Table.Header,\n  TableBody: Table.Body,\n  TableRow: Table.Row,\n  TableCell: Table.Cell,\n  TableCellText: Table.CellText,\n  TableCellLink: Table.CellLink,\n  TableCellProfile: Table.CellProfile,\n  TableHead: Table.Head,\n};\n"],"names":[],"mappings":";;;;;;;AAuBA,MAAM,YAAY,UAGhB,CAAA,CAAC,EAAE,SAAA,EAAW,GAAG,KAAM,EAAA,EAAG,GAAQ,qBAAA,GAAA,CAAC,MAAM,IAAN,EAAA,EAAW,GAAW,EAAA,GAAG,OAAO,CAAE,CAAA;AACvE,SAAU,CAAA,WAAA,GAAc,MAAM,IAAK,CAAA,WAAA;AAM5B,MAAM,SAAY,GAAA;AAAA,EACvB,IAAM,EAAA,aAAA;AAAA,EAKN,UAAY,EAAA,mBAAA;AAAA,EACZ,KAAO,EAAA,cAAA;AAAA,EACP,SAAA;AAAA,EACA,aAAa,KAAM,CAAA,MAAA;AAAA,EACnB,WAAW,KAAM,CAAA,IAAA;AAAA,EACjB,UAAU,KAAM,CAAA,GAAA;AAAA,EAChB,WAAW,KAAM,CAAA,IAAA;AAAA,EACjB,eAAe,KAAM,CAAA,QAAA;AAAA,EACrB,eAAe,KAAM,CAAA,QAAA;AAAA,EACrB,kBAAkB,KAAM,CAAA,WAAA;AAAA,EACxB,WAAW,KAAM,CAAA;AACnB;;;;"}

package/dist/components/DataTable/Pagination/DataTablePagination.esm.js

@@ -0,0 +1,84 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Text } from '../../Text/Text.esm.js';
+import { ButtonIcon } from '../../ButtonIcon/ButtonIcon.esm.js';
+import clsx from 'clsx';
+import { Select } from '../../Select/Select.esm.js';
+import { useDataTable } from '../Root/DataTableRoot.esm.js';
+import '@remixicon/react';
+import { Icon } from '../../Icon/Icon.esm.js';
+import '../../Icon/context.esm.js';
+
+const DataTablePagination = forwardRef(
+  (props, ref) => {
+    const { className, ...rest } = props;
+    const { table } = useDataTable();
+    const pageIndex = table?.getState().pagination.pageIndex;
+    const pageSize = table?.getState().pagination.pageSize;
+    const rowCount = table?.getRowCount();
+    const fromCount = (pageIndex ?? 0) * (pageSize ?? 10) + 1;
+    const toCount = Math.min(
+      ((pageIndex ?? 0) + 1) * (pageSize ?? 10),
+      rowCount
+    );
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        style: { minWidth: table?.getTotalSize() },
+        className: clsx("bui-DataTablePagination", className),
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "bui-DataTablePagination--left", children: !table.options.manualPagination && /* @__PURE__ */ jsx(
+            Select,
+            {
+              name: "pageSize",
+              size: "small",
+              placeholder: "Show 10 results",
+              options: [
+                { label: "Show 5 results", value: "5" },
+                { label: "Show 10 results", value: "10" },
+                { label: "Show 20 results", value: "20" },
+                { label: "Show 30 results", value: "30" },
+                { label: "Show 40 results", value: "40" },
+                { label: "Show 50 results", value: "50" }
+              ],
+              selectedKey: pageSize?.toString(),
+              onSelectionChange: (value) => {
+                table?.setPageSize(Number(value));
+              },
+              className: "bui-DataTablePagination--select"
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("div", { className: "bui-DataTablePagination--right", children: [
+            /* @__PURE__ */ jsx(Text, { variant: "body", children: `${fromCount} - ${toCount} of ${rowCount}` }),
+            /* @__PURE__ */ jsx(
+              ButtonIcon,
+              {
+                variant: "secondary",
+                size: "small",
+                onClick: () => table?.previousPage(),
+                isDisabled: !table?.getCanPreviousPage(),
+                icon: /* @__PURE__ */ jsx(Icon, { name: "chevron-left" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              ButtonIcon,
+              {
+                variant: "secondary",
+                size: "small",
+                onClick: () => table?.nextPage(),
+                isDisabled: !table?.getCanNextPage(),
+                icon: /* @__PURE__ */ jsx(Icon, { name: "chevron-right" })
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  }
+);
+DataTablePagination.displayName = "DataTablePagination";
+
+export { DataTablePagination };
+//# sourceMappingURL=DataTablePagination.esm.js.map

package/dist/components/DataTable/Pagination/DataTablePagination.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTablePagination.esm.js","sources":["../../../../src/components/DataTable/Pagination/DataTablePagination.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 { Text } from '../../Text';\nimport { DataTablePaginationProps } from './types';\nimport { ButtonIcon } from '../../ButtonIcon';\nimport clsx from 'clsx';\nimport { Select } from '../../Select';\nimport { useDataTable } from '../Root/DataTableRoot';\nimport { Icon } from '../../Icon';\n\n/** @public */\nconst DataTablePagination = forwardRef(\n  (\n    props: DataTablePaginationProps,\n    ref: React.ForwardedRef<HTMLDivElement>,\n  ) => {\n    const { className, ...rest } = props;\n    const { table } = useDataTable();\n    const pageIndex = table?.getState().pagination.pageIndex;\n    const pageSize = table?.getState().pagination.pageSize;\n    const rowCount = table?.getRowCount();\n    const fromCount = (pageIndex ?? 0) * (pageSize ?? 10) + 1;\n    const toCount = Math.min(\n      ((pageIndex ?? 0) + 1) * (pageSize ?? 10),\n      rowCount,\n    );\n\n    return (\n      <div\n        ref={ref}\n        style={{ minWidth: table?.getTotalSize() }}\n        className={clsx('bui-DataTablePagination', className)}\n        {...rest}\n      >\n        <div className=\"bui-DataTablePagination--left\">\n          {!table.options.manualPagination && (\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                table?.setPageSize(Number(value));\n              }}\n              className=\"bui-DataTablePagination--select\"\n            />\n          )}\n        </div>\n        <div className=\"bui-DataTablePagination--right\">\n          <Text variant=\"body\">{`${fromCount} - ${toCount} of ${rowCount}`}</Text>\n          <ButtonIcon\n            variant=\"secondary\"\n            size=\"small\"\n            onClick={() => table?.previousPage()}\n            isDisabled={!table?.getCanPreviousPage()}\n            icon={<Icon name=\"chevron-left\" />}\n          />\n          <ButtonIcon\n            variant=\"secondary\"\n            size=\"small\"\n            onClick={() => table?.nextPage()}\n            isDisabled={!table?.getCanNextPage()}\n            icon={<Icon name=\"chevron-right\" />}\n          />\n        </div>\n      </div>\n    );\n  },\n);\n\nDataTablePagination.displayName = 'DataTablePagination';\n\nexport { DataTablePagination };\n"],"names":[],"mappings":"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"}