mulmocast 2.2.4 → 2.2.6

package/lib/slide/schema.d.ts

@@ -4351,6 +4351,66 @@ export declare const funnelSlideSchema: z.ZodObject<{
     }, z.core.$strip>>;
     layout: z.ZodLiteral<"funnel">;
 }, z.core.$strip>;
+export declare const slideBrandingLogoSchema: z.ZodObject<{
+    source: z.ZodDiscriminatedUnion<[z.ZodObject<{
+        kind: z.ZodLiteral<"url">;
+        url: z.ZodURL;
+    }, z.core.$strict>, z.ZodObject<{
+        kind: z.ZodLiteral<"base64">;
+        data: z.ZodString;
+    }, z.core.$strict>, z.ZodObject<{
+        kind: z.ZodLiteral<"path">;
+        path: z.ZodString;
+    }, z.core.$strict>], "kind">;
+    position: z.ZodDefault<z.ZodEnum<{
+        "top-left": "top-left";
+        "top-right": "top-right";
+        "bottom-left": "bottom-left";
+        "bottom-right": "bottom-right";
+    }>>;
+    width: z.ZodDefault<z.ZodNumber>;
+}, z.core.$strict>;
+export declare const slideBrandingSchema: z.ZodObject<{
+    logo: z.ZodOptional<z.ZodObject<{
+        source: z.ZodDiscriminatedUnion<[z.ZodObject<{
+            kind: z.ZodLiteral<"url">;
+            url: z.ZodURL;
+        }, z.core.$strict>, z.ZodObject<{
+            kind: z.ZodLiteral<"base64">;
+            data: z.ZodString;
+        }, z.core.$strict>, z.ZodObject<{
+            kind: z.ZodLiteral<"path">;
+            path: z.ZodString;
+        }, z.core.$strict>], "kind">;
+        position: z.ZodDefault<z.ZodEnum<{
+            "top-left": "top-left";
+            "top-right": "top-right";
+            "bottom-left": "bottom-left";
+            "bottom-right": "bottom-right";
+        }>>;
+        width: z.ZodDefault<z.ZodNumber>;
+    }, z.core.$strict>>;
+    backgroundImage: z.ZodOptional<z.ZodObject<{
+        source: z.ZodDiscriminatedUnion<[z.ZodObject<{
+            kind: z.ZodLiteral<"url">;
+            url: z.ZodURL;
+        }, z.core.$strict>, z.ZodObject<{
+            kind: z.ZodLiteral<"base64">;
+            data: z.ZodString;
+        }, z.core.$strict>, z.ZodObject<{
+            kind: z.ZodLiteral<"path">;
+            path: z.ZodString;
+        }, z.core.$strict>], "kind">;
+        size: z.ZodOptional<z.ZodEnum<{
+            contain: "contain";
+            cover: "cover";
+            fill: "fill";
+            auto: "auto";
+        }>>;
+        opacity: z.ZodOptional<z.ZodNumber>;
+        bgOpacity: z.ZodOptional<z.ZodNumber>;
+    }, z.core.$strip>>;
+}, z.core.$strict>;
 export declare const slideLayoutSchema: z.ZodDiscriminatedUnion<[z.ZodObject<{
     title: z.ZodString;
     subtitle: z.ZodOptional<z.ZodString>;
@@ -8985,6 +9045,47 @@ export declare const mulmoSlideMediaSchema: z.ZodObject<{
         layout: z.ZodLiteral<"funnel">;
     }, z.core.$strip>], "layout">;
     reference: z.ZodOptional<z.ZodString>;
+    branding: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+        logo: z.ZodOptional<z.ZodObject<{
+            source: z.ZodDiscriminatedUnion<[z.ZodObject<{
+                kind: z.ZodLiteral<"url">;
+                url: z.ZodURL;
+            }, z.core.$strict>, z.ZodObject<{
+                kind: z.ZodLiteral<"base64">;
+                data: z.ZodString;
+            }, z.core.$strict>, z.ZodObject<{
+                kind: z.ZodLiteral<"path">;
+                path: z.ZodString;
+            }, z.core.$strict>], "kind">;
+            position: z.ZodDefault<z.ZodEnum<{
+                "top-left": "top-left";
+                "top-right": "top-right";
+                "bottom-left": "bottom-left";
+                "bottom-right": "bottom-right";
+            }>>;
+            width: z.ZodDefault<z.ZodNumber>;
+        }, z.core.$strict>>;
+        backgroundImage: z.ZodOptional<z.ZodObject<{
+            source: z.ZodDiscriminatedUnion<[z.ZodObject<{
+                kind: z.ZodLiteral<"url">;
+                url: z.ZodURL;
+            }, z.core.$strict>, z.ZodObject<{
+                kind: z.ZodLiteral<"base64">;
+                data: z.ZodString;
+            }, z.core.$strict>, z.ZodObject<{
+                kind: z.ZodLiteral<"path">;
+                path: z.ZodString;
+            }, z.core.$strict>], "kind">;
+            size: z.ZodOptional<z.ZodEnum<{
+                contain: "contain";
+                cover: "cover";
+                fill: "fill";
+                auto: "auto";
+            }>>;
+            opacity: z.ZodOptional<z.ZodNumber>;
+            bgOpacity: z.ZodOptional<z.ZodNumber>;
+        }, z.core.$strip>>;
+    }, z.core.$strict>>>;
 }, z.core.$strict>;
 export type AccentColorKey = z.infer<typeof accentColorKeySchema>;
 export type SlideThemeColors = z.infer<typeof slideThemeColorsSchema>;
