fika-editor 3.2.8 → 3.2.10

package/dist/layout/types/slides.js

@@ -0,0 +1 @@
+export {};

package/dist/layout/utils/resizeDeck.js

@@ -0,0 +1,252 @@
+function bounds(el) {
+    if (el.type === 'line') {
+        const points = [el.start, el.end, el.broken, el.broken2, el.curve, ...(el.cubic ?? [])].filter((p) => !!p);
+        return { left: el.left + Math.min(...points.map(p => p[0])), right: el.left + Math.max(...points.map(p => p[0])), top: el.top + Math.min(...points.map(p => p[1])), bottom: el.top + Math.max(...points.map(p => p[1])) };
+    }
+    const angle = (el.rotate ?? 0) * Math.PI / 180;
+    const w = Math.abs(el.width * Math.cos(angle)) + Math.abs(el.height * Math.sin(angle));
+    const h = Math.abs(el.width * Math.sin(angle)) + Math.abs(el.height * Math.cos(angle));
+    return { left: el.left + (el.width - w) / 2, right: el.left + (el.width + w) / 2, top: el.top + (el.height - h) / 2, bottom: el.top + (el.height + h) / 2 };
+}
+function union(a, b) {
+    return { left: Math.min(a.left, b.left), right: Math.max(a.right, b.right), top: Math.min(a.top, b.top), bottom: Math.max(a.bottom, b.bottom) };
+}
+function isBackdrop(el, canvas) {
+    return el.type === 'shape' && !el.text && !el.rotate && !el.fixedRatio && el.left <= 1 && el.top <= 1 && el.width >= canvas.width - 2 && el.height >= canvas.height - 2;
+}
+function isDecor(el, canvas) {
+    return el.type === 'shape' && !el.text && !el.groupId && (el.name === 'Decor' || el.left < -1 || el.top < -1 || el.left + el.width > canvas.width + 1 || el.top + el.height > canvas.height + 1);
+}
+function edgeBand(el, canvas) {
+    if (el.type !== 'shape' || el.text || el.groupId || el.rotate || el.fixedRatio)
+        return;
+    if (Math.abs(el.top) <= 1 && Math.abs(el.height - canvas.height) <= 2 && el.width < canvas.width * 0.3
+        && (Math.abs(el.left) <= 1 || Math.abs(el.left + el.width - canvas.width) <= 1))
+        return 'vertical';
+    if (Math.abs(el.left) <= 1 && Math.abs(el.width - canvas.width) <= 2 && el.height < canvas.height * 0.2
+        && (Math.abs(el.top) <= 1 || Math.abs(el.top + el.height - canvas.height) <= 1))
+        return 'horizontal';
+}
+/** Piecewise affine map: occupied tracks retain their scale; only empty gutters expand.
+ * Group bounds occupy a single track, so labels never detach from their diagram.
+ */
+function axisTracks(intervals, source) {
+    const merged = [];
+    for (const [start, end] of intervals.sort((a, b) => a[0] - b[0])) {
+        const lo = Math.max(0, start), hi = Math.min(source, end);
+        if (hi <= lo)
+            continue;
+        const last = merged.at(-1);
+        if (last && lo <= last[1] + 1)
+            last[1] = Math.max(last[1], hi);
+        else
+            merged.push([lo, hi]);
+    }
+    const gaps = [];
+    let cursor = 0;
+    for (const [lo, hi] of merged) {
+        if (lo > cursor)
+            gaps.push([cursor, lo]);
+        cursor = hi;
+    }
+    if (cursor < source)
+        gaps.push([cursor, source]);
+    const free = gaps.reduce((sum, [lo, hi]) => sum + hi - lo, 0);
+    return { gaps, free };
+}
+function axisMap(intervals, source, target, scale) {
+    const { gaps, free } = axisTracks(intervals, source);
+    const extra = target - source * scale;
+    return (position) => position * scale + (free > 0
+        ? extra * gaps.reduce((sum, [lo, hi]) => sum + Math.max(0, Math.min(position, hi) - lo), 0) / free
+        : extra / 2);
+}
+/** Recognize a full-width heading above independent body columns. Each column
+ * gets its own vertical tracks; a long item in the left column cannot prevent
+ * the right column from distributing its rows through the available height.
+ */
+function bodyColumns(boxes, from) {
+    if (boxes.length < 3)
+        return;
+    const top = Math.min(...boxes.map(b => b.top));
+    const headers = boxes.filter(b => Math.abs(b.top - top) < 1 && b.right - b.left >= from.width * 0.55 && b.bottom <= from.height * 0.26);
+    if (!headers.length)
+        return;
+    const headerBottom = Math.max(...headers.map(b => b.bottom));
+    const body = boxes.filter(b => !headers.includes(b));
+    if (body.some(b => b.top < headerBottom))
+        return;
+    const bodyTop = Math.min(...body.map(b => b.top));
+    const ranges = [];
+    for (const box of [...body].sort((a, b) => a.left - b.left)) {
+        const last = ranges.at(-1);
+        if (last && box.left <= last.right + from.width * 0.025) {
+            last.right = Math.max(last.right, box.right);
+            last.boxes.push(box);
+        }
+        else
+            ranges.push({ left: box.left, right: box.right, boxes: [box] });
+    }
+    if (ranges.length > 4)
+        return;
+    const margin = Math.min(from.height * 0.06, Math.max(top, from.height * 0.03));
+    const columns = ranges.map(range => {
+        const height = Math.max(...range.boxes.map(b => b.bottom)) - bodyTop;
+        const intervals = range.boxes.map(b => [b.top - bodyTop, b.bottom - bodyTop]);
+        const { free } = axisTracks(intervals, height);
+        return { ...range, height, intervals, minHeight: height - free + Math.min(free, height * 0.08) };
+    });
+    return { bodyTop, margin, columns, minHeight: bodyTop + margin + Math.max(...columns.map(c => c.minHeight)) };
+}
+function scalePixels(html, scale) {
+    // CSS lengths only: do not rewrite lesson text containing quantities in px.
+    return html.replace(/style=(['"])(.*?)\1/gi, (_, quote, css) => `style=${quote}${css.replace(/(-?\d+(?:\.\d+)?)px\b/g, (_m, n) => `${Number((Number(n) * scale).toFixed(4))}px`)}${quote}`);
+}
+function scaleNumber(record, key, scale) {
+    const obj = record;
+    if (typeof obj[key] === 'number')
+        obj[key] = obj[key] * scale;
+}
+function scaleTypography(el, scale) {
+    if (scale === 1)
+        return;
+    const text = el.type === 'text' ? el : el.type === 'shape' ? el.text : undefined;
+    if (text) {
+        text.content = scalePixels(text.content, scale);
+        text.inset = (text.inset ?? [10, 10, 10, 10]).map(v => v * scale);
+        text.paragraphSpace = (text.paragraphSpace ?? 5);
+        for (const key of ['wordSpace', 'paragraphSpace', 'placeholderFontSize', 'placeholderLayoutHeight'])
+            scaleNumber(text, key, scale);
+        if (el.type === 'text' && el.structuredText) {
+            // HTML is the source of truth; discard the stale import cache.
+            delete el.structuredText;
+        }
+    }
+    if (el.type === 'table') {
+        el.cellMinHeight *= scale;
+        for (const row of el.data)
+            for (const cell of row) {
+                cell.text = scalePixels(cell.text, scale);
+                if (cell.style?.fontsize)
+                    cell.style.fontsize = cell.style.fontsize.replace(/^(\d+(?:\.\d+)?)(px|pt)$/i, (_, value, unit) => `${Number(value) * scale}${unit}`);
+            }
+    }
+    if (el.type === 'chart')
+        el.options = { ...el.options, fontSize: (el.options?.fontSize ?? 12) * scale };
+    if (el.type === 'code')
+        el.fontSize *= scale;
+    if (el.type === 'latex')
+        el.strokeWidth *= scale;
+    if ('outline' in el && el.outline)
+        scaleNumber(el.outline, 'width', scale);
+    if ('shadow' in el && el.shadow)
+        for (const key of ['h', 'v', 'blur'])
+            scaleNumber(el.shadow, key, scale);
+}
+/** Resize a deck without distorting media or changing reading order.
+ * Uniformly scale content and typography, redistribute available space through
+ * empty tracks, and keep decorative edge shapes attached to their canvas edge.
+ * Overlaps, rotations, z-order and grouped compositions remain intact.
+ */
+export function resizeDeckSlides(slides, from, to) {
+    for (const n of [from.width, from.height, to.width, to.height]) {
+        if (!Number.isFinite(n) || n <= 0)
+            throw new Error('Canvas dimensions must be finite and positive.');
+    }
+    const result = structuredClone(slides);
+    if (from.width === to.width && from.height === to.height)
+        return result;
+    for (const slide of result) {
+        const groups = new Map();
+        for (const el of slide.elements) {
+            if ((el.type === 'line' && !el.groupId) || isBackdrop(el, from) || isDecor(el, from) || edgeBand(el, from))
+                continue;
+            const key = el.groupId ?? el.id, box = bounds(el);
+            groups.set(key, groups.has(key) ? union(groups.get(key), box) : box);
+        }
+        const boxes = [...groups.values()];
+        const vertical = boxes.map(b => [b.top, b.bottom]);
+        const { free } = axisTracks(vertical, from.height);
+        // Width sets the preferred type size. Consume spare vertical gutters before
+        // shrinking text; reversing a ratio change should not progressively shrink it.
+        const minHeight = from.height - free + Math.min(free, from.height * 0.08);
+        const body = bodyColumns(boxes, from);
+        const scale = Math.min(to.width / from.width, to.height / Math.max(1, body?.minHeight ?? minHeight));
+        const x = axisMap(boxes.map(b => [b.left, b.right]), from.width, to.width, scale);
+        const y = axisMap(boxes.map(b => [b.top, b.bottom]), from.height, to.height, scale);
+        const columnMaps = body?.columns.map(column => ({ ...column,
+            map: axisMap(column.intervals, column.height, Math.max(1, to.height - (body.bodyTop + body.margin) * scale), scale),
+        }));
+        const mapY = (px, py) => {
+            if (!body || !columnMaps)
+                return y(py);
+            if (py < body.bodyTop - 1)
+                return py * scale;
+            const column = columnMaps.find(c => px >= c.left - 1 && px <= c.right + 1);
+            return column ? body.bodyTop * scale + column.map(py - body.bodyTop) : y(py);
+        };
+        for (const el of slide.elements) {
+            if (el.type === 'shape' && isBackdrop(el, from)) {
+                el.left = 0;
+                el.top = 0;
+                el.width = to.width;
+                el.height = to.height;
+                continue;
+            }
+            const band = edgeBand(el, from);
+            if (el.type === 'shape' && band) {
+                if (band === 'vertical') {
+                    el.width *= scale;
+                    el.height = to.height;
+                    el.top = 0;
+                    el.left = el.left < from.width / 2 ? 0 : to.width - el.width;
+                }
+                else {
+                    el.height *= scale;
+                    el.width = to.width;
+                    el.left = 0;
+                    el.top = el.top < from.height / 2 ? 0 : to.height - el.height;
+                }
+                scaleTypography(el, scale);
+                continue;
+            }
+            const left = el.left, top = el.top;
+            if (el.type === 'line') {
+                // Remap connector geometry with the same tracks as its attached objects.
+                const group = el.groupId ? groups.get(el.groupId) : undefined;
+                const lineX = group ? (v) => x(group.left) + (v - group.left) * scale : x;
+                const lineY = group ? (_px, v) => mapY(group.left, group.top) + (v - group.top) * scale : mapY;
+                el.left = lineX(left);
+                el.top = lineY(left, top);
+                el.width *= scale;
+                const point = (p) => [lineX(left + p[0]) - el.left, lineY(left + p[0], top + p[1]) - el.top];
+                el.start = point(el.start);
+                el.end = point(el.end);
+                if (el.broken)
+                    el.broken = point(el.broken);
+                if (el.broken2)
+                    el.broken2 = point(el.broken2);
+                if (el.curve)
+                    el.curve = point(el.curve);
+                if (el.cubic)
+                    el.cubic = [point(el.cubic[0]), point(el.cubic[1])];
+            }
+            else if (isDecor(el, from)) {
+                const cx = left + el.width / 2, cy = top + el.height / 2;
+                el.left = cx > from.width / 2 ? to.width - (from.width - left) * scale : left * scale;
+                el.top = cy > from.height / 2 ? to.height - (from.height - top) * scale : top * scale;
+                el.width *= scale;
+                el.height *= scale;
+            }
+            else {
+                const box = groups.get(el.groupId ?? el.id);
+                el.left = x(box.left) + (left - box.left) * scale;
+                el.top = mapY(box.left, box.top) + (top - box.top) * scale;
+                el.width *= scale;
+                el.height *= scale;
+            }
+            scaleTypography(el, scale);
+        }
+    }
+    return result;
+}

package/dist/types/configs/designThemes.d.ts

@@ -0,0 +1,24 @@
+import { type PresetTheme } from './theme';
+/** Host-localized designs displayed in the slide design picker, in supplied order. */
+export type FikaDesignTheme = Omit<PresetTheme, 'id' | 'name'> & {
+    id: string;
+    name: string;
+};
+/** Undefined restores Fika defaults; [] intentionally hides the preset catalog. */
+export declare function resolveDesignThemes(themes?: readonly FikaDesignTheme[]): readonly PresetTheme[];
+export declare const useDesignThemes: import("zustand").UseBoundStore<import("zustand").StoreApi<{
+    themes: readonly PresetTheme[];
+}>>;
+/** Updates the catalog only; never restyles or replaces the host document. */
+export declare function setFikaDesignThemes(themes?: readonly FikaDesignTheme[]): void;
+/** Obtain independent copies of Fika's built-in designs for filtering/extending. */
+export declare function getFikaDefaultDesignThemes(): FikaDesignTheme[];
+/** Small JSON-safe catalog for host/agent discovery, not full document content. */
+export declare function listFikaDesignThemes(): {
+    id: string;
+    name: string;
+    background: string;
+    fontColor: string;
+    colors: string[];
+}[];
+export declare function getFikaDesignTheme(id: string): PresetTheme;

package/dist/types/configs/theme.d.ts

@@ -7,6 +7,8 @@ export interface PresetTheme {
     background: string;
     fontColor: string;
     featureFontColor?: string;
+    /** Retain pale panels and accent roles when restyling host-authored decks. */
+    preserveColorRoles?: boolean;
     fontname: string;
     colors: string[];
     /** Series palette when `colors` includes near-background swatches (Ink #171717). */
@@ -36,7 +38,7 @@ export declare const themeBackgroundCycle: (theme: PresetTheme) => SlideBackgrou
 export declare const resolvePresetBackground: (theme: PresetTheme, slideType?: SlideType, index?: number) => SlideBackground;
 export declare const resolvePresetFontColor: (theme: PresetTheme, _slideType?: SlideType) => string;
 export declare const themeChartColors: (theme: Pick<PresetTheme, 'colors' | 'chartColors'>) => string[];
-export declare const matchPresetTheme: (themeColors: string[]) => PresetTheme | undefined;
+export declare const matchPresetTheme: (themeColors: string[], presets?: readonly PresetTheme[]) => PresetTheme | undefined;
 /** Paint a layout preview/insert with the active preset's type-specific background and type. */
 export declare const applyPresetToLayoutSlide: (slide: Slide, theme: PresetTheme, index?: number) => void;
 export declare const sameSlideBackground: (a?: SlideBackground, b?: SlideBackground) => boolean;

package/dist/types/embed/agentic/themeFormatting.d.ts

@@ -0,0 +1,8 @@
+/** Remove only explicitly replaced theme properties from HTML style attributes.
+ * Matching whole declarations avoids corrupting background-color / border-color
+ * or literal lesson text that happens to contain CSS examples.
+ */
+export declare function stripThemeInlineStyles(content: string, patch: {
+    fontColor?: string;
+    fontName?: string;
+}): string;

package/dist/types/embed/agentic/types.d.ts

@@ -598,6 +598,18 @@ export interface FikaAgentDeckApi {
     setTitle(title: string, meta?: FikaCommandMeta): Promise<FikaCommandResult<{
         title: string;
     }>>;
+    listDesignThemes(): Array<{
+        id: string;
+        name: string;
+        background: string;
+        fontColor: string;
+        colors: string[];
+    }>;
+    applyDesignTheme(themeId: string, meta?: FikaCommandMeta): Promise<FikaCommandResult<{
+        themeId: string;
+        name: string;
+        slideCount: number;
+    }>>;
     getTheme(): SlideTheme;
     setTheme(theme: FikaSlideThemePatch, meta?: FikaCommandMeta): Promise<FikaCommandResult<SlideTheme>>;
     applyTemplate(templateId: string, meta?: FikaCommandMeta): Promise<FikaCommandResult<FikaApplyTemplateResult>>;
@@ -1200,6 +1212,10 @@ export interface FikaCommandPayloadMap {
     'deck.setTitle': {
         title: string;
     };
+    'deck.listDesignThemes': undefined;
+    'deck.applyDesignTheme': {
+        themeId: string;
+    };
     'deck.getTheme': undefined;
     'deck.setTheme': {
         theme: FikaSlideThemePatch | Partial<SlideTheme>;
@@ -1892,6 +1908,18 @@ export interface FikaCommandResultDataMap {
     'deck.setTitle': {
         title: string;
     };
+    'deck.listDesignThemes': Array<{
+        id: string;
+        name: string;
+        background: string;
+        fontColor: string;
+        colors: string[];
+    }>;
+    'deck.applyDesignTheme': {
+        themeId: string;
+        name: string;
+        slideCount: number;
+    };
     'deck.getTheme': SlideTheme;
     'deck.setTheme': SlideTheme;
     'deck.applyTheme': SlideTheme;

package/dist/types/embed/index.d.ts

@@ -10,3 +10,6 @@ export type { FikaMediaConfig, FikaMediaConstraints, FikaMediaKind, FikaMediaSiz
 export type * from './agentic/types';
 export type { Locales as FikaLocales } from '../i18n/locale';
 export type { ChartData, ChartOptions, ChartType, Note, NoteReply, PPTAnimation, PPTAudioElement, PPTChartElement, PPTElement, PPTElementLink, PPTImageElement, PPTLatexElement, PPTLineElement, PPTShapeElement, PPTTableElement, PPTTextElement, PPTVideoElement, ShapeText, Slide, SlideBackground, SlideTemplate, SlideTheme, TableCell, TableCellStyle, TextAlign, TurningMode, } from '../types/slides';
+export type { FikaDesignTheme } from '../configs/designThemes';
+export { getFikaDefaultDesignThemes } from '../configs/designThemes';
+export { resizeDeckSlides, type SlideCanvas } from '../utils/resizeDeck';

package/dist/types/embed/types.d.ts

@@ -1,3 +1,4 @@
+import type { FikaDesignTheme } from '../configs/designThemes';
 import type { FikaExportTabsConfig } from '../configs/exportTabs';
 import type { FikaExportMediaResolver } from '../configs/exportMediaResolver';
 import type { FikaExportWatermark, FikaExportWatermarkPosition, FikaExportWatermarkResolver, FikaWatermarkSurface } from '../configs/exportWatermark';
@@ -63,6 +64,8 @@ export interface FikaHeaderMenuItem {
 /** `editor` is the default full editor; `presentation` boots straight into the fullscreen slideshow with no editor chrome. */
 export type FikaViewMode = 'editor' | 'presentation';
 export interface FikaMountOptions {
+    /** Replacement design catalog in display order. Omit for Fika defaults; [] hides presets. Does not restyle the loaded document. */
+    designThemes?: readonly FikaDesignTheme[];
     /** UI locale (`cs` | `en` | `sk` | `pl`). */
     locale?: Locales;
     /** Initial deck; takes precedence over `loadDocument` and the starter slide. */
@@ -191,6 +194,8 @@ export interface FikaController extends FikaAgentApi {
     importPptx(data: File | Blob | ArrayBuffer, options?: FikaImportPptxOptions): Promise<boolean>;
     setTitle(title: string): void;
     setLocale(locale: Locales): Promise<void>;
+    /** Replace the visible design catalog without changing slide content. Undefined restores defaults. */
+    setDesignThemes(themes?: readonly FikaDesignTheme[]): void;
     /**
      * Paint one slide offscreen (thumbnail painter, no DOM capture) and return
      * the encoded image. Defaults to the current slide.

package/dist/types/hooks/useResizeDeck.d.ts

@@ -0,0 +1 @@
+export default function useResizeDeck(): (width: number, height: number) => void;

package/dist/types/utils/applyDesignTheme.d.ts

@@ -0,0 +1,8 @@
+import type { Slide, SlideTheme } from '../types/slides';
+import { type PresetTheme } from '../configs/theme';
+export declare const setSlideTheme: (slide: Slide, theme: PresetTheme, index?: number, sourceAccents?: readonly string[]) => void;
+/** Shared by the design picker and agent command, with no store/history effects. */
+export declare function applyDesignTheme(slides: readonly Slide[], currentTheme: SlideTheme, preset: PresetTheme): {
+    slides: Slide[];
+    theme: SlideTheme;
+};

package/dist/types/utils/designColorRoles.d.ts

@@ -0,0 +1,10 @@
+import type { PresetTheme } from '../configs/theme';
+import type { PPTElement, Slide } from '../types/slides';
+/** Keep neutral surfaces, pale panels and saturated accents in distinct roles. */
+export declare function designColorRoles(theme: PresetTheme, sourceAccents: readonly string[]): {
+    fill: (color: string) => string;
+    ink: (surface: string, original?: string) => string;
+};
+/** Find the painted panel below a text object; preserve white lettering on badges. */
+export declare function textSurface(slide: Slide, el: PPTElement, fallback: string): string;
+export declare function retintInlineText(html: string, surface: string, ink: (surface: string, original?: string) => string): string;

package/dist/types/utils/resizeDeck.d.ts

@@ -0,0 +1,11 @@
+import type { Slide } from '../types/slides';
+export interface SlideCanvas {
+    width: number;
+    height: number;
+}
+/** Resize a deck without distorting media or changing reading order.
+ * Uniformly scale content and typography, redistribute available space through
+ * empty tracks, and keep decorative edge shapes attached to their canvas edge.
+ * Overlaps, rotations, z-order and grouped compositions remain intact.
+ */
+export declare function resizeDeckSlides(slides: readonly Slide[], from: SlideCanvas, to: SlideCanvas): Slide[];

package/docs/AGENTIC_BRIDGE.md

@@ -518,4 +518,12 @@ await savePresentationDocument(controller.getDocument())
 await controller.executeBatch(commands, { atomic: true })
 ```
 
-Use `controller.export.json()` for a synchronous serializable snapshot. Use `controller.import.json(document)`, `controller.execute({ type: 'import.json', payload: { document } })`, or `controller.execute({ type: 'export.json' })` when sciobot needs command results for whole-document import/export.
+Use `controller.export.json()` for a synchronous serializable snapshot. Use `controller.import.json(document)`, `controller.execute({ type: 'import.json', payload: { document } })`, or `controller.execute({ type: 'export.json' })` when sciobot needs command results for whole-document import/export.
+### Partial theme application
+
+`deck.applyTheme` with `options.applyToSlides: true` applies only the supplied
+properties to existing slide content. For example, `{ theme: { fontName:
+'Calibri' }, options: { applyToSlides: true } }` replaces text/shape/table font
+families without resetting backgrounds, text colors, chart palettes or sizes.
+Inline property removal is restricted to style declarations; background-color,
+border-color and literal CSS examples in lesson text are preserved.

package/docs/EMBED.md

@@ -479,3 +479,66 @@ The ProseMirror schema preserves hard line breaks and Markdown strikethrough
 through storage, static rendering, and editing.
 Pass `assetBaseUrl` to `mountFika()` to resolve lazy editor CSS under the same
 asset directory as the embed stylesheet.
+
+### Host-configured slide designs
+
+Pass `designThemes` to replace the built-in design cards (not editor chrome).
+The supplied order and host-localized `name` appear in the picker. Custom designs
+also drive layout previews, new layout slides, background looks and chart colors.
+Omit the option for Fika defaults; pass `[]` to hide the preset section.
+Configuring the catalog does not apply a design to the existing document.
+
+```ts
+import { mountFika, getFikaDefaultDesignThemes, type FikaDesignTheme } from 'fika-editor/embed'
+
+const paper: FikaDesignTheme = {
+  id: 'my-paper', name: 'Paper',
+  background: '#FAF8F4', fontColor: '#2B3445', fontname: 'Inter',
+  colors: ['#D25F2B', '#2A7FA3', '#5F8A2C'],
+  borderColor: '#E3DFD6',
+}
+const { controller } = await mountFika('#editor', { designThemes: [paper] })
+controller.setDesignThemes([{ ...paper, name: 'Papír' }]) // reactive label/catalog update
+controller.setDesignThemes(getFikaDefaultDesignThemes()) // independent copies of defaults
+```
+
+Design IDs must be nonempty and unique; names and accent palettes are required.
+Use distinct accent palettes so the active design can be recognized after a
+saved document is loaded. Optional `chartColors`, `featureFontColor`,
+`contentBackground`, `featureBackground`, `altBackground` and `backgrounds`
+provide the same appearance controls as built-in designs. Catalogs are runtime
+host configuration, not part of the persisted document. Like Fika's other embed
+configuration and stores, the catalog is shared by the active editor runtime;
+use separate runtimes for independently configured simultaneous editors.
+
+Agents can use the same active catalog via `controller.deck.listDesignThemes()`
+(read-only), then apply one by ID with
+`controller.deck.applyDesignTheme('scio-blue')`. The command-bus equivalent is
+`{ type: 'deck.applyDesignTheme', payload: { themeId: 'scio-blue' } }`.
+Application uses the picker implementation and creates one undo step for the
+whole deck. Unknown IDs fail without changing the presentation. Hosts should
+include the small catalog in agent context so applying a named theme needs only
+one call, without a preceding discovery request.
+
+### Content-aware canvas resizing
+
+`controller.deck.setViewport({ ratio: 0.75 })` fits the entire deck to 4:3 in
+one undo step, using the same operation as the size menu and custom size dialog.
+It identifies full-width headings and independent body columns, distributes
+rows through their available height, scales type with its boxes, preserves media
+proportions and groups, remaps connectors, and anchors vector edge decorations.
+It consumes spare vertical gutters before shrinking type when returning to a
+shorter canvas. It preserves the authored composition rather than inventing a
+new reading order or cropping photographs. Imported objects already outside the
+canvas may still need manual correction.
+
+Hosts authoring slides into a differently sized deck can use the pure,
+DOM-free `resizeDeckSlides(slides, from, to)` export from `fika-editor/layout`;
+`from` and `to` are `{ width, height }`. Raw document loading remains available
+through `deck.set` / `deck.patch` with `slides` and `viewport` supplied together.
+
+Host design themes can opt into `preserveColorRoles: true` to keep pale panels,
+neutral surfaces and saturated accents separate during theme application.
+Text is retinted against the actual panel beneath it, including badge and table
+cell fills. Named `Decor` shapes become soft accents on the selected background.
+Reapplying a selected theme is supported, including for older generated decks.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fika-editor",
-  "version": "3.2.8",
+  "version": "3.2.10",
   "description": "Fika presentation editor embed bundle with a typed agentic bridge.",
   "type": "module",
   "main": "dist/embed/fika-embed.js",
@@ -12,7 +12,8 @@
     "docs/EMBED.md",
     "docs/AGENTIC_BRIDGE.md",
     "docs/RELEASE.md",
-    "dist/text"
+    "dist/text",
+    "dist/layout"
   ],
   "exports": {
     ".": {
@@ -35,6 +36,11 @@
       "types": "./dist/text/index.d.ts",
       "import": "./dist/text/index.js",
       "default": "./dist/text/index.js"
+    },
+    "./layout": {
+      "types": "./dist/types/utils/resizeDeck.d.ts",
+      "import": "./dist/layout/utils/resizeDeck.js",
+      "default": "./dist/layout/utils/resizeDeck.js"
     }
   },
   "engines": {
@@ -55,7 +61,7 @@
     "dx:start": "1dxway start",
     "doctor": "react-doctor --no-telemetry",
     "build": "run-p type-check \"build-only {@}\" --",
-    "build:embed": "node scripts/run-i18n.mjs --no-watch && npm run build:text && npm run build:types && rsbuild build --config rsbuild.config.embed.ts && node scripts/rewrite-embed-base-uri.mjs && node scripts/merge-embed-css.mjs && node scripts/scope-embed-css.mjs && node scripts/extract-embed-fonts.mjs && node scripts/copy-embed-public.mjs && node scripts/generate-agentic-manifest.mjs",
+    "build:embed": "node scripts/run-i18n.mjs --no-watch && npm run build:text && npm run build:layout && npm run build:types && rsbuild build --config rsbuild.config.embed.ts && node scripts/rewrite-embed-base-uri.mjs && node scripts/merge-embed-css.mjs && node scripts/scope-embed-css.mjs && node scripts/extract-embed-fonts.mjs && node scripts/copy-embed-public.mjs && node scripts/generate-agentic-manifest.mjs",
     "agentic:manifest": "node scripts/generate-agentic-manifest.mjs",
     "build:types": "node -e \"require('node:fs').rmSync('dist/types',{recursive:true,force:true})\" && tsc -p tsconfig.types.json && node scripts/rewrite-embed-types.mjs",
     "prepack": "node scripts/verify-embed-pack.mjs",
@@ -69,7 +75,8 @@
     "test": "node scripts/test.mjs",
     "i18n": "node scripts/run-i18n.mjs",
     "i18n:build": "node scripts/run-i18n.mjs --no-watch",
-    "build:text": "tsc -p tsconfig.text.json"
+    "build:text": "tsc -p tsconfig.text.json",
+    "build:layout": "tsc -p tsconfig.layout.json"
   },
   "author": "Matěj \"lofcz\" Štágl",
   "license": "MIT",