@juspay/svelte-ui-components 3.5.0 → 4.0.0

package/dist-codemod/bin.js

@@ -0,0 +1,32 @@
+#!/usr/bin/env node
+// The installed entry point. Kept apart from cli.ts on purpose: cli.ts imports
+// the transform, which imports `svelte/compiler` at module load, so a consumer
+// missing it would get a bare module-resolution stack before any code of ours
+// ran. Resolving it first turns that into one line. Also the reason this does
+// not reuse cli.ts's own "am I the entry point" check — the bin is reached
+// through an npm symlink, whose path never matches the real module URL, so
+// that check would silently run nothing.
+const REQUIRED = ['svelte/compiler'];
+const missing = REQUIRED.filter((specifier) => {
+    try {
+        import.meta.resolve(specifier);
+        return false;
+    }
+    catch {
+        return true;
+    }
+});
+if (missing.length > 0) {
+    console.error(`sui-codemod needs ${missing.join(' and ')} installed in this project ` +
+        '(svelte is a peer dependency of @juspay/svelte-ui-components). ' +
+        'Install it and run the command again.');
+    process.exitCode = 1;
+}
+else {
+    const { runCodemod } = await import("./cli.js");
+    const summary = runCodemod(process.argv.slice(2), (line) => {
+        console.log(line);
+    });
+    process.exitCode = summary.exitCode;
+}
+export {};

package/dist-codemod/cli.js

