@sap-ux/preview-middleware 0.16.112 → 0.16.113

package/dist/client/cpe/control-data.js

@@ -2,8 +2,10 @@
 sap.ui.define([
     'open/ux/preview/client/thirdparty/@sap-ux-private/control-property-editor-common',
     'sap/ui/fl/Utils',
-    'sap/ui/base/DataType'
-], function (___sap_ux_private_control_property_editor_common, Utils, DataType) {
+    './utils',
+    'sap/ui/base/DataType',
+    '../utils/fe-v4'
+], function (___sap_ux_private_control_property_editor_common, Utils, ___utils, DataType, ___utils_fe_v4) {
     'use strict';
     const BOOLEAN_VALUE_TYPE = ___sap_ux_private_control_property_editor_common['BOOLEAN_VALUE_TYPE'];
     const CHECKBOX_EDITOR_TYPE = ___sap_ux_private_control_property_editor_common['CHECKBOX_EDITOR_TYPE'];
@@ -11,8 +13,11 @@ sap.ui.define([
     const FLOAT_VALUE_TYPE = ___sap_ux_private_control_property_editor_common['FLOAT_VALUE_TYPE'];
     const INPUT_EDITOR_TYPE = ___sap_ux_private_control_property_editor_common['INPUT_EDITOR_TYPE'];
     const INTEGER_VALUE_TYPE = ___sap_ux_private_control_property_editor_common['INTEGER_VALUE_TYPE'];
+    const PropertyType = ___sap_ux_private_control_property_editor_common['PropertyType'];
     const STRING_VALUE_TYPE = ___sap_ux_private_control_property_editor_common['STRING_VALUE_TYPE'];
     const convertCamelCaseToPascalCase = ___sap_ux_private_control_property_editor_common['convertCamelCaseToPascalCase'];
+    const getManifestProperties = ___utils['getManifestProperties'];
+    const getV4PageType = ___utils_fe_v4['getV4PageType'];
     function isPropertyEnabled(analyzedType) {
         return !(analyzedType.isArray || analyzedType.primitiveType === 'any');
     }
@@ -69,6 +74,34 @@ sap.ui.define([
         }
         return analyzedType;
     }
+    function analyzeManifestProperty(property) {
+        const analyzedType = {
+            primitiveType: 'any',
+            ui5Type: null,
+            enumValues: undefined,
+            isArray: false
+        };
+        const propertyType = property.type;
+        if (!propertyType) {
+            return undefined;
+        }
+        if ([
+                'boolean',
+                'string',
+                'int',
+                'float'
+            ].includes(propertyType)) {
+            analyzedType.primitiveType = propertyType;
+        }
+        if (property.enums) {
+            analyzedType.primitiveType = 'enum';
+            analyzedType.enumValues = property.enums.reduce((acc, item) => {
+                acc[item.id] = item.name;
+                return acc;
+            }, {});
+        }
+        return analyzedType;
+    }
     function normalizeObjectPropertyValue(rawValue) {
         if (typeof rawValue === 'object' && rawValue instanceof Object && !Array.isArray(rawValue)) {
             try {
@@ -85,38 +118,71 @@ sap.ui.define([
             return rawValue;
         }
     }
-    function buildControlData(control, controlOverlay) {
+    function buildControlData(control, changeService, controlOverlay) {
         const controlMetadata = control.getMetadata();
         const selectedControlName = controlMetadata.getName();
         const hasStableId = Utils.checkControlId(control);
-        const controlProperties = controlOverlay ? controlOverlay.getDesignTimeMetadata().getData().properties : undefined;
-        const allProperties = controlMetadata.getAllProperties();
+        const overlayData = controlOverlay?.getDesignTimeMetadata().getData();
+        const controlProperties = controlOverlay ? overlayData?.properties : undefined;
+        const manifestProperties = getManifestProperties(control, changeService, controlOverlay);
+        const allProperties = {
+            ...controlMetadata.getAllProperties(),
+            ...manifestProperties
+        };
+        let propertyType;
         const propertyNames = Object.keys(allProperties);
         const properties = [];
         for (const propertyName of propertyNames) {
             const property = allProperties[propertyName];
-            const analyzedType = analyzePropertyType(property);
-            if (!analyzedType) {
-                continue;
-            }
-            let ignore = false;
-            if (controlProperties?.[property.name]) {
-                ignore = controlProperties[property.name].ignore;
-            }
-            const controlNewData = {
-                id: control.getId(),
-                name: property.name,
-                newValue: control.getProperty(property.name)
-            };
-            const bindingInfo = control.getBindingInfo(controlNewData.name);
-            if (bindingInfo?.bindingString !== undefined) {
-                controlNewData.newValue = bindingInfo.bindingString;
+            let analyzedType;
+            let isEnabled = false;
+            let value;
+            if (property && 'configuration' in property) {
+                propertyType = PropertyType.Configuration;
+                analyzedType = analyzeManifestProperty(property);
+                if (!analyzedType || property?.restrictedTo?.length && !property?.restrictedTo?.includes(getV4PageType(control))) {
+                    continue;
+                }
+                isEnabled = true;
+                value = property.value;
+            } else {
+                propertyType = PropertyType.ControlProperty;
+                analyzedType = analyzePropertyType(property);
+                if (!analyzedType) {
+                    continue;
+                }
+                let ignore = false;
+                if (controlProperties?.[property.name]) {
+                    ignore = controlProperties[property.name].ignore;
+                }
+                const controlNewData = {
+                    id: control.getId(),
+                    name: property.name,
+                    newValue: control.getProperty(property.name)
+                };
+                const bindingInfo = control.getBindingInfo(controlNewData.name);
+                if (bindingInfo?.bindingString !== undefined) {
+                    controlNewData.newValue = bindingInfo.bindingString;
+                }
+                isEnabled = isControlEnabled(analyzedType, hasStableId, ignore, controlOverlay);
+                value = normalizeObjectPropertyValue(controlNewData.newValue);
             }
-            const isEnabled = isControlEnabled(analyzedType, hasStableId, ignore, controlOverlay);
-            const value = normalizeObjectPropertyValue(controlNewData.newValue);
             const isIcon = testIconPattern(property.name) && selectedControlName !== 'sap.m.Image' && analyzedType.ui5Type === 'sap.ui.core.URI';
             const ui5Type = analyzedType.ui5Type || undefined;
             const readableName = convertCamelCaseToPascalCase(property.name);
+            let docu;
+            if ('configuration' in property) {
+                const defValue = [
+                    'undefined',
+                    'null'
+                ].includes(String(property.defaultValue)) ? '-' : String(property.defaultValue);
+                docu = {
+                    description: property.description,
+                    propertyName: property.id,
+                    type: property.type,
+                    defaultValue: defValue || '-'
+                };
+            }
             switch (analyzedType.primitiveType) {
             case 'enum': {
                     const values = analyzedType.enumValues ?? {};
@@ -127,12 +193,14 @@ sap.ui.define([
                     properties.push({
                         type: STRING_VALUE_TYPE,
                         editor: DROPDOWN_EDITOR_TYPE,
+                        propertyType,
                         name: property.name,
                         readableName,
                         value: value,
                         isEnabled,
                         ui5Type,
-                        options
+                        options,
+                        ...docu && { documentation: docu }
                     });
                     break;
                 }
@@ -140,12 +208,14 @@ sap.ui.define([
                     properties.push({
                         type: STRING_VALUE_TYPE,
                         editor: INPUT_EDITOR_TYPE,
+                        propertyType,
                         name: property.name,
                         readableName,
                         value: value,
                         isEnabled,
                         isIcon,
-                        ui5Type
+                        ui5Type,
+                        ...docu && { documentation: docu }
                     });
                     break;
                 }
@@ -153,11 +223,13 @@ sap.ui.define([
                     properties.push({
                         type: INTEGER_VALUE_TYPE,
                         editor: INPUT_EDITOR_TYPE,
+                        propertyType,
                         name: property.name,
                         readableName,
                         value: value,
                         isEnabled,
-                        ui5Type
+                        ui5Type,
+                        ...docu && { documentation: docu }
                     });
                     break;
                 }
@@ -165,11 +237,13 @@ sap.ui.define([
                     properties.push({
                         type: FLOAT_VALUE_TYPE,
                         editor: INPUT_EDITOR_TYPE,
+                        propertyType,
                         name: property.name,
                         readableName,
                         value: value,
                         isEnabled,
-                        ui5Type
+                        ui5Type,
+                        ...docu && { documentation: docu }
                     });
                     break;
                 }
@@ -177,11 +251,13 @@ sap.ui.define([
                     properties.push({
                         type: BOOLEAN_VALUE_TYPE,
                         editor: CHECKBOX_EDITOR_TYPE,
+                        propertyType,
                         name: property.name,
                         readableName,
                         value: value,
                         isEnabled,
-                        ui5Type
+                        ui5Type,
+                        ...docu && { documentation: docu }
                     });
                     break;
                 }

package/dist/client/cpe/control-data.ts

@@ -6,6 +6,7 @@ import {
     FLOAT_VALUE_TYPE,
     INPUT_EDITOR_TYPE,
     INTEGER_VALUE_TYPE,
+    PropertyType,
     STRING_VALUE_TYPE,
     convertCamelCaseToPascalCase
 } from '@sap-ux-private/control-property-editor-common';
@@ -13,9 +14,12 @@ import {
 import Utils from 'sap/ui/fl/Utils';
 import type ManagedObject from 'sap/ui/base/ManagedObject';
 import type ElementOverlay from 'sap/ui/dt/ElementOverlay';
-import type { ManagedObjectMetadataProperties } from './utils';
+import { getManifestProperties, MergedSetting, type ManagedObjectMetadataProperties } from './utils';
 import { UI5ControlProperty } from './types';
 import DataType from 'sap/ui/base/DataType';
+import { getV4PageType } from '../utils/fe-v4';
+import { ChangeService } from './changes';
+import { TemplateType } from 'sap/ui/dt/DesignTimeMetadata';
 
 type AnalyzedType = Pick<UI5ControlProperty, 'isArray' | 'primitiveType' | 'ui5Type' | 'enumValues'>;
 
@@ -124,6 +128,35 @@ function analyzePropertyType(property: ManagedObjectMetadataProperties): Analyze
     return analyzedType;
 }
 
+function analyzeManifestProperty(property: MergedSetting): AnalyzedType | undefined {
+    const analyzedType: AnalyzedType = {
+        primitiveType: 'any',
+        ui5Type: null,
+        enumValues: undefined,
+        isArray: false
+    };
+
+    const propertyType = property.type;
+
+    if (!propertyType) {
+        return undefined;
+    }
+
+    if (['boolean', 'string', 'int', 'float'].includes(propertyType)) {
+        analyzedType.primitiveType = propertyType;
+    }
+
+    if (property.enums) {
+        analyzedType.primitiveType = 'enum';
+        analyzedType.enumValues = property.enums.reduce<Record<string, string>>((acc, item) => {
+            acc[item.id] = item.name;
+            return acc;
+        }, {});
+    }
+
+    return analyzedType;
+}
+
 /**
  * If rawValue is anything except an object like {} or a function, return it as-is,
  * If it is an object, stringify it.
@@ -170,65 +203,113 @@ interface NewControlData {
  * Build control data.
  *
  * @param control - ui5 control
+ * @param changeService - Changeservice for change stack event handling.
  * @param controlOverlay - element overlay
  * @param includeDocumentation - include documentation flag
  * @returns Promise<Control>
  */
-export function buildControlData(control: ManagedObject, controlOverlay?: ElementOverlay): Control {
+export function buildControlData(
+    control: ManagedObject,
+    changeService: ChangeService,
+    controlOverlay?: ElementOverlay
+): Control {
     const controlMetadata = control.getMetadata();
     const selectedControlName = controlMetadata.getName();
     const hasStableId = Utils.checkControlId(control);
-    const controlProperties = controlOverlay ? controlOverlay.getDesignTimeMetadata().getData().properties : undefined;
+    const overlayData = controlOverlay?.getDesignTimeMetadata().getData();
 
-    // Add the control's properties
-    const allProperties = controlMetadata.getAllProperties() as unknown as {
-        [name: string]: ManagedObjectMetadataProperties;
+    const controlProperties = controlOverlay ? overlayData?.properties : undefined;
+    const manifestProperties = getManifestProperties(control, changeService, controlOverlay);
+    // Add the control's properties/manifest properties
+    const allProperties = {
+        ...(controlMetadata.getAllProperties() as unknown as {
+            [name: string]: ManagedObjectMetadataProperties;
+        }),
+        ...manifestProperties
     };
+    let propertyType;
     const propertyNames = Object.keys(allProperties);
     const properties: ControlProperty[] = [];
     for (const propertyName of propertyNames) {
         const property = allProperties[propertyName];
+        let analyzedType;
+        let isEnabled = false;
+        let value: unknown;
+        if (property && 'configuration' in property) {
+            propertyType = PropertyType.Configuration;
+            analyzedType = analyzeManifestProperty(property);
+            if (
+                !analyzedType ||
+                (property?.restrictedTo?.length &&
+                    !property?.restrictedTo?.includes(getV4PageType(control) as TemplateType))
+            ) {
+                continue;
+            }
+            isEnabled = true;
+            value = property.value;
+        } else {
+            propertyType = PropertyType.ControlProperty;
+            // the default behavior is that the property is enabled
+            // meaning it's not ignored during design time
+            analyzedType = analyzePropertyType(property);
+            if (!analyzedType) {
+                continue;
+            }
+            let ignore = false;
+            if (controlProperties?.[property.name]) {
+                // check whether the property should be ignored in design time or not
+                // if it's 'undefined' then it's not considered when building isEnabled because it's 'true'
+                ignore = controlProperties[property.name].ignore;
+            }
 
-        const analyzedType = analyzePropertyType(property);
-        if (!analyzedType) {
-            continue;
-        }
-        // the default behavior is that the property is enabled
-        // meaning it's not ignored during design time
-        let ignore = false;
-        if (controlProperties?.[property.name]) {
-            // check whether the property should be ignored in design time or not
-            // if it's 'undefined' then it's not considered when building isEnabled because it's 'true'
-            ignore = controlProperties[property.name].ignore;
-        }
-
-        //updating i18n text for the control if bindingInfo has bindingString
-        const controlNewData: NewControlData = {
-            id: control.getId(),
-            name: property.name,
-            newValue: control.getProperty(property.name)
-        };
-        const bindingInfo: { bindingString?: string } = control.getBindingInfo(controlNewData.name) as {
-            bindingString?: string;
-        };
-        if (bindingInfo?.bindingString !== undefined) {
-            controlNewData.newValue = bindingInfo.bindingString;
-        }
+            //updating i18n text for the control if bindingInfo has bindingString
+            const controlNewData: NewControlData = {
+                id: control.getId(),
+                name: property.name,
+                newValue: control.getProperty(property.name)
+            };
+            const bindingInfo: { bindingString?: string } = control.getBindingInfo(controlNewData.name) as {
+                bindingString?: string;
+            };
+            if (bindingInfo?.bindingString !== undefined) {
+                controlNewData.newValue = bindingInfo.bindingString;
+            }
 
-        // A property is enabled if:
-        // 1. The property supports changes
-        // 2. The control has stable ID
-        // 3. It is not configured to be ignored in design time
-        // 4. And control overlay is selectable
-        const isEnabled = isControlEnabled(analyzedType, hasStableId, ignore, controlOverlay);
+            // A property is enabled if:
+            // 1. The property supports changes
+            // 2. The control has stable ID
+            // 3. It is not configured to be ignored in design time
+            // 4. And control overlay is selectable
+            isEnabled = isControlEnabled(analyzedType, hasStableId, ignore, controlOverlay);
 
-        const value = normalizeObjectPropertyValue(controlNewData.newValue);
+            value = normalizeObjectPropertyValue(controlNewData.newValue);
+        }
         const isIcon =
             testIconPattern(property.name) &&
             selectedControlName !== 'sap.m.Image' &&
             analyzedType.ui5Type === 'sap.ui.core.URI';
         const ui5Type = analyzedType.ui5Type || undefined;
         const readableName = convertCamelCaseToPascalCase(property.name);
+        let docu:
+            | {
+                  defaultValue: string;
+                  description: string;
+                  propertyName: string;
+                  type?: string;
+                  propertyType?: string;
+              }
+            | undefined;
+        if ('configuration' in property) {
+            const defValue = ['undefined', 'null'].includes(String(property.defaultValue))
+                ? '-'
+                : String(property.defaultValue);
+            docu = {
+                description: property.description,
+                propertyName: property.id,
+                type: property.type,
+                defaultValue: defValue || '-'
+            };
+        }
         switch (analyzedType.primitiveType) {
             case 'enum': {
                 const values = analyzedType.enumValues ?? {};
@@ -239,12 +320,14 @@ export function buildControlData(control: ManagedObject, controlOverlay?: Elemen
                 properties.push({
                     type: STRING_VALUE_TYPE,
                     editor: DROPDOWN_EDITOR_TYPE,
+                    propertyType,
                     name: property.name,
                     readableName,
                     value: value as string,
                     isEnabled,
                     ui5Type,
-                    options
+                    options,
+                    ...(docu && { documentation: docu })
                 });
                 break;
             }
@@ -252,12 +335,14 @@ export function buildControlData(control: ManagedObject, controlOverlay?: Elemen
                 properties.push({
                     type: STRING_VALUE_TYPE,
                     editor: INPUT_EDITOR_TYPE,
+                    propertyType,
                     name: property.name,
                     readableName,
                     value: value as string,
                     isEnabled,
                     isIcon,
-                    ui5Type
+                    ui5Type,
+                    ...(docu && { documentation: docu })
                 });
                 break;
             }
@@ -265,11 +350,13 @@ export function buildControlData(control: ManagedObject, controlOverlay?: Elemen
                 properties.push({
                     type: INTEGER_VALUE_TYPE,
                     editor: INPUT_EDITOR_TYPE,
+                    propertyType,
                     name: property.name,
                     readableName,
                     value: value as number,
                     isEnabled,
-                    ui5Type
+                    ui5Type,
+                    ...(docu && { documentation: docu })
                 });
                 break;
             }
@@ -277,11 +364,13 @@ export function buildControlData(control: ManagedObject, controlOverlay?: Elemen
                 properties.push({
                     type: FLOAT_VALUE_TYPE,
                     editor: INPUT_EDITOR_TYPE,
+                    propertyType,
                     name: property.name,
                     readableName,
                     value: value as number,
                     isEnabled,
-                    ui5Type
+                    ui5Type,
+                    ...(docu && { documentation: docu })
                 });
                 break;
             }
@@ -289,11 +378,13 @@ export function buildControlData(control: ManagedObject, controlOverlay?: Elemen
                 properties.push({
                     type: BOOLEAN_VALUE_TYPE,
                     editor: CHECKBOX_EDITOR_TYPE,
+                    propertyType,
                     name: property.name,
                     readableName,
                     value: value as boolean,
                     isEnabled,
-                    ui5Type
+                    ui5Type,
+                    ...(docu && { documentation: docu })
                 });
                 break;
             }

package/dist/client/cpe/init.js

@@ -37,10 +37,10 @@ sap.ui.define([
         function subscribe(handler) {
             CommunicationService.subscribe(handler);
         }
-        const selectionService = new SelectionService(rta);
-        const changesService = new ChangeService({ rta }, selectionService);
-        const connectorService = new WorkspaceConnectorService();
         const rtaService = new RtaService(rta);
+        const changesService = new ChangeService({ rta });
+        const selectionService = new SelectionService(rta, changesService);
+        const connectorService = new WorkspaceConnectorService();
         const outlineService = new OutlineService(rta, changesService);
         const quickActionService = new QuickActionService(rta, outlineService, registries);
         const services = [

package/dist/client/cpe/init.ts

@@ -1,11 +1,7 @@
 import Log from 'sap/base/Log';
 import type RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
 
-import {
-    iconsLoaded,
-    enableTelemetry,
-    appLoaded
-} from '@sap-ux-private/control-property-editor-common';
+import { iconsLoaded, enableTelemetry, appLoaded } from '@sap-ux-private/control-property-editor-common';
 
 import type { ActionHandler, Service } from './types';
 import { OutlineService } from './outline/service';
@@ -40,11 +36,12 @@ export default function init(
         CommunicationService.subscribe(handler);
     }
 
-    const selectionService = new SelectionService(rta);
+    const rtaService = new RtaService(rta);
+
+    const changesService = new ChangeService({ rta });
+    const selectionService = new SelectionService(rta, changesService);
 
-    const changesService = new ChangeService({ rta }, selectionService);
     const connectorService = new WorkspaceConnectorService();
-    const rtaService = new RtaService(rta);
     const outlineService = new OutlineService(rta, changesService);
     const quickActionService = new QuickActionService(rta, outlineService, registries);
     const services: Service[] = [

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

@@ -6,8 +6,8 @@ sap.ui.define(["../control-data", "../utils", "sap/ui/dt/OverlayUtil", "sap/ui/d
   const buildControlData = ___control_data["buildControlData"];
   const getRuntimeControl = ___utils["getRuntimeControl"];
   const getComponent = ____utils_core["getComponent"];
-  const isEditable = function () {
-    let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  const isEditable = function (changeService) {
+    let id = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     let editable = false;
     const control = sap.ui.getCore().byId(id);
     if (!control) {
@@ -23,7 +23,7 @@ sap.ui.define(["../control-data", "../utils", "sap/ui/dt/OverlayUtil", "sap/ui/d
       }
       if (controlOverlay) {
         const runtimeControl = getRuntimeControl(controlOverlay);
-        const controlData = buildControlData(runtimeControl, controlOverlay);
+        const controlData = buildControlData(runtimeControl, changeService, controlOverlay);
         const prop = controlData.properties.find(item => item.isEnabled === true);
         editable = prop !== undefined;
       }

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

@@ -3,8 +3,9 @@ import { getRuntimeControl } from '../utils';
 import OverlayUtil from 'sap/ui/dt/OverlayUtil';
 import OverlayRegistry from 'sap/ui/dt/OverlayRegistry';
 import { getComponent } from '../../utils/core';
+import { ChangeService } from '../changes';
 
-export const isEditable = (id = ''): boolean => {
+export const isEditable = (changeService: ChangeService, id = ''): boolean => {
     let editable = false;
     const control = sap.ui.getCore().byId(id);
     if (!control) {
@@ -20,7 +21,7 @@ export const isEditable = (id = ''): boolean => {
         }
         if (controlOverlay) {
             const runtimeControl = getRuntimeControl(controlOverlay);
-            const controlData = buildControlData(runtimeControl, controlOverlay);
+            const controlData = buildControlData(runtimeControl, changeService, controlOverlay);
             const prop = controlData.properties.find((item) => item.isEnabled === true);
             editable = prop !== undefined;
         }