@xwadex/fesd-next 0.3.4-7.2 → 0.3.4-7.21

package/dist/components/anchors/anchors.d.ts

@@ -0,0 +1,14 @@
+import type { AnchorOptions } from "../../hooks/index.js";
+interface PropsType extends React.ComponentProps<"div"> {
+    name: string;
+}
+export declare const AnchorTarget: React.FC<PropsType>;
+export declare const AnchorOffseter: React.FC<PropsType>;
+type TriggerProps = AnchorOptions & React.ComponentProps<"div"> & {};
+export declare const AnchorTrigger: React.FC<TriggerProps>;
+export declare const Anchors: {
+    Trigger: import("react").FC<TriggerProps>;
+    Target: import("react").FC<PropsType>;
+    Offseter: import("react").FC<PropsType>;
+};
+export {};

package/dist/components/anchors/anchors.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+// update: 2025.11.12
+// version: 0.0.2.bate
+// dev: wade
+import { useAnchors } from "../../hooks/index.js";
+import { cn } from "../../shadcns/index.js";
+export const AnchorTarget = ({ name, ...props }) => {
+    const { registerAnchors } = useAnchors();
+    return (_jsx("div", { ...props, ...registerAnchors(name) }));
+};
+export const AnchorOffseter = ({ name, ...props }) => {
+    const { registerOffseters } = useAnchors();
+    return (_jsx("div", { ...props, ...registerOffseters(name) }));
+};
+export const AnchorTrigger = ({ children, className, ...options }) => {
+    const { scrollToAnchor } = useAnchors();
+    return (_jsx("div", { className: cn(className), onClick: () => scrollToAnchor(options), children: children }));
+};
+export const Anchors = {
+    Trigger: AnchorTrigger,
+    Target: AnchorTarget,
+    Offseter: AnchorOffseter
+};

package/dist/components/anchors/index.d.ts

@@ -0,0 +1 @@
+export * from "./anchors";

package/dist/components/anchors/index.js

@@ -0,0 +1 @@
+export * from "./anchors";

package/dist/components/embla-carousels/embla-carousels-hooks.d.ts

@@ -0,0 +1,36 @@
+import useEmblaCarousel from "embla-carousel-react";
+import type { UseEmblaCarouselType } from "embla-carousel-react";
+import type { AutoplayOptionsType } from "embla-carousel-autoplay";
+import type { AutoScrollOptionsType } from "embla-carousel-auto-scroll";
+import type { AutoHeightOptionsType } from "embla-carousel-auto-height";
+import type { ClassNamesOptionsType } from "embla-carousel-class-names";
+import type { FadeOptionsType } from "embla-carousel-fade";
+type CarouselApi = UseEmblaCarouselType[1];
+type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
+type CarouselOptions = UseCarouselParameters[0];
+export interface EmblaCarouselsHooksTypes {
+    options?: CarouselOptions;
+    autoplay?: AutoplayOptionsType | true;
+    autoScroll?: AutoScrollOptionsType | true;
+    classNames?: ClassNamesOptionsType | true;
+    autoHeight?: AutoHeightOptionsType | true;
+    fade?: FadeOptionsType | true;
+    wheel?: {
+        wheelDraggingClass?: string;
+        forceWheelAxis?: "x" | "y";
+        target?: Element;
+    } | true;
+    setApi?: (api: CarouselApi) => void;
+}
+export declare function emblaCarouselsHooks({ options, autoplay, autoScroll, classNames, autoHeight, fade, wheel, setApi, }: EmblaCarouselsHooksTypes): {
+    emblaRef: (node: HTMLElement | null) => void;
+    emblaApi: CarouselApi;
+    orientation: "x" | "y";
+    currentIndex: number;
+    isScrollPrev: boolean;
+    isScrollNext: boolean;
+    scrollPrev: () => void;
+    scrollNext: () => void;
+    onKeyDownCapture: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+};
+export {};

package/dist/components/embla-carousels/embla-carousels-hooks.js

