@xwadex/fesd-next 0.3.4-7.20 → 0.3.4-7.22

package/dist/components/content-builders/blocks/base-block.d.ts

@@ -0,0 +1,8 @@
+import type { PuckComponent, ComponentConfig, Slot } from "@puckeditor/core";
+export interface Props {
+    options?: any;
+    slotTextBlock?: Slot;
+    slotMediaBlock?: Slot;
+}
+export declare const BaseBlock: PuckComponent<Props>;
+export declare const BaseBlockConfigs: ComponentConfig;

package/dist/components/content-builders/blocks/base-block.js

@@ -0,0 +1,95 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { TextContentConfigs } from "./text-content";
+import { MediaContentConfigs } from "./media-content";
+import { cn } from "../../../shadcns/index.js";
+export const BaseBlock = ({ options, slotTextBlock: SlotTextBlock, slotMediaBlock: SlotMediaBlock, ...props }) => {
+    const { textAlign } = options;
+    return (_jsx("div", { "data-component": "base-block", className: cn("grid items-center justify-center overflow-hidden", "grid-cols-[1fr_1fr]"), children: textAlign == "left"
+            ? _jsxs(_Fragment, { children: [_jsxs("div", { children: [" ", SlotTextBlock ? _jsx(SlotTextBlock, {}) : null] }), _jsxs("div", { children: [" ", SlotMediaBlock ? _jsx(SlotMediaBlock, {}) : null] })] })
+            : _jsxs(_Fragment, { children: [_jsxs("div", { children: [" ", SlotMediaBlock ? _jsx(SlotMediaBlock, {}) : null] }), _jsxs("div", { children: [" ", SlotTextBlock ? _jsx(SlotTextBlock, {}) : null] })] }) }));
+};
+export const BaseBlockConfigs = {
+    label: "BaseBlock",
+    fields: {
+        slotTextBlock: { type: "slot", allow: ["TextContent"] },
+        slotMediaBlock: { type: "slot", allow: ["MediaContent"] },
+        options: {
+            label: "Contetn Options",
+            type: "object",
+            objectFields: {
+                textAlign: {
+                    label: "Content Position",
+                    type: "radio",
+                    options: [
+                        { label: "Left", value: "left" },
+                        { label: "Right", value: "right" },
+                    ],
+                },
+                textAlign2: {
+                    label: "Content Vertical",
+                    type: "radio",
+                    options: [
+                        { label: "Top", value: "top" },
+                        { label: "Middle", value: "middle" },
+                        { label: "Bottom", value: "bottom" },
+                    ],
+                },
+            },
+        },
+        background: {
+            label: "Background Setting",
+            type: "object",
+            objectFields: {
+                isImage: {
+                    label: "Use Image",
+                    type: "radio",
+                    options: [
+                        { label: "Yes", value: "yes" },
+                        { label: "No", value: "no" },
+                    ],
+                },
+                imageAddress: {
+                    label: "Image Address",
+                    type: "text"
+                },
+                color: {
+                    label: "Color",
+                    type: "text"
+                },
+            },
+        },
+    },
+    resolveData: async ({ props }) => {
+        const nextProps = { ...props };
+        const tb = Array.isArray(nextProps.textBlock) ? nextProps.textBlock : [];
+        nextProps.textBlock = tb.map((item, idx) => {
+            if (!item?.props)
+                return item;
+            const lockDelete = tb.length === 1; // ✅ 核心判斷
+            return { ...item, props: { ...item.props, lockDelete } };
+        });
+        return { props: nextProps };
+    },
+    defaultProps: {
+        options: {
+            textAlign: "left",
+            textAlign2: "top"
+        },
+        background: {
+            isImage: "no"
+        },
+        slotTextBlock: [{
+                type: "TextContent",
+                props: { ...TextContentConfigs.defaultProps, requiredInSlot: true, }
+            }],
+        slotMediaBlock: [{
+                type: "MediaContent",
+                props: { ...MediaContentConfigs.defaultProps }
+            }],
+        configs: {
+            className: ""
+        }
+    },
+    render: BaseBlock
+};

package/dist/components/content-builders/blocks/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./roots";
+export * from "./base-block";
+export * from "./media-content";
+export * from "./text-content";

package/dist/components/content-builders/blocks/index.js

@@ -0,0 +1,4 @@
+export * from "./roots";
+export * from "./base-block";
+export * from "./media-content";
+export * from "./text-content";

