ThemeSDK

interface

The main theme interface returned by defineTheme. Provides access to resolved tokens, generated CSS, and extension capabilities.

interface ThemeSDK<T extends ResolvedTokens>

Import

import { ThemeSDK } from '@modular/sdk';

css: string
Generated CSS string containing custom properties for all tokens. Format: `--category-token: value;`
cssPolicy: ThemeCssPolicy
The unit policy used to generate `css`. Extensions preserve this policy so numeric token behavior is inspectable and cannot drift across a theme cascade.
tokens: T
The fully resolved token values. All references and computed functions have been evaluated.
extend: <E extends ExtensionInput<T>>(extension: E) => Theme<MergeTokens<T, ResolveExtension<T, E>>>
Creates a new theme by extending this theme with overrides and additions. Returns a new Theme with merged types.

example: ```typescript interface MyTokens { color: { brand: string }; spacing: { base: number }; } declare const theme: Theme<MyTokens>; // Access resolved tokens const brandColor = theme.tokens.color.brand; // string // Get generated CSS const css = theme.css; // string containing CSS custom properties // Extend the theme const extendedTheme = theme.extend({ color: { brand: '#new-brand' }, custom: { myToken: 'value' }, }); // extendedTheme.tokens.custom.myToken is now available with autocomplete ```