Dynamic page

packages/base/package.json

@@ -44,8 +44,9 @@
     "lit-html": "^2.0.1"
   },
   "devDependencies": {
-    "@openui5/sap.ui.core": "1.120.3",
-    "@ui5/webcomponents-tools": "1.22.0",
+    "@buxlabs/amd-to-es6": "0.16.1",
+    "@openui5/sap.ui.core": "1.116.0",
+    "@ui5/webcomponents-tools": "1.22.0-rc.1",
     "chromedriver": "120.0.0",
     "clean-css": "^5.2.2",
     "copy-and-watch": "^0.1.5",

packages/fiori/package.json

@@ -53,7 +53,7 @@
     "@zxing/library": "^0.17.1"
   },
   "devDependencies": {
-    "@ui5/webcomponents-tools": "1.22.0",
+    "@ui5/webcomponents-tools": "1.22.0-rc.1",
     "chromedriver": "120.0.0"
   }
 }

packages/fiori/src/DynamicPage.hbs

@@ -0,0 +1,51 @@
+<div class="{{classes.root}}">
+  <div class="{{classes.scrollContainer}}"
+    @scroll="{{snapOnScroll}}">
+    <header class="{{classes.headerWrapper}}"
+      id="{{_id}}-header"
+      aria-label="{{_headerLabel}}"
+      aria-expanded="{{_headerExpanded}}"
+      role="region"
+      @ui5-_toggle-title={{onToggleTitle}}>
+      <slot name="titleArea"></slot>
+      {{#if headerInTitle}}
+        <slot name="headerArea"></slot>
+      {{/if}}
+
+      {{#if actionsInTitle}}
+        {{> header-actions}}
+      {{/if}}
+
+   </header>
+
+    {{#if headerInContent}}
+      <slot name="headerArea"></slot>
+    {{/if}}
+
+    {{#unless actionsInTitle}}
+      {{> header-actions}}
+    {{/unless}}
+
+    <div class="{{classes.content}}">
+      <div class="{{classes.fitContent}}">
+        <slot></slot>
+        {{#if showFooter}}
+          <div class="{{classes.spacer}}"></div>
+        {{/if}}
+      </div>
+    </div>
+  </div>
+
+    <div class="{{classes.footer}}">
+      <slot name="footer"></slot>
+    </div>
+</div>
+{{#*inline "header-actions"}}
+    <ui5-dynamic-page-header-actions
+      ?snapped="{{headerSnapped}}"
+      ?pinned="{{headerPinned}}"
+      .accessibilityAttributes="{{_accAttributesForHeaderActions}}"
+      @ui5-expand-button-click={{onExpandClick}}
+      @ui5-pin-button-click={{onPinClick}}
+  ></ui5-dynamic-page-header-actions>
+  {{/inline}}