refactor: move editableType option to react renderer

p3ol · Jul 8, 2024 · c1003c6 · c1003c6
1 parent e9af99a
commit c1003c6
Show file tree

Hide file tree

Showing 12 changed files with 609 additions and 43 deletions.
diff --git a/packages/core/lib/classes.ts b/packages/core/lib/classes.ts
@@ -22,14 +22,12 @@ export class BuilderOptions {
   generateId: () => string | number;
   historyLimit: number;
   overrideStrategy: 'last' | 'merge';
-  editableType: 'floating' | 'modal';
 
   constructor (props?: BuilderObject) {
     this.debug = props?.debug ?? false;
     this.generateId = props?.generateId;
     this.historyLimit = props?.historyLimit ?? 20;
     this.overrideStrategy = props?.overrideStrategy || 'last';
-    this.editableType = props?.editableType || 'floating';
   }
 }
 

diff --git a/packages/core/lib/types.ts b/packages/core/lib/types.ts
@@ -226,7 +226,6 @@ export declare interface BuilderObject {
   content?: ElementObject[];
   addons?: AddonObject[];
   onChange?(content: ElementObject[]): void;
-  editableType?: 'floating' | 'modal';
 }
 
 export declare type ElementSettingsComplexKey = {

diff --git a/packages/react/lib/Builder/index.test.tsx b/packages/react/lib/Builder/index.test.tsx
@@ -112,4 +112,30 @@ describe('<Builder />', () => {
 
     unmount();
   });
+
+  it('should allow to render editable inside a modal', () => {
+    const { container, unmount } = render(
+      <Builder
+        addons={[baseAddon()]}
+        editableType="modal"
+      />
+    );
+
+    const floatings = container.querySelector<HTMLElement>('.floatings');
+    const catalogue = container.querySelector<HTMLElement>('.catalogue');
+
+    // Open catalogue
+    fireEvent.click(within(catalogue).getByText('add'));
+    expect(floatings).toMatchSnapshot('Catalogue opened');
+
+    // Add a title
+    fireEvent.click(within(floatings).getByText('Title'));
+
+    // Edit title
+    fireEvent.click(within(container).getByText('pen'));
+
+    expect(container).toMatchSnapshot('Title editable');
+
+    unmount();
+  });
 });