@webiny/website-builder-sdk 0.0.0-unstable.7be00a75a9 → 0.0.0-unstable.7c2def32a7

package/image/geometry.test.js

@@ -0,0 +1,190 @@
+import { describe, expect, it } from "vitest";
+import { getCropRect, getImageRenderData, getVisibleRect, resolveAssetImage } from "./geometry.js";
+const geometry_test_image = (overrides)=>({
+        width: 1000,
+        height: 1000,
+        ...overrides
+    });
+describe("resolveAssetImage", ()=>{
+    it("prefers the override per property, falling back to the asset default", ()=>{
+        const assetDefault = {
+            crop: {
+                top: 0.1,
+                left: 0.1,
+                bottom: 0.1,
+                right: 0.1
+            },
+            focalPoint: {
+                x: 0.2,
+                y: 0.2
+            },
+            alt: "default alt",
+            caption: "default caption"
+        };
+        const override = {
+            focalPoint: {
+                x: 0.8,
+                y: 0.8
+            },
+            alt: "override alt"
+        };
+        const result = resolveAssetImage(override, assetDefault);
+        expect(result.crop).toEqual(assetDefault.crop);
+        expect(result.caption).toBe("default caption");
+        expect(result.focalPoint).toEqual(override.focalPoint);
+        expect(result.alt).toBe("override alt");
+    });
+    it("handles null/undefined inputs", ()=>{
+        expect(resolveAssetImage(null, null)).toEqual({
+            crop: void 0,
+            focalPoint: void 0,
+            alt: void 0,
+            caption: void 0
+        });
+    });
+});
+describe("getCropRect", ()=>{
+    it("returns the full image when no crop is set", ()=>{
+        expect(getCropRect()).toEqual({
+            x: 0,
+            y: 0,
+            width: 1,
+            height: 1
+        });
+    });
+    it("converts edge insets into a rectangle", ()=>{
+        const rect = getCropRect({
+            top: 0.1,
+            left: 0.2,
+            bottom: 0.3,
+            right: 0.05
+        });
+        expect(rect.x).toBeCloseTo(0.2, 10);
+        expect(rect.y).toBeCloseTo(0.1, 10);
+        expect(rect.width).toBeCloseTo(0.75, 10);
+        expect(rect.height).toBeCloseTo(0.6, 10);
+    });
+    it("does not produce negative dimensions when insets overlap", ()=>{
+        const rect = getCropRect({
+            top: 0.7,
+            left: 0.7,
+            bottom: 0.7,
+            right: 0.7
+        });
+        expect(rect.width).toBe(0);
+        expect(rect.height).toBe(0);
+    });
+    it("clamps out-of-range values", ()=>{
+        const rect = getCropRect({
+            top: -1,
+            left: 2,
+            bottom: 0,
+            right: 0
+        });
+        expect(rect.x).toBe(1);
+        expect(rect.y).toBe(0);
+    });
+});
+describe("getVisibleRect", ()=>{
+    it("returns the crop rect when no aspect ratio is requested", ()=>{
+        const rect = getVisibleRect(geometry_test_image({
+            crop: {
+                top: 0.1,
+                left: 0.1,
+                bottom: 0.1,
+                right: 0.1
+            }
+        }));
+        expect(rect).toEqual({
+            x: 0.1,
+            y: 0.1,
+            width: 0.8,
+            height: 0.8
+        });
+    });
+    it("fits a 16:9 rect inside a square image, centered by default", ()=>{
+        const rect = getVisibleRect(geometry_test_image(), 16 / 9);
+        expect(rect.width).toBeCloseTo(1, 5);
+        expect(rect.height).toBeCloseTo(0.5625, 5);
+        expect(rect.y).toBeCloseTo(0.21875, 5);
+        expect(rect.x).toBeCloseTo(0, 5);
+    });
+    it("shifts the visible rect toward the focal point and clamps to bounds", ()=>{
+        const rect = getVisibleRect(geometry_test_image({
+            focalPoint: {
+                x: 0.5,
+                y: 0.05
+            }
+        }), 16 / 9);
+        expect(rect.y).toBeCloseTo(0, 5);
+    });
+    it("keeps the visible rect within the crop rectangle", ()=>{
+        const rect = getVisibleRect(geometry_test_image({
+            crop: {
+                top: 0.25,
+                left: 0,
+                bottom: 0.25,
+                right: 0
+            },
+            focalPoint: {
+                x: 0.5,
+                y: 0.9
+            }
+        }), 1);
+        expect(rect.y).toBeGreaterThanOrEqual(0.25 - 1e-9);
+        expect(rect.y + rect.height).toBeLessThanOrEqual(0.75 + 1e-9);
+    });
+    it("accepts an explicit width/height aspect ratio", ()=>{
+        const byObject = getVisibleRect(geometry_test_image(), {
+            width: 16,
+            height: 9
+        });
+        const byNumber = getVisibleRect(geometry_test_image(), 16 / 9);
+        expect(byObject).toEqual(byNumber);
+    });
+});
+describe("getImageRenderData", ()=>{
+    it("derives objectPosition from the focal point", ()=>{
+        const data = getImageRenderData(geometry_test_image({
+            focalPoint: {
+                x: 0.25,
+                y: 0.75
+            }
+        }), 1);
+        expect(data.objectPosition).toBe("25% 75%");
+    });
+    it("produces an overflow-hidden container with the requested aspect ratio", ()=>{
+        const data = getImageRenderData(geometry_test_image(), 16 / 9);
+        expect(data.container.overflow).toBe("hidden");
+        expect(data.container.aspectRatio).toBe(`${Math.round(16 / 9 * 1000) / 1000}`);
+    });
+    it("scales and offsets the image so the visible rect fills the container", ()=>{
+        const data = getImageRenderData(geometry_test_image(), 16 / 9);
+        expect(data.image.width).toBe("100%");
+        expect(data.image.height).toBe(`${Math.round(100 / 0.5625 * 1000) / 1000}%`);
+        expect(parseFloat(data.image.left)).toBe(0);
+        expect(parseFloat(data.image.top)).toBeLessThan(0);
+    });
+    it("stays finite for a degenerate (collapsed) crop", ()=>{
+        const data = getImageRenderData(geometry_test_image({
+            crop: {
+                top: 0.7,
+                left: 0.7,
+                bottom: 0.7,
+                right: 0.7
+            }
+        }), 1);
+        expect(Number.isFinite(parseFloat(data.image.width))).toBe(true);
+        expect(Number.isFinite(parseFloat(data.image.height))).toBe(true);
+    });
+    it("passes through intrinsic dimensions", ()=>{
+        const data = getImageRenderData(geometry_test_image({
+            width: 1920,
+            height: 1080
+        }), 16 / 9);
+        expect(data.intrinsicWidth).toBe(1920);
+        expect(data.intrinsicHeight).toBe(1080);
+    });
+});
+
+//# sourceMappingURL=geometry.test.js.map

