@abreen/tada 1.0.2 → 1.1.0

package/{webpack/utils/code.js → build/utils/code.ts}

@@ -1,20 +1,51 @@
-const MarkdownIt = require('markdown-it');
-const { parse: parseJava } = require('java-parser');
-const { JSDOM } = require('jsdom');
-const { makeLogger } = require('../log');
-const { getHighlighter } = require('./shiki-highlighter');
+import MarkdownIt from 'markdown-it';
+import { parse as parseJava } from 'java-parser';
+import { JSDOM } from 'jsdom';
+import { makeLogger } from '../log.js';
+import { getHighlighter } from './shiki-highlighter.js';
+import externalLinksPlugin from '../external-links-plugin.js';
+import applyBasePathPlugin from '../apply-base-path-plugin.js';
+import type { JavaTocEntry, SiteVariables } from '../types.js';
+
+interface CstNode {
+  name?: string;
+  image?: string;
+  startLine?: number;
+  startOffset?: number;
+  children?: Record<string, CstNode[]>;
+}
+
+interface MethodMeta {
+  baseName: string;
+  line: number;
+  params: string[];
+}
+
+interface FieldMeta {
+  name: string;
+  line: number;
+}
+
+interface CodeSegment {
+  type: string | null;
+  lines: string[];
+  startLine: number;
+}
 
 const log = makeLogger(__filename);
 
 const PROSE_LINE = /^\s*\/\/\/(\s|$)/;
 
