@toototech/webbuilder-plugins 0.1.0

package/LICENSE

@@ -0,0 +1 @@
+MIT

package/README.md

@@ -0,0 +1,3 @@
+# @toototech/webbuilder-plugins
+
+WebBuilder official plugin package. It exposes Basic components, CMS components, i18n, global settings, layout template, and publisher helpers.

package/dist/basic/cssScope.d.ts

@@ -0,0 +1,3 @@
+export declare function transformCssSelectors(css: string, transform: (selector: string) => string): string;
+export declare function removeCssRulesByPrefixes(cssComposer: any, prefixes: string[]): void;
+export declare function removeUngroupedCssRulesByPrefixes(cssComposer: any, prefixes: string[]): void;

package/dist/basic/index.d.ts

@@ -0,0 +1,81 @@
+export type { WebBuilderBlock, WebBuilderBlockPack, WebBuilderBlockPackProvider, } from '@toototech/webbuilder/core';
+export * from './traitFactory.js';
+export * from './traitBridge.js';
+export * from './styleHelpers.js';
+export * from './injectStyle.js';
+export * from './cssScope.js';
+export * from './svgIcon.js';
+export * from './plugin.js';
+export * from './publisher.js';
+export * from './registryManifest.js';
+export * from './registries/types.js';
+export * from './registries/layout/index.js';
+export * from './registries/typography/index.js';
+export * from './registries/layout/container/index.js';
+export * from './registries/layout/grid/index.js';
+export * from './registries/layout/layoutBase/index.js';
+export * from './registries/layout/section/index.js';
+export * from './registries/layout/sectionGridBlock/index.js';
+export * from './registries/layout/spacer/index.js';
+export * from './registries/layout/divider/index.js';
+export * from './registries/typography/heading/index.js';
+export * from './registries/typography/textEditor/index.js';
+export * from './registries/interactive/index.js';
+export * from './registries/interactive/accordion/index.js';
+export * from './registries/interactive/backButton/index.js';
+export * from './registries/interactive/button/index.js';
+export * from './registries/interactive/countUp/index.js';
+export * from './registries/interactive/customCode/index.js';
+export * from './registries/interactive/inquiryForm/index.js';
+export * from './registries/interactive/klaviyoSubscribe/index.js';
+export * from './registries/interactive/popup/index.js';
+export * from './registries/interactive/salesmartlyChatButton/index.js';
+export * from './registries/interactive/search/index.js';
+export * from './registries/interactive/socialShare/index.js';
+export * from './registries/interactive/tabs/index.js';
+export * from './registries/media/index.js';
+export * from './registries/media/banner/index.js';
+export * from './registries/media/carousel/index.js';
+export * from './registries/media/flipbook/index.js';
+export * from './registries/media/icon/index.js';
+export * from './registries/media/image/index.js';
+export * from './registries/media/industryTabs/index.js';
+export * from './registries/media/marquee/index.js';
+export * from './registries/media/ourSolutions/index.js';
+export * from './registries/media/pdfViewer/index.js';
+export * from './registries/media/productCategories/index.js';
+export * from './registries/media/tabMediaGallery/index.js';
+export * from './registries/media/video/index.js';
+export * from './registries/navigation/index.js';
+export * from './registries/navigation/footer/index.js';
+export * from './registries/navigation/languageSwitcher/index.js';
+export * from './registries/navigation/logo/index.js';
+export * from './registries/navigation/navbar/index.js';
+export * from './registries/navigation/socialLinks/index.js';
+export * from './registries/section/index.js';
+export * from './registries/section/allApplications/index.js';
+export * from './registries/section/cardCarouselSection/index.js';
+export * from './registries/section/caseSpotlight/index.js';
+export * from './registries/section/companyScale/index.js';
+export * from './registries/section/customizationGrid/index.js';
+export * from './registries/section/factoryMap/index.js';
+export * from './registries/section/focaHistoryTimeline/index.js';
+export * from './registries/section/historyTimeline/index.js';
+export * from './registries/section/homeBannerCarousel/index.js';
+export * from './registries/section/hotspotShowcase/index.js';
+export * from './registries/section/map/index.js';
+export * from './registries/section/milestoneCardStrip/index.js';
+export * from './registries/section/moreCardCarousel/index.js';
+export * from './registries/section/ourAdvantages/index.js';
+export * from './registries/section/overviewSplit/index.js';
+export * from './registries/section/processTimeline/index.js';
+export * from './registries/section/productCardStrip/index.js';
+export * from './registries/section/resourceSection/index.js';
+export * from './registries/section/responsiveHeroCarousel/index.js';
+export * from './registries/section/serviceIconGrid/index.js';
+export * from './registries/section/servicesCarousel/index.js';
+export * from './registries/section/servicesShowcase/index.js';
+export * from './registries/section/servicesThb/index.js';
+export * from './registries/section/solutionList/index.js';
+export * from './registries/section/staticPinMap/index.js';
+export * from './registries/section/statsCards/index.js';