package/image/geometry.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image/geometry.test.js","sources":["../../src/image/geometry.test.ts"],"sourcesContent":["import { describe, it, expect } from \"vitest\";\nimport { getCropRect, getImageRenderData, getVisibleRect, resolveAssetImage } from \"./geometry.js\";\nimport type { AssetImage } from \"@webiny/sdk\";\n\nconst image = (overrides?: Partial<AssetImage>): AssetImage => ({\n    width: 1000,\n    height: 1000,\n    ...overrides\n});\n\ndescribe(\"resolveAssetImage\", () => {\n    it(\"prefers the override per property, falling back to the asset default\", () => {\n        const assetDefault: AssetImage = {\n            crop: { top: 0.1, left: 0.1, bottom: 0.1, right: 0.1 },\n            focalPoint: { x: 0.2, y: 0.2 },\n            alt: \"default alt\",\n            caption: \"default caption\"\n        };\n        const override: AssetImage = {\n            focalPoint: { x: 0.8, y: 0.8 },\n            alt: \"override alt\"\n        };\n\n        const result = resolveAssetImage(override, assetDefault);\n\n        expect(result.crop).toEqual(assetDefault.crop);\n        expect(result.caption).toBe(\"default caption\");\n        expect(result.focalPoint).toEqual(override.focalPoint);\n        expect(result.alt).toBe(\"override alt\");\n    });\n\n    it(\"handles null/undefined inputs\", () => {\n        expect(resolveAssetImage(null, null)).toEqual({\n            crop: undefined,\n            focalPoint: undefined,\n            alt: undefined,\n            caption: undefined\n        });\n    });\n});\n\ndescribe(\"getCropRect\", () => {\n    it(\"returns the full image when no crop is set\", () => {\n        expect(getCropRect()).toEqual({ x: 0, y: 0, width: 1, height: 1 });\n    });\n\n    it(\"converts edge insets into a rectangle\", () => {\n        const rect = getCropRect({ top: 0.1, left: 0.2, bottom: 0.3, right: 0.05 });\n        expect(rect.x).toBeCloseTo(0.2, 10);\n        expect(rect.y).toBeCloseTo(0.1, 10);\n        expect(rect.width).toBeCloseTo(0.75, 10);\n        expect(rect.height).toBeCloseTo(0.6, 10);\n    });\n\n    it(\"does not produce negative dimensions when insets overlap\", () => {\n        const rect = getCropRect({ top: 0.7, left: 0.7, bottom: 0.7, right: 0.7 });\n        expect(rect.width).toBe(0);\n        expect(rect.height).toBe(0);\n    });\n\n    it(\"clamps out-of-range values\", () => {\n        const rect = getCropRect({ top: -1, left: 2, bottom: 0, right: 0 });\n        expect(rect.x).toBe(1);\n        expect(rect.y).toBe(0);\n    });\n});\n\ndescribe(\"getVisibleRect\", () => {\n    it(\"returns the crop rect when no aspect ratio is requested\", () => {\n        const rect = getVisibleRect(\n            image({ crop: { top: 0.1, left: 0.1, bottom: 0.1, right: 0.1 } })\n        );\n        expect(rect).toEqual({ x: 0.1, y: 0.1, width: 0.8, height: 0.8 });\n    });\n\n    it(\"fits a 16:9 rect inside a square image, centered by default\", () => {\n        const rect = getVisibleRect(image(), 16 / 9);\n        expect(rect.width).toBeCloseTo(1, 5);\n        expect(rect.height).toBeCloseTo(0.5625, 5);\n        expect(rect.y).toBeCloseTo((1 - 0.5625) / 2, 5);\n        expect(rect.x).toBeCloseTo(0, 5);\n    });\n\n    it(\"shifts the visible rect toward the focal point and clamps to bounds\", () => {\n        const rect = getVisibleRect(image({ focalPoint: { x: 0.5, y: 0.05 } }), 16 / 9);\n        expect(rect.y).toBeCloseTo(0, 5);\n    });\n\n    it(\"keeps the visible rect within the crop rectangle\", () => {\n        const rect = getVisibleRect(\n            image({\n                crop: { top: 0.25, left: 0, bottom: 0.25, right: 0 },\n                focalPoint: { x: 0.5, y: 0.9 }\n            }),\n            1\n        );\n        expect(rect.y).toBeGreaterThanOrEqual(0.25 - 1e-9);\n        expect(rect.y + rect.height).toBeLessThanOrEqual(0.75 + 1e-9);\n    });\n\n    it(\"accepts an explicit width/height aspect ratio\", () => {\n        const byObject = getVisibleRect(image(), { width: 16, height: 9 });\n        const byNumber = getVisibleRect(image(), 16 / 9);\n        expect(byObject).toEqual(byNumber);\n    });\n});\n\ndescribe(\"getImageRenderData\", () => {\n    it(\"derives objectPosition from the focal point\", () => {\n        const data = getImageRenderData(image({ focalPoint: { x: 0.25, y: 0.75 } }), 1);\n        expect(data.objectPosition).toBe(\"25% 75%\");\n    });\n\n    it(\"produces an overflow-hidden container with the requested aspect ratio\", () => {\n        const data = getImageRenderData(image(), 16 / 9);\n        expect(data.container.overflow).toBe(\"hidden\");\n        expect(data.container.aspectRatio).toBe(`${Math.round((16 / 9) * 1000) / 1000}`);\n    });\n\n    it(\"scales and offsets the image so the visible rect fills the container\", () => {\n        const data = getImageRenderData(image(), 16 / 9);\n        expect(data.image.width).toBe(\"100%\");\n        expect(data.image.height).toBe(`${Math.round((100 / 0.5625) * 1000) / 1000}%`);\n        expect(parseFloat(data.image.left)).toBe(0);\n        expect(parseFloat(data.image.top)).toBeLessThan(0);\n    });\n\n    it(\"stays finite for a degenerate (collapsed) crop\", () => {\n        const data = getImageRenderData(\n            image({ crop: { top: 0.7, left: 0.7, bottom: 0.7, right: 0.7 } }),\n            1\n        );\n        expect(Number.isFinite(parseFloat(data.image.width))).toBe(true);\n        expect(Number.isFinite(parseFloat(data.image.height))).toBe(true);\n    });\n\n    it(\"passes through intrinsic dimensions\", () => {\n        const data = getImageRenderData(image({ width: 1920, height: 1080 }), 16 / 9);\n        expect(data.intrinsicWidth).toBe(1920);\n        expect(data.intrinsicHeight).toBe(1080);\n    });\n});\n"],"names":["image","overrides","describe","it","assetDefault","override","result","resolveAssetImage","expect","undefined","getCropRect","rect","getVisibleRect","byObject","byNumber","data","getImageRenderData","Math","parseFloat","Number"],"mappings":"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"}