@@ -0,0 +1,84 @@
+"use client";
+// update: 2025.11.20
+// version: 0.0.1.bate
+// dev: wade
+import { useCallback, useEffect, useEffectEvent, useMemo, useState } from "react";
+import useEmblaCarousel from "embla-carousel-react";
+import { WheelGesturesPlugin } from "embla-carousel-wheel-gestures";
+import Autoplay from "embla-carousel-autoplay";
+import AutoScroll from "embla-carousel-auto-scroll";
+import AutoHeight from "embla-carousel-auto-height";
+import ClassNames from "embla-carousel-class-names";
+import Fade from "embla-carousel-fade";
+export function emblaCarouselsHooks({ options, autoplay, autoScroll, classNames, autoHeight, fade, wheel, setApi, }) {
+    const orientation = options?.axis ?? "x";
+    const plugins = useMemo(() => ([
+        autoplay && Autoplay(typeof autoplay == "boolean" ? undefined : autoplay),
+        autoScroll && AutoScroll(typeof autoScroll == "boolean" ? undefined : autoScroll),
+        autoHeight && AutoHeight(typeof autoHeight == "boolean" ? undefined : autoHeight),
+        classNames && ClassNames(typeof classNames == "boolean" ? undefined : classNames),
+        fade && Fade(typeof fade == "boolean" ? undefined : fade),
+        wheel && WheelGesturesPlugin(typeof wheel == "boolean" ? undefined : wheel),
+    ].filter(plugin => plugin)), [
+        autoplay,
+        autoScroll,
+        classNames,
+        fade,
+        wheel,
+        autoHeight
+    ]);
+    const [emblaRef, emblaApi] = useEmblaCarousel(options, plugins);
+    const [currentIndex, setCurrentIndex] = useState(0);
+    const [isScrollPrev, setIsScrollPrev] = useState(false);
+    const [isScrollNext, setIsScrollNext] = useState(false);
+    const scrollPrev = useCallback(() => {
+        emblaApi?.scrollPrev();
+    }, [emblaApi]);
+    const scrollNext = useCallback(() => {
+        emblaApi?.scrollNext();
+    }, [emblaApi]);
+    const onKeyDownCapture = useCallback((event) => {
+        console.log("key...");
+        if (event.key === "ArrowLeft") {
+            event.preventDefault();
+            scrollPrev();
+        }
+        else if (event.key === "ArrowRight") {
+            event.preventDefault();
+            scrollNext();
+        }
+    }, [scrollPrev, scrollNext]);
+    const onSelect = useCallback((api) => {
+        if (!api)
+            return;
+        setCurrentIndex(api?.selectedScrollSnap());
+        setIsScrollPrev(api.canScrollPrev());
+        setIsScrollNext(api.canScrollNext());
+    }, []);
+    const initalEffect = useEffectEvent(() => {
+        if (!emblaApi || !setApi)
+            return;
+        setApi?.(emblaApi);
+        onSelect(emblaApi);
+        emblaApi.on("reInit", onSelect);
+        emblaApi.on("select", onSelect);
+        return () => {
+            emblaApi?.off("select", onSelect);
+        };
+    });
+    useEffect(() => {
+        const events = initalEffect();
+        return () => { events?.(); };
+    }, [emblaApi]);
+    return {
+        emblaRef,
+        emblaApi,
+        orientation,
+        currentIndex,
+        isScrollPrev,
+        isScrollNext,
+        scrollPrev,
+        scrollNext,
+        onKeyDownCapture
+    };
+}

package/dist/components/embla-carousels/embla-carousels.d.ts

@@ -0,0 +1,23 @@
+import useEmblaCarousel from "embla-carousel-react";
+import type { EmblaCarouselsHooksTypes } from "./embla-carousels-hooks";
+export type CarouselsContextProps = {
+    emblaRef: ReturnType<typeof useEmblaCarousel>[0];
+    emblaApi: ReturnType<typeof useEmblaCarousel>[1];
+    currentIndex?: number;
+    orientation: "x" | "y";
+    isScrollPrev: boolean;
+    isScrollNext: boolean;
+    scrollPrev: () => void;
+    scrollNext: () => void;
+};
+export declare const useCarouselsContext: () => CarouselsContextProps;
+export interface PropsTypes extends EmblaCarouselsHooksTypes, React.ComponentProps<"div"> {
+}
+export declare const EmblaCarouselsRoots: React.FC<PropsTypes>;
+export declare const EmblaCarouselsContents: React.FC<React.ComponentProps<"div">>;
+export declare const EmblaCarouselsSlides: React.FC<React.ComponentProps<"div">>;
+export declare const EmblaCarousels: {
+    Roots: import("react").FC<PropsTypes>;
+    Contents: import("react").FC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
+    Slides: import("react").FC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
+};

