@homebound/beam 3.6.0 → 3.8.0

package/dist/index.d.cts

@@ -1,7 +1,7 @@
 import * as csstype from 'csstype';
 import { Properties as Properties$1 } from 'csstype';
 import * as React$1 from 'react';
-import React__default, { PropsWithChildren, AriaAttributes, ReactNode, ReactElement, MutableRefObject, Dispatch, SetStateAction, RefObject, ButtonHTMLAttributes, KeyboardEvent, LabelHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, Key, HTMLAttributes, ReactPortal } from 'react';
+import React__default, { PropsWithChildren, ReactNode, AriaAttributes, ReactElement, MutableRefObject, Dispatch, SetStateAction, RefObject, ButtonHTMLAttributes, KeyboardEvent, LabelHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, Key, HTMLAttributes, ReactPortal } from 'react';
 import { Temporal } from 'temporal-polyfill';
 import { DOMProps, PressEvent, Key as Key$1 } from '@react-types/shared';
 import { VirtuosoHandle, ListRange } from 'react-virtuoso';
@@ -40,6 +40,78 @@ type RuntimeStyles = RawCssProperties & {
     readonly __kind: "runtime";
 };
 type Typography = "xs2" | "xs2Sb" | "xs" | "xsSb" | "sm" | "smSb" | "md" | "mdSb" | "lg" | "xl" | "xl2";
