deckjsx 0.2.1 → 0.3.1

package/README.md

@@ -38,8 +38,8 @@ const deck = new Deck({
   meta: { title: "Quarterly Review", author: "deckjsx" },
 });
 
-deck.add(({ slideIndex, totalSlides }) => (
-  <Slide name={`Slide ${slideIndex + 1}`} style={{ backgroundColor: "#F8FAFC" }}>
+deck.add(({ composition }) => (
+  <Slide name={`Slide ${composition.slideIndex + 1}`} style={{ backgroundColor: "#F8FAFC" }}>
     <main
       style={{
         x: 0.7,
@@ -71,7 +71,7 @@ deck.add(({ slideIndex, totalSlides }) => (
         <p
           style={{ width: "100%", height: 0.3, fontSize: 11, color: "#64748B", textAlign: "right" }}
         >
-          {slideIndex + 1} / {totalSlides}
+          {composition.slideIndex + 1} / {composition.totalSlides}
         </p>
       </footer>
     </main>

package/dist/index.d.mts

@@ -1,151 +1,5 @@
-import { $ as ImageStyle, A as CssFlexDirection, At as ViewStyle, B as CssJustifyContent, C as CssAlignContent, Ct as TextProps, D as CssBoxSizing, Dt as TextTabStopLength, E as CssAspectRatio, Et as TextTabStopAuthoring, F as CssGridShorthand, Ft as AuthoredTag, G as CssVisibility, H as CssObjectPosition, I as CssGridTemplate, It as SectioningTag, J as DeckOptions, K as DeckJsxIntrinsicElements, L as CssGridTemplateAreas, M as CssGridAutoFlow, Mt as JsxKey, N as CssGridLine, Nt as SourceSpan, O as CssDisplay, Ot as VerticalAlign, P as CssGridPlacement, Pt as AuthoredComponent, Q as ImageProps, R as CssGridTemplateShorthand, S as ContentJsxChild, St as TextJsxChild, T as CssAlignSelf, Tt as TextTabStopAlignment, U as CssOverflow, V as CssJustifySelf, W as CssPosition, X as ImageCropAuthoring, Y as DeckPointLength, Z as ImageCropValue, _ as AuthorNodeProps, _t as StackAxis, a as createElement, at as IntrinsicViewTag, b as BorderStyle, bt as StrokeLineJoin, c as isSlideNode, ct as OutputConfig, d as Slide, dt as SlideContext, et as ImplementedBackendName, f as Text, ft as SlideFactory, g as AuthorNodeMap, gt as StackAlignment, h as AuthorNodeKind, ht as Spacing, i as Fragment, it as IntrinsicTextTag, j as CssFlexWrap, k as CssFlexBasis, kt as ViewProps, l as Image, lt as ShapeProps, m as AuthorNode, mt as SlideStyle, nt as IntrinsicImgProps, o as isAuthorNode, ot as JsxNode, p as View, pt as SlideProps, q as DeckLength, rt as IntrinsicPProps, s as isContentNode, st as LayoutMode, tt as IntrinsicDivProps, u as Shape, ut as ShapeStyle, v as AuthorNodePropsMap, vt as StrokeDashType, w as CssAlignItems, wt as TextStyle, x as ContentAuthorNode, xt as TextFit, y as BackendName, yt as StrokeLineCap, z as CssGridTrack } from "./jsx-runtime-ru5t8S3z.mjs";
+import { $ as ImageCropAuthoring, $t as SemanticSlideNode, A as CssBoxSizing, At as ViewProps, B as CssGridTemplateAreas, Bt as AssetEntity, C as ClassNameValueArray, Ct as TextJsxChild, D as CssAlignItems, Dt as TextTabStopAuthoring, E as CssAlignContent, Et as TextTabStopAlignment, F as CssGridAutoFlow, Ft as CompositionSourceInternals, G as CssObjectPosition, Gt as SemanticContainerNode, H as CssGridTrack, Ht as BaseSemanticNode, I as CssGridLine, It as SlideFactory, J as CssVisibility, Jt as SemanticNode, K as CssOverflow, Kt as SemanticDocumentNode, L as CssGridPlacement, Lt as SlideFactoryInput, M as CssFlexBasis, Mt as COMPOSITION_SOURCE, N as CssFlexDirection, Nt as CompositionContext, O as CssAlignSelf, Ot as TextTabStopLength, P as CssFlexWrap, Pt as CompositionSource, Q as DeckPointLength, Qt as SemanticShapeNode, R as CssGridShorthand, Rt as SourceContextInput, S as ClassNameValue, St as TextFit, T as ContentJsxChild, Tt as TextStyle, U as CssJustifyContent, Ut as GraphNodeId, V as CssGridTemplateShorthand, Vt as AssetEntityId, W as CssJustifySelf, Wt as SemanticAuthorGraph, X as DeckLength, Xt as SemanticOrigin, Y as DeckJsxIntrinsicElements, Yt as SemanticNodeKind, Z as DeckOptions, Zt as SemanticRole, _ as AuthorNodeProps, _n as JsxKey, _t as StackAlignment, a as createElement, an as StyleEntity, at as IntrinsicImgProps, b as BorderStyle, bt as StrokeLineCap, c as isSlideNode, cn as DiagnosticLabel, ct as IntrinsicViewTag, d as Slide, dn as formatDiagnostic, dt as OutputConfig, en as SemanticTextNode, et as ImageCropValue, f as Text, fn as formatDiagnostics, ft as ShapeProps, g as AuthorNodeMap, gt as Spacing, h as AuthorNodeKind, hn as SemanticGraphDiagnosticError, ht as SlideStyle, i as Fragment, in as StyleClassRef, it as IntrinsicDivProps, j as CssDisplay, jt as ViewStyle, k as CssAspectRatio, kt as VerticalAlign, l as Image, ln as DiagnosticSeverity, lt as JsxNode, m as AuthorNode, mn as DeckDiagnosticError, mt as SlideProps, nn as SourceIdentity, nt as ImageStyle, o as isAuthorNode, on as StyleEntityId, ot as IntrinsicPProps, p as View, pn as CompositionDiagnosticError, pt as ShapeStyle, q as CssPosition, qt as SemanticImageNode, rn as SourceOrigin, rt as ImplementedBackendName, s as isContentNode, sn as Diagnostic, st as IntrinsicTextTag, tn as SemanticTextRunNode, tt as ImageProps, u as Shape, un as Diagnostics, ut as LayoutMode, v as AuthorNodePropsMap, vn as SourceSpan, vt as StackAxis, w as ContentAuthorNode, wt as TextProps, x as ClassNameObject, xt as StrokeLineJoin, y as BackendName, yt as StrokeDashType, z as CssGridTemplate, zt as SourceContextMapper } from "./jsx-runtime-CJ9_d_0Q.mjs";
 
-//#region src/diagnostics/errors.d.ts
-declare class DeckDiagnosticError extends Error {
-  readonly diagnostics: Diagnostics;
-  constructor(message: string, diagnostics: Diagnostics);
-}
-declare class SemanticGraphDiagnosticError extends DeckDiagnosticError {
-  constructor(diagnostics: Diagnostics);
-}
-//#endregion
-//#region src/diagnostics/format.d.ts
-declare function formatDiagnostic(diagnostic: Diagnostic): string;
-declare function formatDiagnostics(diagnostics: Diagnostics): string;
-//#endregion
-//#region src/diagnostics/index.d.ts
-type DiagnosticSeverity = "error" | "warning";
-type DiagnosticLabel = {
-  readonly message: string;
-  readonly path: string;
-  readonly sourceSpan?: SourceSpan;
-  readonly severity?: "primary" | "secondary";
-};
-type Diagnostic = {
-  readonly severity: DiagnosticSeverity;
-  readonly code: string;
-  readonly title: string;
-  readonly message?: string;
-  readonly labels: readonly DiagnosticLabel[];
-  readonly notes?: readonly string[];
-  readonly help?: readonly string[];
-};
-type Diagnostics = {
-  readonly items: readonly Diagnostic[];
-  readonly hasErrors: boolean;
-  readonly hasWarnings: boolean;
-};
-//#endregion
-//#region src/graph/types.d.ts
-type Brand<T, B extends string> = T & {
-  readonly __brand: B;
-};
-type GraphNodeId = Brand<string, "GraphNodeId">;
-type StyleEntityId = Brand<string, "StyleEntityId">;
-type AssetEntityId = Brand<string, "AssetEntityId">;
-type SemanticNodeKind = "container" | "document" | "image" | "shape" | "slide" | "text" | "textRun";
-type SemanticRole = {
-  readonly kind: "document";
-} | {
-  readonly kind: "slide";
-} | {
-  readonly kind: "genericContainer";
-} | {
-  readonly kind: "sectioning";
-  readonly tag: SectioningTag;
-} | {
-  readonly kind: "figure";
-} | {
-  readonly kind: "paragraph";
-} | {
-  readonly kind: "heading";
-  readonly level: 1 | 2 | 3 | 4 | 5 | 6;
-} | {
-  readonly kind: "image";
-} | {
-  readonly kind: "shape";
-};
-type SemanticOrigin = {
-  readonly kind: "authored" | "implicit";
-  readonly path: string;
-  readonly sourceSpan?: SourceSpan;
-  readonly reason?: "primitive-text-in-container";
-};
-type BaseSemanticNode = {
-  readonly id: GraphNodeId;
-  readonly kind: SemanticNodeKind;
-  readonly origin: SemanticOrigin;
-  readonly authoredTag?: AuthoredTag;
-  readonly authoredComponent?: AuthoredComponent;
-  readonly role?: SemanticRole;
-  readonly key?: JsxKey;
-  readonly styleRef?: StyleEntityId;
-};
-type SemanticDocumentNode = BaseSemanticNode & {
-  readonly kind: "document";
-  readonly children: readonly GraphNodeId[];
-};
-type SemanticSlideNode = BaseSemanticNode & {
-  readonly kind: "slide";
-  readonly name?: string;
-  readonly children: readonly GraphNodeId[];
-};
-type SemanticContainerNode = BaseSemanticNode & {
-  readonly kind: "container";
-  readonly children: readonly GraphNodeId[];
-};
-type SemanticTextNode = BaseSemanticNode & {
-  readonly kind: "text";
-  readonly inlineChildren: readonly GraphNodeId[];
-  readonly implicit?: boolean;
-};
-type SemanticTextRunNode = BaseSemanticNode & {
-  readonly kind: "textRun";
-  readonly text: string;
-};
-type SemanticImageNode = BaseSemanticNode & {
-  readonly kind: "image";
-  readonly assetRef?: AssetEntityId;
-};
-type SemanticShapeNode = BaseSemanticNode & {
-  readonly kind: "shape";
-};
-type SemanticNode = SemanticContainerNode | SemanticDocumentNode | SemanticImageNode | SemanticShapeNode | SemanticSlideNode | SemanticTextNode | SemanticTextRunNode;
-type StyleEntity = {
-  readonly id: StyleEntityId;
-  readonly target: SemanticNodeKind;
-  readonly authored: {
-    readonly style?: unknown;
-    readonly direct?: unknown;
-  };
-  readonly resolved?: unknown;
-};
-type AssetEntity = {
-  readonly id: AssetEntityId;
-  readonly kind: "image";
-  readonly source: {
-    readonly kind: "path";
-    readonly path: string;
-  } | {
-    readonly kind: "data";
-    readonly data: string;
-  };
-  readonly metadata: {
-    readonly mediaType?: string;
-    readonly byteLength?: number;
-    readonly widthPx?: number;
-    readonly heightPx?: number;
-    readonly contentHash?: string;
-  };
-  readonly resolution: "failed" | "resolved" | "unresolved";
-};
-type SemanticAuthorGraph = {
-  readonly documentId: GraphNodeId;
-  readonly nodes: ReadonlyMap<GraphNodeId, SemanticNode>;
-  readonly styles: ReadonlyMap<StyleEntityId, StyleEntity>;
-  readonly assets: ReadonlyMap<AssetEntityId, AssetEntity>;
-};
-//#endregion
 //#region src/ir/index.d.ts
 type PresentationIR = {
   version: "0.1";
@@ -394,11 +248,11 @@ type CompileInspectResult = {
   readonly graph?: SemanticAuthorGraph;
   readonly diagnostics: Diagnostics;
 };
-declare class Deck {
+type WithSource<TSourceContext> = [TSourceContext] extends [void] ? never : (sourceContext: TSourceContext) => BoundSource<TSourceContext>;
+declare class BoundSource<TSourceContext = void> implements CompositionSource<TSourceContext> {
   #private;
-  constructor(options: DeckOptions);
-  add(slide: SlideFactory): this;
-  render(): PresentationIR;
+  constructor(source: Deck<TSourceContext>, sourceContext: TSourceContext);
+  [COMPOSITION_SOURCE](): CompositionSourceInternals<TSourceContext>;
   compile(): SemanticAuthorGraph;
   compile(config: {
     mode?: "strict";
@@ -406,8 +260,28 @@ declare class Deck {
   compile(config: {
     mode: "inspect";
   }): CompileInspectResult;
+  render(): PresentationIR;
   output(config: OutputConfig): Promise<void>;
 }
+declare class Deck<TSourceContext = void> implements CompositionSource<TSourceContext> {
+  #private;
+  readonly withSource: WithSource<TSourceContext>;
+  constructor(options: DeckOptions);
+  get options(): DeckOptions;
+  [COMPOSITION_SOURCE](): CompositionSourceInternals<TSourceContext>;
+  add(slide: SlideFactory<TSourceContext>): this;
+  mount<TChildContext>(sourceKey: string, child: Deck<TChildContext>, ...context: [TChildContext] extends [void] ? [] : [sourceContext: SourceContextInput<TSourceContext, TChildContext>]): this;
+  mount<TChildContext>(sourceKey: string, child: BoundSource<TChildContext>): this;
+  render(this: Deck<void>): PresentationIR;
+  compile(this: Deck<void>): SemanticAuthorGraph;
+  compile(this: Deck<void>, config: {
+    mode?: "strict";
+  }): SemanticAuthorGraph;
+  compile(this: Deck<void>, config: {
+    mode: "inspect";
+  }): CompileInspectResult;
+  output(this: Deck<void>, config: OutputConfig): Promise<void>;
+}
 //#endregion
 //#region src/backends/pptxgenjs.d.ts
 declare function pptxgenjsBackend(): CompileBackend;
@@ -430,4 +304,4 @@ declare global {
   }
 }
 //#endregion
-export { type AssetEntity, type AssetEntityId, type AuthorNode, type AuthorNodeKind, type AuthorNodeMap, type AuthorNodeProps, type AuthorNodePropsMap, type BackendArtifact, type BackendName, type BackgroundImageLayerIR, type BackgroundLayerIR, type BaseNodeIR, type BaseSemanticNode, type BorderStyle, type CompileBackend, type CompileInspectResult, type CompileMode, type ContentAuthorNode, type ContentJsxChild, type CssAlignContent, type CssAlignItems, type CssAlignSelf, type CssAspectRatio, type CssBoxSizing, type CssDisplay, type CssFlexBasis, type CssFlexDirection, type CssFlexWrap, type CssGridAutoFlow, type CssGridLine, type CssGridPlacement, type CssGridShorthand, type CssGridTemplate, type CssGridTemplateAreas, type CssGridTemplateShorthand, type CssGridTrack, type CssJustifyContent, type CssJustifySelf, type CssObjectPosition, type CssOverflow, type CssPosition, type CssVisibility, Deck, DeckDiagnosticError, type DeckJsxIntrinsicElements, type DeckLength, type DeckOptions, type DeckPointLength, type Diagnostic, type DiagnosticLabel, type DiagnosticSeverity, type Diagnostics, EMU_PER_INCH, type EdgeStrokeIR, type FillIR, Fragment, type FrameIR, type GraphNodeId, type GroupIR, type HyperlinkIR, Image, type ImageCropAuthoring, type ImageCropIR, type ImageCropValue, type ImageIR, type ImageProps, type ImageSourceIR, type ImageStyle, type ImplementedBackendName, type IntrinsicDivProps, type IntrinsicImgProps, type IntrinsicPProps, type IntrinsicTextTag, type IntrinsicViewTag, type JsxKey, type JsxNode, type LayoutMode, type LinearGradientFillIR, type LinearGradientStopIR, type NodeIR, type ObjectPositionIR, type OutputConfig, POINTS_PER_INCH, type PresentationIR, type RadialGradientFillIR, type SemanticAuthorGraph, type SemanticContainerNode, type SemanticDocumentNode, SemanticGraphDiagnosticError, type SemanticImageNode, type SemanticNode, type SemanticNodeKind, type SemanticOrigin, type SemanticRole, type SemanticShapeNode, type SemanticSlideNode, type SemanticTextNode, type SemanticTextRunNode, type ShadowIR, Shape, type ShapeIR, type ShapeProps, type ShapeStyle, type SizeIR, Slide, type SlideContext, type SlideFactory, type SlideIR, type SlideProps, type SlideStyle, type SolidFillIR, type SourceSpan, type Spacing, type StackAlignment, type StackAxis, type StrokeDashType, type StrokeIR, type StrokeLineCap, type StrokeLineJoin, type StyleEntity, type StyleEntityId, Text, type TextBulletListIR, type TextContentIR, type TextFit, type TextIR, type TextJsxChild, type TextListIR, type TextNoListIR, type TextNumberListIR, type TextProps, type TextRunIR, type TextStyle, type TextStyleIR, type TextTabStopAlignment, type TextTabStopAuthoring, type TextTabStopIR, type TextTabStopLength, type VerticalAlign, View, type ViewProps, type ViewStyle, createElement, formatDiagnostic, formatDiagnostics, isAuthorNode, isContentNode, isSlideNode, pptxgenjsBackend };
+export { type AssetEntity, type AssetEntityId, type AuthorNode, type AuthorNodeKind, type AuthorNodeMap, type AuthorNodeProps, type AuthorNodePropsMap, type BackendArtifact, type BackendName, type BackgroundImageLayerIR, type BackgroundLayerIR, type BaseNodeIR, type BaseSemanticNode, type BorderStyle, type BoundSource, type ClassNameObject, type ClassNameValue, type ClassNameValueArray, type CompileBackend, type CompileInspectResult, type CompileMode, type CompositionContext, CompositionDiagnosticError, type ContentAuthorNode, type ContentJsxChild, type CssAlignContent, type CssAlignItems, type CssAlignSelf, type CssAspectRatio, type CssBoxSizing, type CssDisplay, type CssFlexBasis, type CssFlexDirection, type CssFlexWrap, type CssGridAutoFlow, type CssGridLine, type CssGridPlacement, type CssGridShorthand, type CssGridTemplate, type CssGridTemplateAreas, type CssGridTemplateShorthand, type CssGridTrack, type CssJustifyContent, type CssJustifySelf, type CssObjectPosition, type CssOverflow, type CssPosition, type CssVisibility, Deck, DeckDiagnosticError, type DeckJsxIntrinsicElements, type DeckLength, type DeckOptions, type DeckPointLength, type Diagnostic, type DiagnosticLabel, type DiagnosticSeverity, type Diagnostics, EMU_PER_INCH, type EdgeStrokeIR, type FillIR, Fragment, type FrameIR, type GraphNodeId, type GroupIR, type HyperlinkIR, Image, type ImageCropAuthoring, type ImageCropIR, type ImageCropValue, type ImageIR, type ImageProps, type ImageSourceIR, type ImageStyle, type ImplementedBackendName, type IntrinsicDivProps, type IntrinsicImgProps, type IntrinsicPProps, type IntrinsicTextTag, type IntrinsicViewTag, type JsxKey, type JsxNode, type LayoutMode, type LinearGradientFillIR, type LinearGradientStopIR, type NodeIR, type ObjectPositionIR, type OutputConfig, POINTS_PER_INCH, type PresentationIR, type RadialGradientFillIR, type SemanticAuthorGraph, type SemanticContainerNode, type SemanticDocumentNode, SemanticGraphDiagnosticError, type SemanticImageNode, type SemanticNode, type SemanticNodeKind, type SemanticOrigin, type SemanticRole, type SemanticShapeNode, type SemanticSlideNode, type SemanticTextNode, type SemanticTextRunNode, type ShadowIR, Shape, type ShapeIR, type ShapeProps, type ShapeStyle, type SizeIR, Slide, type SlideFactory, type SlideFactoryInput, type SlideIR, type SlideProps, type SlideStyle, type SolidFillIR, type SourceContextMapper, type SourceIdentity, type SourceOrigin, type SourceSpan, type Spacing, type StackAlignment, type StackAxis, type StrokeDashType, type StrokeIR, type StrokeLineCap, type StrokeLineJoin, type StyleClassRef, type StyleEntity, type StyleEntityId, Text, type TextBulletListIR, type TextContentIR, type TextFit, type TextIR, type TextJsxChild, type TextListIR, type TextNoListIR, type TextNumberListIR, type TextProps, type TextRunIR, type TextStyle, type TextStyleIR, type TextTabStopAlignment, type TextTabStopAuthoring, type TextTabStopIR, type TextTabStopLength, type VerticalAlign, View, type ViewProps, type ViewStyle, createElement, formatDiagnostic, formatDiagnostics, isAuthorNode, isContentNode, isSlideNode, pptxgenjsBackend };

package/dist/index.mjs

@@ -4139,17 +4139,12 @@ function renderPresentation(options, slides) {
 		meta: options.meta,
 		size: slideSize,
 		slides: slides.map((factory, slideIndex) => {
-			return compileSlide(toLegacyJsxNode(factory({
+			return compileSlide(toLegacyJsxNode(factory({ composition: {
 				slideIndex,
 				totalSlides: slides.length,
-				context: {
-					slideIndex,
-					totalSlides: slides.length
-				}
-			})), {
-				slideIndex,
-				totalSlides: slides.length
-			}, slideFrame, idGenerator, lengthContext);
+				deckSlideIndex: slideIndex,
+				deckTotalSlides: slides.length
+			} })), { slideIndex }, slideFrame, idGenerator, lengthContext);
 		})
 	};
 }
@@ -4188,6 +4183,12 @@ var SemanticGraphDiagnosticError = class extends DeckDiagnosticError {
 		this.name = "SemanticGraphDiagnosticError";
 	}
 };
+var CompositionDiagnosticError = class extends DeckDiagnosticError {
+	constructor(diagnostics) {
+		super(formatDiagnostics(diagnostics), diagnostics);
+		this.name = "CompositionDiagnosticError";
+	}
+};
 //#endregion
 //#region src/diagnostics/index.ts
 function createDiagnostics(items = []) {
@@ -4201,6 +4202,276 @@ function diagnostic(input) {
 	return input;
 }
 //#endregion
+//#region src/composition/types.ts
+const COMPOSITION_SOURCE = Symbol("deckjsx.compositionSource");
+function sourceIdentity(value) {
+	return value;
+}
+//#endregion
+//#region src/composition/resolve.ts
+const MAX_COMPOSITION_DEPTH = 64;
+const ROOT_SOURCE = { kind: "root" };
+function addDiagnostic$1(context, item) {
+	context.diagnostics.push(item);
+}
+function compositionDiagnostic(input) {
+	return diagnostic({
+		severity: "error",
+		code: input.code,
+		title: input.title,
+		message: input.message,
+		labels: [{
+			path: input.path,
+			message: input.message
+		}],
+		...input.help ? { help: input.help } : {}
+	});
+}
+function sourcePathFor(parentPath, sourceKey) {
+	return parentPath === "root" ? sourceKey : `${parentPath}/${sourceKey}`;
+}
+function sourceOriginFor(parent, sourceKey) {
+	return {
+		kind: "mounted",
+		sourceKey,
+		sourceIdentity: sourceIdentity(`${parent.kind === "root" ? "" : `${parent.sourceIdentity}/`}${sourceKey}`)
+	};
+}
+function sourceMaterialFor(source) {
+	return source.kind === "root" ? ["source", "root"] : ["source", source.sourceIdentity];
+}
+function validateSourceKey(sourceKey) {
+	if (sourceKey.trim().length === 0) return "Source Key must not be empty.";
+	if (sourceKey === "." || sourceKey === "..") return "Source Key must not be dot or dot-dot.";
+	if (sourceKey.includes("/")) return "Source Key must not contain /.";
+}
+function describeInvalidRoot(value) {
+	if (isLegacyAuthorNode(value)) return "Slide factory returned a legacy author node.";
+	if (isAuthorTreeNode(value)) return "Slide factory returned an author tree node that is not a <Slide /> root.";
+	if (value === null) return "Slide factory returned null.";
+	return `Slide factory returned ${typeof value}.`;
+}
+function isSlideRoot(value) {
+	return value.kind === "element" && value.source.kind === "component" && value.source.component === "Slide";
+}
+function isPromiseLike(value) {
+	return typeof value === "object" && value !== null && "then" in value && typeof value.then === "function";
+}
+function mapSlotOrigins(value, origin, targets, seen) {
+	if (isAuthorTreeNode(value)) {
+		targets.set(value, origin);
+		return;
+	}
+	if (!Array.isArray(value)) return;
+	if (seen.has(value)) return;
+	seen.add(value);
+	value.forEach((item) => mapSlotOrigins(item, origin, targets, seen));
+}
+function collectSourceSlots(context, parent) {
+	const origins = /* @__PURE__ */ new WeakMap();
+	if (!context.present || typeof context.value !== "object" || context.value === null) return origins;
+	Object.entries(context.value).forEach(([field, value]) => {
+		mapSlotOrigins(value, {
+			source: parent.slotOwnerSource,
+			field,
+			identityMaterial: [...parent.slotOwnerMaterial, `slot:${field}`]
+		}, origins, /* @__PURE__ */ new WeakSet());
+	});
+	return origins;
+}
+function childContextFor(entry, context, path) {
+	if (entry.invalidExtraContext) {
+		addDiagnostic$1(context, compositionDiagnostic({
+			code: "E_COMPOSITION_INVALID_MOUNT",
+			title: "mount received invalid source context",
+			path,
+			message: "A Bound Source cannot receive additional Source Context."
+		}));
+		return;
+	}
+	if (entry.contextProvider === void 0) return { present: false };
+	if (typeof entry.contextProvider !== "function") return {
+		present: true,
+		value: entry.contextProvider
+	};
+	try {
+		const value = context.context.present ? entry.contextProvider(context.context.value) : entry.contextProvider();
+		if (isPromiseLike(value)) {
+			addDiagnostic$1(context, compositionDiagnostic({
+				code: "E_COMPOSITION_CONTEXT_MAPPER_ASYNC",
+				title: "source context mapper returned a Promise",
+				path,
+				message: "Source Context Mappers must be synchronous in v0.3."
+			}));
+			return;
+		}
+		return {
+			present: true,
+			value
+		};
+	} catch (error) {
+		addDiagnostic$1(context, compositionDiagnostic({
+			code: "E_COMPOSITION_CONTEXT_MAPPER_FAILED",
+			title: "source context mapper failed",
+			path,
+			message: error instanceof Error ? error.message : "Source Context Mapper threw."
+		}));
+		return;
+	}
+}
+function resolveSource(source, context) {
+	const sourceState = source[COMPOSITION_SOURCE]();
+	const effectiveContext = context.context.present ? context.context : sourceState.boundContext;
+	if (context.depth > MAX_COMPOSITION_DEPTH) {
+		addDiagnostic$1(context, compositionDiagnostic({
+			code: "E_COMPOSITION_DEPTH_EXCEEDED",
+			title: "composition depth exceeded",
+			path: context.sourcePath,
+			message: `Composition depth exceeded ${MAX_COMPOSITION_DEPTH}.`
+		}));
+		return;
+	}
+	if (context.stack.indexOf(sourceState.cycleId) !== -1) {
+		addDiagnostic$1(context, compositionDiagnostic({
+			code: "E_COMPOSITION_CYCLE",
+			title: "composition cycle detected",
+			path: context.sourcePath,
+			message: "A Deck cannot mount itself through its descendant sources."
+		}));
+		return;
+	}
+	const entries = [];
+	let slideCount = 0;
+	const sourceKeys = /* @__PURE__ */ new Set();
+	const slotOrigins = collectSourceSlots(effectiveContext, context);
+	const nextContextBase = {
+		diagnostics: context.diagnostics,
+		stack: [...context.stack, sourceState.cycleId],
+		depth: context.depth + 1
+	};
+	sourceState.entries.forEach((entry, index) => {
+		if (entry.kind === "slide") {
+			entries.push({
+				kind: "slide",
+				factory: entry.factory,
+				path: `${context.sourcePath} > slideFactory[${index}]`
+			});
+			slideCount += 1;
+			return;
+		}
+		const mountPath = `${context.sourcePath} > mount[${entry.sourceKey}]`;
+		const invalidKey = validateSourceKey(entry.sourceKey);
+		if (invalidKey) {
+			addDiagnostic$1(context, compositionDiagnostic({
+				code: "E_COMPOSITION_INVALID_SOURCE_KEY",
+				title: "invalid source key",
+				path: mountPath,
+				message: invalidKey
+			}));
+			return;
+		}
+		if (sourceKeys.has(entry.sourceKey)) {
+			addDiagnostic$1(context, compositionDiagnostic({
+				code: "E_COMPOSITION_DUPLICATE_SOURCE_KEY",
+				title: "duplicate source key",
+				path: mountPath,
+				message: `Source Key "${entry.sourceKey}" is already used in this parent source.`
+			}));
+			return;
+		}
+		sourceKeys.add(entry.sourceKey);
+		const childContext = childContextFor(entry, context, mountPath);
+		if (!childContext) return;
+		const childSource = sourceOriginFor(context.source, entry.sourceKey);
+		const childPlan = resolveSource(entry.source, {
+			...nextContextBase,
+			source: childSource,
+			sourceIdentityMaterial: sourceMaterialFor(childSource),
+			sourcePath: sourcePathFor(context.sourcePath, entry.sourceKey),
+			context: childContext,
+			slotOwnerSource: context.source,
+			slotOwnerMaterial: context.sourceIdentityMaterial
+		});
+		if (!childPlan) return;
+		entries.push({
+			kind: "source",
+			source: childPlan
+		});
+		slideCount += childPlan.slideCount;
+	});
+	return {
+		source: context.source,
+		sourceIdentityMaterial: context.sourceIdentityMaterial,
+		context: effectiveContext,
+		entries,
+		slideCount,
+		slotOrigins
+	};
+}
+function flattenPlan(plan, deckTotalSlides, deckSlideIndex, roots, diagnostics) {
+	let sourceSlideIndex = 0;
+	let nextDeckSlideIndex = deckSlideIndex;
+	for (const entry of plan.entries) {
+		if (entry.kind === "source") {
+			nextDeckSlideIndex = flattenPlan(entry.source, deckTotalSlides, nextDeckSlideIndex, roots, diagnostics);
+			sourceSlideIndex += entry.source.slideCount;
+			continue;
+		}
+		const composition = {
+			...plan.source.kind === "mounted" ? { sourceKey: plan.source.sourceKey } : {},
+			slideIndex: sourceSlideIndex,
+			totalSlides: plan.slideCount,
+			deckSlideIndex: nextDeckSlideIndex,
+			deckTotalSlides
+		};
+		const input = plan.context.present ? {
+			context: plan.context.value,
+			composition
+		} : { composition };
+		const root = entry.factory(input);
+		if (!isAuthorTreeNode(root) || !isSlideRoot(root)) diagnostics.push(compositionDiagnostic({
+			code: "E_COMPOSITION_INVALID_ROOT",
+			title: "slide factory must return a <Slide /> root",
+			path: entry.path,
+			message: describeInvalidRoot(root),
+			help: ["Return <Slide>...</Slide> from the slide factory passed to deck.add()."]
+		}));
+		else roots.push({
+			root,
+			source: plan.source,
+			sourceIdentityMaterial: plan.sourceIdentityMaterial,
+			path: entry.path,
+			composition,
+			slotOrigins: plan.slotOrigins
+		});
+		sourceSlideIndex += 1;
+		nextDeckSlideIndex += 1;
+	}
+	return nextDeckSlideIndex;
+}
+function resolveComposition(source) {
+	const diagnostics = [];
+	const rootPlan = resolveSource(source, {
+		diagnostics,
+		stack: [],
+		depth: 0,
+		source: ROOT_SOURCE,
+		sourceIdentityMaterial: sourceMaterialFor(ROOT_SOURCE),
+		sourcePath: "root",
+		context: { present: false },
+		slotOwnerSource: ROOT_SOURCE,
+		slotOwnerMaterial: sourceMaterialFor(ROOT_SOURCE)
+	});
+	if (!rootPlan) return { diagnostics: createDiagnostics(diagnostics) };
+	const roots = [];
+	flattenPlan(rootPlan, rootPlan.slideCount, 0, roots, diagnostics);
+	const resolvedDiagnostics = createDiagnostics(diagnostics);
+	return {
+		...resolvedDiagnostics.hasErrors ? {} : { roots },
+		diagnostics: resolvedDiagnostics
+	};
+}
+//#endregion
 //#region src/graph/identity.ts
 function slug(value) {
 	return value.replace(/[^a-zA-Z0-9:_-]+/g, "_");
@@ -4281,35 +4552,74 @@ function nodeSemanticKind(node) {
 function nodeRole(node) {
 	return node.source.kind === "tag" ? semanticRoleForTag(node.source.tag) : semanticRoleForComponent(node.source.component);
 }
-function originFor(node, path) {
+function sourceFor(context) {
+	return context.activeSlot?.source ?? context.source;
+}
+function contextForNode(node, context) {
+	const slot = context.slotOrigins.get(node);
+	if (!slot) return context;
+	return {
+		...context,
+		activeSlot: slot,
+		parentMaterial: [...context.parentMaterial, ...slot.identityMaterial],
+		path: `${context.path} > slot[${slot.field}]`
+	};
+}
+function originFor(node, path, context) {
 	return {
 		kind: "authored",
 		path,
+		source: sourceFor(context),
 		...node.sourceSpan ? { sourceSpan: node.sourceSpan } : {}
 	};
 }
-function textOriginFor(node, path) {
+function textOriginFor(node, path, context) {
 	return {
 		kind: "authored",
 		path,
+		source: sourceFor(context),
 		...node.sourceSpan ? { sourceSpan: node.sourceSpan } : {}
 	};
 }
 function propsWithoutStyle(props) {
-	const { style: _style, children: _children, ...direct } = props;
+	const { style: _style, children: _children, className: _className, ...direct } = props;
 	return Object.keys(direct).length === 0 ? void 0 : direct;
 }
+function collectClassNames(value, names) {
+	if (value === false || value === null || value === void 0) return;
+	if (typeof value === "string") {
+		names.push(...value.trim().split(/\s+/).filter(Boolean));
+		return;
+	}
+	if (Array.isArray(value)) {
+		value.forEach((item) => collectClassNames(item, names));
+		return;
+	}
+	if (typeof value === "object") Object.entries(value).forEach(([name, enabled]) => {
+		if (enabled === true) collectClassNames(name, names);
+	});
+}
+function classRefsFor(value) {
+	const names = [];
+	collectClassNames(value, names);
+	return names.length === 0 ? void 0 : names.map((name, index) => ({
+		name,
+		index
+	}));
+}
 function styleRefFor(state, idMaterial, target, props) {
 	const style = props.style;
 	const direct = propsWithoutStyle(props);
-	if (style === void 0 && direct === void 0) return;
+	const classRefs = classRefsFor(props.className);
+	if (style === void 0 && direct === void 0 && classRefs === void 0) return;
 	const id = styleEntityId(idMaterial);
 	state.styles.set(id, {
 		id,
 		target,
 		authored: {
 			...style !== void 0 ? { style } : {},
-			...direct !== void 0 ? { direct } : {}
+			...direct !== void 0 ? { direct } : {},
+			...classRefs !== void 0 ? { classRefs } : {}
 		}
 	});
 	return id;
@@ -4352,12 +4662,12 @@ function assetForImage(state, idMaterial, props, path) {
 	state.assets.set(id, entity);
 	return id;
 }
-function semanticBase(state, node, id, kind, path, material) {
+function semanticBase(state, node, id, kind, path, material, context) {
 	const styleRef = styleRefFor(state, material, kind, node.props);
 	return {
 		id,
 		kind,
-		origin: originFor(node, path),
+		origin: originFor(node, path, context),
 		...node.source.kind === "tag" ? { authoredTag: node.source.tag } : {},
 		...node.source.kind === "component" ? { authoredComponent: node.source.component } : {},
 		...node.key !== void 0 ? { key: node.key } : {},
@@ -4374,7 +4684,7 @@ function buildTextRunFromLeaf(state, leaf, context, index) {
 	state.nodes.set(id, {
 		id,
 		kind: "textRun",
-		origin: textOriginFor(leaf, path),
+		origin: textOriginFor(leaf, path, context),
 		text
 	});
 	return {
@@ -4396,6 +4706,7 @@ function buildImplicitTextNode(state, leaf, context, index) {
 		origin: {
 			kind: "implicit",
 			path: `${context.path} > implicitText[${index}]`,
+			source: sourceFor(context),
 			...leaf.sourceSpan ? { sourceSpan: leaf.sourceSpan } : {},
 			reason: "primitive-text-in-container"
 		},
@@ -4411,11 +4722,12 @@ function buildChildren(state, children, context) {
 	const ids = [];
 	children.forEach((child, index) => {
 		if (child.kind === "fragment") {
+			const childContext = contextForNode(child, context);
 			const segment = `fragment:${keySegment(child.key, index)}`;
 			ids.push(...buildChildren(state, child.children, {
-				...context,
-				parentMaterial: [...context.parentMaterial, segment],
-				path: `${context.path} > fragment[${keySegment(child.key, index)}]`
+				...childContext,
+				parentMaterial: [...childContext.parentMaterial, segment],
+				path: `${childContext.path} > fragment[${keySegment(child.key, index)}]`
 			}));
 			return;
 		}
@@ -4424,11 +4736,12 @@ function buildChildren(state, children, context) {
 	});
 	return ids;
 }
-function buildTextLikeNode(state, node, id, path, material) {
+function buildTextLikeNode(state, node, id, path, material, context) {
 	const inlineChildren = [];
 	node.children.forEach((child, index) => {
 		if (child.kind === "text") {
 			const run = buildTextRunFromLeaf(state, child, {
+				...context,
 				parentId: id,
 				parentMaterial: material,
 				path,
@@ -4438,16 +4751,24 @@ function buildTextLikeNode(state, node, id, path, material) {
 			return;
 		}
 		if (child.kind === "fragment") {
-			inlineChildren.push(...buildChildren(state, child.children, {
+			const childContext = contextForNode(child, {
+				...context,
 				parentId: id,
-				parentMaterial: [...material, `fragment:${keySegment(child.key, index)}`],
-				path: `${path} > fragment[${keySegment(child.key, index)}]`,
+				parentMaterial: material,
+				path,
 				inline: true
+			});
+			const segment = `fragment:${keySegment(child.key, index)}`;
+			inlineChildren.push(...buildChildren(state, child.children, {
+				...childContext,
+				parentMaterial: [...childContext.parentMaterial, segment],
+				path: `${childContext.path} > fragment[${keySegment(child.key, index)}]`
 			}));
 			return;
 		}
 		if (child.source.kind === "tag" && child.source.tag === "span") {
 			const built = buildNode(state, child, {
+				...context,
 				parentId: id,
 				parentMaterial: material,
 				path,
@@ -4459,7 +4780,7 @@ function buildTextLikeNode(state, node, id, path, material) {
 		addDiagnostic(state, invalidStructure(`${path} > ${sourceName(child)}[${index}]`, "block content cannot appear inside text", "Text-like elements accept primitive text and inline spans only."));
 	});
 	state.nodes.set(id, {
-		...semanticBase(state, node, id, "text", path, material),
+		...semanticBase(state, node, id, "text", path, material, context),
 		kind: "text",
 		inlineChildren
 	});
@@ -4488,13 +4809,14 @@ function collectInlineText(state, children, path) {
 	return text;
 }
 function buildNode(state, node, context, index) {
+	const nodeContext = contextForNode(node, context);
 	if (node.kind === "fragment") return;
-	if (node.kind === "text") return context.inline ? buildTextRunFromLeaf(state, node, context, index) : buildImplicitTextNode(state, node, context, index);
+	if (node.kind === "text") return nodeContext.inline ? buildTextRunFromLeaf(state, node, nodeContext, index) : buildImplicitTextNode(state, node, nodeContext, index);
 	const kind = nodeSemanticKind(node);
 	const segment = `${sourceName(node)}:${keySegment(node.key, index)}`;
-	const material = [...context.parentMaterial, segment];
+	const material = [...nodeContext.parentMaterial, segment];
 	const id = graphNodeId(material);
-	const path = `${context.path} > ${sourceName(node)}[${keySegment(node.key, index)}]`;
+	const path = `${nodeContext.path} > ${sourceName(node)}[${keySegment(node.key, index)}]`;
 	if (kind === "textRun") {
 		if (!context.inline) {
 			addDiagnostic(state, invalidStructure(path, "span cannot appear here", "span must be inside a text-like element.", ["Wrap the span in <p>...</p> or move it inside an existing text element."]));
@@ -4502,7 +4824,7 @@ function buildNode(state, node, context, index) {
 		}
 		const text = collectInlineText(state, node.children, path);
 		state.nodes.set(id, {
-			...semanticBase(state, node, id, "textRun", path, material),
+			...semanticBase(state, node, id, "textRun", path, material, nodeContext),
 			kind: "textRun",
 			text
 		});
@@ -4511,12 +4833,12 @@ function buildNode(state, node, context, index) {
 			kind: "textRun"
 		};
 	}
-	if (kind === "text") return buildTextLikeNode(state, node, id, path, material);
+	if (kind === "text") return buildTextLikeNode(state, node, id, path, material, nodeContext);
 	if (kind === "image") {
 		if (node.children.length > 0) addDiagnostic(state, invalidStructure(path, "image cannot have children", "Image nodes are leaf nodes."));
 		const assetRef = assetForImage(state, material, node.props, path);
 		state.nodes.set(id, {
-			...semanticBase(state, node, id, "image", path, material),
+			...semanticBase(state, node, id, "image", path, material, nodeContext),
 			kind: "image",
 			...assetRef ? { assetRef } : {}
 		});
@@ -4529,10 +4851,13 @@ function buildNode(state, node, context, index) {
 		parentId: id,
 		parentMaterial: material,
 		path,
-		inline: false
+		inline: false,
+		source: sourceFor(nodeContext),
+		slotOrigins: nodeContext.slotOrigins,
+		activeSlot: nodeContext.activeSlot
 	});
 	state.nodes.set(id, {
-		...semanticBase(state, node, id, kind, path, material),
+		...semanticBase(state, node, id, kind, path, material, nodeContext),
 		kind,
 		children: childIds
 	});
@@ -4541,6 +4866,25 @@ function buildNode(state, node, context, index) {
 		kind
 	};
 }
+function rootSource() {
+	return { kind: "root" };
+}
+function asComposedRoot(root, index) {
+	if (root.kind !== "element") throw new Error("Semantic graph roots must be element nodes.");
+	return {
+		root,
+		source: rootSource(),
+		sourceIdentityMaterial: ["source", "root"],
+		path: `document > slideFactory[${index}]`,
+		composition: {
+			slideIndex: index,
+			totalSlides: 0,
+			deckSlideIndex: index,
+			deckTotalSlides: 0
+		},
+		slotOrigins: /* @__PURE__ */ new WeakMap()
+	};
+}
 function buildSemanticAuthorGraph(roots) {
 	const documentId = graphNodeId(["document", "root"]);
 	const state = {
@@ -4549,20 +4893,33 @@ function buildSemanticAuthorGraph(roots) {
 		assets: /* @__PURE__ */ new Map(),
 		diagnostics: []
 	};
+	const slideIds = [];
+	roots.forEach((root, index) => {
+		const composed = "root" in root ? root : asComposedRoot(root, index);
+		const built = buildNode(state, composed.root, {
+			parentId: documentId,
+			parentMaterial: [
+				"document",
+				"root",
+				...composed.sourceIdentityMaterial
+			],
+			path: composed.path,
+			inline: false,
+			source: composed.source,
+			slotOrigins: composed.slotOrigins
+		}, composed.composition.slideIndex);
+		if (built) slideIds.push(built.id);
+	});
 	const documentNode = {
 		id: documentId,
 		kind: "document",
 		origin: {
 			kind: "implicit",
-			path: "document"
+			path: "document",
+			source: rootSource()
 		},
 		role: { kind: "document" },
-		children: buildChildren(state, roots, {
-			parentId: documentId,
-			parentMaterial: ["document", "root"],
-			path: "document",
-			inline: false
-		})
+		children: slideIds
 	};
 	state.nodes.set(documentId, documentNode);
 	const diagnostics = createDiagnostics(state.diagnostics);
@@ -15702,78 +16059,105 @@ async function outputPresentation(presentation, config) {
 }
 //#endregion
 //#region src/deck.ts
-function isSlideRoot(value) {
-	return value.kind === "element" && value.source.kind === "component" && value.source.component === "Slide";
-}
-function describeInvalidRoot(value) {
-	if (isLegacyAuthorNode(value)) return "Slide factory returned a legacy author node.";
-	if (isAuthorTreeNode(value)) return "Slide factory returned an author tree node that is not a <Slide /> root.";
-	if (value === null) return "Slide factory returned null.";
-	return `Slide factory returned ${typeof value}.`;
-}
-function invalidRootSourceSpan(value) {
-	return isAuthorTreeNode(value) ? value.sourceSpan : void 0;
-}
-function invalidRootDiagnostic(value, slideIndex) {
-	const path = `document > slideFactory[${slideIndex}]`;
-	return diagnostic({
-		severity: "error",
-		code: "E_COMPILE_ROOT",
-		title: "slide factory must return a <Slide /> root",
-		message: describeInvalidRoot(value),
-		labels: [{
-			path,
-			message: "Expected a deckjsx Author Tree <Slide /> node.",
-			...invalidRootSourceSpan(value) ? { sourceSpan: invalidRootSourceSpan(value) } : {}
-		}],
-		help: ["Return <Slide>...</Slide> from the slide factory passed to deck.add()."]
-	});
-}
+function hasMountedSources(entries) {
+	return entries.some((entry) => entry.kind === "mount");
+}
+function directSlideFactories(entries) {
+	return entries.flatMap((entry) => entry.kind === "slide" ? [entry.factory] : []);
+}
+function mountedSourceError() {
+	return /* @__PURE__ */ new Error("Mounted sources are supported by compile() only until the output pipeline supports graph composition.");
+}
+function compileSource(source, config = {}) {
+	const composition = resolveComposition(source);
+	if (composition.diagnostics.hasErrors) {
+		if (config.mode === "inspect") return { diagnostics: composition.diagnostics };
+		throw new CompositionDiagnosticError(composition.diagnostics);
+	}
+	const result = buildSemanticAuthorGraph(composition.roots ?? []);
+	if (config.mode === "inspect") return result;
+	if (result.diagnostics.hasErrors) throw new SemanticGraphDiagnosticError(result.diagnostics);
+	if (!result.graph) throw new SemanticGraphDiagnosticError(result.diagnostics);
+	return result.graph;
+}
+var BoundSource = class {
+	#source;
+	#sourceContext;
+	constructor(source, sourceContext) {
+		this.#source = source;
+		this.#sourceContext = sourceContext;
+	}
+	[COMPOSITION_SOURCE]() {
+		const source = this.#source[COMPOSITION_SOURCE]();
+		return {
+			entries: source.entries,
+			cycleId: source.cycleId,
+			boundContext: {
+				present: true,
+				value: this.#sourceContext
+			}
+		};
+	}
+	compile(config = {}) {
+		return compileSource(this, config);
+	}
+	render() {
+		const source = this.#source[COMPOSITION_SOURCE]();
+		if (hasMountedSources(source.entries)) throw mountedSourceError();
+		return renderPresentation(this.#source.options, directSlideFactories(source.entries).map((factory) => (input) => factory({
+			...input,
+			context: this.#sourceContext
+		})));
+	}
+	async output(config) {
+		await outputPresentation(this.render(), config);
+	}
+};
 var Deck = class {
 	#options;
-	#slides = [];
+	#entries = [];
+	withSource;
 	constructor(options) {
 		this.#options = options;
+		this.withSource = ((sourceContext) => new BoundSource(this, sourceContext));
+	}
+	get options() {
+		return this.#options;
+	}
+	[COMPOSITION_SOURCE]() {
+		return {
+			entries: this.#entries,
+			cycleId: this,
+			boundContext: { present: false }
+		};
 	}
 	add(slide) {
-		this.#slides.push(slide);
+		this.#entries.push({
+			kind: "slide",
+			factory: slide
+		});
+		return this;
+	}
+	mount(sourceKey, child, ...context) {
+		this.#entries.push({
+			kind: "mount",
+			sourceKey,
+			source: child,
+			...context.length > 0 ? { contextProvider: context[0] } : {},
+			...child instanceof BoundSource && context.length > 0 ? { invalidExtraContext: true } : {}
+		});
 		return this;
 	}
 	render() {
-		return renderPresentation(this.#options, this.#slides);
+		if (hasMountedSources(this.#entries)) throw mountedSourceError();
+		return renderPresentation(this.#options, directSlideFactories(this.#entries));
 	}
 	compile(config = {}) {
-		const roots = [];
-		const diagnostics = [];
-		this.#slides.forEach((factory, slideIndex) => {
-			const root = factory({
-				slideIndex,
-				totalSlides: this.#slides.length,
-				context: {
-					slideIndex,
-					totalSlides: this.#slides.length
-				}
-			});
-			if (!isAuthorTreeNode(root) || !isSlideRoot(root)) {
-				diagnostics.push(invalidRootDiagnostic(root, slideIndex));
-				return;
-			}
-			roots.push(root);
-		});
-		if (diagnostics.length > 0) {
-			const result = { diagnostics: createDiagnostics(diagnostics) };
-			if (config.mode === "inspect") return result;
-			throw new SemanticGraphDiagnosticError(result.diagnostics);
-		}
-		const result = buildSemanticAuthorGraph(roots);
-		if (config.mode === "inspect") return result;
-		if (result.diagnostics.hasErrors) throw new SemanticGraphDiagnosticError(result.diagnostics);
-		if (!result.graph) throw new SemanticGraphDiagnosticError(result.diagnostics);
-		return result.graph;
+		return compileSource(this, config);
 	}
 	async output(config) {
 		await outputPresentation(this.render(), config);
 	}
 };
 //#endregion
-export { Deck, DeckDiagnosticError, EMU_PER_INCH, Fragment, Image, POINTS_PER_INCH, SemanticGraphDiagnosticError, Shape, Slide, Text, View, createElement, formatDiagnostic, formatDiagnostics, isAuthorNode, isContentNode, isSlideNode, pptxgenjsBackend };
+export { CompositionDiagnosticError, Deck, DeckDiagnosticError, EMU_PER_INCH, Fragment, Image, POINTS_PER_INCH, SemanticGraphDiagnosticError, Shape, Slide, Text, View, createElement, formatDiagnostic, formatDiagnostics, isAuthorNode, isContentNode, isSlideNode, pptxgenjsBackend };

package/dist/jsx-dev-runtime.d.mts

@@ -1,4 +1,4 @@
-import { Mt as JsxKey, i as Fragment, jt as AuthorTreeNode, n as jsx, r as jsxs, t as JSX } from "./jsx-runtime-ru5t8S3z.mjs";
+import { _n as JsxKey, gn as AuthorTreeNode, i as Fragment, n as jsx, r as jsxs, t as JSX } from "./jsx-runtime-CJ9_d_0Q.mjs";
 
 //#region src/jsx-dev-runtime.d.ts
 declare function jsxDEV(type: unknown, props: unknown, key?: JsxKey, _isStaticChildren?: boolean, source?: unknown): AuthorTreeNode;

package/dist/{jsx-runtime-ru5t8S3z.d.mts → jsx-runtime-CJ9_d_0Q.d.mts}

@@ -44,6 +44,211 @@ type AuthorTextLeaf = {
 type AuthorTreeNode = AuthorElementNode | AuthorFragmentNode | AuthorTextLeaf;
 type AuthorTreeChild = AuthorTreeNode | string | number | boolean | null | undefined | readonly AuthorTreeChild[];
 //#endregion
+//#region src/diagnostics/errors.d.ts
+declare class DeckDiagnosticError extends Error {
+  readonly diagnostics: Diagnostics;
+  constructor(message: string, diagnostics: Diagnostics);
+}
+declare class SemanticGraphDiagnosticError extends DeckDiagnosticError {
+  constructor(diagnostics: Diagnostics);
+}
+declare class CompositionDiagnosticError extends DeckDiagnosticError {
+  constructor(diagnostics: Diagnostics);
+}
+//#endregion
+//#region src/diagnostics/format.d.ts
+declare function formatDiagnostic(diagnostic: Diagnostic): string;
+declare function formatDiagnostics(diagnostics: Diagnostics): string;
+//#endregion
+//#region src/diagnostics/index.d.ts
+type DiagnosticSeverity = "error" | "warning";
+type DiagnosticLabel = {
+  readonly message: string;
+  readonly path: string;
+  readonly sourceSpan?: SourceSpan;
+  readonly severity?: "primary" | "secondary";
+};
+type Diagnostic = {
+  readonly severity: DiagnosticSeverity;
+  readonly code: string;
+  readonly title: string;
+  readonly message?: string;
+  readonly labels: readonly DiagnosticLabel[];
+  readonly notes?: readonly string[];
+  readonly help?: readonly string[];
+};
+type Diagnostics = {
+  readonly items: readonly Diagnostic[];
+  readonly hasErrors: boolean;
+  readonly hasWarnings: boolean;
+};
+//#endregion
+//#region src/graph/types.d.ts
+type Brand<T, B extends string> = T & {
+  readonly __brand: B;
+};
+type GraphNodeId = Brand<string, "GraphNodeId">;
+type StyleEntityId = Brand<string, "StyleEntityId">;
+type AssetEntityId = Brand<string, "AssetEntityId">;
+type SourceIdentity = Brand<string, "SourceIdentity">;
+type SemanticNodeKind = "container" | "document" | "image" | "shape" | "slide" | "text" | "textRun";
+type SemanticRole = {
+  readonly kind: "document";
+} | {
+  readonly kind: "slide";
+} | {
+  readonly kind: "genericContainer";
+} | {
+  readonly kind: "sectioning";
+  readonly tag: SectioningTag;
+} | {
+  readonly kind: "figure";
+} | {
+  readonly kind: "paragraph";
+} | {
+  readonly kind: "heading";
+  readonly level: 1 | 2 | 3 | 4 | 5 | 6;
+} | {
+  readonly kind: "image";
+} | {
+  readonly kind: "shape";
+};
+type SourceOrigin = {
+  readonly kind: "root";
+} | {
+  readonly kind: "mounted";
+  readonly sourceKey: string;
+  readonly sourceIdentity: SourceIdentity;
+};
+type SemanticOrigin = {
+  readonly kind: "authored" | "implicit";
+  readonly path: string;
+  readonly source?: SourceOrigin;
+  readonly sourceSpan?: SourceSpan;
+  readonly reason?: "primitive-text-in-container";
+};
+type BaseSemanticNode = {
+  readonly id: GraphNodeId;
+  readonly kind: SemanticNodeKind;
+  readonly origin: SemanticOrigin;
+  readonly authoredTag?: AuthoredTag;
+  readonly authoredComponent?: AuthoredComponent;
+  readonly role?: SemanticRole;
+  readonly key?: JsxKey;
+  readonly styleRef?: StyleEntityId;
+};
+type SemanticDocumentNode = BaseSemanticNode & {
+  readonly kind: "document";
+  readonly children: readonly GraphNodeId[];
+};
+type SemanticSlideNode = BaseSemanticNode & {
+  readonly kind: "slide";
+  readonly name?: string;
+  readonly children: readonly GraphNodeId[];
+};
+type SemanticContainerNode = BaseSemanticNode & {
+  readonly kind: "container";
+  readonly children: readonly GraphNodeId[];
+};
+type SemanticTextNode = BaseSemanticNode & {
+  readonly kind: "text";
+  readonly inlineChildren: readonly GraphNodeId[];
+  readonly implicit?: boolean;
+};
+type SemanticTextRunNode = BaseSemanticNode & {
+  readonly kind: "textRun";
+  readonly text: string;
+};
+type SemanticImageNode = BaseSemanticNode & {
+  readonly kind: "image";
+  readonly assetRef?: AssetEntityId;
+};
+type SemanticShapeNode = BaseSemanticNode & {
+  readonly kind: "shape";
+};
+type SemanticNode = SemanticContainerNode | SemanticDocumentNode | SemanticImageNode | SemanticShapeNode | SemanticSlideNode | SemanticTextNode | SemanticTextRunNode;
+type StyleClassRef = {
+  readonly name: string;
+  readonly index: number;
+};
+type StyleEntity = {
+  readonly id: StyleEntityId;
+  readonly target: SemanticNodeKind;
+  readonly authored: {
+    readonly style?: unknown;
+    readonly direct?: unknown;
+    readonly classRefs?: readonly StyleClassRef[];
+  };
+};
+type AssetEntity = {
+  readonly id: AssetEntityId;
+  readonly kind: "image";
+  readonly source: {
+    readonly kind: "path";
+    readonly path: string;
+  } | {
+    readonly kind: "data";
+    readonly data: string;
+  };
+  readonly metadata: {
+    readonly mediaType?: string;
+    readonly byteLength?: number;
+    readonly widthPx?: number;
+    readonly heightPx?: number;
+    readonly contentHash?: string;
+  };
+  readonly resolution: "failed" | "resolved" | "unresolved";
+};
+type SemanticAuthorGraph = {
+  readonly documentId: GraphNodeId;
+  readonly nodes: ReadonlyMap<GraphNodeId, SemanticNode>;
+  readonly styles: ReadonlyMap<StyleEntityId, StyleEntity>;
+  readonly assets: ReadonlyMap<AssetEntityId, AssetEntity>;
+};
+//#endregion
+//#region src/composition/types.d.ts
+declare const COMPOSITION_SOURCE: unique symbol;
+type CompositionContext = {
+  readonly sourceKey?: string;
+  readonly slideIndex: number;
+  readonly totalSlides: number;
+  readonly deckSlideIndex: number;
+  readonly deckTotalSlides: number;
+};
+type SlideFactoryInput<TSourceContext = void> = [TSourceContext] extends [void] ? {
+  readonly composition: CompositionContext;
+} : {
+  readonly context: TSourceContext;
+  readonly composition: CompositionContext;
+};
+type SlideFactory<TSourceContext = void> = (input: SlideFactoryInput<TSourceContext>) => JsxNode;
+type SourceContextMapper<TParentContext, TChildContext> = [TParentContext] extends [void] ? () => TChildContext : (context: TParentContext) => TChildContext;
+type SourceContextInput<TParentContext, TChildContext> = TChildContext | SourceContextMapper<TParentContext, TChildContext>;
+type SourceContextBinding<TSourceContext = unknown> = {
+  readonly present: false;
+} | {
+  readonly present: true;
+  readonly value: TSourceContext;
+};
+type CompositionEntry<TSourceContext = unknown> = {
+  readonly kind: "slide";
+  readonly factory: SlideFactory<TSourceContext>;
+} | {
+  readonly kind: "mount";
+  readonly sourceKey: string;
+  readonly source: CompositionSource<unknown>;
+  readonly contextProvider?: SourceContextInput<TSourceContext, unknown>;
+  readonly invalidExtraContext?: boolean;
+};
+type CompositionSourceInternals<TSourceContext = unknown> = {
+  readonly entries: readonly CompositionEntry<TSourceContext>[];
+  readonly cycleId: object;
+  readonly boundContext: SourceContextBinding<TSourceContext>;
+};
+type CompositionSource<TSourceContext = unknown> = {
+  readonly [COMPOSITION_SOURCE]: () => CompositionSourceInternals<TSourceContext>;
+};
+//#endregion
 //#region src/authoring/index.d.ts
 type DeckLength = number | `${number}${"in" | "pt" | "px" | "%" | "em" | "rem" | "vh" | "vw" | "ch"}`;
 type DeckPointLength = number | `${number}${"pt" | "in" | "px" | "em" | "rem" | "vh" | "vw" | "ch"}`;
@@ -104,6 +309,12 @@ interface ViewIntrinsicJsxChildArray extends ReadonlyArray<ViewIntrinsicJsxChild
 type ViewIntrinsicJsxChild = ContentJsxChild | string | number | ViewIntrinsicJsxChildArray;
 interface JsxNodeArray extends ReadonlyArray<JsxNode> {}
 type JsxNode = AuthorNode | AuthorTreeNode | string | number | boolean | null | undefined | JsxNodeArray;
+interface ClassNameValueArray extends ReadonlyArray<ClassNameValue> {}
+type ClassNameObject = Readonly<Record<string, boolean | null | undefined>>;
+type ClassNameValue = string | false | null | undefined | ClassNameValueArray | ClassNameObject;
+type ClassNameAuthorProps = {
+  className?: ClassNameValue;
+};
 type BaseAuthorProps = {
   opacity?: number;
   rotation?: number;
@@ -319,21 +530,13 @@ type DeckOptions = {
     subject?: string;
   };
 };
-type SlideContext = {
-  slideIndex: number;
-  totalSlides: number;
-  context?: {
-    slideIndex: number;
-    totalSlides: number;
-  };
-};
-type SlideFactory = (context: SlideContext) => JsxNode;
 type OutputConfig = {
   backend: ImplementedBackendName;
   output: string;
 };
 type SlideNodeProps = {
   name?: string;
+  className?: ClassNameValue;
   style?: SlideStyle;
   background?: string;
   backgroundImage?: string;
@@ -350,19 +553,19 @@ type SlideProps = SlideNodeProps & {
 };
 type ViewNodeProps = {
   style?: ViewStyle;
-} & ViewStyle;
+} & ClassNameAuthorProps & ViewStyle;
 type ViewProps = ViewNodeProps & {
   children?: ContentJsxChild;
 };
 type TextNodeProps = {
   style?: TextStyle;
-} & TextStyle;
+} & ClassNameAuthorProps & TextStyle;
 type TextProps = TextNodeProps & {
   children?: TextJsxChild;
 };
 type ImageNodeProps = {
   style?: ImageStyle;
-} & ImageStyle & ({
+} & ClassNameAuthorProps & ImageStyle & ({
   src: string;
   data?: string;
 } | {
@@ -375,7 +578,7 @@ type ImageProps = ImageNodeProps & {
 type ShapeNodeProps = {
   style?: ShapeStyle;
   shape: "rect" | "ellipse" | "line";
-} & ShapeStyle;
+} & ClassNameAuthorProps & ShapeStyle;
 type ShapeProps = ShapeNodeProps & {
   children?: never;
 };
@@ -485,4 +688,4 @@ declare namespace JSX {
   }
 }
 //#endregion
-export { ImageStyle as $, CssFlexDirection as A, ViewStyle as At, CssJustifyContent as B, CssAlignContent as C, TextProps as Ct, CssBoxSizing as D, TextTabStopLength as Dt, CssAspectRatio as E, TextTabStopAuthoring as Et, CssGridShorthand as F, AuthoredTag as Ft, CssVisibility as G, CssObjectPosition as H, CssGridTemplate as I, SectioningTag as It, DeckOptions as J, DeckJsxIntrinsicElements as K, CssGridTemplateAreas as L, CssGridAutoFlow as M, JsxKey as Mt, CssGridLine as N, SourceSpan as Nt, CssDisplay as O, VerticalAlign as Ot, CssGridPlacement as P, AuthoredComponent as Pt, ImageProps as Q, CssGridTemplateShorthand as R, ContentJsxChild as S, TextJsxChild as St, CssAlignSelf as T, TextTabStopAlignment as Tt, CssOverflow as U, CssJustifySelf as V, CssPosition as W, ImageCropAuthoring as X, DeckPointLength as Y, ImageCropValue as Z, AuthorNodeProps as _, StackAxis as _t, createElement as a, IntrinsicViewTag as at, BorderStyle as b, StrokeLineJoin as bt, isSlideNode as c, OutputConfig as ct, Slide as d, SlideContext as dt, ImplementedBackendName as et, Text as f, SlideFactory as ft, AuthorNodeMap as g, StackAlignment as gt, AuthorNodeKind as h, Spacing as ht, Fragment as i, IntrinsicTextTag as it, CssFlexWrap as j, AuthorTreeNode as jt, CssFlexBasis as k, ViewProps as kt, Image as l, ShapeProps as lt, AuthorNode as m, SlideStyle as mt, jsx as n, IntrinsicImgProps as nt, isAuthorNode as o, JsxNode as ot, View as p, SlideProps as pt, DeckLength as q, jsxs as r, IntrinsicPProps as rt, isContentNode as s, LayoutMode as st, JSX as t, IntrinsicDivProps as tt, Shape as u, ShapeStyle as ut, AuthorNodePropsMap as v, StrokeDashType as vt, CssAlignItems as w, TextStyle as wt, ContentAuthorNode as x, TextFit as xt, BackendName as y, StrokeLineCap as yt, CssGridTrack as z };
+export { ImageCropAuthoring as $, SemanticSlideNode as $t, CssBoxSizing as A, ViewProps as At, CssGridTemplateAreas as B, AssetEntity as Bt, ClassNameValueArray as C, TextJsxChild as Ct, CssAlignItems as D, TextTabStopAuthoring as Dt, CssAlignContent as E, TextTabStopAlignment as Et, CssGridAutoFlow as F, CompositionSourceInternals as Ft, CssObjectPosition as G, SemanticContainerNode as Gt, CssGridTrack as H, BaseSemanticNode as Ht, CssGridLine as I, SlideFactory as It, CssVisibility as J, SemanticNode as Jt, CssOverflow as K, SemanticDocumentNode as Kt, CssGridPlacement as L, SlideFactoryInput as Lt, CssFlexBasis as M, COMPOSITION_SOURCE as Mt, CssFlexDirection as N, CompositionContext as Nt, CssAlignSelf as O, TextTabStopLength as Ot, CssFlexWrap as P, CompositionSource as Pt, DeckPointLength as Q, SemanticShapeNode as Qt, CssGridShorthand as R, SourceContextInput as Rt, ClassNameValue as S, TextFit as St, ContentJsxChild as T, TextStyle as Tt, CssJustifyContent as U, GraphNodeId as Ut, CssGridTemplateShorthand as V, AssetEntityId as Vt, CssJustifySelf as W, SemanticAuthorGraph as Wt, DeckLength as X, SemanticOrigin as Xt, DeckJsxIntrinsicElements as Y, SemanticNodeKind as Yt, DeckOptions as Z, SemanticRole as Zt, AuthorNodeProps as _, JsxKey as _n, StackAlignment as _t, createElement as a, StyleEntity as an, IntrinsicImgProps as at, BorderStyle as b, StrokeLineCap as bt, isSlideNode as c, DiagnosticLabel as cn, IntrinsicViewTag as ct, Slide as d, formatDiagnostic as dn, OutputConfig as dt, SemanticTextNode as en, ImageCropValue as et, Text as f, formatDiagnostics as fn, ShapeProps as ft, AuthorNodeMap as g, AuthorTreeNode as gn, Spacing as gt, AuthorNodeKind as h, SemanticGraphDiagnosticError as hn, SlideStyle as ht, Fragment as i, StyleClassRef as in, IntrinsicDivProps as it, CssDisplay as j, ViewStyle as jt, CssAspectRatio as k, VerticalAlign as kt, Image as l, DiagnosticSeverity as ln, JsxNode as lt, AuthorNode as m, DeckDiagnosticError as mn, SlideProps as mt, jsx as n, SourceIdentity as nn, ImageStyle as nt, isAuthorNode as o, StyleEntityId as on, IntrinsicPProps as ot, View as p, CompositionDiagnosticError as pn, ShapeStyle as pt, CssPosition as q, SemanticImageNode as qt, jsxs as r, SourceOrigin as rn, ImplementedBackendName as rt, isContentNode as s, Diagnostic as sn, IntrinsicTextTag as st, JSX as t, SemanticTextRunNode as tn, ImageProps as tt, Shape as u, Diagnostics as un, LayoutMode as ut, AuthorNodePropsMap as v, SourceSpan as vn, StackAxis as vt, ContentAuthorNode as w, TextProps as wt, ClassNameObject as x, StrokeLineJoin as xt, BackendName as y, StrokeDashType as yt, CssGridTemplate as z, SourceContextMapper as zt };

package/dist/jsx-runtime.d.mts

@@ -1,2 +1,2 @@
-import { Mt as JsxKey, i as Fragment, n as jsx, r as jsxs, t as JSX } from "./jsx-runtime-ru5t8S3z.mjs";
+import { _n as JsxKey, i as Fragment, n as jsx, r as jsxs, t as JSX } from "./jsx-runtime-CJ9_d_0Q.mjs";
 export { Fragment, JSX, JsxKey, jsx, jsxs };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "deckjsx",
-  "version": "0.2.1",
+  "version": "0.3.1",
   "description": "Generate PowerPoint presentations from TSX/JSX through a compiler pipeline.",
   "license": "MIT",
   "author": "deckjsx contributors",