@elementor/editor-app-bar 0.3.0 → 0.4.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.4.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor-app-bar@0.3.0...@elementor/editor-app-bar@0.4.0) (2023-05-21)
+
+
+### Features
+
+* **locations:** change api to support props for slots [ED-10730] ([#38](https://github.com/elementor/elementor-packages/issues/38)) ([44bec3c](https://github.com/elementor/elementor-packages/commit/44bec3cda1020037ba7105c6f05ce4baa8e3b376))
+
+
+
+
+
 # 0.3.0 (2023-05-16)
 
 

package/dist/index.d.ts

@@ -28,27 +28,12 @@ type Props = {
     target?: string;
 };
 
-declare const injectIntoPageIndication: ({ filler, name, options }: Omit<{
-    location: string;
-    filler: _elementor_locations.Filler;
-    name: string;
-    options?: _elementor_locations.InjectionOptions | undefined;
-}, "location">) => void;
-declare const injectIntoResponsive: ({ filler, name, options }: Omit<{
-    location: string;
-    filler: _elementor_locations.Filler;
-    name: string;
-    options?: _elementor_locations.InjectionOptions | undefined;
-}, "location">) => void;
-declare const injectIntoPrimaryAction: ({ filler, name, options }: Omit<{
-    location: string;
-    filler: _elementor_locations.Filler;
-    name: string;
-    options?: _elementor_locations.InjectionOptions | undefined;
-}, "location">) => void;
+declare const injectIntoPageIndication: (args: _elementor_locations.InjectArgs<_elementor_locations.EmptyObject>) => void;
+declare const injectIntoResponsive: (args: _elementor_locations.InjectArgs<_elementor_locations.EmptyObject>) => void;
+declare const injectIntoPrimaryAction: (args: _elementor_locations.InjectArgs<_elementor_locations.EmptyObject>) => void;
 declare const mainMenu: {
-    registerAction: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerAction: (args: {
+        id: string;
         group?: ("default" | "exits") | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -59,8 +44,8 @@ declare const mainMenu: {
         useProps: () => Props$2;
         props?: undefined;
     })) => void;
-    registerToggleAction: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerToggleAction: (args: {
+        id: string;
         group?: ("default" | "exits") | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -71,8 +56,8 @@ declare const mainMenu: {
         useProps: () => Props$1;
         props?: undefined;
     })) => void;
-    registerLink: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerLink: (args: {
+        id: string;
         group?: ("default" | "exits") | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -95,8 +80,8 @@ declare const mainMenu: {
     };
 };
 declare const toolsMenu: {
-    registerAction: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerAction: (args: {
+        id: string;
         group?: "default" | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -107,8 +92,8 @@ declare const toolsMenu: {
         useProps: () => Props$2;
         props?: undefined;
     })) => void;
-    registerToggleAction: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerToggleAction: (args: {
+        id: string;
         group?: "default" | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -119,8 +104,8 @@ declare const toolsMenu: {
         useProps: () => Props$1;
         props?: undefined;
     })) => void;
-    registerLink: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerLink: (args: {
+        id: string;
         group?: "default" | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -139,8 +124,8 @@ declare const toolsMenu: {
     };
 };
 declare const utilitiesMenu: {
-    registerAction: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerAction: (args: {
+        id: string;
         group?: "default" | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -151,8 +136,8 @@ declare const utilitiesMenu: {
         useProps: () => Props$2;
         props?: undefined;
     })) => void;
-    registerToggleAction: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerToggleAction: (args: {
+        id: string;
         group?: "default" | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -163,8 +148,8 @@ declare const utilitiesMenu: {
         useProps: () => Props$1;
         props?: undefined;
     })) => void;
-    registerLink: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerLink: (args: {
+        id: string;
         group?: "default" | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -183,8 +168,8 @@ declare const utilitiesMenu: {
     };
 };
 declare const documentOptionsMenu: {
-    registerAction: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerAction: (args: {
+        id: string;
         group?: ("default" | "save") | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -195,8 +180,8 @@ declare const documentOptionsMenu: {
         useProps: () => Props$2;
         props?: undefined;
     })) => void;
-    registerToggleAction: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerToggleAction: (args: {
+        id: string;
         group?: ("default" | "save") | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;
@@ -207,8 +192,8 @@ declare const documentOptionsMenu: {
         useProps: () => Props$1;
         props?: undefined;
     })) => void;
-    registerLink: ({ group, name, overwrite, priority, ...args }: {
-        name: string;
+    registerLink: (args: {
+        id: string;
         group?: ("default" | "save") | undefined;
         priority?: number | undefined;
         overwrite?: boolean | undefined;

package/dist/index.js

@@ -149,30 +149,30 @@ function Link({ icon: Icon, title, visible = true, ...props }) {
 }
 
 // src/locations/menus.tsx
-function createMenu({ name: menuName, groups = [] }) {
+function createMenu(groups = []) {
   const menuGroups = [
     ...groups,
     "default"
   ];
-  const registerAction = createRegisterMenuItem({
-    menuName,
-    menuGroups,
-    component: Action
-  });
-  const registerToggleAction = createRegisterMenuItem({
-    menuName,
-    menuGroups,
-    component: ToggleAction
-  });
-  const registerLink = createRegisterMenuItem({
-    menuName,
-    menuGroups,
-    component: Link
-  });
-  const useMenuItems5 = createUseMenuItems({
-    menuName,
-    menuGroups
-  });
+  const locations = menuGroups.reduce(
+    (carry, group) => ({
+      ...carry,
+      [group]: (0, import_locations.createLocation)()
+    }),
+    {}
+  );
+  const [
+    registerAction,
+    registerToggleAction,
+    registerLink
+  ] = [Action, ToggleAction, Link].map(
+    (Component) => createRegisterMenuItem({
+      locations,
+      menuGroups,
+      component: Component
+    })
+  );
+  const useMenuItems5 = createUseMenuItems(locations);
   return {
     registerAction,
     registerToggleAction,
@@ -180,8 +180,8 @@ function createMenu({ name: menuName, groups = [] }) {
     useMenuItems: useMenuItems5
   };
 }
-function createRegisterMenuItem({ menuName, menuGroups, component }) {
-  return ({ group = "default", name, overwrite, priority, ...args }) => {
+function createRegisterMenuItem({ locations, menuGroups, component }) {
+  return ({ group = "default", id, overwrite, priority, ...args }) => {
     if (!menuGroups.includes(group)) {
       return;
     }
@@ -191,10 +191,8 @@ function createRegisterMenuItem({ menuName, menuGroups, component }) {
       const componentProps = useProps();
       return /* @__PURE__ */ React8.createElement(Component, { ...props, ...componentProps });
     };
-    const location = getMenuLocationId(menuName, group);
-    (0, import_locations.inject)({
-      location,
-      name,
+    locations[group].inject({
+      id,
       filler: Filler,
       options: {
         priority,
@@ -203,54 +201,44 @@ function createRegisterMenuItem({ menuName, menuGroups, component }) {
     });
   };
 }
-function createUseMenuItems({ menuName, menuGroups }) {
-  const locations = menuGroups.map((group) => getMenuLocationId(menuName, group));
+function createUseMenuItems(locations) {
   return () => {
-    const injectionsGroups = (0, import_locations.useInjectionsOf)(locations);
     return (0, import_react2.useMemo)(() => {
-      return injectionsGroups.reduce((acc, injections, index) => {
-        const groupName = menuGroups[index];
-        return {
-          ...acc,
-          [groupName]: injections.map((injection) => ({
+      return Object.entries(locations).reduce(
+        (carry, [groupName, location]) => {
+          const items = location.getInjections().map((injection) => ({
             id: injection.id,
             MenuItem: injection.filler
-          }))
-        };
-      }, {});
-    }, [injectionsGroups]);
+          }));
+          return {
+            ...carry,
+            [groupName]: items
+          };
+        },
+        {}
+      );
+    }, []);
   };
 }
-function getMenuLocationId(menu, group) {
-  return `editor/app-bar/${menu}/${group}`;
-}
 
 // src/locations/index.ts
 var import_locations2 = require("@elementor/locations");
-
-// src/locations/consts.ts
-var LOCATION_PAGE_INDICATION = "editor/app-bar/page-indication";
-var LOCATION_RESPONSIVE = "editor/app-bar/responsive";
-var LOCATION_PRIMARY_ACTION = "editor/app-bar/primary-action";
-
-// src/locations/index.ts
-var injectIntoPageIndication = (0, import_locations2.createInjectorFor)(LOCATION_PAGE_INDICATION);
-var injectIntoResponsive = (0, import_locations2.createInjectorFor)(LOCATION_RESPONSIVE);
-var injectIntoPrimaryAction = (0, import_locations2.createInjectorFor)(LOCATION_PRIMARY_ACTION);
-var mainMenu = createMenu({
-  name: "main",
-  groups: ["exits"]
-});
-var toolsMenu = createMenu({
-  name: "tools"
-});
-var utilitiesMenu = createMenu({
-  name: "utilities"
-});
-var documentOptionsMenu = createMenu({
-  name: "document-options",
-  groups: ["save"]
-});
+var {
+  inject: injectIntoPageIndication,
+  Slot: PageIndicationSlot
+} = (0, import_locations2.createLocation)();
+var {
+  inject: injectIntoResponsive,
+  Slot: ResponsiveSlot
+} = (0, import_locations2.createLocation)();
+var {
+  inject: injectIntoPrimaryAction,
+  Slot: PrimaryActionSlot
+} = (0, import_locations2.createLocation)();
+var mainMenu = createMenu(["exits"]);
+var toolsMenu = createMenu();
+var utilitiesMenu = createMenu();
+var documentOptionsMenu = createMenu(["save"]);
 
 // src/components/app-bar.tsx
 var React19 = __toESM(require("react"));
@@ -428,23 +416,20 @@ function UtilitiesMenuLocation() {
 
 // src/components/locations/primary-action-location.tsx
 var React16 = __toESM(require("react"));
-var import_locations6 = require("@elementor/locations");
 function PrimaryActionLocation() {
-  return /* @__PURE__ */ React16.createElement(import_locations6.Slot, { location: LOCATION_PRIMARY_ACTION });
+  return /* @__PURE__ */ React16.createElement(PrimaryActionSlot, null);
 }
 
 // src/components/locations/page-indication-location.tsx
 var React17 = __toESM(require("react"));
-var import_locations8 = require("@elementor/locations");
 function PageIndicationLocation() {
-  return /* @__PURE__ */ React17.createElement(import_locations8.Slot, { location: LOCATION_PAGE_INDICATION });
+  return /* @__PURE__ */ React17.createElement(PageIndicationSlot, null);
 }
 
 // src/components/locations/responsive-location.tsx
 var React18 = __toESM(require("react"));
-var import_locations10 = require("@elementor/locations");
 function ResponsiveLocation() {
-  return /* @__PURE__ */ React18.createElement(import_locations10.Slot, { location: LOCATION_RESPONSIVE });
+  return /* @__PURE__ */ React18.createElement(ResponsiveSlot, null);
 }
 
 // src/components/app-bar.tsx
@@ -496,7 +481,7 @@ function SettingsButton() {
 // src/extensions/documents-indicator/index.ts
 function init() {
   injectIntoPageIndication({
-    name: "document-settings-button",
+    id: "document-settings-button",
     filler: SettingsButton,
     options: {
       priority: 20
@@ -525,7 +510,7 @@ function useActionProps() {
 // src/extensions/documents-preview/index.ts
 function init2() {
   utilitiesMenu.registerAction({
-    name: "document-preview-button",
+    id: "document-preview-button",
     priority: 30,
     // After help.
     useProps: useActionProps
@@ -666,19 +651,19 @@ function isEnabled(document2) {
 // src/extensions/documents-save/index.ts
 function init3() {
   injectIntoPrimaryAction({
-    name: "document-primary-action",
+    id: "document-primary-action",
     filler: PrimaryAction
   });
   documentOptionsMenu.registerAction({
     group: "save",
-    name: "document-save-draft",
+    id: "document-save-draft",
     priority: 10,
     // Before save as template.
     useProps: useDocumentSaveDraftProps
   });
   documentOptionsMenu.registerAction({
     group: "save",
-    name: "document-save-as-template",
+    id: "document-save-as-template",
     priority: 20,
     // After save draft.
     useProps: useDocumentSaveTemplateProps
@@ -737,7 +722,7 @@ function useActionProps2() {
 function init4() {
   syncPanelTitle();
   toolsMenu.registerToggleAction({
-    name: "open-elements-panel",
+    id: "open-elements-panel",
     priority: 1,
     useProps: useActionProps2
   });
@@ -764,7 +749,7 @@ function useActionProps3() {
 // src/extensions/finder/index.ts
 function init5() {
   utilitiesMenu.registerToggleAction({
-    name: "toggle-finder",
+    id: "toggle-finder",
     priority: 10,
     // Before help.
     useProps: useActionProps3
@@ -776,7 +761,7 @@ var import_i18n11 = require("@wordpress/i18n");
 var import_icons10 = require("@elementor/icons");
 function init6() {
   utilitiesMenu.registerLink({
-    name: "open-help-center",
+    id: "open-help-center",
     priority: 20,
     // After Finder.
     useProps: () => {
@@ -808,7 +793,7 @@ function useActionProps4() {
 // src/extensions/history/index.ts
 function init7() {
   mainMenu.registerToggleAction({
-    name: "open-history",
+    id: "open-history",
     priority: 20,
     useProps: useActionProps4
   });
@@ -829,7 +814,7 @@ function useActionProps5() {
 // src/extensions/keyboard-shortcuts/index.ts
 function init8() {
   mainMenu.registerAction({
-    name: "open-keyboard-shortcuts",
+    id: "open-keyboard-shortcuts",
     group: "default",
     priority: 40,
     // After user preferences.
@@ -915,11 +900,11 @@ function useActionProps6() {
 // src/extensions/site-settings/index.ts
 function init9() {
   (0, import_editor.injectIntoTop)({
-    name: "site-settings-primary-action-portal",
+    id: "site-settings-primary-action-portal",
     filler: PortalledPrimaryAction
   });
   toolsMenu.registerToggleAction({
-    name: "toggle-site-settings",
+    id: "toggle-site-settings",
     priority: 2,
     useProps: useActionProps6
   });
@@ -943,7 +928,7 @@ function useActionProps7() {
 // src/extensions/structure/index.ts
 function init10() {
   toolsMenu.registerToggleAction({
-    name: "toggle-structure-view",
+    id: "toggle-structure-view",
     priority: 3,
     useProps: useActionProps7
   });
@@ -964,7 +949,7 @@ function useActionProps8() {
 // src/extensions/theme-builder/index.ts
 function init11() {
   mainMenu.registerAction({
-    name: "open-theme-builder",
+    id: "open-theme-builder",
     useProps: useActionProps8
   });
 }
@@ -987,7 +972,7 @@ function useActionProps9() {
 // src/extensions/user-preferences/index.ts
 function init12() {
   mainMenu.registerToggleAction({
-    name: "open-user-preferences",
+    id: "open-user-preferences",
     priority: 30,
     // After history.
     useProps: useActionProps9
@@ -1000,7 +985,7 @@ var import_icons17 = require("@elementor/icons");
 var import_editor_documents7 = require("@elementor/editor-documents");
 function init13() {
   mainMenu.registerLink({
-    name: "exit-to-wordpress",
+    id: "exit-to-wordpress",
     group: "exits",
     useProps: () => {
       const document2 = (0, import_editor_documents7.useActiveDocument)();
@@ -1035,7 +1020,7 @@ function init15() {
   redirectOldMenus();
   init14();
   (0, import_editor2.injectIntoTop)({
-    name: "app-bar",
+    id: "app-bar",
     filler: AppBar
   });
 }