package/image/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./types.js";
+export * from "./presets.js";
+export * from "./geometry.js";

package/image/index.js

@@ -0,0 +1,3 @@
+export * from "./types.js";
+export * from "./presets.js";
+export * from "./geometry.js";

package/image/presets.d.ts

@@ -0,0 +1,6 @@
+import type { AspectRatioPreset } from "./types.js";
+/**
+ * Default aspect ratios shown in the image editor's preview strip.
+ * A later phase will let a field lock to one of these (or a custom ratio).
+ */
+export declare const ASPECT_RATIO_PRESETS: AspectRatioPreset[];

package/image/presets.js

@@ -0,0 +1,20 @@
+const ASPECT_RATIO_PRESETS = [
+    {
+        id: "square",
+        label: "Square",
+        ratio: 1
+    },
+    {
+        id: "4:3",
+        label: "4:3",
+        ratio: 4 / 3
+    },
+    {
+        id: "16:9",
+        label: "16:9",
+        ratio: 16 / 9
+    }
+];
+export { ASPECT_RATIO_PRESETS };
+
+//# sourceMappingURL=presets.js.map

package/image/presets.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image/presets.js","sources":["../../src/image/presets.ts"],"sourcesContent":["import type { AspectRatioPreset } from \"./types.js\";\n\n/**\n * Default aspect ratios shown in the image editor's preview strip.\n * A later phase will let a field lock to one of these (or a custom ratio).\n */\nexport const ASPECT_RATIO_PRESETS: AspectRatioPreset[] = [\n    { id: \"square\", label: \"Square\", ratio: 1 },\n    { id: \"4:3\", label: \"4:3\", ratio: 4 / 3 },\n    { id: \"16:9\", label: \"16:9\", ratio: 16 / 9 }\n];\n"],"names":["ASPECT_RATIO_PRESETS"],"mappings":"AAMO,MAAMA,uBAA4C;IACrD;QAAE,IAAI;QAAU,OAAO;QAAU,OAAO;IAAE;IAC1C;QAAE,IAAI;QAAO,OAAO;QAAO,OAAO,IAAI;IAAE;IACxC;QAAE,IAAI;QAAQ,OAAO;QAAQ,OAAO,KAAK;IAAE;CAC9C"}

