@astryxdesign/core 0.1.4-canary.ff77e1c → 0.1.4

package/src/theme/themingTargets.test.ts

@@ -1,353 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-/* eslint-disable @typescript-eslint/no-require-imports */
-/**
- * @file Guards `theming.targets` against the real `themeProps()` call sites (#3741).
- * @input Component sources (*.tsx/*.ts) and their `{Name}.doc.mjs` files.
- * @output Vitest failures naming each undocumented class / visual prop.
- * @position Sibling of derivedVarRegistry.test.ts, which already validates the
- *   OTHER fields of the same `theming` block (`vars`, `derived`). `targets` was
- *   the one field with no machine check, so it drifted — twice (#3652, #3680).
- *
- * `theming.targets` is the documented CSS surface of a component: the stable
- * `astryx-*` classes it renders and the visual props it reflects as data
- * attributes. It is hand-authored, while the truth lives in `themeProps()`
- * calls in the source. Nothing kept the two in agreement.
- *
- * Drift is not cosmetic. `targets` is what theme authors and codegen read to
- * learn which selectors exist; an undocumented class is an unthemeable element.
- *
- * Policy is SUBSET, not equality: every class rendered by `themeProps()` must be
- * documented, and every prop key passed to it must appear in that target's
- * `visualProps` or `states`. Docs may list MORE than the source passes —
- * components forward props they don't themselves reflect (Timestamp passes
- * `{format}` but documents `type`/`color`/`format`), and that is intentional.
- */
-
-import {describe, it, expect} from 'vitest';
-import {readdirSync, readFileSync} from 'node:fs';
-import {join} from 'node:path';
-import ts from 'typescript';
-import {stableClassName} from '../naming';
-
-const SRC_DIR = join(__dirname, '..');
-
-// ---------------------------------------------------------------------------
-// Source scanning: find themeProps() call sites via the TypeScript AST
-// ---------------------------------------------------------------------------
-
-interface ThemeTargetSite {
-  /** Full stable class, e.g. 'astryx-progressbar-fill'. */
-  className: string;
-  /** Keys of the object literal passed as the 2nd arg (may be empty). */
-  propKeys: string[];
-  /** True when the 2nd arg exists but its keys can't be read statically. */
-  isOpaque: boolean;
-}
-
-/**
- * Extract every `themeProps('name', {...})` call from a source file.
- *
- * Uses the AST rather than a regex because the call sites use every object
- * form: shorthand (`{variant}`), renamed (`{variant: fillVariant}` — the KEY is
- * the prop, not the value), and multi-line. A regex reading identifiers after
- * `:` would record `fillVariant`, a prop that does not exist.
- */
-function extractThemeTargets(
-  sourceText: string,
-  fileName = 'source.tsx',
-): ThemeTargetSite[] {
-  const sourceFile = ts.createSourceFile(
-    fileName,
-    sourceText,
-    ts.ScriptTarget.Latest,
-    /* setParentNodes */ true,
-    fileName.endsWith('.tsx') ? ts.ScriptKind.TSX : ts.ScriptKind.TS,
-  );
-
-  const sites: ThemeTargetSite[] = [];
-
-  const visit = (node: ts.Node): void => {
-    if (
-      ts.isCallExpression(node) &&
-      ts.isIdentifier(node.expression) &&
-      node.expression.text === 'themeProps'
-    ) {
-      const [nameArg, propsArg] = node.arguments;
-
-      // Only string-literal component names are resolvable. A dynamic name
-      // can't be checked statically; skip rather than guess.
-      if (nameArg != null && ts.isStringLiteralLike(nameArg)) {
-        const site: ThemeTargetSite = {
-          className: stableClassName(nameArg.text),
-          propKeys: [],
-          isOpaque: false,
-        };
-
-        if (propsArg != null) {
-          if (ts.isObjectLiteralExpression(propsArg)) {
-            for (const prop of propsArg.properties) {
-              if (ts.isSpreadAssignment(prop)) {
-                // {...rest} — keys unknown at parse time.
-                site.isOpaque = true;
-                continue;
-              }
-              const name = prop.name;
-              if (name == null) {
-                site.isOpaque = true;
-                continue;
-              }
-              if (ts.isIdentifier(name) || ts.isStringLiteralLike(name)) {
-                site.propKeys.push(name.text);
-              } else {
-                // Computed key: themeProps('x', {[k]: v})
-                site.isOpaque = true;
-              }
-            }
-          } else {
-            // A variable or call passed as the props bag.
-            site.isOpaque = true;
-          }
-        }
-
-        sites.push(site);
-      }
-    }
-
-    ts.forEachChild(node, visit);
-  };
-
-  visit(sourceFile);
-  return sites;
-}
-
-// ---------------------------------------------------------------------------
-// The extractor must be right before its verdicts mean anything.
-// ---------------------------------------------------------------------------
-
-describe('extractThemeTargets', () => {
-  it('reads a bare call with no props', () => {
-    expect(extractThemeTargets(`themeProps('progressbar-track')`)).toEqual([
-      {className: 'astryx-progressbar-track', propKeys: [], isOpaque: false},
-    ]);
-  });
-
-  it('reads shorthand props', () => {
-    expect(extractThemeTargets(`themeProps('progressbar', {variant})`)).toEqual(
-      [
-        {
-          className: 'astryx-progressbar',
-          propKeys: ['variant'],
-          isOpaque: false,
-        },
-      ],
-    );
-  });
-
-  it('records the KEY, not the value, when a prop is renamed', () => {
-    // The trap a regex falls into: `fillVariant` is a local, not a prop.
-    expect(
-      extractThemeTargets(
-        `themeProps('progressbar-fill', {variant: fillVariant})`,
-      ),
-    ).toEqual([
-      {
-        className: 'astryx-progressbar-fill',
-        propKeys: ['variant'],
-        isOpaque: false,
-      },
-    ]);
-  });
-
-  it('reads multi-line object literals', () => {
-    const src = `
-      const p = themeProps('outline', {
-        variant,
-        size: resolvedSize,
-      });
-    `;
-    expect(extractThemeTargets(src)).toEqual([
-      {
-        className: 'astryx-outline',
-        propKeys: ['variant', 'size'],
-        isOpaque: false,
-      },
-    ]);
-  });
-
-  it('reads a call whose result is immediately accessed', () => {
-    // Table does `themeProps('table').className` — still a rendered class.
-    expect(extractThemeTargets(`themeProps('table').className`)).toEqual([
-      {className: 'astryx-table', propKeys: [], isOpaque: false},
-    ]);
-  });
-
-  it('finds every call in a file', () => {
-    const src = `
-      <div {...themeProps('card', {variant})}>
-        <span {...themeProps('card-header')} />
-      </div>
-    `;
-    expect(extractThemeTargets(src).map(s => s.className)).toEqual([
-      'astryx-card',
-      'astryx-card-header',
-    ]);
-  });
-
-  it('marks a spread props bag opaque rather than guessing its keys', () => {
-    const [site] = extractThemeTargets(`themeProps('card', {...rest})`);
-    expect(site.isOpaque).toBe(true);
-    expect(site.propKeys).toEqual([]);
-  });
-
-  it('marks a non-literal props bag opaque', () => {
-    const [site] = extractThemeTargets(`themeProps('card', visualProps)`);
-    expect(site.isOpaque).toBe(true);
-  });
-
-  it('ignores a dynamic component name it cannot resolve', () => {
-    expect(extractThemeTargets(`themeProps(name, {variant})`)).toEqual([]);
-  });
-
-  it('ignores an unrelated function of a similar shape', () => {
-    expect(extractThemeTargets(`stylex.props('card', {variant})`)).toEqual([]);
-  });
-});
-
-// ---------------------------------------------------------------------------
-// Discovery: every component dir's rendered classes vs its documented targets
-// ---------------------------------------------------------------------------
-
-interface DocTarget {
-  className: string;
-  visualProps?: string[];
-  states?: string[];
-}
-
-type DocBlock = {theming?: {targets?: DocTarget[]}};
-type ComponentDocModule = {docs?: DocBlock; docsZh?: DocBlock};
-
-interface ComponentInfo {
-  dir: string;
-  sites: ThemeTargetSite[];
-  /** The doc blocks that carry theming.targets, by the key they live under. */
-  docBlocks: {key: 'docs' | 'docsZh'; targets: DocTarget[]}[];
-}
-
-function discoverComponents(): ComponentInfo[] {
-  const results: ComponentInfo[] = [];
-  const dirs = readdirSync(SRC_DIR, {withFileTypes: true})
-    .filter(d => d.isDirectory())
-    .map(d => d.name);
-
-  for (const dir of dirs) {
-    const dirPath = join(SRC_DIR, dir);
-    const dirEntries = readdirSync(dirPath);
-
-    const sourceFiles = dirEntries.filter(
-      f =>
-        (f.endsWith('.tsx') || f.endsWith('.ts')) &&
-        !f.includes('.test.') &&
-        !f.endsWith('.d.ts'),
-    );
-
-    const sites: ThemeTargetSite[] = [];
-    for (const f of sourceFiles) {
-      const filePath = join(dirPath, f);
-      sites.push(
-        ...extractThemeTargets(readFileSync(filePath, 'utf-8'), filePath),
-      );
-    }
-    if (sites.length === 0) {
-      continue;
-    }
-
-    // Match the on-disk listing rather than existsSync: on case-insensitive
-    // filesystems existsSync would match a differently-cased doc file that CI
-    // never checks. (Same guard as derivedVarRegistry.test.ts.)
-    if (!dirEntries.includes(`${dir}.doc.mjs`)) {
-      continue;
-    }
-
-    let mod: ComponentDocModule;
-    try {
-      mod = require(join(dirPath, `${dir}.doc.mjs`)) as ComponentDocModule;
-    } catch {
-      continue;
-    }
-
-    const docBlocks: ComponentInfo['docBlocks'] = [];
-    for (const key of ['docs', 'docsZh'] as const) {
-      const targets = mod[key]?.theming?.targets;
-      // Only blocks that already document a theming surface are held to it —
-      // a doc with no theming block at all is a separate (documentation) gap.
-      if (targets != null) {
-        docBlocks.push({key, targets});
-      }
-    }
-    if (docBlocks.length === 0) {
-      continue;
-    }
-
-    results.push({dir, sites, docBlocks});
-  }
-  return results;
-}
-
-// ---------------------------------------------------------------------------
-// The guard
-// ---------------------------------------------------------------------------
-
-describe('theming.targets matches the themeProps() call sites', () => {
-  const components = discoverComponents();
-
-  it('finds components to check', () => {
-    // A refactor that renames themeProps must not silently disable this file.
-    expect(components.length).toBeGreaterThan(0);
-  });
-
-  for (const {dir, sites, docBlocks} of components) {
-    const renderedClasses = [...new Set(sites.map(s => s.className))].sort();
-
-    for (const {key, targets} of docBlocks) {
-      const documented = new Set(targets.map(t => t.className));
-
-      it(`${dir} (${key}): every rendered class is documented`, () => {
-        const undocumented = renderedClasses.filter(c => !documented.has(c));
-        expect(
-          undocumented,
-          `${dir} renders ${undocumented.length} astryx-* class(es) that ` +
-            `${dir}.doc.mjs ${key}.theming.targets does not document: ` +
-            `${undocumented.join(', ')}. An undocumented class is an ` +
-            `unthemeable element — theme authors and codegen read targets[] ` +
-            `to learn which selectors exist. Add {className: '...'} entries.`,
-        ).toEqual([]);
-      });
-
-      it(`${dir} (${key}): every visual prop passed to themeProps is documented`, () => {
-        const missing: string[] = [];
-        for (const site of sites) {
-          const target = targets.find(t => t.className === site.className);
-          if (target == null) {
-            continue; // Reported by the class test above.
-          }
-          const known = new Set([
-            ...(target.visualProps || []),
-            ...(target.states || []),
-          ]);
-          for (const propKey of site.propKeys) {
-            if (!known.has(propKey)) {
-              missing.push(`${site.className}: ${propKey}`);
-            }
-          }
-        }
-        expect(
-          [...new Set(missing)],
-          `${dir} passes prop keys to themeProps() that ${dir}.doc.mjs ` +
-            `${key}.theming.targets does not list under visualProps/states. ` +
-            `Each one is a [data-*] selector consumers cannot discover.`,
-        ).toEqual([]);
-      });
-    }
-  }
-});