package/dist/components/content-builders/blocks/media-content.d.ts

@@ -0,0 +1,7 @@
+import { ComponentConfig, PuckComponent } from "@puckeditor/core";
+export interface MediaContentProps {
+    imgs?: string;
+    alt?: string;
+}
+export declare const MediaContent: PuckComponent<MediaContentProps>;
+export declare const MediaContentConfigs: ComponentConfig;

package/dist/components/content-builders/blocks/media-content.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const MediaContent = ({ alt, imgs, }) => {
+    return (_jsx("div", { "data-component": "media-content", onClick: console.log, children: _jsx("figure", { className: "flex flex-col gap-3 items-center [&_img]:max-w-full w-full", children: _jsx("div", { className: "bg-gray-100 w-full", children: _jsx("img", { src: String(imgs), className: "w-full!" }) }) }) }));
+};
+export const MediaContentConfigs = {
+    label: "Media Content",
+    permissions: {
+        delete: false,
+        drag: false,
+        insert: false,
+        duplicate: false
+    },
+    fields: {
+        imgs: { type: "text" },
+        alt: { type: "text", contentEditable: true },
+    },
+    defaultProps: {
+        imgs: "/01.png",
+        alt: "alt"
+    },
+    render: MediaContent
+};

package/dist/components/content-builders/blocks/root-header.d.ts

@@ -0,0 +1,19 @@
+import { ComponentConfig, PuckComponent } from "@puckeditor/core";
+export interface Button {
+    label?: string;
+    link?: string;
+    linkBlank?: boolean;
+    labelColor?: string;
+    bgColor?: string;
+    borderColor?: string;
+}
+export interface RootHeaderProps {
+    title?: string;
+    description?: string;
+    subTitle?: string;
+    buttons?: Button[];
+    imgs?: string;
+    options?: any;
+}
+export declare const RootHeader: PuckComponent<RootHeaderProps>;
+export declare const RootHeaderConfig: ComponentConfig;

package/dist/components/content-builders/blocks/root-header.js

@@ -0,0 +1,84 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../../../shadcns/index.js";
+export const RootHeader = ({ title, description, subTitle, buttons, ...props }) => {
+    return (_jsxs("div", { "data-component": "header-block", className: "px-10 py-2 flex justify-between  w-full bg-white", children: [_jsx("div", { className: "text-xl font-semibold flex-1", children: "LOGO" }), _jsxs("div", { className: "flex-1 flex gap-10 justify-center items-center", children: [_jsx("div", { className: "text-md font-semibold", children: "ABOTU" }), _jsx("div", { className: "text-md font-semibold", children: "PRODUCTS" }), _jsx("div", { className: "text-md font-semibold", children: "SOLUTIONS" }), _jsx("div", { className: "text-md font-semibold", children: "SUPPORT" })] }), _jsx("div", { className: cn("text-2xl font-semibold flex-1 flex justify-end items-center", "[&_span]:w-8", "[&_span]:h-0.5", "[&_span]:bg-black"), children: _jsxs("div", { className: cn("flex flex-col gap-1"), children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }) })] }));
+};
+export const RootHeaderConfig = {
+    label: "RootHeader",
+    permissions: {
+        delete: false,
+        drag: false,
+        duplicate: false,
+        insert: false
+    },
+    fields: {
+        title: {
+            label: "Title",
+            type: "text",
+            contentEditable: true
+        },
+        subTitle: {
+            label: "Sub Title",
+            type: "text",
+            contentEditable: true
+        },
+        description: {
+            label: "Description",
+            type: "textarea",
+            contentEditable: true
+        },
+        buttons: {
+            label: "Buttons",
+            type: "array",
+            arrayFields: {
+                label: {
+                    label: "Label",
+                    type: "text",
+                    contentEditable: true,
+                    placeholder: "ex: learn more"
+                },
+                link: {
+                    label: "Link",
+                    type: "text",
+                    placeholder: "ex: http://www.abc.com"
+                },
+                linkTarget: {
+                    label: "Link Blank",
+                    type: "radio",
+                    options: [
+                        { label: "Yes", value: "yes" },
+                        { label: "No", value: "no" },
+                    ],
+                },
+                labelColor: {
+                    label: "Label Color",
+                    type: "text",
+                    placeholder: "ex: #000000"
+                },
+                backgroundColor: {
+                    label: "Background Color",
+                    type: "text",
+                    placeholder: "ex: #000000"
+                },
+                borderColor: {
+                    label: "Border Color",
+                    type: "text",
+                    placeholder: "ex: #000000"
+                },
+            },
+            defaultItemProps: (index) => ({
+                label: `Unnamed ${index + 1}`,
+            }),
+            getItemSummary: (item, index) => {
+                return item?.label || `Unnamed ${Number(index) + 1}`;
+            },
+        },
+    },
+    defaultProps: {
+        title: "Content that adapts to your layout",
+        subTitle: "Designed for clarity and consistency",
+        description: "This section supports flexible content placement and alignment across different screen sizes.",
+    },
+    render: RootHeader
+};

