@usefragments/ui 1.6.0 → 2.0.0

package/dist/components/Icon/Icon.module.scss.cjs

@@ -1,20 +1,19 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const icon = "_icon_1snja_1";
-const xs = "_xs_1snja_13";
-const sm = "_sm_1snja_19";
-const md = "_md_1snja_25";
-const lg = "_lg_1snja_31";
-const xl = "_xl_1snja_37";
-const size2xl = "_size2xl_1snja_43";
-const size2Xl = "_size2xl_1snja_43";
-const primary = "_primary_1snja_49";
-const secondary = "_secondary_1snja_53";
-const tertiary = "_tertiary_1snja_57";
-const accent = "_accent_1snja_61";
-const success = "_success_1snja_65";
-const warning = "_warning_1snja_69";
-const error = "_error_1snja_73";
+const icon = "_icon_8ze26_1";
+const xs = "_xs_8ze26_13";
+const sm = "_sm_8ze26_19";
+const md = "_md_8ze26_25";
+const lg = "_lg_8ze26_31";
+const xl = "_xl_8ze26_37";
+const colorPrimary = "_colorPrimary_8ze26_43";
+const colorSecondary = "_colorSecondary_8ze26_47";
+const colorTertiary = "_colorTertiary_8ze26_51";
+const toneAccent = "_toneAccent_8ze26_55";
+const toneInfo = "_toneInfo_8ze26_59";
+const toneSuccess = "_toneSuccess_8ze26_63";
+const toneWarning = "_toneWarning_8ze26_67";
+const toneDanger = "_toneDanger_8ze26_71";
 const styles = {
   icon,
   xs,
@@ -22,29 +21,27 @@ const styles = {
   md,
   lg,
   xl,
-  size2xl,
-  size2Xl,
-  primary,
-  secondary,
-  tertiary,
-  accent,
-  success,
-  warning,
-  error
+  colorPrimary,
+  colorSecondary,
+  colorTertiary,
+  toneAccent,
+  toneInfo,
+  toneSuccess,
+  toneWarning,
+  toneDanger
 };
-exports.accent = accent;
+exports.colorPrimary = colorPrimary;
+exports.colorSecondary = colorSecondary;
+exports.colorTertiary = colorTertiary;
 exports.default = styles;
-exports.error = error;
 exports.icon = icon;
 exports.lg = lg;
 exports.md = md;
-exports.primary = primary;
-exports.secondary = secondary;
-exports.size2Xl = size2Xl;
-exports.size2xl = size2xl;
 exports.sm = sm;
-exports.success = success;
-exports.tertiary = tertiary;
-exports.warning = warning;
+exports.toneAccent = toneAccent;
+exports.toneDanger = toneDanger;
+exports.toneInfo = toneInfo;
+exports.toneSuccess = toneSuccess;
+exports.toneWarning = toneWarning;
 exports.xl = xl;
 exports.xs = xs;

package/dist/components/Icon/Icon.module.scss.js

@@ -1,18 +1,17 @@
-const icon = "_icon_1snja_1";
-const xs = "_xs_1snja_13";
-const sm = "_sm_1snja_19";
-const md = "_md_1snja_25";
-const lg = "_lg_1snja_31";
-const xl = "_xl_1snja_37";
-const size2xl = "_size2xl_1snja_43";
-const size2Xl = "_size2xl_1snja_43";
-const primary = "_primary_1snja_49";
-const secondary = "_secondary_1snja_53";
-const tertiary = "_tertiary_1snja_57";
-const accent = "_accent_1snja_61";
-const success = "_success_1snja_65";
-const warning = "_warning_1snja_69";
-const error = "_error_1snja_73";
+const icon = "_icon_8ze26_1";
+const xs = "_xs_8ze26_13";
+const sm = "_sm_8ze26_19";
+const md = "_md_8ze26_25";
+const lg = "_lg_8ze26_31";
+const xl = "_xl_8ze26_37";
+const colorPrimary = "_colorPrimary_8ze26_43";
+const colorSecondary = "_colorSecondary_8ze26_47";
+const colorTertiary = "_colorTertiary_8ze26_51";
+const toneAccent = "_toneAccent_8ze26_55";
+const toneInfo = "_toneInfo_8ze26_59";
+const toneSuccess = "_toneSuccess_8ze26_63";
+const toneWarning = "_toneWarning_8ze26_67";
+const toneDanger = "_toneDanger_8ze26_71";
 const styles = {
   icon,
   xs,
@@ -20,31 +19,29 @@ const styles = {
   md,
   lg,
   xl,
-  size2xl,
-  size2Xl,
-  primary,
-  secondary,
-  tertiary,
-  accent,
-  success,
-  warning,
-  error
+  colorPrimary,
+  colorSecondary,
+  colorTertiary,
+  toneAccent,
+  toneInfo,
+  toneSuccess,
+  toneWarning,
+  toneDanger
 };
 export {
-  accent,
+  colorPrimary,
+  colorSecondary,
+  colorTertiary,
   styles as default,
-  error,
   icon,
   lg,
   md,
-  primary,
-  secondary,
-  size2Xl,
-  size2xl,
   sm,
-  success,
-  tertiary,
-  warning,
+  toneAccent,
+  toneDanger,
+  toneInfo,
+  toneSuccess,
+  toneWarning,
   xl,
   xs
 };

package/dist/components/Icon/index.cjs

@@ -23,22 +23,23 @@ function _interopNamespaceDefault(e) {
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
 const iconTargets = generated.MEASUREMENT_PROFILES.targets.icon;
-const IconRoot = React__namespace.forwardRef(function Icon2({
-  icon: IconComponent,
-  size = "md",
-  weight = "regular",
-  variant,
-  color,
-  iconProps,
-  className,
-  style,
-  ...htmlProps
-}, ref) {
-  const colorVariant = variant || color;
+const TONE_CLASS = {
+  accent: Icon_module.default.toneAccent,
+  info: Icon_module.default.toneInfo,
+  success: Icon_module.default.toneSuccess,
+  warning: Icon_module.default.toneWarning,
+  danger: Icon_module.default.toneDanger
+};
+const COLOR_CLASS = {
+  primary: Icon_module.default.colorPrimary,
+  secondary: Icon_module.default.colorSecondary,
+  tertiary: Icon_module.default.colorTertiary
+};
+const IconRoot = React__namespace.forwardRef(function Icon2({ icon: IconComponent, size = "md", weight = "regular", tone, color, iconProps, className, style, ...htmlProps }, ref) {
   const classes = [
     Icon_module.default.icon,
-    size === "2xl" ? Icon_module.default.size2xl : Icon_module.default[size],
-    colorVariant && colorVariant !== "default" && Icon_module.default[colorVariant],
+    Icon_module.default[size],
+    tone ? TONE_CLASS[tone] : color ? COLOR_CLASS[color] : void 0,
     className
   ].filter(Boolean).join(" ");
   const resolvedIconProps = {

package/dist/components/Icon/index.d.ts

@@ -1,31 +1,42 @@
 import * as React from "react";
 type AnyIconComponent = React.ComponentType<any>;
 type IconComponentProps<TIcon extends AnyIconComponent> = React.ComponentPropsWithoutRef<TIcon>;
+export type IconSize = "xs" | "sm" | "md" | "lg" | "xl";
+export type IconTone = "accent" | "info" | "success" | "warning" | "danger";
+export type IconColor = "primary" | "secondary" | "tertiary";
 export type IconProps<TIcon extends AnyIconComponent = AnyIconComponent> = Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & {
     /** The icon component to render */
     icon: TIcon;
-    /** Size of the icon */
-    size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+    /** Size of the icon. `xl` is the largest step (24px); the glyph inherits
+     * `currentColor` and the surrounding line height.
+     * @default "md" */
+    size?: IconSize;
     /** Optional style/weight hint forwarded when the icon component supports a `weight` prop */
     weight?: string;
-    /** Semantic color variant */
-    variant?: "default" | "primary" | "secondary" | "tertiary" | "accent" | "success" | "warning" | "error";
-    /** @deprecated Use variant instead */
-    color?: "primary" | "secondary" | "tertiary" | "accent" | "success" | "warning" | "error";
+    /** Semantic colour. Reserve `success`, `warning` and `danger` for real
+     * state; `accent` is the brand spend. Omit to inherit `currentColor`. */
+    tone?: IconTone;
+    /** Text-hierarchy colour, the same axis as Text's `color`. `tone` wins when
+     * both are set. Omit to inherit `currentColor`. */
+    color?: IconColor;
     /** Additional props forwarded to the underlying icon component (typed from `icon`) */
     iconProps?: Partial<IconComponentProps<TIcon>>;
 };
 declare const IconRoot: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLSpanElement>, "color"> & {
     /** The icon component to render */
     icon: AnyIconComponent;
-    /** Size of the icon */
-    size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+    /** Size of the icon. `xl` is the largest step (24px); the glyph inherits
+     * `currentColor` and the surrounding line height.
+     * @default "md" */
+    size?: IconSize;
     /** Optional style/weight hint forwarded when the icon component supports a `weight` prop */
     weight?: string;
-    /** Semantic color variant */
-    variant?: "default" | "primary" | "secondary" | "tertiary" | "accent" | "success" | "warning" | "error";
-    /** @deprecated Use variant instead */
-    color?: "primary" | "secondary" | "tertiary" | "accent" | "success" | "warning" | "error";
+    /** Semantic colour. Reserve `success`, `warning` and `danger` for real
+     * state; `accent` is the brand spend. Omit to inherit `currentColor`. */
+    tone?: IconTone;
+    /** Text-hierarchy colour, the same axis as Text's `color`. `tone` wins when
+     * both are set. Omit to inherit `currentColor`. */
+    color?: IconColor;
     /** Additional props forwarded to the underlying icon component (typed from `icon`) */
     iconProps?: Partial<Omit<any, "ref">> | undefined;
 } & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/Icon/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;AACjD,KAAK,kBAAkB,CAAC,KAAK,SAAS,gBAAgB,IAAI,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAEhG,MAAM,MAAM,SAAS,CAAC,KAAK,SAAS,gBAAgB,GAAG,gBAAgB,IAAI,IAAI,CAC7E,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,EACrC,OAAO,CACR,GAAG;IACF,mCAAmC;IACnC,IAAI,EAAE,KAAK,CAAC;IACZ,uBAAuB;IACvB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;IAChD,4FAA4F;IAC5F,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6BAA6B;IAC7B,OAAO,CAAC,EACJ,SAAS,GACT,SAAS,GACT,WAAW,GACX,UAAU,GACV,QAAQ,GACR,SAAS,GACT,SAAS,GACT,OAAO,CAAC;IACZ,sCAAsC;IACtC,KAAK,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAC1F,sFAAsF;IACtF,SAAS,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAC;CAChD,CAAC;AAKF,QAAA,MAAM,QAAQ;IAzBZ,mCAAmC;;IAEnC,uBAAuB;WAChB,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK;IAC/C,4FAA4F;aACnF,MAAM;IACf,6BAA6B;cAEzB,SAAS,GACT,SAAS,GACT,WAAW,GACX,UAAU,GACV,QAAQ,GACR,SAAS,GACT,SAAS,GACT,OAAO;IACX,sCAAsC;YAC9B,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO;IACzF,sFAAsF;;yCAkDtF,CAAC;AAEH,KAAK,sBAAsB,GAAG,CAAC,KAAK,SAAS,gBAAgB,GAAG,gBAAgB,EAC9E,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,KAC3D,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B,eAAO,MAAM,IAAI,EAEX,OAAO,QAAQ,GACnB,sBAAsB,GAAG;IACvB,IAAI,EAAE,OAAO,QAAQ,CAAC;CACvB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;AACjD,KAAK,kBAAkB,CAAC,KAAK,SAAS,gBAAgB,IAAI,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC;AAEhG,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACxD,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAC5E,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAE7D,MAAM,MAAM,SAAS,CAAC,KAAK,SAAS,gBAAgB,GAAG,gBAAgB,IAAI,IAAI,CAC7E,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,EACrC,OAAO,CACR,GAAG;IACF,mCAAmC;IACnC,IAAI,EAAE,KAAK,CAAC;IACZ;;uBAEmB;IACnB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,4FAA4F;IAC5F,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;6EACyE;IACzE,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;uDACmD;IACnD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,sFAAsF;IACtF,SAAS,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAC;CAChD,CAAC;AAkBF,QAAA,MAAM,QAAQ;IAlCZ,mCAAmC;;IAEnC;;uBAEmB;WACZ,QAAQ;IACf,4FAA4F;aACnF,MAAM;IACf;6EACyE;WAClE,QAAQ;IACf;uDACmD;YAC3C,SAAS;IACjB,sFAAsF;;yCAkDtF,CAAC;AAEH,KAAK,sBAAsB,GAAG,CAAC,KAAK,SAAS,gBAAgB,GAAG,gBAAgB,EAC9E,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,KAC3D,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B,eAAO,MAAM,IAAI,EAEX,OAAO,QAAQ,GACnB,sBAAsB,GAAG;IACvB,IAAI,EAAE,OAAO,QAAQ,CAAC;CACvB,CAAC"}

package/dist/components/Icon/index.js

@@ -4,22 +4,23 @@ import * as React from "react";
 import { measurementPx, MEASUREMENT_PROFILES } from "../../measurements/generated.js";
 import styles from "./Icon.module.scss.js";
 const iconTargets = MEASUREMENT_PROFILES.targets.icon;
-const IconRoot = React.forwardRef(function Icon2({
-  icon: IconComponent,
-  size = "md",
-  weight = "regular",
-  variant,
-  color,
-  iconProps,
-  className,
-  style,
-  ...htmlProps
-}, ref) {
-  const colorVariant = variant || color;
+const TONE_CLASS = {
+  accent: styles.toneAccent,
+  info: styles.toneInfo,
+  success: styles.toneSuccess,
+  warning: styles.toneWarning,
+  danger: styles.toneDanger
+};
+const COLOR_CLASS = {
+  primary: styles.colorPrimary,
+  secondary: styles.colorSecondary,
+  tertiary: styles.colorTertiary
+};
+const IconRoot = React.forwardRef(function Icon2({ icon: IconComponent, size = "md", weight = "regular", tone, color, iconProps, className, style, ...htmlProps }, ref) {
   const classes = [
     styles.icon,
-    size === "2xl" ? styles.size2xl : styles[size],
-    colorVariant && colorVariant !== "default" && styles[colorVariant],
+    styles[size],
+    tone ? TONE_CLASS[tone] : color ? COLOR_CLASS[color] : void 0,
     className
   ].filter(Boolean).join(" ");
   const resolvedIconProps = {

package/dist/components/IconButton/IconButton.module.scss.cjs

@@ -1,21 +1,21 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const iconButton = "_iconButton_uzoqd_1";
-const sm = "_sm_uzoqd_51";
-const md = "_md_uzoqd_85";
-const lg = "_lg_uzoqd_106";
-const ghost = "_ghost_uzoqd_127";
-const subtle = "_subtle_uzoqd_134";
-const outlined = "_outlined_uzoqd_144";
-const pressed = "_pressed_uzoqd_155";
+const iconButton = "_iconButton_1w3xn_1";
+const sm = "_sm_1w3xn_67";
+const md = "_md_1w3xn_100";
+const lg = "_lg_1w3xn_121";
+const ghost = "_ghost_1w3xn_142";
+const soft = "_soft_1w3xn_149";
+const outline = "_outline_1w3xn_159";
+const pressed = "_pressed_1w3xn_170";
 const styles = {
   iconButton,
   sm,
   md,
   lg,
   ghost,
-  subtle,
-  outlined,
+  soft,
+  outline,
   pressed
 };
 exports.default = styles;
@@ -23,7 +23,7 @@ exports.ghost = ghost;
 exports.iconButton = iconButton;
 exports.lg = lg;
 exports.md = md;
-exports.outlined = outlined;
+exports.outline = outline;
 exports.pressed = pressed;
 exports.sm = sm;
-exports.subtle = subtle;
+exports.soft = soft;

package/dist/components/IconButton/IconButton.module.scss.js

@@ -1,19 +1,19 @@
-const iconButton = "_iconButton_uzoqd_1";
-const sm = "_sm_uzoqd_51";
-const md = "_md_uzoqd_85";
-const lg = "_lg_uzoqd_106";
-const ghost = "_ghost_uzoqd_127";
-const subtle = "_subtle_uzoqd_134";
-const outlined = "_outlined_uzoqd_144";
-const pressed = "_pressed_uzoqd_155";
+const iconButton = "_iconButton_1w3xn_1";
+const sm = "_sm_1w3xn_67";
+const md = "_md_1w3xn_100";
+const lg = "_lg_1w3xn_121";
+const ghost = "_ghost_1w3xn_142";
+const soft = "_soft_1w3xn_149";
+const outline = "_outline_1w3xn_159";
+const pressed = "_pressed_1w3xn_170";
 const styles = {
   iconButton,
   sm,
   md,
   lg,
   ghost,
-  subtle,
-  outlined,
+  soft,
+  outline,
   pressed
 };
 export {
@@ -22,8 +22,8 @@ export {
   iconButton,
   lg,
   md,
-  outlined,
+  outline,
   pressed,
   sm,
-  subtle
+  soft
 };

package/dist/components/IconButton/index.cjs

@@ -6,6 +6,7 @@ const React = require("react");
 const button = require("@base-ui/react/button");
 const index = require("../ComponentDefaults/index.cjs");
 const IconButton_module = require("./IconButton.module.scss.cjs");
+const env = require("../../utils/env.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
@@ -34,7 +35,7 @@ const IconButtonRoot = React__namespace.forwardRef(function IconButton2({
   type = "button",
   ...htmlProps
 }, ref) {
-  if (process.env.NODE_ENV !== "production" && !ariaLabel && !ariaLabelledBy) {
+  if (!env.isProductionBuild() && !ariaLabel && !ariaLabelledBy) {
     console.warn(
       "[IconButton] Icon-only buttons need an accessible name. Provide `aria-label` or `aria-labelledby`."
     );

package/dist/components/IconButton/index.d.ts

@@ -18,12 +18,12 @@ export interface IconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLBut
      *
      * - `ghost` (default): transparent at rest, subtle hover. Fits inside
      *   dense topbars and row affordances.
-     * - `subtle`: painted with the tertiary surface; use when the affordance
+     * - `soft`: painted with the tertiary surface; use when the affordance
      *   sits on a matching surface and needs a touch more weight.
-     * - `outlined`: hairline border; use as a secondary control alongside a
-     *   primary `Button`.
+     * - `outline`: hairline border; use as a secondary control alongside a
+     *   solid `Button`.
      * @default "ghost" */
-    variant?: "ghost" | "subtle" | "outlined";
+    variant?: "ghost" | "soft" | "outline";
     /** Button size. Uses the same height ladder as Button so icon-only
      * affordances align with toolbar actions and adjacent fields.
      * @default "md" */

package/dist/components/IconButton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/IconButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,UAAU,CACX;IACC,iEAAiE;IACjE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;;;;;0BAQsB;IACtB,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC1C;;uBAEmB;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B;iDAC6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAgDD,eAAO,MAAM,UAAU;;CAErB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/IconButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,UAAU,CACX;IACC,iEAAiE;IACjE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;;;;;0BAQsB;IACtB,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;IACvC;;uBAEmB;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B;iDAC6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAgDD,eAAO,MAAM,UAAU;;CAErB,CAAC"}

package/dist/components/IconButton/index.js

@@ -4,6 +4,7 @@ import * as React from "react";
 import { Button } from "@base-ui/react/button";
 import { useResolvedControlSize } from "../ComponentDefaults/index.js";
 import styles from "./IconButton.module.scss.js";
+import { isProductionBuild } from "../../utils/env.js";
 const IconButtonRoot = React.forwardRef(function IconButton2({
   children,
   variant = "ghost",
@@ -15,7 +16,7 @@ const IconButtonRoot = React.forwardRef(function IconButton2({
   type = "button",
   ...htmlProps
 }, ref) {
-  if (process.env.NODE_ENV !== "production" && !ariaLabel && !ariaLabelledBy) {
+  if (!isProductionBuild() && !ariaLabel && !ariaLabelledBy) {
     console.warn(
       "[IconButton] Icon-only buttons need an accessible name. Provide `aria-label` or `aria-labelledby`."
     );

package/dist/components/Image/Image.module.scss.cjs

@@ -1,46 +1,46 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const imageContainer = "_imageContainer_slsaf_1";
-const image = "_image_slsaf_1";
-const fitCover = "_fit-cover_slsaf_15";
-const fitContain = "_fit-contain_slsaf_19";
-const fitFill = "_fit-fill_slsaf_23";
-const fitNone = "_fit-none_slsaf_27";
-const aspect11 = "_aspect-1-1_slsaf_31";
-const aspect43 = "_aspect-4-3_slsaf_35";
-const aspect169 = "_aspect-16-9_slsaf_39";
-const aspect219 = "_aspect-21-9_slsaf_43";
-const roundedSm = "_rounded-sm_slsaf_47";
-const roundedMd = "_rounded-md_slsaf_51";
-const roundedLg = "_rounded-lg_slsaf_55";
-const roundedFull = "_rounded-full_slsaf_59";
-const fallback = "_fallback_slsaf_63";
+const imageContainer = "_imageContainer_1ful1_1";
+const image = "_image_1ful1_1";
+const fitCover = "_fit-cover_1ful1_15";
+const fitContain = "_fit-contain_1ful1_19";
+const fitFill = "_fit-fill_1ful1_23";
+const fitNone = "_fit-none_1ful1_27";
+const aspect11 = "_aspect-1-1_1ful1_31";
+const aspect43 = "_aspect-4-3_1ful1_35";
+const aspect169 = "_aspect-16-9_1ful1_39";
+const aspect219 = "_aspect-21-9_1ful1_43";
+const roundedSm = "_rounded-sm_1ful1_47";
+const roundedMd = "_rounded-md_1ful1_51";
+const roundedLg = "_rounded-lg_1ful1_55";
+const roundedFull = "_rounded-full_1ful1_59";
+const fallback = "_fallback_1ful1_63";
 const styles = {
   imageContainer,
   image,
-  "fit-cover": "_fit-cover_slsaf_15",
+  "fit-cover": "_fit-cover_1ful1_15",
   fitCover,
-  "fit-contain": "_fit-contain_slsaf_19",
+  "fit-contain": "_fit-contain_1ful1_19",
   fitContain,
-  "fit-fill": "_fit-fill_slsaf_23",
+  "fit-fill": "_fit-fill_1ful1_23",
   fitFill,
-  "fit-none": "_fit-none_slsaf_27",
+  "fit-none": "_fit-none_1ful1_27",
   fitNone,
-  "aspect-1-1": "_aspect-1-1_slsaf_31",
+  "aspect-1-1": "_aspect-1-1_1ful1_31",
   aspect11,
-  "aspect-4-3": "_aspect-4-3_slsaf_35",
+  "aspect-4-3": "_aspect-4-3_1ful1_35",
   aspect43,
-  "aspect-16-9": "_aspect-16-9_slsaf_39",
+  "aspect-16-9": "_aspect-16-9_1ful1_39",
   aspect169,
-  "aspect-21-9": "_aspect-21-9_slsaf_43",
+  "aspect-21-9": "_aspect-21-9_1ful1_43",
   aspect219,
-  "rounded-sm": "_rounded-sm_slsaf_47",
+  "rounded-sm": "_rounded-sm_1ful1_47",
   roundedSm,
-  "rounded-md": "_rounded-md_slsaf_51",
+  "rounded-md": "_rounded-md_1ful1_51",
   roundedMd,
-  "rounded-lg": "_rounded-lg_slsaf_55",
+  "rounded-lg": "_rounded-lg_1ful1_55",
   roundedLg,
-  "rounded-full": "_rounded-full_slsaf_59",
+  "rounded-full": "_rounded-full_1ful1_59",
   roundedFull,
   fallback
 };

package/dist/components/Image/Image.module.scss.js

@@ -1,44 +1,44 @@
-const imageContainer = "_imageContainer_slsaf_1";
-const image = "_image_slsaf_1";
-const fitCover = "_fit-cover_slsaf_15";
-const fitContain = "_fit-contain_slsaf_19";
-const fitFill = "_fit-fill_slsaf_23";
-const fitNone = "_fit-none_slsaf_27";
-const aspect11 = "_aspect-1-1_slsaf_31";
-const aspect43 = "_aspect-4-3_slsaf_35";
-const aspect169 = "_aspect-16-9_slsaf_39";
-const aspect219 = "_aspect-21-9_slsaf_43";
-const roundedSm = "_rounded-sm_slsaf_47";
-const roundedMd = "_rounded-md_slsaf_51";
-const roundedLg = "_rounded-lg_slsaf_55";
-const roundedFull = "_rounded-full_slsaf_59";
-const fallback = "_fallback_slsaf_63";
+const imageContainer = "_imageContainer_1ful1_1";
+const image = "_image_1ful1_1";
+const fitCover = "_fit-cover_1ful1_15";
+const fitContain = "_fit-contain_1ful1_19";
+const fitFill = "_fit-fill_1ful1_23";
+const fitNone = "_fit-none_1ful1_27";
+const aspect11 = "_aspect-1-1_1ful1_31";
+const aspect43 = "_aspect-4-3_1ful1_35";
+const aspect169 = "_aspect-16-9_1ful1_39";
+const aspect219 = "_aspect-21-9_1ful1_43";
+const roundedSm = "_rounded-sm_1ful1_47";
+const roundedMd = "_rounded-md_1ful1_51";
+const roundedLg = "_rounded-lg_1ful1_55";
+const roundedFull = "_rounded-full_1ful1_59";
+const fallback = "_fallback_1ful1_63";
 const styles = {
   imageContainer,
   image,
-  "fit-cover": "_fit-cover_slsaf_15",
+  "fit-cover": "_fit-cover_1ful1_15",
   fitCover,
-  "fit-contain": "_fit-contain_slsaf_19",
+  "fit-contain": "_fit-contain_1ful1_19",
   fitContain,
-  "fit-fill": "_fit-fill_slsaf_23",
+  "fit-fill": "_fit-fill_1ful1_23",
   fitFill,
-  "fit-none": "_fit-none_slsaf_27",
+  "fit-none": "_fit-none_1ful1_27",
   fitNone,
-  "aspect-1-1": "_aspect-1-1_slsaf_31",
+  "aspect-1-1": "_aspect-1-1_1ful1_31",
   aspect11,
-  "aspect-4-3": "_aspect-4-3_slsaf_35",
+  "aspect-4-3": "_aspect-4-3_1ful1_35",
   aspect43,
-  "aspect-16-9": "_aspect-16-9_slsaf_39",
+  "aspect-16-9": "_aspect-16-9_1ful1_39",
   aspect169,
-  "aspect-21-9": "_aspect-21-9_slsaf_43",
+  "aspect-21-9": "_aspect-21-9_1ful1_43",
   aspect219,
-  "rounded-sm": "_rounded-sm_slsaf_47",
+  "rounded-sm": "_rounded-sm_1ful1_47",
   roundedSm,
-  "rounded-md": "_rounded-md_slsaf_51",
+  "rounded-md": "_rounded-md_1ful1_51",
   roundedMd,
-  "rounded-lg": "_rounded-lg_slsaf_55",
+  "rounded-lg": "_rounded-lg_1ful1_55",
   roundedLg,
-  "rounded-full": "_rounded-full_slsaf_59",
+  "rounded-full": "_rounded-full_1ful1_59",
   roundedFull,
   fallback
 };