package/image/types.d.ts

@@ -0,0 +1,10 @@
+export type { AssetCrop, AssetFocalPoint } from "@webiny/sdk";
+export type AspectRatioInput = number | {
+    width: number;
+    height: number;
+};
+export interface AspectRatioPreset {
+    id: string;
+    label: string;
+    ratio: number;
+}

package/index.d.ts

@@ -3,17 +3,27 @@ export * from "./EditingSdk.js";
 export * from "./LiveSdk.js";
 export * from "./NullSdk.js";
 export * from "./ContentSdk.js";
+export * from "./createContentClient.js";
 export * from "./Environment.js";
 export * from "./DocumentStore.js";
 export * from "./Logger.js";
 export * from "./FunctionConverter.js";
 export * from "./createInput.js";
+export * from "./contentEntry/resolveContentEntry.js";
+export * from "./contentEntry/ContentEntryCache.js";
+export * from "./contentEntry/ContentEntryBindingsResolver.js";
+export * from "./createComponent.js";
+export * from "./image/index.js";
+export * from "./asset/index.js";
 export * from "./MouseTracker.js";
 export * from "./ViewportManager.js";
 export * from "./messenger/Messenger.js";
 export * from "./messenger/MessageOrigin.js";
 export type * from "./types.js";
 export * from "./DocumentStoreManager.js";
