@sap-ux/fe-fpm-writer 0.22.3 → 0.23.0

package/dist/action/index.js

@@ -78,7 +78,10 @@ function generateCustomAction(basePath, actionConfig, fs) {
     const config = enhanceConfig(actionConfig, manifestPath, manifest);
     // Apply event handler
     if (config.eventHandler) {
-        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, false, config.typescript, event_handler_1.contextParameter);
+        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, {
+            controllerSuffix: false,
+            typescript: config.typescript
+        }, event_handler_1.contextParameter);
     }
     // enhance manifest with action definition and controller reference
     const actions = enhanceManifestAndGetActionsElementReference(manifest, config.target);

package/dist/column/index.js

@@ -45,7 +45,10 @@ function enhanceConfig(fs, data, manifestPath, manifest) {
     (0, defaults_1.setCommonDefaults)(config, manifestPath, manifest);
     // Apply event handler
     if (config.eventHandler) {
-        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, false, config.typescript);
+        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, {
+            controllerSuffix: false,
+            typescript: config.typescript
+        });
     }
     // generate column content
     const content = config.properties && config.properties.length > 0

package/dist/common/defaults.d.ts

@@ -17,7 +17,8 @@ export declare function setCommonDefaults<T extends CustomElement & Partial<Inte
  *      if value is passed then "Button" control with 'press' event would be generated
  *      if value is not passed then "Text" control would be generated
  * @param {boolean} isController - controls if `controller` should be added to handler path
+ * @param {boolean} prefferInput - controls if `input` element should be added to default fragment content
  * @returns default content for fragment
  */
-export declare function getDefaultFragmentContent(text: string, eventHandler?: string, isController?: boolean): string;
+export declare function getDefaultFragmentContent(text: string, eventHandler?: string, isController?: boolean, prefferInput?: boolean): string;
 //# sourceMappingURL=defaults.d.ts.map

package/dist/common/defaults.js

@@ -28,15 +28,25 @@ exports.setCommonDefaults = setCommonDefaults;
  *      if value is passed then "Button" control with 'press' event would be generated
  *      if value is not passed then "Text" control would be generated
  * @param {boolean} isController - controls if `controller` should be added to handler path
+ * @param {boolean} prefferInput - controls if `input` element should be added to default fragment content
  * @returns default content for fragment
  */
