@backstage/ui 0.7.2-next.1 → 0.8.0

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

@@ -1,67 +1,32 @@
 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 '../Avatar/Avatar.esm.js';
-import '../Button/Button.esm.js';
-import '../Card/Card.esm.js';
-import '../Collapsible/Collapsible.esm.js';
-import '../FieldLabel/FieldLabel.esm.js';
-import 'react-aria-components';
 import { useStyles } from '../../hooks/useStyles.esm.js';
-import '@remixicon/react';
-import '../Text/Text.esm.js';
-import 'react-router-dom';
-import '../Tabs/Tabs.esm.js';
-import '../Link/Link.esm.js';
-import { Icon } from '../Icon/Icon.esm.js';
-import '../ButtonIcon/ButtonIcon.esm.js';
-import '../ButtonLink/ButtonLink.esm.js';
-import '../RadioGroup/RadioGroup.esm.js';
-import '../Table/components/Cell.esm.js';
 import clsx from 'clsx';
-import '@base-ui-components/react/avatar';
-import '../TextField/TextField.esm.js';
-import '../Tooltip/Tooltip.esm.js';
-import '../ScrollArea/ScrollArea.esm.js';
-import '../SearchField/SearchField.esm.js';
-import '../Select/Select.esm.js';
-import '../Switch/Switch.esm.js';
+import styles from './Checkbox.module.css.esm.js';
+import { RiCheckLine } from '@remixicon/react';
 
 const Checkbox = forwardRef(
   (props, ref) => {
-    const {
-      label,
-      checked,
-      onChange,
-      disabled,
-      required,
-      className,
-      name,
-      value,
-      style
-    } = props;
-    const { classNames } = useStyles("Checkbox");
+    const { classNames, cleanedProps } = useStyles("Checkbox", props);
+    const { label, onChange, className, ...rest } = cleanedProps;
     const checkboxElement = /* @__PURE__ */ jsx(
       Checkbox$1.Root,
       {
         ref,
-        className: clsx(classNames.root, className),
-        checked,
+        className: clsx(classNames.root, styles[classNames.root], className),
         onCheckedChange: onChange,
-        disabled,
-        required,
-        name,
-        value,
-        style,
-        children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, { className: classNames.indicator, children: /* @__PURE__ */ jsx(Icon, { name: "check", size: 12 }) })
+        ...rest,
+        children: /* @__PURE__ */ jsx(
+          Checkbox$1.Indicator,
+          {
+            className: clsx(classNames.indicator, styles[classNames.indicator]),
+            children: /* @__PURE__ */ jsx(RiCheckLine, { size: 12 })
+          }
+        )
       }
     );
-    return label ? /* @__PURE__ */ jsxs("label", { className: classNames.label, children: [
+    return label ? /* @__PURE__ */ jsxs("label", { className: clsx(classNames.label, styles[classNames.label]), children: [
       checkboxElement,
       label
     ] }) : checkboxElement;

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

@@ -1 +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,QAAA,GAAW,UAAA;AAAA,EACtB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM;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,KACF,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,UAAU,CAAA;AAE3C,IAAA,MAAM,eAAA,mBACJ,GAAA;AAAA,MAACA,UAAA,CAAkB,IAAA;AAAA,MAAlB;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,IAAA,EAAM,SAAS,CAAA;AAAA,QAC1C,OAAA;AAAA,QACA,eAAA,EAAiB,QAAA;AAAA,QACjB,QAAA;AAAA,QACA,QAAA;AAAA,QACA,IAAA;AAAA,QACA,KAAA;AAAA,QACA,KAAA;AAAA,QAEA,QAAA,kBAAA,GAAA,CAACA,UAAA,CAAkB,SAAA,EAAlB,EAA4B,SAAA,EAAW,UAAA,CAAW,SAAA,EACjD,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,OAAA,EAAQ,IAAA,EAAM,IAAI,CAAA,EAC/B;AAAA;AAAA,KACF;AAGF,IAAA,OAAO,KAAA,mBACL,IAAA,CAAC,OAAA,EAAA,EAAM,SAAA,EAAW,WAAW,KAAA,EAC1B,QAAA,EAAA;AAAA,MAAA,eAAA;AAAA,MACA;AAAA,KAAA,EACH,CAAA,GAEA,eAAA;AAAA,EAEJ;AACF;;;;"}
+{"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 type { CheckboxProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport clsx from 'clsx';\nimport styles from './Checkbox.module.css';\nimport { RiCheckLine } from '@remixicon/react';\n\n/** @public */\nexport const Checkbox = forwardRef<HTMLButtonElement, CheckboxProps>(\n  (props, ref) => {\n    const { classNames, cleanedProps } = useStyles('Checkbox', props);\n    const { label, onChange, className, ...rest } = cleanedProps;\n\n    const checkboxElement = (\n      <CheckboxPrimitive.Root\n        ref={ref}\n        className={clsx(classNames.root, styles[classNames.root], className)}\n        onCheckedChange={onChange}\n        {...rest}\n      >\n        <CheckboxPrimitive.Indicator\n          className={clsx(classNames.indicator, styles[classNames.indicator])}\n        >\n          <RiCheckLine size={12} />\n        </CheckboxPrimitive.Indicator>\n      </CheckboxPrimitive.Root>\n    );\n\n    return label ? (\n      <label className={clsx(classNames.label, styles[classNames.label])}>\n        {checkboxElement}\n        {label}\n      </label>\n    ) : (\n      checkboxElement\n    );\n  },\n);\n"],"names":["CheckboxPrimitive"],"mappings":";;;;;;;;AAyBO,MAAM,QAAA,GAAW,UAAA;AAAA,EACtB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,YAAY,KAAK,CAAA;AAChE,IAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,YAAA;AAEhD,IAAA,MAAM,eAAA,mBACJ,GAAA;AAAA,MAACA,UAAA,CAAkB,IAAA;AAAA,MAAlB;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,KAAK,UAAA,CAAW,IAAA,EAAM,OAAO,UAAA,CAAW,IAAI,GAAG,SAAS,CAAA;AAAA,QACnE,eAAA,EAAiB,QAAA;AAAA,QAChB,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA;AAAA,UAACA,UAAA,CAAkB,SAAA;AAAA,UAAlB;AAAA,YACC,WAAW,IAAA,CAAK,UAAA,CAAW,WAAW,MAAA,CAAO,UAAA,CAAW,SAAS,CAAC,CAAA;AAAA,YAElE,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAY,IAAA,EAAM,EAAA,EAAI;AAAA;AAAA;AACzB;AAAA,KACF;AAGF,IAAA,OAAO,KAAA,mBACL,IAAA,CAAC,OAAA,EAAA,EAAM,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,KAAA,EAAO,MAAA,CAAO,UAAA,CAAW,KAAK,CAAC,CAAA,EAC9D,QAAA,EAAA;AAAA,MAAA,eAAA;AAAA,MACA;AAAA,KAAA,EACH,CAAA,GAEA,eAAA;AAAA,EAEJ;AACF;;;;"}

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

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer components {\n  .Checkbox-module_bui-CheckboxRoot__3-TFM {\n    border: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 1rem;\n    height: 1rem;\n    box-shadow: inset 0 0 0 1px var(--bui-border);\n    cursor: pointer;\n    border-radius: 2px;\n    transition: background-color 0.2s ease-in-out;\n    background-color: var(--bui-bg-surface-1);\n    padding: 0;\n    flex-shrink: 0;\n  }\n\n  .Checkbox-module_bui-CheckboxRoot__3-TFM:focus-visible {\n    transition: none;\n    outline: 2px solid var(--bui-ring);\n    outline-offset: 2px;\n  }\n\n  .Checkbox-module_bui-CheckboxRoot__3-TFM[data-checked] {\n    background-color: var(--bui-bg-solid);\n    box-shadow: none;\n    color: var(--bui-fg-solid);\n  }\n\n  .Checkbox-module_bui-CheckboxLabel__2sjLA {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    gap: var(--bui-space-2);\n    font-size: var(--bui-font-size-3);\n    font-family: var(--bui-font-regular);\n    font-weight: var(--bui-font-weight-regular);\n    color: var(--bui-fg-primary);\n    user-select: none;\n\n    &:hover {\n      & .Checkbox-module_bui-CheckboxRoot__3-TFM:not([data-checked]) {\n        box-shadow: inset 0 0 0 1px var(--bui-border-hover);\n      }\n    }\n  }\n\n  .Checkbox-module_bui-CheckboxIndicator__2ZJtl {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--bui-fg-solid);\n  }\n}\n";
+var styles = {"bui-CheckboxRoot":"Checkbox-module_bui-CheckboxRoot__3-TFM","bui-CheckboxLabel":"Checkbox-module_bui-CheckboxLabel__2sjLA","bui-CheckboxIndicator":"Checkbox-module_bui-CheckboxIndicator__2ZJtl"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=Checkbox.module.css.esm.js.map

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

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

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

@@ -3,39 +3,44 @@ 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';
+import styles from './Collapsible.module.css.esm.js';
 
 const CollapsibleRoot = forwardRef(({ className, ...props }, ref) => {
-  const { classNames } = useStyles("Collapsible");
+  const { classNames, cleanedProps } = useStyles("Collapsible", props);
   return /* @__PURE__ */ jsx(
     Collapsible$1.Root,
     {
       ref,
-      className: clsx(classNames.root, className),
-      ...props
+      className: clsx(classNames.root, styles[classNames.root], className),
+      ...cleanedProps
     }
   );
 });
 CollapsibleRoot.displayName = Collapsible$1.Root.displayName;
 const CollapsibleTrigger = forwardRef(({ className, ...props }, ref) => {
-  const { classNames } = useStyles("Collapsible");
+  const { classNames, cleanedProps } = useStyles("Collapsible", props);
   return /* @__PURE__ */ jsx(
     Collapsible$1.Trigger,
     {
       ref,
-      className: clsx(classNames.trigger, className),
-      ...props
+      className: clsx(
+        classNames.trigger,
+        styles[classNames.trigger],
+        className
+      ),
+      ...cleanedProps
     }
   );
 });
 CollapsibleTrigger.displayName = Collapsible$1.Trigger.displayName;
 const CollapsiblePanel = forwardRef(({ className, ...props }, ref) => {
-  const { classNames } = useStyles("Collapsible");
+  const { classNames, cleanedProps } = useStyles("Collapsible", props);
   return /* @__PURE__ */ jsx(
     Collapsible$1.Panel,
     {
       ref,
-      className: clsx(classNames.panel, className),
-      ...props
+      className: clsx(classNames.panel, styles[classNames.panel], className),
+      ...cleanedProps
     }
   );
 });

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

@@ -1 +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,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,aAAa,CAAA;AAE9C,EAAA,uBACE,GAAA;AAAA,IAACA,aAAA,CAAqB,IAAA;AAAA,IAArB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,IAAA,EAAM,SAAS,CAAA;AAAA,MACzC,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,eAAA,CAAgB,WAAA,GAAcA,cAAqB,IAAA,CAAK,WAAA;AAExD,MAAM,kBAAA,GAAqB,WAGzB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,aAAa,CAAA;AAE9C,EAAA,uBACE,GAAA;AAAA,IAACA,aAAA,CAAqB,OAAA;AAAA,IAArB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,OAAA,EAAS,SAAS,CAAA;AAAA,MAC5C,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,kBAAA,CAAmB,WAAA,GAAcA,cAAqB,OAAA,CAAQ,WAAA;AAE9D,MAAM,gBAAA,GAAmB,WAGvB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,aAAa,CAAA;AAE9C,EAAA,uBACE,GAAA;AAAA,IAACA,aAAA,CAAqB,KAAA;AAAA,IAArB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,KAAA,EAAO,SAAS,CAAA;AAAA,MAC1C,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,gBAAA,CAAiB,WAAA,GAAcA,cAAqB,KAAA,CAAM,WAAA;AAQnD,MAAM,WAAA,GAAc;AAAA,EACzB,IAAA,EAAM,eAAA;AAAA,EACN,OAAA,EAAS,kBAAA;AAAA,EACT,KAAA,EAAO;AACT;;;;"}
+{"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';\nimport styles from './Collapsible.module.css';\n\nconst CollapsibleRoot = forwardRef<\n  React.ElementRef<typeof CollapsiblePrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>\n>(({ className, ...props }, ref) => {\n  const { classNames, cleanedProps } = useStyles('Collapsible', props);\n\n  return (\n    <CollapsiblePrimitive.Root\n      ref={ref}\n      className={clsx(classNames.root, styles[classNames.root], className)}\n      {...cleanedProps}\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, cleanedProps } = useStyles('Collapsible', props);\n\n  return (\n    <CollapsiblePrimitive.Trigger\n      ref={ref}\n      className={clsx(\n        classNames.trigger,\n        styles[classNames.trigger],\n        className,\n      )}\n      {...cleanedProps}\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, cleanedProps } = useStyles('Collapsible', props);\n\n  return (\n    <CollapsiblePrimitive.Panel\n      ref={ref}\n      className={clsx(classNames.panel, styles[classNames.panel], className)}\n      {...cleanedProps}\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":";;;;;;;AAsBA,MAAM,eAAA,GAAkB,WAGtB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,eAAe,KAAK,CAAA;AAEnE,EAAA,uBACE,GAAA;AAAA,IAACA,aAAA,CAAqB,IAAA;AAAA,IAArB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,KAAK,UAAA,CAAW,IAAA,EAAM,OAAO,UAAA,CAAW,IAAI,GAAG,SAAS,CAAA;AAAA,MAClE,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,eAAA,CAAgB,WAAA,GAAcA,cAAqB,IAAA,CAAK,WAAA;AAExD,MAAM,kBAAA,GAAqB,WAGzB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,eAAe,KAAK,CAAA;AAEnE,EAAA,uBACE,GAAA;AAAA,IAACA,aAAA,CAAqB,OAAA;AAAA,IAArB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,IAAA;AAAA,QACT,UAAA,CAAW,OAAA;AAAA,QACX,MAAA,CAAO,WAAW,OAAO,CAAA;AAAA,QACzB;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,kBAAA,CAAmB,WAAA,GAAcA,cAAqB,OAAA,CAAQ,WAAA;AAE9D,MAAM,gBAAA,GAAmB,WAGvB,CAAC,EAAE,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAClC,EAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,eAAe,KAAK,CAAA;AAEnE,EAAA,uBACE,GAAA;AAAA,IAACA,aAAA,CAAqB,KAAA;AAAA,IAArB;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,KAAK,UAAA,CAAW,KAAA,EAAO,OAAO,UAAA,CAAW,KAAK,GAAG,SAAS,CAAA;AAAA,MACpE,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AACD,gBAAA,CAAiB,WAAA,GAAcA,cAAqB,KAAA,CAAM,WAAA;AAQnD,MAAM,WAAA,GAAc;AAAA,EACzB,IAAA,EAAM,eAAA;AAAA,EACN,OAAA,EAAS,kBAAA;AAAA,EACT,KAAA,EAAO;AACT;;;;"}

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

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer components {\n  .Collapsible-module_bui-CollapsiblePanel__2C0cr {\n    display: flex;\n    height: var(--collapsible-panel-height);\n    overflow: hidden;\n    transition: all 150ms ease-out;\n\n    &[data-starting-style],\n    &[data-ending-style] {\n      height: 0;\n    }\n  }\n}\n";
+var styles = {"bui-CollapsiblePanel":"Collapsible-module_bui-CollapsiblePanel__2C0cr"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=Collapsible.module.css.esm.js.map

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

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

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

@@ -1,33 +1,30 @@
-import { forwardRef, createElement } from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } 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';
+import styles from './Container.module.css.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
-    });
+    const { classNames, utilityClasses, style, cleanedProps } = useStyles(
+      "Container",
+      props
+    );
+    const { className, ...rest } = cleanedProps;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: clsx(
+          classNames.root,
+          utilityClasses,
+          styles[classNames.root],
+          className
+        ),
+        style,
+        ...rest
+      }
+    );
   }
 );
 

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

