@toototech/webbuilder-plugins 0.1.0

package/dist/basic/registries/media/ourSolutions/helpers.d.ts

@@ -0,0 +1,289 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_OUR_SOLUTIONS_TYPE = "wb-our-solutions";
+export declare const WB_OUR_SOLUTIONS_ITEM_TYPE = "wb-our-solutions-item";
+type SolutionItem = {
+    title: string;
+    image: string;
+    href?: string;
+    linkText?: string;
+};
+export declare function getOurSolutionsSlideTraits(): any[];
+export declare function findChildByClass(model: any, className: string | string[]): any;
+export declare function buildSolutionSlideContent(item: SolutionItem): ({
+    tagName: string;
+    type: string;
+    selectable: boolean;
+    layerable: boolean;
+    droppable: boolean;
+    attributes: {
+        class: string;
+        src: string;
+        alt: string;
+    };
+    components?: undefined;
+} | {
+    tagName: string;
+    selectable: boolean;
+    layerable: boolean;
+    droppable: boolean;
+    attributes: {
+        class: string;
+        src?: undefined;
+        alt?: undefined;
+    };
+    components: ({
+        tagName: string;
+        type: string;
+        selectable: boolean;
+        layerable: boolean;
+        droppable: boolean;
+        attributes: {
+            class: string;
+            href?: undefined;
+        };
+        components: string;
+    } | {
+        tagName: string;
+        selectable: boolean;
+        layerable: boolean;
+        droppable: boolean;
+        attributes: {
+            class: string;
+            href: string;
+        };
+        components: string;
+        type?: undefined;
+    })[];
+    type?: undefined;
+})[];
+export declare function buildSolutionSlideDef(item: SolutionItem): {
+    type: string;
+    tagName: string;
+    selectable: boolean;
+    layerable: boolean;
+    droppable: boolean;
+    osTitle: string;
+    osImageSrc: string;
+    osHref: string;
+    osLinkText: string;
+    attributes: {
+        class: string;
+        'data-title': string;
+        'data-link-href': string;
+        'data-link-text': string;
+    };
+    components: ({
+        tagName: string;
+        type: string;
+        selectable: boolean;
+        layerable: boolean;
+        droppable: boolean;
+        attributes: {
+            class: string;
+            src: string;
+            alt: string;
+        };
+        components?: undefined;
+    } | {
+        tagName: string;
+        selectable: boolean;
+        layerable: boolean;
+        droppable: boolean;
+        attributes: {
+            class: string;
+            src?: undefined;
+            alt?: undefined;
+        };
+        components: ({
+            tagName: string;
+            type: string;
+            selectable: boolean;
+            layerable: boolean;
+            droppable: boolean;
+            attributes: {
+                class: string;
+                href?: undefined;
+            };
+            components: string;
+        } | {
+            tagName: string;
+            selectable: boolean;
+            layerable: boolean;
+            droppable: boolean;
+            attributes: {
+                class: string;
+                href: string;
+            };
+            components: string;
+            type?: undefined;
+        })[];
+        type?: undefined;
+    })[];
+};
+export declare function buildOurSolutionsTree(): {
+    tagName: string;
+    selectable: boolean;
+    layerable: boolean;
+    droppable: boolean;
+    attributes: {
+        class: string;
+    };
+    components: ({
+        tagName: string;
+        type: string;
+        selectable: boolean;
+        layerable: boolean;
+        droppable: boolean;
+        attributes: {
+            class: string;
+        };
+        components: string;
+    } | {
+        tagName: string;
+        selectable: boolean;
+        layerable: boolean;
+        droppable: boolean;
+        attributes: {
+            class: string;
+        };
+        components: {
+            tagName: string;
+            selectable: boolean;
+            layerable: boolean;
+            droppable: boolean;
+            attributes: {
+                class: string;
+                href: string;
+            };
+            components: string;
+        }[];
+        type?: undefined;
+    } | {
+        tagName: string;
+        selectable: boolean;
+        layerable: boolean;
+        droppable: boolean;
+        attributes: {
+            class: string;
+        };
+        components: ({
+            tagName: string;
+            selectable: boolean;
+            layerable: boolean;
+            droppable: boolean;
+            attributes: {
+                class: string;
+            };
+            components: {
+                tagName: string;
+                selectable: boolean;
+                layerable: boolean;
+                droppable: boolean;
+                attributes: {
+                    class: string;
+                };
+                components: {
+                    type: string;
+                    tagName: string;
+                    selectable: boolean;
+                    layerable: boolean;
+                    droppable: boolean;
+                    osTitle: string;
+                    osImageSrc: string;
+                    osHref: string;
+                    osLinkText: string;
+                    attributes: {
+                        class: string;
+                        'data-title': string;
+                        'data-link-href': string;
+                        'data-link-text': string;
+                    };
+                    components: ({
+                        tagName: string;
+                        type: string;
+                        selectable: boolean;
+                        layerable: boolean;
+                        droppable: boolean;
+                        attributes: {
+                            class: string;
+                            src: string;
+                            alt: string;
+                        };
+                        components?: undefined;
+                    } | {
+                        tagName: string;
+                        selectable: boolean;
+                        layerable: boolean;
+                        droppable: boolean;
+                        attributes: {
+                            class: string;
+                            src?: undefined;
+                            alt?: undefined;
+                        };
+                        components: ({
+                            tagName: string;
+                            type: string;
+                            selectable: boolean;
+                            layerable: boolean;
+                            droppable: boolean;
+                            attributes: {
+                                class: string;
+                                href?: undefined;
+                            };
+                            components: string;
+                        } | {
+                            tagName: string;
+                            selectable: boolean;
+                            layerable: boolean;
+                            droppable: boolean;
+                            attributes: {
+                                class: string;
+                                href: string;
+                            };
+                            components: string;
+                            type?: undefined;
+                        })[];
+                        type?: undefined;
+                    })[];
+                }[];
+            }[];
+        } | {
+            tagName: string;
+            selectable: boolean;
+            layerable: boolean;
+            droppable: boolean;
+            attributes: {
+                class: string;
+            };
+            components: {
+                tagName: string;
+                selectable: boolean;
+                layerable: boolean;
+                droppable: boolean;
+                attributes: {
+                    class: string;
+                };
+                components: string;
+            }[];
+        } | {
+            tagName: string;
+            selectable: boolean;
+            layerable: boolean;
+            droppable: boolean;
+            attributes: {
+                class: string;
+            };
+            components?: undefined;
+        })[];
+        type?: undefined;
+    })[];
+}[];
+export declare function resolveRoot(editor: Editor, traitCtx?: any): any;
+export declare function writeText(component: any, value: string): void;
+export declare function getSlides(root: any): any[];
+export declare function syncRootContent(model: any): void;
+export declare function syncSolutionItem(model: any): void;
+export declare function addSolutionItem(root: any): void;
+export declare function removeSolutionItem(root: any, index: number): void;
+export declare function getOurSolutionsSlideRoot(component: any): any;
+export {};

