chore: add proConstants for declared ordering for live preview tool box items

Author: abose

src/extensionsIntegrated/phoenix-pro/browser-context/hyperlink-editor.js

@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: LicenseRef-Proprietary
  */
 
-/*global GLOBALS, LivePreviewView, cssStyles, strings, icons*/
+/*global GLOBALS, LivePreviewView, cssStyles, strings, icons, proConstants*/
 
 let _hyperlinkEditor;
 
@@ -144,7 +144,7 @@ function _handleEditHyperlinkOptionClick(event, element) {
 function renderHyperlinkOptions(element, shadow) {
     if (element && element.tagName.toLowerCase() === 'a') {
         return {
-            listOrder: 50,
+            listOrder: proConstants.TOOLBOX_ORDERING.EDIT_HYPERLINK,
             htmlContent: `<span data-action="HyperlinkEditor" title="${strings.editHyperlink}">
                         ${icons.link}
                     </span>`

src/extensionsIntegrated/phoenix-pro/browser-context/ruler-lines.js

@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: LicenseRef-Proprietary
  */
 
-/*global GLOBALS, LivePreviewView, cssStyles, strings, icons*/
+/*global GLOBALS, LivePreviewView, cssStyles, strings, icons, proConstants*/
 
 let _currentRulerLines;
 let _rulerLinesConfig = { enabled: false };
@@ -252,7 +252,7 @@ function handleRulerLinesConfigChange(oldConfig, newConfig) {
 // Dropdown handler: render ruler lines dropdown item
 function renderRulerLinesDropdownItems() {
     return {
-        listOrder: 100,
+        listOrder: proConstants.DROPDOWN_ORDERING.SHOW_MEASUREMENTS,
         htmlContent: `<div class="dropdown-item" data-action="toggle-ruler-lines">
             <span class="item-icon">${icons.ruler}</span>
             <span class="item-label show-ruler-label">${strings.showRulerLines}</span>

src/extensionsIntegrated/phoenix-pro/main.js

@@ -25,6 +25,8 @@ define(function (require, exports, module) {
         // constants first
         LiveDevProtocol.addRemoteFunctionConstantsScript("strings",
             `strings = ${JSON.stringify(remoteConstants.remoteStrings)};`);
+        LiveDevProtocol.addRemoteFunctionConstantsScript("proConstants",
+            `proConstants = ${JSON.stringify(remoteConstants.proConstants)};`);
         LiveDevProtocol.addRemoteFunctionConstantsScript("icons",
             `icons = ${JSON.stringify(remoteIcons.svgIcons)};`);
         LiveDevProtocol.addRemoteFunctionConstantsScript("styles",

src/extensionsIntegrated/phoenix-pro/remote-constants.js

@@ -43,4 +43,26 @@ define(function (require, exports, module) {
         toastCopyFirstTime: Strings.LIVE_DEV_COPY_TOAST_MESSAGE,
         togglePreviewMode: Strings.LIVE_PREVIEW_MODE_TOGGLE_PREVIEW
     };
+
+    // this determines the ordering in which the toolbox items appear in the live preview.
+    const TOOLBOX_ORDERING = {
+        SELECT_PARENT: 10,
+        EDIT_TEXT: 20,
+        EDIT_HYPERLINK: 30,
+        DUPLICATE: 40,
+        DELETE: 50,
+        IMAGE_GALLERY: 60,
+        MORE_OPTIONS: 70,
+        AI: 600 // TBD
+    };
+
+    // this determines the ordering in which the toolbox items appear in the live preview.
+    const DROPDOWN_ORDERING = {
+        SHOW_MEASUREMENTS: 100
+    };
+
+    exports.proConstants = {
+        TOOLBOX_ORDERING,
+        DROPDOWN_ORDERING
+    };
 });