+export * from "./ComponentRegistry.js";
+export * from "./componentLoader/index.js";
+export * from "./dataProviders/ApiClient.js";
 export * from "./BindingsProcessor.js";
 export * from "./ResizeObserver.js";
 export * from "./BindingsResolver.js";
@@ -21,6 +31,7 @@ export * from "./createElement.js";
 export * from "./registerComponentGroup.js";
 export * from "./jsonPatch.js";
 export * from "./headersProvider.js";
+export * from "./experiments/index.js";
 export * from "./ComponentManifestToAstConverter.js";
 export * from "./findMatchingAstNode.js";
 export * from "./InheritanceProcessor.js";
@@ -28,4 +39,5 @@ export * from "./InputBindingsProcessor.js";
 export * from "./StylesBindingsProcessor.js";
 export * from "./ElementFactory.js";
 export * from "./ConstraintEvaluator.js";
+export * from "./generateElementId.js";
 export { StyleSettings } from "./constants.js";

package/index.js

@@ -3,16 +3,26 @@ export * from "./EditingSdk.js";
 export * from "./LiveSdk.js";
 export * from "./NullSdk.js";
 export * from "./ContentSdk.js";
+export * from "./createContentClient.js";
 export * from "./Environment.js";
 export * from "./DocumentStore.js";
 export * from "./Logger.js";
 export * from "./FunctionConverter.js";
 export * from "./createInput.js";
+export * from "./contentEntry/resolveContentEntry.js";
+export * from "./contentEntry/ContentEntryCache.js";
+export * from "./contentEntry/ContentEntryBindingsResolver.js";
+export * from "./createComponent.js";
+export * from "./image/index.js";
+export * from "./asset/index.js";
 export * from "./MouseTracker.js";
 export * from "./ViewportManager.js";
 export * from "./messenger/Messenger.js";
 export * from "./messenger/MessageOrigin.js";
 export * from "./DocumentStoreManager.js";
+export * from "./ComponentRegistry.js";
+export * from "./componentLoader/index.js";
+export * from "./dataProviders/ApiClient.js";
 export * from "./BindingsProcessor.js";
 export * from "./ResizeObserver.js";
 export * from "./BindingsResolver.js";
@@ -20,6 +30,7 @@ export * from "./createElement.js";
 export * from "./registerComponentGroup.js";
 export * from "./jsonPatch.js";
 export * from "./headersProvider.js";
+export * from "./experiments/index.js";
 export * from "./ComponentManifestToAstConverter.js";
 export * from "./findMatchingAstNode.js";
 export * from "./InheritanceProcessor.js";
@@ -27,4 +38,5 @@ export * from "./InputBindingsProcessor.js";
 export * from "./StylesBindingsProcessor.js";
 export * from "./ElementFactory.js";
 export * from "./ConstraintEvaluator.js";
+export * from "./generateElementId.js";
 export { StyleSettings } from "./constants.js";

package/jsonPatch.js