-function createCodeMarkdown(siteVariables, options = {}) {
+function createCodeMarkdown(
+  siteVariables: SiteVariables,
+  options: Record<string, unknown> = {},
+): MarkdownIt {
   return new MarkdownIt({ html: true, typographer: true })
-    .use(require('../external-links-plugin'), siteVariables)
-    .use(require('../apply-base-path-plugin'), siteVariables, options);
+    .use(externalLinksPlugin, siteVariables)
+    .use(applyBasePathPlugin, siteVariables, options);
 }
 
-const KIND_LABELS = {
+const KIND_LABELS: Record<string, string> = {
   constructor: 'Constructor',
   field: 'Field',
   method: 'Method',
@@ -27,7 +58,10 @@ const JAVA_TYPE_DECLARATION_NODES = new Set([
   'recordDeclaration',
 ]);
 
-function extractJavaMethodMeta(methodNode, requireBody = true) {
+function extractJavaMethodMeta(
+  methodNode: CstNode,
+  requireBody = true,
+): MethodMeta | null {
   const methodBody = methodNode.children?.methodBody?.[0];
   const hasBody = Boolean(methodBody?.children?.block?.length);
   if (requireBody && !hasBody) {
@@ -50,7 +84,9 @@ function extractJavaMethodMeta(methodNode, requireBody = true) {
   };
 }
 
-function extractJavaConstructorMeta(constructorNode) {
+function extractJavaConstructorMeta(
+  constructorNode: CstNode,
+): MethodMeta | null {
   const constructorDeclarator =
     constructorNode.children?.constructorDeclarator?.[0];
   const identifier =
@@ -69,7 +105,9 @@ function extractJavaConstructorMeta(constructorNode) {
   };
 }
 
-function extractParameterNames(formalParameterListNode) {
+function extractParameterNames(
+  formalParameterListNode: CstNode | undefined,
+): string[] {
   if (!formalParameterListNode) {
     return [];
   }
@@ -77,7 +115,7 @@ function extractParameterNames(formalParameterListNode) {
   const formalParameters =
     formalParameterListNode.children?.formalParameter || [];
   return formalParameters
-    .map(parameterNode => {
+    .map((parameterNode: CstNode) => {
       const regularParameter =
         parameterNode.children?.variableParaRegularParameter?.[0];
       if (regularParameter) {
@@ -92,16 +130,19 @@ function extractParameterNames(formalParameterListNode) {
         parameterNode.children?.variableArityParameter?.[0];
       return varArgParameter?.children?.Identifier?.[0]?.image || null;
     })
-    .filter(Boolean);
+    .filter(Boolean) as string[];
 }
 
-function formatCallableName(baseName, parameterNames) {
+function formatCallableName(
+  baseName: string,
+  parameterNames: string[],
+): string {
   return `${baseName}(${parameterNames.join(', ')})`;
 }
 
-function collectTokensInOrder(node) {
-  const tokens = [];
-  function collect(n) {
+function collectTokensInOrder(node: CstNode): CstNode[] {
+  const tokens: CstNode[] = [];
+  function collect(n: CstNode | undefined): void {
     if (!n) {
       return;
     }
@@ -119,17 +160,17 @@ function collectTokensInOrder(node) {
     }
   }
   collect(node);
-  tokens.sort((a, b) => a.startOffset - b.startOffset);
+  tokens.sort((a, b) => (a.startOffset ?? 0) - (b.startOffset ?? 0));
   return tokens;
 }
 
-function buildTypeString(unannTypeNode) {
+function buildTypeString(unannTypeNode: CstNode): string {
   return collectTokensInOrder(unannTypeNode)
     .map(t => (t.image === ',' ? ', ' : t.image))
     .join('');
 }
 
-function extractJavaFieldMetas(fieldNode) {
+function extractJavaFieldMetas(fieldNode: CstNode): FieldMeta[] {
   const unannType = fieldNode.children?.unannType?.[0];
   if (!unannType) {
     return [];
@@ -142,7 +183,7 @@ function extractJavaFieldMetas(fieldNode) {
     return [];
   }
 
-  const results = [];
+  const results: FieldMeta[] = [];
   for (const declarator of variableDeclaratorList.children
     ?.variableDeclarator || []) {
     const declaratorId = declarator.children?.variableDeclaratorId?.[0];
@@ -151,7 +192,7 @@ function extractJavaFieldMetas(fieldNode) {
       continue;
     }
 
-    const dimsNode = declaratorId.children?.dims?.[0];
+    const dimsNode = declaratorId?.children?.dims?.[0];
     const dimsStr = dimsNode
       ? collectTokensInOrder(dimsNode)
           .map(t => t.image)
@@ -166,18 +207,24 @@ function extractJavaFieldMetas(fieldNode) {
   return results;
 }
 
-function extractJavaMethodToc(sourceCode) {
-  let cst;
+export function extractJavaMethodToc(sourceCode: string): JavaTocEntry[] {
+  let cst: CstNode;
   try {
-    cst = parseJava(sourceCode);
-  } catch (err) {
-    log.error`Failed to parse Java source for TOC: ${err.message}`;
+    cst = parseJava(sourceCode) as CstNode;
+  } catch (err: unknown) {
+    log.error`Failed to parse Java source for TOC: ${(err as Error).message}`;
     return [];
   }
 
-  const callables = [];
+  const callables: Array<{
+    kind: 'method' | 'constructor' | 'field';
+    baseName?: string;
+    name?: string;
+    line: number;
+    params?: string[];
+  }> = [];
 
-  function visit(node, typeDepth) {
+  function visit(node: CstNode, typeDepth: number): void {
     if (!node || !node.name) {
       return;
     }
@@ -225,36 +272,44 @@ function extractJavaMethodToc(sourceCode) {
   return callables.map(callable => {
     const label = KIND_LABELS[callable.kind] ?? 'Member';
     if (callable.name !== undefined) {
-      return { ...callable, label };
+      return {
+        kind: callable.kind,
+        label,
+        name: callable.name,
+        line: callable.line,
+      };
     }
     return {
       kind: callable.kind,
       label,
-      name: formatCallableName(callable.baseName, callable.params),
+      name: formatCallableName(callable.baseName!, callable.params!),
       line: callable.line,
     };
   });
 }
 
-function escapeAttr(str) {
+function escapeAttr(str: string): string {
   return str.replace(/&/g, '&amp;').replace(/"/g, '&quot;');
 }
 
-function escapeHtml(text) {
+function escapeHtml(text: string): string {
   return text
     .replace(/&/g, '&amp;')
     .replace(/</g, '&lt;')
     .replace(/>/g, '&gt;');
 }
 
-function createCodeLine(document) {
+function createCodeLine(document: Document): HTMLSpanElement {
   const line = document.createElement('span');
   line.className = 'code-line';
   return line;
 }
 
-function cloneOpenElements(openElements, line) {
-  const containers = [line];
+function cloneOpenElements(
+  openElements: Node[],
+  line: HTMLSpanElement,
+): Node[] {
+  const containers: Node[] = [line];
 
   for (const openElement of openElements) {
     const clone = openElement.cloneNode(false);
@@ -265,17 +320,20 @@ function cloneOpenElements(openElements, line) {
   return containers;
 }
 
-function splitHighlightedHtmlIntoLines(highlightedHtml, lineCount) {
+function splitHighlightedHtmlIntoLines(
+  highlightedHtml: string,
+  lineCount: number,
+): string[] {
   const fragment = JSDOM.fragment(`<code>${highlightedHtml}</code>`);
-  const codeEl = fragment.firstChild;
+  const codeEl = fragment.firstChild as HTMLElement;
   const document = codeEl.ownerDocument;
-  const lines = [];
-  const openElements = [];
+  const lines: HTMLSpanElement[] = [];
+  const openElements: Node[] = [];
   let currentLine = createCodeLine(document);
-  let currentContainers = [currentLine];
+  let currentContainers: Node[] = [currentLine];
   let currentLineHasContent = false;
 
-  function finishCurrentLine() {
+  function finishCurrentLine(): void {
     if (!currentLineHasContent) {
       currentContainers[currentContainers.length - 1].appendChild(
         document.createTextNode('\u00A0'),
@@ -287,7 +345,7 @@ function splitHighlightedHtmlIntoLines(highlightedHtml, lineCount) {
     currentLineHasContent = false;
   }
 
-  function visit(node) {
+  function visit(node: Node): void {
     if (node.nodeType === 3) {
       const parts = (node.textContent || '').split('\n');
       for (let i = 0; i < parts.length; i++) {
@@ -341,9 +399,13 @@ function splitHighlightedHtmlIntoLines(highlightedHtml, lineCount) {
   return lines.map(line => line.innerHTML);
 }
 
-function renderCodeSegment(lines, startLine, lang) {
+export function renderCodeSegment(
+  lines: string[],
+  startLine: number,
+  lang: string,
+): string {
   const source = lines.join('\n');
-  let lineHtml;
+  let lineHtml: string[] | undefined;
 
   try {
     const highlighter = getHighlighter();
@@ -353,10 +415,10 @@ function renderCodeSegment(lines, startLine, lang) {
       defaultColor: false,
     });
     const fragment = JSDOM.fragment(html);
-    const inner = fragment.querySelector('code').innerHTML;
+    const inner = (fragment.querySelector('code') as HTMLElement).innerHTML;
     lineHtml = splitHighlightedHtmlIntoLines(inner, lines.length);
-  } catch (err) {
-    log.error`Failed to highlight code block: ${err.message}`;
+  } catch (err: unknown) {
+    log.error`Failed to highlight code block: ${(err as Error).message}`;
   }
 
   if (!lineHtml) {
@@ -371,7 +433,11 @@ function renderCodeSegment(lines, startLine, lang) {
   return `<pre>${rows.join('')}</pre>`;
 }
 
-function renderCodeWithComments(sourceCode, lang, siteVariables) {
+export function renderCodeWithComments(
+  sourceCode: string,
+  lang: string,
+  siteVariables: SiteVariables,
+): string {
   const md = createCodeMarkdown(siteVariables);
   const lines = sourceCode.split('\n');
   if (lines[lines.length - 1] === '') {
@@ -379,9 +445,9 @@ function renderCodeWithComments(sourceCode, lang, siteVariables) {
   }
 
   // Group lines into segments
-  const segments = [];
-  let currentType = null;
-  let currentLines = [];
+  const segments: CodeSegment[] = [];
+  let currentType: string | null = null;
+  let currentLines: string[] = [];
   let currentStart = 1;
 
   for (let i = 0; i < lines.length; i++) {
@@ -430,10 +496,3 @@ function renderCodeWithComments(sourceCode, lang, siteVariables) {
     })
     .join('');
 }
-
-module.exports = {
-  createCodeMarkdown,
-  extractJavaMethodToc,
-  renderCodeSegment,
-  renderCodeWithComments,
-};

package/{webpack/utils/content-files.js → build/utils/content-files.ts}

@@ -1,14 +1,14 @@
-const fs = require('fs');
-const path = require('path');
-const { parseFrontMatterAndContent } = require('./front-matter');
-const {
-  PUBLIC_ASSET_EXTENSIONS,
+import fs from 'fs';
+import path from 'path';
+import { parseFrontMatterAndContent } from './front-matter.js';
+import {
+  getProcessedExtensions,
   extensionIsMarkdown,
   isLiterateJava,
-} = require('./file-types');
-const { getPublicDir, normalizeOutputPath } = require('./paths');
+} from './file-types.js';
+import { getPublicDir, normalizeOutputPath } from './paths.js';
 
-function walkFiles(dir) {
+function walkFiles(dir: string): string[] {
   return fs.readdirSync(dir).flatMap(file => {
     const fullPath = path.join(dir, file);
     if (fs.statSync(fullPath).isDirectory()) {
@@ -18,8 +18,11 @@ function walkFiles(dir) {
   });
 }
 
-function getContentFiles(contentDir, codeExtensions) {
-  const extensions = ['md', 'html', 'pdf', ...codeExtensions];
+export function getContentFiles(
+  contentDir: string,
+  codeExtensions: string[],
+): string[] {
+  const extensions = ['md', 'html', ...codeExtensions];
   const pattern = new RegExp(`\\.(${extensions.join('|')})$`);
 
   return walkFiles(contentDir).filter(filePath => {
@@ -27,7 +30,7 @@ function getContentFiles(contentDir, codeExtensions) {
   });
 }
 
-function shouldSkipContentFile(filePath) {
+export function shouldSkipContentFile(filePath: string): boolean {
   const ext = path.extname(filePath).toLowerCase();
   if (!(extensionIsMarkdown(ext) || ext === '.html')) {
     return false;
@@ -38,13 +41,19 @@ function shouldSkipContentFile(filePath) {
   return pageVariables?.skip === true;
 }
 
-function getBuildContentFiles(contentDir, codeExtensions) {
+export function getBuildContentFiles(
+  contentDir: string,
+  codeExtensions: string[],
+): string[] {
   return getContentFiles(contentDir, codeExtensions).filter(
     filePath => !shouldSkipContentFile(filePath),
   );
 }
 
-function addGeneratedRouteAliases(pathSet, outputPath) {
+function addGeneratedRouteAliases(
+  pathSet: Set<string>,
+  outputPath: string,
+): void {
   const normalizedPath = normalizeOutputPath(outputPath);
   pathSet.add(normalizedPath);
 
@@ -59,7 +68,7 @@ function addGeneratedRouteAliases(pathSet, outputPath) {
   }
 }
 
-function getPublicFiles(publicDir) {
+function getPublicFiles(publicDir: string): string[] {
   if (!fs.existsSync(publicDir)) {
     return [];
   }
@@ -67,7 +76,10 @@ function getPublicFiles(publicDir) {
   return walkFiles(publicDir);
 }
 
-function getFilesByExtensions(rootDir, extensions) {
+export function getFilesByExtensions(
+  rootDir: string,
+  extensions: string[],
+): string[] {
   if (!fs.existsSync(rootDir)) {
     return [];
   }
@@ -80,12 +92,15 @@ function getFilesByExtensions(rootDir, extensions) {
   });
 }
 
-function getValidInternalTargets(contentDir, contentFiles, codeExtensions) {
-  const targets = new Set();
+export function getValidInternalTargets(
+  contentDir: string,
+  contentFiles: string[],
+  codeExtensions: string[],
+): Set<string> {
+  const targets = new Set<string>();
   const codeExtensionSet = new Set(
     codeExtensions.map(ext => ext.toLowerCase()),
   );
-  const contentAssetExtensionSet = new Set(PUBLIC_ASSET_EXTENSIONS);
 
   for (const filePath of contentFiles) {
     const relPath = path.relative(contentDir, filePath);
@@ -110,21 +125,19 @@ function getValidInternalTargets(contentDir, contentFiles, codeExtensions) {
       );
     } else if (extensionIsMarkdown(ext) || ext === '.html') {
       addGeneratedRouteAliases(targets, `/${subPath}.html`);
-    } else if (ext === '.pdf') {
-      targets.add(normalizeOutputPath(`/${relPath}`));
     } else if (codeExtensionSet.has(ext.slice(1))) {
       addGeneratedRouteAliases(targets, `/${subPath}.html`);
       targets.add(normalizeOutputPath(`/${relPath}`));
-    } else if (contentAssetExtensionSet.has(ext.slice(1))) {
-      targets.add(normalizeOutputPath(`/${relPath}`));
     }
   }
 
-  // Include non-page assets in content/ that are copied directly to dist/.
-  for (const filePath of getFilesByExtensions(
-    contentDir,
-    PUBLIC_ASSET_EXTENSIONS,
-  )) {
+  // Include non-processed assets in content/ that are copied directly to dist/.
+  const processedExtSet = new Set(getProcessedExtensions(codeExtensions));
+  for (const filePath of walkFiles(contentDir)) {
+    const ext = path.extname(filePath).slice(1).toLowerCase();
+    if (processedExtSet.has(ext)) {
+      continue;
+    }
     const relPath = path.relative(contentDir, filePath);
     targets.add(normalizeOutputPath(`/${relPath}`));
   }
@@ -137,11 +150,3 @@ function getValidInternalTargets(contentDir, contentFiles, codeExtensions) {
 
   return targets;
 }
-
-module.exports = {
-  extensionIsMarkdown,
-  getBuildContentFiles,
-  getContentFiles,
-  getValidInternalTargets,
-  shouldSkipContentFile,
-};

package/build/utils/derive-theme.test.ts

@@ -0,0 +1,111 @@
+import { describe, expect, test } from 'bun:test';
+import { parse, oklch } from 'culori';
+import { deriveTheme, getTextOnColor } from './derive-theme.js';
+
+function getL(hex: string): number {
+  return oklch(parse(hex))!.l;
+}
+
+describe('deriveTheme', () => {
+  test('returns valid hex strings for all outputs', () => {
+    const result = deriveTheme('steelblue');
+    for (const value of Object.values(result)) {
+      expect(value).toMatch(/^#[0-9a-f]{3,6}$/);
+    }
+  });
+
+  test('light theme color lightness is in range', () => {
+    for (const color of [
+      'cornsilk',
+      'navy',
+      'steelblue',
+      'tomato',
+      '#000',
+      '#fff',
+    ]) {
+      const { themeColorLight } = deriveTheme(color);
+      const l = getL(themeColorLight);
+      expect(l).toBeGreaterThanOrEqual(0.34);
+      expect(l).toBeLessThanOrEqual(0.63);
+    }
+  });
+
+  test('dark theme color lightness is in range', () => {
+    for (const color of [
+      'cornsilk',
+      'navy',
+      'steelblue',
+      'tomato',
+      '#000',
+      '#fff',
+    ]) {
+      const { themeColorDark } = deriveTheme(color);
+      const l = getL(themeColorDark);
+      expect(l).toBeGreaterThanOrEqual(0.54);
+      expect(l).toBeLessThanOrEqual(0.81);
+    }
+  });
+
+  test('light text color lightness is in range', () => {
+    for (const color of ['cornsilk', 'navy', 'steelblue', 'tomato', 'lime']) {
+      const { themeColorTextLight } = deriveTheme(color);
+      const l = getL(themeColorTextLight);
+      expect(l).toBeGreaterThanOrEqual(0.34);
+      expect(l).toBeLessThanOrEqual(0.51);
+    }
+  });
+
+  test('dark text color lightness is in range', () => {
+    for (const color of ['cornsilk', 'navy', 'steelblue', 'tomato', 'lime']) {
+      const { themeColorTextDark } = deriveTheme(color);
+      const l = getL(themeColorTextDark);
+      expect(l).toBeGreaterThanOrEqual(0.69);
+      expect(l).toBeLessThanOrEqual(0.83);
+    }
+  });
+
+  test('white text on dark colors', () => {
+    expect(deriveTheme('navy').textOnThemeLight).toBe('#fff');
+    expect(deriveTheme('#000').textOnThemeLight).toBe('#fff');
+    expect(deriveTheme('hsl(351 70% 40%)').textOnThemeLight).toBe('#fff');
+  });
+
+  test('black text on bright colors', () => {
+    expect(deriveTheme('lime').textOnThemeLight).toBe('#000');
+  });
+
+  test('white text on saturated and mid-tone colors', () => {
+    expect(deriveTheme('steelblue').textOnThemeLight).toBe('#fff');
+    expect(deriveTheme('teal').textOnThemeLight).toBe('#fff');
+    expect(deriveTheme('tomato').textOnThemeLight).toBe('#fff');
+    expect(deriveTheme('cornsilk').textOnThemeLight).toBe('#fff');
+    expect(deriveTheme('hsl(195 70% 40%)').textOnThemeLight).toBe('#fff');
+  });
+
+  test('steelblue produces values close to original', () => {
+    const result = deriveTheme('steelblue');
+    // steelblue OKLCH L is ~0.588 which is within light theme range,
+    // so it should be unchanged (or very close)
+    expect(result.themeColorLight).toBe('#4682b4');
+  });
+
+  test('throws on invalid color', () => {
+    expect(() => deriveTheme('notacolor')).toThrow('Invalid color');
+  });
+});
+
+describe('getTextOnColor', () => {
+  test('returns white for dark colors', () => {
+    expect(getTextOnColor('navy')).toBe('#fff');
+    expect(getTextOnColor('#000')).toBe('#fff');
+  });
+
+  test('returns black for bright colors', () => {
+    expect(getTextOnColor('cornsilk')).toBe('#000');
+    expect(getTextOnColor('#fff')).toBe('#000');
+  });
+
+  test('throws on invalid color', () => {
+    expect(() => getTextOnColor('notacolor')).toThrow('Invalid color');
+  });
+});

package/build/utils/derive-theme.ts

@@ -0,0 +1,85 @@
+import { parse, oklch, rgb, toGamut, formatHex } from 'culori';
+import type { Oklch, Rgb } from 'culori';
+import type { DerivedTheme } from '../types.js';
+
+// OKLCH lightness range for the theme color used as backgrounds/outlines
+const LIGHT_THEME_L_MIN = 0.35;
+const LIGHT_THEME_L_MAX = 0.62;
+const DARK_THEME_L_MIN = 0.55;
+const DARK_THEME_L_MAX = 0.8;
+
+// OKLCH lightness range for theme-derived text on page backgrounds
+const LIGHT_TEXT_L_MIN = 0.35;
+const LIGHT_TEXT_L_MAX = 0.5;
+const DARK_TEXT_L_MIN = 0.7;
+const DARK_TEXT_L_MAX = 0.82;
+
+function clamp(v: number, min: number, max: number): number {
+  return Math.min(Math.max(v, min), max);
+}
+
+function linearize(c: number): number {
+  return c <= 0.04045 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+}
+
+function relativeLuminance({ r, g, b }: Rgb): number {
+  return 0.2126 * linearize(r) + 0.7152 * linearize(g) + 0.0722 * linearize(b);
+}
+
+function contrastRatio(l1: number, l2: number): number {
+  return (Math.max(l1, l2) + 0.05) / (Math.min(l1, l2) + 0.05);
+}
+
+// Pick black or white text for use on the given background color.
+// Prefer white unless black has substantially better contrast (1.5x),
+// which gives white text on saturated mid-tone colors like steelblue and tomato.
+function pickTextColor(bgHex: string): '#fff' | '#000' {
+  const bgRgb = rgb(parse(bgHex)) as Rgb;
+  const bgLum = relativeLuminance(bgRgb);
+  const whiteContrast = contrastRatio(1, bgLum);
+  const blackContrast = contrastRatio(bgLum, 0);
+  return blackContrast > whiteContrast * 1.9 ? '#000' : '#fff';
+}
+
+function toHex(oklchColor: Oklch): string {
+  return formatHex(toGamut('rgb', 'oklch')(oklchColor));
+}
+
+export function deriveTheme(cssColor: string): DerivedTheme {
+  const parsed = parse(cssColor);
+  if (!parsed) {
+    throw new Error(`Invalid color: ${cssColor}`);
+  }
+
+  const base = oklch(parsed) as Oklch;
+  const l = base.l;
+  const c = base.c || 0;
+  const h = base.h;
+
+  const lightL = clamp(l, LIGHT_THEME_L_MIN, LIGHT_THEME_L_MAX);
+  const darkL = clamp(l, DARK_THEME_L_MIN, DARK_THEME_L_MAX);
+
+  const textLightL = clamp(l, LIGHT_TEXT_L_MIN, LIGHT_TEXT_L_MAX);
+  const textDarkL = clamp(l, DARK_TEXT_L_MIN, DARK_TEXT_L_MAX);
+
+  const themeColorLight = toHex({ mode: 'oklch', l: lightL, c, h });
+  const themeColorDark = toHex({ mode: 'oklch', l: darkL, c, h });
+
+  return {
+    themeColorLight,
+    themeColorDark,
+    themeColorTextLight: toHex({ mode: 'oklch', l: textLightL, c, h }),
+    themeColorTextDark: toHex({ mode: 'oklch', l: textDarkL, c, h }),
+    textOnThemeLight: pickTextColor(themeColorLight),
+    textOnThemeDark: pickTextColor(themeColorDark),
+  };
+}
+
+export function getTextOnColor(cssColor: string): '#fff' | '#000' {
+  const parsed = parse(cssColor);
+  if (!parsed) {
+    throw new Error(`Invalid color: ${cssColor}`);
+  }
+  const gamutMapped = formatHex(toGamut('rgb', 'oklch')(parsed));
+  return pickTextColor(gamutMapped);
+}