package/src/utils/color.test.ts

@@ -1,133 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-import {describe, expect, it} from 'vitest';
-import {parseHex, parseRgb, parseColor, formatHex, formatColor} from './color';
-
-describe('parseHex', () => {
-  it('parses #rrggbb', () => {
-    expect(parseHex('#0064E0')).toEqual({r: 0, g: 100, b: 224, a: 1});
-  });
-
-  it('parses without a leading #', () => {
-    expect(parseHex('0064E0')).toEqual({r: 0, g: 100, b: 224, a: 1});
-  });
-
-  it('expands #rgb shorthand', () => {
-    expect(parseHex('#abc')).toEqual({r: 0xaa, g: 0xbb, b: 0xcc, a: 1});
-  });
-
-  it('parses #rrggbbaa alpha', () => {
-    expect(parseHex('#00000080')).toEqual({r: 0, g: 0, b: 0, a: 128 / 255});
-  });
-
-  it('expands #rgba shorthand alpha', () => {
-    expect(parseHex('#f008')).toEqual({
-      r: 0xff,
-      g: 0,
-      b: 0,
-      a: 0x88 / 255,
-    });
-  });
-
-  it('returns null for non-hex input', () => {
-    expect(parseHex('rgb(0,0,0)')).toBeNull();
-    expect(parseHex('#12')).toBeNull();
-    expect(parseHex('#zzzzzz')).toBeNull();
-    // @ts-expect-error runtime guard for non-string input
-    expect(parseHex(null)).toBeNull();
-  });
-});
-
-describe('parseRgb', () => {
-  it('parses comma-separated rgb()', () => {
-    expect(parseRgb('rgb(0, 100, 224)')).toEqual({
-      r: 0,
-      g: 100,
-      b: 224,
-      a: 1,
-    });
-  });
-
-  it('parses rgba() with alpha', () => {
-    expect(parseRgb('rgba(0, 0, 0, 0.5)')).toEqual({r: 0, g: 0, b: 0, a: 0.5});
-  });
-
-  it('parses space-separated with slash alpha', () => {
-    expect(parseRgb('rgb(0 100 224 / 0.25)')).toEqual({
-      r: 0,
-      g: 100,
-      b: 224,
-      a: 0.25,
-    });
-  });
-
-  it('parses percentage channels', () => {
-    expect(parseRgb('rgb(100%, 0%, 0%)')).toEqual({
-      r: 255,
-      g: 0,
-      b: 0,
-      a: 1,
-    });
-  });
-
-  it('clamps alpha and channels into range', () => {
-    expect(parseRgb('rgba(300, -20, 10, 2)')).toEqual({
-      r: 255,
-      g: 0,
-      b: 10,
-      a: 1,
-    });
-  });
-
-  it('returns null when it cannot parse', () => {
-    expect(parseRgb('rgb(0, 0)')).toBeNull();
-    expect(parseRgb('#000000')).toBeNull();
-  });
-});
-
-describe('parseColor', () => {
-  it('routes hex and rgb strings to the right parser', () => {
-    expect(parseColor('#FFFFFF')).toEqual({r: 255, g: 255, b: 255, a: 1});
-    expect(parseColor('rgb(1, 2, 3)')).toEqual({r: 1, g: 2, b: 3, a: 1});
-  });
-
-  it('resolves the named colors used in token expressions', () => {
-    expect(parseColor('transparent')).toEqual({r: 0, g: 0, b: 0, a: 0});
-    expect(parseColor('BLACK')).toEqual({r: 0, g: 0, b: 0, a: 1});
-    expect(parseColor('white')).toEqual({r: 255, g: 255, b: 255, a: 1});
-  });
-
-  it('returns null for unsupported colors so callers can preserve them', () => {
-    expect(parseColor('var(--color-accent)')).toBeNull();
-    expect(parseColor('oklch(0.5 0.1 200)')).toBeNull();
-    expect(parseColor('rebeccapurple')).toBeNull();
-  });
-});
-
-describe('formatHex', () => {
-  it('formats channels as uppercase #RRGGBB', () => {
-    expect(formatHex(0, 100, 224)).toBe('#0064E0');
-  });
-
-  it('rounds and clamps out-of-range channels', () => {
-    expect(formatHex(-5, 300, 127.6)).toBe('#00FF80');
-  });
-});
-
-describe('formatColor', () => {
-  it('formats opaque colors as hex', () => {
-    expect(formatColor({r: 0, g: 100, b: 224, a: 1})).toBe('#0064E0');
-  });
-
-  it('formats translucent colors as rgba()', () => {
-    expect(formatColor({r: 0, g: 100, b: 224, a: 0.2})).toBe(
-      'rgba(0, 100, 224, 0.2)',
-    );
-  });
-
-  it('round-trips through parseColor', () => {
-    const parsed = parseColor('rgba(10, 20, 30, 0.5)');
-    expect(parsed).not.toBeNull();
-    expect(formatColor(parsed!)).toBe('rgba(10, 20, 30, 0.5)');
-  });
-});