@@ -1,7 +1,7 @@
-import * as __rspack_external_fast_json_patch_index_mjs_fbed3c14 from "fast-json-patch/index.mjs";
+import * as __rspack_external_fast_json_patch_index_mjs_25f05694 from "fast-json-patch/index.mjs";
 const jsonPatch = {
-    compare: (tree1, tree2, invertible)=>__rspack_external_fast_json_patch_index_mjs_fbed3c14.compare(tree1, tree2, invertible),
-    applyPatch: (document, patch, validateOperation, mutateDocument, banPrototypeModifications)=>__rspack_external_fast_json_patch_index_mjs_fbed3c14.applyPatch(document, patch, validateOperation, mutateDocument, banPrototypeModifications)
+    compare: (tree1, tree2, invertible)=>__rspack_external_fast_json_patch_index_mjs_25f05694.compare(tree1, tree2, invertible),
+    applyPatch: (document, patch, validateOperation, mutateDocument, banPrototypeModifications)=>__rspack_external_fast_json_patch_index_mjs_25f05694.applyPatch(document, patch, validateOperation, mutateDocument, banPrototypeModifications)
 };
 export { jsonPatch };
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/website-builder-sdk",
-	"version": "0.0.0-unstable.7be00a75a9",
+	"version": "0.0.0-unstable.7c2def32a7",
 	"type": "module",
 	"repository": {
 		"type": "git",
@@ -12,6 +12,7 @@
 	"author": "Pavel Denisjuk",
 	"license": "MIT",
 	"dependencies": {
+		"@webiny/sdk": "0.0.0-unstable.7c2def32a7",
 		"csstype": "3.2.3",
 		"deep-equal": "2.2.3",
 		"deepmerge": "4.3.1",
@@ -20,8 +21,8 @@
 		"is-hotkey": "0.2.0",
 		"lodash": "4.18.1",
 		"matcher": "6.0.0",
-		"mobx": "6.15.3",
-		"nanoid": "5.1.11",
+		"mobx": "7.0.3",
+		"nanoid": "6.0.1",
 		"nanoid-dictionary": "5.0.0",
 		"pino": "10.3.1",
 		"pino-pretty": "13.1.3"
@@ -29,9 +30,9 @@
 	"devDependencies": {
 		"@types/deep-equal": "1.0.4",
 		"@types/is-hotkey": "0.1.10",
-		"@webiny/build-tools": "0.0.0-unstable.7be00a75a9",
-		"typescript": "6.0.3",
-		"vitest": "4.1.7"
+		"@webiny/build-tools": "0.0.0-unstable.7c2def32a7",
+		"typescript": "7.0.2",
+		"vitest": "4.1.11"
 	},
 	"publishConfig": {
 		"access": "public"

package/types/WebsiteBuilderTheme.d.ts

@@ -13,6 +13,7 @@ export type WebsiteBuilderTheme = {
     colors: ColorStyle[];
     fontSizes?: FontSizes;
     typography: Typography;
+    allowCustomColors?: boolean;
 };
 type KnownKeys = "desktop" | "tablet" | "mobile";
 type BreakpointBase = Omit<Breakpoint, "name">;
@@ -92,5 +93,9 @@ export type WebsiteBuilderThemeInput = {
      * ]
      */
     typography?: Typography;
+    /**
+     * Allow custom color selection (ChromePicker) in the Lexical editor's font color toolbar action.
+     */
+    allowCustomColors?: boolean;
 };
 export {};

package/types.d.ts

@@ -3,6 +3,7 @@ import type { BindingsApi } from "./BindingsApi.js";
 import type { ShorthandCssProperties } from "./types/ShorthandCssProperties.js";
 import type { InputFactory } from "./createInput.js";
 import type { Breakpoint } from "./types/WebsiteBuilderTheme.js";
+import type { ActiveExperiment, VariantContent } from "./experiments/types.js";
 export type { WebsiteBuilderTheme, Breakpoint } from "./types/WebsiteBuilderTheme.js";
 type CSSProperties = CSS.Properties<string | number>;
 export type ElementMap = Record<string, DocumentElement>;
@@ -77,6 +78,7 @@ export type ComponentGroup = {
     name: string;
     label: string;
     description?: string;
+    icon?: string;
     filter?: (component: ComponentManifest, context: ComponentGroupFilterContext) => boolean;
 };
 export type ResponsiveStyles = {
@@ -197,6 +199,7 @@ export type ComponentManifest = {
     hideFromToolbar?: boolean;
     hideStyleSettings?: string[];
     autoApplyStyles?: boolean;
+    applyDefaultStyles?: boolean;
     tags: string[];
     constraints?: ComponentConstraint[];
     descendantConstraints?: ComponentConstraint[];
@@ -230,6 +233,7 @@ export type DocumentElement = {
 export type SerializableCSSStyleDeclaration = {
     [K in keyof CssProperties]?: CssProperties[K];
 };
+export type DocumentCache = Record<string, unknown>;
 export type Document = {
     id: string;
     state: DocumentState;
@@ -239,6 +243,7 @@ export type Document = {
     metadata: DocumentMetadata;
     bindings: DocumentBindings;
     elements: ElementMap;
+    __cache?: DocumentCache;
 };
 export type PublicPage = Pick<Page, "id" | "version" | "properties" | "bindings" | "elements" | "extensions" | "metadata" | "state"> & {
     languagePaths: Record<string, string>;
@@ -372,6 +377,9 @@ export interface IDataProvider {
     getPageByPath(path: string, options?: GetPageOptions): Promise<PublicPage | null>;
     getPageById(id: string, options?: GetPageOptions): Promise<PublicPage | null>;
     listPages(options?: ListPagesOptions): Promise<ListPagesResult>;
+    getPageExperiment(path: string): Promise<ActiveExperiment | null>;
+    getVariantContent(variantId: string): Promise<VariantContent | null>;
+    getExperimentPaused(experimentId: string): Promise<boolean>;
 }
 export interface IEnvironment {
     isClient(): boolean;
@@ -447,6 +455,72 @@ export type RadioInput = BaseInput<string> & {
         value: string;
     }[];
 };
+export interface ContentEntryReference {
+    id: string;
+    modelId: string;
+}
+/**
+ * Query-mode configuration, declared by the component author. The editor then
+ * builds a query within these bounds (see `ContentEntryQueryValue`).
+ */
+/**
+ * A field the editor may sort by: a bare read-API sort key, or a key paired with
+ * a display label shown in the editor.
+ */
+export type ContentEntrySortField = string | {
+    field: string;
+    label?: string;
+};
+export interface ContentEntryQueryConfig {
+    /**
+     * Fields the editor may sort by (one at a time). Each `field` is a CMS read-API
+     * sort key — value fields as `values_<fieldId>` (e.g. `values_title`), meta
+     * fields bare (e.g. `createdOn`). Provide a `label` for a friendlier UI; a bare
+     * string uses the key as its label.
+     */
+    sort?: {
+        fields: ContentEntrySortField[];
+    };
+    /** Editor-configurable result limit, with an optional default and hard cap. */
+    limit?: {
+        default?: number;
+        max?: number;
+    };
+    /** Show a free-text search box (matches fullTextSearch-enabled fields). */
+    search?: boolean;
+    /** Enable "load more" pagination in the rendered component. */
+    pagination?: boolean;
+}
+/**
+ * The value stored for a query-mode input: the editor's chosen query.
+ * `modelId` identifies the CMS model so the frontend SDK can resolve the
+ * query without component manifests.
+ */
+export interface ContentEntryQueryValue {
+    modelId: string;
+    sort?: {
+        field: string;
+        order: "asc" | "desc";
+    };
+    limit?: number;
+    search?: string;
+}
+export type ContentEntryInput = BaseInput<ContentEntryReference | ContentEntryReference[] | ContentEntryQueryValue> & {
+    type: "contentEntry";
+    /**
+     * The content model(s) the editor may pick entries from. Author-fixed.
+     */
+    models: string[];
+    /**
+     * "manual" (default): the editor hand-picks entries (stored as references).
+     * "query": the editor configures a dynamic query on the fixed model.
+     */
+    mode?: "manual" | "query";
+    /**
+     * Query-mode configuration. Only used when `mode` is "query".
+     */
+    query?: ContentEntryQueryConfig;
+};
 export type ObjectInput = BaseInput<Record<string, any>> & {
     type: "object";
     fields: ComponentInput[];
@@ -455,7 +529,7 @@ export type CustomInput = BaseInput<any> & {
     type: string;
     fields: ComponentInput[];
 };
-export type ComponentInput = TextInput | LongTextInput | NumberInput | BooleanInput | ColorInput | FileInput | DateTimeInput | LexicalInput | SelectInput | RadioInput | TagsInput | ObjectInput | SlotInput | CustomInput;
+export type ComponentInput = TextInput | LongTextInput | NumberInput | BooleanInput | ColorInput | FileInput | DateTimeInput | LexicalInput | SelectInput | RadioInput | TagsInput | ObjectInput | SlotInput | ContentEntryInput | CustomInput;
 export type ManifestInputsArray<TInputs, TAllowChildren extends boolean> = TAllowChildren extends true ? {
     [K in Exclude<keyof TInputs, "children">]: InputFactory<K & string>;
 }[Exclude<keyof TInputs, "children">][] : {