@elementor/editor-app-bar 0.10.9 → 0.11.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.11.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor-app-bar@0.10.9...@elementor/editor-app-bar@0.11.0) (2024-05-08)
+
+
+### Features
+
+* **editor-app-bar:** new view page button [ED-14270] ([#180](https://github.com/elementor/elementor-packages/issues/180)) ([692925c](https://github.com/elementor/elementor-packages/commit/692925ce7110742453655fcdaa27b3b40c10f242))
+
+
+
+
+
 ## [0.10.9](https://github.com/elementor/elementor-packages/compare/@elementor/editor-app-bar@0.10.8...@elementor/editor-app-bar@0.10.9) (2024-05-07)
 
 **Note:** Version bump only for package @elementor/editor-app-bar

package/dist/index.js

@@ -187,9 +187,25 @@ function useDocumentSaveTemplateProps() {
   };
 }
 
+// src/extensions/documents-save/hooks/use-document-view-page-props.ts
+var import_i18n5 = require("@wordpress/i18n");
+var import_icons5 = require("@elementor/icons");
+var import_editor_documents5 = require("@elementor/editor-documents");
+var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
+function useDocumentViewPageProps() {
+  const document2 = (0, import_editor_documents5.__useActiveDocument)();
+  return {
+    icon: import_icons5.EyeIcon,
+    title: (0, import_i18n5.__)("View Page", "elementor"),
+    onClick: () => document2?.id && (0, import_editor_v1_adapters4.__privateRunCommand)("editor/documents/view", {
+      id: document2.id
+    })
+  };
+}
+
 // src/extensions/documents-save/components/primary-action.tsx
 var React3 = __toESM(require("react"));
-var import_i18n5 = require("@wordpress/i18n");
+var import_i18n6 = require("@wordpress/i18n");
 
 // src/extensions/documents-save/components/primary-action-menu.tsx
 var React2 = __toESM(require("react"));
@@ -235,13 +251,13 @@ function PrimaryActionMenu(props) {
 
 // src/extensions/documents-save/components/primary-action.tsx
 var import_ui3 = require("@elementor/ui");
-var import_editor_documents5 = require("@elementor/editor-documents");
-var import_icons5 = require("@elementor/icons");
-var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
+var import_editor_documents6 = require("@elementor/editor-documents");
+var import_icons6 = require("@elementor/icons");
+var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
 function PrimaryAction() {
-  const document2 = (0, import_editor_documents5.__useActiveDocument)();
-  const { save } = (0, import_editor_documents5.__useActiveDocumentActions)();
-  const isPreviewMode = (0, import_editor_v1_adapters4.__privateUseIsPreviewMode)();
+  const document2 = (0, import_editor_documents6.__useActiveDocument)();
+  const { save } = (0, import_editor_documents6.__useActiveDocumentActions)();
+  const isPreviewMode = (0, import_editor_v1_adapters5.__privateUseIsPreviewMode)();
   const popupState = (0, import_ui3.usePopupState)({
     variant: "popover",
     popupId: "document-save-options"
@@ -270,7 +286,7 @@ function PrimaryAction() {
   ), /* @__PURE__ */ React3.createElement(
     import_ui3.Tooltip,
     {
-      title: (0, import_i18n5.__)("Save Options", "elementor"),
+      title: (0, import_i18n6.__)("Save Options", "elementor"),
       PopperProps: {
         sx: {
           "&.MuiTooltip-popper .MuiTooltip-tooltip.MuiTooltip-tooltipPlacementBottom": {
@@ -287,14 +303,14 @@ function PrimaryAction() {
         ...(0, import_ui3.bindTrigger)(popupState),
         sx: { px: 0, height: "100%", borderRadius: 0 },
         disabled: isSaveOptionsDisabled,
-        "aria-label": (0, import_i18n5.__)("Save Options", "elementor")
+        "aria-label": (0, import_i18n6.__)("Save Options", "elementor")
       },
-      /* @__PURE__ */ React3.createElement(import_icons5.ChevronDownIcon, null)
+      /* @__PURE__ */ React3.createElement(import_icons6.ChevronDownIcon, null)
     ))
   )), /* @__PURE__ */ React3.createElement(PrimaryActionMenu, { ...(0, import_ui3.bindMenu)(popupState), onClick: popupState.close }));
 }
 function getLabel(document2) {
-  return document2.userCan.publish ? (0, import_i18n5.__)("Publish", "elementor") : (0, import_i18n5.__)("Submit", "elementor");
+  return document2.userCan.publish ? (0, import_i18n6.__)("Publish", "elementor") : (0, import_i18n6.__)("Submit", "elementor");
 }
 function isPublishEnabled(document2) {
   if (document2.type.value === "kit") {
@@ -323,25 +339,32 @@ function init3() {
     // After save draft.
     useProps: useDocumentSaveTemplateProps
   });
+  documentOptionsMenu.registerAction({
+    group: "save",
+    id: "document-view-page",
+    priority: 30,
+    // After save draft.
+    useProps: useDocumentViewPageProps
+  });
 }
 
 // src/extensions/elements/sync/sync-panel-title.ts
-var import_i18n6 = require("@wordpress/i18n");
-var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
+var import_i18n7 = require("@wordpress/i18n");
+var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
 function syncPanelTitle() {
-  const panelTitle = (0, import_i18n6.__)("Elements", "elementor");
-  const tabTitle = (0, import_i18n6.__)("Widgets", "elementor");
-  (0, import_editor_v1_adapters5.__privateListenTo)(
-    (0, import_editor_v1_adapters5.routeOpenEvent)("panel/elements"),
+  const panelTitle = (0, import_i18n7.__)("Elements", "elementor");
+  const tabTitle = (0, import_i18n7.__)("Widgets", "elementor");
+  (0, import_editor_v1_adapters6.__privateListenTo)(
+    (0, import_editor_v1_adapters6.routeOpenEvent)("panel/elements"),
     () => {
       setPanelTitle(panelTitle);
       setTabTitle(tabTitle);
     }
   );
-  (0, import_editor_v1_adapters5.__privateListenTo)(
-    (0, import_editor_v1_adapters5.v1ReadyEvent)(),
+  (0, import_editor_v1_adapters6.__privateListenTo)(
+    (0, import_editor_v1_adapters6.v1ReadyEvent)(),
     () => {
-      if ((0, import_editor_v1_adapters5.__privateIsRouteActive)("panel/elements")) {
+      if ((0, import_editor_v1_adapters6.__privateIsRouteActive)("panel/elements")) {
         setPanelTitle(panelTitle);
         setTabTitle(tabTitle);
       }
@@ -362,15 +385,15 @@ function setTabTitle(title) {
 var import_editor_app_bar_ui6 = require("@elementor/editor-app-bar-ui");
 
 // src/extensions/elements/hooks/use-action-props.ts
-var import_icons6 = require("@elementor/icons");
-var import_i18n7 = require("@wordpress/i18n");
-var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
+var import_icons7 = require("@elementor/icons");
+var import_i18n8 = require("@wordpress/i18n");
+var import_editor_v1_adapters7 = require("@elementor/editor-v1-adapters");
 function useActionProps2() {
-  const { isActive, isBlocked } = (0, import_editor_v1_adapters6.__privateUseRouteStatus)("panel/elements");
+  const { isActive, isBlocked } = (0, import_editor_v1_adapters7.__privateUseRouteStatus)("panel/elements");
   return {
-    title: (0, import_i18n7.__)("Add Element", "elementor"),
-    icon: import_icons6.PlusIcon,
-    onClick: () => (0, import_editor_v1_adapters6.__privateOpenRoute)("panel/elements/categories"),
+    title: (0, import_i18n8.__)("Add Element", "elementor"),
+    icon: import_icons7.PlusIcon,
+    onClick: () => (0, import_editor_v1_adapters7.__privateOpenRoute)("panel/elements/categories"),
     selected: isActive,
     disabled: isBlocked
   };
@@ -390,18 +413,18 @@ function init4() {
 var import_editor_app_bar_ui7 = require("@elementor/editor-app-bar-ui");
 
 // src/extensions/finder/hooks/use-action-props.ts
-var import_i18n8 = require("@wordpress/i18n");
-var import_icons7 = require("@elementor/icons");
-var import_editor_v1_adapters7 = require("@elementor/editor-v1-adapters");
+var import_i18n9 = require("@wordpress/i18n");
+var import_icons8 = require("@elementor/icons");
+var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
 function useActionProps3() {
-  const { isBlocked } = (0, import_editor_v1_adapters7.__privateUseRouteStatus)("finder", {
+  const { isBlocked } = (0, import_editor_v1_adapters8.__privateUseRouteStatus)("finder", {
     blockOnKitRoutes: false,
     blockOnPreviewMode: false
   });
   return {
-    title: (0, import_i18n8.__)("Finder", "elementor"),
-    icon: import_icons7.SearchIcon,
-    onClick: () => (0, import_editor_v1_adapters7.__privateRunCommand)("finder/toggle"),
+    title: (0, import_i18n9.__)("Finder", "elementor"),
+    icon: import_icons8.SearchIcon,
+    onClick: () => (0, import_editor_v1_adapters8.__privateRunCommand)("finder/toggle"),
     disabled: isBlocked
   };
 }
@@ -418,8 +441,8 @@ function init5() {
 
 // src/extensions/help/index.ts
 var import_editor_app_bar_ui8 = require("@elementor/editor-app-bar-ui");
-var import_i18n9 = require("@wordpress/i18n");
-var import_icons8 = require("@elementor/icons");
+var import_i18n10 = require("@wordpress/i18n");
+var import_icons9 = require("@elementor/icons");
 function init6() {
   import_editor_app_bar_ui8.__privateUtilitiesMenu.registerLink({
     id: "open-help-center",
@@ -427,9 +450,9 @@ function init6() {
     // After Finder.
     useProps: () => {
       return {
-        title: (0, import_i18n9.__)("Help", "elementor"),
+        title: (0, import_i18n10.__)("Help", "elementor"),
         href: "https://go.elementor.com/editor-top-bar-learn/",
-        icon: import_icons8.HelpIcon,
+        icon: import_icons9.HelpIcon,
         target: "_blank"
       };
     }
@@ -440,15 +463,15 @@ function init6() {
 var import_editor_app_bar_ui9 = require("@elementor/editor-app-bar-ui");
 
 // src/extensions/history/hooks/use-action-props.ts
-var import_icons9 = require("@elementor/icons");
-var import_i18n10 = require("@wordpress/i18n");
-var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
+var import_icons10 = require("@elementor/icons");
+var import_i18n11 = require("@wordpress/i18n");
+var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
 function useActionProps4() {
-  const { isActive, isBlocked } = (0, import_editor_v1_adapters8.__privateUseRouteStatus)("panel/history");
+  const { isActive, isBlocked } = (0, import_editor_v1_adapters9.__privateUseRouteStatus)("panel/history");
   return {
-    title: (0, import_i18n10.__)("History", "elementor"),
-    icon: import_icons9.HistoryIcon,
-    onClick: () => (0, import_editor_v1_adapters8.__privateOpenRoute)("panel/history/actions"),
+    title: (0, import_i18n11.__)("History", "elementor"),
+    icon: import_icons10.HistoryIcon,
+    onClick: () => (0, import_editor_v1_adapters9.__privateOpenRoute)("panel/history/actions"),
     selected: isActive,
     disabled: isBlocked
   };
@@ -467,14 +490,14 @@ function init7() {
 var import_editor_app_bar_ui10 = require("@elementor/editor-app-bar-ui");
 
 // src/extensions/keyboard-shortcuts/hooks/use-action-props.ts
-var import_i18n11 = require("@wordpress/i18n");
-var import_icons10 = require("@elementor/icons");
-var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
+var import_i18n12 = require("@wordpress/i18n");
+var import_icons11 = require("@elementor/icons");
+var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
 function useActionProps5() {
   return {
-    icon: import_icons10.KeyboardIcon,
-    title: (0, import_i18n11.__)("Keyboard Shortcuts", "elementor"),
-    onClick: () => (0, import_editor_v1_adapters9.__privateRunCommand)("shortcuts/open")
+    icon: import_icons11.KeyboardIcon,
+    title: (0, import_i18n12.__)("Keyboard Shortcuts", "elementor"),
+    onClick: () => (0, import_editor_v1_adapters10.__privateRunCommand)("shortcuts/open")
   };
 }
 
@@ -498,12 +521,12 @@ var React6 = __toESM(require("react"));
 // src/extensions/site-settings/components/portal.tsx
 var React4 = __toESM(require("react"));
 var import_ui4 = require("@elementor/ui");
-var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
+var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
 function Portal(props) {
-  const containerRef = (0, import_editor_v1_adapters10.__privateUseListenTo)(
+  const containerRef = (0, import_editor_v1_adapters11.__privateUseListenTo)(
     [
-      (0, import_editor_v1_adapters10.routeOpenEvent)("panel/global"),
-      (0, import_editor_v1_adapters10.routeCloseEvent)("panel/global")
+      (0, import_editor_v1_adapters11.routeOpenEvent)("panel/global"),
+      (0, import_editor_v1_adapters11.routeCloseEvent)("panel/global")
     ],
     getContainerRef
   );
@@ -513,17 +536,17 @@ function Portal(props) {
   return /* @__PURE__ */ React4.createElement(import_ui4.Portal, { container: containerRef.current, ...props });
 }
 function getContainerRef() {
-  return (0, import_editor_v1_adapters10.__privateIsRouteActive)("panel/global") ? { current: document.querySelector("#elementor-panel-inner") } : { current: null };
+  return (0, import_editor_v1_adapters11.__privateIsRouteActive)("panel/global") ? { current: document.querySelector("#elementor-panel-inner") } : { current: null };
 }
 
 // src/extensions/site-settings/components/primary-action.tsx
 var React5 = __toESM(require("react"));
-var import_editor_documents6 = require("@elementor/editor-documents");
+var import_editor_documents7 = require("@elementor/editor-documents");
 var import_ui5 = require("@elementor/ui");
-var import_i18n12 = require("@wordpress/i18n");
+var import_i18n13 = require("@wordpress/i18n");
 function PrimaryAction2() {
-  const document2 = (0, import_editor_documents6.__useActiveDocument)();
-  const { save } = (0, import_editor_documents6.__useActiveDocumentActions)();
+  const document2 = (0, import_editor_documents7.__useActiveDocument)();
+  const { save } = (0, import_editor_documents7.__useActiveDocumentActions)();
   return /* @__PURE__ */ React5.createElement(import_ui5.Paper, { sx: {
     px: 5,
     py: 4,
@@ -538,7 +561,7 @@ function PrimaryAction2() {
       sx: { width: "100%" },
       onClick: () => document2 && !document2.isSaving ? save() : null
     },
-    document2?.isSaving ? /* @__PURE__ */ React5.createElement(import_ui5.CircularProgress, null) : (0, import_i18n12.__)("Save Changes", "elementor")
+    document2?.isSaving ? /* @__PURE__ */ React5.createElement(import_ui5.CircularProgress, null) : (0, import_i18n13.__)("Save Changes", "elementor")
   ));
 }
 
@@ -551,17 +574,17 @@ function PortalledPrimaryAction() {
 var import_editor_app_bar_ui11 = require("@elementor/editor-app-bar-ui");
 
 // src/extensions/site-settings/hooks/use-action-props.ts
-var import_i18n13 = require("@wordpress/i18n");
-var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
-var import_icons11 = require("@elementor/icons");
+var import_i18n14 = require("@wordpress/i18n");
+var import_editor_v1_adapters12 = require("@elementor/editor-v1-adapters");
+var import_icons12 = require("@elementor/icons");
 function useActionProps6() {
-  const { isActive, isBlocked } = (0, import_editor_v1_adapters11.__privateUseRouteStatus)("panel/global", {
+  const { isActive, isBlocked } = (0, import_editor_v1_adapters12.__privateUseRouteStatus)("panel/global", {
     blockOnKitRoutes: false
   });
   return {
-    title: (0, import_i18n13.__)("Site Settings", "elementor"),
-    icon: import_icons11.AdjustmentsHorizontalIcon,
-    onClick: () => isActive ? (0, import_editor_v1_adapters11.__privateRunCommand)("panel/global/close") : (0, import_editor_v1_adapters11.__privateRunCommand)("panel/global/open"),
+    title: (0, import_i18n14.__)("Site Settings", "elementor"),
+    icon: import_icons12.AdjustmentsHorizontalIcon,
+    onClick: () => isActive ? (0, import_editor_v1_adapters12.__privateRunCommand)("panel/global/close") : (0, import_editor_v1_adapters12.__privateRunCommand)("panel/global/open"),
     selected: isActive,
     disabled: isBlocked
   };
@@ -584,15 +607,15 @@ function init9() {
 var import_editor_app_bar_ui12 = require("@elementor/editor-app-bar-ui");
 
 // src/extensions/structure/hooks/use-action-props.ts
-var import_i18n14 = require("@wordpress/i18n");
-var import_editor_v1_adapters12 = require("@elementor/editor-v1-adapters");
-var import_icons12 = require("@elementor/icons");
+var import_i18n15 = require("@wordpress/i18n");
+var import_editor_v1_adapters13 = require("@elementor/editor-v1-adapters");
+var import_icons13 = require("@elementor/icons");
 function useActionProps7() {
-  const { isActive, isBlocked } = (0, import_editor_v1_adapters12.__privateUseRouteStatus)("navigator");
+  const { isActive, isBlocked } = (0, import_editor_v1_adapters13.__privateUseRouteStatus)("navigator");
   return {
-    title: (0, import_i18n14.__)("Structure", "elementor"),
-    icon: import_icons12.StructureIcon,
-    onClick: () => (0, import_editor_v1_adapters12.__privateRunCommand)("navigator/toggle"),
+    title: (0, import_i18n15.__)("Structure", "elementor"),
+    icon: import_icons13.StructureIcon,
+    onClick: () => (0, import_editor_v1_adapters13.__privateRunCommand)("navigator/toggle"),
     selected: isActive,
     disabled: isBlocked
   };
@@ -611,14 +634,14 @@ function init10() {
 var import_editor_app_bar_ui13 = require("@elementor/editor-app-bar-ui");
 
 // src/extensions/theme-builder/hooks/use-action-props.ts
-var import_i18n15 = require("@wordpress/i18n");
-var import_icons13 = require("@elementor/icons");
-var import_editor_v1_adapters13 = require("@elementor/editor-v1-adapters");
+var import_i18n16 = require("@wordpress/i18n");
+var import_icons14 = require("@elementor/icons");
+var import_editor_v1_adapters14 = require("@elementor/editor-v1-adapters");
 function useActionProps8() {
   return {
-    icon: import_icons13.ThemeBuilderIcon,
-    title: (0, import_i18n15.__)("Theme Builder", "elementor"),
-    onClick: () => (0, import_editor_v1_adapters13.__privateRunCommand)("app/open")
+    icon: import_icons14.ThemeBuilderIcon,
+    title: (0, import_i18n16.__)("Theme Builder", "elementor"),
+    onClick: () => (0, import_editor_v1_adapters14.__privateRunCommand)("app/open")
   };
 }
 
@@ -634,15 +657,15 @@ function init11() {
 var import_editor_app_bar_ui14 = require("@elementor/editor-app-bar-ui");
 
 // src/extensions/user-preferences/hooks/use-action-props.ts
-var import_i18n16 = require("@wordpress/i18n");
-var import_icons14 = require("@elementor/icons");
-var import_editor_v1_adapters14 = require("@elementor/editor-v1-adapters");
+var import_i18n17 = require("@wordpress/i18n");
+var import_icons15 = require("@elementor/icons");
+var import_editor_v1_adapters15 = require("@elementor/editor-v1-adapters");
 function useActionProps9() {
-  const { isActive, isBlocked } = (0, import_editor_v1_adapters14.__privateUseRouteStatus)("panel/editor-preferences");
+  const { isActive, isBlocked } = (0, import_editor_v1_adapters15.__privateUseRouteStatus)("panel/editor-preferences");
   return {
-    icon: import_icons14.ToggleRightIcon,
-    title: (0, import_i18n16.__)("User Preferences", "elementor"),
-    onClick: () => (0, import_editor_v1_adapters14.__privateOpenRoute)("panel/editor-preferences"),
+    icon: import_icons15.ToggleRightIcon,
+    title: (0, import_i18n17.__)("User Preferences", "elementor"),
+    onClick: () => (0, import_editor_v1_adapters15.__privateOpenRoute)("panel/editor-preferences"),
     selected: isActive,
     disabled: isBlocked
   };
@@ -660,19 +683,19 @@ function init12() {
 
 // src/extensions/wordpress/index.ts
 var import_editor_app_bar_ui15 = require("@elementor/editor-app-bar-ui");
-var import_i18n17 = require("@wordpress/i18n");
-var import_icons15 = require("@elementor/icons");
-var import_editor_documents7 = require("@elementor/editor-documents");
+var import_i18n18 = require("@wordpress/i18n");
+var import_icons16 = require("@elementor/icons");
+var import_editor_documents8 = require("@elementor/editor-documents");
 function init13() {
   import_editor_app_bar_ui15.__privateMainMenu.registerLink({
     id: "exit-to-wordpress",
     group: "exits",
     useProps: () => {
-      const document2 = (0, import_editor_documents7.__useActiveDocument)();
+      const document2 = (0, import_editor_documents8.__useActiveDocument)();
       return {
-        title: (0, import_i18n17.__)("Exit to WordPress", "elementor"),
+        title: (0, import_i18n18.__)("Exit to WordPress", "elementor"),
         href: document2?.links?.platformEdit,
-        icon: import_icons15.WordpressIcon
+        icon: import_icons16.WordpressIcon
       };
     }
   });