package/dist/components/content-builders/blocks/roots.d.ts

@@ -0,0 +1,8 @@
+import type { Config, Slot } from "@puckeditor/core";
+export interface RootsProps {
+    title?: string;
+    description?: string;
+    children?: React.ReactNode;
+    slotHeader?: Slot;
+}
+export declare const RootsConfigs: Config["root"];

package/dist/components/content-builders/blocks/roots.js

@@ -0,0 +1,18 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { cn } from "../../../shadcns/index.js";
+const Roots = ({ children, title, description, slotHeader: SlotHeader }) => {
+    return (_jsxs(_Fragment, { children: [_jsxs("header", { className: "px-10 py-2 flex justify-between border-b fixed left-0 w-full z-90 bg-white", children: [_jsx("div", { className: "text-xl font-semibold flex-1", children: "LOGO" }), _jsxs("div", { className: "flex-1 flex gap-10 justify-center items-center", children: [_jsx("div", { className: "text-md font-semibold", children: "ABOTU" }), _jsx("div", { className: "text-md font-semibold", children: "PRODUCTS" }), _jsx("div", { className: "text-md font-semibold", children: "SOLUTIONS" }), _jsx("div", { className: "text-md font-semibold", children: "SUPPORT" })] }), _jsx("div", { className: cn("text-2xl font-semibold flex-1 flex justify-end items-center", "[&_span]:w-8", "[&_span]:h-0.5", "[&_span]:bg-black"), children: _jsxs("div", { className: cn("flex flex-col gap-1"), children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }) })] }), _jsx("main", { className: cn("pt-11.5", "flex", "flex-col", "z-1", "*:data-puck-dropzone:min-h-100!"), children: children }), _jsx("footer", { className: cn("px-10 py-2"), children: description })] }));
+};
+export const RootsConfigs = {
+    label: "Page Content",
+    fields: {
+        title: { type: "text" },
+        description: { type: "textarea" },
+    },
+    defaultProps: {
+        title: "Hello, world",
+        description: "Lorem ipsum",
+    },
+    render: Roots
+};

package/dist/components/content-builders/blocks/text-content.d.ts

@@ -0,0 +1,20 @@
+import { ComponentConfig, PuckComponent } from "@puckeditor/core";
+export interface ButtonProps {
+    label?: string;
+    link?: string;
+    linkBlank?: boolean;
+    labelColor?: string;
+    bgColor?: string;
+    borderColor?: string;
+}
+export interface TextContentProps {
+    title?: string;
+    description?: string;
+    subTitle?: string;
+    buttons?: ButtonProps[];
+    imgs?: string;
+    options?: any;
+    titleOptions?: any;
+}
+export declare const TextContent: PuckComponent<TextContentProps>;
+export declare const TextContentConfigs: ComponentConfig;

package/dist/components/content-builders/blocks/text-content.js