package/dist/basic/registries/media/ourSolutions/index.d.ts

@@ -0,0 +1,4 @@
+import type { Editor } from 'grapesjs';
+export { WB_OUR_SOLUTIONS_ITEM_TYPE, WB_OUR_SOLUTIONS_TYPE, } from './helpers.js';
+export { SOLUTIONS_CSS } from './style.js';
+export declare function registerOurSolutionsComponent(editor: Editor): void;

package/dist/basic/registries/media/ourSolutions/script.d.ts

@@ -0,0 +1 @@
+export declare function makeOurSolutionsScript(): (this: HTMLElement) => void;

package/dist/basic/registries/media/ourSolutions/style.d.ts

@@ -0,0 +1 @@
+export declare const SOLUTIONS_CSS = "\n  .wb-our-solutions {\n    background: #f7f8fa;\n    padding: 64px 0 80px;\n    overflow: hidden;\n    --swiper-pagination-bullet-width: 44px;\n    --swiper-pagination-bullet-height: 2px;\n    --swiper-pagination-bullet-border-radius: 0;\n    --swiper-pagination-bullet-horizontal-gap: 0;\n    --swiper-pagination-color: #000;\n  }\n  .wb-our-solutions__container {\n    max-width: 1352px;\n    margin: 0 auto;\n    padding: 0 20px;\n    box-sizing: border-box;\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) auto;\n    grid-template-areas:\n      \"title actions\"\n      \"carousel carousel\";\n    align-items: center;\n    column-gap: 24px;\n    row-gap: 40px;\n  }\n  .wb-our-solutions__title {\n    grid-area: title;\n    margin: 0;\n    font-size: 48px;\n    line-height: 1.2;\n    font-weight: 600;\n    color: #000a11;\n  }\n  .wb-our-solutions__actions {\n    grid-area: actions;\n    display: flex;\n    gap: 16px;\n    justify-self: end;\n  }\n  .wb-our-solutions__btn {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 12px 28px;\n    font-size: 16px;\n    font-weight: 500;\n    color: #000a11;\n    text-decoration: none;\n    transition: opacity 0.3s ease;\n  }\n  .wb-our-solutions__btn:hover {\n    opacity: 0.85;\n  }\n  .wb-our-solutions__btn--primary {\n    background: #ffd200;\n    border: none;\n  }\n  .wb-our-solutions__btn--outline {\n    color: #003152;\n    border: 1px solid #003152;\n  }\n  .wb-our-solutions__carousel-wrap {\n    grid-area: carousel;\n    position: relative;\n    min-width: 0;\n    padding-bottom: 48px;\n  }\n  .wb-our-solutions__swiper.swiper {\n    overflow: visible;\n  }\n  .wb-our-solutions__slide.swiper-slide {\n    position: relative;\n    overflow: hidden;\n    aspect-ratio: 800 / 528;\n    width: 800px;\n  }\n  .wb-our-solutions__slide-img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n  }\n  .wb-our-solutions__slide-overlay {\n    position: absolute;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    padding: 32px;\n    background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, transparent 100%);\n    display: flex;\n    align-items: flex-end;\n    justify-content: space-between;\n    gap: 24px;\n  }\n  .wb-our-solutions__slide-title {\n    margin: 0;\n    max-width: 320px;\n    font-size: 28px;\n    line-height: 1.4;\n    font-weight: 500;\n    color: #ffffff;\n  }\n  .wb-our-solutions__slide-link {\n    align-self: flex-end;\n    flex-shrink: 0;\n    font-size: 14px;\n    color: #ffffff;\n    text-decoration: none;\n    border-bottom: 1px solid rgba(255, 255, 255, 0.6);\n    padding-bottom: 2px;\n  }\n  .wb-our-solutions__slide-link:hover {\n    border-color: #ffffff;\n  }\n  .wb-our-solutions__pagination {\n    text-align: center;\n  }\n  .wb-our-solutions__nav-prev,\n  .wb-our-solutions__nav-next {\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    z-index: 10;\n    width: 48px;\n    height: 48px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: #768389;\n    cursor: pointer;\n    transition: color 0.3s ease;\n    font-size: 40px;\n  }\n  .wb-our-solutions__nav-prev { left: -56px; }\n  .wb-our-solutions__nav-next { right: -56px; }\n  .wb-our-solutions__nav-icon {\n    width: 32px;\n    height: 32px;\n  }\n  .wb-our-solutions__nav-icon .icon {\n    width: 1em;\n    height: 1em;\n  }\n  @media (max-width: 767px) {\n    .wb-our-solutions {\n      padding: 40px 0 56px;\n      --swiper-pagination-bullet-width: 32px;\n    }\n    .wb-our-solutions__container {\n      grid-template-columns: 1fr;\n      grid-template-areas:\n        \"title\"\n        \"carousel\"\n        \"actions\";\n      row-gap: 24px;\n    }\n    .wb-our-solutions__title {\n      font-size: 28px;\n    }\n    .wb-our-solutions__actions {\n      width: 100%;\n      gap: 12px;\n      justify-self: stretch;\n      justify-content: center;\n    }\n    .wb-our-solutions__btn {\n      padding: 10px 20px;\n      font-size: 14px;\n    }\n    .wb-our-solutions__slide.swiper-slide {\n      width: 100%;\n    }\n    .wb-our-solutions__slide-overlay {\n      padding: 20px;\n    }\n    .wb-our-solutions__slide-title {\n      font-size: 20px;\n    }\n    .wb-our-solutions__carousel-wrap {\n      padding-bottom: 32px;\n    }\n    .wb-our-solutions__nav-prev,\n    .wb-our-solutions__nav-next {\n      color: #ffffff;\n      width: auto;\n      height: auto;\n      font-size: 24px;\n      margin-top: -16px;\n    }\n    .wb-our-solutions__nav-prev { left: 8px; }\n    .wb-our-solutions__nav-next { right: 8px; }\n    .wb-our-solutions__pagination {\n      margin-top: 24px;\n    }\n  }\n";