@@ -9027,4 +9128,6 @@ export type TableCellValue = z.infer<typeof tableCellValueSchema>;
 export type TableSlide = z.infer<typeof tableSlideSchema>;
 export type FunnelStage = z.infer<typeof funnelStageSchema>;
 export type FunnelSlide = z.infer<typeof funnelSlideSchema>;
+export type SlideBrandingLogo = z.infer<typeof slideBrandingLogoSchema>;
+export type SlideBranding = z.infer<typeof slideBrandingSchema>;
 export type MulmoSlideMedia = z.infer<typeof mulmoSlideMediaSchema>;

package/lib/slide/schema.js

@@ -358,6 +358,37 @@ export const funnelSlideSchema = z.object({
     callout: calloutBarSchema.optional(),
 });
 // ═══════════════════════════════════════════════════════════
+// Branding — logo & background image overlay
+// ═══════════════════════════════════════════════════════════
+/**
+ * Media source for branding assets (self-contained definition to avoid
+ * circular dependency with src/types/schema.ts).
+ */
+const slideMediaSourceSchema = z.discriminatedUnion("kind", [
+    z.object({ kind: z.literal("url"), url: z.url() }).strict(),
+    z.object({ kind: z.literal("base64"), data: z.string().min(1) }).strict(),
+    z.object({ kind: z.literal("path"), path: z.string().min(1) }).strict(),
+]);
+const slideBackgroundImageSourceSchema = z.object({
+    source: slideMediaSourceSchema,
+    size: z.enum(["cover", "contain", "fill", "auto"]).optional(),
+    opacity: z.number().min(0).max(1).optional(),
+    bgOpacity: z.number().min(0).max(1).optional(),
+});
+export const slideBrandingLogoSchema = z
+    .object({
+    source: slideMediaSourceSchema,
+    position: z.enum(["top-left", "top-right", "bottom-left", "bottom-right"]).default("top-right"),
+    width: z.number().positive().default(120),
+})
+    .strict();
+export const slideBrandingSchema = z
+    .object({
+    logo: slideBrandingLogoSchema.optional(),
+    backgroundImage: slideBackgroundImageSourceSchema.optional(),
+})
+    .strict();
+// ═══════════════════════════════════════════════════════════
 // Slide Union & Media Schema
 // ═══════════════════════════════════════════════════════════
 export const slideLayoutSchema = z.discriminatedUnion("layout", [
@@ -380,5 +411,6 @@ export const mulmoSlideMediaSchema = z
     theme: slideThemeSchema.optional(),
     slide: slideLayoutSchema,
     reference: z.string().optional(),
+    branding: slideBrandingSchema.nullable().optional(),
 })
     .strict();