@@ -1 +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,SAAA,GAAY,UAAA;AAAA,EACvB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,UAAS,GAAI,KAAA;AAErB,IAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,WAAW,CAAA;AAG5C,IAAA,MAAM,qBAAA,GAAwB;AAAA,MAC5B,IAAI,eAAA,CAAgB,EAAA;AAAA,MACpB,IAAI,eAAA,CAAgB,EAAA;AAAA,MACpB,IAAI,eAAA,CAAgB,EAAA;AAAA,MACpB,IAAI,eAAA,CAAgB,EAAA;AAAA,MACpB,IAAI,eAAA,CAAgB,EAAA;AAAA,MACpB,IAAI,eAAA,CAAgB;AAAA,KACtB;AAEA,IAAA,MAAM,QAAA,GAAW;AAAA,MACf,GAAG,eAAA;AAAA,MACH,GAAG;AAAA,KACL;AACA,IAAA,MAAM,EAAE,SAAA,EAAW,KAAA,EAAM,GAAI,YAAA,CAAa,OAAO,QAAQ,CAAA;AAEzD,IAAA,OAAO,cAAc,KAAA,EAAO;AAAA,MAC1B,GAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,IAAA,EAAM,SAAS,CAAA;AAAA,MAC1C,KAAA;AAAA,MACA;AAAA,KACD,CAAA;AAAA,EACH;AACF;;;;"}
+{"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 { forwardRef } from 'react';\nimport { ContainerProps } from './types';\nimport clsx from 'clsx';\nimport { useStyles } from '../../hooks/useStyles';\nimport styles from './Container.module.css';\n\n/** @public */\nexport const Container = forwardRef<HTMLDivElement, ContainerProps>(\n  (props, ref) => {\n    const { classNames, utilityClasses, style, cleanedProps } = useStyles(\n      'Container',\n      props,\n    );\n\n    const { className, ...rest } = cleanedProps;\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(\n          classNames.root,\n          utilityClasses,\n          styles[classNames.root],\n          className,\n        )}\n        style={style}\n        {...rest}\n      />\n    );\n  },\n);\n"],"names":[],"mappings":";;;;;;AAuBO,MAAM,SAAA,GAAY,UAAA;AAAA,EACvB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,UAAA,EAAY,cAAA,EAAgB,KAAA,EAAO,cAAa,GAAI,SAAA;AAAA,MAC1D,WAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,YAAA;AAE/B,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,IAAA;AAAA,UACT,UAAA,CAAW,IAAA;AAAA,UACX,cAAA;AAAA,UACA,MAAA,CAAO,WAAW,IAAI,CAAA;AAAA,UACtB;AAAA,SACF;AAAA,QACA,KAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;;;;"}

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

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer components {\n  .Container-module_bui-Container__1ROo0 {\n    max-width: 120rem;\n    padding-inline: var(--bui-space-4);\n    margin-inline: auto;\n    transition: padding 0.2s ease-in-out;\n  }\n\n  @media (min-width: 640px) {\n    .Container-module_bui-Container__1ROo0 {\n      padding-inline: var(--bui-space-5);\n    }\n  }\n}\n";
+var styles = {"bui-Container":"Container-module_bui-Container__1ROo0"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=Container.module.css.esm.js.map

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

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

package/dist/components/Dialog/Dialog.esm.js

@@ -0,0 +1,103 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Modal, Dialog as Dialog$1, Heading, DialogTrigger as DialogTrigger$1 } from 'react-aria-components';
+import clsx from 'clsx';
+import { RiCloseLine } from '@remixicon/react';
+import { Button } from '../Button/Button.esm.js';
+import { useStyles } from '../../hooks/useStyles.esm.js';
+import { Flex } from '../Flex/Flex.esm.js';
+import styles from './Dialog.module.css.esm.js';
+
+const DialogTrigger = (props) => {
+  return /* @__PURE__ */ jsx(DialogTrigger$1, { ...props });
+};
+const Dialog = forwardRef(
+  (props, ref) => {
+    const { classNames, cleanedProps } = useStyles("Dialog", props);
+    const { className, children, width, height, style, ...rest } = cleanedProps;
+    return /* @__PURE__ */ jsx(
+      Modal,
+      {
+        ref,
+        className: clsx(classNames.overlay, styles[classNames.overlay]),
+        isDismissable: true,
+        isKeyboardDismissDisabled: false,
+        ...rest,
+        children: /* @__PURE__ */ jsx(
+          Dialog$1,
+          {
+            className: clsx(
+              classNames.dialog,
+              styles[classNames.dialog],
+              className
+            ),
+            style: {
+              ["--bui-dialog-min-width"]: typeof width === "number" ? `${width}px` : width || "400px",
+              ["--bui-dialog-min-height"]: height ? typeof height === "number" ? `${height}px` : height : "auto",
+              ...style
+            },
+            children
+          }
+        )
+      }
+    );
+  }
+);
+Dialog.displayName = "Dialog";
+const DialogHeader = forwardRef((props, ref) => {
+  const { classNames, cleanedProps } = useStyles("Dialog", props);
+  const { className, children, ...rest } = cleanedProps;
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      ref,
+      className: clsx(classNames.header, styles[classNames.header], className),
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsx(
+          Heading,
+          {
+            slot: "title",
+            className: clsx(classNames.headerTitle, styles[classNames.headerTitle]),
+            children
+          }
+        ),
+        /* @__PURE__ */ jsx(Button, { name: "close", "aria-label": "Close", variant: "tertiary", slot: "close", children: /* @__PURE__ */ jsx(RiCloseLine, {}) })
+      ]
+    }
+  );
+});
+DialogHeader.displayName = "DialogHeader";
+const DialogBody = forwardRef(
+  (props, ref) => {
+    const { classNames, cleanedProps } = useStyles("Dialog", props);
+    const { className, children, ...rest } = cleanedProps;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: clsx(classNames.body, styles[classNames.body], className),
+        ref,
+        ...rest,
+        children
+      }
+    );
+  }
+);
+DialogBody.displayName = "DialogBody";
+const DialogFooter = forwardRef((props, ref) => {
+  const { classNames, cleanedProps } = useStyles("Dialog", props);
+  const { className, children, ...rest } = cleanedProps;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: clsx(classNames.footer, styles[classNames.footer], className),
+      ...rest,
+      children
+    }
+  );
+});
+DialogFooter.displayName = "DialogFooter";
+
+export { Dialog, DialogBody, DialogFooter, DialogHeader, DialogTrigger };
+//# sourceMappingURL=Dialog.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.esm.js","sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport {\n  Dialog as RADialog,\n  DialogTrigger as RADialogTrigger,\n  Modal,\n  Heading,\n} from 'react-aria-components';\nimport clsx from 'clsx';\nimport type {\n  DialogTriggerProps,\n  DialogHeaderProps,\n  DialogProps,\n  DialogBodyProps,\n} from './types';\nimport { RiCloseLine } from '@remixicon/react';\nimport { Button } from '../Button';\nimport { useStyles } from '../../hooks/useStyles';\nimport { Flex } from '../Flex';\nimport styles from './Dialog.module.css';\n\n/** @public */\nexport const DialogTrigger = (props: DialogTriggerProps) => {\n  return <RADialogTrigger {...props} />;\n};\n\n/** @public */\nexport const Dialog = forwardRef<React.ElementRef<typeof Modal>, DialogProps>(\n  (props, ref) => {\n    const { classNames, cleanedProps } = useStyles('Dialog', props);\n    const { className, children, width, height, style, ...rest } = cleanedProps;\n\n    return (\n      <Modal\n        ref={ref}\n        className={clsx(classNames.overlay, styles[classNames.overlay])}\n        isDismissable\n        isKeyboardDismissDisabled={false}\n        {...rest}\n      >\n        <RADialog\n          className={clsx(\n            classNames.dialog,\n            styles[classNames.dialog],\n            className,\n          )}\n          style={{\n            ['--bui-dialog-min-width' as keyof React.CSSProperties]:\n              typeof width === 'number' ? `${width}px` : width || '400px',\n            ['--bui-dialog-min-height' as keyof React.CSSProperties]: height\n              ? typeof height === 'number'\n                ? `${height}px`\n                : height\n              : 'auto',\n            ...style,\n          }}\n        >\n          {children}\n        </RADialog>\n      </Modal>\n    );\n  },\n);\n\nDialog.displayName = 'Dialog';\n\n/** @public */\nexport const DialogHeader = forwardRef<\n  React.ElementRef<'div'>,\n  DialogHeaderProps\n>((props, ref) => {\n  const { classNames, cleanedProps } = useStyles('Dialog', props);\n  const { className, children, ...rest } = cleanedProps;\n\n  return (\n    <Flex\n      ref={ref}\n      className={clsx(classNames.header, styles[classNames.header], className)}\n      {...rest}\n    >\n      <Heading\n        slot=\"title\"\n        className={clsx(classNames.headerTitle, styles[classNames.headerTitle])}\n      >\n        {children}\n      </Heading>\n      <Button name=\"close\" aria-label=\"Close\" variant=\"tertiary\" slot=\"close\">\n        <RiCloseLine />\n      </Button>\n    </Flex>\n  );\n});\nDialogHeader.displayName = 'DialogHeader';\n\n/** @public */\nexport const DialogBody = forwardRef<React.ElementRef<'div'>, DialogBodyProps>(\n  (props, ref) => {\n    const { classNames, cleanedProps } = useStyles('Dialog', props);\n    const { className, children, ...rest } = cleanedProps;\n\n    return (\n      <div\n        className={clsx(classNames.body, styles[classNames.body], className)}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\nDialogBody.displayName = 'DialogBody';\n\n/** @public */\nexport const DialogFooter = forwardRef<\n  React.ElementRef<'div'>,\n  React.ComponentPropsWithoutRef<'div'>\n>((props, ref) => {\n  const { classNames, cleanedProps } = useStyles('Dialog', props);\n  const { className, children, ...rest } = cleanedProps;\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(classNames.footer, styles[classNames.footer], className)}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n});\nDialogFooter.displayName = 'DialogFooter';\n"],"names":["RADialogTrigger","RADialog"],"mappings":"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"}

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

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer components {\n  .Dialog-module_bui-DialogOverlay__5nqD5 {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: rgba(232, 232, 232, 0.8);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 1000;\n  }\n\n  [data-theme='dark'] .Dialog-module_bui-Dialog__Cnu24 {\n    background: rgba(0, 0, 0, 0.5);\n  }\n\n  .Dialog-module_bui-DialogOverlay__5nqD5[data-entering] {\n    animation: Dialog-module_fade-in__17nJR 200ms ease-out forwards;\n  }\n\n  .Dialog-module_bui-DialogOverlay__5nqD5[data-exiting] {\n    animation: Dialog-module_fade-out__jMAaZ 150ms ease-out forwards;\n  }\n\n  .Dialog-module_bui-Dialog__Cnu24 {\n    background: var(--bui-bg-surface-1);\n    border-radius: 0.5rem;\n    border: 1px solid var(--bui-border);\n    color: var(--bui-fg-primary);\n    position: relative;\n    width: min(var(--bui-dialog-min-width, 400px), calc(100vw - 3rem));\n    max-width: calc(100vw - 3rem);\n    height: min(var(--bui-dialog-min-height, auto), calc(100vh - 3rem));\n    max-height: calc(100vh - 3rem);\n    display: flex;\n    flex-direction: column;\n    outline: none;\n  }\n\n  /* Dialog entering animation */\n  .Dialog-module_bui-DialogOverlay__5nqD5[data-entering] .Dialog-module_bui-Dialog__Cnu24 {\n    animation: Dialog-module_dialog-enter__3NC2w 150ms ease-out forwards;\n  }\n\n  /* Dialog exiting animation */\n  .Dialog-module_bui-DialogOverlay__5nqD5[data-exiting] .Dialog-module_bui-Dialog__Cnu24 {\n    animation: Dialog-module_dialog-exit__21RUM 150ms ease-out forwards;\n  }\n\n  .Dialog-module_bui-DialogHeader__D340y {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding-inline: var(--bui-space-3);\n    padding-block: var(--bui-space-2);\n    border-bottom: 1px solid var(--bui-border);\n  }\n\n  .Dialog-module_bui-DialogHeaderTitle__1UEkF {\n    font-size: var(--bui-font-size-3);\n    font-weight: var(--bui-font-weight-bold);\n    margin: 0;\n  }\n\n  .Dialog-module_bui-DialogFooter__k2SK8 {\n    display: flex;\n    align-items: center;\n    justify-content: end;\n    gap: var(--bui-space-2);\n    padding-inline: var(--bui-space-3);\n    padding-block: var(--bui-space-3);\n    border-top: 1px solid var(--bui-border);\n  }\n\n  .Dialog-module_bui-DialogBody__2olLx {\n    padding: var(--bui-space-3);\n    flex: 1;\n    overflow-y: auto;\n  }\n\n  /* Keyframe animations */\n  @keyframes Dialog-module_fade-in__17nJR {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n\n  @keyframes Dialog-module_fade-out__jMAaZ {\n    from {\n      opacity: 1;\n    }\n    to {\n      opacity: 0;\n    }\n  }\n\n  @keyframes Dialog-module_dialog-enter__3NC2w {\n    from {\n      opacity: 0.5;\n      transform: scale(0.8);\n    }\n    to {\n      opacity: 1;\n      transform: scale(1);\n    }\n  }\n\n  @keyframes Dialog-module_dialog-exit__21RUM {\n    from {\n      opacity: 1;\n      transform: scale(1);\n    }\n    to {\n      opacity: 0;\n      transform: scale(0.95);\n    }\n  }\n}\n";
+var styles = {"bui-DialogOverlay":"Dialog-module_bui-DialogOverlay__5nqD5","bui-Dialog":"Dialog-module_bui-Dialog__Cnu24","fade-in":"Dialog-module_fade-in__17nJR","fade-out":"Dialog-module_fade-out__jMAaZ","dialog-enter":"Dialog-module_dialog-enter__3NC2w","dialog-exit":"Dialog-module_dialog-exit__21RUM","bui-DialogHeader":"Dialog-module_bui-DialogHeader__D340y","bui-DialogHeaderTitle":"Dialog-module_bui-DialogHeaderTitle__1UEkF","bui-DialogFooter":"Dialog-module_bui-DialogFooter__k2SK8","bui-DialogBody":"Dialog-module_bui-DialogBody__2olLx"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=Dialog.module.css.esm.js.map

package/dist/components/Dialog/Dialog.module.css.esm.js.map

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

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

@@ -2,14 +2,17 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { FieldError as FieldError$1 } from 'react-aria-components';
 import clsx from 'clsx';
+import styles from './FieldError.module.css.esm.js';
+import { useStyles } from '../../hooks/useStyles.esm.js';
 
 const FieldError = forwardRef(
   (props, ref) => {
-    const { className, ...rest } = props;
+    const { classNames, cleanedProps } = useStyles("FieldError", props);
+    const { className, ...rest } = cleanedProps;
     return /* @__PURE__ */ jsx(
       FieldError$1,
       {
-        className: clsx("bui-FieldError", className),
+        className: clsx(classNames.root, styles[classNames.root], className),
         ref,
         ...rest
       }

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

@@ -1 +1 @@
-{"version":3,"file":"FieldError.esm.js","sources":["../../../src/components/FieldError/FieldError.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport {\n  FieldError as AriaFieldError,\n  type FieldErrorProps,\n} from 'react-aria-components';\nimport clsx from 'clsx';\n\n/** @public */\nexport const FieldError = forwardRef<HTMLDivElement, FieldErrorProps>(\n  (props: FieldErrorProps, ref) => {\n    const { className, ...rest } = props;\n\n    return (\n      <AriaFieldError\n        className={clsx('bui-FieldError', className)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\n\nFieldError.displayName = 'FieldError';\n"],"names":["AriaFieldError"],"mappings":";;;;;AAwBO,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,OAAwB,GAAA,KAAQ;AAC/B,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,IAAA,uBACE,GAAA;AAAA,MAACA,YAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAA,CAAK,gBAAA,EAAkB,SAAS,CAAA;AAAA,QAC3C,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA;;;;"}
+{"version":3,"file":"FieldError.esm.js","sources":["../../../src/components/FieldError/FieldError.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport {\n  FieldError as AriaFieldError,\n  type FieldErrorProps,\n} from 'react-aria-components';\nimport clsx from 'clsx';\nimport styles from './FieldError.module.css';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const FieldError = forwardRef<HTMLDivElement, FieldErrorProps>(\n  (props: FieldErrorProps, ref) => {\n    const { classNames, cleanedProps } = useStyles('FieldError', props);\n    const { className, ...rest } = cleanedProps;\n\n    return (\n      <AriaFieldError\n        className={clsx(classNames.root, styles[classNames.root], className)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\n\nFieldError.displayName = 'FieldError';\n"],"names":["AriaFieldError"],"mappings":";;;;;;;AA0BO,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,OAAwB,GAAA,KAAQ;AAC/B,IAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,cAAc,KAAK,CAAA;AAClE,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,YAAA;AAE/B,IAAA,uBACE,GAAA;AAAA,MAACA,YAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,KAAK,UAAA,CAAW,IAAA,EAAM,OAAO,UAAA,CAAW,IAAI,GAAG,SAAS,CAAA;AAAA,QACnE,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA;;;;"}

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

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer components {\n  .FieldError-module_bui-FieldError__15x0m {\n    display: inline-block;\n    color: var(--bui-fg-danger);\n    font-size: var(--bui-font-size-2);\n    font-weight: var(--bui-font-weight-regular);\n    margin-top: var(--bui-space-2);\n  }\n}\n";
+var styles = {"bui-FieldError":"FieldError-module_bui-FieldError__15x0m"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=FieldError.module.css.esm.js.map

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

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

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

@@ -2,23 +2,60 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { Label } from 'react-aria-components';
 import { forwardRef } from 'react';
 import { useStyles } from '../../hooks/useStyles.esm.js';
+import styles from './FieldLabel.module.css.esm.js';
+import clsx from 'clsx';
 
 const FieldLabel = forwardRef(
   (props, ref) => {
-    const { label, secondaryLabel, description, htmlFor, id, ...rest } = props;
-    const { classNames } = useStyles("FieldLabel");
+    const { classNames, cleanedProps } = useStyles("FieldLabel", props);
+    const { label, secondaryLabel, description, htmlFor, id, ...rest } = cleanedProps;
     if (!label) return null;
-    return /* @__PURE__ */ jsxs("div", { className: classNames.root, ...rest, ref, children: [
-      label && /* @__PURE__ */ jsxs(Label, { className: classNames.label, htmlFor, id, children: [
-        label,
-        secondaryLabel && /* @__PURE__ */ jsxs("span", { "aria-hidden": "true", className: classNames.secondaryLabel, children: [
-          "(",
-          secondaryLabel,
-          ")"
-        ] })
-      ] }),
-      description && /* @__PURE__ */ jsx("div", { className: classNames.description, children: description })
-    ] });
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: clsx(classNames.root, styles[classNames.root]),
+        ...rest,
+        ref,
+        children: [
+          label && /* @__PURE__ */ jsxs(
+            Label,
+            {
+              className: clsx(classNames.label, styles[classNames.label]),
+              htmlFor,
+              id,
+              children: [
+                label,
+                secondaryLabel && /* @__PURE__ */ jsxs(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: clsx(
+                      classNames.secondaryLabel,
+                      styles[classNames.secondaryLabel]
+                    ),
+                    children: [
+                      "(",
+                      secondaryLabel,
+                      ")"
+                    ]
+                  }
+                )
+              ]
+            }
+          ),
+          description && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: clsx(
+                classNames.description,
+                styles[classNames.description]
+              ),
+              children: description
+            }
+          )
+        ]
+      }
+    );
   }
 );
 FieldLabel.displayName = "FieldLabel";

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

@@ -1 +1 @@
-{"version":3,"file":"FieldLabel.esm.js","sources":["../../../src/components/FieldLabel/FieldLabel.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { Label } from 'react-aria-components';\nimport { forwardRef } from 'react';\nimport type { FieldLabelProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\n\n/** @public */\nexport const FieldLabel = forwardRef<HTMLDivElement, FieldLabelProps>(\n  (props: FieldLabelProps, ref) => {\n    const { label, secondaryLabel, description, htmlFor, id, ...rest } = props;\n\n    const { classNames } = useStyles('FieldLabel');\n\n    if (!label) return null;\n\n    return (\n      <div className={classNames.root} {...rest} ref={ref}>\n        {label && (\n          <Label className={classNames.label} htmlFor={htmlFor} id={id}>\n            {label}\n            {secondaryLabel && (\n              <span aria-hidden=\"true\" className={classNames.secondaryLabel}>\n                ({secondaryLabel})\n              </span>\n            )}\n          </Label>\n        )}\n        {description && (\n          <div className={classNames.description}>{description}</div>\n        )}\n      </div>\n    );\n  },\n);\n\nFieldLabel.displayName = 'FieldLabel';\n"],"names":[],"mappings":";;;;;AAqBO,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,OAAwB,GAAA,KAAQ;AAC/B,IAAA,MAAM,EAAE,OAAO,cAAA,EAAgB,WAAA,EAAa,SAAS,EAAA,EAAI,GAAG,MAAK,GAAI,KAAA;AAErE,IAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,YAAY,CAAA;AAE7C,IAAA,IAAI,CAAC,OAAO,OAAO,IAAA;AAEnB,IAAA,4BACG,KAAA,EAAA,EAAI,SAAA,EAAW,WAAW,IAAA,EAAO,GAAG,MAAM,GAAA,EACxC,QAAA,EAAA;AAAA,MAAA,KAAA,yBACE,KAAA,EAAA,EAAM,SAAA,EAAW,UAAA,CAAW,KAAA,EAAO,SAAkB,EAAA,EACnD,QAAA,EAAA;AAAA,QAAA,KAAA;AAAA,QACA,kCACC,IAAA,CAAC,MAAA,EAAA,EAAK,eAAY,MAAA,EAAO,SAAA,EAAW,WAAW,cAAA,EAAgB,QAAA,EAAA;AAAA,UAAA,GAAA;AAAA,UAC3D,cAAA;AAAA,UAAe;AAAA,SAAA,EACnB;AAAA,OAAA,EAEJ,CAAA;AAAA,MAED,+BACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,aAAc,QAAA,EAAA,WAAA,EAAY;AAAA,KAAA,EAEzD,CAAA;AAAA,EAEJ;AACF;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA;;;;"}
+{"version":3,"file":"FieldLabel.esm.js","sources":["../../../src/components/FieldLabel/FieldLabel.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { Label } from 'react-aria-components';\nimport { forwardRef } from 'react';\nimport type { FieldLabelProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport styles from './FieldLabel.module.css';\nimport clsx from 'clsx';\n\n/** @public */\nexport const FieldLabel = forwardRef<HTMLDivElement, FieldLabelProps>(\n  (props: FieldLabelProps, ref) => {\n    const { classNames, cleanedProps } = useStyles('FieldLabel', props);\n    const { label, secondaryLabel, description, htmlFor, id, ...rest } =\n      cleanedProps;\n\n    if (!label) return null;\n\n    return (\n      <div\n        className={clsx(classNames.root, styles[classNames.root])}\n        {...rest}\n        ref={ref}\n      >\n        {label && (\n          <Label\n            className={clsx(classNames.label, styles[classNames.label])}\n            htmlFor={htmlFor}\n            id={id}\n          >\n            {label}\n            {secondaryLabel && (\n              <span\n                aria-hidden=\"true\"\n                className={clsx(\n                  classNames.secondaryLabel,\n                  styles[classNames.secondaryLabel],\n                )}\n              >\n                ({secondaryLabel})\n              </span>\n            )}\n          </Label>\n        )}\n        {description && (\n          <div\n            className={clsx(\n              classNames.description,\n              styles[classNames.description],\n            )}\n          >\n            {description}\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n\nFieldLabel.displayName = 'FieldLabel';\n"],"names":[],"mappings":";;;;;;;AAuBO,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,OAAwB,GAAA,KAAQ;AAC/B,IAAA,MAAM,EAAE,UAAA,EAAY,YAAA,EAAa,GAAI,SAAA,CAAU,cAAc,KAAK,CAAA;AAClE,IAAA,MAAM,EAAE,OAAO,cAAA,EAAgB,WAAA,EAAa,SAAS,EAAA,EAAI,GAAG,MAAK,GAC/D,YAAA;AAEF,IAAA,IAAI,CAAC,OAAO,OAAO,IAAA;AAEnB,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,WAAW,IAAA,CAAK,UAAA,CAAW,MAAM,MAAA,CAAO,UAAA,CAAW,IAAI,CAAC,CAAA;AAAA,QACvD,GAAG,IAAA;AAAA,QACJ,GAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,KAAA,oBACC,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,WAAW,IAAA,CAAK,UAAA,CAAW,OAAO,MAAA,CAAO,UAAA,CAAW,KAAK,CAAC,CAAA;AAAA,cAC1D,OAAA;AAAA,cACA,EAAA;AAAA,cAEC,QAAA,EAAA;AAAA,gBAAA,KAAA;AAAA,gBACA,cAAA,oBACC,IAAA;AAAA,kBAAC,MAAA;AAAA,kBAAA;AAAA,oBACC,aAAA,EAAY,MAAA;AAAA,oBACZ,SAAA,EAAW,IAAA;AAAA,sBACT,UAAA,CAAW,cAAA;AAAA,sBACX,MAAA,CAAO,WAAW,cAAc;AAAA,qBAClC;AAAA,oBACD,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,sBACG,cAAA;AAAA,sBAAe;AAAA;AAAA;AAAA;AACnB;AAAA;AAAA,WAEJ;AAAA,UAED,WAAA,oBACC,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,IAAA;AAAA,gBACT,UAAA,CAAW,WAAA;AAAA,gBACX,MAAA,CAAO,WAAW,WAAW;AAAA,eAC/B;AAAA,cAEC,QAAA,EAAA;AAAA;AAAA;AACH;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA;;;;"}

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

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer components {\n  .FieldLabel-module_bui-FieldLabelWrapper__2jPGW {\n    display: flex;\n    flex-direction: column;\n    margin-bottom: var(--bui-space-3);\n    gap: var(--bui-space-1);\n  }\n\n  .FieldLabel-module_bui-FieldLabel__2w4yy {\n    color: var(--bui-fg-primary);\n    margin-right: auto;\n    cursor: pointer;\n    font-weight: var(--bui-font-weight-regular);\n    font-size: var(--bui-font-size-2);\n  }\n\n  .FieldLabel-module_bui-FieldSecondaryLabel__nH5gD {\n    color: var(--bui-fg-secondary);\n    font-weight: var(--bui-font-weight-regular);\n    margin-left: var(--bui-space-1);\n  }\n\n  .FieldLabel-module_bui-FieldDescription__2BAqV {\n    font-weight: var(--bui-font-weight-regular);\n    font-size: var(--bui-font-size-2);\n    color: var(--bui-fg-secondary);\n    margin: 0;\n  }\n}\n";
+var styles = {"bui-FieldLabelWrapper":"FieldLabel-module_bui-FieldLabelWrapper__2jPGW","bui-FieldLabel":"FieldLabel-module_bui-FieldLabel__2w4yy","bui-FieldSecondaryLabel":"FieldLabel-module_bui-FieldSecondaryLabel__nH5gD","bui-FieldDescription":"FieldLabel-module_bui-FieldDescription__2BAqV"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=FieldLabel.module.css.esm.js.map

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

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