@@ -0,0 +1,175 @@
+import { existsSync, readdirSync, readFileSync, statSync, writeFileSync } from 'node:fs';
+import { join, resolve } from 'node:path';
+import { pathToFileURL } from 'node:url';
+import { parseArgs } from 'node:util';
+import { transformSvelte } from "./transform.js";
+import { findChildrenAssignments } from "./wc-children.js";
+const USAGE = [
+    'Usage: npx sui-codemod [--dry-run] <path...>',
+    '       (inside this repository: node scripts/codemod/cli.ts ...)',
+    '',
+    'Prepares a @juspay/svelte-ui-components consumer for 4.0.0: renames every',
+    'deprecated event-prop spelling on library components to its corrected',
+    'spelling (see legacy-pairs.ts) and reports `children` assignments on the',
+    'custom elements that stop declaring it.',
+    '',
+    '  --dry-run   print every change as a diff without writing any file',
+    '  --help      show this help',
+    '',
+    'Paths may be files or directories; directories are walked recursively,',
+    'skipping node_modules, .git, .svelte-kit, dist, dist-wc, build, coverage,',
+    'playwright-report and test-results.'
+].join('\n');
+const SKIPPED_DIRECTORIES = new Set([
+    'node_modules',
+    '.git',
+    '.svelte-kit',
+    'dist',
+    'dist-wc',
+    'build',
+    'coverage',
+    'playwright-report',
+    'test-results'
+]);
+// Scripts are scanned for `children` assignments only; the prop renames live
+// in markup, so .svelte files are the only ones ever rewritten.
+const SCRIPT_FILE = /\.(ts|js|mts|mjs|cts|cjs)$/;
+function collectFiles(path, out) {
+    const stats = statSync(path);
+    if (stats.isFile()) {
+        if (path.endsWith('.svelte') || SCRIPT_FILE.test(path)) {
+            out.add(path);
+        }
+        return;
+    }
+    if (!stats.isDirectory()) {
+        return;
+    }
+    const entries = [...readdirSync(path, { withFileTypes: true })].sort((a, b) => a.name.localeCompare(b.name));
+    for (const entry of entries) {
+        if (entry.isDirectory()) {
+            if (!SKIPPED_DIRECTORIES.has(entry.name)) {
+                collectFiles(join(path, entry.name), out);
+            }
+        }
+        else if (entry.isFile()) {
+            collectFiles(join(path, entry.name), out);
+        }
+    }
+}
+/**
+ * Every edit the transform makes stays on a single line, so old and new text
+ * always have the same line count and a pairwise comparison is an exact diff.
+ */
+function printLineDiff(file, before, after, log) {
+    const oldLines = before.split('\n');
+    const newLines = after.split('\n');
+    log(`--- ${file}`);
+    if (oldLines.length !== newLines.length) {
+        log('  (line counts differ; showing full replacement)');
+        for (const line of oldLines) {
+            log(`- ${line}`);
+        }
+        for (const line of newLines) {
+            log(`+ ${line}`);
+        }
+        return;
+    }
+    oldLines.forEach((oldLine, index) => {
+        const newLine = newLines.at(index) ?? '';
+        if (oldLine !== newLine) {
+            log(`@@ ${file}:${index + 1}`);
+            log(`- ${oldLine}`);
+            log(`+ ${newLine}`);
+        }
+    });
+}
+export function runCodemod(argv, log) {
+    const failure = {
+        exitCode: 2,
+        filesScanned: 0,
+        filesChanged: 0,
+        propsRenamed: 0,
+        warnings: 0
+    };
+    let parsed;
+    try {
+        parsed = parseArgs({
+            args: [...argv],
+            options: {
+                'dry-run': { type: 'boolean' },
+                help: { type: 'boolean' }
+            },
+            allowPositionals: true,
+            strict: true
+        });
+    }
+    catch (error) {
+        log(error instanceof Error ? error.message : String(error));
+        log(USAGE);
+        return failure;
+    }
+    if (parsed.values.help === true) {
+        log(USAGE);
+        return { ...failure, exitCode: 0 };
+    }
+    if (parsed.positionals.length === 0) {
+        log(USAGE);
+        return failure;
+    }
+    for (const path of parsed.positionals) {
+        if (!existsSync(path)) {
+            log(`path does not exist: ${path}`);
+            return failure;
+        }
+    }
+    const dryRun = parsed.values['dry-run'] === true;
+    const files = new Set();
+    for (const path of parsed.positionals) {
+        collectFiles(resolve(path), files);
+    }
+    let filesChanged = 0;
+    let propsRenamed = 0;
+    let warnings = 0;
+    for (const file of files) {
+        const source = readFileSync(file, 'utf8');
+        // The `children` removal is a 4.0.0 breaking change to report, not a
+        // rename to apply, so it never contributes to filesChanged.
+        const childrenWarnings = findChildrenAssignments(source, file);
+        const result = file.endsWith('.svelte')
+            ? transformSvelte(source, file)
+            : { code: source, changed: false, propsRenamed: 0, warnings: [] };
+        for (const warning of [...result.warnings, ...childrenWarnings]) {
+            log(`${warning.file}:${warning.line}:${warning.column} WARN ${warning.message}`);
+        }
+        warnings += result.warnings.length + childrenWarnings.length;
+        if (!result.changed) {
+            continue;
+        }
+        filesChanged += 1;
+        propsRenamed += result.propsRenamed;
+        if (dryRun) {
+            printLineDiff(file, source, result.code, log);
+        }
+        else {
+            writeFileSync(file, result.code);
+            log(`${file}: ${result.propsRenamed} prop(s) renamed`);
+        }
+    }
+    log(`${dryRun ? '[dry run] ' : ''}scanned ${files.size} file(s), changed ${filesChanged}, ` +
+        `renamed ${propsRenamed} prop(s), ${warnings} warning(s)`);
+    return {
+        exitCode: 0,
+        filesScanned: files.size,
+        filesChanged,
+        propsRenamed,
+        warnings
+    };
+}
+const entryPoint = process.argv.at(1) ?? '';
+if (entryPoint !== '' && import.meta.url === pathToFileURL(entryPoint).href) {
+    const summary = runCodemod(process.argv.slice(2), (line) => {
+        console.log(line);
+    });
+    process.exitCode = summary.exitCode;
+}

package/dist-codemod/legacy-pairs.js

