@webiny/website-builder-react 0.0.0-unstable.9f53ea597d → 0.0.0-unstable.a4f3e4ea8b

package/components/LiveElementRenderer.js

@@ -6,6 +6,7 @@ import { ElementSlot } from "./ElementSlot.js";
 import { useViewport } from "./useViewportInfo.js";
 import { useBindingsForElement } from "./useBindingsForElement.js";
 import { useDocumentState } from "./useDocumentState.js";
+import { useDocumentStore } from "./DocumentStoreProvider.js";
 const LiveElementRenderer = observer(({ element })=>{
     const viewport = useViewport();
     const [breakpoint, setBreakpoint] = useState("desktop");
@@ -17,6 +18,8 @@ const LiveElementRenderer = observer(({ element })=>{
     ]);
     const elementBindings = useBindingsForElement(element.id, breakpoint);
     const state = useDocumentState();
+    const documentStore = useDocumentStore();
+    const document = documentStore.getDocument();
     const onResolved = useCallback((value, input)=>{
         if ("slot" === input.type) return /*#__PURE__*/ react.createElement(ElementSlot, {
             key: element.id,
@@ -35,6 +38,7 @@ const LiveElementRenderer = observer(({ element })=>{
         element,
         state,
         elementBindings,
+        cache: document?.__cache,
         onResolved
     });
     if (!instances) return null;

package/components/LiveElementRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"components/LiveElementRenderer.js","sources":["../../src/components/LiveElementRenderer.tsx"],"sourcesContent":["\"use client\";\nimport React, { useCallback, useEffect, useState } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport type {\n    DocumentElement,\n    DocumentElementBindings,\n    OnResolved\n} from \"@webiny/website-builder-sdk\";\nimport { contentSdk } from \"@webiny/website-builder-sdk\";\nimport { ElementSlot } from \"./ElementSlot.js\";\nimport { useViewport } from \"./useViewportInfo.js\";\nimport { useBindingsForElement } from \"./useBindingsForElement.js\";\nimport { useDocumentState } from \"./useDocumentState.js\";\n\ninterface LiveElementRendererProps {\n    element: DocumentElement;\n    bindings?: DocumentElementBindings;\n}\n\nexport const LiveElementRenderer = observer(({ element }: LiveElementRendererProps) => {\n    const viewport = useViewport();\n\n    // 1. Start breakpoint as \"desktop\" on both server and initial client render.\n    const [breakpoint, setBreakpoint] = useState<\"desktop\" | string>(\"desktop\");\n\n    // 2. Update breakpoint on the client after mount, using real viewport value.\n    useEffect(() => {\n        if (viewport.breakpoint && viewport.breakpoint !== breakpoint) {\n            setBreakpoint(viewport.breakpoint);\n        }\n    }, [viewport.breakpoint, breakpoint]);\n\n    // Bindings for current breakpoint\n    const elementBindings = useBindingsForElement(element.id, breakpoint); // pass breakpoint explicitly if possible\n    const state = useDocumentState();\n\n    const onResolved = useCallback(\n        ((value, input) => {\n            if (input.type === \"slot\") {\n                return (\n                    <ElementSlot\n                        key={element.id}\n                        parentId={element.id}\n                        slot={input.name}\n                        elements={input.list ? value : [value]}\n                    />\n                );\n            }\n            return value;\n        }) as OnResolved,\n        [element.id]\n    );\n\n    if (!element || !element.component) {\n        return null;\n    }\n\n    const instances = contentSdk.resolveElement({\n        element,\n        state,\n        elementBindings,\n        onResolved\n    });\n\n    if (!instances) {\n        return null;\n    }\n\n    return (\n        <>\n            {instances.map((resolvedElement, index) => {\n                const { component: Component, inputs, styles, manifest } = resolvedElement;\n                const props = { inputs, styles, element, breakpoint: viewport.breakpoint };\n                const autoApplyStyles = manifest.autoApplyStyles !== false;\n\n                const userElement = <Component key={element.id} {...props} />;\n\n                if (!autoApplyStyles) {\n                    return userElement;\n                }\n\n                return (\n                    <div key={index} style={styles}>\n                        {userElement}\n                    </div>\n                );\n            })}\n        </>\n    );\n});\n"],"names":["LiveElementRenderer","observer","element","viewport","useViewport","breakpoint","setBreakpoint","useState","useEffect","elementBindings","useBindingsForElement","state","useDocumentState","onResolved","useCallback","value","input","ElementSlot","instances","contentSdk","resolvedElement","index","Component","inputs","styles","manifest","props","autoApplyStyles","userElement"],"mappings":";;;;;;;;AAmBO,MAAMA,sBAAsBC,SAAS,CAAC,EAAEC,OAAO,EAA4B;IAC9E,MAAMC,WAAWC;IAGjB,MAAM,CAACC,YAAYC,cAAc,GAAGC,SAA6B;IAGjEC,UAAU;QACN,IAAIL,SAAS,UAAU,IAAIA,SAAS,UAAU,KAAKE,YAC/CC,cAAcH,SAAS,UAAU;IAEzC,GAAG;QAACA,SAAS,UAAU;QAAEE;KAAW;IAGpC,MAAMI,kBAAkBC,sBAAsBR,QAAQ,EAAE,EAAEG;IAC1D,MAAMM,QAAQC;IAEd,MAAMC,aAAaC,YACd,CAACC,OAAOC;QACL,IAAIA,AAAe,WAAfA,MAAM,IAAI,EACV,OAAO,WAAP,GACI,oBAACC,aAAWA;YACR,KAAKf,QAAQ,EAAE;YACf,UAAUA,QAAQ,EAAE;YACpB,MAAMc,MAAM,IAAI;YAChB,UAAUA,MAAM,IAAI,GAAGD,QAAQ;gBAACA;aAAM;;QAIlD,OAAOA;IACX,GACA;QAACb,QAAQ,EAAE;KAAC;IAGhB,IAAI,CAACA,WAAW,CAACA,QAAQ,SAAS,EAC9B,OAAO;IAGX,MAAMgB,YAAYC,WAAW,cAAc,CAAC;QACxCjB;QACAS;QACAF;QACAI;IACJ;IAEA,IAAI,CAACK,WACD,OAAO;IAGX,OAAO,WAAP,GACI,0CACKA,UAAU,GAAG,CAAC,CAACE,iBAAiBC;QAC7B,MAAM,EAAE,WAAWC,SAAS,EAAEC,MAAM,EAAEC,MAAM,EAAEC,QAAQ,EAAE,GAAGL;QAC3D,MAAMM,QAAQ;YAAEH;YAAQC;YAAQtB;YAAS,YAAYC,SAAS,UAAU;QAAC;QACzE,MAAMwB,kBAAkBF,AAA6B,UAA7BA,SAAS,eAAe;QAEhD,MAAMG,cAAc,WAAdA,GAAc,oBAACN,WAAAA;YAAU,KAAKpB,QAAQ,EAAE;YAAG,GAAGwB,KAAK;;QAEzD,IAAI,CAACC,iBACD,OAAOC;QAGX,OAAO,WAAP,GACI,oBAAC;YAAI,KAAKP;YAAO,OAAOG;WACnBI;IAGb;AAGZ"}
+{"version":3,"file":"components/LiveElementRenderer.js","sources":["../../src/components/LiveElementRenderer.tsx"],"sourcesContent":["\"use client\";\nimport React, { useCallback, useEffect, useState } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport type {\n    DocumentElement,\n    DocumentElementBindings,\n    OnResolved\n} from \"@webiny/website-builder-sdk\";\nimport { contentSdk } from \"@webiny/website-builder-sdk\";\nimport { ElementSlot } from \"./ElementSlot.js\";\nimport { useViewport } from \"./useViewportInfo.js\";\nimport { useBindingsForElement } from \"./useBindingsForElement.js\";\nimport { useDocumentState } from \"./useDocumentState.js\";\nimport { useDocumentStore } from \"./DocumentStoreProvider.js\";\n\ninterface LiveElementRendererProps {\n    element: DocumentElement;\n    bindings?: DocumentElementBindings;\n}\n\nexport const LiveElementRenderer = observer(({ element }: LiveElementRendererProps) => {\n    const viewport = useViewport();\n\n    // 1. Start breakpoint as \"desktop\" on both server and initial client render.\n    const [breakpoint, setBreakpoint] = useState<\"desktop\" | string>(\"desktop\");\n\n    // 2. Update breakpoint on the client after mount, using real viewport value.\n    useEffect(() => {\n        if (viewport.breakpoint && viewport.breakpoint !== breakpoint) {\n            setBreakpoint(viewport.breakpoint);\n        }\n    }, [viewport.breakpoint, breakpoint]);\n\n    // Bindings for current breakpoint\n    const elementBindings = useBindingsForElement(element.id, breakpoint); // pass breakpoint explicitly if possible\n    const state = useDocumentState();\n    const documentStore = useDocumentStore();\n    const document = documentStore.getDocument();\n\n    const onResolved = useCallback(\n        ((value, input) => {\n            if (input.type === \"slot\") {\n                return (\n                    <ElementSlot\n                        key={element.id}\n                        parentId={element.id}\n                        slot={input.name}\n                        elements={input.list ? value : [value]}\n                    />\n                );\n            }\n            return value;\n        }) as OnResolved,\n        [element.id]\n    );\n\n    if (!element || !element.component) {\n        return null;\n    }\n\n    const instances = contentSdk.resolveElement({\n        element,\n        state,\n        elementBindings,\n        cache: document?.__cache,\n        onResolved\n    });\n\n    if (!instances) {\n        return null;\n    }\n\n    return (\n        <>\n            {instances.map((resolvedElement, index) => {\n                const { component: Component, inputs, styles, manifest } = resolvedElement;\n                const props = { inputs, styles, element, breakpoint: viewport.breakpoint };\n                const autoApplyStyles = manifest.autoApplyStyles !== false;\n\n                const userElement = <Component key={element.id} {...props} />;\n\n                if (!autoApplyStyles) {\n                    return userElement;\n                }\n\n                return (\n                    <div key={index} style={styles}>\n                        {userElement}\n                    </div>\n                );\n            })}\n        </>\n    );\n});\n"],"names":["LiveElementRenderer","observer","element","viewport","useViewport","breakpoint","setBreakpoint","useState","useEffect","elementBindings","useBindingsForElement","state","useDocumentState","documentStore","useDocumentStore","document","onResolved","useCallback","value","input","ElementSlot","instances","contentSdk","resolvedElement","index","Component","inputs","styles","manifest","props","autoApplyStyles","userElement"],"mappings":";;;;;;;;;AAoBO,MAAMA,sBAAsBC,SAAS,CAAC,EAAEC,OAAO,EAA4B;IAC9E,MAAMC,WAAWC;IAGjB,MAAM,CAACC,YAAYC,cAAc,GAAGC,SAA6B;IAGjEC,UAAU;QACN,IAAIL,SAAS,UAAU,IAAIA,SAAS,UAAU,KAAKE,YAC/CC,cAAcH,SAAS,UAAU;IAEzC,GAAG;QAACA,SAAS,UAAU;QAAEE;KAAW;IAGpC,MAAMI,kBAAkBC,sBAAsBR,QAAQ,EAAE,EAAEG;IAC1D,MAAMM,QAAQC;IACd,MAAMC,gBAAgBC;IACtB,MAAMC,WAAWF,cAAc,WAAW;IAE1C,MAAMG,aAAaC,YACd,CAACC,OAAOC;QACL,IAAIA,AAAe,WAAfA,MAAM,IAAI,EACV,OAAO,WAAP,GACI,oBAACC,aAAWA;YACR,KAAKlB,QAAQ,EAAE;YACf,UAAUA,QAAQ,EAAE;YACpB,MAAMiB,MAAM,IAAI;YAChB,UAAUA,MAAM,IAAI,GAAGD,QAAQ;gBAACA;aAAM;;QAIlD,OAAOA;IACX,GACA;QAAChB,QAAQ,EAAE;KAAC;IAGhB,IAAI,CAACA,WAAW,CAACA,QAAQ,SAAS,EAC9B,OAAO;IAGX,MAAMmB,YAAYC,WAAW,cAAc,CAAC;QACxCpB;QACAS;QACAF;QACA,OAAOM,UAAU;QACjBC;IACJ;IAEA,IAAI,CAACK,WACD,OAAO;IAGX,OAAO,WAAP,GACI,0CACKA,UAAU,GAAG,CAAC,CAACE,iBAAiBC;QAC7B,MAAM,EAAE,WAAWC,SAAS,EAAEC,MAAM,EAAEC,MAAM,EAAEC,QAAQ,EAAE,GAAGL;QAC3D,MAAMM,QAAQ;YAAEH;YAAQC;YAAQzB;YAAS,YAAYC,SAAS,UAAU;QAAC;QACzE,MAAM2B,kBAAkBF,AAA6B,UAA7BA,SAAS,eAAe;QAEhD,MAAMG,cAAc,WAAdA,GAAc,oBAACN,WAAAA;YAAU,KAAKvB,QAAQ,EAAE;YAAG,GAAG2B,KAAK;;QAEzD,IAAI,CAACC,iBACD,OAAOC;QAGX,OAAO,WAAP,GACI,oBAAC;YAAI,KAAKP;YAAO,OAAOG;WACnBI;IAGb;AAGZ"}

package/contentEntry/useContentEntryList.d.ts

@@ -0,0 +1,22 @@
+import type { ResolvedContentEntryQuery } from "@webiny/website-builder-sdk";
+export type { ResolvedContentEntryQuery, ContentEntryQuerySpec } from "@webiny/website-builder-sdk";
+export interface ContentEntryList<T = unknown> {
+    /** The loaded entries (first page + any loaded via loadMore). */
+    items: T[];
+    /** Whether more pages are available (and pagination is enabled). */
+    hasMore: boolean;
+    /** True while a loadMore fetch is in flight. */
+    loading: boolean;
+    /** Fetch and append the next page. No-op when nothing more to load. */
+    loadMore: () => void;
+}
+/**
+ * Client hook for a query-mode `contentEntry` input. Seeds from the server-resolved
+ * first page (SSR-safe — no fetch on mount) and loads further pages on demand from
+ * the embedded query + cursor. Re-seeds when the underlying query changes (e.g. the
+ * editor tweaks sort/limit/search in preview).
+ *
+ * Pagination is active only when the input enables it (the resolved value then
+ * carries a `query`); otherwise `hasMore` is always false and `loadMore` is a no-op.
+ */
+export declare function useContentEntryList<T = unknown>(value: ResolvedContentEntryQuery<T> | null | undefined): ContentEntryList<T>;

package/contentEntry/useContentEntryList.js

@@ -0,0 +1,51 @@
+"use client";
+import { useCallback, useState } from "react";
+import { contentSdk } from "@webiny/cms-sdk";
+function useContentEntryList(value) {
+    const query = value?.query;
+    const signature = JSON.stringify({
+        query,
+        cursor: value?.pageInfo?.cursor ?? null
+    });
+    const seed = ()=>({
+            signature,
+            items: value?.items ?? [],
+            cursor: value?.pageInfo?.cursor ?? null,
+            apiHasMore: value?.pageInfo?.hasMore ?? false
+        });
+    const [state, setState] = useState(seed);
+    const [loading, setLoading] = useState(false);
+    if (state.signature !== signature) setState(seed());
+    const loadMore = useCallback(()=>{
+        if (!query || loading || !state.apiHasMore || !state.cursor) return;
+        setLoading(true);
+        contentSdk.listEntries({
+            ...query,
+            after: state.cursor
+        }).then((result)=>{
+            setState((prev)=>({
+                    ...prev,
+                    items: [
+                        ...prev.items,
+                        ...result.data
+                    ],
+                    cursor: result.meta.cursor,
+                    apiHasMore: result.meta.hasMoreItems
+                }));
+        }).finally(()=>setLoading(false));
+    }, [
+        query,
+        loading,
+        state.apiHasMore,
+        state.cursor
+    ]);
+    return {
+        items: state.items,
+        hasMore: Boolean(query) && state.apiHasMore,
+        loading,
+        loadMore
+    };
+}
+export { useContentEntryList };
+
+//# sourceMappingURL=useContentEntryList.js.map

package/contentEntry/useContentEntryList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contentEntry/useContentEntryList.js","sources":["../../src/contentEntry/useContentEntryList.ts"],"sourcesContent":["\"use client\";\nimport { useCallback, useState } from \"react\";\nimport { contentSdk } from \"@webiny/cms-sdk\";\nimport type { ResolvedContentEntryQuery } from \"@webiny/website-builder-sdk\";\n\nexport type { ResolvedContentEntryQuery, ContentEntryQuerySpec } from \"@webiny/website-builder-sdk\";\n\nexport interface ContentEntryList<T = unknown> {\n    /** The loaded entries (first page + any loaded via loadMore). */\n    items: T[];\n    /** Whether more pages are available (and pagination is enabled). */\n    hasMore: boolean;\n    /** True while a loadMore fetch is in flight. */\n    loading: boolean;\n    /** Fetch and append the next page. No-op when nothing more to load. */\n    loadMore: () => void;\n}\n\ninterface PageState<T> {\n    signature: string;\n    items: T[];\n    cursor: string | null;\n    apiHasMore: boolean;\n}\n\n/**\n * Client hook for a query-mode `contentEntry` input. Seeds from the server-resolved\n * first page (SSR-safe — no fetch on mount) and loads further pages on demand from\n * the embedded query + cursor. Re-seeds when the underlying query changes (e.g. the\n * editor tweaks sort/limit/search in preview).\n *\n * Pagination is active only when the input enables it (the resolved value then\n * carries a `query`); otherwise `hasMore` is always false and `loadMore` is a no-op.\n */\nexport function useContentEntryList<T = unknown>(\n    value: ResolvedContentEntryQuery<T> | null | undefined\n): ContentEntryList<T> {\n    const query = value?.query;\n    const signature = JSON.stringify({ query, cursor: value?.pageInfo?.cursor ?? null });\n\n    const seed = (): PageState<T> => ({\n        signature,\n        items: value?.items ?? [],\n        cursor: value?.pageInfo?.cursor ?? null,\n        apiHasMore: value?.pageInfo?.hasMore ?? false\n    });\n\n    const [state, setState] = useState<PageState<T>>(seed);\n    const [loading, setLoading] = useState(false);\n\n    // Re-seed (on the client) when the resolved page changes — e.g. the editor edits\n    // the query. The first/SSR render already has the right data via useState.\n    if (state.signature !== signature) {\n        setState(seed());\n    }\n\n    const loadMore = useCallback(() => {\n        if (!query || loading || !state.apiHasMore || !state.cursor) {\n            return;\n        }\n        setLoading(true);\n        contentSdk\n            .listEntries({ ...query, after: state.cursor })\n            .then(result => {\n                setState(prev => ({\n                    ...prev,\n                    items: [...prev.items, ...(result.data as T[])],\n                    cursor: result.meta.cursor,\n                    apiHasMore: result.meta.hasMoreItems\n                }));\n            })\n            .finally(() => setLoading(false));\n    }, [query, loading, state.apiHasMore, state.cursor]);\n\n    return {\n        items: state.items,\n        hasMore: Boolean(query) && state.apiHasMore,\n        loading,\n        loadMore\n    };\n}\n"],"names":["useContentEntryList","value","query","signature","JSON","seed","state","setState","useState","loading","setLoading","loadMore","useCallback","contentSdk","result","prev","Boolean"],"mappings":";;;AAkCO,SAASA,oBACZC,KAAsD;IAEtD,MAAMC,QAAQD,OAAO;IACrB,MAAME,YAAYC,KAAK,SAAS,CAAC;QAAEF;QAAO,QAAQD,OAAO,UAAU,UAAU;IAAK;IAElF,MAAMI,OAAO,IAAqB;YAC9BF;YACA,OAAOF,OAAO,SAAS,EAAE;YACzB,QAAQA,OAAO,UAAU,UAAU;YACnC,YAAYA,OAAO,UAAU,WAAW;QAC5C;IAEA,MAAM,CAACK,OAAOC,SAAS,GAAGC,SAAuBH;IACjD,MAAM,CAACI,SAASC,WAAW,GAAGF,SAAS;IAIvC,IAAIF,MAAM,SAAS,KAAKH,WACpBI,SAASF;IAGb,MAAMM,WAAWC,YAAY;QACzB,IAAI,CAACV,SAASO,WAAW,CAACH,MAAM,UAAU,IAAI,CAACA,MAAM,MAAM,EACvD;QAEJI,WAAW;QACXG,WAAAA,WACgB,CAAC;YAAE,GAAGX,KAAK;YAAE,OAAOI,MAAM,MAAM;QAAC,GAC5C,IAAI,CAACQ,CAAAA;YACFP,SAASQ,CAAAA,OAAS;oBACd,GAAGA,IAAI;oBACP,OAAO;2BAAIA,KAAK,KAAK;2BAAMD,OAAO,IAAI;qBAAS;oBAC/C,QAAQA,OAAO,IAAI,CAAC,MAAM;oBAC1B,YAAYA,OAAO,IAAI,CAAC,YAAY;gBACxC;QACJ,GACC,OAAO,CAAC,IAAMJ,WAAW;IAClC,GAAG;QAACR;QAAOO;QAASH,MAAM,UAAU;QAAEA,MAAM,MAAM;KAAC;IAEnD,OAAO;QACH,OAAOA,MAAM,KAAK;QAClB,SAASU,QAAQd,UAAUI,MAAM,UAAU;QAC3CG;QACAE;IACJ;AACJ"}

package/createComponent.d.ts

@@ -1,3 +1 @@
-import type { Component, ComponentManifestInput } from "@webiny/website-builder-sdk";
-import type { ExtractInputs } from "./types.js";
-export declare function createComponent<TComponent extends (props: any) => any, TInputs extends ExtractInputs<Parameters<TComponent>[0]>>(component: TComponent, manifest: ComponentManifestInput<TInputs>): Component;
+export { createComponent } from "@webiny/website-builder-sdk";

package/createComponent.js

@@ -1,32 +1 @@
-import { createSlotInput } from "@webiny/website-builder-sdk";
-function createComponent(component, manifest) {
-    const inputs = [];
-    if (Array.isArray(manifest.inputs)) inputs.push(...manifest.inputs);
-    else {
-        const inputsObject = manifest.inputs ?? {};
-        Object.keys(inputsObject).forEach((name)=>{
-            inputs.push({
-                ...inputsObject[name],
-                name
-            });
-        });
-    }
-    const acceptsChildren = manifest.acceptsChildren;
-    if (acceptsChildren) {
-        const hasChildren = inputs.some((input)=>"children" === input.name);
-        if (!hasChildren) inputs.push(createSlotInput({
-            name: "children"
-        }));
-    }
-    return {
-        component,
-        manifest: {
-            ...manifest,
-            tags: manifest.tags ?? [],
-            inputs
-        }
-    };
-}
-export { createComponent };
-
-//# sourceMappingURL=createComponent.js.map
+export { createComponent } from "@webiny/website-builder-sdk";

package/index.d.ts

@@ -1,4 +1,5 @@
 export * from "./components/index.js";
-export * from "./createComponent.js";
-export { createTextInput, createLongTextInput, createNumberInput, createBooleanInput, createColorInput, createFileInput, createDateInput, createLexicalInput, createSelectInput, createRadioInput, createObjectInput, createTagsInput, createSlotInput, createInput, createElement, createTheme, contentSdk, environment, setHeadersProvider, getHeadersProvider, registerComponentGroup, getPageWithExperiment, resolveVisitorContext, assignVariant, forcedAssignment, registerAnalyticsProvider, getAnalyticsProvider, ASPECT_RATIO_PRESETS, FORCED_VARIANT_PARAM, DEFAULT_VISITOR_COOKIE, CONTROL_VARIANT_ID, type ActiveExperiment, type ActiveExperimentVariant, type VariantContent, type VariantAssignment, type VisitorContext, type DeviceType, type ExperimentTrafficSplit, type ExperimentTargeting, type ExperimentAnalyticsConfig, type ExperimentSdk, type ExperimentRenderResult, type GetPageWithExperimentOptions, type ExperimentCookie, type CssProperties, type Document, type DocumentElement, type Breakpoint, type CreateElementParams, type ContentSDKConfig, type ComponentManifest, type ComponentInput, type ComponentConstraint, type WebsiteBuilderThemeInput, type AssetCrop, type AssetFocalPoint, type Asset, type AssetImage, type AssetDocument, type AssetVideo, type AssetCategory, normalizeToAsset, getAssetCategory, getAssetUrl, getAssetCropParam, type AssetUrlOptions, IMAGE_RESIZE_WIDTHS, getImageSrcSet, getImageDimensions, type ImageSrcSet, type ImageSrcSetOptions, type ImageDimensions, type AspectRatioInput, type AspectRatioPreset, StyleSettings } from "@webiny/website-builder-sdk";
+export * from "./contentEntry/useContentEntryList.js";
+export { createComponent } from "@webiny/website-builder-sdk";
+export { createTextInput, createLongTextInput, createNumberInput, createBooleanInput, createColorInput, createFileInput, createDateInput, createLexicalInput, createSelectInput, createRadioInput, createObjectInput, createTagsInput, createSlotInput, createContentEntryInput, createInput, createElement, createTheme, contentSdk, environment, setHeadersProvider, getHeadersProvider, registerComponentGroup, ASPECT_RATIO_PRESETS, type CssProperties, type Document, type DocumentElement, type Breakpoint, type CreateElementParams, type ContentSDKConfig, type ComponentManifest, type ComponentInput, type ContentEntryInput, type ContentEntryReference, type ContentEntryQueryConfig, type ContentEntryQueryValue, type ComponentConstraint, type WebsiteBuilderThemeInput, type AssetCrop, type AssetFocalPoint, type Asset, type AssetImage, type AssetDocument, type AssetVideo, type AssetCategory, normalizeToAsset, getAssetCategory, getAssetUrl, getAssetCropParam, type AssetUrlOptions, IMAGE_RESIZE_WIDTHS, getImageSrcSet, getImageDimensions, type ImageSrcSet, type ImageSrcSetOptions, type ImageDimensions, type AspectRatioInput, type AspectRatioPreset, StyleSettings } from "@webiny/website-builder-sdk";
 export type { ComponentProps, ComponentPropsWithChildren, InferManifest, InferComponentChange, InferDescendantChange } from "./types.js";

package/index.js

@@ -1,3 +1,3 @@
 export * from "./components/index.js";
-export * from "./createComponent.js";
-export { ASPECT_RATIO_PRESETS, CONTROL_VARIANT_ID, DEFAULT_VISITOR_COOKIE, FORCED_VARIANT_PARAM, IMAGE_RESIZE_WIDTHS, StyleSettings, assignVariant, contentSdk, createBooleanInput, createColorInput, createDateInput, createElement, createFileInput, createInput, createLexicalInput, createLongTextInput, createNumberInput, createObjectInput, createRadioInput, createSelectInput, createSlotInput, createTagsInput, createTextInput, createTheme, environment, forcedAssignment, getAnalyticsProvider, getAssetCategory, getAssetCropParam, getAssetUrl, getHeadersProvider, getImageDimensions, getImageSrcSet, getPageWithExperiment, normalizeToAsset, registerAnalyticsProvider, registerComponentGroup, resolveVisitorContext, setHeadersProvider } from "@webiny/website-builder-sdk";
+export * from "./contentEntry/useContentEntryList.js";
+export { ASPECT_RATIO_PRESETS, IMAGE_RESIZE_WIDTHS, StyleSettings, contentSdk, createBooleanInput, createColorInput, createComponent, createContentEntryInput, createDateInput, createElement, createFileInput, createInput, createLexicalInput, createLongTextInput, createNumberInput, createObjectInput, createRadioInput, createSelectInput, createSlotInput, createTagsInput, createTextInput, createTheme, environment, getAssetCategory, getAssetCropParam, getAssetUrl, getHeadersProvider, getImageDimensions, getImageSrcSet, normalizeToAsset, registerComponentGroup, setHeadersProvider } from "@webiny/website-builder-sdk";

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/website-builder-react",
-	"version": "0.0.0-unstable.9f53ea597d",
+	"version": "0.0.0-unstable.a4f3e4ea8b",
 	"type": "module",
 	"repository": {
 		"type": "git",
@@ -17,7 +17,8 @@
 	],
 	"license": "MIT",
 	"dependencies": {
-		"@webiny/website-builder-sdk": "0.0.0-unstable.9f53ea597d",
+		"@webiny/cms-sdk": "0.0.0-unstable.a4f3e4ea8b",
+		"@webiny/website-builder-sdk": "0.0.0-unstable.a4f3e4ea8b",
 		"deep-equal": "2.2.3",
 		"mobx": "6.16.1",
 		"mobx-react-lite": "4.1.1",
@@ -26,7 +27,7 @@
 	},
 	"devDependencies": {
 		"@types/react": "18.3.31",
-		"@webiny/build-tools": "0.0.0-unstable.9f53ea597d",
+		"@webiny/build-tools": "0.0.0-unstable.a4f3e4ea8b",
 		"typescript": "7.0.2",
 		"vitest": "4.1.10"
 	},

package/types.d.ts

@@ -1,4 +1,5 @@
-import type { CssProperties, DocumentElement, ComponentManifestInput, ComponentChangeHandler, DescendantChangeHandler } from "@webiny/website-builder-sdk";
+import type { CssProperties, DocumentElement, ComponentManifestInput, ComponentChangeHandler, DescendantChangeHandler, ExtractInputs } from "@webiny/website-builder-sdk";
+export type { ExtractInputs } from "@webiny/website-builder-sdk";
 export type ComponentProps<TInputs = unknown> = {
     inputs: TInputs;
     styles: CssProperties;
@@ -8,9 +9,6 @@ export type ComponentProps<TInputs = unknown> = {
 export type ComponentPropsWithChildren<TInputs = unknown> = ComponentProps<TInputs & {
     children: React.ReactNode;
 }>;
-export type ExtractInputs<T> = T extends {
-    inputs: infer I;
-} ? I : never;
 export type ExtractInputNames<T extends (props: any) => any> = keyof ExtractInputs<Parameters<T>[0]>;
 /**
  * Infer the full typed ComponentManifestInput from a React component.

package/createComponent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"createComponent.js","sources":["../src/createComponent.ts"],"sourcesContent":["import type {\n    Component,\n    ComponentInput,\n    ComponentManifest,\n    ComponentManifestInput,\n    InputFactory\n} from \"@webiny/website-builder-sdk\";\nimport { createSlotInput } from \"@webiny/website-builder-sdk\";\nimport type { ExtractInputs } from \"~/types.js\";\n\nexport function createComponent<\n    TComponent extends (props: any) => any,\n    TInputs extends ExtractInputs<Parameters<TComponent>[0]>\n>(component: TComponent, manifest: ComponentManifestInput<TInputs>): Component {\n    const inputs: ComponentInput[] = [];\n\n    // Normalize inputs to always be an array of objects.\n\n    if (Array.isArray(manifest.inputs)) {\n        inputs.push(...manifest.inputs);\n    } else {\n        const inputsObject: Record<string, InputFactory<any>> = manifest.inputs ?? {};\n        Object.keys(inputsObject).forEach((name: string) => {\n            inputs.push({ ...inputsObject[name], name });\n        });\n    }\n\n    const acceptsChildren = manifest.acceptsChildren;\n\n    if (acceptsChildren) {\n        const hasChildren = inputs.some(input => input.name === \"children\");\n        if (!hasChildren) {\n            inputs.push(createSlotInput({ name: \"children\" }));\n        }\n    }\n\n    return {\n        component,\n        manifest: { ...manifest, tags: manifest.tags ?? [], inputs } as ComponentManifest\n    };\n}\n"],"names":["createComponent","component","manifest","inputs","Array","inputsObject","Object","name","acceptsChildren","hasChildren","input","createSlotInput"],"mappings":";AAUO,SAASA,gBAGdC,SAAqB,EAAEC,QAAyC;IAC9D,MAAMC,SAA2B,EAAE;IAInC,IAAIC,MAAM,OAAO,CAACF,SAAS,MAAM,GAC7BC,OAAO,IAAI,IAAID,SAAS,MAAM;SAC3B;QACH,MAAMG,eAAkDH,SAAS,MAAM,IAAI,CAAC;QAC5EI,OAAO,IAAI,CAACD,cAAc,OAAO,CAAC,CAACE;YAC/BJ,OAAO,IAAI,CAAC;gBAAE,GAAGE,YAAY,CAACE,KAAK;gBAAEA;YAAK;QAC9C;IACJ;IAEA,MAAMC,kBAAkBN,SAAS,eAAe;IAEhD,IAAIM,iBAAiB;QACjB,MAAMC,cAAcN,OAAO,IAAI,CAACO,CAAAA,QAASA,AAAe,eAAfA,MAAM,IAAI;QACnD,IAAI,CAACD,aACDN,OAAO,IAAI,CAACQ,gBAAgB;YAAE,MAAM;QAAW;IAEvD;IAEA,OAAO;QACHV;QACA,UAAU;YAAE,GAAGC,QAAQ;YAAE,MAAMA,SAAS,IAAI,IAAI,EAAE;YAAEC;QAAO;IAC/D;AACJ"}