package/dist/basic/registries/media/pdfViewer/index.d.ts

@@ -0,0 +1,3 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_PDF_VIEWER_TYPE = "wb-pdf-viewer";
+export declare function registerPdfViewerComponent(editor: Editor): void;

package/dist/basic/registries/media/productCategories/index.d.ts

@@ -0,0 +1,4 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_PRODUCT_CATEGORIES_TYPE = "wb-product-categories";
+export declare const WB_PRODUCT_CATEGORY_ITEM_TYPE = "wb-product-category-item";
+export declare function registerProductCategoriesComponent(editor: Editor): void;

package/dist/basic/registries/media/tabMediaGallery/index.d.ts

@@ -0,0 +1,3 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_TAB_MEDIA_GALLERY_TYPE = "wb-tab-media-gallery";
+export declare function registerTabMediaGalleryComponent(editor: Editor): void;

package/dist/basic/registries/media/video/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * video.ts — Video Modal Player 组件
+ *
+ * 封面图 + 播放按钮，点击后弹窗播放视频。
+ * 支持从素材库选取封面图和本地视频。
+ * 支持外部视频链接（YouTube embed / 其他 iframe URL）。
+ *
+ * Traits: 视频来源（本地/外部）、视频 URL、封面图、播放图标样式、播放图标大小
+ */
+import type { Editor } from 'grapesjs';
+export declare const WB_VIDEO_TYPE = "wb-video";
+export declare function registerVideoComponent(editor: Editor): void;