package/dist/basic/injectStyle.d.ts

@@ -0,0 +1,20 @@
+/**
+ * 向 GrapesJS editor 注入全局 CSS，保证每个 key 只注入一次。
+ * 使用 editor.__wbStyles Map 跟踪已注入的样式，避免污染 editor 对象的任意属性。
+ *
+ * 同时注入到：
+ * 1. editor.addStyle() — 用于发布/导出时的 CSS 输出
+ * 2. canvas iframe <head> — 用于编辑器画布中的实时预览
+ */
+export declare function injectStyleOnce(editor: any, key: string, css: string): void;
+/**
+ * 读取通过 injectStyleOnce 注册的发布样式。
+ * 这类样式会注入编辑器 iframe，但在 component 级别 getCss({ component }) 场景下
+ * 可能不会完整出现在导出结果里，因此发布和代码预览需要手动补入。
+ */
+export declare function getInjectedPublishCss(editor: any, html?: string, existingCss?: string): string;
+/**
+ * 仅向画布 iframe 注入 CSS，不写入 editor CSS 输出/项目 schema。
+ * 适用于网格辅助线这类纯编辑器预览样式。
+ */
+export declare function injectCanvasStyleOnce(editor: any, key: string, css: string): void;

package/dist/basic/plugin.d.ts

@@ -0,0 +1,19 @@
+import type { WebBuilderFeaturePlugin } from '@toototech/webbuilder/core';
+import type { ComponentRegistryExecutor } from './registries/types.js';
+import { type BasicRegistryManifestEntry } from './registryManifest.js';
+export declare const BASIC_COMPONENTS_PLUGIN_ID = "components-basic";
+export interface BasicRegistryFailureDiagnostic {
+    registryId: string;
+    message: string;
+    error: unknown;
+}
+export interface ComponentsBasicPluginOptions {
+    alwaysEnabled?: boolean;
+    includeOptional?: boolean;
+    throwOnOptionalFailure?: boolean;
+    registries?: readonly ComponentRegistryExecutor[];
+    manifest?: readonly BasicRegistryManifestEntry[];
+    onRegistrationFailure?: (diagnostic: BasicRegistryFailureDiagnostic) => void;
+}
+export declare const BASIC_COMPONENT_REGISTRIES: ComponentRegistryExecutor[];
+export declare const componentsBasic: (options?: ComponentsBasicPluginOptions) => WebBuilderFeaturePlugin;

package/dist/basic/publisher.d.ts

@@ -0,0 +1,4 @@
+import type { Editor } from 'grapesjs';
+import type { ComponentRegistryExecutor } from './registries/types.js';
+export declare const BASIC_PUBLISHER_REGISTRIES: ComponentRegistryExecutor[];
+export declare function registerBasicPublisherComponents(editor: Editor): void;

package/dist/basic/registries/interactive/accordion/index.d.ts

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

package/dist/basic/registries/interactive/backButton/index.d.ts

@@ -0,0 +1,3 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_BACK_BUTTON_TYPE = "wb-back-button";
+export declare function registerBackButtonComponent(editor: Editor): void;

package/dist/basic/registries/interactive/button/index.d.ts

@@ -0,0 +1,10 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_BUTTON_TYPE = "wb-button";
+/**
+ * 注册按钮组件（参考 Elementor Button Widget）
+ *
+ * 视觉样式属性（background-color、color、border-radius、padding、font-size）
+ * 已迁移到 StyleManager，初始值通过 defaults.style 提供。
+ * Traits 仅保留逻辑属性：buttonText、linkUrl、linkTarget。
+ */
+export declare function registerButtonComponent(editor: Editor): void;

package/dist/basic/registries/interactive/countUp/index.d.ts

@@ -0,0 +1,9 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_COUNT_UP_TYPE = "wb-count-up";
+/**
+ * 注册数字滚动组件（基于 CountUp.js）
+ *
+ * 编辑器中展示静态终值，发布页通过 IntersectionObserver 在元素进入视口时触发动画。
+ * CountUp.js 通过 CDN 按需注入，不影响编辑器性能。
+ */
+export declare function registerCountUpComponent(editor: Editor): void;

