@usefragments/ui 1.7.0 → 2.0.0

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

@@ -1,38 +1,38 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const header = "_header_1ppet_1";
-const fixed = "_fixed_1ppet_29";
-const sticky = "_sticky_1ppet_36";
-const elevatedOnScroll = "_elevatedOnScroll_1ppet_41";
-const scrolled = "_scrolled_1ppet_46";
-const containerPage = "_containerPage_1ppet_50";
-const container = "_container_1ppet_50";
-const navCentered = "_navCentered_1ppet_71";
-const nav = "_nav_1ppet_71";
-const brand = "_brand_1ppet_83";
-const navList = "_navList_1ppet_111";
-const navItem = "_navItem_1ppet_120";
-const navItemActive = "_navItemActive_1ppet_183";
-const navMenuTrigger = "_navMenuTrigger_1ppet_193";
-const navMenuChevron = "_navMenuChevron_1ppet_198";
-const navMenuPositioner = "_navMenuPositioner_1ppet_206";
-const navMenuPopup = "_navMenuPopup_1ppet_211";
-const navMenuItem = "_navMenuItem_1ppet_260";
-const navMenuItemActive = "_navMenuItemActive_1ppet_304";
-const search = "_search_1ppet_326";
-const searchExpandable = "_searchExpandable_1ppet_338";
-const actions = "_actions_1ppet_342";
-const trigger = "_trigger_1ppet_349";
-const spacer = "_spacer_1ppet_417";
-const mobileNavBackdrop = "_mobileNavBackdrop_1ppet_421";
-const mobileNavDrawer = "_mobileNavDrawer_1ppet_429";
-const mobileNavHeader = "_mobileNavHeader_1ppet_443";
-const mobileNavClose = "_mobileNavClose_1ppet_451";
-const mobileNavBody = "_mobileNavBody_1ppet_514";
-const mobileNavLink = "_mobileNavLink_1ppet_520";
-const mobileNavLinkActive = "_mobileNavLinkActive_1ppet_573";
-const mobileNavActions = "_mobileNavActions_1ppet_578";
-const skipLink = "_skipLink_1ppet_607";
+const header = "_header_3qgjx_1";
+const fixed = "_fixed_3qgjx_23";
+const sticky = "_sticky_3qgjx_30";
+const elevatedOnScroll = "_elevatedOnScroll_3qgjx_35";
+const scrolled = "_scrolled_3qgjx_40";
+const containerPage = "_containerPage_3qgjx_44";
+const container = "_container_3qgjx_44";
+const navCentered = "_navCentered_3qgjx_65";
+const nav = "_nav_3qgjx_65";
+const brand = "_brand_3qgjx_77";
+const navList = "_navList_3qgjx_105";
+const navItem = "_navItem_3qgjx_114";
+const navItemActive = "_navItemActive_3qgjx_178";
+const navMenuTrigger = "_navMenuTrigger_3qgjx_188";
+const navMenuChevron = "_navMenuChevron_3qgjx_193";
+const navMenuPositioner = "_navMenuPositioner_3qgjx_201";
+const navMenuPopup = "_navMenuPopup_3qgjx_206";
+const navMenuItem = "_navMenuItem_3qgjx_249";
+const navMenuItemActive = "_navMenuItemActive_3qgjx_294";
+const search = "_search_3qgjx_316";
+const searchExpandable = "_searchExpandable_3qgjx_328";
+const actions = "_actions_3qgjx_332";
+const trigger = "_trigger_3qgjx_339";
+const spacer = "_spacer_3qgjx_408";
+const mobileNavBackdrop = "_mobileNavBackdrop_3qgjx_412";
+const mobileNavDrawer = "_mobileNavDrawer_3qgjx_420";
+const mobileNavHeader = "_mobileNavHeader_3qgjx_466";
+const mobileNavClose = "_mobileNavClose_3qgjx_474";
+const mobileNavBody = "_mobileNavBody_3qgjx_538";
+const mobileNavLink = "_mobileNavLink_3qgjx_544";
+const mobileNavLinkActive = "_mobileNavLinkActive_3qgjx_593";
+const mobileNavActions = "_mobileNavActions_3qgjx_603";
+const skipLink = "_skipLink_3qgjx_632";
 const styles = {
   header,
   fixed,

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

@@ -1,36 +1,36 @@
-const header = "_header_1ppet_1";
-const fixed = "_fixed_1ppet_29";
-const sticky = "_sticky_1ppet_36";
-const elevatedOnScroll = "_elevatedOnScroll_1ppet_41";
-const scrolled = "_scrolled_1ppet_46";
-const containerPage = "_containerPage_1ppet_50";
-const container = "_container_1ppet_50";
-const navCentered = "_navCentered_1ppet_71";
-const nav = "_nav_1ppet_71";
-const brand = "_brand_1ppet_83";
-const navList = "_navList_1ppet_111";
-const navItem = "_navItem_1ppet_120";
-const navItemActive = "_navItemActive_1ppet_183";
-const navMenuTrigger = "_navMenuTrigger_1ppet_193";
-const navMenuChevron = "_navMenuChevron_1ppet_198";
-const navMenuPositioner = "_navMenuPositioner_1ppet_206";
-const navMenuPopup = "_navMenuPopup_1ppet_211";
-const navMenuItem = "_navMenuItem_1ppet_260";
-const navMenuItemActive = "_navMenuItemActive_1ppet_304";
-const search = "_search_1ppet_326";
-const searchExpandable = "_searchExpandable_1ppet_338";
-const actions = "_actions_1ppet_342";
-const trigger = "_trigger_1ppet_349";
-const spacer = "_spacer_1ppet_417";
-const mobileNavBackdrop = "_mobileNavBackdrop_1ppet_421";
-const mobileNavDrawer = "_mobileNavDrawer_1ppet_429";
-const mobileNavHeader = "_mobileNavHeader_1ppet_443";
-const mobileNavClose = "_mobileNavClose_1ppet_451";
-const mobileNavBody = "_mobileNavBody_1ppet_514";
-const mobileNavLink = "_mobileNavLink_1ppet_520";
-const mobileNavLinkActive = "_mobileNavLinkActive_1ppet_573";
-const mobileNavActions = "_mobileNavActions_1ppet_578";
-const skipLink = "_skipLink_1ppet_607";
+const header = "_header_3qgjx_1";
+const fixed = "_fixed_3qgjx_23";
+const sticky = "_sticky_3qgjx_30";
+const elevatedOnScroll = "_elevatedOnScroll_3qgjx_35";
+const scrolled = "_scrolled_3qgjx_40";
+const containerPage = "_containerPage_3qgjx_44";
+const container = "_container_3qgjx_44";
+const navCentered = "_navCentered_3qgjx_65";
+const nav = "_nav_3qgjx_65";
+const brand = "_brand_3qgjx_77";
+const navList = "_navList_3qgjx_105";
+const navItem = "_navItem_3qgjx_114";
+const navItemActive = "_navItemActive_3qgjx_178";
+const navMenuTrigger = "_navMenuTrigger_3qgjx_188";
+const navMenuChevron = "_navMenuChevron_3qgjx_193";
+const navMenuPositioner = "_navMenuPositioner_3qgjx_201";
+const navMenuPopup = "_navMenuPopup_3qgjx_206";
+const navMenuItem = "_navMenuItem_3qgjx_249";
+const navMenuItemActive = "_navMenuItemActive_3qgjx_294";
+const search = "_search_3qgjx_316";
+const searchExpandable = "_searchExpandable_3qgjx_328";
+const actions = "_actions_3qgjx_332";
+const trigger = "_trigger_3qgjx_339";
+const spacer = "_spacer_3qgjx_408";
+const mobileNavBackdrop = "_mobileNavBackdrop_3qgjx_412";
+const mobileNavDrawer = "_mobileNavDrawer_3qgjx_420";
+const mobileNavHeader = "_mobileNavHeader_3qgjx_466";
+const mobileNavClose = "_mobileNavClose_3qgjx_474";
+const mobileNavBody = "_mobileNavBody_3qgjx_538";
+const mobileNavLink = "_mobileNavLink_3qgjx_544";
+const mobileNavLinkActive = "_mobileNavLinkActive_3qgjx_593";
+const mobileNavActions = "_mobileNavActions_3qgjx_603";
+const skipLink = "_skipLink_3qgjx_632";
 const styles = {
   header,
   fixed,

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_vwqu6_1";
-const xs = "_xs_vwqu6_13";
-const sm = "_sm_vwqu6_19";
-const md = "_md_vwqu6_25";
-const lg = "_lg_vwqu6_31";
-const xl = "_xl_vwqu6_37";
-const size2xl = "_size2xl_vwqu6_43";
-const size2Xl = "_size2xl_vwqu6_43";
-const primary = "_primary_vwqu6_49";
-const secondary = "_secondary_vwqu6_53";
-const tertiary = "_tertiary_vwqu6_57";
-const accent = "_accent_vwqu6_61";
-const success = "_success_vwqu6_65";
-const warning = "_warning_vwqu6_69";
-const error = "_error_vwqu6_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_vwqu6_1";
-const xs = "_xs_vwqu6_13";
-const sm = "_sm_vwqu6_19";
-const md = "_md_vwqu6_25";
-const lg = "_lg_vwqu6_31";
-const xl = "_xl_vwqu6_37";
-const size2xl = "_size2xl_vwqu6_43";
-const size2Xl = "_size2xl_vwqu6_43";
-const primary = "_primary_vwqu6_49";
-const secondary = "_secondary_vwqu6_53";
-const tertiary = "_tertiary_vwqu6_57";
-const accent = "_accent_vwqu6_61";
-const success = "_success_vwqu6_65";
-const warning = "_warning_vwqu6_69";
-const error = "_error_vwqu6_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_t4bdq_1";
-const sm = "_sm_t4bdq_53";
-const md = "_md_t4bdq_87";
-const lg = "_lg_t4bdq_108";
-const ghost = "_ghost_t4bdq_129";
-const subtle = "_subtle_t4bdq_136";
-const outlined = "_outlined_t4bdq_146";
-const pressed = "_pressed_t4bdq_157";
+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_t4bdq_1";
-const sm = "_sm_t4bdq_53";
-const md = "_md_t4bdq_87";
-const lg = "_lg_t4bdq_108";
-const ghost = "_ghost_t4bdq_129";
-const subtle = "_subtle_t4bdq_136";
-const outlined = "_outlined_t4bdq_146";
-const pressed = "_pressed_t4bdq_157";
+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.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;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,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/Input/Input.module.scss.cjs

@@ -1,22 +1,20 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const wrapper = "_wrapper_2s7a9_1";
-const label = "_label_2s7a9_8";
-const required = "_required_2s7a9_17";
-const helper = "_helper_2s7a9_22";
-const helperError = "_helperError_2s7a9_32";
-const errorMessage = "_errorMessage_2s7a9_33";
-const input = "_input_2s7a9_43";
-const sm = "_sm_2s7a9_74";
-const md = "_md_2s7a9_85";
-const lg = "_lg_2s7a9_96";
-const error = "_error_2s7a9_33";
-const success = "_success_2s7a9_118";
-const helperSuccess = "_helperSuccess_2s7a9_132";
-const inputContainer = "_inputContainer_2s7a9_136";
-const hasAdornment = "_hasAdornment_2s7a9_143";
-const shortcut = "_shortcut_2s7a9_144";
-const adornment = "_adornment_2s7a9_238";
+const wrapper = "_wrapper_ydgym_1";
+const label = "_label_ydgym_8";
+const required = "_required_ydgym_17";
+const helper = "_helper_ydgym_22";
+const helperError = "_helperError_ydgym_32";
+const errorMessage = "_errorMessage_ydgym_33";
+const input = "_input_ydgym_43";
+const sm = "_sm_ydgym_81";
+const md = "_md_ydgym_92";
+const lg = "_lg_ydgym_104";
+const error = "_error_ydgym_33";
+const inputContainer = "_inputContainer_ydgym_131";
+const hasAdornment = "_hasAdornment_ydgym_138";
+const shortcut = "_shortcut_ydgym_139";
+const adornment = "_adornment_ydgym_226";
 const styles = {
   wrapper,
   label,
@@ -29,8 +27,6 @@ const styles = {
   md,
   lg,
   error,
-  success,
-  helperSuccess,
   inputContainer,
   hasAdornment,
   shortcut,
@@ -43,7 +39,6 @@ exports.errorMessage = errorMessage;
 exports.hasAdornment = hasAdornment;
 exports.helper = helper;
 exports.helperError = helperError;
-exports.helperSuccess = helperSuccess;
 exports.input = input;
 exports.inputContainer = inputContainer;
 exports.label = label;
@@ -52,5 +47,4 @@ exports.md = md;
 exports.required = required;
 exports.shortcut = shortcut;
 exports.sm = sm;
-exports.success = success;
 exports.wrapper = wrapper;