/** * Typography tokens. * * System-native typefaces are used across headings, body, and UI text, with * a type scale tuned for dense, data-heavy security dashboards. * * @see https://mui.com/material-ui/react-typography/ */ export declare const fontFamily: { /** Native UI sans-serif stack for the current operating system. */ readonly primary: "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif"; /** Alias of `primary` for theme and component usage. */ readonly ui: "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif"; /** Native monospace stack for the current operating system. */ readonly mono: "Menlo, Monaco, \"SF Mono\", \"Liberation Mono\", \"DejaVu Sans Mono\", \"Bitstream Vera Sans Mono\", Consolas, \"Lucida Console\", \"Courier New\", monospace"; }; export declare const fontWeight: { /** Thin — 100 */ readonly thin: 100; /** Extra Light — 200 */ readonly extraLight: 200; /** Light — 300 */ readonly light: 300; /** Regular — 400 */ readonly regular: 400; /** Medium — 500 */ readonly medium: 500; /** Semi Bold — 600 */ readonly semibold: 600; /** Bold — 700 */ readonly bold: 700; /** Extra Bold — 800 */ readonly extraBold: 800; /** Black — 900 */ readonly black: 900; }; /** Common upright and italic font styles. */ export declare const fontStyle: { readonly normal: "normal"; readonly italic: "italic"; }; /** * Common OpenType features. Browsers ignore features unsupported by the * selected system font. */ export declare const fontFeatureSettings: { /** Ligatures + contextual alternates (recommended default for UI text). */ readonly default: "'liga' 1, 'calt' 1"; /** Fixed-width figures for aligned numeric columns. */ readonly tabularNums: "'tnum' 1"; /** Slashed zero to disambiguate 0 from o. */ readonly slashedZero: "'zero' 1"; /** Tabular nums + slashed zero — common for security dashboards. */ readonly dataDisplay: "'tnum' 1, 'zero' 1, 'liga' 1, 'calt' 1"; }; /** Font sizes in pixels. */ export declare const fontSize: { readonly xs: 11; readonly sm: 12; readonly md: 14; readonly lg: 16; readonly xl: 20; readonly '2xl': 24; readonly '3xl': 32; readonly '4xl': 48; readonly '5xl': 64; }; /** * Size for a glyph sitting inside a compact label -- a chip's leading icon, its * delete X, a picker's chevron. * * Expressed as an `em` ratio rather than a pixel value so one rule covers every * size a chip comes in: it resolves to `lg` (16px) against the 12px medium * label, ~14.7px against the 11px small one, ~18.7px against the 14px large * label, and ~21.3px against the 16px extraLarge label, and it follows * `Chip purpose="entity"` when that sizes itself to the surrounding prose. * * The ratio is derived rather than written out because the whole point is that * the glyph tracks the label. MUI's own chip leaves the medium icon unsized, so * it fell back to the 24px `SvgIcon` default -- twice the label it sat beside. */ export declare const compactGlyphScale: string; export declare const lineHeight: { readonly tight: 1.2; readonly normal: 1.4; readonly relaxed: 1.6; }; export declare const letterSpacing: { readonly tight: "-0.01em"; readonly normal: "0"; readonly wide: "0.02em"; }; export declare const typographyTokens: { readonly fontFamily: { /** Native UI sans-serif stack for the current operating system. */ readonly primary: "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif"; /** Alias of `primary` for theme and component usage. */ readonly ui: "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif"; /** Native monospace stack for the current operating system. */ readonly mono: "Menlo, Monaco, \"SF Mono\", \"Liberation Mono\", \"DejaVu Sans Mono\", \"Bitstream Vera Sans Mono\", Consolas, \"Lucida Console\", \"Courier New\", monospace"; }; readonly fontWeight: { /** Thin — 100 */ readonly thin: 100; /** Extra Light — 200 */ readonly extraLight: 200; /** Light — 300 */ readonly light: 300; /** Regular — 400 */ readonly regular: 400; /** Medium — 500 */ readonly medium: 500; /** Semi Bold — 600 */ readonly semibold: 600; /** Bold — 700 */ readonly bold: 700; /** Extra Bold — 800 */ readonly extraBold: 800; /** Black — 900 */ readonly black: 900; }; readonly fontStyle: { readonly normal: "normal"; readonly italic: "italic"; }; readonly fontFeatureSettings: { /** Ligatures + contextual alternates (recommended default for UI text). */ readonly default: "'liga' 1, 'calt' 1"; /** Fixed-width figures for aligned numeric columns. */ readonly tabularNums: "'tnum' 1"; /** Slashed zero to disambiguate 0 from o. */ readonly slashedZero: "'zero' 1"; /** Tabular nums + slashed zero — common for security dashboards. */ readonly dataDisplay: "'tnum' 1, 'zero' 1, 'liga' 1, 'calt' 1"; }; readonly fontSize: { readonly xs: 11; readonly sm: 12; readonly md: 14; readonly lg: 16; readonly xl: 20; readonly '2xl': 24; readonly '3xl': 32; readonly '4xl': 48; readonly '5xl': 64; }; readonly lineHeight: { readonly tight: 1.2; readonly normal: 1.4; readonly relaxed: 1.6; }; readonly letterSpacing: { readonly tight: "-0.01em"; readonly normal: "0"; readonly wide: "0.02em"; }; }; export type FontSizeToken = keyof typeof fontSize; /** * Which MUI Typography variant to reach for. The counterpart to * `spacingUsage` / `backgroundUsage`: it keeps the "which variant do I use" * answer next to the type tokens so the agent kit and Storybook stay in sync. * * Sizes and weights live in `src/theme/typography.ts`. This table is the role * mapping — never pick a variant for its pixel size alone. */ export declare const typographyVariantUsage: { readonly h1: { readonly useFor: "Rare. Marketing or empty-state heroes — not product chrome."; }; readonly h2: { readonly useFor: "Major page sections that sit above a page title."; }; readonly h3: { readonly useFor: "KPI figures and large stats (StatTile value)."; }; readonly h4: { readonly useFor: "Page titles in templates (TablePageLayout, DetailsPageLayout)."; }; readonly h5: { readonly useFor: "Investigation or subsection titles."; }; readonly h6: { readonly useFor: "Drawer headings and empty-state titles."; }; readonly subtitle1: { readonly useFor: "Card titles, form section titles, accordion summaries, dialog titles."; }; readonly subtitle2: { readonly useFor: "Compact headings: filter panels, table row titles, widget headers."; }; readonly body1: { readonly useFor: "Default reading text (14px): descriptions, dialog body, card copy, breadcrumbs."; }; readonly body2: { readonly useFor: "Dense annotations only (12px): deltas, compact secondary lines. Not default copy."; }; readonly caption: { readonly useFor: "Metadata, timestamps, helper counts, form labels, tooltips."; }; readonly overline: { readonly useFor: "Column headers, uppercase tags, category labels."; }; readonly button: { readonly useFor: "Reserved for Button. Do not use for prose."; }; }; export type TypographyVariantName = keyof typeof typographyVariantUsage;