type CssVarRef = `var(--${string})`; /** * Extract the CSS custom property name from a var() reference. * `'var(--space-4)'` -> `'--space-4'` */ declare const getVarName: (token: CssVarRef) => string; /** * Resolve the computed value of a CSS variable token at runtime. * Checks `document.body` first so semantic theme tokens resolve from the * same element they are defined on, then falls back to `document.documentElement`. */ declare const resolveToken: (token: CssVarRef, element?: Element) => string; export { getVarName, resolveToken }; export type { CssVarRef }; export declare const Token: { readonly color: { readonly black: "var(--color-black)"; readonly white: "var(--color-white)"; readonly accent1: "var(--color-accent1)"; readonly accent2: "var(--color-accent2)"; readonly accent3: "var(--color-accent3)"; readonly accentGreen: "var(--color-accent-green)"; readonly accentGreen1: "var(--color-accent-green1)"; readonly surfaceCanvas: "var(--color-surface-canvas)"; readonly surfaceRaised: "var(--color-surface-raised)"; readonly surfaceElevated: "var(--color-surface-elevated)"; readonly surfaceOverlay: "var(--color-surface-overlay)"; readonly surfaceInverse: "var(--color-surface-inverse)"; readonly surfaceDisabled: "var(--color-surface-disabled)"; readonly textPrimary: "var(--color-text-primary)"; readonly textSecondary: "var(--color-text-secondary)"; readonly textTertiary: "var(--color-text-tertiary)"; readonly textInverse: "var(--color-text-inverse)"; readonly textDisabled: "var(--color-text-disabled)"; readonly borderMuted: "var(--color-border-muted)"; readonly borderSubtle: "var(--color-border-subtle)"; readonly borderStrong: "var(--color-border-strong)"; readonly accentPrimary: "var(--color-accent-primary)"; readonly accentPrimaryMuted: "var(--color-accent-primary-muted)"; readonly accentPrimaryEmphasis: "var(--color-accent-primary-emphasis)"; readonly accentSuccess: "var(--color-accent-success)"; readonly accentSuccessEmphasis: "var(--color-accent-success-emphasis)"; readonly accentWarning: "var(--color-accent-warning)"; readonly accentWarningEmphasis: "var(--color-accent-warning-emphasis)"; readonly accentDanger: "var(--color-accent-danger)"; readonly accentDangerEmphasis: "var(--color-accent-danger-emphasis)"; readonly accentHighlight: "var(--color-accent-highlight)"; readonly accentHighlightEmphasis: "var(--color-accent-highlight-emphasis)"; readonly focusRing: "var(--color-focus-ring)"; readonly bg: "var(--color-bg)"; readonly gray1: "var(--color-gray1)"; readonly gray2: "var(--color-gray2)"; readonly gray3: "var(--color-gray3)"; readonly gray4: "var(--color-gray4)"; readonly gray5: "var(--color-gray5)"; readonly gray6: "var(--color-gray6)"; readonly gray7: "var(--color-gray7)"; readonly gray8: "var(--color-gray8)"; readonly gray9: "var(--color-gray9)"; readonly gray10: "var(--color-gray10)"; readonly gray11: "var(--color-gray11)"; readonly gray12: "var(--color-gray12)"; readonly grayA1: "var(--color-grayA1)"; readonly grayA2: "var(--color-grayA2)"; readonly grayA3: "var(--color-grayA3)"; readonly grayA4: "var(--color-grayA4)"; readonly grayA5: "var(--color-grayA5)"; readonly grayA6: "var(--color-grayA6)"; readonly grayA7: "var(--color-grayA7)"; readonly grayA8: "var(--color-grayA8)"; readonly grayA9: "var(--color-grayA9)"; readonly grayA10: "var(--color-grayA10)"; readonly grayA11: "var(--color-grayA11)"; readonly grayA12: "var(--color-grayA12)"; readonly blue1: "var(--color-blue1)"; readonly blue2: "var(--color-blue2)"; readonly blue3: "var(--color-blue3)"; readonly blue4: "var(--color-blue4)"; readonly blue5: "var(--color-blue5)"; readonly blue6: "var(--color-blue6)"; readonly blue7: "var(--color-blue7)"; readonly blue8: "var(--color-blue8)"; readonly blue9: "var(--color-blue9)"; readonly blue10: "var(--color-blue10)"; readonly blue11: "var(--color-blue11)"; readonly blue12: "var(--color-blue12)"; readonly green1: "var(--color-green1)"; readonly green2: "var(--color-green2)"; readonly green3: "var(--color-green3)"; readonly green4: "var(--color-green4)"; readonly green5: "var(--color-green5)"; readonly green6: "var(--color-green6)"; readonly green7: "var(--color-green7)"; readonly green8: "var(--color-green8)"; readonly green9: "var(--color-green9)"; readonly green10: "var(--color-green10)"; readonly green11: "var(--color-green11)"; readonly green12: "var(--color-green12)"; readonly amber1: "var(--color-amber1)"; readonly amber2: "var(--color-amber2)"; readonly amber3: "var(--color-amber3)"; readonly amber4: "var(--color-amber4)"; readonly amber5: "var(--color-amber5)"; readonly amber6: "var(--color-amber6)"; readonly amber7: "var(--color-amber7)"; readonly amber8: "var(--color-amber8)"; readonly amber9: "var(--color-amber9)"; readonly amber10: "var(--color-amber10)"; readonly amber11: "var(--color-amber11)"; readonly amber12: "var(--color-amber12)"; readonly purple1: "var(--color-purple1)"; readonly purple2: "var(--color-purple2)"; readonly purple3: "var(--color-purple3)"; readonly purple4: "var(--color-purple4)"; readonly purple5: "var(--color-purple5)"; readonly purple6: "var(--color-purple6)"; readonly purple7: "var(--color-purple7)"; readonly purple8: "var(--color-purple8)"; readonly purple9: "var(--color-purple9)"; readonly purple10: "var(--color-purple10)"; readonly purple11: "var(--color-purple11)"; readonly purple12: "var(--color-purple12)"; readonly red1: "var(--color-red1)"; readonly red2: "var(--color-red2)"; readonly red3: "var(--color-red3)"; readonly red4: "var(--color-red4)"; readonly red5: "var(--color-red5)"; readonly red6: "var(--color-red6)"; readonly red7: "var(--color-red7)"; readonly red8: "var(--color-red8)"; readonly red9: "var(--color-red9)"; readonly red10: "var(--color-red10)"; readonly red11: "var(--color-red11)"; readonly red12: "var(--color-red12)"; }; readonly space: { readonly none: "var(--space-0)"; readonly s1: "var(--space-1)"; readonly s2: "var(--space-2)"; readonly s3: "var(--space-3)"; readonly s4: "var(--space-4)"; readonly s5: "var(--space-5)"; readonly s6: "var(--space-6)"; readonly s7: "var(--space-7)"; readonly s8: "var(--space-8)"; readonly s9: "var(--space-9)"; readonly s10: "var(--space-10)"; readonly s11: "var(--space-11)"; readonly s12: "var(--space-12)"; readonly s13: "var(--space-13)"; readonly s14: "var(--space-14)"; readonly s15: "var(--space-15)"; readonly xs: "var(--space-xs)"; readonly sm: "var(--space-sm)"; readonly md: "var(--space-md)"; readonly lg: "var(--space-lg)"; readonly xl: "var(--space-xl)"; readonly '2xl': "var(--space-2xl)"; readonly '3xl': "var(--space-3xl)"; }; readonly radius: { readonly r1: "var(--radius-1)"; readonly r2: "var(--radius-2)"; readonly r3: "var(--radius-3)"; readonly r4: "var(--radius-4)"; readonly r5: "var(--radius-5)"; readonly r6: "var(--radius-6)"; readonly r7: "var(--radius-7)"; readonly xs: "var(--radius-xs)"; readonly sm: "var(--radius-sm)"; readonly md: "var(--radius-md)"; readonly lg: "var(--radius-lg)"; readonly xl: "var(--radius-xl)"; readonly round: "var(--radius-round)"; readonly pill: "var(--radius-pill)"; }; readonly shadow: { readonly sm: "var(--shadow-sm)"; readonly md: "var(--shadow-md)"; readonly lg: "var(--shadow-lg)"; readonly raised: "var(--shadow-raised)"; readonly overlay: "var(--shadow-overlay)"; }; readonly font: { readonly fancy: "var(--font-fancy)"; readonly body: "var(--font-body)"; readonly numeric: "var(--font-numeric)"; }; readonly fontSize: { readonly f1: "var(--font-size-1)"; readonly f2: "var(--font-size-2)"; readonly f3: "var(--font-size-3)"; readonly f4: "var(--font-size-4)"; readonly f5: "var(--font-size-5)"; readonly f6: "var(--font-size-6)"; readonly f7: "var(--font-size-7)"; }; readonly fontWeight: { readonly regular: "var(--font-weight-regular)"; readonly medium: "var(--font-weight-medium)"; readonly semibold: "var(--font-weight-semibold)"; readonly bold: "var(--font-weight-bold)"; }; readonly lineHeight: { readonly tight: "var(--line-height-tight)"; readonly snug: "var(--line-height-snug)"; readonly body: "var(--line-height-body)"; readonly loose: "var(--line-height-loose)"; }; readonly letterSpacing: { readonly tight: "var(--letter-spacing-tight)"; readonly normal: "var(--letter-spacing-normal)"; readonly wide: "var(--letter-spacing-wide)"; }; readonly duration: { readonly fastest: "var(--duration-fastest)"; readonly fast: "var(--duration-fast)"; readonly normal: "var(--duration-normal)"; readonly slow: "var(--duration-slow)"; readonly slowest: "var(--duration-slowest)"; }; readonly easing: { readonly snappy: "var(--easing-snappy)"; readonly inQuad: "var(--ease-in-quad)"; readonly inCubic: "var(--ease-in-cubic)"; readonly inQuart: "var(--ease-in-quart)"; readonly inQuint: "var(--ease-in-quint)"; readonly inExpo: "var(--ease-in-expo)"; readonly inCirc: "var(--ease-in-circ)"; readonly outQuad: "var(--ease-out-quad)"; readonly outCubic: "var(--ease-out-cubic)"; readonly outQuart: "var(--ease-out-quart)"; readonly outQuint: "var(--ease-out-quint)"; readonly outExpo: "var(--ease-out-expo)"; readonly outCirc: "var(--ease-out-circ)"; readonly inOutQuad: "var(--ease-in-out-quad)"; readonly inOutCubic: "var(--ease-in-out-cubic)"; readonly inOutQuart: "var(--ease-in-out-quart)"; readonly inOutQuint: "var(--ease-in-out-quint)"; readonly inOutExpo: "var(--ease-in-out-expo)"; readonly inOutCirc: "var(--ease-in-out-circ)"; }; readonly transition: { readonly all: "var(--transition-all)"; readonly shadow: "var(--transition-shadow)"; readonly colors: "var(--transition-colors)"; readonly background: "var(--transition-background)"; readonly border: "var(--transition-border)"; readonly opacity: "var(--transition-opacity)"; readonly transform: "var(--transition-transform)"; }; readonly colorChannel: { readonly accent: "var(--color-channel-accent)"; readonly success: "var(--color-channel-success)"; readonly danger: "var(--color-channel-danger)"; readonly warning: "var(--color-channel-warning)"; readonly highlight: "var(--color-channel-highlight)"; readonly white: "var(--color-channel-white)"; readonly black: "var(--color-channel-black)"; }; readonly effectChannel: { readonly accent: "var(--effect-channel-accent)"; readonly danger: "var(--effect-channel-danger)"; readonly focusOutline: "var(--effect-channel-focus-outline)"; readonly glass: "var(--effect-channel-glass)"; readonly highlight: "var(--effect-channel-highlight)"; readonly shadow: "var(--effect-channel-shadow)"; }; readonly effect: { readonly accentRingSoft: "var(--effect-accent-ring-soft)"; readonly focusOutline: "var(--effect-focus-outline)"; readonly focusOutlineHighlight: "var(--effect-focus-outline-highlight)"; readonly focusShadowAccent: "var(--effect-focus-shadow-accent)"; readonly focusShadowHighlight: "var(--effect-focus-shadow-highlight)"; readonly glassBorder: "var(--effect-glass-border)"; readonly glassBorderSoft: "var(--effect-glass-border-soft)"; readonly glassRing: "var(--effect-glass-ring)"; readonly glassShadowDepth: "var(--effect-glass-shadow-depth)"; readonly glassShadowSoft: "var(--effect-glass-shadow-soft)"; readonly glassShell: "var(--effect-glass-shell)"; readonly glassSurface: "var(--effect-glass-surface)"; readonly glowBorder: "var(--effect-glow-border)"; readonly glowCool: "var(--effect-glow-cool)"; readonly glowOutline: "var(--effect-glow-outline)"; readonly glowSheenEnd: "var(--effect-glow-sheen-end)"; readonly glowSheenStart: "var(--effect-glow-sheen-start)"; readonly glowVeil: "var(--effect-glow-veil)"; readonly glowWarm: "var(--effect-glow-warm)"; readonly glossLineFaint: "var(--effect-gloss-line-faint)"; readonly glossLineMedium: "var(--effect-gloss-line-medium)"; readonly glossLineSoft: "var(--effect-gloss-line-soft)"; readonly glossLineStrong: "var(--effect-gloss-line-strong)"; readonly highlightTrail: "var(--effect-highlight-trail)"; readonly overlayScrim: "var(--effect-overlay-scrim)"; readonly selectionAccent: "var(--effect-selection-accent)"; readonly shadowFaint: "var(--effect-shadow-faint)"; readonly shadowInteractive: "var(--effect-shadow-interactive)"; readonly shadowMuted: "var(--effect-shadow-muted)"; readonly shadowSoft: "var(--effect-shadow-soft)"; readonly shadowStrong: "var(--effect-shadow-strong)"; readonly thumbShadow: "var(--effect-thumb-shadow)"; readonly tooltipSurface: "var(--effect-tooltip-surface)"; }; readonly utils: { readonly opacity: (channel: string, value: number | string) => string; }; readonly textStyle: { readonly heading1: "var(--text-heading-1)"; readonly heading2: "var(--text-heading-2)"; readonly heading3: "var(--text-heading-3)"; readonly body: "var(--text-body)"; readonly bodyEmphasis: "var(--text-body-emphasis)"; readonly small: "var(--text-small)"; readonly caption: "var(--text-caption)"; }; readonly zIndex: { readonly n1: "var(--z-index-n1)"; readonly z0: "var(--z-index-0)"; readonly z1: "var(--z-index-1)"; readonly z2: "var(--z-index-2)"; readonly z3: "var(--z-index-3)"; readonly z4: "var(--z-index-4)"; readonly z5: "var(--z-index-5)"; readonly max: "var(--z-index-max)"; }; readonly breakpoint: { readonly sm: "var(--breakpoint-sm)"; readonly md: "var(--breakpoint-md)"; readonly lg: "var(--breakpoint-lg)"; readonly xl: "var(--breakpoint-xl)"; }; readonly focusRingWidth: "var(--focus-ring-width)"; };