package/lib/slide/utils.d.ts

@@ -1,4 +1,4 @@
-import type { SlideTheme, SlideLayout } from "./schema.js";
+import type { SlideTheme, SlideLayout, CalloutBar } from "./schema.js";
 /** Escape HTML special characters */
 export declare const escapeHtml: (s: string) => string;
 /** Escape HTML and convert newlines to <br> */
@@ -13,6 +13,18 @@ export declare const renderInlineMarkup: (s: string) => string;
 export declare const sanitizeHex: (s: string) => string;
 /** Accent color key → Tailwind class segment: "primary" → "d-primary" */
 export declare const c: (key: string) => string;
+/** Resolve accent color key with "primary" as fallback */
+export declare const resolveAccent: (color: string | undefined) => string;
+/** Resolve item-level color with slide-level fallback then "primary" */
+export declare const resolveItemColor: (itemColor: string | undefined, slideAccent: string | undefined) => string;
+/** Render a horizontal accent bar (3px full-width). Pass extraClass for width/margin variants. */
+export declare const accentBar: (colorKey: string, extraClass?: string) => string;
+/** Render an optional block title (chart, mermaid, table) */
+export declare const blockTitle: (title: string | undefined) => string;
+/** Resolve change indicator color: "success" for positive (+), "danger" for negative */
+export declare const resolveChangeColor: (change: string) => string;
+/** Render the optional callout bar at the bottom of a slide, or empty string */
+export declare const renderOptionalCallout: (callout: CalloutBar | undefined) => string;
 /** Build the Tailwind config JSON string for theme colors and fonts */
 export declare const buildTailwindConfig: (theme: SlideTheme) => string;
 /** Render a numbered circle badge */
@@ -29,6 +41,13 @@ export declare const renderCalloutBar: (obj: {
     align?: string;
     leftBar?: boolean;
 }) => string;
