@contentful/experience-design-system-cli 2.14.2 → 2.15.0

package/dist/src/analyze/select/tui/components/RationalePanel.js

@@ -1,10 +1,6 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { PALETTE } from '../theme.js';
 import { Box, Text } from 'ink';
-/**
- * Word-wrap a single rationale paragraph to fit within `innerWidth` columns.
- * Returns an array of wrapped lines. Empty input → single empty line so the
- * row still occupies vertical space.
- */
 function wrapText(text, innerWidth) {
     if (!text)
         return [''];
@@ -16,7 +12,6 @@ function wrapText(text, innerWidth) {
     let current = '';
     for (const w of words) {
         if (current.length === 0) {
-            // Word longer than width — hard-break.
             if (w.length > width) {
                 let rest = w;
                 while (rest.length > width) {
@@ -52,13 +47,6 @@ function wrapText(text, innerWidth) {
         lines.push(current);
     return lines.length > 0 ? lines : [''];
 }
-/**
- * Flatten `rows` to a list of rendered lines so scrollOffset slicing matches
- * what the operator sees. Layout per row:
- *   <name>           ← bold
- *   <wrapped text>   ← one or more lines
- *   <blank>          ← spacer (omitted after the final row)
- */
 export function renderRationaleLines(rows, innerWidth) {
     const out = [];
     rows.forEach((row, idx) => {
@@ -80,12 +68,12 @@ export function RationalePanel({ componentName, rows, scrollOffset, width, heigh
     const overflowed = totalLines > height;
     const visibleStart = totalLines === 0 ? 0 : scrollOffset + 1;
     const visibleEnd = Math.min(totalLines, scrollOffset + height);
-    return (_jsxs(Box, { flexDirection: "column", width: width, height: height + 2, borderStyle: "single", borderColor: active ? 'white' : undefined, children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, dimColor: !active, children: `RATIONALE — ${componentName}` }), overflowed && (_jsxs(_Fragment, { children: [_jsx(Box, { flexGrow: 1 }), _jsx(Text, { dimColor: !active, children: `↕ ${visibleStart}-${visibleEnd}/${totalLines}` })] }))] }), visible.map((line, i) => {
+    return (_jsxs(Box, { flexDirection: "column", width: width, height: height + 2, borderStyle: "single", borderColor: active ? PALETTE.inverse : undefined, children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, dimColor: !active, children: `RATIONALE — ${componentName}` }), overflowed && (_jsxs(_Fragment, { children: [_jsx(Box, { flexGrow: 1 }), _jsx(Text, { dimColor: !active, children: `↕ ${visibleStart}-${visibleEnd}/${totalLines}` })] }))] }), visible.map((line, i) => {
                 if (line.kind === 'blank') {
                     return (_jsx(Box, { children: _jsx(Text, { children: " " }) }, i));
                 }
                 if (line.kind === 'name') {
-                    return (_jsxs(Box, { children: [_jsx(Text, { bold: true, color: "cyan", dimColor: !active, children: line.text }), line.isSlot && _jsx(Text, { dimColor: true, children: " (slot)" })] }, i));
+                    return (_jsxs(Box, { children: [_jsx(Text, { bold: true, color: PALETTE.info, dimColor: !active, children: line.text }), line.isSlot && _jsx(Text, { dimColor: true, children: " (slot)" })] }, i));
                 }
                 return (_jsx(Box, { children: _jsx(Text, { dimColor: !active, children: line.text }) }, i));
             })] }));

package/dist/src/analyze/select/tui/components/Sidebar.d.ts

@@ -1,11 +1,5 @@
 import React from 'react';
 import type { PreviewAnnotation, ReviewComponentSummary, ReviewComponentStatus } from '../../types.js';
-/**
- * Pilot-2026-06-23 R2: render a single-character preview-diff badge directly
- * before each component name in the sidebar so operators can scan the diff
- * shape at a glance without opening each row. Returns null for unannotated
- * rows so the row falls back to its existing single-space layout.
- */
 export declare function previewBadge(annotation: PreviewAnnotation | undefined): {
     char: string;
     color: string;

package/dist/src/analyze/select/tui/components/Sidebar.js

@@ -1,21 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
-/**
- * Pilot-2026-06-23 R2: render a single-character preview-diff badge directly
- * before each component name in the sidebar so operators can scan the diff
- * shape at a glance without opening each row. Returns null for unannotated
- * rows so the row falls back to its existing single-space layout.
- */
+import { PALETTE } from '../theme.js';
 export function previewBadge(annotation) {
     switch (annotation) {
         case 'new':
-            return { char: '+', color: 'green' };
+            return { char: '+', color: PALETTE.success };
         case 'changed':
-            return { char: '~', color: 'yellow' };
+            return { char: '~', color: PALETTE.warning };
         case 'removed':
-            return { char: '-', color: 'red', dim: true };
+            return { char: '-', color: PALETTE.error, dim: true };
         case 'breaking':
-            return { char: '!', color: 'red', bold: true };
+            return { char: '!', color: PALETTE.error, bold: true };
         default:
             return null;
     }
@@ -25,7 +20,6 @@ export function statusIcon(status, validationErrorCount,
 // decision must remain visible. Color is already yellow via statusColor for
 // warning-only components, so the warning cue is preserved.
 _validationWarningCount) {
-    // Errors override — a structurally broken component should never render as ✓/✗.
     if (validationErrorCount > 0)
         return '⚠';
     switch (status) {
@@ -41,18 +35,18 @@ _validationWarningCount) {
 }
 export function statusColor(status, validationErrorCount, validationWarningCount) {
     if (validationErrorCount > 0)
-        return 'red';
+        return PALETTE.error;
     if (validationWarningCount > 0)
-        return 'yellow';
+        return PALETTE.warning;
     switch (status) {
         case 'accepted':
-            return 'green';
+            return PALETTE.success;
         case 'rejected':
-            return 'red';
+            return PALETTE.error;
         case 'reviewed':
-            return 'yellow';
+            return PALETTE.warning;
         case 'needs-review':
-            return 'white';
+            return PALETTE.muted;
     }
 }
 function truncateName(name, maxLen) {
@@ -60,13 +54,6 @@ function truncateName(name, maxLen) {
         return name;
     return name.slice(0, maxLen) + '…';
 }
-/**
- * Sort key for stable secondary ordering within a validation tier:
- * needs-review components first, then by extractionConfidence ascending
- * (lowest confidence first, null treated as highest = last). Used to be
- * applied inline in App.tsx, then this helper sorted again — pulled in
- * here so the sort happens once.
- */
 function withinTierComparator(a, b) {
     const aPending = a.needsReview && a.status === 'needs-review' ? 0 : 1;
     const bPending = b.needsReview && b.status === 'needs-review' ? 0 : 1;
@@ -95,9 +82,6 @@ export function Sidebar({ components, selectedId, focused, scrollOffset, visible
                 const icon = statusIcon(component.status, component.validationErrorCount, component.validationWarningCount);
                 const color = statusColor(component.status, component.validationErrorCount, component.validationWarningCount);
                 const badge = previewBadge(component.previewAnnotation);
-                // Reserve one column for the preview badge regardless of whether this
-                // row has one — keeps name truncation stable across rows so the column
-                // width doesn't jitter as annotations flip in/out.
                 const maxNameLen = Math.max(1, width - 5);
                 const name = truncateName(component.name, maxNameLen);
                 if (collapsed) {

package/dist/src/analyze/select/tui/components/StatusBar.js

@@ -1,6 +1,7 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
+import { PALETTE } from '../theme.js';
 export function StatusBar({ accepted, rejected, reviewed, needsReview }) {
     const allResolved = needsReview === 0;
-    return (_jsxs(Box, { gap: 2, flexWrap: "wrap", children: [_jsxs(Text, { color: "green", children: [accepted, " accepted"] }), _jsxs(Text, { color: "red", children: [rejected, " rejected"] }), _jsxs(Text, { dimColor: true, children: [needsReview, " pending"] }), _jsxs(Text, { color: "cyan", children: [reviewed, " reviewed"] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: "[A] accept all" }), _jsx(Text, { bold: allResolved, color: allResolved ? 'green' : 'white', children: "[F] finalize" })] }));
+    return (_jsxs(Box, { gap: 2, flexWrap: "wrap", children: [_jsxs(Text, { color: PALETTE.success, children: [accepted, " accepted"] }), _jsxs(Text, { color: PALETTE.error, children: [rejected, " rejected"] }), _jsxs(Text, { dimColor: true, children: [needsReview, " pending"] }), _jsxs(Text, { color: PALETTE.info, children: [reviewed, " reviewed"] }), _jsx(Text, { dimColor: true, children: "\u00B7" }), _jsx(Text, { dimColor: true, children: "[A] accept all" }), _jsx(Text, { bold: allResolved, color: allResolved ? PALETTE.success : PALETTE.fg, children: "[F] finalize" })] }));
 }

package/dist/src/analyze/select/tui/components/removed-components-text.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentTypeSummary } from '@contentful/experience-design-system-types';
+/** Header line for the removed-components surfaces (deletion panel + finalize
+ *  dialog). Kept in one place so both read identically. `withExpandHint` adds
+ *  the panel's "[d] to expand/collapse" affordance, which the dialog omits. */
+export declare function removedComponentsHeader(count: number, withExpandHint: boolean): string;
+/** One bullet line per removed component, matching the deletion panel. */
+export declare function removedComponentLine(rc: ComponentTypeSummary): string;

package/dist/src/analyze/select/tui/components/removed-components-text.js

@@ -0,0 +1,11 @@
+/** Header line for the removed-components surfaces (deletion panel + finalize
+ *  dialog). Kept in one place so both read identically. `withExpandHint` adds
+ *  the panel's "[d] to expand/collapse" affordance, which the dialog omits. */
+export function removedComponentsHeader(count, withExpandHint) {
+    const hint = withExpandHint ? '  (press [d] to expand/collapse)' : '';
+    return `Removed components (${count}) — will be DELETED from target space${hint}`;
+}
+/** One bullet line per removed component, matching the deletion panel. */
+export function removedComponentLine(rc) {
+    return `- ${rc.name}${rc.id ? `  (${rc.id})` : ''}`;
+}

package/dist/src/analyze/select/tui/hooks/useImmediateInput.d.ts

@@ -10,15 +10,11 @@ type Key = {
     ctrl: boolean;
     shift: boolean;
     tab: boolean;
+    shiftTab: boolean;
     backspace: boolean;
     delete: boolean;
     meta: boolean;
 };
 type InputHandler = (input: string, key: Key) => void;
-/**
- * Like Ink's useInput, but uses useLayoutEffect so the listener is registered
- * synchronously after render. This allows stdin.write() calls in tests to work
- * immediately after render() without awaiting effects.
- */
 export declare function useImmediateInput(handler: InputHandler): void;
 export {};

package/dist/src/analyze/select/tui/hooks/useImmediateInput.js

@@ -1,6 +1,10 @@
 import { useLayoutEffect, useRef } from 'react';
 import { useStdin } from 'ink';
 function parseInput(data) {
+    // Shift-Tab in most terminals emits CSI Z (\x1b[Z). We surface it as both
+    // `tab` and `shiftTab` so callers that already branch on `tab` still fire,
+    // and new callers can distinguish direction via `shiftTab`.
+    const isShiftTab = data === '\x1b[Z';
     const key = {
         upArrow: data === '\x1b[A',
         downArrow: data === '\x1b[B',
@@ -11,22 +15,21 @@ function parseInput(data) {
         return: data === '\r' || data === '\n',
         escape: data === '\x1b',
         ctrl: false,
-        shift: false,
-        tab: data === '\t',
+        shift: isShiftTab,
+        tab: data === '\t' || isShiftTab,
+        shiftTab: isShiftTab,
         backspace: data === '\x7f' || data === '\b',
         delete: data === '\x1b[3~',
         meta: data === '\x1b',
     };
     let input = data;
-    // Ctrl+letter: data is \x01-\x1a (Ctrl+A through Ctrl+Z)
     if (data.length === 1) {
         const code = data.charCodeAt(0);
         if (code >= 1 && code <= 26) {
             key.ctrl = true;
-            input = String.fromCharCode(code + 96); // convert to lowercase letter
+            input = String.fromCharCode(code + 96);
         }
     }
-    // Arrow keys and special keys produce no printable input
     if (key.upArrow ||
         key.downArrow ||
         key.leftArrow ||
@@ -43,11 +46,6 @@ function parseInput(data) {
     }
     return { input, key };
 }
-/**
- * Like Ink's useInput, but uses useLayoutEffect so the listener is registered
- * synchronously after render. This allows stdin.write() calls in tests to work
- * immediately after render() without awaiting effects.
- */
 export function useImmediateInput(handler) {
     const { stdin, setRawMode } = useStdin();
     const handlerRef = useRef(handler);

package/dist/src/analyze/select/tui/theme.d.ts

@@ -0,0 +1,15 @@
+import type { ReviewComponentStatus } from '../types.js';
+export declare const PALETTE: {
+    readonly info: "#1773EB";
+    readonly success: "#00C459";
+    readonly error: "#E44F20";
+    readonly warning: "#FFDA00";
+    readonly fg: "#000000";
+    readonly inverse: "#FFFFFF";
+    readonly muted: "#A6B5C7";
+    readonly border: "#C4D1DE";
+    readonly subtle: "#DDE5EC";
+    readonly bg: "#EFF2F6";
+};
+export type PaletteRole = keyof typeof PALETTE;
+export declare function statusPaletteColor(status: ReviewComponentStatus, validationErrorCount: number, validationWarningCount: number): string;

package/dist/src/analyze/select/tui/theme.js

@@ -0,0 +1,28 @@
+export const PALETTE = {
+    info: '#1773EB',
+    success: '#00C459',
+    error: '#E44F20',
+    warning: '#FFDA00',
+    fg: '#000000',
+    inverse: '#FFFFFF',
+    muted: '#A6B5C7',
+    border: '#C4D1DE',
+    subtle: '#DDE5EC',
+    bg: '#EFF2F6',
+};
+export function statusPaletteColor(status, validationErrorCount, validationWarningCount) {
+    if (validationErrorCount > 0)
+        return PALETTE.error;
+    if (validationWarningCount > 0)
+        return PALETTE.warning;
+    switch (status) {
+        case 'accepted':
+            return PALETTE.success;
+        case 'rejected':
+            return PALETTE.error;
+        case 'reviewed':
+            return PALETTE.warning;
+        case 'needs-review':
+            return PALETTE.muted;
+    }
+}

package/dist/src/analyze/selection-cascade.d.ts

@@ -0,0 +1,3 @@
+import type { ComponentGraphNode } from './composite-closure.js';
+export declare function computeRejectCascade(target: string, components: ComponentGraphNode[]): Set<string>;
+export declare function computeAcceptCascade(target: string, components: ComponentGraphNode[]): Set<string>;

package/dist/src/analyze/selection-cascade.js

@@ -0,0 +1,19 @@
+import { computeClosure } from './composite-closure.js';
+import { findAllAncestors } from './lineage.js';
+export function computeRejectCascade(target, components) {
+    const out = new Set();
+    out.add(target);
+    for (const ancestor of findAllAncestors(target, components)) {
+        out.add(ancestor);
+    }
+    return out;
+}
+export function computeAcceptCascade(target, components) {
+    const out = new Set();
+    out.add(target);
+    const closure = computeClosure(target, components);
+    for (const node of closure.nodes) {
+        out.add(node.name);
+    }
+    return out;
+}

package/dist/src/analyze/slot-graph.d.ts

@@ -0,0 +1,11 @@
+import type { CDFComponentEntry } from '@contentful/experience-design-system-types';
+import type { ComponentGraphNode } from './composite-closure.js';
+export interface SlotGraphInput {
+    key: string;
+    entry: CDFComponentEntry;
+    status?: string;
+}
+export interface BuildOptions {
+    stripRejectedEdges?: boolean;
+}
+export declare function buildComponentGraph(components: SlotGraphInput[], opts?: BuildOptions): ComponentGraphNode[];

package/dist/src/analyze/slot-graph.js

@@ -0,0 +1,17 @@
+const REJECTED_STATUSES = new Set(['error', 'rejected']);
+export function buildComponentGraph(components, opts) {
+    const stripRejectedEdges = opts?.stripRejectedEdges === true;
+    return components.map((row) => {
+        if (stripRejectedEdges && row.status !== undefined && REJECTED_STATUSES.has(row.status)) {
+            return { name: row.key, slots: [] };
+        }
+        const slotDefs = row.entry.$slots ?? {};
+        const slots = Object.entries(slotDefs).map(([slotName, slotDef]) => ({
+            name: slotName,
+            allowedComponents: Array.isArray(slotDef?.$allowedComponents)
+                ? slotDef.$allowedComponents.filter((v) => typeof v === 'string')
+                : [],
+        }));
+        return { name: row.key, slots };
+    });
+}

package/dist/src/apply/api-client.d.ts

@@ -1,4 +1,4 @@
-import type { ManifestPayload, ServerPreviewResponse, ApplyOperationResponse } from '@contentful/experience-design-system-types';
+import type { ManifestPayload, ServerPreviewResponse, ApplyOperationResponse, BreakingChange } from '@contentful/experience-design-system-types';
 export declare const DEFAULT_HOST = "https://api.contentful.com";
 export declare const PREVIEW_ERROR_PREFIX = "preview failed:";
 export declare const APPLY_ERROR_PREFIX = "apply failed:";
@@ -31,6 +31,7 @@ export interface PreviewValidationError {
  * the field-level detail.
  */
 export declare function parsePreviewValidationErrors(body: string): PreviewValidationError[];
+export declare function sanitizeBreakingChanges(raw: unknown): BreakingChange[];
 export declare class ImportApiClient {
     private host;
     private token;

package/dist/src/apply/api-client.js

@@ -2,8 +2,6 @@ import { DEFAULT_API_HOST, toApiHost } from '../host-utils.js';
 import { getDebugLogger } from '../lib/debug-logger.js';
 import { buildUserAgent } from '../lib/user-agent.js';
 export const DEFAULT_HOST = DEFAULT_API_HOST;
-// Phase-prefix constants used at the two ApiError throw sites below and
-// imported by orchestrator.ts to identify preview-phase 422s for retry.
 export const PREVIEW_ERROR_PREFIX = 'preview failed:';
 export const APPLY_ERROR_PREFIX = 'apply failed:';
 // Substring match the orchestrator uses to distinguish a parseable
@@ -31,9 +29,6 @@ export class ApiError extends Error {
         this.status = status;
         this.body = body;
         if (body) {
-            // Append a (possibly trimmed) version of the response body so callers
-            // that only log e.message don't silently swallow the server's error
-            // detail.
             const trimmed = body.length > ERROR_BODY_LOG_CAP ? body.slice(0, ERROR_BODY_LOG_CAP) + '…' : body;
             this.message = `${message}\n${trimmed}`;
         }
@@ -83,6 +78,45 @@ export function parsePreviewValidationErrors(body) {
     }
     return out;
 }
+const PROPERTY_BREAKING_REASONS = new Set([
+    'removed',
+    'added_required_no_default',
+    'type_changed',
+    'validation_narrowed',
+]);
+const SLOT_BREAKING_REASONS = new Set(['slot_removed', 'slot_allowed_components_narrowed']);
+export function sanitizeBreakingChanges(raw) {
+    if (!Array.isArray(raw))
+        return [];
+    const out = [];
+    for (const bc of raw) {
+        if (typeof bc !== 'object' || bc === null)
+            continue;
+        const reason = bc.reason;
+        if (typeof reason !== 'string')
+            continue;
+        if ('propertyId' in bc && typeof bc.propertyId === 'string') {
+            if (PROPERTY_BREAKING_REASONS.has(reason))
+                out.push(bc);
+            continue;
+        }
+        if ('slotId' in bc && typeof bc.slotId === 'string') {
+            if (SLOT_BREAKING_REASONS.has(reason))
+                out.push(bc);
+            continue;
+        }
+    }
+    return out;
+}
+function sanitizePreviewResponse(res) {
+    for (const item of res.components?.changed ?? []) {
+        const cc = item.changeClassification;
+        if (cc && Array.isArray(cc.breakingChanges)) {
+            cc.breakingChanges = sanitizeBreakingChanges(cc.breakingChanges);
+        }
+    }
+    return res;
+}
 async function request(url, options) {
     const headers = {
         Authorization: `Bearer ${options.token}`,
@@ -155,7 +189,7 @@ export class ImportApiClient {
         }
         const parsed = (await res.json());
         debug.event('apply', 'preview.ok', { status: res.status, durationMs: Date.now() - startedAt });
-        return parsed;
+        return sanitizePreviewResponse(parsed);
     }
     async applyImport(manifest, acknowledgeBreakingChanges) {
         const url = `${this.base()}/design_systems/imports/apply`;

package/dist/src/apply/command.d.ts

@@ -1,6 +1,22 @@
 import type { Command } from 'commander';
-import type { DTCGTokenEntry } from '@contentful/experience-design-system-types';
+import type { CDFComponentEntry, DTCGTokenEntry } from '@contentful/experience-design-system-types';
+import { findSlotCycles } from '../analyze/cycle-detection.js';
 import type { ServerPreviewResponse } from '@contentful/experience-design-system-types';
 export declare function readTokensFromPath(flag: string, p: string): Promise<DTCGTokenEntry[]>;
+export declare function detectSlotCycles(components: Array<{
+    key: string;
+    entry: CDFComponentEntry;
+}>): ReturnType<typeof findSlotCycles>;
+export declare function formatSlotCycleReport(cycles: ReturnType<typeof findSlotCycles>): string[];
+export declare function assertNoSlotCycles(components: Array<{
+    key: string;
+    entry: CDFComponentEntry;
+}>): void;
+export declare function extractComponentsFromManifest(manifest: {
+    componentsManifest?: Record<string, unknown>;
+} | null | undefined): Array<{
+    key: string;
+    entry: CDFComponentEntry;
+}>;
 export declare function hasBreakingChangesWithImpact(preview: ServerPreviewResponse): boolean;
 export declare function registerApplyCommand(program: Command): void;