@@ -0,0 +1,126 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../../../shadcns/index.js";
+export const TextContent = ({ title, description, subTitle, buttons, titleOptions, ...props }) => {
+    const { tage2 } = titleOptions || {};
+    const TitleComponent = tage2 ?? "h3";
+    return (_jsx("div", { "data-component": "text-content", className: cn("flex", "justify-center", "p-5"), children: _jsxs("div", { className: cn("flex flex-col gap-10", "justify-start items-start"), children: [_jsxs("hgroup", { "data-component": "text-content-hgroup", className: "flex flex-col gap-3", children: [_jsx(TitleComponent, { "data-component": "text-content-title", className: "text-3xl font-semibold", children: title }), _jsx("p", { "data-component": "text-content-subTitle", className: "text-base font-medium", children: subTitle })] }), _jsx("p", { "data-component": "text-content-description", className: "", children: description }), buttons && buttons?.length > 0 && _jsx("div", { "data-component": "text-content-buttonGroup", className: "flex gap-0.5", children: buttons.map((bt, index) => (_jsx("button", { "data-component": "text-content-button", className: "p-3 border rounded", children: bt.label }, index))) })] }) }));
+};
+export const TextContentConfigs = {
+    label: "TextContent",
+    permissions: {
+        // delete: false,
+        // drag: true,
+        insert: true,
+    },
+    fields: {
+        title: {
+            label: "Title",
+            type: "text",
+            contentEditable: true
+        },
+        subTitle: {
+            label: "Sub Title",
+            type: "text",
+            contentEditable: true
+        },
+        description: {
+            label: "Description",
+            type: "textarea",
+            contentEditable: true
+        },
+        buttons: {
+            label: "Buttons",
+            type: "array",
+            arrayFields: {
+                label: {
+                    label: "Label",
+                    type: "text",
+                    contentEditable: true,
+                    placeholder: "ex: learn more"
+                },
+                link: {
+                    label: "Link",
+                    type: "text",
+                    placeholder: "ex: http://www.abc.com"
+                },
+                linkTarget: {
+                    label: "Link Blank",
+                    type: "radio",
+                    options: [
+                        { label: "Yes", value: "yes" },
+                        { label: "No", value: "no" },
+                    ],
+                },
+                labelColor: {
+                    label: "Label Color",
+                    type: "text",
+                    placeholder: "ex: #000000"
+                },
+                backgroundColor: {
+                    label: "Background Color",
+                    type: "text",
+                    placeholder: "ex: #000000"
+                },
+                borderColor: {
+                    label: "Border Color",
+                    type: "text",
+                    placeholder: "ex: #000000"
+                },
+            },
+            defaultItemProps: (index) => ({
+                label: `Unnamed ${index + 1}`,
+            }),
+            getItemSummary: (item, index) => {
+                return item?.label || `Unnamed ${Number(index) + 1}`;
+            },
+        },
+        titleOptions: {
+            label: "Title",
+            type: "object",
+            objectFields: {
+                content2: {
+                    label: "Content",
+                    type: "text"
+                },
+                tage2: {
+                    label: "Tag",
+                    type: "radio",
+                    options: [
+                        { label: "H1", value: "h1" },
+                        { label: "H2", value: "h2" },
+                        { label: "H3", value: "h3" },
+                        { label: "H4", value: "h4" },
+                        { label: "H5", value: "h5" },
+                        { label: "H6", value: "h6" }
+                    ]
+                },
+                color2: {
+                    label: "Color",
+                    type: "text"
+                },
+                align2: {
+                    label: "Align",
+                    type: "radio",
+                    options: [
+                        { label: "Left", value: "left" },
+                        { label: "Center", value: "center" },
+                        { label: "Right", value: "right" }
+                    ],
+                },
+            },
+        },
+    },
+    defaultProps: {
+        title: "Content that adapts to your layout",
+        subTitle: "Designed for clarity and consistency",
+        description: "This section supports flexible content placement and alignment across different screen sizes.",
+        titleOptions: {
+            content2: "Content that adapts to your layout",
+            tage2: "h3",
+            color2: "",
+            align2: "left"
+        },
+    },
+    render: TextContent
+};

package/dist/components/content-builders/content-builder-actionbar.d.ts

@@ -0,0 +1,2 @@
+export declare const BuilderIframe: import("react").MemoExoticComponent<({ document, children }: any) => import("react/jsx-runtime").JSX.Element>;
+export declare const BuilderActionBar: import("react").MemoExoticComponent<({ children, label, data }: any) => import("react/jsx-runtime").JSX.Element>;

package/dist/components/content-builders/content-builder-actionbar.js

@@ -0,0 +1,21 @@
+"use client";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from "react";
+import { Edit } from "lucide-react";
+import { ActionBar } from "@puckeditor/core";
+import { useBuilderContext } from "./content-builder-context";
+import { getPuckSelectedItem } from "./content-builder-pucks-hooks";
+export const BuilderIframe = memo(({ document, children }) => {
+    if (document)
+        document.body.style.overflowY = "auto";
+    return _jsx(_Fragment, { children: children });
+});
+export const BuilderActionBar = memo(({ children, label, data }) => {
+    const selectedItem = getPuckSelectedItem();
+    const { setBuilderPanelsActive } = useBuilderContext();
+    return (_jsx("div", { children: _jsx(ActionBar, { label: label, children: _jsxs(ActionBar.Group, { children: [_jsx(ActionBar.Action, { label: "wade", onClick: () => {
+                            if (!selectedItem?.props)
+                                return;
+                            setBuilderPanelsActive("contentEditor", true);
+                        }, children: _jsx(Edit, { size: 17 }) }), children] }) }) }));
+});