package/src/utils/color.ts

@@ -1,148 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-/**
- * @file color.ts
- * @input CSS color strings (hex, rgb()/rgba(), a small set of named colors)
- * @output Shared color parsing/formatting primitives used across the design system
- * @position Package utility; backs theme token resolution, HCT color math, and chart rendering
- *
- * A single home for the color parsers that were previously duplicated across
- * the theme layer, charts, and lab. Consumers get one well-tested definition of
- * "parse this color" rather than several subtly different regexes.
- */
-
-/** A color decomposed into 0-255 RGB channels and a 0-1 alpha. */
-export interface RGBA {
-  r: number;
-  g: number;
-  b: number;
-  a: number;
-}
-
-/** The named colors the design system relies on in token expressions. */
-const NAMED_COLORS: Record<string, RGBA> = {
-  transparent: {r: 0, g: 0, b: 0, a: 0},
-  black: {r: 0, g: 0, b: 0, a: 1},
-  white: {r: 255, g: 255, b: 255, a: 1},
-};
-
-const clamp = (value: number, min: number, max: number): number =>
-  Math.max(min, Math.min(max, value));
-
-/** Expand a shorthand hex body (`rgb`/`rgba`) to its full form (`rrggbb`/`rrggbbaa`). */
-function expandShorthand(body: string): string {
-  return body
-    .split('')
-    .map(c => c + c)
-    .join('');
-}
-
-/**
- * Parse a hex color into {@link RGBA}. Accepts `#rgb`, `#rgba`, `#rrggbb`, and
- * `#rrggbbaa`, with or without the leading `#`. Returns null for anything else.
- */
-export function parseHex(hex: string): RGBA | null {
-  if (typeof hex !== 'string') {
-    return null;
-  }
-  const body = hex.trim().replace(/^#/, '');
-  const normalized =
-    body.length === 3 || body.length === 4 ? expandShorthand(body) : body;
-
-  if (
-    (normalized.length !== 6 && normalized.length !== 8) ||
-    !/^[0-9a-fA-F]+$/.test(normalized)
-  ) {
-    return null;
-  }
-
-  return {
-    r: parseInt(normalized.slice(0, 2), 16),
-    g: parseInt(normalized.slice(2, 4), 16),
-    b: parseInt(normalized.slice(4, 6), 16),
-    a: normalized.length === 8 ? parseInt(normalized.slice(6, 8), 16) / 255 : 1,
-  };
-}
-
-/**
- * Parse an `rgb()`/`rgba()` color into {@link RGBA}. Accepts comma- or
- * space-separated channels, an optional `/ alpha`, and percentage channels.
- */
-export function parseRgb(value: string): RGBA | null {
-  const open = value.indexOf('(');
-  if (open === -1 || !value.trim().endsWith(')')) {
-    return null;
-  }
-  const body = value
-    .slice(open + 1, value.lastIndexOf(')'))
-    .replace(/\//g, ' ');
-  const parts = body
-    .split(/[\s,]+/)
-    .map(p => p.trim())
-    .filter(Boolean);
-  if (parts.length < 3) {
-    return null;
-  }
-
-  const channel = (p: string): number => {
-    const n = p.endsWith('%') ? (parseFloat(p) / 100) * 255 : parseFloat(p);
-    return clamp(n, 0, 255);
-  };
-  const r = channel(parts[0]);
-  const g = channel(parts[1]);
-  const b = channel(parts[2]);
-  if ([r, g, b].some(Number.isNaN)) {
-    return null;
-  }
-
-  let a = 1;
-  if (parts.length >= 4) {
-    const raw = parts[3];
-    a = raw.endsWith('%') ? parseFloat(raw) / 100 : parseFloat(raw);
-    if (Number.isNaN(a)) {
-      return null;
-    }
-    a = clamp(a, 0, 1);
-  }
-  return {r, g, b, a};
-}
-
-/**
- * Parse a concrete CSS color string into {@link RGBA}. Supports hex,
- * `rgb()`/`rgba()`, and the named colors used in token expressions. Returns
- * null for anything it can't evaluate (e.g. `var()`, `oklch()`, unknown names)
- * so callers can preserve the original expression rather than guessing.
- */
-export function parseColor(value: string): RGBA | null {
-  const trimmed = value.trim();
-  const named = NAMED_COLORS[trimmed.toLowerCase()];
-  if (named) {
-    return {...named};
-  }
-  if (trimmed.startsWith('#')) {
-    return parseHex(trimmed);
-  }
-  if (/^rgba?\(/i.test(trimmed)) {
-    return parseRgb(trimmed);
-  }
-  return null;
-}
-
-/** Format RGB channels (0-255) as an uppercase `#RRGGBB` string. */
-export function formatHex(r: number, g: number, b: number): string {
-  const channel = (c: number): string =>
-    clamp(Math.round(c), 0, 255).toString(16).padStart(2, '0').toUpperCase();
-  return `#${channel(r)}${channel(g)}${channel(b)}`;
-}
-
-/**
- * Serialize {@link RGBA} to a compact, JS-usable CSS color: `#RRGGBB` when
- * fully opaque, otherwise `rgba(r, g, b, a)`.
- */
-export function formatColor({r, g, b, a}: RGBA): string {
-  if (a >= 1) {
-    return formatHex(r, g, b);
-  }
-  const round = (n: number): number => clamp(Math.round(n), 0, 255);
-  return `rgba(${round(r)}, ${round(g)}, ${round(b)}, ${parseFloat(a.toFixed(4))})`;
-}

package/src/utils/composeEventHandlers.test.ts

@@ -1,71 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-import {describe, expect, it, vi} from 'vitest';
-import type {SyntheticEvent} from 'react';
-import {composeEventHandlers} from './composeEventHandlers';
-
-function fakeEvent(): SyntheticEvent {
-  const event = {
-    defaultPrevented: false,
-    preventDefault() {
-      event.defaultPrevented = true;
-    },
-  };
-  return event as unknown as SyntheticEvent;
-}
-
-describe('composeEventHandlers', () => {
-  it('calls every handler in argument order', () => {
-    const calls: string[] = [];
-    const composed = composeEventHandlers(
-      () => calls.push('first'),
-      () => calls.push('second'),
-    );
-    composed(fakeEvent());
-    expect(calls).toEqual(['first', 'second']);
-  });
-
-  it('skips undefined handlers', () => {
-    const handler = vi.fn();
-    const composed = composeEventHandlers(undefined, handler, undefined);
-    composed(fakeEvent());
-    expect(handler).toHaveBeenCalledTimes(1);
-  });
-
-  it('passes the same event to each handler', () => {
-    const event = fakeEvent();
-    const a = vi.fn();
-    const b = vi.fn();
-    composeEventHandlers(a, b)(event);
-    expect(a).toHaveBeenCalledWith(event);
-    expect(b).toHaveBeenCalledWith(event);
-  });
-
-  it('stops after a handler prevents default', () => {
-    const first = vi.fn((e: SyntheticEvent) => e.preventDefault());
-    const second = vi.fn();
-    composeEventHandlers(first, second)(fakeEvent());
-    expect(first).toHaveBeenCalledTimes(1);
-    expect(second).not.toHaveBeenCalled();
-  });
-
-  it('lets a consumer handler opt out of later behavior (consumer-first order)', () => {
-    const consumer = vi.fn((e: SyntheticEvent) => e.preventDefault());
-    const ownBehavior = vi.fn();
-    composeEventHandlers(consumer, ownBehavior)(fakeEvent());
-    expect(ownBehavior).not.toHaveBeenCalled();
-  });
-
-  it('runs later handlers when default is not prevented', () => {
-    const consumer = vi.fn();
-    const ownBehavior = vi.fn();
-    composeEventHandlers(consumer, ownBehavior)(fakeEvent());
-    expect(ownBehavior).toHaveBeenCalledTimes(1);
-  });
-
-  it('returns a no-op-safe function when all handlers are undefined', () => {
-    expect(() =>
-      composeEventHandlers(undefined, undefined)(fakeEvent()),
-    ).not.toThrow();
-  });
-});