package/dist/components/embla-carousels/embla-carousels.js

@@ -0,0 +1,59 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+// update: 2025.11.20
+// version: 0.0.1.bate
+// dev: wade
+import { createContext, memo, use, useMemo } from "react";
+import { emblaCarouselsHooks, } from "./embla-carousels-hooks";
+import { cn } from "../../shadcns/index.js";
+const CarouselsContext = createContext(null);
+export const useCarouselsContext = () => {
+    const context = use(CarouselsContext);
+    if (!context)
+        throw new Error("useCarousel must be used within a <Carousel />");
+    return context;
+};
+export const EmblaCarouselsRoots = memo(({ children, className, setApi, options, autoplay, autoScroll, classNames, autoHeight, fade, wheel, ...props }) => {
+    const { emblaRef, emblaApi, orientation, currentIndex, isScrollPrev, isScrollNext, scrollPrev, scrollNext, onKeyDownCapture, } = emblaCarouselsHooks({
+        setApi,
+        options,
+        autoplay,
+        autoScroll,
+        classNames,
+        autoHeight,
+        fade,
+        wheel,
+    });
+    const contextValue = useMemo(() => ({
+        emblaRef,
+        emblaApi,
+        orientation,
+        currentIndex,
+        isScrollPrev,
+        isScrollNext,
+        scrollPrev,
+        scrollNext,
+    }), [
+        emblaRef,
+        emblaApi,
+        orientation,
+        currentIndex,
+        isScrollPrev,
+        isScrollNext,
+        scrollPrev,
+        scrollNext,
+    ]);
+    return (_jsx(CarouselsContext, { value: contextValue, children: _jsx("div", { "data-component": "embla-carousels", onKeyDownCapture: onKeyDownCapture, className: cn("relative overflow-hidden", className), "aria-roledescription": "embla-carousels", role: "region", ...props, children: children }) }));
+});
+export const EmblaCarouselsContents = memo(({ className, ...props }) => {
+    const { emblaRef, orientation } = useCarouselsContext();
+    return (_jsx("div", { ref: emblaRef, className: "overflow-hidden", "data-component": "embla-carousels-contents", children: _jsx("div", { className: cn("flex", orientation === "x" ? "flex-row" : "flex-col", className), ...props }) }));
+});
+export const EmblaCarouselsSlides = memo(({ className, ...props }) => {
+    return (_jsx("div", { role: "group", "aria-roledescription": "slide", "data-component": "embla-carousels-slides", className: cn("min-w-0 shrink-0 grow-0 basis-full", className), ...props }));
+});
+export const EmblaCarousels = {
+    Roots: EmblaCarouselsRoots,
+    Contents: EmblaCarouselsContents,
+    Slides: EmblaCarouselsSlides,
+};

package/dist/components/embla-carousels/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./embla-carousels";
+export * from "./embla-carousels-hooks";

package/dist/components/embla-carousels/index.js

@@ -0,0 +1,2 @@
+export * from "./embla-carousels";
+export * from "./embla-carousels-hooks";

package/dist/components/index.d.ts

@@ -1,2 +1,5 @@
-export declare const test = "wade";
-export { default as TestComponent } from "./TestComponent";
+export * from "./anchors";
+export * from "./puck-contents";
+export * from "./scroll-containers";
+export * from "./embla-carousels";
+export * from "./tests";

package/dist/components/index.js

@@ -1,2 +1,5 @@
-export const test = "wade";
-export { default as TestComponent } from "./TestComponent";
+export * from "./anchors";
+export * from "./puck-contents";
+export * from "./scroll-containers";
+export * from "./embla-carousels";
+export * from "./tests";

package/dist/components/puck-contents/-heading-block.d.ts

@@ -0,0 +1,13 @@
+import { ComponentConfig, PuckComponent } from "@puckeditor/core";
+export interface Props {
+    title?: string;
+    description?: string;
+    subTitle?: string;
+    buttons?: any;
+    imgs?: string;
+    options?: any;
+    textBlock?: any;
+    mediaBlock?: any;
+}
+export declare const PuckBaseBlock: PuckComponent<Props>;
+export declare const BaseBlock: ComponentConfig;

package/dist/components/puck-contents/-heading-block.js

