Function: useDatavizTokens()

useDatavizTokens(): SemanticDataviz

Defined in: dataviz/useDatavizTokens.ts:30

Access the current theme's dataviz semantic tokens.

Requires <ThemeProvider theme={...}> with a bundle whose theme includes the dataviz extension (core.dataviz + semantic.dataviz).

Throws a descriptive error when the active theme has no dataviz extension, making misconfiguration immediately visible during development.

Returns

SemanticDataviz

Example

import { useDatavizTokens } from '@ttoss/theme2/dataviz';

const ChartLegend = ({ categories }: { categories: string[] }) => {
  const dataviz = useDatavizTokens();
  // Full type-safety, no optional chaining
  return categories.map((name, i) => (
    <span key={name} style={{ color: `var(--tt-dataviz-color-series-${i + 1})` }}>
      {name}
    </span>
  ));
};

See

useTokens — access full semantic tokens (dataviz will be on tokens.dataviz?)