@sap-ux/preview-middleware 0.16.8 → 0.16.11

package/dist/client/cpe/outline/nodes.js

@@ -1,153 +1,174 @@
-"use strict";
-
-sap.ui.define(["./utils"], function (___utils) {
-  "use strict";
-
-  const isEditable = ___utils["isEditable"];
-  /**
-   * Retrieves additional data for a given control ID.
-   *
-   * @param id The unique identifier of the control.
-   * @returns An object containing the text and the technical name of the control.
-   */
-  function getAdditionalData(id) {
-    const control = sap.ui.getCore().byId(id);
-    if (!control) {
-      return {};
-    }
-    const metadata = control.getMetadata();
-    let details = {};
-    const technicalName = metadata.getElementName();
-    if (technicalName) {
-      details.technicalName = technicalName;
-    }
-    if (metadata.getProperty('text')) {
-      const text = control.getProperty('text');
-      if (typeof text === 'string' && text.trim() !== '') {
-        details.text = text;
-      }
-    }
-    return details;
-  }
-
-  /**
-   * Gets the children nodes of an aggregation type node.
-   *
-   * @param current The current node to retrieve children from
-   * @returns An array of children nodes, or an empty array if none are found
-   */
-  function getChildren(current) {
-    return (current.elements ?? []).flatMap(element => element.type === 'aggregation' ? element.elements ?? [] : []);
-  }
-
-  /**
-   * Adds a new child node to the extension point's children array based on the given control ID.
-   *
-   * @param {string} id - The unique identifier of the control to be added as a child node.
-   * @param {OutlineNode[]} children - The array of children nodes to which the new node will be added.
-   */
-  function addChildToExtensionPoint(id, children) {
-    const {
-      text,
-      technicalName
-    } = getAdditionalData(id);
-    const editable = isEditable(id);
-    children.push({
-      controlId: id,
-      controlType: technicalName ?? 'sap.ui.extensionpoint.child',
-      name: text ?? id,
-      visible: true,
-      editable,
-      children: [],
-      hasDefaultContent: false
-    });
-  }
-
-  /**
-   * Transform node.
-   *
-   * @param input outline view node
-   * @param scenario type of project
-   * @param extPointIDs ids that need are filled when extension point has default content or created controls inside
-   * @returns {Promise<OutlineNode[]>} transformed outline tree nodes
-   */
-  async function transformNodes(input, scenario) {
-    const stack = [...input];
-    const items = [];
-    while (stack.length) {
-      const current = stack.shift();
-      const editable = isEditable(current?.id);
-      const isAdp = scenario === 'ADAPTATION_PROJECT';
-      const isExtPoint = current?.type === 'extensionPoint';
-      if (current?.type === 'element') {
-        const children = getChildren(current);
-        const {
-          text
-        } = getAdditionalData(current.id);
-        const technicalName = current.technicalName.split('.').slice(-1)[0];
-        const transformedChildren = isAdp ? await handleDuplicateNodes(children, scenario) : await transformNodes(children, scenario);
-        const node = {
-          controlId: current.id,
-          controlType: current.technicalName,
-          name: text ?? technicalName,
-          editable,
-          visible: current.visible ?? true,
-          children: transformedChildren
-        };
-        items.push(node);
-      }
-      if (isAdp && isExtPoint) {
-        const {
-          defaultContent,
-          createdControls
-        } = current.extensionPointInfo;
-        let children = [];
-        // We can combine both because there can only be either defaultContent or createdControls for one extension point node.
-        [...defaultContent, ...createdControls].forEach(id => {
-          addChildToExtensionPoint(id, children);
-        });
-        const node = {
-          controlId: current.id,
-          controlType: current.technicalName,
-          name: current.name ?? '',
-          editable,
-          visible: current.visible ?? true,
-          children,
-          hasDefaultContent: defaultContent.length > 0
-        };
-        items.push(node);
-      }
-    }
-    return items;
-  }
-
-  /**
-   * Handles duplicate nodes that are retrieved from extension point default content and created controls,
-   * if they exist under an extension point these controls are removed from the children array
-   *
-   * @param children outline view node children
-   * @param scenario type of project
-   * @returns transformed outline tree nodes
-   */
-  async function handleDuplicateNodes(children, scenario) {
-    const extPointIDs = new Set();
-    children.forEach(child => {
-      if (child.type === 'extensionPoint') {
-        const {
-          defaultContent,
-          createdControls
-        } = child.extensionPointInfo;
-        [...defaultContent, ...createdControls].forEach(id => extPointIDs.add(id));
-      }
-    });
-    const uniqueChildren = children.filter(child => !extPointIDs.has(child.id));
-    return transformNodes(uniqueChildren, scenario);
-  }
-  var __exports = {
-    __esModule: true
-  };
-  __exports.transformNodes = transformNodes;
-  __exports.handleDuplicateNodes = handleDuplicateNodes;
-  return __exports;
+"use strict";
+
+sap.ui.define(["./utils", "sap/ui/VersionInfo"], function (___utils, VersionInfo) {
+  "use strict";
+
+  const isEditable = ___utils["isEditable"];
+  const isReuseComponent = ___utils["isReuseComponent"];
+  /**
+   * Retrieves additional data for a given control ID.
+   *
+   * @param id The unique identifier of the control.
+   * @returns An object containing the text and the technical name of the control.
+   */
+  function getAdditionalData(id) {
+    const control = sap.ui.getCore().byId(id);
+    if (!control) {
+      return {};
+    }
+    const metadata = control.getMetadata();
+    let details = {};
+    const technicalName = metadata.getElementName();
+    if (technicalName) {
+      details.technicalName = technicalName;
+    }
+    if (metadata.getProperty('text')) {
+      const text = control.getProperty('text');
+      if (typeof text === 'string' && text.trim() !== '') {
+        details.text = text;
+      }
+    }
+    return details;
+  }
+
+  /**
+   * Gets the children nodes of an aggregation type node.
+   *
+   * @param current The current node to retrieve children from
+   * @returns An array of children nodes, or an empty array if none are found
+   */
+  function getChildren(current) {
+    return (current.elements ?? []).flatMap(element => element.type === 'aggregation' ? element.elements ?? [] : []);
+  }
+
+  /**
+   * Adds a new child node to the extension point's children array based on the given control ID.
+   *
+   * @param {string} id - The unique identifier of the control to be added as a child node.
+   * @param {OutlineNode[]} children - The array of children nodes to which the new node will be added.
+   */
+  function addChildToExtensionPoint(id, children) {
+    const {
+      text,
+      technicalName
+    } = getAdditionalData(id);
+    const editable = isEditable(id);
+    children.push({
+      controlId: id,
+      controlType: technicalName ?? 'sap.ui.extensionpoint.child',
+      name: text ?? id,
+      visible: true,
+      editable,
+      children: [],
+      hasDefaultContent: false
+    });
+  }
+
+  /**
+   * Transform node.
+   *
+   * @param input outline view node
+   * @param scenario type of project
+   * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
+   * @returns {Promise<OutlineNode[]>} transformed outline tree nodes
+   */
+  async function transformNodes(input, scenario, reuseComponentsIds) {
+    const stack = [...input];
+    const items = [];
+    const {
+      version
+    } = await VersionInfo.load();
+    const versionParts = version.split('.');
+    const minor = parseInt(versionParts[1], 10);
+    while (stack.length) {
+      const current = stack.shift();
+      const editable = isEditable(current?.id);
+      const isAdp = scenario === 'ADAPTATION_PROJECT';
+      const isExtPoint = current?.type === 'extensionPoint';
+      if (current?.type === 'element') {
+        const children = getChildren(current);
+        const {
+          text
+        } = getAdditionalData(current.id);
+        const technicalName = current.technicalName.split('.').slice(-1)[0];
+        const transformedChildren = isAdp ? await handleDuplicateNodes(children, scenario, reuseComponentsIds) : await transformNodes(children, scenario, reuseComponentsIds);
+        const node = {
+          controlId: current.id,
+          controlType: current.technicalName,
+          name: text ?? technicalName,
+          editable,
+          visible: current.visible ?? true,
+          children: transformedChildren
+        };
+        fillReuseComponents(reuseComponentsIds, current, scenario, minor);
+        items.push(node);
+      }
+      if (isAdp && isExtPoint) {
+        const {
+          defaultContent,
+          createdControls
+        } = current.extensionPointInfo;
+        let children = [];
+        // We can combine both because there can only be either defaultContent or createdControls for one extension point node.
+        [...defaultContent, ...createdControls].forEach(id => {
+          addChildToExtensionPoint(id, children);
+        });
+        const node = {
+          controlId: current.id,
+          controlType: current.technicalName,
+          name: current.name ?? '',
+          editable,
+          visible: current.visible ?? true,
+          children,
+          hasDefaultContent: defaultContent.length > 0
+        };
+        items.push(node);
+      }
+    }
+    return items;
+  }
+
+  /**
+   * Fill reuse components ids.
+   *
+   * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
+   * @param node view node
+   * @param scenario type of project
+   * @param minorUI5Version miner UI5 version
+   */
+  function fillReuseComponents(reuseComponentsIds, node, scenario, minorUI5Version) {
+    if (scenario === 'ADAPTATION_PROJECT' && node?.component && isReuseComponent(node.id, minorUI5Version)) {
+      reuseComponentsIds.add(node.id);
+    }
+  }
+  /**
+   * Handles duplicate nodes that are retrieved from extension point default content and created controls,
+   * if they exist under an extension point these controls are removed from the children array
+   *
+   * @param children outline view node children
+   * @param scenario type of project
+   * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
+   * @returns transformed outline tree nodes
+   */
+  async function handleDuplicateNodes(children, scenario, reuseComponentsIds) {
+    const extPointIDs = new Set();
+    children.forEach(child => {
+      if (child.type === 'extensionPoint') {
+        const {
+          defaultContent,
+          createdControls
+        } = child.extensionPointInfo;
+        [...defaultContent, ...createdControls].forEach(id => extPointIDs.add(id));
+      }
+    });
+    const uniqueChildren = children.filter(child => !extPointIDs.has(child.id));
+    return transformNodes(uniqueChildren, scenario, reuseComponentsIds);
+  }
+  var __exports = {
+    __esModule: true
+  };
+  __exports.transformNodes = transformNodes;
+  __exports.handleDuplicateNodes = handleDuplicateNodes;
+  return __exports;
 });
 //# sourceMappingURL=nodes.js.map

package/dist/client/cpe/outline/nodes.ts

@@ -1,9 +1,8 @@
 import type { OutlineNode } from '@sap-ux-private/control-property-editor-common';
-
 import type { OutlineViewNode } from 'sap/ui/rta/command/OutlineService';
 import type { Scenario } from 'sap/ui/fl/Scenario';
-
-import { isEditable } from './utils';
+import { isEditable, isReuseComponent } from './utils';
+import VersionInfo from 'sap/ui/VersionInfo';
 
 interface AdditionalData {
     text?: string;
@@ -78,12 +77,19 @@ function addChildToExtensionPoint(id: string, children: OutlineNode[]) {
  *
  * @param input outline view node
  * @param scenario type of project
- * @param extPointIDs ids that need are filled when extension point has default content or created controls inside
+ * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
  * @returns {Promise<OutlineNode[]>} transformed outline tree nodes
  */
-export async function transformNodes(input: OutlineViewNode[], scenario: Scenario): Promise<OutlineNode[]> {
+export async function transformNodes(
+    input: OutlineViewNode[],
+    scenario: Scenario,
+    reuseComponentsIds: Set<string>
+): Promise<OutlineNode[]> {
     const stack = [...input];
     const items: OutlineNode[] = [];
+    const { version } = (await VersionInfo.load()) as { version: string };
+    const versionParts = version.split('.');
+    const minor = parseInt(versionParts[1], 10);
     while (stack.length) {
         const current = stack.shift();
         const editable = isEditable(current?.id);
@@ -96,8 +102,8 @@ export async function transformNodes(input: OutlineViewNode[], scenario: Scenari
             const technicalName = current.technicalName.split('.').slice(-1)[0];
 
             const transformedChildren = isAdp
-                ? await handleDuplicateNodes(children, scenario)
-                : await transformNodes(children, scenario);
+                ? await handleDuplicateNodes(children, scenario, reuseComponentsIds)
+                : await transformNodes(children, scenario, reuseComponentsIds);
 
             const node: OutlineNode = {
                 controlId: current.id,
@@ -108,6 +114,8 @@ export async function transformNodes(input: OutlineViewNode[], scenario: Scenari
                 children: transformedChildren
             };
 
+            fillReuseComponents(reuseComponentsIds, current, scenario, minor);
+
             items.push(node);
         }
 
@@ -136,15 +144,38 @@ export async function transformNodes(input: OutlineViewNode[], scenario: Scenari
     return items;
 }
 
+/**
+ * Fill reuse components ids.
+ *
+ * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
+ * @param node view node
+ * @param scenario type of project
+ * @param minorUI5Version miner UI5 version
+ */
+function fillReuseComponents(
+    reuseComponentsIds: Set<string>,
+    node: OutlineViewNode,
+    scenario: Scenario,
+    minorUI5Version: number
+): void {
+    if (scenario === 'ADAPTATION_PROJECT' && node?.component && isReuseComponent(node.id, minorUI5Version)) {
+        reuseComponentsIds.add(node.id);
+    }
+}
 /**
  * Handles duplicate nodes that are retrieved from extension point default content and created controls,
  * if they exist under an extension point these controls are removed from the children array
  *
  * @param children outline view node children
  * @param scenario type of project
+ * @param reuseComponentsIds ids of reuse components that are filled when outline nodes are transformed
  * @returns transformed outline tree nodes
  */
-export async function handleDuplicateNodes(children: OutlineViewNode[], scenario: Scenario): Promise<OutlineNode[]> {
+export async function handleDuplicateNodes(
+    children: OutlineViewNode[],
+    scenario: Scenario,
+    reuseComponentsIds: Set<string>
+): Promise<OutlineNode[]> {
     const extPointIDs = new Set<string>();
 
     children.forEach((child: OutlineViewNode) => {
@@ -156,5 +187,5 @@ export async function handleDuplicateNodes(children: OutlineViewNode[], scenario
 
     const uniqueChildren = children.filter((child) => !extPointIDs.has(child.id));
 
-    return transformNodes(uniqueChildren, scenario);
+    return transformNodes(uniqueChildren, scenario, reuseComponentsIds);
 }

package/dist/client/cpe/outline/utils.js

@@ -1,39 +1,62 @@
-"use strict";
-
-sap.ui.define(["../control-data", "../utils", "sap/ui/dt/OverlayUtil", "sap/ui/dt/OverlayRegistry", "../ui5-utils"], function (___control_data, ___utils, OverlayUtil, OverlayRegistry, ___ui5_utils) {
-  "use strict";
-
-  const buildControlData = ___control_data["buildControlData"];
-  const getRuntimeControl = ___utils["getRuntimeControl"];
-  const getComponent = ___ui5_utils["getComponent"];
-  const isEditable = function () {
-    let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-    let editable = false;
-    const control = sap.ui.getCore().byId(id);
-    if (!control) {
-      const component = getComponent(id);
-      if (component) {
-        return editable;
-      }
-    } else {
-      let controlOverlay = OverlayRegistry.getOverlay(control);
-      if (!controlOverlay?.getDomRef()) {
-        //look for closest control
-        controlOverlay = OverlayUtil.getClosestOverlayFor(control);
-      }
-      if (controlOverlay) {
-        const runtimeControl = getRuntimeControl(controlOverlay);
-        const controlData = buildControlData(runtimeControl, controlOverlay);
-        const prop = controlData.properties.find(item => item.isEnabled === true);
-        editable = prop !== undefined;
-      }
-    }
-    return editable;
-  };
-  var __exports = {
-    __esModule: true
-  };
-  __exports.isEditable = isEditable;
-  return __exports;
+"use strict";
+
+sap.ui.define(["../control-data", "../utils", "sap/ui/dt/OverlayUtil", "sap/ui/dt/OverlayRegistry", "../ui5-utils", "sap/ui/core/Component"], function (___control_data, ___utils, OverlayUtil, OverlayRegistry, ___ui5_utils, Component) {
+  "use strict";
+
+  const buildControlData = ___control_data["buildControlData"];
+  const getRuntimeControl = ___utils["getRuntimeControl"];
+  const getComponent = ___ui5_utils["getComponent"];
+  const isEditable = function () {
+    let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+    let editable = false;
+    const control = sap.ui.getCore().byId(id);
+    if (!control) {
+      const component = getComponent(id);
+      if (component) {
+        return editable;
+      }
+    } else {
+      let controlOverlay = OverlayRegistry.getOverlay(control);
+      if (!controlOverlay?.getDomRef()) {
+        //look for closest control
+        controlOverlay = OverlayUtil.getClosestOverlayFor(control);
+      }
+      if (controlOverlay) {
+        const runtimeControl = getRuntimeControl(controlOverlay);
+        const controlData = buildControlData(runtimeControl, controlOverlay);
+        const prop = controlData.properties.find(item => item.isEnabled === true);
+        editable = prop !== undefined;
+      }
+    }
+    return editable;
+  };
+
+  /**
+   * Function that checks if control is reuse component
+   *
+   * @param controlId id control
+   * @param minorUI5Version minor UI5 version
+   * @returns boolean if control is from reused component view
+   */
+  const isReuseComponent = (controlId, minorUI5Version) => {
+    if (minorUI5Version <= 114) {
+      return false;
+    }
+    const component = Component.getComponentById(controlId);
+    if (!component) {
+      return false;
+    }
+    const manifest = component.getManifest();
+    if (!manifest) {
+      return false;
+    }
+    return manifest['sap.app']?.type === 'component';
+  };
+  var __exports = {
+    __esModule: true
+  };
+  __exports.isEditable = isEditable;
+  __exports.isReuseComponent = isReuseComponent;
+  return __exports;
 });
 //# sourceMappingURL=utils.js.map

package/dist/client/cpe/outline/utils.ts

@@ -3,6 +3,8 @@ import { getRuntimeControl } from '../utils';
 import OverlayUtil from 'sap/ui/dt/OverlayUtil';
 import OverlayRegistry from 'sap/ui/dt/OverlayRegistry';
 import { getComponent } from '../ui5-utils';
+import Component from 'sap/ui/core/Component';
+import { Manifest } from 'sap/ui/rta/RuntimeAuthoring';
 
 export const isEditable = (id = ''): boolean => {
     let editable = false;
@@ -27,3 +29,28 @@ export const isEditable = (id = ''): boolean => {
     }
     return editable;
 };
+
+/**
+ * Function that checks if control is reuse component
+ *
+ * @param controlId id control
+ * @param minorUI5Version minor UI5 version
+ * @returns boolean if control is from reused component view
+ */
+export const isReuseComponent = (controlId: string, minorUI5Version: number): boolean => {
+    if(minorUI5Version <= 114) {
+        return false;
+    }
+
+    const component = Component.getComponentById(controlId);
+    if (!component) {
+        return false;
+    }
+
+    const manifest = component.getManifest() as Manifest;
+    if(!manifest) {
+        return false;
+    }
+
+    return manifest['sap.app']?.type === 'component';
+};

package/dist/client/cpe/types.js

@@ -1,6 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
 //# sourceMappingURL=types.js.map