@@ -0,0 +1,77 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { TextContent } from "./-text-content";
+import { MediaContent } from "./-media-content";
+import { cn } from "../../shadcns/index.js";
+export const PuckBaseBlock = ({ title, description, subTitle, buttons, imgs, options, textBlock: TextBlock, mediaBlock: MediaBlock, ...puckProps }) => {
+    const { textAlign } = options;
+    return (_jsx("div", { className: cn("p-10 grid items-center justify-center gap-10", textAlign == "right"
+            ? "grid-cols-[40%_60%]"
+            : "grid-cols-[60%_40%]"), children: textAlign == "left"
+            ? _jsxs(_Fragment, { children: [_jsxs("div", { children: [" ", TextBlock ? _jsx(TextBlock, {}) : null] }), _jsxs("div", { children: [" ", MediaBlock ? _jsx(MediaBlock, {}) : null] })] })
+            : _jsxs(_Fragment, { children: [_jsxs("div", { children: [" ", MediaBlock ? _jsx(MediaBlock, {}) : null] }), _jsxs("div", { children: [" ", TextBlock ? _jsx(TextBlock, {}) : null] })] }) }));
+};
+export const BaseBlock = {
+    label: "Base Block",
+    fields: {
+        textBlock: { type: "slot", allow: ["TextContent"] },
+        mediaBlock: { 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"
+                },
+            },
+        },
+    },
+    defaultProps: {
+        options: {
+            textAlign: "left",
+            textAlign2: "top"
+        },
+        background: {
+            isImage: "no"
+        },
+        textBlock: [{ type: "TextContent", props: { ...TextContent.defaultProps } }],
+        mediaBlock: [{ type: "MediaContent", props: { ...MediaContent.defaultProps } },],
+    },
+    render: PuckBaseBlock
+};

package/dist/components/puck-contents/-media-content.d.ts

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

package/dist/components/puck-contents/-media-content.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const PuckMediaContent = ({ alt, imgs, }) => {
+    return (_jsxs("figure", { className: "flex flex-col gap-3 items-center [&_img]:max-w-full", children: [_jsx("div", { className: "bg-gray-100 ", children: _jsx("img", { src: String(imgs) }) }), alt && _jsx("figcaption", { children: alt })] }));
+};
+export const MediaContent = {
+    label: "Media Content",
+    permissions: {
+        delete: false,
+        drag: false,
+        insert: false
+    },
+    fields: {
+        imgs: { type: "text" },
+        alt: { type: "text" },
+    },
+    defaultProps: {
+        imgs: "/01.png",
+        alt: "alt"
+    },
+    render: PuckMediaContent
+};

package/dist/components/puck-contents/-text-content.d.ts

@@ -0,0 +1,13 @@
+import { ComponentConfig, PuckComponent } from "@puckeditor/core";
+export interface Props {
+    title?: string;
+    description?: string;
+    subTitle?: string;
+    buttons?: any;
+    imgs?: string;
+    options?: any;
+    css?: any;
+    puck?: any;
+}
+export declare const PuckTextContent: PuckComponent<Props>;
+export declare const TextContent: ComponentConfig;

package/dist/components/puck-contents/-text-content.js