package/dist/basic/registries/interactive/customCode/index.d.ts

@@ -0,0 +1,3 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_CUSTOM_CODE_TYPE = "wb-custom-code";
+export declare function registerCustomCodeComponent(editor: Editor): void;

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

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

package/dist/basic/registries/interactive/inquiryForm/index.d.ts

@@ -0,0 +1,3 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_INQUIRY_FORM_TYPE = "wb-inquiry-form";
+export declare function registerInquiryFormComponent(editor: Editor): void;

package/dist/basic/registries/interactive/klaviyoSubscribe/index.d.ts

@@ -0,0 +1,3 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_KLAVIYO_SUBSCRIBE_TYPE = "wb-klaviyo-subscribe";
+export declare function registerKlaviyoSubscribeComponent(editor: Editor): void;

package/dist/basic/registries/interactive/popup/index.d.ts

@@ -0,0 +1,5 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_POPUP_TYPE = "wb-popup";
+export declare const WB_POPUP_TEMPLATE_REF_TYPE = "wb-popup-template-ref";
+export declare const WB_POPUP_TRIGGER_TYPE = "wb-popup-trigger";
+export declare function registerPopupComponent(editor: Editor): void;

package/dist/basic/registries/interactive/salesmartlyChatButton/index.d.ts

@@ -0,0 +1,10 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_SALESMARTLY_CHAT_BUTTON_TYPE = "wb-salesmartly-chat-button";
+declare global {
+    interface Window {
+        ssq?: {
+            push: (event: string) => void;
+        };
+    }
+}
+export declare function registerSalesmartlyChatButtonComponent(editor: Editor): void;

package/dist/basic/registries/interactive/search/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * search.ts — Fullscreen Search Spotlight block
+ *
+ * A standalone, droppable search widget: trigger button + fullscreen overlay modal.
+ * Can be placed anywhere — inside a navbar, hero section, or standalone in the page.
+ */
+import type { Editor } from 'grapesjs';
+export declare function registerSearch(editor: Editor): void;
+export declare const WB_SEARCH_TYPE = "search-spotlight";
+export declare function registerSearchComponent(editor: import('grapesjs').Editor): void;

package/dist/basic/registries/interactive/socialShare/index.d.ts

@@ -0,0 +1,33 @@
+/**
+ * 社媒分享组件（Social Share）
+ *
+ * 用途：
+ *   放在文章 / 产品 / 媒体等详情页底部，供访客一键将当前页面
+ *   分享到 Facebook / Twitter(X) / LinkedIn / Pinterest / WhatsApp / Email 或复制链接。
+ *
+ * 设计要点：
+ *   1. 默认分享内容取自运行时环境 —— `window.location.href` + `document.title`，
+ *      天然跟随当前页面，**不依赖任何后端字段绑定**，在任何页面都可使用。
+ *   2. 如需自定义分享 URL / 文案，可在 trait 中填入，会写到根元素 data-share-url /
+ *      data-share-text，运行时优先使用这两个值（支持 `{{post.url}}` 这类占位符，
+ *      由后端模板引擎替换）。
+ *   3. 平台开关 / 按钮形状 / 大小通过 trait 配置，syncAttrs 到根元素的 data-share-*
+ *      以便 CSS 精确控制按钮展示与样式。
+ *   4. 按钮点击通过 script / script-export 注入，发布后的页面也能独立工作。
+ *
+ * 运行时输出（简化示意）：
+ * ```html
+ * <div data-wb-component="social-share"
+ *      data-share-shape="rounded" data-share-size="md"
+ *      data-share-enabled="facebook twitter linkedin copy">
+ *   <h3 class="wb-social-share__title">Share</h3>
+ *   <div class="wb-social-share__list">
+ *     <a class="wb-social-share__btn" data-wb-share="facebook" ...>...</a>
+ *     ...
+ *   </div>
+ * </div>
+ * ```
+ */
+import type { Editor } from 'grapesjs';
+export declare const WB_SOCIAL_SHARE_TYPE = "wb-social-share";
+export declare function registerSocialShareComponent(editor: Editor): void;

package/dist/basic/registries/interactive/tabs/index.d.ts

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

package/dist/basic/registries/layout/container/index.d.ts