package/dist/components/content-builders/content-builder-blocks.d.ts

@@ -0,0 +1,4 @@
+interface BuilderBlocksProps extends React.ComponentProps<"div"> {
+}
+export declare const BuilderBlocks: React.FC<BuilderBlocksProps>;
+export {};

package/dist/components/content-builders/content-builder-blocks.js

@@ -0,0 +1,15 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AlertDialog, AlertDialogCancel, AlertDialogContent, } from "../../shadcns/index.js";
+import { useBuilderContext } from "./content-builder-context";
+import { cn } from "../../shadcns/index.js";
+export const BuilderBlocks = () => {
+    const { blocksViews, setBuilderNewBlocks, builderProps } = useBuilderContext();
+    const { other, ...categories } = builderProps.config?.categories ?? {};
+    return (_jsx(AlertDialog, { open: blocksViews.active, onOpenChange: setBuilderNewBlocks, children: _jsx(AlertDialogContent, { className: "w-[85dvw]! max-w-450! h-[86dvh]! p-0 rounded gap-0 border-0 shadow-2xl", children: _jsxs("div", { className: "h-full flex flex-rows gap-15 overflow-hidden", children: [_jsx("div", { className: "w-60 bg-stone-100", children: "sidebar" }), _jsxs("div", { className: "flex-1 flex flex-col gap-20 justify-start items-start h-full overflow-y-auto pr-15", children: [_jsx(AlertDialogCancel, { children: "Cancel" }), categories && Object.keys(categories).map((key, index) => {
+                                const { title, components } = categories[key];
+                                return (_jsxs("div", { className: cn("flex", "flex-col", "gap-3"), children: [_jsx("div", { className: "text-base font-semibold", children: title }), _jsx("div", { className: "columns-2 gap-10", children: components?.map((component, index) => (_jsx("div", { className: "select-none break-inside-avoid cursor-pointer", onClick: () => {
+                                                    setBuilderNewBlocks(component);
+                                                }, children: _jsxs("div", { className: "grid grid-cols-2 gap-10 items-center w-full origin-top-left border-2", children: [_jsxs("hgroup", { children: [_jsxs("h3", { children: [component, "-Content that adapts to your layout"] }), _jsx("p", { children: "Designed for clarity and consistency" })] }), _jsx("div", { children: _jsx("img", { src: "/01.png" }) })] }) }, index))) })] }, index));
+                            })] })] }) }) }));
+};

package/dist/components/content-builders/content-builder-configs.d.ts

@@ -0,0 +1,10 @@
+import type { Config } from "@puckeditor/core";
+import type { RootsProps } from "./blocks";
+type Components = {};
+export declare const builderConfigs: Config<Components, RootsProps>;
+export declare const builderOverrides: {
+    iframe: import("react").MemoExoticComponent<({ document, children }: any) => import("react/jsx-runtime").JSX.Element>;
+    actionBar: import("react").MemoExoticComponent<({ children, label, data }: any) => import("react/jsx-runtime").JSX.Element>;
+    componentOverlay: import("react").MemoExoticComponent<({ children, componentType, isSelected }: any) => import("react/jsx-runtime").JSX.Element>;
+};
+export {};

package/dist/components/content-builders/content-builder-configs.js

@@ -0,0 +1,55 @@
+"use client";
+import { BaseBlockConfigs } from "./blocks/base-block";
+import { MediaContentConfigs } from "./blocks/media-content";
+import { TextContentConfigs } from "./blocks/text-content";
+import { RootsConfigs, } from "./blocks";
+import { BuilderActionBar, BuilderIframe } from "./content-builder-actionbar";
+import { BuilderComponentOverlay } from "./content-builder-overlay";
+export const builderConfigs = {
+    root: RootsConfigs,
+    components: {
+        BaseBlock: BaseBlockConfigs,
+        MediaContent: MediaContentConfigs,
+        TextContent: TextContentConfigs,
+    },
+    categories: {
+        base: {
+            title: "Base",
+            components: ["BaseBlock"],
+        },
+        base2: {
+            title: "Base2",
+            components: [
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+            ],
+        },
+        base3: {
+            title: "Base3",
+            components: [
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+                "BaseBlock",
+            ],
+        },
+        other: {
+            visible: false,
+        },
+    }
+};
+export const builderOverrides = {
+    iframe: BuilderIframe,
+    actionBar: BuilderActionBar,
+    componentOverlay: BuilderComponentOverlay
+};