@@ -0,0 +1,148 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { AutoField, FieldLabel } from "@puckeditor/core";
+import { cn } from "../../shadcns/index.js";
+export const PuckTextContent = ({ title, description, subTitle, buttons, puck, css }) => {
+    return (_jsxs("div", { "data-component": "text-content-root", 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("h2", { "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 TextContent = {
+    label: "TextContent",
+    permissions: {
+        delete: false,
+        drag: false,
+        insert: false
+    },
+    resolveData: async ({ props }, { changed }) => {
+        if (changed.buttons && props?.buttons?.length) {
+            const defaultButtons = props.buttons.map((button, index) => {
+                if (button?.label == "")
+                    button.label = `Unnamed ${Number(index) + 1}`;
+                if (!button?.linkTarget)
+                    button["linkTarget"] = "yes";
+                return button;
+            });
+            console.log("defaultButtons", defaultButtons);
+            return { ...props, buttons: defaultButtons };
+        }
+        return { props };
+    },
+    fields: {
+        title2: {
+            label: "Title2",
+            type: "custom",
+            render: ({ onChange, value }) => {
+                const [tab, setTab] = useState("A");
+                return (_jsxs(FieldLabel, { label: "Title2", readOnly: true, children: [_jsxs("div", { className: "flex gap-2", children: [_jsx("button", { onClick: () => setTab("A"), className: "flex-1 p-2 border", children: "A" }), _jsx("button", { onClick: () => setTab("B"), className: "flex-1 p-2 border", children: "B" })] }), tab == "A" && _jsx("div", { children: _jsx(AutoField, { field: { type: "text" }, onChange: onChange, value: value ?? "wade", readOnly: true }) }), tab == "B" && _jsx("div", { children: "B" })] }));
+            }
+        },
+        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: PuckTextContent
+};

package/dist/components/puck-contents/index.d.ts

@@ -0,0 +1,2 @@
+export { default as PuckContentsRander } from "./puck-contents-rander";
+export { default as PuckContentsEditor } from "./puck-contents-editor";

package/dist/components/puck-contents/index.js

@@ -0,0 +1,2 @@
+export { default as PuckContentsRander } from "./puck-contents-rander";
+export { default as PuckContentsEditor } from "./puck-contents-editor";

package/dist/components/puck-contents/puck-configs.d.ts

@@ -0,0 +1,14 @@
+import { Config } from "@puckeditor/core";
+type RootProps = {
+    title: string;
+    description: string;
+};
+export declare const renderConfig: Config<{}, RootProps>;
+export declare const editorConfig: Config<{}, RootProps>;
+export declare const editorConfigOverrides: {
+    iframe: ({ document, children }: any) => import("react/jsx-runtime").JSX.Element;
+    headerActions: ({ children }: any) => import("react/jsx-runtime").JSX.Element;
+    components: ({ children }: any) => import("react/jsx-runtime").JSX.Element;
+    componentItem: (props: any) => import("react/jsx-runtime").JSX.Element;
+};
+export {};

package/dist/components/puck-contents/puck-configs.js

@@ -0,0 +1,65 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useRouter } from "next/navigation";
+import { BaseBlock } from "./-heading-block";
+import { MediaContent } from "./-media-content";
+import { TextContent } from "./-text-content";
+import { cn } from "../../shadcns/index.js";
+export const renderConfig = {
+    components: {
+        "Base Block": BaseBlock,
+        MediaContent,
+        TextContent,
+    },
+    categories: {
+        "Base": {
+            title: "Base Block",
+            components: ["Base Block"],
+        },
+        other: {
+            visible: false,
+        },
+    },
+};
+export const editorConfig = {
+    ...renderConfig,
+    root: {
+        label: "Page Content",
+        fields: {
+            title: { type: "text" }, // You need to redefine the `title` field if we want to retain it
+            description: { type: "textarea" },
+        },
+        defaultProps: {
+            title: "Hello, world",
+            description: "Lorem ipsum",
+            content: [],
+        },
+        render: ({ children, title, description, }) => {
+            return (_jsxs("div", { className: "h-full flex flex-col bg-white text-black!", children: [_jsxs("header", { className: "px-10 py-2 flex justify-between border-b fixed t-0 w-full z-9 bg-white", children: [_jsx("div", { className: "text-xl font-semibold flex-1", children: "BEONES" }), _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("div", { className: "pt-11.5 h-full", children: children }), _jsx("footer", { className: cn("px-10 py-2"), children: description })] }));
+        },
+    },
+};
+export const editorConfigOverrides = {
+    iframe: ({ document, children }) => {
+        if (document) {
+            document.body.style.overflowY = "auto";
+            // document.documentElement.style.overflowY = "auto";
+            document.body.style.scrollBehavior = "none";
+        }
+        return _jsx(_Fragment, { children: children });
+    },
+    headerActions: ({ children }) => {
+        // const usePuck = createUsePuck();
+        const router = useRouter();
+        // const preview = () => {
+        // 	const appState = usePuck((s) => s.appState);
+        // 	console.log("appState", appState.data);
+        // 	// router.push("/puck/previews")
+        // }
+        return (_jsx("div", { className: "flex gap-2", children: children }));
+    },
+    components: ({ children }) => _jsxs("div", { children: ["eeee", children] }),
+    componentItem: (props) => {
+        return (_jsxs("div", { className: "p-3 justify-between w-full min-h-10 border bg-white hover:bg-gray-50 flex items-center cursor-grab active:cursor-grabbing text-black! border-black/10", children: [_jsx("div", { children: props.name }), _jsx("div", { children: _jsx("img", { src: "/01.png", className: "max-w-20" }) })] }));
+    },
+};