@webiny/website-builder-nextjs 0.0.0-unstable.8b6c57b569 → 0.0.0-unstable.9f53ea597d

package/DocumentRenderer.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { DocumentRenderer as BaseDocumentRenderer } from "@webiny/website-builder-react";
+export type DocumentRendererProps = React.ComponentProps<typeof BaseDocumentRenderer>;
+export declare const DocumentRenderer: ({ document, components, children }: DocumentRendererProps) => React.JSX.Element;

package/DocumentRenderer.js

@@ -0,0 +1,16 @@
+import react from "react";
+import { DocumentRenderer } from "@webiny/website-builder-react";
+import { Image } from "./editorComponents/Image.manifest.js";
+const DocumentRenderer_DocumentRenderer = ({ document, components, children })=>{
+    const allComponents = [
+        Image,
+        ...components
+    ];
+    return /*#__PURE__*/ react.createElement(DocumentRenderer, {
+        document: document,
+        components: allComponents
+    }, children);
+};
+export { DocumentRenderer_DocumentRenderer as DocumentRenderer };
+
+//# sourceMappingURL=DocumentRenderer.js.map

package/DocumentRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DocumentRenderer.js","sources":["../src/DocumentRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { DocumentRenderer as BaseDocumentRenderer } from \"@webiny/website-builder-react\";\nimport { Image } from \"~/editorComponents/Image.manifest.js\";\n\nexport type DocumentRendererProps = React.ComponentProps<typeof BaseDocumentRenderer>;\n\nexport const DocumentRenderer = ({ document, components, children }: DocumentRendererProps) => {\n    const allComponents = [Image, ...components];\n    return (\n        <BaseDocumentRenderer document={document} components={allComponents}>\n            {children}\n        </BaseDocumentRenderer>\n    );\n};\n"],"names":["DocumentRenderer","document","components","children","allComponents","Image","BaseDocumentRenderer"],"mappings":";;;AAMO,MAAMA,oCAAmB,CAAC,EAAEC,QAAQ,EAAEC,UAAU,EAAEC,QAAQ,EAAyB;IACtF,MAAMC,gBAAgB;QAACC;WAAUH;KAAW;IAC5C,OAAO,WAAP,GACI,oBAACI,kBAAoBA;QAAC,UAAUL;QAAU,YAAYG;OACjDD;AAGb"}

package/README.md

@@ -1,3 +1,11 @@
-# Webiny Website Builder Next.js SDK
+# @webiny/website-builder-nextjs
 
-A Next.js integration SDK for Webiny Website Builder. 
+> [!NOTE]
+> This package is part of the [Webiny](https://www.webiny.com) monorepo.
+> It’s **included in every Webiny project by default** and is not meant to be used as a standalone package.
+
+📘 **Documentation:** [https://www.webiny.com/docs](https://www.webiny.com/docs)
+
+---
+
+_This README file is automatically generated during the publish process._

package/editorComponents/Image.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import type { ComponentProps, Asset } from "@webiny/website-builder-react";
+type ImageProps = ComponentProps<{
+    title: string;
+    altText: string;
+    highPriority: boolean;
+    image: Asset;
+}>;
+export declare const ImageComponent: (props: ImageProps) => React.JSX.Element;
+export {};

package/editorComponents/Image.js

@@ -0,0 +1,81 @@
+import react from "react";
+import next_image from "next/image";
+import { getAssetUrl, getImageDimensions, getImageSrcSet, normalizeToAsset } from "@webiny/website-builder-react";
+const ImageComponent = (props)=>{
+    const { title = "", altText, image, highPriority } = props.inputs;
+    const asset = normalizeToAsset(image);
+    if (!asset?.src) return /*#__PURE__*/ react.createElement(ImagePlaceholder, {
+        style: props.styles
+    });
+    const alt = altText || asset.image?.alt || "";
+    if (asset.src.endsWith(".svg")) return /*#__PURE__*/ react.createElement("object", {
+        style: {
+            maxWidth: "100%",
+            ...props.styles
+        },
+        title: title,
+        data: asset.src
+    });
+    const loader = ({ width })=>getAssetUrl(asset, {
+            width,
+            format: "auto"
+        });
+    const { width, height } = getImageDimensions(asset);
+    const style = {
+        maxWidth: "100%",
+        height: "auto",
+        ...props.styles
+    };
+    if (!width || !height) {
+        const { src, srcSet } = getImageSrcSet(asset, {
+            format: "auto",
+            cssWidth: props.styles?.width
+        });
+        return /*#__PURE__*/ react.createElement("img", {
+            src: src,
+            srcSet: srcSet,
+            sizes: "100vw",
+            alt: alt,
+            title: title || void 0,
+            loading: highPriority ? "eager" : "lazy",
+            style: style
+        });
+    }
+    return /*#__PURE__*/ react.createElement(next_image, {
+        src: asset.src,
+        loader: loader,
+        alt: alt,
+        title: title || void 0,
+        width: width,
+        height: height,
+        sizes: "100vw",
+        priority: highPriority,
+        style: style
+    });
+};
+const ImagePlaceholder = ({ style })=>/*#__PURE__*/ react.createElement("div", {
+        style: {
+            display: "flex",
+            height: "200px",
+            backgroundColor: "#f4f4f4",
+            justifyContent: "center",
+            alignItems: "center",
+            fill: "#ffffff",
+            ...style
+        }
+    }, /*#__PURE__*/ react.createElement("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"
+    }, /*#__PURE__*/ react.createElement("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"
+    })));
+export { ImageComponent };
+
+//# sourceMappingURL=Image.js.map

