@webiny/website-builder-vue 6.4.0-beta.5 → 6.4.0-beta.7

package/{src/editorComponents/Grid.manifest.ts → editorComponents/Grid.manifest.js}

@@ -1,20 +1,11 @@
 "use client";
-import {
-    createBooleanInput,
-    createElement,
-    createNumberInput,
-    createObjectInput,
-    createSelectInput,
-    createSlotInput,
-    createTextInput
-} from "@webiny/website-builder-sdk";
-import { createComponent } from "~/createComponent.js";
+import { createBooleanInput, createElement, createNumberInput, createObjectInput, createSelectInput, createSlotInput, createTextInput } from "@webiny/website-builder-sdk";
+import { createComponent } from "../createComponent.js";
 import { GridComponent } from "./Grid.js";
-
-export const Grid = createComponent(GridComponent, {
+const Grid = createComponent(GridComponent, {
     name: "Webiny/Grid",
     label: "Grid",
-    image: `<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M120-520v-320h320v320H120Zm0 400v-320h320v320H120Zm400-400v-320h320v320H520Zm0 400v-320h320v320H520ZM200-600h160v-160H200v160Zm400 0h160v-160H600v160Zm0 400h160v-160H600v160Zm-400 0h160v-160H200v160Zm400-400Zm0 240Zm-240 0Zm0-240Z"/></svg>`,
+    image: '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M120-520v-320h320v320H120Zm0 400v-320h320v320H120Zm400-400v-320h320v320H520Zm0 400v-320h320v320H520ZM200-600h160v-160H200v160Zm400 0h160v-160H600v160Zm0 400h160v-160H600v160Zm-400 0h160v-160H200v160Zm400-400Zm0 240Zm-240 0Zm0-240Z"/></svg>',
     group: "basic",
     autoApplyStyles: false,
     inputs: [
@@ -22,23 +13,23 @@ export const Grid = createComponent(GridComponent, {
             name: "gridLayout",
             label: "Grid Layout",
             renderer: "Webiny/GridLayout",
-            onChange: ({ inputs, createElement: ce }) => {
+            onChange: ({ inputs, createElement: ce })=>{
                 const rowColumnCount = inputs.gridLayout.split("-").length;
                 const columns = inputs.columns.length;
                 const remainder = columns % rowColumnCount;
-
-                if (remainder !== 0) {
+                if (0 !== remainder) {
                     const fullColumnCount = rowColumnCount * inputs.rowCount;
-                    const toCreate =
-                        columns > fullColumnCount ? remainder : rowColumnCount - remainder;
-
-                    Array.from({ length: toCreate }).forEach(() => {
+                    const toCreate = columns > fullColumnCount ? remainder : rowColumnCount - remainder;
+                    Array.from({
+                        length: toCreate
+                    }).forEach(()=>{
                         inputs.columns.push({
-                            children: ce({ component: "Webiny/GridColumn" })
+                            children: ce({
+                                component: "Webiny/GridColumn"
+                            })
                         });
                     });
                 }
-
                 inputs.rowCount = inputs.columns.length / rowColumnCount;
             }
         }),
@@ -47,30 +38,25 @@ export const Grid = createComponent(GridComponent, {
             label: "Row Count",
             defaultValue: 1,
             minValue: 1,
-            onChange: ({ inputs, createElement: ce }) => {
+            onChange: ({ inputs, createElement: ce })=>{
                 const columnCount = inputs.gridLayout.split("-").length;
                 const rowCount = Math.max(1, inputs.rowCount);
                 const columns = inputs.columns;
-                const rows: unknown[][] = [];
-
-                for (let i = 0; i < columns.length; i += columnCount) {
-                    rows.push(columns.slice(i, i + columnCount));
-                }
-
+                const rows = [];
+                for(let i = 0; i < columns.length; i += columnCount)rows.push(columns.slice(i, i + columnCount));
                 if (rows.length > rowCount) {
                     inputs.columns = columns.slice(0, columnCount * rowCount);
                     return;
                 }
-
                 const createRows = Math.max(0, rowCount - rows.length);
-                if (createRows <= 0) {
-                    return;
-                }
-
-                const newRows = Array.from({ length: createRows * columnCount }).map(() => ({
-                    children: ce({ component: "Webiny/GridColumn" })
-                }));
-
+                if (createRows <= 0) return;
+                const newRows = Array.from({
+                    length: createRows * columnCount
+                }).map(()=>({
+                        children: ce({
+                            component: "Webiny/GridColumn"
+                        })
+                    }));
                 inputs.columns.push(...newRows);
             }
         }),
@@ -79,13 +65,10 @@ export const Grid = createComponent(GridComponent, {
             label: "Row Gap",
             defaultValue: 0,
             responsive: true,
-            onChange: ({ inputs, styles }) => {
+            onChange: ({ inputs, styles })=>{
                 const v = parseInt(inputs.rowGap);
-                if (isNaN(v)) {
-                    delete styles.rowGap;
-                } else {
-                    styles.rowGap = `${inputs.rowGap}px`;
-                }
+                if (isNaN(v)) delete styles.rowGap;
+                else styles.rowGap = `${inputs.rowGap}px`;
             }
         }),
         createNumberInput({
@@ -93,21 +76,24 @@ export const Grid = createComponent(GridComponent, {
             label: "Column Gap",
             defaultValue: 0,
             responsive: true,
-            onChange: ({ inputs, styles }) => {
+            onChange: ({ inputs, styles })=>{
                 const v = parseInt(inputs.columnGap);
-                if (isNaN(v)) {
-                    delete styles.columnGap;
-                } else {
-                    styles.columnGap = `${inputs.columnGap}px`;
-                }
+                if (isNaN(v)) delete styles.columnGap;
+                else styles.columnGap = `${inputs.columnGap}px`;
             }
         }),
         createSelectInput({
             name: "stackAtBreakpoint",
             label: "Stack at breakpoint",
             options: [
-                { label: "Tablet", value: "tablet" },
-                { label: "Mobile", value: "mobile" }
+                {
+                    label: "Tablet",
+                    value: "tablet"
+                },
+                {
+                    label: "Mobile",
+                    value: "mobile"
+                }
             ]
         }),
         createBooleanInput({
@@ -122,7 +108,9 @@ export const Grid = createComponent(GridComponent, {
                 createSlotInput({
                     name: "children",
                     list: false,
-                    components: ["Webiny/GridColumn"]
+                    components: [
+                        "Webiny/GridColumn"
+                    ]
                 })
             ]
         })
@@ -134,13 +122,25 @@ export const Grid = createComponent(GridComponent, {
                 {
                     children: createElement({
                         component: "Webiny/GridColumn",
-                        inputs: { children: [createElement({ component: "Webiny/Lexical" })] }
+                        inputs: {
+                            children: [
+                                createElement({
+                                    component: "Webiny/Lexical"
+                                })
+                            ]
+                        }
                     })
                 },
                 {
                     children: createElement({
                         component: "Webiny/GridColumn",
-                        inputs: { children: [createElement({ component: "Webiny/Lexical" })] }
+                        inputs: {
+                            children: [
+                                createElement({
+                                    component: "Webiny/Lexical"
+                                })
+                            ]
+                        }
                     })
                 }
             ]
@@ -164,3 +164,6 @@ export const Grid = createComponent(GridComponent, {
         }
     }
 });
+export { Grid };
+
+//# sourceMappingURL=Grid.manifest.js.map

package/editorComponents/Grid.manifest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/Grid.manifest.js","sources":["../../src/editorComponents/Grid.manifest.ts"],"sourcesContent":["\"use client\";\nimport {\n    createBooleanInput,\n    createElement,\n    createNumberInput,\n    createObjectInput,\n    createSelectInput,\n    createSlotInput,\n    createTextInput\n} from \"@webiny/website-builder-sdk\";\nimport { createComponent } from \"~/createComponent.js\";\nimport { GridComponent } from \"./Grid.js\";\n\nexport const Grid = createComponent(GridComponent, {\n    name: \"Webiny/Grid\",\n    label: \"Grid\",\n    image: `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#e8eaed\"><path d=\"M120-520v-320h320v320H120Zm0 400v-320h320v320H120Zm400-400v-320h320v320H520Zm0 400v-320h320v320H520ZM200-600h160v-160H200v160Zm400 0h160v-160H600v160Zm0 400h160v-160H600v160Zm-400 0h160v-160H200v160Zm400-400Zm0 240Zm-240 0Zm0-240Z\"/></svg>`,\n    group: \"basic\",\n    autoApplyStyles: false,\n    inputs: [\n        createTextInput({\n            name: \"gridLayout\",\n            label: \"Grid Layout\",\n            renderer: \"Webiny/GridLayout\",\n            onChange: ({ inputs, createElement: ce }) => {\n                const rowColumnCount = inputs.gridLayout.split(\"-\").length;\n                const columns = inputs.columns.length;\n                const remainder = columns % rowColumnCount;\n\n                if (remainder !== 0) {\n                    const fullColumnCount = rowColumnCount * inputs.rowCount;\n                    const toCreate =\n                        columns > fullColumnCount ? remainder : rowColumnCount - remainder;\n\n                    Array.from({ length: toCreate }).forEach(() => {\n                        inputs.columns.push({\n                            children: ce({ component: \"Webiny/GridColumn\" })\n                        });\n                    });\n                }\n\n                inputs.rowCount = inputs.columns.length / rowColumnCount;\n            }\n        }),\n        createNumberInput({\n            name: \"rowCount\",\n            label: \"Row Count\",\n            defaultValue: 1,\n            minValue: 1,\n            onChange: ({ inputs, createElement: ce }) => {\n                const columnCount = inputs.gridLayout.split(\"-\").length;\n                const rowCount = Math.max(1, inputs.rowCount);\n                const columns = inputs.columns;\n                const rows: unknown[][] = [];\n\n                for (let i = 0; i < columns.length; i += columnCount) {\n                    rows.push(columns.slice(i, i + columnCount));\n                }\n\n                if (rows.length > rowCount) {\n                    inputs.columns = columns.slice(0, columnCount * rowCount);\n                    return;\n                }\n\n                const createRows = Math.max(0, rowCount - rows.length);\n                if (createRows <= 0) {\n                    return;\n                }\n\n                const newRows = Array.from({ length: createRows * columnCount }).map(() => ({\n                    children: ce({ component: \"Webiny/GridColumn\" })\n                }));\n\n                inputs.columns.push(...newRows);\n            }\n        }),\n        createNumberInput({\n            name: \"rowGap\",\n            label: \"Row Gap\",\n            defaultValue: 0,\n            responsive: true,\n            onChange: ({ inputs, styles }) => {\n                const v = parseInt(inputs.rowGap);\n                if (isNaN(v)) {\n                    delete styles.rowGap;\n                } else {\n                    styles.rowGap = `${inputs.rowGap}px`;\n                }\n            }\n        }),\n        createNumberInput({\n            name: \"columnGap\",\n            label: \"Column Gap\",\n            defaultValue: 0,\n            responsive: true,\n            onChange: ({ inputs, styles }) => {\n                const v = parseInt(inputs.columnGap);\n                if (isNaN(v)) {\n                    delete styles.columnGap;\n                } else {\n                    styles.columnGap = `${inputs.columnGap}px`;\n                }\n            }\n        }),\n        createSelectInput({\n            name: \"stackAtBreakpoint\",\n            label: \"Stack at breakpoint\",\n            options: [\n                { label: \"Tablet\", value: \"tablet\" },\n                { label: \"Mobile\", value: \"mobile\" }\n            ]\n        }),\n        createBooleanInput({\n            name: \"reverseWhenStacked\",\n            label: \"Reverse columns when stacked\"\n        }),\n        createObjectInput({\n            name: \"columns\",\n            list: true,\n            hideFromUi: true,\n            fields: [\n                createSlotInput({\n                    name: \"children\",\n                    list: false,\n                    components: [\"Webiny/GridColumn\"]\n                })\n            ]\n        })\n    ],\n    defaults: {\n        inputs: {\n            gridLayout: \"6-6\",\n            columns: [\n                {\n                    children: createElement({\n                        component: \"Webiny/GridColumn\",\n                        inputs: { children: [createElement({ component: \"Webiny/Lexical\" })] }\n                    })\n                },\n                {\n                    children: createElement({\n                        component: \"Webiny/GridColumn\",\n                        inputs: { children: [createElement({ component: \"Webiny/Lexical\" })] }\n                    })\n                }\n            ]\n        },\n        styles: {\n            boxSizing: \"border-box\",\n            display: \"flex\",\n            flexDirection: \"row\",\n            flexWrap: \"wrap\",\n            justifyContent: \"flex-start\",\n            alignItems: \"stretch\",\n            width: \"100%\",\n            marginTop: \"0px\",\n            marginBottom: \"0px\",\n            marginLeft: \"0px\",\n            marginRight: \"0px\",\n            paddingTop: \"5px\",\n            paddingRight: \"5px\",\n            paddingBottom: \"5px\",\n            paddingLeft: \"5px\"\n        }\n    }\n});\n"],"names":["Grid","createComponent","GridComponent","createTextInput","inputs","ce","rowColumnCount","columns","remainder","fullColumnCount","toCreate","Array","createNumberInput","columnCount","rowCount","Math","rows","i","createRows","newRows","styles","v","parseInt","isNaN","createSelectInput","createBooleanInput","createObjectInput","createSlotInput","createElement"],"mappings":"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"}

package/editorComponents/GridColumn.d.ts

@@ -0,0 +1,5 @@
+import type { ComponentPropsWithChildren } from "../types.js";
+/** Renders only its children slot (the column content). */
+export declare const GridColumnComponent: (props: ComponentPropsWithChildren) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null;

package/editorComponents/GridColumn.js

@@ -0,0 +1,4 @@
+const GridColumnComponent = (props)=>props.inputs?.children ?? null;
+export { GridColumnComponent };
+
+//# sourceMappingURL=GridColumn.js.map

package/editorComponents/GridColumn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/GridColumn.js","sources":["../../src/editorComponents/GridColumn.ts"],"sourcesContent":["import type { ComponentPropsWithChildren } from \"~/types.js\";\n\n/** Renders only its children slot (the column content). */\nexport const GridColumnComponent = (props: ComponentPropsWithChildren) => {\n    return props.inputs?.children ?? null;\n};\n"],"names":["GridColumnComponent","props"],"mappings":"AAGO,MAAMA,sBAAsB,CAACC,QACzBA,MAAM,MAAM,EAAE,YAAY"}

package/editorComponents/GridColumn.manifest.d.ts

@@ -0,0 +1 @@
+export declare const GridColumn: import("@webiny/website-builder-sdk").Component;

package/{src/editorComponents/GridColumn.manifest.ts → editorComponents/GridColumn.manifest.js}

@@ -1,17 +1,18 @@
 "use client";
 import { StyleSettings } from "@webiny/website-builder-sdk";
-import { createComponent } from "~/createComponent.js";
+import { createComponent } from "../createComponent.js";
 import { GridColumnComponent } from "./GridColumn.js";
-
-export const GridColumn = createComponent(GridColumnComponent, {
+const GridColumn = createComponent(GridColumnComponent, {
     name: "Webiny/GridColumn",
     label: "Column",
-    image: `<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M600-120q-33 0-56.5-23.5T520-200v-560q0-33 23.5-56.5T600-840h160q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H600Zm0-640v560h160v-560H600ZM200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h160q33 0 56.5 23.5T440-760v560q0 33-23.5 56.5T360-120H200Zm0-640v560h160v-560H200Zm560 0H600h160Zm-400 0H200h160Z"/></svg>`,
+    image: '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M600-120q-33 0-56.5-23.5T520-200v-560q0-33 23.5-56.5T600-840h160q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H600Zm0-640v560h160v-560H600ZM200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h160q33 0 56.5 23.5T440-760v560q0 33-23.5 56.5T360-120H200Zm0-640v560h160v-560H200Zm560 0H600h160Zm-400 0H200h160Z"/></svg>',
     canDrag: false,
     canDelete: false,
     acceptsChildren: true,
     hideFromToolbar: true,
-    hideStyleSettings: [StyleSettings.Visibility],
+    hideStyleSettings: [
+        StyleSettings.Visibility
+    ],
     defaults: {
         styles: {
             paddingTop: "10px",
@@ -21,3 +22,6 @@ export const GridColumn = createComponent(GridColumnComponent, {
         }
     }
 });
+export { GridColumn };
+
+//# sourceMappingURL=GridColumn.manifest.js.map

package/editorComponents/GridColumn.manifest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/GridColumn.manifest.js","sources":["../../src/editorComponents/GridColumn.manifest.ts"],"sourcesContent":["\"use client\";\nimport { StyleSettings } from \"@webiny/website-builder-sdk\";\nimport { createComponent } from \"~/createComponent.js\";\nimport { GridColumnComponent } from \"./GridColumn.js\";\n\nexport const GridColumn = createComponent(GridColumnComponent, {\n    name: \"Webiny/GridColumn\",\n    label: \"Column\",\n    image: `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\" fill=\"#e8eaed\"><path d=\"M600-120q-33 0-56.5-23.5T520-200v-560q0-33 23.5-56.5T600-840h160q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H600Zm0-640v560h160v-560H600ZM200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h160q33 0 56.5 23.5T440-760v560q0 33-23.5 56.5T360-120H200Zm0-640v560h160v-560H200Zm560 0H600h160Zm-400 0H200h160Z\"/></svg>`,\n    canDrag: false,\n    canDelete: false,\n    acceptsChildren: true,\n    hideFromToolbar: true,\n    hideStyleSettings: [StyleSettings.Visibility],\n    defaults: {\n        styles: {\n            paddingTop: \"10px\",\n            paddingRight: \"10px\",\n            paddingBottom: \"10px\",\n            paddingLeft: \"10px\"\n        }\n    }\n});\n"],"names":["GridColumn","createComponent","GridColumnComponent","StyleSettings"],"mappings":";;;;AAKO,MAAMA,aAAaC,gBAAgBC,qBAAqB;IAC3D,MAAM;IACN,OAAO;IACP,OAAO;IACP,SAAS;IACT,WAAW;IACX,iBAAiB;IACjB,iBAAiB;IACjB,mBAAmB;QAACC,cAAc,UAAU;KAAC;IAC7C,UAAU;QACN,QAAQ;YACJ,YAAY;YACZ,cAAc;YACd,eAAe;YACf,aAAa;QACjB;IACJ;AACJ"}

package/editorComponents/Image.d.ts

@@ -0,0 +1,37 @@
+import { type PropType } from "vue";
+import type { CssProperties } from "@webiny/website-builder-sdk";
+type ImageInputs = {
+    title: string;
+    altText: string;
+    image: {
+        id: string;
+        name: string;
+        size: number;
+        mimeType: string;
+        src: string;
+    };
+};
+export declare const ImageComponent: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    inputs: {
+        type: PropType<ImageInputs>;
+        required: true;
+    };
+    styles: {
+        type: PropType<CssProperties>;
+        default: () => {};
+    };
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    inputs: {
+        type: PropType<ImageInputs>;
+        required: true;
+    };
+    styles: {
+        type: PropType<CssProperties>;
+        default: () => {};
+    };
+}>> & Readonly<{}>, {
+    styles: CssProperties;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export {};

package/editorComponents/Image.js

@@ -0,0 +1,115 @@
+import { Fragment, defineComponent, h, ref, watch } from "vue";
+import { contentSdk } from "@webiny/website-builder-sdk";
+const SUPPORTED_WIDTHS = [
+    100,
+    300,
+    500,
+    750,
+    1000,
+    1500,
+    2500
+];
+const getSrcSet = (src, widths)=>widths.map((w)=>`${src}?width=${w} ${w}w`).join(", ");
+const computeSrcSetWidths = (width)=>{
+    if (width && String(width).endsWith("px")) {
+        const px = parseInt(String(width));
+        const widths = [];
+        for (const w of SUPPORTED_WIDTHS){
+            widths.push(w);
+            if (w >= px) break;
+        }
+        return widths;
+    }
+    return SUPPORTED_WIDTHS;
+};
+const ImagePlaceholder = (props)=>h("div", {
+        style: {
+            display: "flex",
+            height: "200px",
+            backgroundColor: "#f4f4f4",
+            justifyContent: "center",
+            alignItems: "center",
+            fill: "#ffffff",
+            ...props.style
+        }
+    }, [
+        h("svg", {
+            style: {
+                width: "70px",
+                height: "70px",
+                filter: "drop-shadow(rgba(0, 0, 0, 0.16) 0px 1px 0px)"
+            },
+            xmlns: "http://www.w3.org/2000/svg",
+            height: "24px",
+            viewBox: "0 -960 960 960",
+            width: "24px"
+        }, [
+            h("path", {
+                d: "M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z"
+            })
+        ])
+    ]);
+const ImageComponent = defineComponent({
+    name: "WebinyImageComponent",
+    props: {
+        inputs: {
+            type: Object,
+            required: true
+        },
+        styles: {
+            type: Object,
+            default: ()=>({})
+        }
+    },
+    setup (props) {
+        const isLoaded = ref(!contentSdk.isEditing());
+        watch(()=>props.inputs?.image?.src, (src)=>{
+            if (!src) isLoaded.value = false;
+        });
+        function onLoad() {
+            if (contentSdk.isEditing()) setTimeout(()=>{
+                isLoaded.value = true;
+            }, 100);
+            else isLoaded.value = true;
+        }
+        return ()=>{
+            const { inputs, styles } = props;
+            const { title = "", altText, image } = inputs;
+            const src = image?.src;
+            if (!src) return h(ImagePlaceholder, {
+                style: styles
+            });
+            if (src.endsWith(".svg")) return h("object", {
+                style: {
+                    maxWidth: "100%",
+                    ...styles
+                },
+                title,
+                data: src
+            });
+            const imageStyles = {
+                maxWidth: "100%",
+                opacity: isLoaded.value ? 1 : 0,
+                transition: "opacity 0.3s ease",
+                ...styles
+            };
+            const srcSet = getSrcSet(src, computeSrcSetWidths(styles.width));
+            return h(Fragment, null, [
+                isLoaded.value ? null : h(ImagePlaceholder, {
+                    style: styles
+                }),
+                h("img", {
+                    alt: altText,
+                    title,
+                    src,
+                    srcset: srcSet,
+                    style: imageStyles,
+                    onLoad
+                })
+            ]);
+        };
+    }
+});
+export { ImageComponent };
+
+//# sourceMappingURL=Image.js.map

package/editorComponents/Image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/Image.js","sources":["../../src/editorComponents/Image.ts"],"sourcesContent":["import { defineComponent, ref, watch, h, Fragment, type PropType } from \"vue\";\nimport { contentSdk } from \"@webiny/website-builder-sdk\";\nimport type { CssProperties } from \"@webiny/website-builder-sdk\";\n\nconst SUPPORTED_WIDTHS = [100, 300, 500, 750, 1000, 1500, 2500];\n\ntype ImageInputs = {\n    title: string;\n    altText: string;\n    image: {\n        id: string;\n        name: string;\n        size: number;\n        mimeType: string;\n        src: string;\n    };\n};\n\nconst getSrcSet = (src: string, widths: number[]) =>\n    widths.map(w => `${src}?width=${w} ${w}w`).join(\", \");\n\nconst computeSrcSetWidths = (width?: string | number): number[] => {\n    if (width && String(width).endsWith(\"px\")) {\n        const px = parseInt(String(width));\n        const widths: number[] = [];\n        for (const w of SUPPORTED_WIDTHS) {\n            widths.push(w);\n            if (w >= px) {\n                break;\n            }\n        }\n        return widths;\n    }\n    return SUPPORTED_WIDTHS;\n};\n\nconst ImagePlaceholder = (props: { style: CssProperties }) =>\n    h(\n        \"div\",\n        {\n            style: {\n                display: \"flex\",\n                height: \"200px\",\n                backgroundColor: \"#f4f4f4\",\n                justifyContent: \"center\",\n                alignItems: \"center\",\n                fill: \"#ffffff\",\n                ...props.style\n            }\n        },\n        [\n            h(\n                \"svg\",\n                {\n                    style: {\n                        width: \"70px\",\n                        height: \"70px\",\n                        filter: \"drop-shadow(rgba(0, 0, 0, 0.16) 0px 1px 0px)\"\n                    },\n                    xmlns: \"http://www.w3.org/2000/svg\",\n                    height: \"24px\",\n                    viewBox: \"0 -960 960 960\",\n                    width: \"24px\"\n                },\n                [\n                    h(\"path\", {\n                        d: \"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z\"\n                    })\n                ]\n            )\n        ]\n    );\n\nexport const ImageComponent = defineComponent({\n    name: \"WebinyImageComponent\",\n    props: {\n        inputs: { type: Object as PropType<ImageInputs>, required: true },\n        styles: { type: Object as PropType<CssProperties>, default: () => ({}) }\n    },\n    setup(props) {\n        // In editing mode start as not-loaded (fade in after load).\n        // In live mode start as loaded (no fade effect needed).\n        const isLoaded = ref(!contentSdk.isEditing());\n\n        watch(\n            () => props.inputs?.image?.src,\n            src => {\n                if (!src) {\n                    isLoaded.value = false;\n                }\n            }\n        );\n\n        function onLoad() {\n            if (contentSdk.isEditing()) {\n                setTimeout(() => {\n                    isLoaded.value = true;\n                }, 100);\n            } else {\n                isLoaded.value = true;\n            }\n        }\n\n        return () => {\n            const { inputs, styles } = props;\n            const { title = \"\", altText, image } = inputs;\n            const src = image?.src;\n\n            if (!src) {\n                return h(ImagePlaceholder, { style: styles });\n            }\n\n            if (src.endsWith(\".svg\")) {\n                return h(\"object\", {\n                    style: { maxWidth: \"100%\", ...styles },\n                    title,\n                    data: src\n                });\n            }\n\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            const imageStyles: CssProperties = {\n                maxWidth: \"100%\",\n                opacity: isLoaded.value ? 1 : 0,\n                transition: \"opacity 0.3s ease\",\n                ...styles\n            } as any;\n\n            const srcSet = getSrcSet(src, computeSrcSetWidths(styles.width));\n\n            return h(Fragment, null, [\n                !isLoaded.value ? h(ImagePlaceholder, { style: styles }) : null,\n                h(\"img\", {\n                    alt: altText,\n                    title,\n                    src,\n                    srcset: srcSet,\n                    style: imageStyles,\n                    onLoad\n                })\n            ]);\n        };\n    }\n});\n"],"names":["SUPPORTED_WIDTHS","getSrcSet","src","widths","w","computeSrcSetWidths","width","String","px","parseInt","ImagePlaceholder","props","h","ImageComponent","defineComponent","Object","isLoaded","ref","contentSdk","watch","onLoad","setTimeout","inputs","styles","title","altText","image","imageStyles","srcSet","Fragment"],"mappings":";;AAIA,MAAMA,mBAAmB;IAAC;IAAK;IAAK;IAAK;IAAK;IAAM;IAAM;CAAK;AAc/D,MAAMC,YAAY,CAACC,KAAaC,SAC5BA,OAAO,GAAG,CAACC,CAAAA,IAAK,GAAGF,IAAI,OAAO,EAAEE,EAAE,CAAC,EAAEA,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC;AAEpD,MAAMC,sBAAsB,CAACC;IACzB,IAAIA,SAASC,OAAOD,OAAO,QAAQ,CAAC,OAAO;QACvC,MAAME,KAAKC,SAASF,OAAOD;QAC3B,MAAMH,SAAmB,EAAE;QAC3B,KAAK,MAAMC,KAAKJ,iBAAkB;YAC9BG,OAAO,IAAI,CAACC;YACZ,IAAIA,KAAKI,IACL;QAER;QACA,OAAOL;IACX;IACA,OAAOH;AACX;AAEA,MAAMU,mBAAmB,CAACC,QACtBC,EACI,OACA;QACI,OAAO;YACH,SAAS;YACT,QAAQ;YACR,iBAAiB;YACjB,gBAAgB;YAChB,YAAY;YACZ,MAAM;YACN,GAAGD,MAAM,KAAK;QAClB;IACJ,GACA;QACIC,EACI,OACA;YACI,OAAO;gBACH,OAAO;gBACP,QAAQ;gBACR,QAAQ;YACZ;YACA,OAAO;YACP,QAAQ;YACR,SAAS;YACT,OAAO;QACX,GACA;YACIA,EAAE,QAAQ;gBACN,GAAG;YACP;SACH;KAER;AAGF,MAAMC,iBAAiBC,gBAAgB;IAC1C,MAAM;IACN,OAAO;QACH,QAAQ;YAAE,MAAMC;YAAiC,UAAU;QAAK;QAChE,QAAQ;YAAE,MAAMA;YAAmC,SAAS,IAAO,EAAC;QAAG;IAC3E;IACA,OAAMJ,KAAK;QAGP,MAAMK,WAAWC,IAAI,CAACC,WAAW,SAAS;QAE1CC,MACI,IAAMR,MAAM,MAAM,EAAE,OAAO,KAC3BT,CAAAA;YACI,IAAI,CAACA,KACDc,SAAS,KAAK,GAAG;QAEzB;QAGJ,SAASI;YACL,IAAIF,WAAW,SAAS,IACpBG,WAAW;gBACPL,SAAS,KAAK,GAAG;YACrB,GAAG;iBAEHA,SAAS,KAAK,GAAG;QAEzB;QAEA,OAAO;YACH,MAAM,EAAEM,MAAM,EAAEC,MAAM,EAAE,GAAGZ;YAC3B,MAAM,EAAEa,QAAQ,EAAE,EAAEC,OAAO,EAAEC,KAAK,EAAE,GAAGJ;YACvC,MAAMpB,MAAMwB,OAAO;YAEnB,IAAI,CAACxB,KACD,OAAOU,EAAEF,kBAAkB;gBAAE,OAAOa;YAAO;YAG/C,IAAIrB,IAAI,QAAQ,CAAC,SACb,OAAOU,EAAE,UAAU;gBACf,OAAO;oBAAE,UAAU;oBAAQ,GAAGW,MAAM;gBAAC;gBACrCC;gBACA,MAAMtB;YACV;YAIJ,MAAMyB,cAA6B;gBAC/B,UAAU;gBACV,SAASX,SAAS,KAAK,GAAG,IAAI;gBAC9B,YAAY;gBACZ,GAAGO,MAAM;YACb;YAEA,MAAMK,SAAS3B,UAAUC,KAAKG,oBAAoBkB,OAAO,KAAK;YAE9D,OAAOX,EAAEiB,UAAU,MAAM;gBACpBb,SAAS,KAAK,GAA4C,OAAzCJ,EAAEF,kBAAkB;oBAAE,OAAOa;gBAAO;gBACtDX,EAAE,OAAO;oBACL,KAAKa;oBACLD;oBACAtB;oBACA,QAAQ0B;oBACR,OAAOD;oBACPP;gBACJ;aACH;QACL;IACJ;AACJ"}

package/editorComponents/Image.manifest.d.ts

@@ -0,0 +1 @@
+export declare const Image: import("@webiny/website-builder-sdk").Component;

package/{src/editorComponents/Image.manifest.ts → editorComponents/Image.manifest.js}

@@ -1,36 +1,41 @@
 "use client";
 import { createFileInput, createTextInput } from "@webiny/website-builder-sdk";
-import { createComponent } from "~/createComponent.js";
+import { createComponent } from "../createComponent.js";
 import { ImageComponent } from "./Image.js";
-
-// ImageComponent is a defineComponent result (object), not a plain function.
-// createComponent accepts any component type at runtime; cast to satisfy the
-// type constraint which is only used for input-type inference.
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const Image = createComponent(ImageComponent as unknown as (props: any) => any, {
+const Image = createComponent(ImageComponent, {
     name: "Webiny/Image",
     label: "Image",
     group: "basic",
-    image: `<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px"><path d="M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z"/></svg>`,
+    image: '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px"><path d="M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z"/></svg>',
     autoApplyStyles: false,
     inputs: {
         image: createFileInput({
             label: "Image",
-            allowedFileTypes: ["image/*"],
-            onChange: ({ inputs }) => {
+            allowedFileTypes: [
+                "image/*"
+            ],
+            onChange: ({ inputs })=>{
                 if (inputs.image) {
                     inputs.title = inputs.image.name;
                     inputs.altText = inputs.image.name;
                 }
             }
         }),
-        title: createTextInput({ label: "Title", description: "Title of the image" }),
+        title: createTextInput({
+            label: "Title",
+            description: "Title of the image"
+        }),
         altText: createTextInput({
             label: "Alternate Text",
             description: "Shown when the user has disabled images"
         })
     },
     defaults: {
-        styles: { width: "100%" }
+        styles: {
+            width: "100%"
+        }
     }
 });
+export { Image };
+
+//# sourceMappingURL=Image.manifest.js.map

package/editorComponents/Image.manifest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/Image.manifest.js","sources":["../../src/editorComponents/Image.manifest.ts"],"sourcesContent":["\"use client\";\nimport { createFileInput, createTextInput } from \"@webiny/website-builder-sdk\";\nimport { createComponent } from \"~/createComponent.js\";\nimport { ImageComponent } from \"./Image.js\";\n\n// ImageComponent is a defineComponent result (object), not a plain function.\n// createComponent accepts any component type at runtime; cast to satisfy the\n// type constraint which is only used for input-type inference.\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const Image = createComponent(ImageComponent as unknown as (props: any) => any, {\n    name: \"Webiny/Image\",\n    label: \"Image\",\n    group: \"basic\",\n    image: `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\"><path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z\"/></svg>`,\n    autoApplyStyles: false,\n    inputs: {\n        image: createFileInput({\n            label: \"Image\",\n            allowedFileTypes: [\"image/*\"],\n            onChange: ({ inputs }) => {\n                if (inputs.image) {\n                    inputs.title = inputs.image.name;\n                    inputs.altText = inputs.image.name;\n                }\n            }\n        }),\n        title: createTextInput({ label: \"Title\", description: \"Title of the image\" }),\n        altText: createTextInput({\n            label: \"Alternate Text\",\n            description: \"Shown when the user has disabled images\"\n        })\n    },\n    defaults: {\n        styles: { width: \"100%\" }\n    }\n});\n"],"names":["Image","createComponent","ImageComponent","createFileInput","inputs","createTextInput"],"mappings":";;;;AASO,MAAMA,QAAQC,gBAAgBC,gBAAkD;IACnF,MAAM;IACN,OAAO;IACP,OAAO;IACP,OAAO;IACP,iBAAiB;IACjB,QAAQ;QACJ,OAAOC,gBAAgB;YACnB,OAAO;YACP,kBAAkB;gBAAC;aAAU;YAC7B,UAAU,CAAC,EAAEC,MAAM,EAAE;gBACjB,IAAIA,OAAO,KAAK,EAAE;oBACdA,OAAO,KAAK,GAAGA,OAAO,KAAK,CAAC,IAAI;oBAChCA,OAAO,OAAO,GAAGA,OAAO,KAAK,CAAC,IAAI;gBACtC;YACJ;QACJ;QACA,OAAOC,gBAAgB;YAAE,OAAO;YAAS,aAAa;QAAqB;QAC3E,SAASA,gBAAgB;YACrB,OAAO;YACP,aAAa;QACjB;IACJ;IACA,UAAU;QACN,QAAQ;YAAE,OAAO;QAAO;IAC5B;AACJ"}

package/editorComponents/Lexical.d.ts

@@ -0,0 +1,18 @@
+import type { ComponentProps } from "../types.js";
+export declare const createLexicalValue: (value: string) => {
+    state: string;
+    html: string;
+};
+type LexicalProps = ComponentProps<{
+    content: {
+        html?: string;
+    };
+}>;
+/**
+ * Renders Lexical rich-text content as raw HTML.
+ * The HTML is produced by the editor and stored in `inputs.content.html`.
+ */
+export declare const LexicalComponent: (props: LexicalProps) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null;
+export {};

package/editorComponents/Lexical.js

@@ -0,0 +1,15 @@
+import { h } from "vue";
+const createLexicalValue = (value)=>({
+        state: `{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"${value}","type":"text","version":1}],"direction":"ltr","format":"","indent":0,"type":"wby-paragraph","version":1,"textFormat":0,"textStyle":""}],"direction":"ltr","format":"","indent":0,"type":"root","version":1}}`,
+        html: `<p class="wb-paragraph-1">${value}</p>`
+    });
+const LexicalComponent = (props)=>{
+    const html = props.inputs?.content?.html;
+    if (!html) return null;
+    return h("div", {
+        innerHTML: html
+    });
+};
+export { LexicalComponent, createLexicalValue };
+
+//# sourceMappingURL=Lexical.js.map

package/editorComponents/Lexical.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/Lexical.js","sources":["../../src/editorComponents/Lexical.ts"],"sourcesContent":["import { h } from \"vue\";\nimport type { ComponentProps } from \"~/types.js\";\n\nexport const createLexicalValue = (value: string) => ({\n    state: `{\"root\":{\"children\":[{\"children\":[{\"detail\":0,\"format\":0,\"mode\":\"normal\",\"style\":\"\",\"text\":\"${value}\",\"type\":\"text\",\"version\":1}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":0,\"type\":\"wby-paragraph\",\"version\":1,\"textFormat\":0,\"textStyle\":\"\"}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":0,\"type\":\"root\",\"version\":1}}`,\n    html: `<p class=\"wb-paragraph-1\">${value}</p>`\n});\n\ntype LexicalProps = ComponentProps<{\n    content: { html?: string };\n}>;\n\n/**\n * Renders Lexical rich-text content as raw HTML.\n * The HTML is produced by the editor and stored in `inputs.content.html`.\n */\nexport const LexicalComponent = (props: LexicalProps) => {\n    const html = props.inputs?.content?.html;\n    if (!html) {\n        return null;\n    }\n    return h(\"div\", { innerHTML: html });\n};\n"],"names":["createLexicalValue","value","LexicalComponent","props","html","h"],"mappings":";AAGO,MAAMA,qBAAqB,CAACC,QAAmB;QAClD,OAAO,CAAC,4FAA4F,EAAEA,MAAM,8MAA8M,CAAC;QAC3T,MAAM,CAAC,0BAA0B,EAAEA,MAAM,IAAI,CAAC;IAClD;AAUO,MAAMC,mBAAmB,CAACC;IAC7B,MAAMC,OAAOD,MAAM,MAAM,EAAE,SAAS;IACpC,IAAI,CAACC,MACD,OAAO;IAEX,OAAOC,EAAE,OAAO;QAAE,WAAWD;IAAK;AACtC"}

package/editorComponents/Lexical.manifest.d.ts

@@ -0,0 +1 @@
+export declare const Lexical: import("@webiny/website-builder-sdk").Component;

package/editorComponents/Lexical.manifest.js

@@ -0,0 +1,24 @@
+"use client";
+import { createLexicalInput } from "@webiny/website-builder-sdk";
+import { createComponent } from "../createComponent.js";
+import { LexicalComponent, createLexicalValue } from "./Lexical.js";
+const Lexical = createComponent(LexicalComponent, {
+    name: "Webiny/Lexical",
+    label: "Rich Text",
+    group: "basic",
+    image: '<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px"><path d="M280-160v-520H80v-120h520v120H400v520H280Zm360 0v-320H520v-120h360v120H760v320H640Z"/></svg>',
+    inputs: [
+        createLexicalInput({
+            name: "content",
+            label: "Content"
+        })
+    ],
+    defaults: {
+        inputs: {
+            content: createLexicalValue("Examine she brother prudent add day ham. Far stairs now coming bed oppose hunted become his. You zealously departure had procuring suspicion. Books whose front would purse if be do decay. Quitting you way formerly disposed perceive ladyship are. Common turned boy direct and yet.")
+        }
+    }
+});
+export { Lexical };
+
+//# sourceMappingURL=Lexical.manifest.js.map

package/editorComponents/Lexical.manifest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/Lexical.manifest.js","sources":["../../src/editorComponents/Lexical.manifest.ts"],"sourcesContent":["\"use client\";\nimport { createLexicalInput } from \"@webiny/website-builder-sdk\";\nimport { createComponent } from \"~/createComponent.js\";\nimport { LexicalComponent, createLexicalValue } from \"./Lexical.js\";\n\nexport const Lexical = createComponent(LexicalComponent, {\n    name: \"Webiny/Lexical\",\n    label: \"Rich Text\",\n    group: \"basic\",\n    image: `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 -960 960 960\" width=\"24px\"><path d=\"M280-160v-520H80v-120h520v120H400v520H280Zm360 0v-320H520v-120h360v120H760v320H640Z\"/></svg>`,\n    inputs: [\n        createLexicalInput({\n            name: \"content\",\n            label: \"Content\"\n        })\n    ],\n    defaults: {\n        inputs: {\n            content: createLexicalValue(\n                \"Examine she brother prudent add day ham. Far stairs now coming bed oppose hunted become his. You zealously departure had procuring suspicion. Books whose front would purse if be do decay. Quitting you way formerly disposed perceive ladyship are. Common turned boy direct and yet.\"\n            )\n        }\n    }\n});\n"],"names":["Lexical","createComponent","LexicalComponent","createLexicalInput","createLexicalValue"],"mappings":";;;;AAKO,MAAMA,UAAUC,gBAAgBC,kBAAkB;IACrD,MAAM;IACN,OAAO;IACP,OAAO;IACP,OAAO;IACP,QAAQ;QACJC,mBAAmB;YACf,MAAM;YACN,OAAO;QACX;KACH;IACD,UAAU;QACN,QAAQ;YACJ,SAASC,mBACL;QAER;IACJ;AACJ"}

package/editorComponents/Root.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentPropsWithChildren } from "../types.js";
+/**
+ * The invisible root container — renders only its children slot.
+ */
+export declare const RootComponent: (props: ComponentPropsWithChildren) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null;

package/editorComponents/Root.js

@@ -0,0 +1,4 @@
+const RootComponent = (props)=>props.inputs?.children ?? null;
+export { RootComponent };
+
+//# sourceMappingURL=Root.js.map

package/editorComponents/Root.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/Root.js","sources":["../../src/editorComponents/Root.ts"],"sourcesContent":["import type { ComponentPropsWithChildren } from \"~/types.js\";\n\n/**\n * The invisible root container — renders only its children slot.\n */\nexport const RootComponent = (props: ComponentPropsWithChildren) => {\n    return props.inputs?.children ?? null;\n};\n"],"names":["RootComponent","props"],"mappings":"AAKO,MAAMA,gBAAgB,CAACC,QACnBA,MAAM,MAAM,EAAE,YAAY"}

package/editorComponents/Root.manifest.d.ts

@@ -0,0 +1 @@
+export declare const Root: import("@webiny/website-builder-sdk/types.js").Component;

package/editorComponents/Root.manifest.js

@@ -0,0 +1,13 @@
+"use client";
+import { createComponent } from "../createComponent.js";
+import { RootComponent } from "./Root.js";
+const Root = createComponent(RootComponent, {
+    name: "Webiny/Root",
+    label: "Main Content",
+    acceptsChildren: true,
+    hideFromToolbar: true,
+    useInAiContentGeneration: false
+});
+export { Root };
+
+//# sourceMappingURL=Root.manifest.js.map

package/editorComponents/Root.manifest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/Root.manifest.js","sources":["../../src/editorComponents/Root.manifest.ts"],"sourcesContent":["\"use client\";\nimport { createComponent } from \"~/createComponent.js\";\nimport { RootComponent } from \"./Root.js\";\n\nexport const Root = createComponent(RootComponent, {\n    name: \"Webiny/Root\",\n    label: \"Main Content\",\n    acceptsChildren: true,\n    hideFromToolbar: true,\n    useInAiContentGeneration: false\n});\n"],"names":["Root","createComponent","RootComponent"],"mappings":";;;AAIO,MAAMA,OAAOC,gBAAgBC,eAAe;IAC/C,MAAM;IACN,OAAO;IACP,iBAAiB;IACjB,iBAAiB;IACjB,0BAA0B;AAC9B"}