+declare enum Tokens {
+    ButtonCautionDisabledBg = "--b-button-caution-disabled-bg",
+    ButtonCautionDisabledFg = "--b-button-caution-disabled-fg",
+    ButtonDangerDisabledBg = "--b-button-danger-disabled-bg",
+    ButtonDangerDisabledFg = "--b-button-danger-disabled-fg",
+    ButtonGhostDisabledFg = "--b-button-ghost-disabled-fg",
+    ButtonGhostFg = "--b-button-ghost-fg",
+    ButtonPrimaryDisabledBg = "--b-button-primary-disabled-bg",
+    ButtonPrimaryDisabledFg = "--b-button-primary-disabled-fg",
+    ButtonTertiaryFg = "--b-button-tertiary-fg",
+    ButtonTertiaryFgPressed = "--b-button-tertiary-fg-pressed",
+    Danger = "--b-danger",
+    DangerPressed = "--b-danger-pressed",
+    FieldBgDefault = "--b-field-bg-default",
+    FieldBgDisabled = "--b-field-bg-disabled",
+    FieldBgHover = "--b-field-bg-hover",
+    FieldBorderDefault = "--b-field-border-default",
+    FieldBorderError = "--b-field-border-error",
+    FieldBorderFocus = "--b-field-border-focus",
+    FieldBorderHover = "--b-field-border-hover",
+    FieldTextDisabled = "--b-field-text-disabled",
+    FocusRingInset = "--b-focus-ring-inset",
+    FocusRingMuted = "--b-focus-ring-muted",
+    ListRowBgHover = "--b-list-row-bg-hover",
+    LoaderSpinner = "--b-loader-spinner",
+    LoaderTrack = "--b-loader-track",
+    MenuItemBgHover = "--b-menu-item-bg-hover",
+    NavItemBgActive = "--b-nav-item-bg-active",
+    NavItemBgHover = "--b-nav-item-bg-hover",
+    NavItemBgPressed = "--b-nav-item-bg-pressed",
+    NavText = "--b-nav-text",
+    NavTextActive = "--b-nav-text-active",
+    NavTextDisabled = "--b-nav-text-disabled",
+    NavTextFocusVisible = "--b-nav-text-focus-visible",
+    NavTextPressed = "--b-nav-text-pressed",
+    NeutralFillHoverStrong = "--b-neutral-fill-hover-strong",
+    NeutralFillHoverSubtle = "--b-neutral-fill-hover-subtle",
+    NeutralFillPressed = "--b-neutral-fill-pressed",
+    NeutralSurfacePressed = "--b-neutral-surface-pressed",
+    OnPrimary = "--b-on-primary",
+    OnSurface = "--b-on-surface",
+    OnSurfaceMuted = "--b-on-surface-muted",
+    PopoverSurface = "--b-popover-surface",
+    Primary = "--b-primary",
+    PrimaryHover = "--b-primary-hover",
+    PrimaryPressed = "--b-primary-pressed",
+    Scrim = "--b-scrim",
+    SelectionIndicator = "--b-selection-indicator",
+    StatusSuccessFg = "--b-status-success-fg",
+    Surface = "--b-surface",
+    TextDisabled = "--b-text-disabled",
+    TextHelper = "--b-text-helper",
+    TextLabel = "--b-text-label",
+    TextLinkDefault = "--b-text-link-default",
+    TextLinkDisabled = "--b-text-link-disabled",
+    TextLinkHover = "--b-text-link-hover",
+    TextLinkPressed = "--b-text-link-pressed",
+    TextPlaceholder = "--b-text-placeholder",
+    TextSelection = "--b-text-selection"
+}
+type CssSetVarKeys = Tokens | `--${string}`;
+type CssSetVarScalar = string | number;
+type CssSetVarValue = CssSetVarScalar | {
+    default?: CssSetVarScalar;
+    media?: Partial<Record<Breakpoint, CssSetVarScalar>>;
+    container?: Array<{
+        name?: string;
+        gt?: number;
+        lt?: number;
+        value: CssSetVarScalar;
+    }>;
+};
 declare module "react" {
     interface HTMLAttributes<T> {
         css?: Properties;
@@ -99,7 +171,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         borderWidth: csstype.Property.BorderWidth<string | 0> | undefined;
     }, S>;
-    /** Sets `borderColor: "rgba(255,255,255,1)"`. */
+    /** Sets `borderColor: "rgba(255, 255, 255, 1)"`. */
     get bcWhite(): CssBuilder<T & {
         borderColor: csstype.Property.BorderColor | undefined;
     }, S>;
@@ -479,11 +551,11 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     get bshHover(): CssBuilder<T & {
         boxShadow: csstype.Property.BoxShadow | undefined;
     }, S>;
-    /** Sets `boxShadow: "0px 0px 0px 2px rgba(255,255,255,1), 0px 0px 0px 4px rgba(29, 78, 216, 1)"`. */
+    /** Sets `boxShadow: "0px 0px 0px 2px rgba(255, 255, 255, 1), 0px 0px 0px 4px rgba(29, 78, 216, 1)"`. */
     get bshFocus(): CssBuilder<T & {
         boxShadow: csstype.Property.BoxShadow | undefined;
     }, S>;
-    /** Sets `boxShadow: "0px 0px 0px 2px rgba(255,255,255,1), 0px 0px 0px 4px rgba(153, 27, 27, 1)"`. */
+    /** Sets `boxShadow: "0px 0px 0px 2px rgba(255, 255, 255, 1), 0px 0px 0px 4px rgba(153, 27, 27, 1)"`. */
     get bshDanger(): CssBuilder<T & {
         boxShadow: csstype.Property.BoxShadow | undefined;
     }, S>;
@@ -515,39 +587,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     cn(value: Properties["containerName"]): CssBuilder<T & {
         containerName: csstype.Property.ContainerName | undefined;
     }, S>;
-    /** Sets `top: "0px"`. */
+    /** Sets `top: "calc(var(--t-spacing) * 0)"`. */
     get top0(): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
-    /** Sets `top: "8px"`. */
+    /** Sets `top: "calc(var(--t-spacing) * 1)"`. */
     get top1(): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
-    /** Sets `top: "16px"`. */
+    /** Sets `top: "calc(var(--t-spacing) * 2)"`. */
     get top2(): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
-    /** Sets `top: "24px"`. */
+    /** Sets `top: "calc(var(--t-spacing) * 3)"`. */
     get top3(): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
-    /** Sets `top: "32px"`. */
+    /** Sets `top: "calc(var(--t-spacing) * 4)"`. */
     get top4(): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
-    /** Sets `top: "40px"`. */
+    /** Sets `top: "calc(var(--t-spacing) * 5)"`. */
     get top5(): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
-    /** Sets `top: "48px"`. */
+    /** Sets `top: "calc(var(--t-spacing) * 6)"`. */
     get top6(): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
-    /** Sets `top: "56px"`. */
+    /** Sets `top: "calc(var(--t-spacing) * 7)"`. */
     get top7(): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
-    /** Sets `top: "64px"`. */
+    /** Sets `top: "calc(var(--t-spacing) * 8)"`. */
     get top8(): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
@@ -559,39 +631,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     topPx(px: number): CssBuilder<T & {
         top: csstype.Property.Top<string | 0> | undefined;
     }, S>;
-    /** Sets `right: "0px"`. */
+    /** Sets `right: "calc(var(--t-spacing) * 0)"`. */
     get right0(): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
-    /** Sets `right: "8px"`. */
+    /** Sets `right: "calc(var(--t-spacing) * 1)"`. */
     get right1(): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
-    /** Sets `right: "16px"`. */
+    /** Sets `right: "calc(var(--t-spacing) * 2)"`. */
     get right2(): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
-    /** Sets `right: "24px"`. */
+    /** Sets `right: "calc(var(--t-spacing) * 3)"`. */
     get right3(): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
-    /** Sets `right: "32px"`. */
+    /** Sets `right: "calc(var(--t-spacing) * 4)"`. */
     get right4(): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
-    /** Sets `right: "40px"`. */
+    /** Sets `right: "calc(var(--t-spacing) * 5)"`. */
     get right5(): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
-    /** Sets `right: "48px"`. */
+    /** Sets `right: "calc(var(--t-spacing) * 6)"`. */
     get right6(): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
-    /** Sets `right: "56px"`. */
+    /** Sets `right: "calc(var(--t-spacing) * 7)"`. */
     get right7(): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
-    /** Sets `right: "64px"`. */
+    /** Sets `right: "calc(var(--t-spacing) * 8)"`. */
     get right8(): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
@@ -603,39 +675,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     rightPx(px: number): CssBuilder<T & {
         right: csstype.Property.Right<string | 0> | undefined;
     }, S>;
-    /** Sets `bottom: "0px"`. */
+    /** Sets `bottom: "calc(var(--t-spacing) * 0)"`. */
     get bottom0(): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
-    /** Sets `bottom: "8px"`. */
+    /** Sets `bottom: "calc(var(--t-spacing) * 1)"`. */
     get bottom1(): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
-    /** Sets `bottom: "16px"`. */
+    /** Sets `bottom: "calc(var(--t-spacing) * 2)"`. */
     get bottom2(): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
-    /** Sets `bottom: "24px"`. */
+    /** Sets `bottom: "calc(var(--t-spacing) * 3)"`. */
     get bottom3(): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
-    /** Sets `bottom: "32px"`. */
+    /** Sets `bottom: "calc(var(--t-spacing) * 4)"`. */
     get bottom4(): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
-    /** Sets `bottom: "40px"`. */
+    /** Sets `bottom: "calc(var(--t-spacing) * 5)"`. */
     get bottom5(): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
-    /** Sets `bottom: "48px"`. */
+    /** Sets `bottom: "calc(var(--t-spacing) * 6)"`. */
     get bottom6(): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
-    /** Sets `bottom: "56px"`. */
+    /** Sets `bottom: "calc(var(--t-spacing) * 7)"`. */
     get bottom7(): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
-    /** Sets `bottom: "64px"`. */
+    /** Sets `bottom: "calc(var(--t-spacing) * 8)"`. */
     get bottom8(): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
@@ -647,39 +719,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     bottomPx(px: number): CssBuilder<T & {
         bottom: csstype.Property.Bottom<string | 0> | undefined;
     }, S>;
-    /** Sets `left: "0px"`. */
+    /** Sets `left: "calc(var(--t-spacing) * 0)"`. */
     get left0(): CssBuilder<T & {
         left: csstype.Property.Left<string | 0> | undefined;
     }, S>;
-    /** Sets `left: "8px"`. */
+    /** Sets `left: "calc(var(--t-spacing) * 1)"`. */
     get left1(): CssBuilder<T & {
         left: csstype.Property.Left<string | 0> | undefined;
     }, S>;
-    /** Sets `left: "16px"`. */
+    /** Sets `left: "calc(var(--t-spacing) * 2)"`. */
     get left2(): CssBuilder<T & {
         left: csstype.Property.Left<string | 0> | undefined;
     }, S>;
-    /** Sets `left: "24px"`. */
+    /** Sets `left: "calc(var(--t-spacing) * 3)"`. */
     get left3(): CssBuilder<T & {
         left: csstype.Property.Left<string | 0> | undefined;
     }, S>;
-    /** Sets `left: "32px"`. */
+    /** Sets `left: "calc(var(--t-spacing) * 4)"`. */
     get left4(): CssBuilder<T & {
         left: csstype.Property.Left<string | 0> | undefined;
     }, S>;
-    /** Sets `left: "40px"`. */
+    /** Sets `left: "calc(var(--t-spacing) * 5)"`. */
     get left5(): CssBuilder<T & {
         left: csstype.Property.Left<string | 0> | undefined;
     }, S>;
-    /** Sets `left: "48px"`. */
+    /** Sets `left: "calc(var(--t-spacing) * 6)"`. */
     get left6(): CssBuilder<T & {
         left: csstype.Property.Left<string | 0> | undefined;
     }, S>;
-    /** Sets `left: "56px"`. */
+    /** Sets `left: "calc(var(--t-spacing) * 7)"`. */
     get left7(): CssBuilder<T & {
         left: csstype.Property.Left<string | 0> | undefined;
     }, S>;
-    /** Sets `left: "64px"`. */
+    /** Sets `left: "calc(var(--t-spacing) * 8)"`. */
     get left8(): CssBuilder<T & {
         left: csstype.Property.Left<string | 0> | undefined;
     }, S>;
@@ -1215,39 +1287,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     gac(value: Properties["gridAutoColumns"]): CssBuilder<T & {
         gridAutoColumns: csstype.Property.GridAutoColumns<string | 0> | undefined;
     }, S>;
-    /** Sets `gap: "0px"`. */
+    /** Sets `gap: "calc(var(--t-spacing) * 0)"`. */
     get gap0(): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
-    /** Sets `gap: "8px"`. */
+    /** Sets `gap: "calc(var(--t-spacing) * 1)"`. */
     get gap1(): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
-    /** Sets `gap: "16px"`. */
+    /** Sets `gap: "calc(var(--t-spacing) * 2)"`. */
     get gap2(): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
-    /** Sets `gap: "24px"`. */
+    /** Sets `gap: "calc(var(--t-spacing) * 3)"`. */
     get gap3(): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
-    /** Sets `gap: "32px"`. */
+    /** Sets `gap: "calc(var(--t-spacing) * 4)"`. */
     get gap4(): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
-    /** Sets `gap: "40px"`. */
+    /** Sets `gap: "calc(var(--t-spacing) * 5)"`. */
     get gap5(): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
-    /** Sets `gap: "48px"`. */
+    /** Sets `gap: "calc(var(--t-spacing) * 6)"`. */
     get gap6(): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
-    /** Sets `gap: "56px"`. */
+    /** Sets `gap: "calc(var(--t-spacing) * 7)"`. */
     get gap7(): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
-    /** Sets `gap: "64px"`. */
+    /** Sets `gap: "calc(var(--t-spacing) * 8)"`. */
     get gap8(): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
@@ -1259,39 +1331,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     gapPx(px: number): CssBuilder<T & {
         gap: csstype.Property.Gap<string | 0> | undefined;
     }, S>;
-    /** Sets `rowGap: "0px"`. */
+    /** Sets `rowGap: "calc(var(--t-spacing) * 0)"`. */
     get rg0(): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
-    /** Sets `rowGap: "8px"`. */
+    /** Sets `rowGap: "calc(var(--t-spacing) * 1)"`. */
     get rg1(): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
-    /** Sets `rowGap: "16px"`. */
+    /** Sets `rowGap: "calc(var(--t-spacing) * 2)"`. */
     get rg2(): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
-    /** Sets `rowGap: "24px"`. */
+    /** Sets `rowGap: "calc(var(--t-spacing) * 3)"`. */
     get rg3(): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
-    /** Sets `rowGap: "32px"`. */
+    /** Sets `rowGap: "calc(var(--t-spacing) * 4)"`. */
     get rg4(): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
-    /** Sets `rowGap: "40px"`. */
+    /** Sets `rowGap: "calc(var(--t-spacing) * 5)"`. */
     get rg5(): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
-    /** Sets `rowGap: "48px"`. */
+    /** Sets `rowGap: "calc(var(--t-spacing) * 6)"`. */
     get rg6(): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
-    /** Sets `rowGap: "56px"`. */
+    /** Sets `rowGap: "calc(var(--t-spacing) * 7)"`. */
     get rg7(): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
-    /** Sets `rowGap: "64px"`. */
+    /** Sets `rowGap: "calc(var(--t-spacing) * 8)"`. */
     get rg8(): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
@@ -1303,39 +1375,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     rgPx(px: number): CssBuilder<T & {
         rowGap: csstype.Property.RowGap<string | 0> | undefined;
     }, S>;
-    /** Sets `columnGap: "0px"`. */
+    /** Sets `columnGap: "calc(var(--t-spacing) * 0)"`. */
     get cg0(): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
-    /** Sets `columnGap: "8px"`. */
+    /** Sets `columnGap: "calc(var(--t-spacing) * 1)"`. */
     get cg1(): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
-    /** Sets `columnGap: "16px"`. */
+    /** Sets `columnGap: "calc(var(--t-spacing) * 2)"`. */
     get cg2(): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
-    /** Sets `columnGap: "24px"`. */
+    /** Sets `columnGap: "calc(var(--t-spacing) * 3)"`. */
     get cg3(): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
-    /** Sets `columnGap: "32px"`. */
+    /** Sets `columnGap: "calc(var(--t-spacing) * 4)"`. */
     get cg4(): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
-    /** Sets `columnGap: "40px"`. */
+    /** Sets `columnGap: "calc(var(--t-spacing) * 5)"`. */
     get cg5(): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
-    /** Sets `columnGap: "48px"`. */
+    /** Sets `columnGap: "calc(var(--t-spacing) * 6)"`. */
     get cg6(): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
-    /** Sets `columnGap: "56px"`. */
+    /** Sets `columnGap: "calc(var(--t-spacing) * 7)"`. */
     get cg7(): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
-    /** Sets `columnGap: "64px"`. */
+    /** Sets `columnGap: "calc(var(--t-spacing) * 8)"`. */
     get cg8(): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
@@ -1347,39 +1419,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     cgPx(px: number): CssBuilder<T & {
         columnGap: csstype.Property.ColumnGap<string | 0> | undefined;
     }, S>;
-    /** Sets `height: "0px"`. */
+    /** Sets `height: "calc(var(--t-spacing) * 0)"`. */
     get h0(): CssBuilder<T & {
         height: csstype.Property.Height<string | 0> | undefined;
     }, S>;
-    /** Sets `height: "8px"`. */
+    /** Sets `height: "calc(var(--t-spacing) * 1)"`. */
     get h1(): CssBuilder<T & {
         height: csstype.Property.Height<string | 0> | undefined;
     }, S>;
-    /** Sets `height: "16px"`. */
+    /** Sets `height: "calc(var(--t-spacing) * 2)"`. */
     get h2(): CssBuilder<T & {
         height: csstype.Property.Height<string | 0> | undefined;
     }, S>;
-    /** Sets `height: "24px"`. */
+    /** Sets `height: "calc(var(--t-spacing) * 3)"`. */
     get h3(): CssBuilder<T & {
         height: csstype.Property.Height<string | 0> | undefined;
     }, S>;
-    /** Sets `height: "32px"`. */
+    /** Sets `height: "calc(var(--t-spacing) * 4)"`. */
     get h4(): CssBuilder<T & {
         height: csstype.Property.Height<string | 0> | undefined;
     }, S>;
-    /** Sets `height: "40px"`. */
+    /** Sets `height: "calc(var(--t-spacing) * 5)"`. */
     get h5(): CssBuilder<T & {
         height: csstype.Property.Height<string | 0> | undefined;
     }, S>;
-    /** Sets `height: "48px"`. */
+    /** Sets `height: "calc(var(--t-spacing) * 6)"`. */
     get h6(): CssBuilder<T & {
         height: csstype.Property.Height<string | 0> | undefined;
     }, S>;
-    /** Sets `height: "56px"`. */
+    /** Sets `height: "calc(var(--t-spacing) * 7)"`. */
     get h7(): CssBuilder<T & {
         height: csstype.Property.Height<string | 0> | undefined;
     }, S>;
-    /** Sets `height: "64px"`. */
+    /** Sets `height: "calc(var(--t-spacing) * 8)"`. */
     get h8(): CssBuilder<T & {
         height: csstype.Property.Height<string | 0> | undefined;
     }, S>;
@@ -1741,7 +1813,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     position(value: Properties["position"]): CssBuilder<T & {
         position: csstype.Property.Position | undefined;
     }, S>;
-    /** Sets `color: "rgba(255,255,255,1)"`. */
+    /** Sets `color: "rgba(255, 255, 255, 1)"`. */
     get white(): CssBuilder<T & {
         color: csstype.Property.Color | undefined;
     }, S>;
@@ -2033,7 +2105,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     color(value: Properties["color"]): CssBuilder<T & {
         color: csstype.Property.Color | undefined;
     }, S>;
-    /** Sets `backgroundColor: "rgba(255,255,255,1)"`. */
+    /** Sets `backgroundColor: "rgba(255, 255, 255, 1)"`. */
     get bgWhite(): CssBuilder<T & {
         backgroundColor: csstype.Property.BackgroundColor | undefined;
     }, S>;
@@ -2325,7 +2397,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     bgColor(value: Properties["backgroundColor"]): CssBuilder<T & {
         backgroundColor: csstype.Property.BackgroundColor | undefined;
     }, S>;
-    /** Sets `fill: "rgba(255,255,255,1)"`. */
+    /** Sets `fill: "rgba(255, 255, 255, 1)"`. */
     get fWhite(): CssBuilder<T & {
         fill: csstype.Property.Fill | undefined;
     }, S>;
@@ -2617,39 +2689,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     fill(value: Properties["fill"]): CssBuilder<T & {
         fill: csstype.Property.Fill | undefined;
     }, S>;
-    /** Sets `marginTop: "0px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 0)"`. */
     get mt0(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "8px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 1)"`. */
     get mt1(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "16px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 2)"`. */
     get mt2(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "24px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 3)"`. */
     get mt3(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "32px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 4)"`. */
     get mt4(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "40px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 5)"`. */
     get mt5(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "48px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 6)"`. */
     get mt6(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "56px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 7)"`. */
     get mt7(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "64px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 8)"`. */
     get mt8(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
@@ -2665,39 +2737,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     mtPx(px: number): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     }, S>;
-    /** Sets `marginRight: "0px"`. */
+    /** Sets `marginRight: "calc(var(--t-spacing) * 0)"`. */
     get mr0(): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginRight: "8px"`. */
+    /** Sets `marginRight: "calc(var(--t-spacing) * 1)"`. */
     get mr1(): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginRight: "16px"`. */
+    /** Sets `marginRight: "calc(var(--t-spacing) * 2)"`. */
     get mr2(): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginRight: "24px"`. */
+    /** Sets `marginRight: "calc(var(--t-spacing) * 3)"`. */
     get mr3(): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginRight: "32px"`. */
+    /** Sets `marginRight: "calc(var(--t-spacing) * 4)"`. */
     get mr4(): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginRight: "40px"`. */
+    /** Sets `marginRight: "calc(var(--t-spacing) * 5)"`. */
     get mr5(): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginRight: "48px"`. */
+    /** Sets `marginRight: "calc(var(--t-spacing) * 6)"`. */
     get mr6(): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginRight: "56px"`. */
+    /** Sets `marginRight: "calc(var(--t-spacing) * 7)"`. */
     get mr7(): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginRight: "64px"`. */
+    /** Sets `marginRight: "calc(var(--t-spacing) * 8)"`. */
     get mr8(): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
@@ -2713,39 +2785,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     mrPx(px: number): CssBuilder<T & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginBottom: "0px"`. */
+    /** Sets `marginBottom: "calc(var(--t-spacing) * 0)"`. */
     get mb0(): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginBottom: "8px"`. */
+    /** Sets `marginBottom: "calc(var(--t-spacing) * 1)"`. */
     get mb1(): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginBottom: "16px"`. */
+    /** Sets `marginBottom: "calc(var(--t-spacing) * 2)"`. */
     get mb2(): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginBottom: "24px"`. */
+    /** Sets `marginBottom: "calc(var(--t-spacing) * 3)"`. */
     get mb3(): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginBottom: "32px"`. */
+    /** Sets `marginBottom: "calc(var(--t-spacing) * 4)"`. */
     get mb4(): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginBottom: "40px"`. */
+    /** Sets `marginBottom: "calc(var(--t-spacing) * 5)"`. */
     get mb5(): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginBottom: "48px"`. */
+    /** Sets `marginBottom: "calc(var(--t-spacing) * 6)"`. */
     get mb6(): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginBottom: "56px"`. */
+    /** Sets `marginBottom: "calc(var(--t-spacing) * 7)"`. */
     get mb7(): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginBottom: "64px"`. */
+    /** Sets `marginBottom: "calc(var(--t-spacing) * 8)"`. */
     get mb8(): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
@@ -2761,39 +2833,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     mbPx(px: number): CssBuilder<T & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "0px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 0)"`. */
     get ml0(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "8px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 1)"`. */
     get ml1(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "16px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 2)"`. */
     get ml2(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "24px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 3)"`. */
     get ml3(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "32px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 4)"`. */
     get ml4(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "40px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 5)"`. */
     get ml5(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "48px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 6)"`. */
     get ml6(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "56px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 7)"`. */
     get ml7(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "64px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 8)"`. */
     get ml8(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
@@ -2809,55 +2881,55 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     mlPx(px: number): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "0px"; marginRight: "0px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 0)"; marginRight: "calc(var(--t-spacing) * 0)"`. */
     get mx0(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     } & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "8px"; marginRight: "8px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 1)"; marginRight: "calc(var(--t-spacing) * 1)"`. */
     get mx1(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     } & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "16px"; marginRight: "16px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 2)"; marginRight: "calc(var(--t-spacing) * 2)"`. */
     get mx2(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     } & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "24px"; marginRight: "24px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 3)"; marginRight: "calc(var(--t-spacing) * 3)"`. */
     get mx3(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     } & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "32px"; marginRight: "32px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 4)"; marginRight: "calc(var(--t-spacing) * 4)"`. */
     get mx4(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     } & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "40px"; marginRight: "40px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 5)"; marginRight: "calc(var(--t-spacing) * 5)"`. */
     get mx5(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     } & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "48px"; marginRight: "48px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 6)"; marginRight: "calc(var(--t-spacing) * 6)"`. */
     get mx6(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     } & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "56px"; marginRight: "56px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 7)"; marginRight: "calc(var(--t-spacing) * 7)"`. */
     get mx7(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     } & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginLeft: "64px"; marginRight: "64px"`. */
+    /** Sets `marginLeft: "calc(var(--t-spacing) * 8)"; marginRight: "calc(var(--t-spacing) * 8)"`. */
     get mx8(): CssBuilder<T & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     } & {
@@ -2881,55 +2953,55 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginRight: csstype.Property.MarginRight<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "0px"; marginBottom: "0px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 0)"; marginBottom: "calc(var(--t-spacing) * 0)"`. */
     get my0(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "8px"; marginBottom: "8px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 1)"; marginBottom: "calc(var(--t-spacing) * 1)"`. */
     get my1(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "16px"; marginBottom: "16px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 2)"; marginBottom: "calc(var(--t-spacing) * 2)"`. */
     get my2(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "24px"; marginBottom: "24px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 3)"; marginBottom: "calc(var(--t-spacing) * 3)"`. */
     get my3(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "32px"; marginBottom: "32px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 4)"; marginBottom: "calc(var(--t-spacing) * 4)"`. */
     get my4(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "40px"; marginBottom: "40px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 5)"; marginBottom: "calc(var(--t-spacing) * 5)"`. */
     get my5(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "48px"; marginBottom: "48px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 6)"; marginBottom: "calc(var(--t-spacing) * 6)"`. */
     get my6(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "56px"; marginBottom: "56px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 7)"; marginBottom: "calc(var(--t-spacing) * 7)"`. */
     get my7(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "64px"; marginBottom: "64px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 8)"; marginBottom: "calc(var(--t-spacing) * 8)"`. */
     get my8(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -2953,7 +3025,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginBottom: csstype.Property.MarginBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "0px"; marginBottom: "0px"; marginRight: "0px"; marginLeft: "0px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 0)"; marginBottom: "calc(var(--t-spacing) * 0)"; marginRight: "calc(var(--t-spacing) * 0)"; marginLeft: "calc(var(--t-spacing) * 0)"`. */
     get m0(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -2963,7 +3035,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "8px"; marginBottom: "8px"; marginRight: "8px"; marginLeft: "8px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 1)"; marginBottom: "calc(var(--t-spacing) * 1)"; marginRight: "calc(var(--t-spacing) * 1)"; marginLeft: "calc(var(--t-spacing) * 1)"`. */
     get m1(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -2973,7 +3045,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "16px"; marginBottom: "16px"; marginRight: "16px"; marginLeft: "16px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 2)"; marginBottom: "calc(var(--t-spacing) * 2)"; marginRight: "calc(var(--t-spacing) * 2)"; marginLeft: "calc(var(--t-spacing) * 2)"`. */
     get m2(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -2983,7 +3055,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "24px"; marginBottom: "24px"; marginRight: "24px"; marginLeft: "24px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 3)"; marginBottom: "calc(var(--t-spacing) * 3)"; marginRight: "calc(var(--t-spacing) * 3)"; marginLeft: "calc(var(--t-spacing) * 3)"`. */
     get m3(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -2993,7 +3065,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "32px"; marginBottom: "32px"; marginRight: "32px"; marginLeft: "32px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 4)"; marginBottom: "calc(var(--t-spacing) * 4)"; marginRight: "calc(var(--t-spacing) * 4)"; marginLeft: "calc(var(--t-spacing) * 4)"`. */
     get m4(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -3003,7 +3075,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "40px"; marginBottom: "40px"; marginRight: "40px"; marginLeft: "40px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 5)"; marginBottom: "calc(var(--t-spacing) * 5)"; marginRight: "calc(var(--t-spacing) * 5)"; marginLeft: "calc(var(--t-spacing) * 5)"`. */
     get m5(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -3013,7 +3085,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "48px"; marginBottom: "48px"; marginRight: "48px"; marginLeft: "48px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 6)"; marginBottom: "calc(var(--t-spacing) * 6)"; marginRight: "calc(var(--t-spacing) * 6)"; marginLeft: "calc(var(--t-spacing) * 6)"`. */
     get m6(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -3023,7 +3095,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "56px"; marginBottom: "56px"; marginRight: "56px"; marginLeft: "56px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 7)"; marginBottom: "calc(var(--t-spacing) * 7)"; marginRight: "calc(var(--t-spacing) * 7)"; marginLeft: "calc(var(--t-spacing) * 7)"`. */
     get m7(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -3033,7 +3105,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `marginTop: "64px"; marginBottom: "64px"; marginRight: "64px"; marginLeft: "64px"`. */
+    /** Sets `marginTop: "calc(var(--t-spacing) * 8)"; marginBottom: "calc(var(--t-spacing) * 8)"; marginRight: "calc(var(--t-spacing) * 8)"; marginLeft: "calc(var(--t-spacing) * 8)"`. */
     get m8(): CssBuilder<T & {
         marginTop: csstype.Property.MarginTop<string | 0> | undefined;
     } & {
@@ -3073,39 +3145,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         marginLeft: csstype.Property.MarginLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "0px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 0)"`. */
     get pt0(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "8px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 1)"`. */
     get pt1(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "16px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 2)"`. */
     get pt2(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "24px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 3)"`. */
     get pt3(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "32px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 4)"`. */
     get pt4(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "40px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 5)"`. */
     get pt5(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "48px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 6)"`. */
     get pt6(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "56px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 7)"`. */
     get pt7(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "64px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 8)"`. */
     get pt8(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
@@ -3117,39 +3189,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     ptPx(px: number): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingRight: "0px"`. */
+    /** Sets `paddingRight: "calc(var(--t-spacing) * 0)"`. */
     get pr0(): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingRight: "8px"`. */
+    /** Sets `paddingRight: "calc(var(--t-spacing) * 1)"`. */
     get pr1(): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingRight: "16px"`. */
+    /** Sets `paddingRight: "calc(var(--t-spacing) * 2)"`. */
     get pr2(): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingRight: "24px"`. */
+    /** Sets `paddingRight: "calc(var(--t-spacing) * 3)"`. */
     get pr3(): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingRight: "32px"`. */
+    /** Sets `paddingRight: "calc(var(--t-spacing) * 4)"`. */
     get pr4(): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingRight: "40px"`. */
+    /** Sets `paddingRight: "calc(var(--t-spacing) * 5)"`. */
     get pr5(): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingRight: "48px"`. */
+    /** Sets `paddingRight: "calc(var(--t-spacing) * 6)"`. */
     get pr6(): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingRight: "56px"`. */
+    /** Sets `paddingRight: "calc(var(--t-spacing) * 7)"`. */
     get pr7(): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingRight: "64px"`. */
+    /** Sets `paddingRight: "calc(var(--t-spacing) * 8)"`. */
     get pr8(): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
@@ -3161,39 +3233,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     prPx(px: number): CssBuilder<T & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingBottom: "0px"`. */
+    /** Sets `paddingBottom: "calc(var(--t-spacing) * 0)"`. */
     get pb0(): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingBottom: "8px"`. */
+    /** Sets `paddingBottom: "calc(var(--t-spacing) * 1)"`. */
     get pb1(): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingBottom: "16px"`. */
+    /** Sets `paddingBottom: "calc(var(--t-spacing) * 2)"`. */
     get pb2(): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingBottom: "24px"`. */
+    /** Sets `paddingBottom: "calc(var(--t-spacing) * 3)"`. */
     get pb3(): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingBottom: "32px"`. */
+    /** Sets `paddingBottom: "calc(var(--t-spacing) * 4)"`. */
     get pb4(): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingBottom: "40px"`. */
+    /** Sets `paddingBottom: "calc(var(--t-spacing) * 5)"`. */
     get pb5(): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingBottom: "48px"`. */
+    /** Sets `paddingBottom: "calc(var(--t-spacing) * 6)"`. */
     get pb6(): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingBottom: "56px"`. */
+    /** Sets `paddingBottom: "calc(var(--t-spacing) * 7)"`. */
     get pb7(): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingBottom: "64px"`. */
+    /** Sets `paddingBottom: "calc(var(--t-spacing) * 8)"`. */
     get pb8(): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
@@ -3205,39 +3277,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     pbPx(px: number): CssBuilder<T & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "0px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 0)"`. */
     get pl0(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "8px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 1)"`. */
     get pl1(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "16px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 2)"`. */
     get pl2(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "24px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 3)"`. */
     get pl3(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "32px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 4)"`. */
     get pl4(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "40px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 5)"`. */
     get pl5(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "48px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 6)"`. */
     get pl6(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "56px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 7)"`. */
     get pl7(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "64px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 8)"`. */
     get pl8(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
@@ -3249,55 +3321,55 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     plPx(px: number): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "0px"; paddingRight: "0px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 0)"; paddingRight: "calc(var(--t-spacing) * 0)"`. */
     get px0(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     } & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "8px"; paddingRight: "8px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 1)"; paddingRight: "calc(var(--t-spacing) * 1)"`. */
     get px1(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     } & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "16px"; paddingRight: "16px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 2)"; paddingRight: "calc(var(--t-spacing) * 2)"`. */
     get px2(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     } & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "24px"; paddingRight: "24px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 3)"; paddingRight: "calc(var(--t-spacing) * 3)"`. */
     get px3(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     } & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "32px"; paddingRight: "32px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 4)"; paddingRight: "calc(var(--t-spacing) * 4)"`. */
     get px4(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     } & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "40px"; paddingRight: "40px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 5)"; paddingRight: "calc(var(--t-spacing) * 5)"`. */
     get px5(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     } & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "48px"; paddingRight: "48px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 6)"; paddingRight: "calc(var(--t-spacing) * 6)"`. */
     get px6(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     } & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "56px"; paddingRight: "56px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 7)"; paddingRight: "calc(var(--t-spacing) * 7)"`. */
     get px7(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     } & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingLeft: "64px"; paddingRight: "64px"`. */
+    /** Sets `paddingLeft: "calc(var(--t-spacing) * 8)"; paddingRight: "calc(var(--t-spacing) * 8)"`. */
     get px8(): CssBuilder<T & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     } & {
@@ -3315,55 +3387,55 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingRight: csstype.Property.PaddingRight<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "0px"; paddingBottom: "0px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 0)"; paddingBottom: "calc(var(--t-spacing) * 0)"`. */
     get py0(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "8px"; paddingBottom: "8px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 1)"; paddingBottom: "calc(var(--t-spacing) * 1)"`. */
     get py1(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "16px"; paddingBottom: "16px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 2)"; paddingBottom: "calc(var(--t-spacing) * 2)"`. */
     get py2(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "24px"; paddingBottom: "24px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 3)"; paddingBottom: "calc(var(--t-spacing) * 3)"`. */
     get py3(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "32px"; paddingBottom: "32px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 4)"; paddingBottom: "calc(var(--t-spacing) * 4)"`. */
     get py4(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "40px"; paddingBottom: "40px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 5)"; paddingBottom: "calc(var(--t-spacing) * 5)"`. */
     get py5(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "48px"; paddingBottom: "48px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 6)"; paddingBottom: "calc(var(--t-spacing) * 6)"`. */
     get py6(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "56px"; paddingBottom: "56px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 7)"; paddingBottom: "calc(var(--t-spacing) * 7)"`. */
     get py7(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "64px"; paddingBottom: "64px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 8)"; paddingBottom: "calc(var(--t-spacing) * 8)"`. */
     get py8(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3381,7 +3453,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingBottom: csstype.Property.PaddingBottom<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "0px"; paddingBottom: "0px"; paddingRight: "0px"; paddingLeft: "0px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 0)"; paddingBottom: "calc(var(--t-spacing) * 0)"; paddingRight: "calc(var(--t-spacing) * 0)"; paddingLeft: "calc(var(--t-spacing) * 0)"`. */
     get p0(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3391,7 +3463,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "8px"; paddingBottom: "8px"; paddingRight: "8px"; paddingLeft: "8px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 1)"; paddingBottom: "calc(var(--t-spacing) * 1)"; paddingRight: "calc(var(--t-spacing) * 1)"; paddingLeft: "calc(var(--t-spacing) * 1)"`. */
     get p1(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3401,7 +3473,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "16px"; paddingBottom: "16px"; paddingRight: "16px"; paddingLeft: "16px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 2)"; paddingBottom: "calc(var(--t-spacing) * 2)"; paddingRight: "calc(var(--t-spacing) * 2)"; paddingLeft: "calc(var(--t-spacing) * 2)"`. */
     get p2(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3411,7 +3483,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "24px"; paddingBottom: "24px"; paddingRight: "24px"; paddingLeft: "24px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 3)"; paddingBottom: "calc(var(--t-spacing) * 3)"; paddingRight: "calc(var(--t-spacing) * 3)"; paddingLeft: "calc(var(--t-spacing) * 3)"`. */
     get p3(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3421,7 +3493,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "32px"; paddingBottom: "32px"; paddingRight: "32px"; paddingLeft: "32px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 4)"; paddingBottom: "calc(var(--t-spacing) * 4)"; paddingRight: "calc(var(--t-spacing) * 4)"; paddingLeft: "calc(var(--t-spacing) * 4)"`. */
     get p4(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3431,7 +3503,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "40px"; paddingBottom: "40px"; paddingRight: "40px"; paddingLeft: "40px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 5)"; paddingBottom: "calc(var(--t-spacing) * 5)"; paddingRight: "calc(var(--t-spacing) * 5)"; paddingLeft: "calc(var(--t-spacing) * 5)"`. */
     get p5(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3441,7 +3513,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "48px"; paddingBottom: "48px"; paddingRight: "48px"; paddingLeft: "48px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 6)"; paddingBottom: "calc(var(--t-spacing) * 6)"; paddingRight: "calc(var(--t-spacing) * 6)"; paddingLeft: "calc(var(--t-spacing) * 6)"`. */
     get p6(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3451,7 +3523,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "56px"; paddingBottom: "56px"; paddingRight: "56px"; paddingLeft: "56px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 7)"; paddingBottom: "calc(var(--t-spacing) * 7)"; paddingRight: "calc(var(--t-spacing) * 7)"; paddingLeft: "calc(var(--t-spacing) * 7)"`. */
     get p7(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3461,7 +3533,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     } & {
         paddingLeft: csstype.Property.PaddingLeft<string | 0> | undefined;
     }, S>;
-    /** Sets `paddingTop: "64px"; paddingBottom: "64px"; paddingRight: "64px"; paddingLeft: "64px"`. */
+    /** Sets `paddingTop: "calc(var(--t-spacing) * 8)"; paddingBottom: "calc(var(--t-spacing) * 8)"; paddingRight: "calc(var(--t-spacing) * 8)"; paddingLeft: "calc(var(--t-spacing) * 8)"`. */
     get p8(): CssBuilder<T & {
         paddingTop: csstype.Property.PaddingTop<string | 0> | undefined;
     } & {
@@ -3871,39 +3943,39 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     maxwPx(px: number): CssBuilder<T & {
         maxWidth: csstype.Property.MaxWidth<string | 0> | undefined;
     }, S>;
-    /** Sets `width: "0px"`. */
+    /** Sets `width: "calc(var(--t-spacing) * 0)"`. */
     get w0(): CssBuilder<T & {
         width: csstype.Property.Width<string | 0> | undefined;
     }, S>;
-    /** Sets `width: "8px"`. */
+    /** Sets `width: "calc(var(--t-spacing) * 1)"`. */
     get w1(): CssBuilder<T & {
         width: csstype.Property.Width<string | 0> | undefined;
     }, S>;
-    /** Sets `width: "16px"`. */
+    /** Sets `width: "calc(var(--t-spacing) * 2)"`. */
     get w2(): CssBuilder<T & {
         width: csstype.Property.Width<string | 0> | undefined;
     }, S>;
-    /** Sets `width: "24px"`. */
+    /** Sets `width: "calc(var(--t-spacing) * 3)"`. */
     get w3(): CssBuilder<T & {
         width: csstype.Property.Width<string | 0> | undefined;
     }, S>;
-    /** Sets `width: "32px"`. */
+    /** Sets `width: "calc(var(--t-spacing) * 4)"`. */
     get w4(): CssBuilder<T & {
         width: csstype.Property.Width<string | 0> | undefined;
     }, S>;
-    /** Sets `width: "40px"`. */
+    /** Sets `width: "calc(var(--t-spacing) * 5)"`. */
     get w5(): CssBuilder<T & {
         width: csstype.Property.Width<string | 0> | undefined;
     }, S>;
-    /** Sets `width: "48px"`. */
+    /** Sets `width: "calc(var(--t-spacing) * 6)"`. */
     get w6(): CssBuilder<T & {
         width: csstype.Property.Width<string | 0> | undefined;
     }, S>;
-    /** Sets `width: "56px"`. */
+    /** Sets `width: "calc(var(--t-spacing) * 7)"`. */
     get w7(): CssBuilder<T & {
         width: csstype.Property.Width<string | 0> | undefined;
     }, S>;
-    /** Sets `width: "64px"`. */
+    /** Sets `width: "calc(var(--t-spacing) * 8)"`. */
     get w8(): CssBuilder<T & {
         width: csstype.Property.Width<string | 0> | undefined;
     }, S>;
@@ -4098,6 +4170,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
      *
      * `when(":hover")` — same semantics as `onHover`
      * `when(":hover:not(:disabled)")` — hover only while enabled
+     * `when('[data-state="open"]')` — match an element state attribute
      */
     when(selector: string): CssBuilder<T, S>;
     /**
@@ -4110,7 +4183,7 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     /**
      * Apply different styles for each selector in the object.
      *
-     * `when({ ":hover": Css.blue.$, ":focus": Css.red.$ })`
+     * `when({ ":hover": Css.blue.$, '[data-state="open"]': Css.red.$ })`
      */
     when<W extends Record<string, Properties>>(selectors: W): CssBuilder<T & UnionToIntersection<W[keyof W]>, S>;
     ifContainer(_props: {
@@ -4146,6 +4219,8 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     className(className: string | undefined): CssBuilder<T, S>;
     /** Marker for the build-time transform to append raw inline styles. */
     style(inlineStyle: InlineStyle): CssBuilder<T, S>;
+    /** Set CSS custom properties via atomic classes (resolved at build time on web). */
+    setVar(_values: Partial<Record<CssSetVarKeys, CssSetVarValue>>): CssBuilder<T, S>;
     /** Convert a style hash into `{ className, style }` props for manual spreading into non-`css=` contexts. */
     props(styles: Properties): Record<string, unknown>;
     /** Tagged template literal for raw CSS in .css.ts files; passes through the string as-is. */
@@ -4156,14 +4231,16 @@ declare class CssBuilder<T extends Properties, S extends StyleKind = "buildtime"
     private unsupportedRuntime;
     private newCss;
 }
-/** Converts `inc` into pixels value with a `px` suffix. */
+/** Converts `inc` into a spacing length using `--t-spacing` (build-time atomic CSS). */
 declare function maybeInc(inc: number | string): string;
+/** Wraps `--token` custom property names as `var(--token)` for CSS property values. */
+declare function maybeCssVar<T>(value: T): T;
 /** Converts `inc` into pixels. */
 declare function increment(inc: number): number;
 /** Convert `pixels` to a `px` units string so it's not ambiguous. */
 declare function px(pixels: number): string;
 declare enum Palette {
-    White = "rgba(255,255,255,1)",
+    White = "rgba(255, 255, 255, 1)",
     Transparent = "rgba(0,0,0,0)",
     Gray50 = "rgba(255, 253, 253, 1)",
     Gray100 = "rgba(247, 245, 245, 1)",
@@ -4261,6 +4338,19 @@ declare enum Breakpoints {
     mdOrLg = "@media screen and (min-width: 600px)"
 }
 
+declare const navLink = "navLink";
+/**
+ * Applies a CSS Reset that is based on modern-normalize + TW customizations.
+ *
+ * The reset styles are now in CssReset.css and are loaded via a side-effect
+ * import. This component is kept for API compatibility — render it at the top
+ * of your app to ensure the CSS file is included in the bundle.
+ */
+declare function CssReset(): null;
+
+/** Primitive (`Palette`), semantic (`Tokens`, `--b-*`), or CSS color keywords for props and Truss param methods. */
+type BeamColor = Palette | Tokens | "inherit" | "currentColor";
+
 type PlainDate = Temporal.PlainDate;
 type DateRange = {
     from: PlainDate | undefined;
@@ -4330,18 +4420,18 @@ declare function AutoSaveStatusProvider({ children, resetToIdleTimeout }: AutoSa
  */
 declare function useAutoSaveStatus(): AutoSaveStatusContextType;
 
-interface IconProps extends AriaAttributes, DOMProps {
+type IconProps = {
     /** The name of an icon */
     icon: IconKey;
     /** Defaults to currentColor */
-    color?: Palette | "inherit" | "currentColor";
-    bgColor?: Palette;
+    color?: BeamColor;
+    bgColor?: BeamColor;
     /** The size of the icon in increments, i.e. 1 == 8px, default is 3 == 24px. */
     inc?: number;
     /** Styles overrides */
     xss?: Xss<Margin | "visibility" | "flexShrink">;
     tooltip?: ReactNode;
-}
+} & AriaAttributes & DOMProps;
 declare const Icon: React__default.MemoExoticComponent<(props: IconProps) => JSX.Element>;
 /**
  * Map of icons paths mapped to their respective name.
@@ -4591,7 +4681,7 @@ interface PresentationFieldProps {
     errorInTooltip?: true;
     /** Allow the fields to grow to the width of its container. By default, fields will extend up to 550px */
     fullWidth?: boolean;
-    /** Changes bg and hoverBg; Takes priority over `contrast`; Useful when showing many fields w/in a table that require user attention; In no way should be used as a replacement for error/focus state */
+    /** Changes bg and hoverBg; useful when showing many fields w/in a table that require user attention; in no way should be used as a replacement for error/focus state */
     inputStylePalette?: InputStylePalette;
 }
 type PresentationContextProps = {
@@ -4778,7 +4868,7 @@ declare const rowLinkRenderFn: (as: RenderAs, colSpan: number) => RenderCellFn<a
 declare const rowClickRenderFn: (as: RenderAs, api: GridTableApi<any>, colSpan: number) => RenderCellFn<any>;
 
 /** Completely static look & feel, i.e. nothing that is based on row kinds/content. */
-interface GridStyle {
+type GridStyle = {
     /** Applied to the base div element. */
     rootCss?: Properties;
     /** Extra bottom padding for the virtual-table footer loader/spacer, in pixels. */
@@ -4835,7 +4925,7 @@ interface GridStyle {
     /** Applied if there is a fallback/overflow message showing. */
     firstRowMessageCss?: Properties;
     /** Applied on hover if a row has a rowLink/onClick set. */
-    rowHoverColor?: Palette | "none";
+    rowHoverColor?: BeamColor | "none";
     /** Default content to put into an empty cell */
     emptyCell?: ReactNode;
     presentationSettings?: Pick<PresentationFieldProps, "borderless" | "borderOnHover" | "typeScale"> & Pick<PresentationContextProps, "wrap">;
@@ -4858,8 +4948,8 @@ interface GridStyle {
     keptGroupRowCss?: Properties;
     /** Defines styles for the last row `keptGroup` to provide separation from the rest of the table */
     keptLastRowCss?: Properties;
-}
-interface GridStyleDef {
+};
+type GridStyleDef = {
     /** Changes the height of the rows when `rowHeight: fixed` to provide more space between rows for input fields. */
     inlineEditing?: boolean;
     /** Adds styling for grouped rows */
@@ -4880,13 +4970,13 @@ interface GridStyleDef {
     cellTypography?: Typography;
     /** Defines if the table should highlight the row on hover. Defaults to true */
     highlightOnHover?: boolean;
-}
+};
 declare const getTableStyles: (props?: GridStyleDef) => GridStyle;
 /** Defines row-specific styling for each given row `kind` in `R` */
 type RowStyles<R extends Kinded> = {
     [P in R["kind"]]?: RowStyle<DiscriminateUnion<R, "kind", P>>;
 };
-interface RowStyle<R extends Kinded> {
+type RowStyle<R extends Kinded> = {
     /** Applies this css to the wrapper row, i.e. for row-level hovers. */
     rowCss?: Properties | ((row: R) => Properties);
     /** Applies this css to each cell in the row. */
@@ -4897,7 +4987,7 @@ interface RowStyle<R extends Kinded> {
     rowLink?: (row: R) => string;
     /** Fired when the row is clicked, similar to rowLink but for actions that aren't 'go to this link'. */
     onClick?: (row: GridDataRow<R>, api: GridTableApi<R>) => void;
-}
+};
 /** Our original table look & feel/style. */
 declare const defaultStyle: GridStyle;
 /** Tightens up the padding of rows, great for rows that have form elements in them. */
@@ -5872,7 +5962,7 @@ interface BeamProviderProps extends PropsWithChildren<PresentationContextProps>
 }
 declare function BeamProvider({ children, ...presentationProps }: BeamProviderProps): JSX.Element;
 
-interface ButtonProps extends BeamButtonProps, BeamFocusableProps {
+type ButtonProps = {
     label: ReactNode;
     variant?: ButtonVariant;
     size?: ButtonSize;
@@ -5886,12 +5976,11 @@ interface ButtonProps extends BeamButtonProps, BeamFocusableProps {
     type?: ButtonHTMLAttributes<HTMLButtonElement>["type"];
     /** Denotes if this button is used to download a resource. Uses the anchor tag with the `download` attribute */
     download?: boolean;
-    contrast?: boolean;
     /** Additional text to further customize button during an async request is in progress. */
     labelInFlight?: string;
     /** Shows pressed/active styles (useful when a menu is open) */
     active?: boolean;
-}
+} & BeamButtonProps & BeamFocusableProps;
 declare function Button(props: ButtonProps): JSX.Element;
 type ButtonSize = "sm" | "md" | "lg";
 type ButtonVariant = "primary" | "secondary" | "secondaryBlack" | "tertiary" | "tertiaryDanger" | "caution" | "danger" | "quaternary" | "text" | "textSecondary";
@@ -5904,11 +5993,11 @@ type DatePickerProps = {
     useYearPicker?: boolean;
 };
 
-interface IconButtonProps extends BeamButtonProps, BeamFocusableProps {
+type IconButtonProps = {
     /** The icon to use within the button. */
     icon: IconProps["icon"];
-    color?: Palette;
-    bgColor?: Palette;
+    color?: BeamColor;
+    bgColor?: BeamColor;
     /** The size of the icon, in increments, defaults to 3 which is 24px. */
     inc?: number;
     /** HTML attributes to apply to the button element when it is being used to trigger a menu. */
@@ -5916,8 +6005,6 @@ interface IconButtonProps extends BeamButtonProps, BeamFocusableProps {
     buttonRef?: RefObject<HTMLButtonElement>;
     /** Whether to show a 16x16px version of the IconButton */
     compact?: boolean;
-    /** Whether to display the contrast variant */
-    contrast?: boolean;
     /** Whether to display the circle variant */
     circle?: boolean;
     /** Indicates that the button is active/selected */
@@ -5926,7 +6013,7 @@ interface IconButtonProps extends BeamButtonProps, BeamFocusableProps {
     download?: boolean;
     /** Provides label for screen readers - Will become a required soon */
     label?: string;
-}
+} & BeamButtonProps & BeamFocusableProps;
 declare function IconButton(props: IconButtonProps): JSX.Element;
 declare const iconButtonStylesHover: Pick<Properties, never> & {
     backgroundColor: csstype.Property.BackgroundColor | undefined;
@@ -5946,7 +6033,7 @@ declare const iconButtonCircleStylesHover: Pick<Properties, never> & {
     readonly __kind: "buildtime";
 };
 
-interface NavLinkProps extends BeamFocusableProps {
+type NavLinkProps = {
     /** active indicates the user is on the current page */
     active?: boolean;
     disabled?: boolean;
@@ -5956,17 +6043,16 @@ interface NavLinkProps extends BeamFocusableProps {
     icon?: IconKey;
     variant: NavLinkVariant;
     openInNew?: boolean;
-    contrast?: boolean;
     /** HTML attributes to apply to the button element when it is being used to trigger a menu. */
     menuTriggerProps?: AriaButtonProps;
     buttonRef?: RefObject<HTMLElement>;
-}
+} & BeamFocusableProps;
 type NavLinkVariant = "side" | "global";
 declare function NavLink(props: NavLinkProps): JSX.Element;
 
 interface TextButtonTriggerProps extends Pick<ButtonProps, "label" | "variant" | "size" | "icon"> {
 }
-interface IconButtonTriggerProps extends Pick<IconButtonProps, "icon" | "color" | "compact" | "contrast" | "inc"> {
+interface IconButtonTriggerProps extends Pick<IconButtonProps, "icon" | "color" | "compact" | "inc"> {
 }
 interface AvatarButtonTriggerProps extends Pick<AvatarButtonProps, "src" | "name" | "size"> {
 }
@@ -5993,7 +6079,6 @@ interface OverlayTriggerProps {
     variant?: ButtonVariant;
     hideEndAdornment?: boolean;
     showActiveBorder?: boolean;
-    contrast?: boolean;
 }
 
 type ButtonDatePickerProps = {
@@ -6028,7 +6113,6 @@ type ButtonMenuBaseProps = {
     persistentItems?: MenuItem[];
     searchable?: boolean;
     defaultOpen?: boolean;
-    contrast?: boolean;
 } & Pick<OverlayTriggerProps, "trigger" | "placement" | "disabled" | "tooltip" | "showActiveBorder">;
 type SelectionButtonMenuProps = {
     /** Display a menu item as selected based. Use the Menu Item's label to identify */
@@ -6105,34 +6189,36 @@ interface CardProps {
 }
 declare function Card(props: CardProps): JSX.Element;
 
+/** Must match the `contrast` theme axis in tokens and `[data-theme="contrast"]` in `src/css/generated/theme-scopes.css`. */
+declare const contrastDataTheme: "contrast";
+/**
+ * Whether the tree is wrapped in an active {@link ContrastScope} (`contrast` prop true).
+ * Used by portaled overlays (e.g. {@link Popover}) and by field chrome that needs contrast-specific ink.
+ */
+declare function useContrastScope(): boolean;
+type ContrastScopeProps = PropsWithChildren<{
+    contrast?: boolean;
+}>;
+declare function ContrastScope({ children, contrast }: ContrastScopeProps): JSX.Element;
+
 declare function Copy(props: {
     children: string | ReactNode;
 }): JSX.Element;
 
 type CountBadgeXss = "color";
-interface CountBadgeProps<X> {
+type CountBadgeProps<X> = {
     count: number;
     /** Background color of the badge. Defaults to Blue700. */
-    bgColor?: Palette;
-    color?: Palette;
+    bgColor?: BeamColor;
+    color?: BeamColor;
     hideIfZero?: boolean;
-}
+};
 /**
  * CountBadge displays a numeric count in a circular badge.
  * Automatically adjusts size for counts > 100 (increases from 16px to 18px).
  */
 declare function CountBadge<X extends Only<Xss<CountBadgeXss>, X>>(props: CountBadgeProps<X>): JSX.Element | null;
 
-declare const navLink = "navLink";
-/**
- * Applies a CSS Reset that is based on modern-normalize + TW customizations.
- *
- * The reset styles are now in CssReset.css and are loaded via a side-effect
- * import. This component is kept for API compatibility — render it at the top
- * of your app to ensure the CSS file is included in the bundle.
- */
-declare function CssReset(): null;
-
 type DnDGridProps = {
     children: ReactNode;
     /** CSS Grid styles for the grid container. */
@@ -6162,12 +6248,12 @@ declare function useDnDGridItem(props: useDnDGridItemProps): {
 };
 type DnDGridItemProps = ReturnType<typeof useDnDGridItem>;
 
-interface DnDGridItemHandleProps {
+type DnDGridItemHandleProps = {
     dragHandleProps: DnDGridItemProps["dragHandleProps"];
     icon?: IconKey;
     compact?: boolean;
-    color?: Palette;
-}
+    color?: BeamColor;
+};
 /** Provides a specific handle element for dragging a GridItem. Includes handling behaviors and interactions */
 declare function DnDGridItemHandle(props: DnDGridItemHandleProps): JSX.Element;
 
@@ -6255,7 +6341,6 @@ type TextFieldBaseProps<X> = {
     groupProps?: NumberFieldAria["groupProps"];
     endAdornment?: ReactNode;
     startAdornment?: ReactNode;
-    contrast?: boolean;
     clearable?: boolean;
     textAreaMinHeight?: number;
     tooltip?: ReactNode;
@@ -6454,13 +6539,12 @@ declare const DateField: (props: DateFieldProps) => JSX.Element;
 
 declare function DateRangeField(props: DateRangeFieldProps): JSX.Element;
 
-interface ErrorMessageProps {
+type ErrorMessageProps = {
     /** The dom id for `aria-errormessage` to point to us. */
     id?: string;
     errorMsg: string;
-    contrast?: boolean;
     hidden?: boolean;
-}
+};
 /**
  * A helper component for consistently showing error messages across form fields.
  *
@@ -6530,8 +6614,6 @@ type ComboBoxBaseProps<O, V extends Value> = {
      * Unlike `unsetLabel`, this does not add an explicit option for the user to select.
      */
     nothingSelectedText?: string;
-    /** When set the SelectField is expected to be put on a darker background */
-    contrast?: boolean;
     /** Placeholder content */
     placeholder?: string;
     /**
@@ -6639,6 +6721,7 @@ type RadioFieldOption<K extends string> = {
     /** Disable only specific option, with an optional reason */
     disabled?: boolean | ReactNode;
 };
+type RadioGroupFieldLayout = "vertical" | "horizontal";
 type RadioGroupFieldProps<K extends string> = {
     /** The label for the choice itself, i.e. "Favorite Cheese". */
     label: string;
@@ -6653,6 +6736,8 @@ type RadioGroupFieldProps<K extends string> = {
     helperText?: string | ReactNode;
     onBlur?: () => void;
     onFocus?: () => void;
+    /** Direction of the options. Defaults to "vertical". */
+    layout?: RadioGroupFieldLayout;
 } & Pick<PresentationFieldProps, "labelStyle">;
 /**
  * Provides a radio group with label.
@@ -6900,8 +6985,6 @@ type TreeSelectFieldProps<O, V extends Value> = {
     sizeToContent?: boolean;
     /** The text to show when nothing is selected, i.e. could be "All" for filters. */
     nothingSelectedText?: string;
-    /** When set the SelectField is expected to be put on a darker background */
-    contrast?: boolean;
     /** Placeholder content */
     placeholder?: string;
     hideErrorMessage?: boolean;
@@ -7274,7 +7357,6 @@ declare function HbSpinnerProvider({ quips, children }: HbSpinnerProviderProps):
  */
 declare function HelperText(props: {
     helperText: string | ReactNode;
-    contrast?: boolean;
 }): JSX.Element;
 
 type BoundCheckboxFieldProps = Omit<CheckboxProps, "selected" | "onChange" | "label"> & {
@@ -7863,9 +7945,8 @@ type LoadingSkeletonProps = {
     columns?: number;
     size?: Sizes;
     randomizeWidths?: boolean;
-    contrast?: boolean;
 };
-declare function LoadingSkeleton({ rows, columns, size, randomizeWidths, contrast, }: LoadingSkeletonProps): JSX.Element;
+declare function LoadingSkeleton({ rows, columns, size, randomizeWidths }: LoadingSkeletonProps): JSX.Element;
 
 type QueryResult<QData> = {
     loading: boolean;
@@ -8341,11 +8422,10 @@ type TableReviewLayoutProps<R extends Kinded, X extends Only<GridTableXss, X>, Q
 };
 declare function TableReviewLayout<R extends Kinded, X extends Only<GridTableXss, X>, QData>(props: TableReviewLayoutProps<R, X, QData>): JSX.Element;
 
-interface LoaderProps {
+type LoaderProps = {
     size?: "xs" | "sm" | "md" | "lg";
-    contrast?: boolean;
-}
-declare function Loader({ size, contrast }: LoaderProps): JSX.Element;
+};
+declare function Loader({ size }: LoaderProps): JSX.Element;
 
 type MaxLinesProps = PropsWithChildren<{
     maxLines: number;
@@ -8561,7 +8641,7 @@ declare function useToast(): UseToastProps;
 
 type TooltipXss = Xss<Padding | "borderRadius">;
 /** Note: Only 1 tooltip is ever on screen at a time */
-interface TooltipProps {
+type TooltipProps = {
     /** The content that shows up when hovered */
     title: ReactNode;
     children: ReactNode;
@@ -8574,9 +8654,9 @@ interface TooltipProps {
      */
     delay?: number;
     disabled?: boolean;
-    bgColor?: Palette;
+    bgColor?: BeamColor;
     xss?: TooltipXss;
-}
+};
 declare function Tooltip(props: TooltipProps): JSX.Element;
 type Placement = "top" | "bottom" | "left" | "right" | "auto";
 declare function maybeTooltip(props: Omit<TooltipProps, "children"> & {
@@ -8595,4 +8675,4 @@ declare function resolveTooltip(disabled?: boolean | ReactNode, tooltip?: ReactN
  */
 declare function defaultTestId(label: string): string;
 
-export { ASC, Accordion, AccordionList, type AccordionProps, type AccordionSize, type ActionButtonProps, AutoSaveIndicator, AutoSaveStatus, AutoSaveStatusContext, AutoSaveStatusProvider, Autocomplete, type AutocompleteProps, Avatar, AvatarButton, type AvatarButtonProps, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, Banner, type BannerProps, type BannerTypes, BaseFilter, type BaseQueryTableProps, type BaseTableProps, type BeamButtonProps, type BeamFocusableProps, BeamProvider, type BeamTextFieldProps, BoundCheckboxField, type BoundCheckboxFieldProps, BoundCheckboxGroupField, type BoundCheckboxGroupFieldProps, BoundChipSelectField, BoundDateField, type BoundDateFieldProps, BoundDateRangeField, type BoundDateRangeFieldProps, BoundForm, type BoundFormInputConfig, type BoundFormProps, type BoundFormRowInputs, BoundIconCardField, type BoundIconCardFieldProps, BoundIconCardGroupField, type BoundIconCardGroupFieldProps, BoundMultiLineSelectField, type BoundMultiLineSelectFieldProps, BoundMultiSelectField, type BoundMultiSelectFieldProps, BoundNumberField, type BoundNumberFieldProps, BoundRadioGroupField, type BoundRadioGroupFieldProps, BoundRichTextField, type BoundRichTextFieldProps, BoundSelectAndTextField, BoundSelectField, type BoundSelectFieldProps, BoundSwitchField, type BoundSwitchFieldProps, BoundTextAreaField, type BoundTextAreaFieldProps, BoundTextField, type BoundTextFieldProps, BoundToggleChipGroupField, type BoundToggleChipGroupFieldProps, BoundTreeSelectField, type BoundTreeSelectFieldProps, type Breakpoint, Breakpoints, type BuildtimeStyles, Button, ButtonDatePicker, ButtonGroup, type ButtonGroupButton, type ButtonGroupProps, ButtonMenu, type ButtonMenuProps, ButtonModal, type ButtonModalProps, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardTag, type CardType, type CheckFn, Checkbox, CheckboxGroup, type CheckboxGroupItemOption, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipProps, ChipSelectField, type ChipSelectFieldProps, type ChipType, ChipTypes, type ChipValue, Chips, type ChipsProps, CollapseToggle, CollapsedContext, ConfirmCloseModal, type ContentStack, Copy, CountBadge, type CountBadgeProps, Css, CssReset, DESC, DateField, type DateFieldFormat, type DateFieldMode, type DateFieldProps, type DateFilterValue, type DateMatcher, type DateRange, DateRangeField, type DateRangeFieldProps, type DateRangeFilterValue, type Direction, type DiscriminateUnion, type DividerMenuItemType, DnDGrid, DnDGridItemHandle, type DnDGridItemHandleProps, type DnDGridItemProps, type DnDGridProps, type DragData, EXPANDABLE_HEADER, EditColumnsButton, ErrorMessage, FieldGroup, type Filter, type FilterDefs, _FilterDropdownMenu as FilterDropdownMenu, type FilterImpls, FilterModal, _Filters as Filters, type Font, FormDivider, FormHeading, type FormHeadingProps, FormLines, type FormLinesProps, FormPageLayout, FormRow, type FormSectionConfig, type FormWidth, FullBleed, type GridCellAlignment, type GridCellContent, type GridColumn, type GridColumnBorder, type GridColumnWithId, type GridDataRow, type GridRowKind, type GridRowLookup, type GridSortConfig, type GridStyle, GridTable, type GridTableApi, type GridTableCollapseToggleProps, type GridTableDefaults, GridTableLayout, type GridTableLayoutProps, type GridTableProps, type GridTablePropsWithRows, type GridTableScrollOptions, type GridTableXss, type GroupByHook, HB_QUIPS_FLAVOR, HB_QUIPS_MISSION, HEADER, type HasIdAndName, HbLoadingSpinner, HbSpinnerProvider, HelperText, Icon, IconButton, type IconButtonProps, IconCard, type IconCardProps, type IconKey, type IconMenuItemType, type IconProps, Icons, type IfAny, type ImageFitType, type ImageMenuItemType, type InfiniteScroll, type InlineStyle, type InputStylePalette, KEPT_GROUP, type Kinded, Loader, LoadingSkeleton, type LoadingSkeletonProps, type Margin, type Marker, MaxLines, type MaxLinesProps, type MaybeFn, type MenuItem, type MenuSection, ModalBody, ModalFilterItem, ModalFooter, ModalHeader, type ModalProps, type ModalSize, MultiLineSelectField, type MultiLineSelectFieldProps, MultiSelectField, type MultiSelectFieldProps, NavLink, type NestedOption, type NestedOptionsOrLoad, NumberField, type NumberFieldProps, type NumberFieldType, type OffsetAndLimit, type OnRowDragEvent, type OnRowSelect, type Only, type OpenDetailOpts, type OpenInDrawerOpts, OpenModal, type OpenRightPaneOpts, type Optional, type Padding, type PageNumberAndSize, type PageSettings, Pagination, type PaginationConfig, Palette, type Pin, type Placement, type PlainDate, type PresentationFieldProps, PresentationProvider, PreventBrowserScroll, type Properties, RIGHT_SIDEBAR_MIN_WIDTH, type RadioFieldOption, RadioGroupField, type RadioGroupFieldProps, type RenderAs, type RenderCellFn, ResponsiveGrid, type ResponsiveGridConfig, ResponsiveGridContext, ResponsiveGridItem, type ResponsiveGridItemProps, type ResponsiveGridProps, RichTextField, RichTextFieldImpl, type RichTextFieldProps, RightPaneContext, RightPaneLayout, type RightPaneLayoutContextProps, RightPaneProvider, RightSidebar, type RightSidebarProps, type RouteTab, type RouteTabWithContent, Row, type RowStyle, type RowStyles, RuntimeCss, type RuntimeStyles, ScrollShadows, ScrollableContent, ScrollableFooter, ScrollableParent, SelectField, type SelectFieldProps, SelectToggle, type SelectedState, type SidePanelProps, type SidebarContentProps, type SimpleHeaderAndData, SortHeader, type SortOn, type SortState, StaticField, type Step, Stepper, type StepperProps, type StyleKind, SubmitButton, type SubmitButtonProps, SuperDrawerContent, SuperDrawerHeader, SuperDrawerWidth, type SupportedDateFormat, Switch, type SwitchProps, TOTALS, type Tab, TabContent, type TabWithContent, TableReviewLayout, type TableReviewLayoutProps, TableState, TableStateContext, Tabs, TabsWithContent, Tag, type TagType, type TestIds, TextAreaField, type TextAreaFieldProps, TextField, type TextFieldApi, type TextFieldInternalProps, type TextFieldProps, type TextFieldXss, Toast, ToggleButton, type ToggleButtonProps, ToggleChip, ToggleChipGroup, type ToggleChipGroupProps, type ToggleChipProps, ToggleChips, type ToggleChipsProps, Tooltip, TreeSelectField, type TreeSelectFieldProps, type TriggerNoticeProps, type Typography, type UseModalHook, type UsePersistedFilterProps, type UseQueryState, type UseRightPaneHook, type UseSnackbarHook, type UseSuperDrawerHook, type UseToastProps, type Value, type Xss, actionColumn, applyRowFn, assignDefaultColumnIds, booleanFilter, boundCheckboxField, boundCheckboxGroupField, boundDateField, boundDateRangeField, boundIconCardField, boundIconCardGroupField, boundMultiSelectField, boundMultilineSelectField, boundNumberField, boundRadioGroupField, boundRichTextField, boundSelectField, boundSwitchField, boundTextAreaField, boundTextField, boundToggleChipGroupField, boundTreeSelectField, calcColumnSizes, cardStyle, checkboxFilter, chipBaseStyles, chipDisabledStyles, chipHoverOnlyStyles, chipHoverStyles, collapseColumn, column, condensedStyle, createRowLookup, dateColumn, dateFilter, dateFormats, dateRangeFilter, defaultPage, defaultRenderFn, defaultStyle, defaultTestId, dragHandleColumn, emptyCell, ensureClientSideSortValueIsSortable, filterTestIdPrefix, formatDate, formatDateRange, formatPlainDate, formatValue, generateColumnId, getAlignment, getColumnBorderCss, getDateFormat, getFirstOrLastCellCss, getJustification, getTableRefWidthStyles, getTableStyles, headerRenderFn, hoverStyles, iconButtonCircleStylesHover, iconButtonContrastStylesHover, iconButtonStylesHover, iconCardStylesHover, increment, insertAtIndex, isCursorBelowMidpoint, isGridCellContent, isGridTableProps, isJSX, isListBoxSection, isPersistentItem, isPersistentKey, isValidDate, listFieldPrefix, loadArrayOrUndefined, marker, matchesFilter, maybeInc, maybeTooltip, multiFilter, navLink, newMethodMissingProxy, nonKindGridColumnKeys, numberRangeFilter, numericColumn, parseDate, parseDateRange, parseWidthToPx, persistentItemPrefix, pressedOverlayCss, px, recursivelyGetContainingRow, reservedRowKinds, resolveTooltip, rowClickRenderFn, rowLinkRenderFn, selectColumn, selectedStyles, setDefaultStyle, setGridTableDefaults, setRunningInJest, shouldSkipScrollTo, simpleDataRows, simpleHeader, singleFilter, sortFn, sortRows, switchFocusStyles, switchHoverStyles, switchSelectedHoverStyles, toContent, toLimitAndOffset, toPageNumberSize, toggleFilter, toggleFocusStyles, toggleHoverStyles, togglePressStyles, treeFilter, updateFilter, useAutoSaveStatus, useBreakpoint, useComputed, useDnDGridItem, type useDnDGridItemProps, useFilter, useGridTableApi, useGridTableLayoutState, useGroupBy, useHover, useModal, usePersistedFilter, useQueryState, useResponsiveGrid, useResponsiveGridItem, type useResponsiveGridProps, useRightPane, useRightPaneContext, useRuntimeStyle, useScrollableParent, useSessionStorage, useSetupColumnSizes, useSnackbar, useSuperDrawer, useTestIds, useToast, useTreeSelectFieldProvider, useVirtualizedScrollParent, visit, zIndices };
+export { ASC, Accordion, AccordionList, type AccordionProps, type AccordionSize, type ActionButtonProps, AutoSaveIndicator, AutoSaveStatus, AutoSaveStatusContext, AutoSaveStatusProvider, Autocomplete, type AutocompleteProps, Avatar, AvatarButton, type AvatarButtonProps, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, Banner, type BannerProps, type BannerTypes, BaseFilter, type BaseQueryTableProps, type BaseTableProps, type BeamButtonProps, type BeamColor, type BeamFocusableProps, BeamProvider, type BeamTextFieldProps, BoundCheckboxField, type BoundCheckboxFieldProps, BoundCheckboxGroupField, type BoundCheckboxGroupFieldProps, BoundChipSelectField, BoundDateField, type BoundDateFieldProps, BoundDateRangeField, type BoundDateRangeFieldProps, BoundForm, type BoundFormInputConfig, type BoundFormProps, type BoundFormRowInputs, BoundIconCardField, type BoundIconCardFieldProps, BoundIconCardGroupField, type BoundIconCardGroupFieldProps, BoundMultiLineSelectField, type BoundMultiLineSelectFieldProps, BoundMultiSelectField, type BoundMultiSelectFieldProps, BoundNumberField, type BoundNumberFieldProps, BoundRadioGroupField, type BoundRadioGroupFieldProps, BoundRichTextField, type BoundRichTextFieldProps, BoundSelectAndTextField, BoundSelectField, type BoundSelectFieldProps, BoundSwitchField, type BoundSwitchFieldProps, BoundTextAreaField, type BoundTextAreaFieldProps, BoundTextField, type BoundTextFieldProps, BoundToggleChipGroupField, type BoundToggleChipGroupFieldProps, BoundTreeSelectField, type BoundTreeSelectFieldProps, type Breakpoint, Breakpoints, type BuildtimeStyles, Button, ButtonDatePicker, ButtonGroup, type ButtonGroupButton, type ButtonGroupProps, ButtonMenu, type ButtonMenuProps, ButtonModal, type ButtonModalProps, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, type CardTag, type CardType, type CheckFn, Checkbox, CheckboxGroup, type CheckboxGroupItemOption, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipProps, ChipSelectField, type ChipSelectFieldProps, type ChipType, ChipTypes, type ChipValue, Chips, type ChipsProps, CollapseToggle, CollapsedContext, ConfirmCloseModal, type ContentStack, ContrastScope, Copy, CountBadge, type CountBadgeProps, Css, CssReset, type CssSetVarKeys, type CssSetVarScalar, type CssSetVarValue, DESC, DateField, type DateFieldFormat, type DateFieldMode, type DateFieldProps, type DateFilterValue, type DateMatcher, type DateRange, DateRangeField, type DateRangeFieldProps, type DateRangeFilterValue, type Direction, type DiscriminateUnion, type DividerMenuItemType, DnDGrid, DnDGridItemHandle, type DnDGridItemHandleProps, type DnDGridItemProps, type DnDGridProps, type DragData, EXPANDABLE_HEADER, EditColumnsButton, ErrorMessage, FieldGroup, type Filter, type FilterDefs, _FilterDropdownMenu as FilterDropdownMenu, type FilterImpls, FilterModal, _Filters as Filters, type Font, FormDivider, FormHeading, type FormHeadingProps, FormLines, type FormLinesProps, FormPageLayout, FormRow, type FormSectionConfig, type FormWidth, FullBleed, type GridCellAlignment, type GridCellContent, type GridColumn, type GridColumnBorder, type GridColumnWithId, type GridDataRow, type GridRowKind, type GridRowLookup, type GridSortConfig, type GridStyle, GridTable, type GridTableApi, type GridTableCollapseToggleProps, type GridTableDefaults, GridTableLayout, type GridTableLayoutProps, type GridTableProps, type GridTablePropsWithRows, type GridTableScrollOptions, type GridTableXss, type GroupByHook, HB_QUIPS_FLAVOR, HB_QUIPS_MISSION, HEADER, type HasIdAndName, HbLoadingSpinner, HbSpinnerProvider, HelperText, Icon, IconButton, type IconButtonProps, IconCard, type IconCardProps, type IconKey, type IconMenuItemType, type IconProps, Icons, type IfAny, type ImageFitType, type ImageMenuItemType, type InfiniteScroll, type InlineStyle, type InputStylePalette, KEPT_GROUP, type Kinded, Loader, LoadingSkeleton, type LoadingSkeletonProps, type Margin, type Marker, MaxLines, type MaxLinesProps, type MaybeFn, type MenuItem, type MenuSection, ModalBody, ModalFilterItem, ModalFooter, ModalHeader, type ModalProps, type ModalSize, MultiLineSelectField, type MultiLineSelectFieldProps, MultiSelectField, type MultiSelectFieldProps, NavLink, type NestedOption, type NestedOptionsOrLoad, NumberField, type NumberFieldProps, type NumberFieldType, type OffsetAndLimit, type OnRowDragEvent, type OnRowSelect, type Only, type OpenDetailOpts, type OpenInDrawerOpts, OpenModal, type OpenRightPaneOpts, type Optional, type Padding, type PageNumberAndSize, type PageSettings, Pagination, type PaginationConfig, Palette, type Pin, type Placement, type PlainDate, type PresentationFieldProps, PresentationProvider, PreventBrowserScroll, type Properties, RIGHT_SIDEBAR_MIN_WIDTH, type RadioFieldOption, RadioGroupField, type RadioGroupFieldProps, type RenderAs, type RenderCellFn, ResponsiveGrid, type ResponsiveGridConfig, ResponsiveGridContext, ResponsiveGridItem, type ResponsiveGridItemProps, type ResponsiveGridProps, RichTextField, RichTextFieldImpl, type RichTextFieldProps, RightPaneContext, RightPaneLayout, type RightPaneLayoutContextProps, RightPaneProvider, RightSidebar, type RightSidebarProps, type RouteTab, type RouteTabWithContent, Row, type RowStyle, type RowStyles, RuntimeCss, type RuntimeStyles, ScrollShadows, ScrollableContent, ScrollableFooter, ScrollableParent, SelectField, type SelectFieldProps, SelectToggle, type SelectedState, type SidePanelProps, type SidebarContentProps, type SimpleHeaderAndData, SortHeader, type SortOn, type SortState, StaticField, type Step, Stepper, type StepperProps, type StyleKind, SubmitButton, type SubmitButtonProps, SuperDrawerContent, SuperDrawerHeader, SuperDrawerWidth, type SupportedDateFormat, Switch, type SwitchProps, TOTALS, type Tab, TabContent, type TabWithContent, TableReviewLayout, type TableReviewLayoutProps, TableState, TableStateContext, Tabs, TabsWithContent, Tag, type TagType, type TestIds, TextAreaField, type TextAreaFieldProps, TextField, type TextFieldApi, type TextFieldInternalProps, type TextFieldProps, type TextFieldXss, Toast, ToggleButton, type ToggleButtonProps, ToggleChip, ToggleChipGroup, type ToggleChipGroupProps, type ToggleChipProps, ToggleChips, type ToggleChipsProps, Tokens, Tooltip, TreeSelectField, type TreeSelectFieldProps, type TriggerNoticeProps, type Typography, type UseModalHook, type UsePersistedFilterProps, type UseQueryState, type UseRightPaneHook, type UseSnackbarHook, type UseSuperDrawerHook, type UseToastProps, type Value, type Xss, actionColumn, applyRowFn, assignDefaultColumnIds, booleanFilter, boundCheckboxField, boundCheckboxGroupField, boundDateField, boundDateRangeField, boundIconCardField, boundIconCardGroupField, boundMultiSelectField, boundMultilineSelectField, boundNumberField, boundRadioGroupField, boundRichTextField, boundSelectField, boundSwitchField, boundTextAreaField, boundTextField, boundToggleChipGroupField, boundTreeSelectField, calcColumnSizes, cardStyle, checkboxFilter, chipBaseStyles, chipDisabledStyles, chipHoverOnlyStyles, chipHoverStyles, collapseColumn, column, condensedStyle, contrastDataTheme, createRowLookup, dateColumn, dateFilter, dateFormats, dateRangeFilter, defaultPage, defaultRenderFn, defaultStyle, defaultTestId, dragHandleColumn, emptyCell, ensureClientSideSortValueIsSortable, filterTestIdPrefix, formatDate, formatDateRange, formatPlainDate, formatValue, generateColumnId, getAlignment, getColumnBorderCss, getDateFormat, getFirstOrLastCellCss, getJustification, getTableRefWidthStyles, getTableStyles, headerRenderFn, hoverStyles, iconButtonCircleStylesHover, iconButtonContrastStylesHover, iconButtonStylesHover, iconCardStylesHover, increment, insertAtIndex, isCursorBelowMidpoint, isGridCellContent, isGridTableProps, isJSX, isListBoxSection, isPersistentItem, isPersistentKey, isValidDate, listFieldPrefix, loadArrayOrUndefined, marker, matchesFilter, maybeCssVar, maybeInc, maybeTooltip, multiFilter, navLink, newMethodMissingProxy, nonKindGridColumnKeys, numberRangeFilter, numericColumn, parseDate, parseDateRange, parseWidthToPx, persistentItemPrefix, pressedOverlayCss, px, recursivelyGetContainingRow, reservedRowKinds, resolveTooltip, rowClickRenderFn, rowLinkRenderFn, selectColumn, selectedStyles, setDefaultStyle, setGridTableDefaults, setRunningInJest, shouldSkipScrollTo, simpleDataRows, simpleHeader, singleFilter, sortFn, sortRows, switchFocusStyles, switchHoverStyles, switchSelectedHoverStyles, toContent, toLimitAndOffset, toPageNumberSize, toggleFilter, toggleFocusStyles, toggleHoverStyles, togglePressStyles, treeFilter, updateFilter, useAutoSaveStatus, useBreakpoint, useComputed, useContrastScope, useDnDGridItem, type useDnDGridItemProps, useFilter, useGridTableApi, useGridTableLayoutState, useGroupBy, useHover, useModal, usePersistedFilter, useQueryState, useResponsiveGrid, useResponsiveGridItem, type useResponsiveGridProps, useRightPane, useRightPaneContext, useRuntimeStyle, useScrollableParent, useSessionStorage, useSetupColumnSizes, useSnackbar, useSuperDrawer, useTestIds, useToast, useTreeSelectFieldProvider, useVirtualizedScrollParent, visit, zIndices };