package/editorComponents/Image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorComponents/Image.js","sources":["../../src/editorComponents/Image.tsx"],"sourcesContent":["import React from \"react\";\nimport NextImage from \"next/image\";\nimport type { ComponentProps, CssProperties, Asset } from \"@webiny/website-builder-react\";\nimport {\n    getAssetUrl,\n    getImageDimensions,\n    getImageSrcSet,\n    normalizeToAsset\n} from \"@webiny/website-builder-react\";\n\ntype ImageProps = ComponentProps<{\n    title: string;\n    altText: string;\n    highPriority: boolean;\n    // Accepts the unified asset shape or a legacy value (existing pages).\n    image: Asset;\n}>;\n\nexport const ImageComponent = (props: ImageProps) => {\n    const { title = \"\", altText, image, highPriority } = props.inputs;\n    const asset = normalizeToAsset(image);\n\n    if (!asset?.src) {\n        return <ImagePlaceholder style={props.styles} />;\n    }\n\n    const alt = altText || asset.image?.alt || \"\";\n\n    // SVGs are vector — nothing to crop, resize, or re-encode.\n    if (asset.src.endsWith(\".svg\")) {\n        return (\n            <object style={{ maxWidth: \"100%\", ...props.styles }} title={title} data={asset.src} />\n        );\n    }\n\n    // The delivery bakes the per-usage crop (`?crop`), resizes (`?width`), and serves\n    // a modern format negotiated from Accept (`?format=auto`). We hand `next/image` a\n    // loader that builds that URL, and it drives the responsive `srcSet`.\n    const loader = ({ width }: { width: number }) => getAssetUrl(asset, { width, format: \"auto\" });\n\n    // Intrinsic size of the *delivered* (cropped) image, so next/image lays out at\n    // the correct aspect ratio. Falls back to a plain <img> when dimensions are\n    // unknown (next/image requires width + height unless `fill`).\n    const { width, height } = getImageDimensions(asset);\n\n    const style: CssProperties = { maxWidth: \"100%\", height: \"auto\", ...props.styles };\n\n    if (!width || !height) {\n        // No intrinsic size to lay out with — fall back to a plain <img>, still\n        // responsive via the SDK's framework-agnostic srcSet (crop/format baked in).\n        const { src, srcSet } = getImageSrcSet(asset, {\n            format: \"auto\",\n            cssWidth: props.styles?.width\n        });\n        // eslint-disable-next-line @next/next/no-img-element\n        return (\n            <img\n                src={src}\n                srcSet={srcSet}\n                sizes=\"100vw\"\n                alt={alt}\n                title={title || undefined}\n                loading={highPriority ? \"eager\" : \"lazy\"}\n                style={style}\n            />\n        );\n    }\n\n    return (\n        <NextImage\n            src={asset.src}\n            loader={loader}\n            alt={alt}\n            title={title || undefined}\n            width={width}\n            height={height}\n            sizes={\"100vw\"}\n            priority={highPriority}\n            style={style}\n        />\n    );\n};\n\nconst ImagePlaceholder = ({ style }: { style: CssProperties }) => {\n    return (\n        <div\n            style={{\n                display: \"flex\",\n                height: \"200px\",\n                backgroundColor: \"#f4f4f4\",\n                justifyContent: \"center\",\n                alignItems: \"center\",\n                fill: \"#ffffff\",\n                ...style\n            }}\n        >\n            <svg\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                <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\" />\n            </svg>\n        </div>\n    );\n};\n"],"names":["ImageComponent","props","title","altText","image","highPriority","asset","normalizeToAsset","ImagePlaceholder","alt","loader","width","getAssetUrl","height","getImageDimensions","style","src","srcSet","getImageSrcSet","undefined","NextImage"],"mappings":";;;AAkBO,MAAMA,iBAAiB,CAACC;IAC3B,MAAM,EAAEC,QAAQ,EAAE,EAAEC,OAAO,EAAEC,KAAK,EAAEC,YAAY,EAAE,GAAGJ,MAAM,MAAM;IACjE,MAAMK,QAAQC,iBAAiBH;IAE/B,IAAI,CAACE,OAAO,KACR,OAAO,WAAP,GAAO,oBAACE,kBAAgBA;QAAC,OAAOP,MAAM,MAAM;;IAGhD,MAAMQ,MAAMN,WAAWG,MAAM,KAAK,EAAE,OAAO;IAG3C,IAAIA,MAAM,GAAG,CAAC,QAAQ,CAAC,SACnB,OAAO,WAAP,GACI,oBAAC;QAAO,OAAO;YAAE,UAAU;YAAQ,GAAGL,MAAM,MAAM;QAAC;QAAG,OAAOC;QAAO,MAAMI,MAAM,GAAG;;IAO3F,MAAMI,SAAS,CAAC,EAAEC,KAAK,EAAqB,GAAKC,YAAYN,OAAO;YAAEK;YAAO,QAAQ;QAAO;IAK5F,MAAM,EAAEA,KAAK,EAAEE,MAAM,EAAE,GAAGC,mBAAmBR;IAE7C,MAAMS,QAAuB;QAAE,UAAU;QAAQ,QAAQ;QAAQ,GAAGd,MAAM,MAAM;IAAC;IAEjF,IAAI,CAACU,SAAS,CAACE,QAAQ;QAGnB,MAAM,EAAEG,GAAG,EAAEC,MAAM,EAAE,GAAGC,eAAeZ,OAAO;YAC1C,QAAQ;YACR,UAAUL,MAAM,MAAM,EAAE;QAC5B;QAEA,OAAO,WAAP,GACI,oBAAC;YACG,KAAKe;YACL,QAAQC;YACR,OAAM;YACN,KAAKR;YACL,OAAOP,SAASiB;YAChB,SAASd,eAAe,UAAU;YAClC,OAAOU;;IAGnB;IAEA,OAAO,WAAP,GACI,oBAACK,YAASA;QACN,KAAKd,MAAM,GAAG;QACd,QAAQI;QACR,KAAKD;QACL,OAAOP,SAASiB;QAChB,OAAOR;QACP,QAAQE;QACR,OAAO;QACP,UAAUR;QACV,OAAOU;;AAGnB;AAEA,MAAMP,mBAAmB,CAAC,EAAEO,KAAK,EAA4B,GAClD,WAAP,GACI,oBAAC;QACG,OAAO;YACH,SAAS;YACT,QAAQ;YACR,iBAAiB;YACjB,gBAAgB;YAChB,YAAY;YACZ,MAAM;YACN,GAAGA,KAAK;QACZ;qBAEA,oBAAC;QACG,OAAO;YACH,OAAO;YACP,QAAQ;YACR,QAAQ;QACZ;QACA,OAAM;QACN,QAAO;QACP,SAAQ;QACR,OAAM;qBAEN,oBAAC;QAAK,GAAE"}

package/editorComponents/Image.manifest.d.ts

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

package/editorComponents/Image.manifest.js

@@ -0,0 +1,45 @@
+"use client";
+import { createBooleanInput, createComponent, createFileInput, createTextInput } from "@webiny/website-builder-react";
+import { ImageComponent } from "./Image.js";
+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>',
+    autoApplyStyles: false,
+    inputs: {
+        image: createFileInput({
+            label: "Image",
+            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"
+        }),
+        altText: createTextInput({
+            label: "Alternate Text",
+            description: "Shown when the user has disabled images"
+        }),
+        highPriority: createBooleanInput({
+            label: "High Priority",
+            description: "Prioritize this image loading over other images on the page",
+            defaultValue: false
+        })
+    },
+    defaults: {
+        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 {\n    createFileInput,\n    createTextInput,\n    createBooleanInput,\n    createComponent\n} from \"@webiny/website-builder-react\";\nimport { ImageComponent } from \"./Image.js\";\n\nexport const Image = createComponent(ImageComponent, {\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({\n            label: \"Title\",\n            description: \"Title of the image\"\n        }),\n        altText: createTextInput({\n            label: \"Alternate Text\",\n            description: \"Shown when the user has disabled images\"\n        }),\n        highPriority: createBooleanInput({\n            label: \"High Priority\",\n            description: \"Prioritize this image loading over other images on the page\",\n            defaultValue: false\n        })\n    },\n    defaults: {\n        styles: {\n            width: \"100%\"\n        }\n    }\n});\n"],"names":["Image","createComponent","ImageComponent","createFileInput","inputs","createTextInput","createBooleanInput"],"mappings":";;;AASO,MAAMA,QAAQC,gBAAgBC,gBAAgB;IACjD,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;YACnB,OAAO;YACP,aAAa;QACjB;QACA,SAASA,gBAAgB;YACrB,OAAO;YACP,aAAa;QACjB;QACA,cAAcC,mBAAmB;YAC7B,OAAO;YACP,aAAa;YACb,cAAc;QAClB;IACJ;IACA,UAAU;QACN,QAAQ;YACJ,OAAO;QACX;IACJ;AACJ"}