@@ -0,0 +1,19 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_CONTAINER_TYPE = "wb-container";
+export declare function createContainerBlockContent(overrides?: Record<string, any>): {
+    type: string;
+    contentWidth: string;
+    boxedWidth: number;
+    widthValue: number;
+    widthUnit: string;
+    style: any;
+};
+/**
+ * 注册容器组件（参考 Elementor Container 的核心布局能力）
+ *
+ * flex 布局属性（flex-direction、justify-content、align-items、flex-wrap、gap）
+ * 和背景属性已迁移到 StyleManager（wb-layout / wb-background sector），
+ * 初始值通过 defaults.style 提供，用户通过"样式"面板修改。
+ * Traits 仅保留宽度相关属性（contentWidth / boxed 模式）。
+ */
+export declare function registerContainerComponent(editor: Editor): void;

package/dist/basic/registries/layout/divider/index.d.ts

@@ -0,0 +1,7 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_DIVIDER_TYPE = "wb-divider";
+/**
+ * 注册分割线组件（Elementor Divider Widget）
+ * 使用 <hr> 标签，通过 traits 控制线条样式、颜色、厚度、宽度和对齐。
+ */
+export declare function registerDividerComponent(editor: Editor): void;

package/dist/basic/registries/layout/grid/index.d.ts

@@ -0,0 +1,11 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_GRID_TYPE = "wb-grid";
+/**
+ * 注册网格组件（参考 Elementor Grid Container）
+ *
+ * grid 布局属性（grid-auto-flow、justify-items、align-items、gap）
+ * 和背景属性已迁移到 StyleManager（wb-layout / wb-background sector），
+ * 初始值通过 defaults.style 提供。
+ * Traits 保留：宽度、grid-template 列/行计算、showGridOutline。
+ */
+export declare function registerGridComponent(editor: Editor): void;

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

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

package/dist/basic/registries/layout/layoutBase/index.d.ts

@@ -0,0 +1,10 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_LAYOUT_BASE_TYPE = "wb-layout-base";
+/**
+ * 注册布局基础类型（抽象基类，不直接用于画布）
+ * container / grid 通过 extend: 'wb-layout-base' 继承共享的属性默认值与方法
+ *
+ * 背景和最小高度属性已迁移到 StyleManager（wb-layout / wb-background sector），
+ * 此处仅保留宽度相关的 trait 与方法。
+ */
+export declare function registerLayoutBase(editor: Editor): void;

package/dist/basic/registries/layout/section/index.d.ts

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

package/dist/basic/registries/layout/sectionGridBlock/index.d.ts

@@ -0,0 +1,3 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_SECTION_GRID_BLOCK_TYPE = "wb-section-grid-block";
+export declare function registerSectionGridBlockComponent(editor: Editor): void;

package/dist/basic/registries/layout/spacer/index.d.ts

@@ -0,0 +1,7 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_SPACER_TYPE = "wb-spacer";
+/**
+ * 注册间距组件（Elementor Spacer Widget）
+ * 用于在布局中插入可配置高度的空白区域。
+ */
+export declare function registerSpacerComponent(editor: Editor): void;

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

@@ -0,0 +1,11 @@
+import type { Editor, Plugin } from 'grapesjs';
+export declare const WB_BANNER_TYPE = "wb-banner";
+export declare const WB_BANNER_SLIDE_TYPE = "wb-banner-slide";
+export interface BannerPluginOptions {
+    category?: string;
+    label?: string;
+    addBlock?: boolean;
+}
+export declare function registerBannerComponent(editor: Editor): void;
+declare const gjsBanner: Plugin<BannerPluginOptions>;
+export default gjsBanner;

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

@@ -0,0 +1,6 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_CAROUSEL_TYPE = "wb-carousel";
+/**
+ * 注册轮播组件（基于 Swiper）
+ */
+export declare function registerCarouselComponent(editor: Editor): void;

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

@@ -0,0 +1,5 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_FLIPBOOK_TYPE = "wb-flipbook";
+export declare const WB_FLIPBOOK_PAGE_TYPE = "wb-flipbook-page";
+export declare function sanitizeFlipbookProjectData(projectData: any): any;
+export declare function registerFlipbookComponent(editor: Editor): void;

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

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

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

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

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

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

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

@@ -0,0 +1,3 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_INDUSTRY_TABS_TYPE = "wb-industry-tabs";
+export declare function registerIndustryTabsComponent(editor: Editor): void;

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

@@ -0,0 +1,4 @@
+import type { Editor } from 'grapesjs';
+export declare const WB_MARQUEE_TYPE = "wb-marquee";
+export declare const WB_MARQUEE_ITEM_TYPE = "wb-marquee-item";
+export declare function registerMarqueeComponent(editor: Editor): void;