+/** Render header text elements (stepLabel + title + subtitle) without wrapping div */
+export declare const renderHeaderText: (data: {
+    accentColor?: string;
+    stepLabel?: string;
+    title: string;
+    subtitle?: string;
+}) => string;
 /** Render the common slide header (accent bar + title + subtitle) */
 export declare const slideHeader: (data: {
     accentColor?: string;
@@ -36,6 +55,13 @@ export declare const slideHeader: (data: {
     title: string;
     subtitle?: string;
 }) => string;
+/** Render accent bar + vertically-centered wrapper with header text (used by stats, timeline) */
+export declare const centeredSlideHeader: (data: {
+    accentColor?: string;
+    stepLabel?: string;
+    title: string;
+    subtitle?: string;
+}) => string;
 /** Generate a unique ID with the given prefix (e.g. "chart-0", "mermaid-1") */
 export declare const generateSlideId: (prefix: string) => string;
 /** Reset the ID counter (for testing) */

package/lib/slide/utils.js

@@ -45,6 +45,27 @@ export const sanitizeHex = (s) => {
 export const c = (key) => {
     return `d-${sanitizeCssClass(key)}`;
 };
+// ═══════════════════════════════════════════════════════════
+// Shared micro-helpers for HTML generation
+// ═══════════════════════════════════════════════════════════
+/** Default accent color used when none is specified */
+const DEFAULT_ACCENT = "primary";
+/** Resolve accent color key with "primary" as fallback */
+export const resolveAccent = (color) => color || DEFAULT_ACCENT;
+/** Resolve item-level color with slide-level fallback then "primary" */
+export const resolveItemColor = (itemColor, slideAccent) => itemColor || slideAccent || DEFAULT_ACCENT;
+/** Render a horizontal accent bar (3px full-width). Pass extraClass for width/margin variants. */
+export const accentBar = (colorKey, extraClass) => `<div class="h-[3px] bg-${c(colorKey)} shrink-0 ${extraClass || ""}"></div>`;
+/** Render an optional block title (chart, mermaid, table) */
+export const blockTitle = (title) => title ? `<p class="text-sm font-bold text-d-text font-body mb-2">${renderInlineMarkup(title)}</p>` : "";
+/** Resolve change indicator color: "success" for positive (+), "danger" for negative */
+export const resolveChangeColor = (change) => (/\+/.test(change) ? "success" : "danger");
+/** Render the optional callout bar at the bottom of a slide, or empty string */
+export const renderOptionalCallout = (callout) => {
+    if (!callout)
+        return "";
+    return `<div class="mt-auto pb-4">${renderCalloutBar(callout)}</div>`;
+};
 const colorKeyMap = {
     bg: "bg",
     bgCard: "card",
@@ -97,7 +118,7 @@ export const iconSquare = (icon, colorKey) => {
 /** Render a card wrapper with accent top bar */
 export const cardWrap = (accentColor, innerHtml, extraClass) => {
     return `<div class="bg-d-card rounded-lg shadow-lg overflow-hidden flex flex-col min-h-0 ${sanitizeCssClass(extraClass || "")}">
-  <div class="h-[3px] bg-${c(accentColor)} shrink-0"></div>
+  ${accentBar(accentColor)}
   <div class="p-5 flex flex-col flex-1 min-h-0 overflow-hidden">
 ${innerHtml}
   </div>
@@ -116,22 +137,29 @@ export const renderCalloutBar = (obj) => {
   <div class="px-4 py-3 text-sm font-body flex-1">${inner}</div>
 </div>`;
 };
-/** Render the common slide header (accent bar + title + subtitle) */
-export const slideHeader = (data) => {
-    const accent = data.accentColor || "primary";
+/** Render header text elements (stepLabel + title + subtitle) without wrapping div */
+export const renderHeaderText = (data) => {
+    const accent = resolveAccent(data.accentColor);
     const lines = [];
-    lines.push(`<div class="h-[3px] bg-${c(accent)} shrink-0"></div>`);
-    lines.push(`<div class="px-12 pt-5 shrink-0">`);
     if (data.stepLabel) {
-        lines.push(`  <p class="text-sm font-bold text-${c(accent)} font-body">${renderInlineMarkup(data.stepLabel)}</p>`);
+        lines.push(`<p class="text-sm font-bold text-${c(accent)} font-body">${renderInlineMarkup(data.stepLabel)}</p>`);
     }
-    lines.push(`  <h2 class="text-[42px] leading-tight font-title font-bold text-d-text">${renderInlineMarkup(data.title)}</h2>`);
+    lines.push(`<h2 class="text-[42px] leading-tight font-title font-bold text-d-text">${renderInlineMarkup(data.title)}</h2>`);
     if (data.subtitle) {
-        lines.push(`  <p class="text-[15px] text-d-dim mt-2 font-body">${renderInlineMarkup(data.subtitle)}</p>`);
+        lines.push(`<p class="text-[15px] text-d-dim mt-2 font-body">${renderInlineMarkup(data.subtitle)}</p>`);
     }
-    lines.push(`</div>`);
     return lines.join("\n");
 };
+/** Render the common slide header (accent bar + title + subtitle) */
+export const slideHeader = (data) => {
+    const accent = resolveAccent(data.accentColor);
+    return [accentBar(accent), `<div class="px-12 pt-5 shrink-0">`, renderHeaderText(data), `</div>`].join("\n");
+};
+/** Render accent bar + vertically-centered wrapper with header text (used by stats, timeline) */
+export const centeredSlideHeader = (data) => {
+    const accent = resolveAccent(data.accentColor);
+    return [accentBar(accent), `<div class="flex-1 flex flex-col justify-center px-12 min-h-0">`, renderHeaderText(data)].join("\n");
+};
 // ═══════════════════════════════════════════════════════════
 // Counter-based ID generation (unique within a single slide)
 // ═══════════════════════════════════════════════════════════