package/index.d.ts

@@ -1,2 +1,2 @@
 export * from "@webiny/website-builder-react";
-export * from "./useCss";
+export { DocumentRenderer } from "./DocumentRenderer.js";

package/index.js

@@ -1,13 +1,9 @@
-export * from "@webiny/website-builder-react";
-export * from "./useCss";
 import { setHeadersProvider } from "@webiny/website-builder-react";
-setHeadersProvider(async () => {
-  // Settings @ts-expect-error breaks the build if the dependency is installed in the repo.
-  // @ts-ignore This is a peer dependency.
-  const {
-    headers
-  } = await import("next/headers");
-  return await headers();
+export * from "@webiny/website-builder-react";
+setHeadersProvider(async ()=>{
+    const { headers } = await import("next/headers.js");
+    return await headers();
 });
+export { DocumentRenderer } from "./DocumentRenderer.js";
 
 //# sourceMappingURL=index.js.map

package/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["setHeadersProvider","headers"],"sources":["index.ts"],"sourcesContent":["export * from \"@webiny/website-builder-react\";\nexport * from \"./useCss\";\n\nimport { setHeadersProvider } from \"@webiny/website-builder-react\";\n\nsetHeadersProvider(async () => {\n    // Settings @ts-expect-error breaks the build if the dependency is installed in the repo.\n    // @ts-ignore This is a peer dependency.\n    const { headers } = await import(\"next/headers\");\n    return await headers();\n});\n"],"mappings":"AAAA,cAAc,+BAA+B;AAC7C;AAEA,SAASA,kBAAkB,QAAQ,+BAA+B;AAElEA,kBAAkB,CAAC,YAAY;EAC3B;EACA;EACA,MAAM;IAAEC;EAAQ,CAAC,GAAG,MAAM,MAAM,CAAC,cAAc,CAAC;EAChD,OAAO,MAAMA,OAAO,CAAC,CAAC;AAC1B,CAAC,CAAC","ignoreList":[]}
+{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["export * from \"@webiny/website-builder-react\";\nexport { DocumentRenderer } from \"./DocumentRenderer.js\";\n\nimport { setHeadersProvider } from \"@webiny/website-builder-react\";\n\nsetHeadersProvider(async () => {\n    // Settings @ts-expect-error breaks the build if the dependency is installed in the repo.\n    // @ts-ignore This is a peer dependency.\n    const { headers } = await import(\"next/headers.js\");\n    return await headers();\n});\n"],"names":["setHeadersProvider","headers"],"mappings":";;AAKAA,mBAAmB;IAGf,MAAM,EAAEC,OAAO,EAAE,GAAG,MAAM,MAAM,CAAC;IACjC,OAAO,MAAMA;AACjB"}

package/lexical.css

@@ -0,0 +1,379 @@
+.wb-lx-ltr {
+  text-align: inherit;
+}
+.wb-lx-rtl {
+  text-align: inherit;
+}
+.wb-lx-paragraph {
+}
+
+.wb-lx-quote {
+}
+
+.wb-lx-h1,
+.wb-lx-h2,
+.wb-lx-h3,
+.wb-lx-h4,
+.wb-lx-h5,
+.wb-lx-h6 {
+}
+
+.wb-lx-textBold {
+  font-weight: bold;
+}
+
+.wb-lx-textItalic {
+  font-style: italic;
+}
+.wb-lx-textUnderline {
+  text-decoration: underline;
+}
+.wb-lx-textStrikethrough {
+  text-decoration: line-through;
+}
+.wb-lx-textUnderlineStrikethrough {
+  text-decoration: underline line-through;
+}
+
+.wb-lx-textSubscript {
+  font-size: 0.8em;
+  vertical-align: sub !important;
+}
+
+.wb-lx-textSuperscript {
+  font-size: 0.8em;
+  vertical-align: super;
+}
+
+.wb-lx-textCode {
+  background-color: rgb(240, 242, 245);
+  padding: 1px 0.25rem;
+  font-family: Menlo, Consolas, Monaco, monospace;
+  font-size: 94%;
+}
+.wb-lx-hashtag {
+  background-color: rgba(88, 144, 255, 0.15);
+  border-bottom: 1px solid rgba(88, 144, 255, 0.3);
+}
+.wb-lx-link {
+  color: var(--wb-theme-color1);
+  text-decoration: none;
+  > * {
+    color: inherit !important;
+  }
+}
+.wb-lx-link:hover {
+  text-decoration: underline;
+}
+.wb-lx-code {
+  background-color: rgb(240, 242, 245);
+  font-family: Menlo, Consolas, Monaco, monospace;
+  display: block;
+  padding: 8px 8px 8px 52px;
+  line-height: 1.53;
+  font-size: 13px;
+  margin: 8px 0;
+  tab-size: 2;
+  /* white-space: pre; */
+  overflow-x: auto;
+  position: relative;
+}
+.wb-lx-code:before {
+  content: attr(data-gutter);
+  position: absolute;
+  background-color: #eee;
+  left: 0;
+  top: 0;
+  border-right: 1px solid #ccc;
+  padding: 8px;
+  color: #777;
+  white-space: pre-wrap;
+  text-align: right;
+  min-width: 25px;
+}
+.wb-lx-table {
+  border-collapse: collapse;
+  border-spacing: 0;
+  max-width: 100%;
+  overflow-y: scroll;
+  table-layout: fixed;
+  width: calc(100% - 25px);
+  margin: 30px 0;
+}
+.wb-lx-tableSelected {
+  outline: 2px solid rgb(60, 132, 244);
+}
+.wb-lx-tableCell {
+  border: 1px solid #bbb;
+  min-width: 75px;
+  vertical-align: top;
+  text-align: start;
+  padding: 6px 8px;
+  position: relative;
+  cursor: default;
+  outline: none;
+}
+.wb-lx-tableCellSortedIndicator {
+  display: block;
+  opacity: 0.5;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 4px;
+  background-color: #999;
+}
+.wb-lx-tableCellResizer {
+  position: absolute;
+  right: -4px;
+  height: 100%;
+  width: 8px;
+  cursor: ew-resize;
+  z-index: 10;
+  top: 0;
+}
+.wb-lx-tableCellHeader {
+  background-color: #f2f3f5;
+  text-align: start;
+}
+.wb-lx-tableCellSelected {
+  background-color: #c9dbf0;
+}
+.wb-lx-tableCellPrimarySelected {
+  border: 2px solid rgb(60, 132, 244);
+  display: block;
+  height: calc(100% - 2px);
+  position: absolute;
+  width: calc(100% - 2px);
+  left: -1px;
+  top: -1px;
+  z-index: 2;
+}
+.wb-lx-tableCellEditing {
+  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
+  border-radius: 3px;
+}
+.wb-lx-tableAddColumns {
+  position: absolute;
+  top: 0;
+  width: 20px;
+  background-color: #eee;
+  height: 100%;
+  right: 0;
+  animation: table-controls 0.2s ease;
+  border: 0;
+  cursor: pointer;
+}
+
+.wb-lx-tableAddColumns:hover {
+  background-color: #c9dbf0;
+}
+.wb-lx-tableAddRows {
+  position: absolute;
+  bottom: -25px;
+  width: calc(100% - 25px);
+  background-color: #eee;
+  height: 20px;
+  left: 0;
+  animation: table-controls 0.2s ease;
+  border: 0;
+  cursor: pointer;
+}
+.wb-lx-tableAddRows:hover {
+  background-color: #c9dbf0;
+}
+@keyframes table-controls {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+.wb-lx-tableCellResizeRuler {
+  display: block;
+  position: absolute;
+  width: 1px;
+  background-color: rgb(60, 132, 244);
+  height: 100%;
+  top: 0;
+}
+.wb-lx-tableCellActionButtonContainer {
+  display: block;
+  right: 5px;
+  top: 6px;
+  position: absolute;
+  z-index: 4;
+  width: 20px;
+  height: 20px;
+}
+.wb-lx-tableCellActionButton {
+  background-color: #eee;
+  display: block;
+  border: 0;
+  border-radius: 20px;
+  width: 20px;
+  height: 20px;
+  color: #222;
+  cursor: pointer;
+}
+.wb-lx-tableCellActionButton:hover {
+  background-color: #ddd;
+}
+.wb-lx-characterLimit {
+  display: inline;
+  background-color: #ffbbbb !important;
+}
+.wb-lx-ol1 {
+  padding: 0;
+  margin: 0 0 0 16px;
+  list-style: inside;
+}
+.wb-lx-ol2 {
+  padding: 0;
+  margin: 0 0 0 16px;
+  list-style: upper-alpha inside;
+}
+.wb-lx-ol3 {
+  list-style: initial;
+  list-style: auto;
+  padding: 0;
+  margin: 0 0 0 16px;
+  list-style-type: lower-alpha;
+  list-style-position: inside;
+}
+.wb-lx-ol4 {
+  padding: 0;
+  margin: 0 0 0 16px;
+  list-style: upper-roman inside;
+}
+.wb-lx-ol5 {
+  padding: 0;
+  margin: 0 0 0 16px;
+  list-style: lower-roman inside;
+}
+.wb-lx-ul {
+  padding: 0;
+  margin: 0 0 0 16px;
+  list-style: inside;
+}
+.wb-lx-listItem {
+  margin: 0 32px;
+}
+.wb-lx-listItemChecked,
+.wb-lx-listItemUnchecked {
+  position: relative;
+  margin-left: 8px;
+  margin-right: 8px;
+  padding-left: 24px;
+  padding-right: 24px;
+  list-style-type: none;
+  outline: none;
+}
+.wb-lx-listItemChecked {
+  text-decoration: line-through;
+}
+.wb-lx-listItemUnchecked:before,
+.wb-lx-listItemChecked:before {
+  content: "";
+  width: 16px;
+  height: 16px;
+  top: 2px;
+  left: 0;
+  cursor: pointer;
+  display: block;
+  background-size: cover;
+  position: absolute;
+}
+.wb-lx-listItemUnchecked[dir="rtl"]:before,
+.wb-lx-listItemChecked[dir="rtl"]:before {
+  left: auto;
+  right: 0;
+}
+.wb-lx-listItemUnchecked:focus:before,
+.wb-lx-listItemChecked:focus:before {
+  box-shadow: 0 0 0 2px #a6cdfe;
+  border-radius: 2px;
+}
+.wb-lx-listItemUnchecked:before {
+  border: 1px solid #999;
+  border-radius: 2px;
+}
+.wb-lx-listItemChecked:before {
+  border: 1px solid rgb(61, 135, 245);
+  border-radius: 2px;
+  background-color: #3d87f5;
+  background-repeat: no-repeat;
+}
+.wb-lx-listItemChecked:after {
+  content: "";
+  cursor: pointer;
+  border-color: #fff;
+  border-style: solid;
+  position: absolute;
+  display: block;
+  top: 6px;
+  width: 3px;
+  left: 7px;
+  height: 6px;
+  transform: rotate(45deg);
+  border-width: 0 2px 2px 0;
+}
+.wb-lx-nestedListItem {
+  list-style-type: none;
+}
+.wb-lx-nestedListItem:before,
+.wb-lx-nestedListItem:after {
+  display: none;
+}
+.wb-lx-tokenComment {
+  color: slategray;
+}
+.wb-lx-tokenPunctuation {
+  color: #999;
+}
+.wb-lx-tokenProperty {
+  color: #905;
+}
+.wb-lx-tokenSelector {
+  color: #690;
+}
+.wb-lx-tokenOperator {
+  color: #9a6e3a;
+}
+.wb-lx-tokenAttr {
+  color: #07a;
+}
+.wb-lx-tokenVariable {
+  color: #e90;
+}
+.wb-lx-tokenFunction {
+  color: #dd4a68;
+}
+.wb-lx-mark {
+  background: rgba(255, 212, 0, 0.14);
+  border-bottom: 2px solid rgba(255, 212, 0, 0.3);
+  padding-bottom: 2px;
+}
+.wb-lx-markOverlap {
+  background: rgba(255, 212, 0, 0.3);
+  border-bottom: 2px solid rgba(255, 212, 0, 0.7);
+}
+.wb-lx-mark.selected {
+  background: rgba(255, 212, 0, 0.5);
+  border-bottom: 2px solid rgba(255, 212, 0, 1);
+}
+.wb-lx-markOverlap.selected {
+  background: rgba(255, 212, 0, 0.7);
+  border-bottom: 2px solid rgba(255, 212, 0, 0.7);
+}
+.wb-lx-embedBlock {
+  user-select: none;
+}
+.wb-lx-embedBlockFocus {
+  outline: 2px solid rgb(60, 132, 244);
+}
+
+.wb-lx-placeholder {
+  text-align: left;
+}

package/middleware.d.ts

@@ -0,0 +1,44 @@
+/**
+ * Next.js middleware for Website Builder.
+ *
+ * Handles the two request-time concerns an app would otherwise hand-write:
+ *  - **Preview / draft mode** — routes `?wb.preview`/`?wb.editing` requests through the draft-mode
+ *    route and disables caching while previewing; exits preview when the flag is gone.
+ *  - **A/B visitor cookie** — sets a stable, PII-free `wb_ab_vid` cookie so variant bucketing is
+ *    deterministic across visits.
+ *
+ * `next` is a peer dependency and is imported dynamically so building this package never requires
+ * it. Drop into a project as:
+ *
+ *   // middleware.ts
+ *   export { middleware, config } from "@webiny/website-builder-nextjs/middleware";
+ */
+interface MiddlewareRequest {
+    url: string;
+    nextUrl: {
+        searchParams: URLSearchParams;
+        pathname: string;
+    };
+    headers: Headers;
+    cookies: {
+        get(name: string): {
+            value: string;
+        } | undefined;
+    };
+}
+export interface WebsiteBuilderMiddlewareOptions {
+    /** Route that enables Next.js draft mode for preview. Defaults to `/api/preview`. */
+    previewRoute?: string;
+    /** A/B bucketing cookie name. Defaults to `wb_ab_vid`. */
+    visitorCookieName?: string;
+    /** A/B bucketing cookie max-age in seconds. Defaults to one year. */
+    visitorCookieMaxAge?: number;
+}
+export declare function createWebsiteBuilderMiddleware(options?: WebsiteBuilderMiddlewareOptions): (request: MiddlewareRequest) => Promise<import("next/server").NextResponse<unknown>>;
+/** Turnkey middleware with default options. */
+export declare const middleware: (request: MiddlewareRequest) => Promise<import("next/server").NextResponse<unknown>>;
+/** Default matcher: everything except Next internals, API routes, and static assets. */
+export declare const config: {
+    matcher: string[];
+};
+export {};

package/middleware.js

@@ -0,0 +1,58 @@
+const DEFAULT_PREVIEW_ROUTE = "/api/preview";
+const DEFAULT_VISITOR_COOKIE = "wb_ab_vid";
+const ONE_YEAR_SECONDS = 31536000;
+function createWebsiteBuilderMiddleware(options = {}) {
+    const previewRoute = options.previewRoute ?? DEFAULT_PREVIEW_ROUTE;
+    const cookieName = options.visitorCookieName ?? DEFAULT_VISITOR_COOKIE;
+    const cookieMaxAge = options.visitorCookieMaxAge ?? ONE_YEAR_SECONDS;
+    return async function(request) {
+        const { NextResponse } = await import("next/server");
+        const { draftMode } = await import("next/headers");
+        const { searchParams } = request.nextUrl;
+        const previewRequested = "true" === searchParams.get("wb.preview") || "true" === searchParams.get("wb.editing");
+        const requestHeaders = new Headers(request.headers);
+        requestHeaders.set("X-Tenant", searchParams.get("wb.tenant") ?? "root");
+        const previewMode = await draftMode();
+        if (previewRequested) {
+            if (previewMode.isEnabled) {
+                const response = NextResponse.next({
+                    request: {
+                        headers: requestHeaders
+                    }
+                });
+                response.headers.set("X-Preview-Params", searchParams.toString());
+                response.headers.set("Cache-Control", "no-store, no-cache, must-revalidate, proxy-revalidate");
+                response.headers.set("Pragma", "no-cache");
+                response.headers.set("Expires", "0");
+                return response;
+            }
+            const url = new URL(request.url);
+            url.pathname = previewRoute;
+            return NextResponse.redirect(url);
+        }
+        if (previewMode.isEnabled) {
+            previewMode.disable();
+            return NextResponse.redirect(request.url);
+        }
+        const response = NextResponse.next({
+            request: {
+                headers: requestHeaders
+            }
+        });
+        if (!request.cookies.get(cookieName)) response.cookies.set(cookieName, crypto.randomUUID(), {
+            maxAge: cookieMaxAge,
+            path: "/",
+            sameSite: "lax"
+        });
+        return response;
+    };
+}
+const middleware_middleware = createWebsiteBuilderMiddleware();
+const config = {
+    matcher: [
+        "/((?!_next|api|static|favicon.ico|.well-known).*)"
+    ]
+};
+export { config, createWebsiteBuilderMiddleware, middleware_middleware as middleware };
+
+//# sourceMappingURL=middleware.js.map

package/middleware.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"middleware.js","sources":["../src/middleware.ts"],"sourcesContent":["/**\n * Next.js middleware for Website Builder.\n *\n * Handles the two request-time concerns an app would otherwise hand-write:\n *  - **Preview / draft mode** — routes `?wb.preview`/`?wb.editing` requests through the draft-mode\n *    route and disables caching while previewing; exits preview when the flag is gone.\n *  - **A/B visitor cookie** — sets a stable, PII-free `wb_ab_vid` cookie so variant bucketing is\n *    deterministic across visits.\n *\n * `next` is a peer dependency and is imported dynamically so building this package never requires\n * it. Drop into a project as:\n *\n *   // middleware.ts\n *   export { middleware, config } from \"@webiny/website-builder-nextjs/middleware\";\n */\n\nconst DEFAULT_PREVIEW_ROUTE = \"/api/preview\";\nconst DEFAULT_VISITOR_COOKIE = \"wb_ab_vid\";\nconst ONE_YEAR_SECONDS = 60 * 60 * 24 * 365;\n\n// Minimal structural view of NextRequest — avoids a static `next` type import.\ninterface MiddlewareRequest {\n    url: string;\n    nextUrl: { searchParams: URLSearchParams; pathname: string };\n    headers: Headers;\n    cookies: { get(name: string): { value: string } | undefined };\n}\n\nexport interface WebsiteBuilderMiddlewareOptions {\n    /** Route that enables Next.js draft mode for preview. Defaults to `/api/preview`. */\n    previewRoute?: string;\n    /** A/B bucketing cookie name. Defaults to `wb_ab_vid`. */\n    visitorCookieName?: string;\n    /** A/B bucketing cookie max-age in seconds. Defaults to one year. */\n    visitorCookieMaxAge?: number;\n}\n\nexport function createWebsiteBuilderMiddleware(options: WebsiteBuilderMiddlewareOptions = {}) {\n    const previewRoute = options.previewRoute ?? DEFAULT_PREVIEW_ROUTE;\n    const cookieName = options.visitorCookieName ?? DEFAULT_VISITOR_COOKIE;\n    const cookieMaxAge = options.visitorCookieMaxAge ?? ONE_YEAR_SECONDS;\n\n    return async function middleware(request: MiddlewareRequest) {\n        // @ts-ignore Peer dependency, resolved from the host app.\n        const { NextResponse } = await import(\"next/server\");\n        // @ts-ignore Peer dependency, resolved from the host app.\n        const { draftMode } = await import(\"next/headers\");\n\n        const { searchParams } = request.nextUrl;\n        const previewRequested =\n            searchParams.get(\"wb.preview\") === \"true\" || searchParams.get(\"wb.editing\") === \"true\";\n\n        // Forward the tenant so downstream reads resolve against the right tenant.\n        const requestHeaders = new Headers(request.headers);\n        requestHeaders.set(\"X-Tenant\", searchParams.get(\"wb.tenant\") ?? \"root\");\n\n        const previewMode = await draftMode();\n\n        if (previewRequested) {\n            if (previewMode.isEnabled) {\n                // Already in draft mode — pass the preview params through and disable caching.\n                const response = NextResponse.next({ request: { headers: requestHeaders } });\n                response.headers.set(\"X-Preview-Params\", searchParams.toString());\n                response.headers.set(\n                    \"Cache-Control\",\n                    \"no-store, no-cache, must-revalidate, proxy-revalidate\"\n                );\n                response.headers.set(\"Pragma\", \"no-cache\");\n                response.headers.set(\"Expires\", \"0\");\n                return response;\n            }\n            // Not in draft mode yet — hand off to the route that enables it, keeping all params.\n            const url = new URL(request.url);\n            url.pathname = previewRoute;\n            return NextResponse.redirect(url);\n        }\n\n        if (previewMode.isEnabled) {\n            // Preview flag gone but draft mode still on — exit preview.\n            previewMode.disable();\n            return NextResponse.redirect(request.url);\n        }\n\n        const response = NextResponse.next({ request: { headers: requestHeaders } });\n\n        // Stable visitor id for deterministic A/B bucketing (functional cookie, no PII). Remove or\n        // gate this if your consent policy requires opt-in — bucketing still works per-request\n        // without it, just not stably across visits.\n        if (!request.cookies.get(cookieName)) {\n            response.cookies.set(cookieName, crypto.randomUUID(), {\n                maxAge: cookieMaxAge,\n                path: \"/\",\n                sameSite: \"lax\"\n            });\n        }\n\n        return response;\n    };\n}\n\n/** Turnkey middleware with default options. */\nexport const middleware = createWebsiteBuilderMiddleware();\n\n/** Default matcher: everything except Next internals, API routes, and static assets. */\nexport const config = {\n    matcher: [\"/((?!_next|api|static|favicon.ico|.well-known).*)\"]\n};\n"],"names":["DEFAULT_PREVIEW_ROUTE","DEFAULT_VISITOR_COOKIE","ONE_YEAR_SECONDS","createWebsiteBuilderMiddleware","options","previewRoute","cookieName","cookieMaxAge","request","NextResponse","draftMode","searchParams","previewRequested","requestHeaders","Headers","previewMode","response","url","URL","crypto","middleware","config"],"mappings":"AAgBA,MAAMA,wBAAwB;AAC9B,MAAMC,yBAAyB;AAC/B,MAAMC,mBAAmB;AAmBlB,SAASC,+BAA+BC,UAA2C,CAAC,CAAC;IACxF,MAAMC,eAAeD,QAAQ,YAAY,IAAIJ;IAC7C,MAAMM,aAAaF,QAAQ,iBAAiB,IAAIH;IAChD,MAAMM,eAAeH,QAAQ,mBAAmB,IAAIF;IAEpD,OAAO,eAA0BM,OAA0B;QAEvD,MAAM,EAAEC,YAAY,EAAE,GAAG,MAAM,MAAM,CAAC;QAEtC,MAAM,EAAEC,SAAS,EAAE,GAAG,MAAM,MAAM,CAAC;QAEnC,MAAM,EAAEC,YAAY,EAAE,GAAGH,QAAQ,OAAO;QACxC,MAAMI,mBACFD,AAAmC,WAAnCA,aAAa,GAAG,CAAC,iBAA4BA,AAAmC,WAAnCA,aAAa,GAAG,CAAC;QAGlE,MAAME,iBAAiB,IAAIC,QAAQN,QAAQ,OAAO;QAClDK,eAAe,GAAG,CAAC,YAAYF,aAAa,GAAG,CAAC,gBAAgB;QAEhE,MAAMI,cAAc,MAAML;QAE1B,IAAIE,kBAAkB;YAClB,IAAIG,YAAY,SAAS,EAAE;gBAEvB,MAAMC,WAAWP,aAAa,IAAI,CAAC;oBAAE,SAAS;wBAAE,SAASI;oBAAe;gBAAE;gBAC1EG,SAAS,OAAO,CAAC,GAAG,CAAC,oBAAoBL,aAAa,QAAQ;gBAC9DK,SAAS,OAAO,CAAC,GAAG,CAChB,iBACA;gBAEJA,SAAS,OAAO,CAAC,GAAG,CAAC,UAAU;gBAC/BA,SAAS,OAAO,CAAC,GAAG,CAAC,WAAW;gBAChC,OAAOA;YACX;YAEA,MAAMC,MAAM,IAAIC,IAAIV,QAAQ,GAAG;YAC/BS,IAAI,QAAQ,GAAGZ;YACf,OAAOI,aAAa,QAAQ,CAACQ;QACjC;QAEA,IAAIF,YAAY,SAAS,EAAE;YAEvBA,YAAY,OAAO;YACnB,OAAON,aAAa,QAAQ,CAACD,QAAQ,GAAG;QAC5C;QAEA,MAAMQ,WAAWP,aAAa,IAAI,CAAC;YAAE,SAAS;gBAAE,SAASI;YAAe;QAAE;QAK1E,IAAI,CAACL,QAAQ,OAAO,CAAC,GAAG,CAACF,aACrBU,SAAS,OAAO,CAAC,GAAG,CAACV,YAAYa,OAAO,UAAU,IAAI;YAClD,QAAQZ;YACR,MAAM;YACN,UAAU;QACd;QAGJ,OAAOS;IACX;AACJ;AAGO,MAAMI,wBAAajB;AAGnB,MAAMkB,SAAS;IAClB,SAAS;QAAC;KAAoD;AAClE"}

package/package.json

@@ -1,13 +1,15 @@
 {
 	"name": "@webiny/website-builder-nextjs",
-	"version": "0.0.0-unstable.8b6c57b569",
-	"main": "index.js",
+	"version": "0.0.0-unstable.9f53ea597d",
+	"type": "module",
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/webiny/webiny-js.git"
 	},
 	"exports": {
-		".": "./index.js"
+		".": "./index.js",
+		"./middleware": "./middleware.js",
+		"./webpack": "./webpack.js"
 	},
 	"description": "A Next.js integration SDK for Webiny Website Builder.",
 	"contributors": [
@@ -17,32 +19,33 @@
 	],
 	"license": "MIT",
 	"dependencies": {
-		"@webiny/website-builder-react": "0.0.0-unstable.8b6c57b569",
-		"postcss": "8.5.6"
-	},
-	"peerDependencies": {
-		"next": "^15"
+		"@webiny/website-builder-react": "0.0.0-unstable.9f53ea597d",
+		"postcss": "8.5.21",
+		"postcss-import": "16.1.1"
 	},
 	"devDependencies": {
-		"@webiny/project-utils": "0.0.0-unstable.8b6c57b569",
-		"typescript": "5.3.3"
+		"@types/postcss-import": "14.0.3",
+		"@webiny/build-tools": "0.0.0-unstable.9f53ea597d",
+		"typescript": "7.0.2",
+		"vitest": "4.1.10",
+		"webpack": "5.108.4"
 	},
-	"publishConfig": {
-		"access": "public",
-		"directory": "dist"
+	"peerDependencies": {
+		"next": "16.2.11"
 	},
-	"scripts": {
-		"build": "node ../cli/bin.js run build",
-		"watch": "node ../cli/bin.js run watch"
+	"publishConfig": {
+		"access": "public"
 	},
 	"adio": {
 		"ignore": {
 			"dependencies": [
 				"postcss",
-				"next",
+				"postcss-import",
 				"@webiny/website-builder-react"
 			]
 		}
 	},
-	"gitHead": "8b6c57b56947ee57acf428f703bc1b8c35617a95"
+	"webiny": {
+		"publishFrom": "dist"
+	}
 }

package/webpack.d.ts

@@ -0,0 +1,7 @@
+import type { WebpackPluginInstance } from "webpack";
+import type { NextConfig } from "next";
+type WebpackConfigContext = Parameters<NonNullable<NextConfig["webpack"]>>[1];
+export declare const injectThemeCss: (entry: string, variableName?: string) => Promise<{
+    getPlugins: (context: WebpackConfigContext) => WebpackPluginInstance[];
+}>;
+export {};

package/webpack.js

@@ -0,0 +1,44 @@
+import fs from "fs";
+import postcss from "postcss";
+import postcss_import from "postcss-import";
+const buildThemeCss = async (entry)=>{
+    const raw = fs.readFileSync(entry, "utf8");
+    const result = await postcss([
+        postcss_import()
+    ]).process(raw, {
+        from: entry
+    });
+    return result.css;
+};
+const injectThemeCss = async (entry, variableName)=>{
+    const defineKey = variableName ?? "__THEME_CSS__";
+    const initialCss = await buildThemeCss(entry);
+    let definePlugin;
+    const getPlugins = (context)=>{
+        const { dev, webpack } = context;
+        if (!definePlugin) definePlugin = new webpack.DefinePlugin({
+            [defineKey]: JSON.stringify(initialCss)
+        });
+        const plugins = [
+            definePlugin
+        ];
+        if (dev) plugins.push({
+            apply (compiler) {
+                compiler.hooks.afterCompile.tapPromise("WatchThemeCss", async (compilation)=>{
+                    compilation.fileDependencies.add(entry);
+                });
+                compiler.hooks.beforeCompile.tapPromise("UpdateThemeCss", async ()=>{
+                    const cssValue = await buildThemeCss(entry);
+                    definePlugin.definitions[defineKey] = JSON.stringify(cssValue);
+                });
+            }
+        });
+        return plugins;
+    };
+    return {
+        getPlugins
+    };
+};
+export { injectThemeCss };
+
+//# sourceMappingURL=webpack.js.map

package/webpack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webpack.js","sources":["../src/webpack.ts"],"sourcesContent":["import fs from \"fs\";\nimport type { WebpackPluginInstance } from \"webpack\";\nimport type { AcceptedPlugin } from \"postcss\";\nimport postcss from \"postcss\";\nimport postcssImport from \"postcss-import\";\nimport type { NextConfig } from \"next\";\n\n// We're inferring the type from Next's config type.\ntype WebpackConfigContext = Parameters<NonNullable<NextConfig[\"webpack\"]>>[1];\n\nconst buildThemeCss = async (entry: string) => {\n    // Read CSS entry file.\n    const raw = fs.readFileSync(entry, \"utf8\");\n\n    // Inline local imports.\n    const result = await postcss([postcssImport() as AcceptedPlugin]).process(raw, {\n        from: entry\n    });\n\n    return result.css;\n};\n\nexport const injectThemeCss = async (entry: string, variableName?: string) => {\n    const defineKey = variableName ?? \"__THEME_CSS__\";\n\n    const initialCss = await buildThemeCss(entry);\n\n    // Inject as a global constant available in your app.\n    let definePlugin: WebpackPluginInstance;\n\n    const getPlugins = (context: WebpackConfigContext) => {\n        const { dev, webpack } = context;\n\n        if (!definePlugin) {\n            definePlugin = new webpack.DefinePlugin({ [defineKey]: JSON.stringify(initialCss) });\n        }\n\n        const plugins: WebpackPluginInstance[] = [definePlugin];\n\n        if (dev) {\n            // Watch for changes and update plugin definitions\n            plugins.push({\n                apply(compiler) {\n                    compiler.hooks.afterCompile.tapPromise(\"WatchThemeCss\", async compilation => {\n                        compilation.fileDependencies.add(entry);\n                    });\n\n                    compiler.hooks.beforeCompile.tapPromise(\"UpdateThemeCss\", async () => {\n                        const cssValue = await buildThemeCss(entry);\n                        // Update the definitions on our specific plugin\n                        definePlugin.definitions[defineKey] = JSON.stringify(cssValue);\n                    });\n                }\n            });\n        }\n\n        return plugins;\n    };\n\n    return { getPlugins };\n};\n"],"names":["buildThemeCss","entry","raw","fs","result","postcss","postcssImport","injectThemeCss","variableName","defineKey","initialCss","definePlugin","getPlugins","context","dev","webpack","JSON","plugins","compiler","compilation","cssValue"],"mappings":";;;AAUA,MAAMA,gBAAgB,OAAOC;IAEzB,MAAMC,MAAMC,GAAG,YAAY,CAACF,OAAO;IAGnC,MAAMG,SAAS,MAAMC,QAAQ;QAACC;KAAkC,EAAE,OAAO,CAACJ,KAAK;QAC3E,MAAMD;IACV;IAEA,OAAOG,OAAO,GAAG;AACrB;AAEO,MAAMG,iBAAiB,OAAON,OAAeO;IAChD,MAAMC,YAAYD,gBAAgB;IAElC,MAAME,aAAa,MAAMV,cAAcC;IAGvC,IAAIU;IAEJ,MAAMC,aAAa,CAACC;QAChB,MAAM,EAAEC,GAAG,EAAEC,OAAO,EAAE,GAAGF;QAEzB,IAAI,CAACF,cACDA,eAAe,IAAII,QAAQ,YAAY,CAAC;YAAE,CAACN,UAAU,EAAEO,KAAK,SAAS,CAACN;QAAY;QAGtF,MAAMO,UAAmC;YAACN;SAAa;QAEvD,IAAIG,KAEAG,QAAQ,IAAI,CAAC;YACT,OAAMC,QAAQ;gBACVA,SAAS,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,iBAAiB,OAAMC;oBAC1DA,YAAY,gBAAgB,CAAC,GAAG,CAAClB;gBACrC;gBAEAiB,SAAS,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,kBAAkB;oBACtD,MAAME,WAAW,MAAMpB,cAAcC;oBAErCU,aAAa,WAAW,CAACF,UAAU,GAAGO,KAAK,SAAS,CAACI;gBACzD;YACJ;QACJ;QAGJ,OAAOH;IACX;IAEA,OAAO;QAAEL;IAAW;AACxB"}