package/dist/basic/registries/navigation/footer/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * footer.ts — Footer block component
+ *
+ * Structure: Logo top → Contact + Nav columns → Bottom bar
+ * Uses native CSS with hover animations and mobile-responsive layout.
+ */
+import type { Editor } from 'grapesjs';
+export declare function registerFooter(editor: Editor): void;
+export declare const WB_FOOTER_TYPE = "footer-section";
+export declare function registerFooterComponent(editor: import('grapesjs').Editor): void;

package/dist/basic/registries/navigation/index.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentRegistryExecutor } from '../types.js';
+export declare const BASIC_NAVIGATION_REGISTRIES: ComponentRegistryExecutor[];

package/dist/basic/registries/navigation/languageSwitcher/index.d.ts

@@ -0,0 +1,6 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_LANGUAGE_SWITCHER_TYPE = "wb-language-switcher";
+export declare function createLanguageSwitcherBlockContent(): {
+    type: string;
+};
+export declare function registerLanguageSwitcherComponent(editor: Editor): void;

package/dist/basic/registries/navigation/logo/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * logo.ts — Logo block
+ *
+ * An <a> wrapping an <img>. Traits: href (default "/") and target.
+ */
+import type { Editor } from 'grapesjs';
+export declare function registerLogo(editor: Editor): void;
+export declare const WB_LOGO_TYPE = "logo-brand";
+export declare function registerLogoComponent(editor: import('grapesjs').Editor): void;

package/dist/basic/registries/navigation/navbar/constants.d.ts

@@ -0,0 +1,38 @@
+export declare const TYPE_NAVBAR = "navbar";
+export declare const TYPE_NAVBAR_MENU = "navbar-menu";
+export declare const TYPE_NAVBAR_LINK = "navbar-link";
+export declare const TYPE_NAV_GROUP = "nav-group";
+export declare const TYPE_DROPDOWN = "nav-dropdown";
+export declare const TYPE_DROPDOWN_ITEM = "nav-dropdown-item";
+export declare const TYPE_MEGA = "nav-mega";
+export declare const TYPE_MEGA_INNER = "nav-mega-inner";
+export declare const TYPE_MEGA_COL = "nav-mega-col";
+export declare const TYPE_MEGA_ITEM = "nav-mega-item";
+export declare const TYPE_MEGA_LEFT = "nav-mega-left";
+export declare const TYPE_MEGA_RIGHT = "nav-mega-right";
+export declare const TYPE_NAVBAR_LEFT = "navbar-left-slot";
+export declare const TYPE_NAVBAR_CENTER = "navbar-center-slot";
+export declare const TYPE_NAVBAR_RIGHT = "navbar-right-slot";
+export type NavGroupMenuType = 'dropdown' | 'mega';
+export declare const ICON = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\"\n  stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\n  style=\"width:24px;height:24px;\">\n  <rect x=\"2\" y=\"4\" width=\"20\" height=\"6\" rx=\"1.5\"/>\n  <line x1=\"5\" y1=\"7\" x2=\"8\" y2=\"7\" stroke-width=\"2\"/>\n  <line x1=\"10\" y1=\"7\" x2=\"13\" y2=\"7\"/>\n  <line x1=\"15\" y1=\"7\" x2=\"17\" y2=\"7\"/>\n  <rect x=\"18\" y=\"5.5\" width=\"4\" height=\"3\" rx=\"1.5\" fill=\"currentColor\" stroke=\"none\"/>\n  <line x1=\"2\" y1=\"15\" x2=\"22\" y2=\"15\"/>\n  <line x1=\"2\" y1=\"19\" x2=\"16\" y2=\"19\"/>\n</svg>";
+export declare const NAV_GROUP_CHEVRON = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\"\n  stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\n  width=\"12\" height=\"12\"><polyline points=\"6 9 12 15 18 9\"/></svg>";
+export declare const LINK_TARGET_OPTIONS: {
+    id: string;
+    name: string;
+}[];
+export declare const NAV_GROUP_TYPE_OPTIONS: {
+    id: string;
+    name: string;
+}[];
+export declare const NAVBAR_DRAWER_SIDE_OPTIONS: {
+    id: string;
+    name: string;
+}[];
+export declare const NAVBAR_MENU_ALIGN_OPTIONS: {
+    id: string;
+    name: string;
+}[];
+export declare const NAVBAR_MODE_OPTIONS: {
+    id: string;
+    name: string;
+}[];