package/dist/components/content-builders/content-builder-context.d.ts

@@ -0,0 +1,22 @@
+import { ContentBuilderProps } from "./content-builder";
+import type { BlocksViews, BuildersPanels, BuildersViewport } from "./content-builder-hooks";
+export interface BuilderContextValue {
+    builderProps: ContentBuilderProps;
+    builderRef?: React.RefObject<HTMLDivElement | null>;
+    blocksViews: BlocksViews;
+    viewport: BuildersViewport;
+    panels: BuildersPanels;
+    selectBuilderBlocks: () => Promise<string | boolean>;
+    setBuilderViewport: (viewport: BuildersViewport) => void;
+    setBuilderBlockView: React.Dispatch<React.SetStateAction<BlocksViews>>;
+    setBuilderPanels: React.Dispatch<React.SetStateAction<BuildersPanels>>;
+    setBuilderPanelsActive: (id: string, active?: boolean) => void;
+    setBuilderDragging: (state: boolean) => void;
+    setBuilderNewBlocks: (block: string | boolean) => void;
+    saveBuilderData: (data: any) => void;
+}
+export interface BuilderContextProps extends ContentBuilderProps {
+    children: React.ReactNode;
+}
+export declare const BuilderContextProviders: ({ children, ...builderProps }: BuilderContextProps) => import("react/jsx-runtime").JSX.Element;
+export declare const useBuilderContext: () => BuilderContextValue;

package/dist/components/content-builders/content-builder-context.js

@@ -0,0 +1,46 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, use, useMemo } from "react";
+import { useContentBuilder, } from "./content-builder-hooks";
+const BuilderContext = createContext(null);
+export const BuilderContextProviders = ({ children, ...builderProps }) => {
+    const { builderRef, viewport, blocksViews, panels, setBuilderBlockView, selectBuilderBlocks, setBuilderPanels, setBuilderPanelsActive, setBuilderViewport, setBuilderDragging, setBuilderNewBlocks, saveBuilderData, } = useContentBuilder({
+        builderProps
+    });
+    const contextValue = useMemo(() => ({
+        builderProps,
+        builderRef,
+        viewport,
+        blocksViews,
+        panels,
+        setBuilderBlockView,
+        selectBuilderBlocks,
+        setBuilderPanels,
+        setBuilderPanelsActive,
+        setBuilderViewport,
+        setBuilderDragging,
+        setBuilderNewBlocks,
+        saveBuilderData,
+    }), [
+        builderProps,
+        builderRef,
+        viewport,
+        blocksViews,
+        panels,
+        setBuilderBlockView,
+        selectBuilderBlocks,
+        setBuilderPanels,
+        setBuilderPanelsActive,
+        setBuilderViewport,
+        setBuilderDragging,
+        setBuilderNewBlocks,
+        saveBuilderData,
+    ]);
+    return _jsx(BuilderContext, { value: contextValue, children: children });
+};
+export const useBuilderContext = () => {
+    const context = use(BuilderContext);
+    if (!context)
+        throw new Error("BuilderContext must be used inside BuilderContextProviders");
+    return context;
+};

package/dist/components/content-builders/content-builder-fields.d.ts

@@ -0,0 +1 @@
+export declare const BuilderFields: import("react").MemoExoticComponent<(props: any) => import("react/jsx-runtime").JSX.Element>;

package/dist/components/content-builders/content-builder-fields.js

@@ -0,0 +1,5 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from "react";
+import { Puck } from "@puckeditor/core";
+export const BuilderFields = memo((props) => _jsx(Puck.Fields, { ...props }));

package/dist/components/content-builders/content-builder-functionbar.d.ts

@@ -0,0 +1 @@
+export declare const BuilderFunctionBar: () => import("react/jsx-runtime").JSX.Element;