-function getDefaultFragmentContent(text, eventHandler, isController = false) {
+function getDefaultFragmentContent(text, eventHandler, isController = false, prefferInput = false) {
     let content;
     if (eventHandler) {
         const parts = eventHandler.split('.');
         const method = parts.pop();
         const handler = `${parts.join('/')}${isController ? '.controller' : ''}`;
-        content = `<Button core:require="{ handler: '${handler}'}" text="${text}" press="handler.${method}" />`;
+        const requireAttr = `core:require="{ handler: '${handler}'}"`;
+        if (prefferInput) {
+            content = `<Input ${requireAttr} label="${text}" change="handler.${method}" />`;
+        }
+        else {
+            content = `<Button ${requireAttr} text="${text}" press="handler.${method}" />`;
+        }
+    }
+    else if (prefferInput) {
+        content = `<Input label="${text}" />`;
     }
     else {
         content = `<Text text="${text}" />`;

package/dist/common/event-handler.d.ts

@@ -1,5 +1,14 @@
 import type { Editor } from 'mem-fs-editor';
 import type { EventHandlerConfiguration, InternalCustomElement } from '../common/types';
+/**
+ * Interface to describe event handler configuration options used during creation.
+ */
+interface EventHandlerConfigurationOptions {
+    controllerSuffix?: boolean;
+    typescript?: boolean;
+    templatePath?: string;
+    eventHandlerFnName?: string;
+}
 /**
  * Interface to describe the input parameters for the generated event handler function.
  */
@@ -23,11 +32,10 @@ export declare const contextParameter: EventHandlerTypescriptParameters;
  * @param fs - the memfs editor instance
  * @param config - configuration
  * @param eventHandler - eventHandler for creation
- * @param controllerSuffix - append controller suffix to new file
- * @param typescript - create Typescript file instead of Javascript
+ * @param eventHandlerOptions - eventHandler options
  * @param parameters - parameter configurations for the event handler
- * @param templatePath - path to the template without the extension
  * @returns {string} full namespace path to method
  */
-export declare function applyEventHandlerConfiguration(fs: Editor, config: Partial<InternalCustomElement>, eventHandler: EventHandlerConfiguration | true | string, controllerSuffix?: boolean, typescript?: boolean, parameters?: EventHandlerTypescriptParameters, templatePath?: string): string;
+export declare function applyEventHandlerConfiguration(fs: Editor, config: Partial<InternalCustomElement>, eventHandler: EventHandlerConfiguration | true | string, eventHandlerOptions: EventHandlerConfigurationOptions, parameters?: EventHandlerTypescriptParameters): string;
+export {};
 //# sourceMappingURL=event-handler.d.ts.map

package/dist/common/event-handler.js

@@ -28,19 +28,17 @@ exports.contextParameter = {
  * @param fs - the memfs editor instance
  * @param config - configuration
  * @param eventHandler - eventHandler for creation
- * @param controllerSuffix - append controller suffix to new file
- * @param typescript - create Typescript file instead of Javascript
+ * @param eventHandlerOptions - eventHandler options
  * @param parameters - parameter configurations for the event handler
- * @param templatePath - path to the template without the extension
  * @returns {string} full namespace path to method
  */
-function applyEventHandlerConfiguration(fs, config, eventHandler, controllerSuffix = false, typescript, parameters = exports.defaultParameter, templatePath = 'common/EventHandler') {
+function applyEventHandlerConfiguration(fs, config, eventHandler, eventHandlerOptions, parameters = exports.defaultParameter) {
+    const { controllerSuffix, typescript, templatePath = 'common/EventHandler' } = eventHandlerOptions;
+    let { eventHandlerFnName = 'onPress' } = eventHandlerOptions;
     if (typeof eventHandler === 'string') {
         // Existing event handler is passed - no need for file creation/update
         return eventHandler;
     }
-    // New event handler function name - 'onPress' is default
-    let eventHandlerFnName = 'onPress';
     let insertScript;
     // By default - use config name for created file name
     let fileName = config.name;

package/dist/filter/index.js

@@ -53,7 +53,11 @@ function generateCustomFilter(basePath, filterConfig, fs) {
     const config = enhanceConfig(filterConfig, manifestPath, manifest);
     // Apply event handler
     if (config.eventHandler) {
-        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, false, config.typescript, event_handler_1.contextParameter, 'filter/Controller');
+        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, {
+            controllerSuffix: false,
+            typescript: config.typescript,
+            templatePath: 'filter/Controller'
+        }, event_handler_1.contextParameter);
     }
     // enhance manifest with the filter definition and controller reference
     const filters = enhanceManifestAndGetFiltersReference(manifest);

package/dist/index.d.ts

@@ -4,8 +4,8 @@ export { CustomAction, TargetControl } from './action/types';
 export { generateCustomAction } from './action';
 export { CustomTableColumn } from './column/types';
 export { generateCustomColumn } from './column';
-export { CustomSection, CustomSubSection } from './section/types';
-export { generateCustomSection, generateCustomSubSection } from './section';
+export { CustomHeaderSection, CustomSection, CustomSubSection, RequestGroupId, DesignTime } from './section/types';
+export { generateCustomSection, generateCustomSubSection, generateCustomHeaderSection } from './section';
 export { CustomFilter } from './filter/types';
 export { generateCustomFilter } from './filter';
 export { CustomView } from './view/types';

package/dist/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.generateControllerExtension = exports.ControllerExtensionPageType = exports.generateBuildingBlock = exports.BuildingBlockType = exports.validateVersion = exports.validateBasePath = exports.enableFPM = exports.generateCustomView = exports.generateCustomFilter = exports.generateCustomSubSection = exports.generateCustomSection = exports.generateCustomColumn = exports.generateCustomAction = exports.TargetControl = exports.generateListReport = exports.generateObjectPage = exports.generateCustomPage = void 0;
+exports.generateControllerExtension = exports.ControllerExtensionPageType = exports.generateBuildingBlock = exports.BuildingBlockType = exports.validateVersion = exports.validateBasePath = exports.enableFPM = exports.generateCustomView = exports.generateCustomFilter = exports.generateCustomHeaderSection = exports.generateCustomSubSection = exports.generateCustomSection = exports.DesignTime = exports.RequestGroupId = exports.generateCustomColumn = exports.generateCustomAction = exports.TargetControl = exports.generateListReport = exports.generateObjectPage = exports.generateCustomPage = void 0;
 var page_1 = require("./page");
 Object.defineProperty(exports, "generateCustomPage", { enumerable: true, get: function () { return page_1.generateCustomPage; } });
 Object.defineProperty(exports, "generateObjectPage", { enumerable: true, get: function () { return page_1.generateObjectPage; } });
@@ -11,9 +11,13 @@ var action_1 = require("./action");
 Object.defineProperty(exports, "generateCustomAction", { enumerable: true, get: function () { return action_1.generateCustomAction; } });
 var column_1 = require("./column");
 Object.defineProperty(exports, "generateCustomColumn", { enumerable: true, get: function () { return column_1.generateCustomColumn; } });
+var types_2 = require("./section/types");
+Object.defineProperty(exports, "RequestGroupId", { enumerable: true, get: function () { return types_2.RequestGroupId; } });
+Object.defineProperty(exports, "DesignTime", { enumerable: true, get: function () { return types_2.DesignTime; } });
 var section_1 = require("./section");
 Object.defineProperty(exports, "generateCustomSection", { enumerable: true, get: function () { return section_1.generateCustomSection; } });
 Object.defineProperty(exports, "generateCustomSubSection", { enumerable: true, get: function () { return section_1.generateCustomSubSection; } });
+Object.defineProperty(exports, "generateCustomHeaderSection", { enumerable: true, get: function () { return section_1.generateCustomHeaderSection; } });
 var filter_1 = require("./filter");
 Object.defineProperty(exports, "generateCustomFilter", { enumerable: true, get: function () { return filter_1.generateCustomFilter; } });
 var view_1 = require("./view");
@@ -23,12 +27,12 @@ Object.defineProperty(exports, "enableFPM", { enumerable: true, get: function ()
 var validate_1 = require("./common/validate");
 Object.defineProperty(exports, "validateBasePath", { enumerable: true, get: function () { return validate_1.validateBasePath; } });
 Object.defineProperty(exports, "validateVersion", { enumerable: true, get: function () { return validate_1.validateVersion; } });
-var types_2 = require("./building-block/types");
-Object.defineProperty(exports, "BuildingBlockType", { enumerable: true, get: function () { return types_2.BuildingBlockType; } });
+var types_3 = require("./building-block/types");
+Object.defineProperty(exports, "BuildingBlockType", { enumerable: true, get: function () { return types_3.BuildingBlockType; } });
 var building_block_1 = require("./building-block");
 Object.defineProperty(exports, "generateBuildingBlock", { enumerable: true, get: function () { return building_block_1.generateBuildingBlock; } });
-var types_3 = require("./controller-extension/types");
-Object.defineProperty(exports, "ControllerExtensionPageType", { enumerable: true, get: function () { return types_3.ControllerExtensionPageType; } });
+var types_4 = require("./controller-extension/types");
+Object.defineProperty(exports, "ControllerExtensionPageType", { enumerable: true, get: function () { return types_4.ControllerExtensionPageType; } });
 var controller_extension_1 = require("./controller-extension");
 Object.defineProperty(exports, "generateControllerExtension", { enumerable: true, get: function () { return controller_extension_1.generateControllerExtension; } });
 //# sourceMappingURL=index.js.map

package/dist/section/index.d.ts

@@ -1,5 +1,5 @@
 import type { Editor } from 'mem-fs-editor';
-import type { CustomSection, CustomSubSection } from './types';
+import type { CustomHeaderSection, CustomSection, CustomSubSection } from './types';
 /**
  * Get the template folder for the given UI5 version.
  *
@@ -8,6 +8,15 @@ import type { CustomSection, CustomSubSection } from './types';
  * @returns path to the template folder containing the manifest.json ejs template
  */
 export declare function getManifestRoot(folderName: string, ui5Version?: string): string;
+/**
+ * Add a custom header section to an existing UI5 application.
+ *
+ * @param {string} basePath - the base path
+ * @param {CustomHeaderSection} customHeaderSection - the custom header section configuration
+ * @param {Editor} [fs] - the mem-fs editor instance
+ * @returns {Promise<Editor>} the updated mem-fs editor instance
+ */
+export declare function generateCustomHeaderSection(basePath: string, customHeaderSection: CustomHeaderSection, fs?: Editor): Editor;
 /**
  * Add a custom section to an existing UI5 application.
  *

package/dist/section/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.generateCustomSubSection = exports.generateCustomSection = exports.getManifestRoot = void 0;
+exports.generateCustomSubSection = exports.generateCustomSection = exports.generateCustomHeaderSection = exports.getManifestRoot = void 0;
 const mem_fs_1 = require("mem-fs");
 const mem_fs_editor_1 = require("mem-fs-editor");
 const path_1 = require("path");
@@ -52,7 +52,10 @@ function enhanceConfig(fs, data, manifestPath, manifest) {
     (0, defaults_1.setCommonDefaults)(config, manifestPath, manifest);
     // Apply event handler
     if (config.eventHandler) {
-        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, false, config.typescript);
+        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, {
+            controllerSuffix: false,
+            typescript: config.typescript
+        });
     }
     // generate section content
     config.content = config.control || (0, defaults_1.getDefaultFragmentContent)(config.name, config.eventHandler);
@@ -91,8 +94,57 @@ function generate(basePath, customSection, manifestTemplateRoot, fs) {
     if (!fs.exists(viewPath)) {
         fs.copyTpl((0, templates_1.getTemplatePath)('common/FragmentWithVBox.xml'), viewPath, completeSection);
     }
-    return fs;
+    return { editor: fs, section: completeSection };
 }
+/**
+ * Add a custom header section to an existing UI5 application.
+ *
+ * @param {string} basePath - the base path
+ * @param {CustomHeaderSection} customHeaderSection - the custom header section configuration
+ * @param {Editor} [fs] - the mem-fs editor instance
+ * @returns {Promise<Editor>} the updated mem-fs editor instance
+ */
+function generateCustomHeaderSection(basePath, customHeaderSection, fs) {
+    var _a;
+    if (!fs) {
+        fs = (0, mem_fs_editor_1.create)((0, mem_fs_1.create)());
+    }
+    const manifestRoot = getManifestRoot('header-section', customHeaderSection.minUI5Version);
+    const minVersion = (0, semver_1.coerce)(customHeaderSection.minUI5Version);
+    let editSection;
+    // Prepare 'templateEdit' - apply namespace and folder path resolution
+    if (customHeaderSection.edit && (!minVersion || (0, semver_1.gte)(minVersion, '1.86.0'))) {
+        editSection = customHeaderSection.edit;
+        const manifestPath = (0, path_1.join)(basePath, 'webapp/manifest.json');
+        const manifest = fs.readJSON(manifestPath);
+        // Set folder, ns and path for edit fragment
+        (0, defaults_1.setCommonDefaults)(editSection, manifestPath, manifest);
+    }
+    // Call standard custom section generation
+    const { editor, section } = generate(basePath, customHeaderSection, manifestRoot, fs);
+    // Handle 'templateEdit' - edit fragment details
+    if (editSection) {
+        // Apply event handler for edit fragment
+        if (editSection.eventHandler) {
+            editSection.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(editor, editSection, editSection.eventHandler, {
+                controllerSuffix: false,
+                typescript: section.typescript,
+                eventHandlerFnName: 'onChange'
+            });
+        }
+        // Generate edit fragment content
+        editSection.content =
+            (_a = editSection.control) !== null && _a !== void 0 ? _a : (0, defaults_1.getDefaultFragmentContent)(editSection.name, editSection.eventHandler, false, true);
+        if (editSection.path) {
+            const viewPath = (0, path_1.join)(editSection.path, `${editSection.name}.fragment.xml`);
+            if (!editor.exists(viewPath)) {
+                editor.copyTpl((0, templates_1.getTemplatePath)('common/FragmentWithVBox.xml'), viewPath, editSection);
+            }
+        }
+    }
+    return editor;
+}
+exports.generateCustomHeaderSection = generateCustomHeaderSection;
 /**
  * Add a custom section to an existing UI5 application.
  *
@@ -103,7 +155,7 @@ function generate(basePath, customSection, manifestTemplateRoot, fs) {
  */
 function generateCustomSection(basePath, customSection, fs) {
     const manifestRoot = getManifestRoot('section', customSection.minUI5Version);
-    return generate(basePath, customSection, manifestRoot, fs);
+    return generate(basePath, customSection, manifestRoot, fs).editor;
 }
 exports.generateCustomSection = generateCustomSection;
 /**
@@ -116,7 +168,7 @@ exports.generateCustomSection = generateCustomSection;
  */
 function generateCustomSubSection(basePath, customSubSection, fs) {
     const manifestRoot = getManifestRoot('subsection', customSubSection.minUI5Version);
-    return generate(basePath, customSubSection, manifestRoot, fs);
+    return generate(basePath, customSubSection, manifestRoot, fs).editor;
 }
 exports.generateCustomSubSection = generateCustomSubSection;
 //# sourceMappingURL=index.js.map

package/dist/section/types.d.ts

@@ -17,14 +17,54 @@ export interface CustomSection extends CustomElement, EventHandler {
      */
     control?: string;
 }
-export interface InternalCustomSection extends CustomSection, CustomSubSection, InternalCustomElement {
+export interface InternalCustomSection extends CustomHeaderSection, CustomSection, CustomSubSection, InternalCustomElement {
     content: string;
     dependencies?: string;
 }
+export type HeaderSectionEditProperty = Pick<CustomElement, 'name' | 'folder'> & EventHandler;
+export declare enum RequestGroupId {
+    Heroes = "Heroes",
+    Decoration = "Decoration",
+    Workers = "Workers",
+    LongRunners = "LongRunners"
+}
+export declare enum DesignTime {
+    Default = "Default",
+    NotAdaptableVisibility = "not-adaptable-visibility",
+    NotAdaptable = "not-adaptable",
+    NotAdaptableTree = "not-adaptable-tree",
+    NotRemovable = "not-removable"
+}
+interface FlexSettings {
+    designtime: DesignTime;
+}
+export interface CustomHeaderSection extends CustomSection {
+    /**
+     * Sub title of header section.
+     */
+    subTitle?: string;
+    /**
+     * The fragment for the editable version of the header facet.
+     */
+    edit?: HeaderSectionEditProperty;
+    /**
+     * Defines if the header facet is stashed in personalization.
+     */
+    stashed?: boolean;
+    /**
+     * Defines the Loading Behavior of Object Page Headers.
+     */
+    requestGroupId: RequestGroupId;
+    /**
+     * Defines the key user adaptation behavior of the header facet.
+     */
+    flexSettings: FlexSettings;
+}
 export interface CustomSubSection extends CustomSection {
     /**
      * Id of parent section.
      */
     parentSection: string;
 }
+export {};
 //# sourceMappingURL=types.d.ts.map

package/dist/section/types.js

@@ -1,3 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.DesignTime = exports.RequestGroupId = void 0;
+var RequestGroupId;
+(function (RequestGroupId) {
+    RequestGroupId["Heroes"] = "Heroes";
+    RequestGroupId["Decoration"] = "Decoration";
+    RequestGroupId["Workers"] = "Workers";
+    RequestGroupId["LongRunners"] = "LongRunners";
+})(RequestGroupId = exports.RequestGroupId || (exports.RequestGroupId = {}));
+var DesignTime;
+(function (DesignTime) {
+    DesignTime["Default"] = "Default";
+    DesignTime["NotAdaptableVisibility"] = "not-adaptable-visibility";
+    DesignTime["NotAdaptable"] = "not-adaptable";
+    DesignTime["NotAdaptableTree"] = "not-adaptable-tree";
+    DesignTime["NotRemovable"] = "not-removable";
+})(DesignTime = exports.DesignTime || (exports.DesignTime = {}));
 //# sourceMappingURL=types.js.map

package/dist/view/index.js

@@ -56,7 +56,10 @@ function enhanceConfig(fs, data, manifestPath, manifest) {
     (0, defaults_1.setCommonDefaults)(config, manifestPath, manifest);
     // apply event handler
     if (config.eventHandler) {
-        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, true, config.typescript);
+        config.eventHandler = (0, event_handler_1.applyEventHandlerConfiguration)(fs, config, config.eventHandler, {
+            controllerSuffix: true,
+            typescript: config.typescript
+        });
     }
     // fill config.views, merge new data into existing views
     mergeViews(config, manifest);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sap-ux/fe-fpm-writer",
   "description": "SAP Fiori elements flexible programming model writer",
-  "version": "0.22.3",
+  "version": "0.23.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/SAP/open-ux-tools.git",
@@ -33,7 +33,7 @@
     "@types/mem-fs": "1.1.2",
     "@types/mem-fs-editor": "7.0.1",
     "@types/semver": "7.3.9",
-    "@sap-ux/project-access": "1.8.4"
+    "@sap-ux/project-access": "1.12.1"
   },
   "engines": {
     "pnpm": ">=6.26.1 < 7.0.0 || >=7.1.0",

package/templates/header-section/1.85/manifest.json

@@ -0,0 +1,43 @@
+{
+    "sap.ui5": {
+        "routing": {
+            "targets": {
+                "<%- target %>": {
+                    "options": {
+                        "settings": {
+                            "content": {
+                                "header": {
+                                    "facets": {
+                                        "<%- name %>": {
+                                            "name": "<%- ns %>.<%- name %>",
+                                            "type": "XMLFragment",
+                                            <%if (typeof position !== 'undefined') {%>"position": {
+                                                <% if (position.placement) { %> 
+                                                    "placement": "<%- position.placement %>"<% if (position.anchor) { %>,<% } %>
+                                                <% } %>
+                                                <% if (position.anchor) { %> 
+                                                    "anchor": "<%- position.anchor %>" 
+                                                <% } %>
+                                            },<% } %>
+                                            "title": "<%- title %>",
+                                            <% if (subTitle) { %> 
+                                                "subTitle": "<%- subTitle %>",
+                                            <% } %>
+                                            <% if (typeof stashed !== 'undefined') { %> 
+                                                "stashed": "<%- stashed %>",
+                                            <% } %>
+                                            "requestGroupId": "<%- requestGroupId %>",
+                                            "flexSettings": {
+                                                "designtime": "<%- flexSettings.designtime %>"
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

package/templates/header-section/1.86/manifest.json

@@ -0,0 +1,45 @@
+{
+    "sap.ui5": {
+        "routing": {
+            "targets": {
+                "<%- target %>": {
+                    "options": {
+                        "settings": {
+                            "content": {
+                                "header": {
+                                    "facets": {
+                                        "<%- name %>": {
+                                            "template": "<%- ns %>.<%- name %>",
+                                            <% if (typeof edit !== 'undefined') { %> 
+                                                "templateEdit": "<%- edit.ns %>.<%- edit.name %>"
+                                            <% } %>,
+                                            <%if (typeof position !== 'undefined') {%>"position": {
+                                                <% if (position.placement) { %> 
+                                                    "placement": "<%- position.placement %>"<% if (position.anchor) { %>,<% } %>
+                                                <% } %>
+                                                <% if (position.anchor) { %> 
+                                                    "anchor": "<%- position.anchor %>" 
+                                                <% } %>
+                                            },<% } %>
+                                            "title": "<%- title %>",
+                                            <% if (typeof subTitle !== 'undefined') { %> 
+                                                "subTitle": "<%- subTitle %>",
+                                            <% } %>
+                                            <% if (typeof stashed !== 'undefined') { %> 
+                                                "stashed": "<%- stashed %>",
+                                            <% } %>
+                                            "requestGroupId": "<%- requestGroupId %>",
+                                            "flexSettings": {
+                                                "designtime": "<%- flexSettings.designtime %>"
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}