@@ -0,0 +1,228 @@
+/**
+ * Every event-prop spelling this library still accepts but has deprecated,
+ * mapped to the lowercase spelling a consumer should use instead
+ * (DESIGN_PRINCIPLES.md §3: event props are lowercase throughout). Generated
+ * from the `@deprecated` tags in `src/lib/**\/properties.ts` — the tag names
+ * the replacement, so the library's own declarations are the source of truth
+ * and this table is a snapshot of them.
+ *
+ * `component` is the exported component name a consumer imports, which is
+ * usually but not always the `properties.ts` directory name: Stepper's
+ * `properties.ts` declares props for both `Stepper` and `Step`, and the
+ * `onClick`/`onclick` entry attributed to `Step` comes from that one shared
+ * file (see `scripts/codemod/generate-maps.ts`'s `OWNER_COMPONENTS`).
+ *
+ * Every entry is a same-package rewrite (a consumer moving off a spelling
+ * this library itself deprecated), so there is no import specifier to touch,
+ * only the attribute name.
+ *
+ * `scripts/codemod/generate-maps.ts` recomputes this table from source;
+ * `legacy-pairs.test.ts` asserts the committed array below matches its
+ * output, so drift fails CI instead of shipping quietly.
+ */
+export const LEGACY_PAIRS = [
+    { component: 'Accordion', legacy: 'onToggle', corrected: 'ontoggle' },
+    { component: 'AreaChart', legacy: 'onPointHover', corrected: 'onpointhover' },
+    { component: 'AreaChart', legacy: 'onPointClick', corrected: 'onpointclick' },
+    { component: 'AttachmentChipRow', legacy: 'onRemoveImage', corrected: 'onremoveimage' },
+    { component: 'AttachmentChipRow', legacy: 'onRemoveFile', corrected: 'onremovefile' },
+    { component: 'AttachmentChipRow', legacy: 'onRemoveVideo', corrected: 'onremovevideo' },
+    { component: 'AttachmentChipRow', legacy: 'onOpenImage', corrected: 'onopenimage' },
+    { component: 'AttachmentChipRow', legacy: 'onOpenVideo', corrected: 'onopenvideo' },
+    { component: 'AttachmentChipRow', legacy: 'onOpenFile', corrected: 'onopenfile' },
+    { component: 'Banner', legacy: 'onDismiss', corrected: 'ondismiss' },
+    { component: 'BarChart', legacy: 'onChartReady', corrected: 'onchartready' },
+    { component: 'BarChart', legacy: 'onBarClick', corrected: 'onbarclick' },
+    { component: 'BarChart', legacy: 'onBarHover', corrected: 'onbarhover' },
+    { component: 'Book', legacy: 'onPageChange', corrected: 'onpagechange' },
+    { component: 'Calendar', legacy: 'onSelect', corrected: 'onselect' },
+    { component: 'Calendar', legacy: 'onRangeSelect', corrected: 'onrangeselect' },
+    { component: 'Calendar', legacy: 'onMonthChange', corrected: 'onmonthchange' },
+    { component: 'Chat', legacy: 'onSend', corrected: 'onsend' },
+    { component: 'Chat', legacy: 'onSuggestion', corrected: 'onsuggestion' },
+    { component: 'Chat', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'Chat', legacy: 'onStop', corrected: 'onstop' },
+    { component: 'Chat', legacy: 'onVoice', corrected: 'onvoice' },
+    { component: 'Chat', legacy: 'onAttach', corrected: 'onattach' },
+    { component: 'Chat', legacy: 'onRetry', corrected: 'onretry' },
+    { component: 'Chat', legacy: 'onFeedback', corrected: 'onfeedback' },
+    { component: 'ChatBubble', legacy: 'onOpen', corrected: 'onopen' },
+    { component: 'ChatBubble', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'ChatBubble', legacy: 'onToggle', corrected: 'ontoggle' },
+    { component: 'ChatComposer', legacy: 'onSubmit', corrected: 'onsubmit' },
+    { component: 'ChatComposer', legacy: 'onStop', corrected: 'onstop' },
+    { component: 'ChatComposer', legacy: 'onVoice', corrected: 'onvoice' },
+    { component: 'ChatComposer', legacy: 'onAttach', corrected: 'onattach' },
+    { component: 'ChatComposer', legacy: 'onAttachClick', corrected: 'onattachclick' },
+    { component: 'ChatComposer', legacy: 'onRemoveRichImage', corrected: 'onremoverichimage' },
+    { component: 'ChatComposer', legacy: 'onRemoveRichFile', corrected: 'onremoverichfile' },
+    { component: 'ChatComposer', legacy: 'onRemoveRichVideo', corrected: 'onremoverichvideo' },
+    { component: 'ChatComposer', legacy: 'onOpenRichImage', corrected: 'onopenrichimage' },
+    { component: 'ChatComposer', legacy: 'onOpenRichVideo', corrected: 'onopenrichvideo' },
+    { component: 'ChatComposer', legacy: 'onOpenRichFile', corrected: 'onopenrichfile' },
+    { component: 'ChatComposer', legacy: 'onAction', corrected: 'onaction' },
+    { component: 'ChatHeader', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'ChatMessage', legacy: 'onRetry', corrected: 'onretry' },
+    { component: 'ChatMessage', legacy: 'onFeedback', corrected: 'onfeedback' },
+    { component: 'ChatMessage', legacy: 'onCopy', corrected: 'oncopy' },
+    { component: 'ChatMessageList', legacy: 'onScrollState', corrected: 'onscrollstate' },
+    { component: 'ChatMessageList', legacy: 'onRetry', corrected: 'onretry' },
+    { component: 'ChatMessageList', legacy: 'onFeedback', corrected: 'onfeedback' },
+    { component: 'ChatSuggestions', legacy: 'onSelect', corrected: 'onselect' },
+    { component: 'CheckListItem', legacy: 'onClick', corrected: 'onclick' },
+    { component: 'Checkbox', legacy: 'onClick', corrected: 'onclick' },
+    { component: 'ChipInput', legacy: 'onAdd', corrected: 'onadd' },
+    { component: 'ChipInput', legacy: 'onDismiss', corrected: 'ondismiss' },
+    { component: 'ChipInput', legacy: 'onEdit', corrected: 'onedit' },
+    { component: 'ChipInput', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'Choicebox', legacy: 'onClick', corrected: 'onclick' },
+    { component: 'ColorPicker', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'ColorPicker', legacy: 'onInput', corrected: 'oninput' },
+    { component: 'Combobox', legacy: 'onSelect', corrected: 'onselect' },
+    { component: 'Combobox', legacy: 'onInput', corrected: 'oninput' },
+    { component: 'Combobox', legacy: 'onOpen', corrected: 'onopen' },
+    { component: 'Combobox', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'Combobox', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'Combobox', legacy: 'onAdd', corrected: 'onadd' },
+    { component: 'Combobox', legacy: 'onRemove', corrected: 'onremove' },
+    { component: 'Combobox', legacy: 'onCreate', corrected: 'oncreate' },
+    { component: 'CommandMenu', legacy: 'onSelect', corrected: 'onselect' },
+    { component: 'CommandMenu', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'ContextMenu', legacy: 'onSelect', corrected: 'onselect' },
+    { component: 'ContextMenu', legacy: 'onOpen', corrected: 'onopen' },
+    { component: 'ContextMenu', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'DateRangePicker', legacy: 'onApply', corrected: 'onapply' },
+    { component: 'DateRangePicker', legacy: 'onApplySingle', corrected: 'onapplysingle' },
+    { component: 'DateRangePicker', legacy: 'onApplyCompare', corrected: 'onapplycompare' },
+    { component: 'DateRangePicker', legacy: 'onCancel', corrected: 'oncancel' },
+    { component: 'DateRangePicker', legacy: 'onOpenToggle', corrected: 'onopentoggle' },
+    { component: 'DateRangePicker', legacy: 'onClear', corrected: 'onclear' },
+    { component: 'Draggable', legacy: 'onMoveStart', corrected: 'onmovestart' },
+    { component: 'Draggable', legacy: 'onMove', corrected: 'onmove' },
+    { component: 'Draggable', legacy: 'onMoveEnd', corrected: 'onmoveend' },
+    { component: 'DualAxisBarChart', legacy: 'onBarClick', corrected: 'onbarclick' },
+    { component: 'FileDropzoneTrigger', legacy: 'onClick', corrected: 'onclick' },
+    { component: 'FileInput', legacy: 'onFiles', corrected: 'onfiles' },
+    { component: 'FileInput', legacy: 'onError', corrected: 'onerror' },
+    { component: 'FunnelChart', legacy: 'onStageClick', corrected: 'onstageclick' },
+    { component: 'FunnelChart', legacy: 'onStageHover', corrected: 'onstagehover' },
+    { component: 'Gallery', legacy: 'onImageClick', corrected: 'onimageclick' },
+    { component: 'Gallery', legacy: 'onEditClick', corrected: 'oneditclick' },
+    { component: 'Gallery', legacy: 'onDeleteClick', corrected: 'ondeleteclick' },
+    { component: 'Gallery', legacy: 'onOpen', corrected: 'onopen' },
+    { component: 'Gallery', legacy: 'onDismiss', corrected: 'onclose' },
+    { component: 'Gallery', legacy: 'onIndexChange', corrected: 'onchange' },
+    { component: 'HITL', legacy: 'onConfirm', corrected: 'onconfirm' },
+    { component: 'HITL', legacy: 'onMicToggle', corrected: 'onmictoggle' },
+    { component: 'IframeViewer', legacy: 'onMessage', corrected: 'onmessage' },
+    { component: 'Img', legacy: 'onError', corrected: 'onerror' },
+    { component: 'Input', legacy: 'onLeftIconClick', corrected: 'onlefticonclick' },
+    { component: 'Input', legacy: 'onRightIconClick', corrected: 'onrighticonclick' },
+    { component: 'Input', legacy: 'onInput', corrected: 'oninput' },
+    { component: 'Input', legacy: 'onFocus', corrected: 'onfocus' },
+    { component: 'Input', legacy: 'onFocusout', corrected: 'onfocusout' },
+    { component: 'Input', legacy: 'onBlur', corrected: 'onblur' },
+    { component: 'Input', legacy: 'onPaste', corrected: 'onpaste' },
+    { component: 'Input', legacy: 'onClick', corrected: 'onclick' },
+    { component: 'Input', legacy: 'onStateChange', corrected: 'onstatechange' },
+    { component: 'Input', legacy: 'onKeyDown', corrected: 'onkeydown' },
+    { component: 'LineChart', legacy: 'onPointClick', corrected: 'onpointclick' },
+    { component: 'LineChart', legacy: 'onPointHover', corrected: 'onpointhover' },
+    { component: 'LineChart', legacy: 'onChartReady', corrected: 'onchartready' },
+    { component: 'ListItem', legacy: 'onleftImageClick', corrected: 'onleftimageclick' },
+    { component: 'ListItem', legacy: 'onLeftImageClick', corrected: 'onleftimageclick' },
+    { component: 'ListItem', legacy: 'onrightImageClick', corrected: 'onrightimageclick' },
+    { component: 'ListItem', legacy: 'onRightImageClick', corrected: 'onrightimageclick' },
+    { component: 'ListItem', legacy: 'oncenterTextClick', corrected: 'oncentertextclick' },
+    { component: 'ListItem', legacy: 'onCenterTextClick', corrected: 'oncentertextclick' },
+    { component: 'ListItem', legacy: 'onitemClick', corrected: 'onitemclick' },
+    { component: 'ListItem', legacy: 'onItemClick', corrected: 'onitemclick' },
+    { component: 'ListItem', legacy: 'ontopSectionClick', corrected: 'ontopsectionclick' },
+    { component: 'ListItem', legacy: 'onTopSectionClick', corrected: 'ontopsectionclick' },
+    { component: 'LottiePlayer', legacy: 'onComplete', corrected: 'oncomplete' },
+    { component: 'LottiePlayer', legacy: 'onError', corrected: 'onerror' },
+    { component: 'MediaPlayer', legacy: 'onVolumeChange', corrected: 'onvolumechange' },
+    { component: 'MediaUpload', legacy: 'onFilesChange', corrected: 'onchange' },
+    { component: 'MediaUpload', legacy: 'onRemove', corrected: 'onremove' },
+    { component: 'MediaUpload', legacy: 'onRejected', corrected: 'onerror' },
+    { component: 'Menu', legacy: 'onSelect', corrected: 'onselect' },
+    { component: 'Menu', legacy: 'onOpen', corrected: 'onopen' },
+    { component: 'Menu', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'Modal', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'Modal', legacy: 'onheaderRightImageClick', corrected: 'onheaderrightimageclick' },
+    { component: 'Modal', legacy: 'onHeaderRightImageClick', corrected: 'onheaderrightimageclick' },
+    { component: 'Modal', legacy: 'onheaderLeftImageClick', corrected: 'onheaderleftimageclick' },
+    { component: 'Modal', legacy: 'onHeaderLeftImageClick', corrected: 'onheaderleftimageclick' },
+    { component: 'Modal', legacy: 'onprimaryButtonClick', corrected: 'onprimarybuttonclick' },
+    { component: 'Modal', legacy: 'onPrimaryButtonClick', corrected: 'onprimarybuttonclick' },
+    { component: 'Modal', legacy: 'onsecondaryButtonClick', corrected: 'onsecondarybuttonclick' },
+    { component: 'Modal', legacy: 'onSecondaryButtonClick', corrected: 'onsecondarybuttonclick' },
+    { component: 'Modal', legacy: 'onoverlayClick', corrected: 'onoverlayclick' },
+    { component: 'Modal', legacy: 'onOverlayClick', corrected: 'onoverlayclick' },
+    { component: 'Pagination', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'Pagination', legacy: 'onLoadMore', corrected: 'onloadmore' },
+    { component: 'PieChart', legacy: 'onChartReady', corrected: 'onchartready' },
+    { component: 'PieChart', legacy: 'onSliceClick', corrected: 'onsliceclick' },
+    { component: 'PieChart', legacy: 'onSliceHover', corrected: 'onslicehover' },
+    { component: 'Pill', legacy: 'onDismiss', corrected: 'ondismiss' },
+    { component: 'Radio', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'Resizable', legacy: 'onResize', corrected: 'onresize' },
+    { component: 'Resizable', legacy: 'onResizeStart', corrected: 'onresizestart' },
+    { component: 'Resizable', legacy: 'onResizeEnd', corrected: 'onresizeend' },
+    { component: 'SankeyChart', legacy: 'onNodeClick', corrected: 'onnodeclick' },
+    { component: 'SankeyChart', legacy: 'onLinkClick', corrected: 'onlinkclick' },
+    { component: 'SankeyChart', legacy: 'onNodeHover', corrected: 'onnodehover' },
+    { component: 'SankeyChart', legacy: 'onLinkHover', corrected: 'onlinkhover' },
+    { component: 'Scroller', legacy: 'onScrollPosition', corrected: 'onscrollposition' },
+    { component: 'Select', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'Select', legacy: 'onOpen', corrected: 'onopen' },
+    { component: 'Select', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'Sheet', legacy: 'onClose', corrected: 'onclose' },
+    { component: 'Sheet', legacy: 'onAfterOpen', corrected: 'onafteropen' },
+    { component: 'Sheet', legacy: 'onAfterClose', corrected: 'onafterclose' },
+    { component: 'Slider', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'Slider', legacy: 'onInput', corrected: 'oninput' },
+    { component: 'Snippet', legacy: 'onCopy', corrected: 'oncopy' },
+    { component: 'SplitButton', legacy: 'onSelect', corrected: 'onselect' },
+    { component: 'SplitInput', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'SplitInput', legacy: 'onInput', corrected: 'oninput' },
+    { component: 'SplitInput', legacy: 'onComplete', corrected: 'oncomplete' },
+    { component: 'StatCard', legacy: 'onCheckboxChange', corrected: 'oncheckboxchange' },
+    { component: 'Status', legacy: 'onbuttonClick', corrected: 'onbuttonclick' },
+    { component: 'Status', legacy: 'onButtonClick', corrected: 'onbuttonclick' },
+    { component: 'Stepper', legacy: 'onstepclick', corrected: 'onhandlestepclick' },
+    { component: 'Stepper', legacy: 'onStepClick', corrected: 'onhandlestepclick' },
+    { component: 'Stepper', legacy: 'onhandleStepClick', corrected: 'onhandlestepclick' },
+    { component: 'Stepper', legacy: 'onHandleStepClick', corrected: 'onhandlestepclick' },
+    { component: 'Step', legacy: 'onClick', corrected: 'onclick' },
+    { component: 'Table', legacy: 'onRowClick', corrected: 'onrowclick' },
+    { component: 'Table', legacy: 'onSort', corrected: 'onsort' },
+    { component: 'Table', legacy: 'onSearchChange', corrected: 'onsearchchange' },
+    { component: 'Tabs', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'Tabs', legacy: 'onKeyChange', corrected: 'onkeychange' },
+    { component: 'TaskList', legacy: 'onRetry', corrected: 'onretry' },
+    { component: 'ThemeSwitcher', legacy: 'onChange', corrected: 'onchange' },
+    { component: 'ThinkingIndicator', legacy: 'onToggle', corrected: 'ontoggle' },
+    { component: 'ThinkingIndicator', legacy: 'onRowSelect', corrected: 'onrowselect' },
+    { component: 'ThinkingIndicator', legacy: 'onSettled', corrected: 'onsettled' },
+    { component: 'Toast', legacy: 'onToastHide', corrected: 'ontoasthide' },
+    { component: 'Toggle', legacy: 'onClick', corrected: 'onclick' },
+    { component: 'ToolCallLog', legacy: 'onChipClick', corrected: 'onchipclick' },
+    { component: 'Toolbar', legacy: 'onbackClick', corrected: 'onbackclick' },
+    { component: 'Toolbar', legacy: 'onBackClick', corrected: 'onbackclick' },
+    { component: 'TypewriterText', legacy: 'onProgress', corrected: 'onprogress' }
+];
+/** component name -> (legacy prop name -> corrected prop name). */
+export function legacyRenameTable() {
+    const table = new Map();
+    for (const pair of LEGACY_PAIRS) {
+        const component = table.get(pair.component) ?? new Map();
+        component.set(pair.legacy, pair.corrected);
+        table.set(pair.component, component);
+    }
+    return table;
+}
+/** Every legacy prop name across all components, for unresolved-tag warnings. */
+export function legacyProps() {
+    return new Set(LEGACY_PAIRS.map((pair) => pair.legacy));
+}