@elementor/editor-documents - npm Package Compare versions

Comparing version 0.6.0 to 0.7.0

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log
 
+# [0.7.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor-documents@0.6.0...@elementor/editor-documents@0.7.0) (2023-06-05)
+
+
+### Features
+
+* **store:** support creating & registering a slice independently [ED-10914] ([#47](https://github.com/elementor/elementor-packages/issues/47)) ([3cac551](https://github.com/elementor/elementor-packages/commit/3cac551d72cc2df6e11c017323559e3e5c4ab12f))
+
+
+
+
+
 # [0.6.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor-documents@0.5.0...@elementor/editor-documents@0.6.0) (2023-06-01)
@@ -8,0 +19,0 @@

dist/index.js

@@ -30,5 +30,78 @@ "use strict";
 
-// src/sync/sync-store.ts
+// src/store/index.ts
 var import_store = require("@elementor/store");
+var initialState = {
+  entities: {},
+  activeId: null,
+  hostId: null
+};
+function hasActiveEntity(state) {
+  return !!(state.activeId && state.entities[state.activeId]);
+}
+var slice = (0, import_store.createSlice)({
+  name: "documents",
+  initialState,
+  reducers: {
+    init(state, { payload }) {
+      state.entities = payload.entities;
+      state.hostId = payload.hostId;
+      state.activeId = payload.activeId;
+    },
+    activateDocument(state, action) {
+      state.entities[action.payload.id] = action.payload;
+      state.activeId = action.payload.id;
+    },
+    setAsHost(state, action) {
+      state.hostId = action.payload;
+    },
+    updateActiveDocument(state, action) {
+      if (hasActiveEntity(state)) {
+        state.entities[state.activeId] = {
+          ...state.entities[state.activeId],
+          ...action.payload
+        };
+      }
+    },
+    startSaving(state) {
+      if (hasActiveEntity(state)) {
+        state.entities[state.activeId].isSaving = true;
+      }
+    },
+    endSaving(state, action) {
+      if (hasActiveEntity(state)) {
+        state.entities[state.activeId] = {
+          ...action.payload,
+          isSaving: false
+        };
+      }
+    },
+    startSavingDraft: (state) => {
+      if (hasActiveEntity(state)) {
+        state.entities[state.activeId].isSavingDraft = true;
+      }
+    },
+    endSavingDraft(state, action) {
+      if (hasActiveEntity(state)) {
+        state.entities[state.activeId] = {
+          ...action.payload,
+          isSavingDraft: false
+        };
+      }
+    },
+    markAsDirty(state) {
+      if (hasActiveEntity(state)) {
+        state.entities[state.activeId].isDirty = true;
+      }
+    },
+    markAsPristine(state) {
+      if (hasActiveEntity(state)) {
+        state.entities[state.activeId].isDirty = false;
+      }
+    }
+  }
+});
 
+// src/sync/sync-store.ts
+var import_store3 = require("@elementor/store");
+
 // src/sync/utils.ts
@@ -69,10 +142,10 @@ function getV1DocumentsManager() {
 var import_editor_v1_adapters = require("@elementor/editor-v1-adapters");
-function syncStore(slice) {
-  syncInitialization(slice);
-  syncActiveDocument(slice);
-  syncOnDocumentSave(slice);
-  syncOnTitleChange(slice);
-  syncOnDocumentChange(slice);
+function syncStore() {
+  syncInitialization();
+  syncActiveDocument();
+  syncOnDocumentSave();
+  syncOnTitleChange();
+  syncOnDocumentChange();
 }
-function syncInitialization(slice) {
+function syncInitialization() {
   const { init: init2 } = slice.actions;
@@ -87,3 +160,3 @@ (0, import_editor_v1_adapters.listenTo)(
       }, {});
-      (0, import_store.dispatch)(init2({
+      (0, import_store3.dispatch)(init2({
         entities,
@@ -96,3 +169,3 @@ hostId: documentsManager.getInitialId(),
 }
-function syncActiveDocument(slice) {
+function syncActiveDocument() {
   const { activateDocument, setAsHost } = slice.actions;
@@ -104,5 +177,5 @@ (0, import_editor_v1_adapters.listenTo)(
       const currentDocument = normalizeV1Document(documentsManager.getCurrent());
-      (0, import_store.dispatch)(activateDocument(currentDocument));
+      (0, import_store3.dispatch)(activateDocument(currentDocument));
       if (documentsManager.getInitialId() === currentDocument.id) {
-        (0, import_store.dispatch)(setAsHost(currentDocument.id));
+        (0, import_store3.dispatch)(setAsHost(currentDocument.id));
       }
@@ -112,3 +185,3 @@ }
 }
-function syncOnDocumentSave(slice) {
+function syncOnDocumentSave() {
   const { startSaving, endSaving, startSavingDraft, endSavingDraft } = slice.actions;
@@ -123,6 +196,6 @@ const isDraft = (e) => {
       if (isDraft(e)) {
-        (0, import_store.dispatch)(startSavingDraft());
+        (0, import_store3.dispatch)(startSavingDraft());
         return;
       }
-      (0, import_store.dispatch)(startSaving());
+      (0, import_store3.dispatch)(startSaving());
     }
@@ -137,5 +210,5 @@ );
       if (isDraft(e)) {
-        (0, import_store.dispatch)(endSavingDraft(activeDocument));
+        (0, import_store3.dispatch)(endSavingDraft(activeDocument));
       } else {
-        (0, import_store.dispatch)(endSaving(activeDocument));
+        (0, import_store3.dispatch)(endSaving(activeDocument));
       }
@@ -145,3 +218,3 @@ }
 }
-function syncOnTitleChange(slice) {
+function syncOnTitleChange() {
   const { updateActiveDocument } = slice.actions;
@@ -155,3 +228,3 @@ const updateTitle = debounce((e) => {
     const newTitle = currentDocument.container.settings.get("post_title");
-    (0, import_store.dispatch)(updateActiveDocument({ title: newTitle }));
+    (0, import_store3.dispatch)(updateActiveDocument({ title: newTitle }));
   }, 400);
@@ -163,3 +236,3 @@ (0, import_editor_v1_adapters.listenTo)(
 }
-function syncOnDocumentChange(slice) {
+function syncOnDocumentChange() {
   const { markAsDirty, markAsPristine } = slice.actions;
@@ -171,6 +244,6 @@ (0, import_editor_v1_adapters.listenTo)(
       if (currentDocument.editor.isChanged) {
-        (0, import_store.dispatch)(markAsDirty());
+        (0, import_store3.dispatch)(markAsDirty());
         return;
       }
-      (0, import_store.dispatch)(markAsPristine());
+      (0, import_store3.dispatch)(markAsPristine());
     }
@@ -189,78 +262,4 @@ );
 
-// src/store/index.ts
-var import_store2 = require("@elementor/store");
-var initialState = {
-  entities: {},
-  activeId: null,
-  hostId: null
-};
-function hasActiveEntity(state) {
-  return !!(state.activeId && state.entities[state.activeId]);
-}
-function createSlice() {
-  return (0, import_store2.addSlice)({
-    name: "documents",
-    initialState,
-    reducers: {
-      init(state, { payload }) {
-        state.entities = payload.entities;
-        state.hostId = payload.hostId;
-        state.activeId = payload.activeId;
-      },
-      activateDocument(state, action) {
-        state.entities[action.payload.id] = action.payload;
-        state.activeId = action.payload.id;
-      },
-      setAsHost(state, action) {
-        state.hostId = action.payload;
-      },
-      updateActiveDocument(state, action) {
-        if (hasActiveEntity(state)) {
-          state.entities[state.activeId] = {
-            ...state.entities[state.activeId],
-            ...action.payload
-          };
-        }
-      },
-      startSaving(state) {
-        if (hasActiveEntity(state)) {
-          state.entities[state.activeId].isSaving = true;
-        }
-      },
-      endSaving(state, action) {
-        if (hasActiveEntity(state)) {
-          state.entities[state.activeId] = {
-            ...action.payload,
-            isSaving: false
-          };
-        }
-      },
-      startSavingDraft: (state) => {
-        if (hasActiveEntity(state)) {
-          state.entities[state.activeId].isSavingDraft = true;
-        }
-      },
-      endSavingDraft(state, action) {
-        if (hasActiveEntity(state)) {
-          state.entities[state.activeId] = {
-            ...action.payload,
-            isSavingDraft: false
-          };
-        }
-      },
-      markAsDirty(state) {
-        if (hasActiveEntity(state)) {
-          state.entities[state.activeId].isDirty = true;
-        }
-      },
-      markAsPristine(state) {
-        if (hasActiveEntity(state)) {
-          state.entities[state.activeId].isDirty = false;
-        }
-      }
-    }
-  });
-}
-
 // src/init.ts
+var import_store4 = require("@elementor/store");
 function init() {
@@ -270,15 +269,15 @@ initStore();
 function initStore() {
-  const slice = createSlice();
-  syncStore(slice);
+  (0, import_store4.registerSlice)(slice);
+  syncStore();
 }
 
 // src/hooks/use-active-document.ts
-var import_store5 = require("@elementor/store");
+var import_store7 = require("@elementor/store");
 
 // src/store/selectors.ts
-var import_store4 = require("@elementor/store");
+var import_store6 = require("@elementor/store");
 var selectEntities = (state) => state.documents.entities;
 var selectActiveId = (state) => state.documents.activeId;
 var selectHostId = (state) => state.documents.hostId;
-var selectActiveDocument = (0, import_store4.createSelector)(
+var selectActiveDocument = (0, import_store6.createSelector)(
   selectEntities,
@@ -288,3 +287,3 @@ selectActiveId,
 );
-var selectHostDocument = (0, import_store4.createSelector)(
+var selectHostDocument = (0, import_store6.createSelector)(
   selectEntities,
@@ -297,3 +296,3 @@ selectHostId,
 function useActiveDocument() {
-  return (0, import_store5.useSelector)(selectActiveDocument);
+  return (0, import_store7.useSelector)(selectActiveDocument);
 }
@@ -316,5 +315,5 @@
 // src/hooks/use-host-document.ts
-var import_store6 = require("@elementor/store");
+var import_store8 = require("@elementor/store");
 function useHostDocument() {
-  return (0, import_store6.useSelector)(selectHostDocument);
+  return (0, import_store8.useSelector)(selectHostDocument);
 }
@@ -321,0 +320,0 @@

package.json

 {
 	"name": "@elementor/editor-documents",
-	"version": "0.6.0",
+	"version": "0.7.0",
 	"private": false,
@@ -36,3 +36,3 @@ "author": "Elementor Team",
 		"@elementor/editor-v1-adapters": "^0.3.0",
-		"@elementor/store": "^0.3.0"
+		"@elementor/store": "^0.4.0"
 	},
@@ -45,3 +45,3 @@ "peerDependencies": {
 	},
-	"gitHead": "2ee431a07ec6af6ca2b9930c0b830e78696b194a"
+	"gitHead": "753851e1a5003eb1ea5349b76d96c75f70e0a594"
 }

src/init.ts

 import { syncStore } from './sync';
-import { createSlice } from './store';
+import { registerSlice } from '@elementor/store';
+import { slice } from './store';
 
@@ -9,5 +10,5 @@ export default function init() {
 function initStore() {
-	const slice = createSlice();
+	registerSlice( slice );
 
-	syncStore( slice );
+	syncStore();
 }

src/store/index.ts

 import { Document } from '../types';
-import { addSlice, PayloadAction } from '@elementor/store';
+import { createSlice, PayloadAction } from '@elementor/store';
 
@@ -10,4 +10,2 @@ type State = {
 
-export type Slice = ReturnType<typeof createSlice>;
-
 const initialState: State = {
@@ -25,74 +23,72 @@ entities: {},
 
-export function createSlice() {
-	return addSlice( {
-		name: 'documents',
-		initialState,
-		reducers: {
-			init( state, { payload } : PayloadAction<State> ) {
-				state.entities = payload.entities;
-				state.hostId = payload.hostId;
-				state.activeId = payload.activeId;
-			},
+export const slice = createSlice( {
+	name: 'documents',
+	initialState,
+	reducers: {
+		init( state, { payload } : PayloadAction<State> ) {
+			state.entities = payload.entities;
+			state.hostId = payload.hostId;
+			state.activeId = payload.activeId;
+		},
 
-			activateDocument( state, action: PayloadAction<Document> ) {
-				state.entities[ action.payload.id ] = action.payload;
-				state.activeId = action.payload.id;
-			},
+		activateDocument( state, action: PayloadAction<Document> ) {
+			state.entities[ action.payload.id ] = action.payload;
+			state.activeId = action.payload.id;
+		},
 
-			setAsHost( state, action: PayloadAction<Document['id']> ) {
-				state.hostId = action.payload;
-			},
+		setAsHost( state, action: PayloadAction<Document['id']> ) {
+			state.hostId = action.payload;
+		},
 
-			updateActiveDocument( state, action: PayloadAction<Partial<Document>> ) {
-				if ( hasActiveEntity( state ) ) {
-					state.entities[ state.activeId ] = {
-						...state.entities[ state.activeId ],
-						...action.payload,
-					};
-				}
-			},
+		updateActiveDocument( state, action: PayloadAction<Partial<Document>> ) {
+			if ( hasActiveEntity( state ) ) {
+				state.entities[ state.activeId ] = {
+					...state.entities[ state.activeId ],
+					...action.payload,
+				};
+			}
+		},
 
-			startSaving( state ) {
-				if ( hasActiveEntity( state ) ) {
-					state.entities[ state.activeId ].isSaving = true;
-				}
-			},
+		startSaving( state ) {
+			if ( hasActiveEntity( state ) ) {
+				state.entities[ state.activeId ].isSaving = true;
+			}
+		},
 
-			endSaving( state, action: PayloadAction<Document> ) {
-				if ( hasActiveEntity( state ) ) {
-					state.entities[ state.activeId ] = {
-						...action.payload,
-						isSaving: false,
-					};
-				}
-			},
+		endSaving( state, action: PayloadAction<Document> ) {
+			if ( hasActiveEntity( state ) ) {
+				state.entities[ state.activeId ] = {
+					...action.payload,
+					isSaving: false,
+				};
+			}
+		},
 
-			startSavingDraft: ( state ) => {
-				if ( hasActiveEntity( state ) ) {
-					state.entities[ state.activeId ].isSavingDraft = true;
-				}
-			},
+		startSavingDraft: ( state ) => {
+			if ( hasActiveEntity( state ) ) {
+				state.entities[ state.activeId ].isSavingDraft = true;
+			}
+		},
 
-			endSavingDraft( state, action: PayloadAction<Document> ) {
-				if ( hasActiveEntity( state ) ) {
-					state.entities[ state.activeId ] = {
-						...action.payload,
-						isSavingDraft: false,
-					};
-				}
-			},
+		endSavingDraft( state, action: PayloadAction<Document> ) {
+			if ( hasActiveEntity( state ) ) {
+				state.entities[ state.activeId ] = {
+					...action.payload,
+					isSavingDraft: false,
+				};
+			}
+		},
 
-			markAsDirty( state ) {
-				if ( hasActiveEntity( state ) ) {
-					state.entities[ state.activeId ].isDirty = true;
-				}
-			},
+		markAsDirty( state ) {
+			if ( hasActiveEntity( state ) ) {
+				state.entities[ state.activeId ].isDirty = true;
+			}
+		},
 
-			markAsPristine( state ) {
-				if ( hasActiveEntity( state ) ) {
-					state.entities[ state.activeId ].isDirty = false;
-				}
-			},
+		markAsPristine( state ) {
+			if ( hasActiveEntity( state ) ) {
+				state.entities[ state.activeId ].isDirty = false;
+			}
 		},
-	} );
-}
+	},
+} );

src/store/selectors.ts

@@ -1,5 +0,5 @@
-import type { Slice } from './index';
+import { slice } from './index';
 import { createSelector, SliceState } from '@elementor/store';
 
-type State = SliceState<Slice>;
+type State = SliceState<typeof slice>;
 
@@ -6,0 +6,0 @@ const selectEntities = ( state: State ) => state.documents.entities;

src/sync/__tests__/sync-store.test.ts

 import { syncStore } from '../index';
-import { Slice, createSlice } from '../../store';
+import { slice } from '../../store';
 import { ExtendedWindow, V1Document, Document } from '../../types';
-import { createStore, SliceState, Store } from '@elementor/store';
+import { createStore, registerSlice, SliceState, Store } from '@elementor/store';
 import {
@@ -19,4 +19,3 @@ dispatchCommandAfter,
 describe( '@elementor/editor-documents - Sync Store', () => {
-	let store: Store<SliceState<Slice>>;
-	let slice: Slice;
+	let store: Store<SliceState<typeof slice>>;
 
@@ -26,6 +25,6 @@ beforeEach( () => {
 
-		slice = createSlice();
+		registerSlice( slice );
 		store = createStore();
 
-		syncStore( slice );
+		syncStore();
 	} );
@@ -32,0 +31,0 @@

src/sync/sync-store.ts

@@ -1,3 +0,3 @@
-import { Slice } from '../store';
 import { Document } from '../types';
+import { slice } from '../store';
 import { dispatch } from '@elementor/store';
@@ -14,11 +14,11 @@ import { normalizeV1Document, getV1DocumentsManager } from './utils';
 
-export function syncStore( slice: Slice ) {
-	syncInitialization( slice );
-	syncActiveDocument( slice );
-	syncOnDocumentSave( slice );
-	syncOnTitleChange( slice );
-	syncOnDocumentChange( slice );
+export function syncStore() {
+	syncInitialization();
+	syncActiveDocument();
+	syncOnDocumentSave();
+	syncOnTitleChange();
+	syncOnDocumentChange();
 }
 
-function syncInitialization( slice: Slice ) {
+function syncInitialization() {
 	const { init } = slice.actions;
@@ -47,3 +47,3 @@
 
-function syncActiveDocument( slice: Slice ) {
+function syncActiveDocument() {
 	const { activateDocument, setAsHost } = slice.actions;
@@ -66,3 +66,3 @@
 
-function syncOnDocumentSave( slice: Slice ) {
+function syncOnDocumentSave() {
 	const { startSaving, endSaving, startSavingDraft, endSavingDraft } = slice.actions;
@@ -107,3 +107,3 @@
 
-function syncOnTitleChange( slice: Slice ) {
+function syncOnTitleChange() {
 	const { updateActiveDocument } = slice.actions;
@@ -130,3 +130,3 @@
 
-function syncOnDocumentChange( slice: Slice ) {
+function syncOnDocumentChange() {
 	const { markAsDirty, markAsPristine } = slice.actions;
@@ -133,0 +133,0 @@

No alert changes

Worsened metrics

Total package byte prevSize

117103

decreased by-0.69%

Number of downloads

491

decreased by-44.08%

Lines of code

1602

decreased by-0.44%

Dependency changes

• + Added@elementor/store@0.4.0(transitive)

• + Added@types/react@19.0.10(transitive)

• - Removed@elementor/store@0.3.0(transitive)

• - Removed@types/react@19.0.8(transitive)

• Updated@elementor/store@^0.4.0