@g1cloud/page-builder-editor 1.0.0-alpha.2 → 1.0.0-alpha.21

package/dist/index.d.ts

@@ -1,3 +1,4 @@
 export { default as PageBuilderEditor } from './PageBuilderEditor.vue';
 export * from './model/event';
+export * from './model/plugin';
 export * from '@g1cloud/page-builder-viewer';

package/dist/model/command.d.ts

@@ -26,14 +26,6 @@ export declare class CommandRegistryImpl implements CommandRegistry {
     getCommand(commandId: string): Command | undefined;
     executeCommand(commandId: string, args?: any): boolean;
 }
-export declare class OpenAddPartModalCommand implements Command {
-    private modal;
-    static readonly COMMAND_ID = "OpenAddPartModal";
-    readonly commandId = "OpenAddPartModal";
-    readonly caption = "Add Part";
-    constructor(modal: BSModal);
-    execute(pageBuilder: PageBuilderEditor, args?: any): void;
-}
 export declare class OpenAddWidgetModalCommand implements Command {
     private modal;
     static readonly COMMAND_ID = "OpenAddWidgetModal";
@@ -53,21 +45,37 @@ export declare class AddPartCommand implements Command {
     constructor(modal: BSModal);
     execute(pageBuilder: PageBuilderEditor, args?: any): void;
 }
+export declare class AddSectionCommand implements Command {
+    private modal;
+    static readonly COMMAND_ID = "AddSection";
+    readonly commandId = "AddSection";
+    readonly caption = "Add Section";
+    constructor(modal: BSModal);
+    execute(pageBuilder: PageBuilderEditor, args?: any): void;
+}
+export declare class AddBlockCommand implements Command {
+    private modal;
+    static readonly COMMAND_ID = "AddBlock";
+    readonly commandId = "AddBlock";
+    readonly caption = "Add Block";
+    constructor(modal: BSModal);
+    execute(pageBuilder: PageBuilderEditor, args?: any): void;
+}
 export declare class AddSectionAboveCommand implements Command {
     private modal;
     static readonly COMMAND_ID = "AddSectionAbove";
-    static readonly CAPTION = "Add Part Above";
+    static readonly CAPTION = "Add Section Above";
     readonly commandId = "AddSectionAbove";
-    readonly caption = "Add Part Above";
+    readonly caption = "Add Section Above";
     constructor(modal: BSModal);
     execute(pageBuilder: PageBuilderEditor, args?: any): void;
 }
 export declare class AddSectionBelowCommand implements Command {
     private modal;
     static readonly COMMAND_ID = "AddSectionBelow";
-    static readonly CAPTION = "Add Part Below";
+    static readonly CAPTION = "Add Section Below";
     readonly commandId = "AddSectionBelow";
-    readonly caption = "Add Part Below";
+    readonly caption = "Add Section Below";
     constructor(modal: BSModal);
     execute(pageBuilder: PageBuilderEditor, args?: any): void;
 }
@@ -161,6 +169,11 @@ export declare class DeletePartCommand implements Command {
     readonly caption = "Delete";
     execute(pageBuilder: PageBuilderEditor): void;
 }
+export declare class CopyAllCommand implements Command {
+    static readonly COMMAND_ID = "CopyAll";
+    readonly commandId = "CopyAll";
+    execute(pageBuilder: PageBuilderEditor): Promise<void>;
+}
 export declare class CopyPartCommand implements Command {
     static readonly COMMAND_ID = "CopyPart";
     readonly commandId = "CopyPart";
@@ -181,7 +194,7 @@ export declare class SelectAllPartsCommand implements Command {
     readonly commandId = "SelectAllParts";
     execute(pageBuilder: PageBuilderEditor): void;
 }
-export declare const createDefaultCommands: (modal: BSModal) => (OpenAddPartModalCommand | OpenAddWidgetModalCommand | AddPartCommand | AddSectionAboveCommand | AddSectionBelowCommand | AddBlockLeftCommand | AddBlockRightCommand | AddBlockAboveCommand | AddBlockBelowCommand | AddWidgetLeftCommand | AddWidgetRightCommand | AddWidgetAboveCommand | AddWidgetBelowCommand | AddWidgetInsideCommand | ChangePropertyCommand | DeletePartCommand | CopyPartCommand | CutPartCommand | PastePartCommand | SelectAllPartsCommand)[];
+export declare const createDefaultCommands: (modal: BSModal) => (OpenAddWidgetModalCommand | AddPartCommand | AddSectionCommand | AddBlockCommand | AddSectionAboveCommand | AddSectionBelowCommand | AddBlockLeftCommand | AddBlockRightCommand | AddBlockAboveCommand | AddBlockBelowCommand | AddWidgetLeftCommand | AddWidgetRightCommand | AddWidgetAboveCommand | AddWidgetBelowCommand | AddWidgetInsideCommand | ChangePropertyCommand | DeletePartCommand | CopyAllCommand | CopyPartCommand | CutPartCommand | PastePartCommand | SelectAllPartsCommand)[];
 export declare const menuItemForCommand: (pageBuilder: PageBuilderEditor, commandId: string, caption?: string) => MenuItem;
 export declare const createDefaultContextMenus: () => ContextMenu[];
 export declare const createDefaultKeyHandlers: () => KeyHandler[];

package/dist/model/context.d.ts

@@ -35,7 +35,7 @@ export declare class PageBuilderContextImpl implements PageBuilderContext {
         partType: string;
         partName: string;
         partId: string;
-        properties?: Record<string, string> | undefined;
+        properties?: Record<string, unknown> | undefined;
         children?: any[] | undefined;
         parent?: any | undefined;
         isRoot: () => boolean;
@@ -45,16 +45,15 @@ export declare class PageBuilderContextImpl implements PageBuilderContext {
         isWidget: () => boolean;
         isNestedWidget: () => boolean;
         getName: () => string | undefined;
-        getProperty: (propertyName: string) => string | undefined;
+        getProperty: (propertyName: string) => import('@g1cloud/page-builder-viewer').MultiLangText | undefined;
         getClassNames: () => string;
         getStyles: () => Record<string, string>;
-        getPageBuilderId: () => string | undefined;
     } | undefined;
     getSingleSelectedBlock(): {
         partType: string;
         partName: string;
         partId: string;
-        properties?: Record<string, string> | undefined;
+        properties?: Record<string, unknown> | undefined;
         children?: any[] | undefined;
         parent?: any | undefined;
         isRoot: () => boolean;
@@ -64,16 +63,15 @@ export declare class PageBuilderContextImpl implements PageBuilderContext {
         isWidget: () => boolean;
         isNestedWidget: () => boolean;
         getName: () => string | undefined;
-        getProperty: (propertyName: string) => string | undefined;
+        getProperty: (propertyName: string) => import('@g1cloud/page-builder-viewer').MultiLangText | undefined;
         getClassNames: () => string;
         getStyles: () => Record<string, string>;
-        getPageBuilderId: () => string | undefined;
     } | undefined;
     getSingleSelectedSection(): {
         partType: string;
         partName: string;
         partId: string;
-        properties?: Record<string, string> | undefined;
+        properties?: Record<string, unknown> | undefined;
         children?: any[] | undefined;
         parent?: any | undefined;
         isRoot: () => boolean;
@@ -83,10 +81,9 @@ export declare class PageBuilderContextImpl implements PageBuilderContext {
         isWidget: () => boolean;
         isNestedWidget: () => boolean;
         getName: () => string | undefined;
-        getProperty: (propertyName: string) => string | undefined;
+        getProperty: (propertyName: string) => import('@g1cloud/page-builder-viewer').MultiLangText | undefined;
         getClassNames: () => string;
         getStyles: () => Record<string, string>;
-        getPageBuilderId: () => string | undefined;
     } | undefined;
 }
 export type ContextMenu = {
@@ -112,8 +109,8 @@ export interface KeyHandlers {
     appendKeyHandler(handler: KeyHandler): void;
     removeKeyHandler(handler: KeyHandler): void;
     handleKeyDownEvent(event: KeyboardEvent): void;
-    addDocumentKeyEventListener(document: Document): void;
-    removeDocumentKeyEventListener(document: Document): void;
+    addDocumentKeyEventListener(element: HTMLElement): void;
+    removeDocumentKeyEventListener(element: HTMLElement): void;
 }
 export declare class ContextMenuRegistryImpl implements ContextMenuRegistry {
     readonly groups: ContextMenuGroup[];
@@ -131,6 +128,6 @@ export declare class KeyHandlersImpl implements KeyHandlers {
     appendKeyHandler(handler: KeyHandler): void;
     removeKeyHandler(handler: KeyHandler): void;
     handleKeyDownEvent(event: KeyboardEvent): void;
-    addDocumentKeyEventListener(document: Document): void;
-    removeDocumentKeyEventListener(document: Document): void;
+    addDocumentKeyEventListener(element: HTMLElement): void;
+    removeDocumentKeyEventListener(element: HTMLElement): void;
 }

package/dist/model/event.d.ts

@@ -3,74 +3,18 @@ import { ModelUpdateResult } from './model';
 export type PageBuilderEditorEventType = {
     modelUpdatedByUI: ModelUpdateResult;
     modelUpdated: ModelUpdateResult;
-    requestImage: {
-        pageBuilderId?: string;
-        callback: (url: string) => void;
-    };
-    requestProducts: {
-        pageBuilderId?: string;
-        itemCodes: string;
-        callback: (products: any[]) => void;
-    };
-    requestLocalMarketingPartSchedule: {
-        pageBuilderId?: string;
-        partId: string;
-        callback: (schedule: any) => void;
-    };
 };
 export declare const PageBuilderEditorEvent: {
     on: {
         modelUpdated: (listener: (changes: ModelUpdateResult) => void) => void;
         modelUpdatedByUI: (listener: (changes: ModelUpdateResult) => void) => void;
-        requestImage: (listener: (param: {
-            pageBuilderId?: string;
-            callback: (url: string) => void;
-        }) => void) => void;
-        requestProducts: (listener: (param: {
-            pageBuilderId?: string;
-            itemCodes: string;
-            callback: (products: any[]) => void;
-        }) => void) => void;
-        requestLocalMarketingPartSchedule: (listener: (param: {
-            pageBuilderId?: string;
-            partId: string;
-            callback: (schedule: any) => void;
-        }) => void) => void;
     };
     off: {
         modelUpdated: (listener: (changes: ModelUpdateResult) => void) => void;
         modelUpdatedByUI: (listener: (changes: ModelUpdateResult) => void) => void;
-        requestImage: (listener: (param: {
-            pageBuilderId?: string;
-            callback: (url: string) => void;
-        }) => void) => void;
-        requestProducts: (listener: (param: {
-            pageBuilderId?: string;
-            itemCodes: string;
-            callback: (products: any[]) => void;
-        }) => void) => void;
-        requestLocalMarketingPartSchedule: (listener: (param: {
-            pageBuilderId?: string;
-            partId: string;
-            callback: (schedule: any) => void;
-        }) => void) => void;
     };
     emit: {
         modelUpdated: (changes: ModelUpdateResult) => void;
         modelUpdatedByUI: (changes: ModelUpdateResult) => void;
-        requestImage: (param: {
-            pageBuilderId?: string;
-            callback: (url: string) => void;
-        }) => void;
-        requestProducts: (param: {
-            pageBuilderId?: string;
-            itemCodes: string;
-            callback: (products: any[]) => void;
-        }) => void;
-        requestLocalMarketingPartSchedule: (param: {
-            pageBuilderId?: string;
-            partId: string;
-            callback: (schedule: any) => void;
-        }) => void;
     };
 };

package/dist/model/model.d.ts

@@ -5,6 +5,8 @@ export declare const PAGE_TYPE = "Page";
 export declare const SECTION_TYPE = "Section";
 export declare const BLOCK_TYPE = "Block";
 export declare const WIDGET_TYPE = "Widget";
+type MediaExtractor = (part: IPart) => string[];
+type ProviderExtractor = (partObject: Record<string, unknown>) => void;
 export declare const getNewPartId: () => string;
 export declare const partsToJsonString: (parts: IPart[]) => string;
 export declare const partFromJsonObject: (object: any, keepPartId?: boolean) => IPart | undefined;
@@ -19,15 +21,19 @@ export declare class Model {
     updateModel(param: ModelUpdateParam): ModelUpdateResult;
     findPartById(partId?: string): IPart | undefined;
     findPartsByIds(partIds: string[]): IPart[];
-    serializePageModel: (partIds: string[]) => string;
-    parsePageModel(json: string, keepPartId?: boolean): IPart[] | undefined;
-    moveElements(partId: string, destPartId: string, destIndex: number, update?: PartUpdateParam[]): void;
+    serializeModel(mediaExtractor?: MediaExtractor, providerExtractor?: ProviderExtractor): string;
+    parseModel(json: string, keepPartId?: boolean): IPart;
+    serializeParts(partIds: string[]): string;
+    parseParts(json: string, keepPartId?: boolean): IPart[] | undefined;
+    moveElements(partId: string, destPartId: string, destIndex: number, update?: PartUpdateParam[], doNotChangeIndex?: boolean): void;
     isMobilePart(part: IPart): boolean;
     isPcPart(part: IPart): boolean;
     private insertParts;
     private updateParts;
     private deleteParts;
     private createElement;
+    private setElementAttribute;
+    private getElementAttribute;
     private getIndexOfElement;
     private emitUpdateModelEvent;
 }
@@ -47,7 +53,7 @@ export type PartInsertResult = {
 };
 export type PartUpdateResult = {
     element: Y.XmlElement;
-    properties: Record<string, string>;
+    properties: Record<string, unknown>;
     removeOtherProperties?: boolean;
 };
 export type PartDeleteResult = {
@@ -64,3 +70,4 @@ export type ModelUpdateResult = {
     updated?: PartUpdateResult[];
     deleted?: PartDeleteResult[];
 };
+export {};

package/dist/model/page-builder-editor.d.ts

@@ -1,16 +1,19 @@
+import { PartDefinition } from './part-definintion.ts';
 import { ContextMenuRegistry, ContextMenuRegistryImpl, KeyHandlers, PageBuilderContext, PageBuilderContextImpl } from './context.ts';
 import { ToolButtonRegistry } from './toolbar.ts';
 import { PageBuilderPlugin } from './plugin.ts';
+import { IPart, PageBuilder } from '@g1cloud/page-builder-viewer';
 import { CommandRegistry, CommandRegistryImpl } from './command';
 import { PartManager } from './part-manager';
 import { Model } from './model';
-import { Ref } from 'vue';
+import { Component, Ref } from 'vue';
 
-export type PageBuilderEditMode = 'template' | 'global' | 'local' | 'free';
 export declare const createPageBuilderEditor: () => PageBuilderEditor;
+export declare const providePageBuilder: (pageBuilder: PageBuilder) => void;
 export declare const providePageBuilderEditor: (pageBuilderEditor: PageBuilderEditor) => void;
+export declare const usePageBuilder: () => PageBuilder;
 export declare const usePageBuilderEditor: () => PageBuilderEditor;
-export interface PageBuilderEditor {
+export interface PageBuilderEditor extends PageBuilder {
     instanceId?: string;
     partManager: PartManager;
     model: Model;
@@ -20,13 +23,22 @@ export interface PageBuilderEditor {
     keyHandlers: KeyHandlers;
     toolButtonRegistry: ToolButtonRegistry;
     title?: string;
-    editMode: PageBuilderEditMode;
     scale: Ref<number>;
+    locales: Ref<string[]>;
     registerPlugin(plugin: PageBuilderPlugin): void;
-    initData(content?: any): void;
+    registerCustomPlugin(plugin: any): void;
+    initData(data?: string): void;
     undo(): void;
     redo(): void;
     zoom(scale: number): void;
+    getLocales(): string[];
+    setLocales(locales?: string[]): void;
+    makeSingleScreen(screenToKeep: number): void;
+    makeMultipleScreen(): void;
+    getCustomWidgets(): PartDefinition[];
+    getProvider(name: string): (args?: any, callback?: (result?: any) => void) => unknown;
+    extractMedia(part: IPart): string[];
+    extractProvider(part: Record<string, unknown>): void;
 }
 export declare class PageBuilderEditorImpl implements PageBuilderEditor {
     instanceId?: string;
@@ -38,14 +50,34 @@ export declare class PageBuilderEditorImpl implements PageBuilderEditor {
     keyHandlers: KeyHandlers;
     toolButtonRegistry: ToolButtonRegistry;
     title?: string;
-    editMode: PageBuilderEditMode;
     scale: Ref<number>;
+    locale: Ref<string>;
+    locales: Ref<string[]>;
+    customWidgets: PartDefinition[];
+    watchers: Record<string, unknown>;
+    providers: Record<string, unknown>;
     constructor();
+    getLocale(): string;
+    setLocale(locale?: string): void;
+    getLocales(): string[];
+    setLocales(locales?: string[]): void;
+    getCustomWidgetComponent(part: IPart): Component | undefined;
+    getProvider(name: string): (args?: any, callback?: (result?: any) => void) => unknown;
+    watchCustomWidgetData(part: IPart): unknown;
+    provideCustomWidgetData(part: IPart): Promise<unknown>;
     registerPlugin(plugin: PageBuilderPlugin): void;
-    initData(content?: any[]): void;
+    registerCustomPlugin(plugin: any): void;
+    initData(data?: string): void;
     undo(): void;
     redo(): void;
     zoom(scale: number): void;
+    makeSingleScreen(screenToKeep: number): void;
+    makeMultipleScreen(): void;
+    getCustomWidgets(): PartDefinition[];
+    extractMedia(part: IPart): string[];
+    extractProvider(part: Record<string, unknown>): void;
+    private extractMediaFromPart;
+    private extractMediaFromHtml;
     private getEmptyPageContent;
     private initPlugins;
 }

package/dist/model/page-builder-util.d.ts

@@ -1,5 +1,5 @@
-import { IPart } from '@g1cloud/page-builder-viewer';
+import { IPart, MultiLangText } from '@g1cloud/page-builder-viewer';
 
-export declare const getPropertyValueOfParts: (parts: IPart[], propertyName: string) => string | undefined;
+export declare const getPropertyValueOfParts: (parts: IPart[], propertyName: string) => MultiLangText | undefined;
 export declare const isCursorInElement: (event: MouseEvent, element: Element) => boolean;
 export declare const extractCommonStylesFromProperties: (properties: Record<string, string>) => Record<string, unknown>;

package/dist/model/part-definintion.d.ts

@@ -7,11 +7,15 @@ export type PartDefinition = {
     partType: string;
     partName: string;
     caption: string;
+    icon: string;
     propertyGroups: PartPropertyGroup[];
     initialProperties: Record<string, string>;
     localized: boolean;
     allowsChild: (partOrName?: IPart | string | undefined) => boolean;
     creator: PartCreator;
+    component?: Component;
+    dataWatcher?: string;
+    dataProvider?: string;
 };
 export type PartDefinitionGroup = {
     groupName: string;
@@ -20,7 +24,6 @@ export type PartDefinitionGroup = {
 };
 declare const partDefinitions: Record<string, PartDefinition>;
 export { partDefinitions };
-export declare const designPartDefinitions: PartDefinitionGroup[];
 export declare const layoutPartDefinitions: PartDefinitionGroup[];
 export declare const widgetPartDefinitions: PartDefinitionGroup[];
 export declare const blockWidgetPartDefinitions: PartDefinitionGroup[];

package/dist/model/part-manager.d.ts

@@ -15,7 +15,6 @@ export declare class PartManager {
     registerPartDefinitions(partDefinitions: Record<string, PartDefinition>): void;
     getPartDefinition(partName: string): PartDefinition | undefined;
     getPropertyDefinition(partName: string, propertyName: string): PartProperty | undefined;
-    getLocalDesignPartPropertyDefinitions(partName: string): PartProperty[] | undefined;
     createPartComponent(part?: IPart): Component | undefined;
     createPartComponents(parts?: IPart[]): PartComponent[];
     registerPartPropertyGroupEditors(editors: Record<string, PartPropertyGroupEditor>): void;

package/dist/model/part-property.d.ts

@@ -10,6 +10,7 @@ export type PartProperty = {
     params?: any;
     propertyEditor?: PartPropertyEditor;
     localized?: boolean;
+    multiLang?: boolean;
 };
 export type PartPropertyGroupEditor = (group: PartPropertyGroup, parts: IPart[]) => Component | undefined;
 export type PartPropertyGroup = {

package/dist/model/plugin.d.ts

@@ -1,3 +1,4 @@
+import { Component } from 'vue';
 import { PartPropertyEditor, PartPropertyGroupEditor, PartPropertyType } from './part-property.ts';
 import { PartDefinition } from './part-definintion.ts';
 import { ToolButtonGroup } from './toolbar.ts';
@@ -13,3 +14,12 @@ export type PageBuilderPlugin = {
     keyHandlers?: KeyHandler[];
     toolButtonGroups?: ToolButtonGroup[];
 };
+export type PageBuilderToolbarPlugin = {
+    component: Component;
+    bind?: {
+        [key: string]: any;
+    };
+    on?: {
+        [key: string]: Function | Function[];
+    };
+};

package/dist/page-builder-editor.js

@@ -1,27 +1,31 @@
-import { B, a, M, b, c, _, P, d, e, f, g, h, i, R, j, S, k, W, l, m, n, o, p, q } from "./index-Dwk2ffWe.js";
+import { B, b, M, c, d, e, _, a, f, g, h, i, j, k, l, R, m, S, n, W, o, p, q, r, s, t, v, x } from "./index-Cr-_-n9T.js";
 export {
   B as BLOCK_TYPE,
-  a as Block,
+  b as Block,
   M as Model,
-  b as PAGE_TYPE,
-  c as Page,
+  c as PAGE_BUILDER_KEY,
+  d as PAGE_TYPE,
+  e as Page,
   _ as PageBuilderEditor,
-  P as PageBuilderEditorEvent,
-  d as PageBuilderViewer,
-  e as PageBuilderViewerEvent,
-  f as Part,
-  g as PbImageWidget,
-  h as PbProductListWidget,
-  i as PbTextWidget,
+  a as PageBuilderEditorEvent,
+  f as PageBuilderViewer,
+  g as Part,
+  h as PbCustomWidget,
+  i as PbHtmlWidget,
+  j as PbIframeWidget,
+  k as PbImageWidget,
+  l as PbTextWidget,
   R as ROOT_TYPE,
-  j as RootPart,
+  m as RootPart,
   S as SECTION_TYPE,
-  k as Section,
+  n as Section,
   W as WIDGET_TYPE,
-  l as Widget,
-  m as createPageBuilderViewer,
-  n as createPartComponent,
-  o as createPartComponents,
-  p as providePageBuilderViewer,
-  q as usePageBuilderViewer
+  o as Widget,
+  p as createPageBuilderViewer,
+  q as createPartComponent,
+  r as createPartComponents,
+  s as providePageBuilder,
+  t as providePageBuilderViewer,
+  v as usePageBuilder,
+  x as usePageBuilderViewer
 };