package/CssInliner.d.ts

@@ -1,6 +0,0 @@
-export declare class CSSInliner {
-    private seen;
-    load(entryPath: string): Promise<string>;
-    private inlineFile;
-    private createImportInlinerPlugin;
-}

package/CssInliner.js

@@ -1,70 +0,0 @@
-import postcss from "postcss";
-import path from "path";
-import { readFile } from "fs";
-import { promisify } from "util";
-const readFileAsync = promisify(readFile);
-export class CSSInliner {
-  seen = new Set();
-  async load(entryPath) {
-    const result = await this.inlineFile(entryPath);
-    return result.css;
-  }
-  async inlineFile(filePath) {
-    const absolutePath = path.resolve(filePath);
-    if (this.seen.has(absolutePath)) {
-      return postcss().process("", {
-        from: undefined
-      });
-    }
-    this.seen.add(absolutePath);
-    const css = await readFileAsync(absolutePath, "utf8");
-    return postcss([this.createImportInlinerPlugin(path.dirname(absolutePath))]).process(css, {
-      from: absolutePath
-    });
-  }
-  createImportInlinerPlugin(currentDir) {
-    return {
-      postcssPlugin: "css-inliner",
-      AtRule: async atRule => {
-        if (atRule.name !== "import") {
-          return;
-        }
-        const importPath = atRule.params.replace(/^url\(|\)$|['"]/g, "").trim();
-        let importedCSS;
-        let from;
-        try {
-          if (importPath.startsWith("http://") || importPath.startsWith("https://")) {
-            // Leave remote @import untouched
-            return;
-          } else {
-            const resolvedPath = path.resolve(currentDir, importPath);
-            if (this.seen.has(resolvedPath)) {
-              atRule.remove();
-              return;
-            }
-            this.seen.add(resolvedPath);
-            importedCSS = await readFileAsync(resolvedPath, "utf8");
-            from = resolvedPath;
-          }
-        } catch (err) {
-          console.warn(`⚠️ Failed to inline import: ${importPath}`, err);
-          return;
-        }
-        const result = await postcss([this.createImportInlinerPlugin(from ? path.dirname(from) : currentDir)]).process(importedCSS, {
-          from
-        });
-        const root = postcss.parse(result.css);
-        if (atRule.parent?.type === "atrule" && atRule.parent.name === "media") {
-          atRule.replaceWith(root);
-        } else {
-          atRule.replaceWith(root.nodes);
-        }
-      }
-    };
-  }
-}
-
-// @ts-expect-error `postcss` requires this to treat the function as a valid plugin.
-CSSInliner.prototype.createImportInlinerPlugin.postcss = true;
-
-//# sourceMappingURL=CssInliner.js.map

package/CssInliner.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["postcss","path","readFile","promisify","readFileAsync","CSSInliner","seen","Set","load","entryPath","result","inlineFile","css","filePath","absolutePath","resolve","has","process","from","undefined","add","createImportInlinerPlugin","dirname","currentDir","postcssPlugin","AtRule","atRule","name","importPath","params","replace","trim","importedCSS","startsWith","resolvedPath","remove","err","console","warn","root","parse","parent","type","replaceWith","nodes","prototype"],"sources":["CssInliner.ts"],"sourcesContent":["import postcss, { type AtRule } from \"postcss\";\nimport path from \"path\";\nimport { readFile } from \"fs\";\nimport { promisify } from \"util\";\n\nconst readFileAsync = promisify(readFile);\n\nexport class CSSInliner {\n    private seen = new Set<string>();\n\n    async load(entryPath: string): Promise<string> {\n        const result = await this.inlineFile(entryPath);\n        return result.css;\n    }\n\n    private async inlineFile(filePath: string): Promise<postcss.Result> {\n        const absolutePath = path.resolve(filePath);\n\n        if (this.seen.has(absolutePath)) {\n            return postcss().process(\"\", { from: undefined });\n        }\n\n        this.seen.add(absolutePath);\n        const css = await readFileAsync(absolutePath, \"utf8\");\n\n        return postcss([this.createImportInlinerPlugin(path.dirname(absolutePath))]).process(css, {\n            from: absolutePath\n        });\n    }\n\n    private createImportInlinerPlugin(currentDir: string) {\n        return {\n            postcssPlugin: \"css-inliner\",\n            AtRule: async (atRule: AtRule) => {\n                if (atRule.name !== \"import\") {\n                    return;\n                }\n\n                const importPath = atRule.params.replace(/^url\\(|\\)$|['\"]/g, \"\").trim();\n\n                let importedCSS: string;\n                let from: string | undefined;\n\n                try {\n                    if (importPath.startsWith(\"http://\") || importPath.startsWith(\"https://\")) {\n                        // Leave remote @import untouched\n                        return;\n                    } else {\n                        const resolvedPath = path.resolve(currentDir, importPath);\n\n                        if (this.seen.has(resolvedPath)) {\n                            atRule.remove();\n                            return;\n                        }\n\n                        this.seen.add(resolvedPath);\n                        importedCSS = await readFileAsync(resolvedPath, \"utf8\");\n                        from = resolvedPath;\n                    }\n                } catch (err) {\n                    console.warn(`⚠️ Failed to inline import: ${importPath}`, err);\n                    return;\n                }\n\n                const result = await postcss([\n                    this.createImportInlinerPlugin(from ? path.dirname(from) : currentDir)\n                ]).process(importedCSS, { from });\n\n                const root = postcss.parse(result.css);\n\n                if (atRule.parent?.type === \"atrule\" && atRule.parent.name === \"media\") {\n                    atRule.replaceWith(root);\n                } else {\n                    atRule.replaceWith(root.nodes);\n                }\n            }\n        };\n    }\n}\n\n// @ts-expect-error `postcss` requires this to treat the function as a valid plugin.\nCSSInliner.prototype.createImportInlinerPlugin.postcss = true;\n"],"mappings":"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","ignoreList":[]}

package/useCss.d.ts

@@ -1 +0,0 @@
-export declare function useCss(cssFile?: string): Promise<string>;

package/useCss.js

@@ -1,13 +0,0 @@
-"use server";
-
-import path from "path";
-export async function useCss(cssFile) {
-  const {
-    CSSInliner
-  } = await import("./CssInliner");
-  const entryCss = cssFile ?? path.resolve(process.cwd(), "src/theme/theme.css");
-  const inliner = new CSSInliner();
-  return await inliner.load(entryCss);
-}
-
-//# sourceMappingURL=useCss.js.map

package/useCss.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["path","useCss","cssFile","CSSInliner","entryCss","resolve","process","cwd","inliner","load"],"sources":["useCss.ts"],"sourcesContent":["\"use server\";\nimport path from \"path\";\n\nexport async function useCss(cssFile?: string) {\n    const { CSSInliner } = await import(\"~/CssInliner\");\n    const entryCss = cssFile ?? path.resolve(process.cwd(), \"src/theme/theme.css\");\n\n    const inliner = new CSSInliner();\n    return await inliner.load(entryCss);\n}\n"],"mappings":"AAAA,YAAY;;AACZ,OAAOA,IAAI,MAAM,MAAM;AAEvB,OAAO,eAAeC,MAAMA,CAACC,OAAgB,EAAE;EAC3C,MAAM;IAAEC;EAAW,CAAC,GAAG,MAAM,MAAM,eAAe,CAAC;EACnD,MAAMC,QAAQ,GAAGF,OAAO,IAAIF,IAAI,CAACK,OAAO,CAACC,OAAO,CAACC,GAAG,CAAC,CAAC,EAAE,qBAAqB,CAAC;EAE9E,MAAMC,OAAO,GAAG,IAAIL,UAAU,CAAC,CAAC;EAChC,OAAO,MAAMK,OAAO,CAACC,IAAI,CAACL,QAAQ,CAAC;AACvC","ignoreList":[]}