feat(SAP): agrega demo SAP-UI5

Author: JSantarelli

dist/Component-dbg.js

@@ -0,0 +1,49 @@
+sap.ui.define([
+  "sap/ui/core/UIComponent",
+  "sap/ui/model/json/JSONModel",
+  "sap/f/library",
+  "sap/f/FlexibleColumnLayoutSemanticHelper"
+], function (UIComponent, JSONModel, library, FlexibleColumnLayoutSemanticHelper) {
+  "use strict";
+
+  var LayoutType = library.LayoutType;
+
+  var Component = UIComponent.extend("sap.f.ShellBarWithFlexibleColumnLayout.Component", {
+    metadata: {
+      manifest: "json"
+    },
+
+    init: function () {
+      UIComponent.prototype.init.apply(this, arguments);
+
+      var oModel = new JSONModel();
+      this.setModel(oModel);
+
+      // set products demo model on this sample
+      var oProductsModel = new JSONModel(sap.ui.require.toUrl("sap/ui/demo/mock/cuentas.json"));
+      oProductsModel.setSizeLimit(1000);
+      this.setModel(oProductsModel, "products");
+
+
+      this.getRouter().initialize();
+    },
+
+    /**
+		 * Returns an instance of the semantic helper
+		 * @returns {sap.f.FlexibleColumnLayoutSemanticHelper} An instance of the semantic helper
+		 */
+    getHelper: function () {
+      var oFCL = this.getRootControl().byId("fcl"),
+        oParams = new URLSearchParams(window.location.search),
+        oSettings = {
+          defaultTwoColumnLayoutType: LayoutType.TwoColumnsMidExpanded,
+          defaultThreeColumnLayoutType: LayoutType.ThreeColumnsMidExpanded,
+          initialColumnsCount: oParams.get("initial"),
+          maxColumnsCount: oParams.get("max")
+        };
+
+      return FlexibleColumnLayoutSemanticHelper.getInstanceFor(oFCL, oSettings);
+    }
+  });
+  return Component;
+});

dist/Component-preload.js

@@ -0,0 +1,46 @@
+:root {
+    --fontFamily: Arial, Helvetica, sans-serif;
+    --primary: #0055A6;
+    --secondary: #009BDB;
+    --tertiary: #EE6436;
+    --fontSize: 1.75rem;
+    --panelGap: 1rem;
+}
+
+body {
+    font-family: var(--fontFamily);
+}
+
+.sidepanel__subtitle {
+    font-size: 20px!important;
+    font-weight: lighter!important;
+}
+
+.kpi__container {
+    gap: var(--panelGap)!important;
+
+    .kpi__count {
+        font-size: var(--fontSize)!important;
+        font-weight: 700;
+    
+        &--primary {
+            color: var(--primary)!important;
+        }
+        
+        &--secondary {
+            color: var(--secondary)!important;
+        }
+        
+        &--tertiary {
+            color: var(--tertiary)!important;
+        }
+    }
+}
+
+
+@media screen and (max-width: 780px) {
+    .kpi__count {
+      --fontSize: 1rem;
+      font-size: var(--fontSize)!important;
+    }
+  }

dist/Component-preload.js.map

@@ -0,0 +1,16 @@
+sap.ui.define([
+  "sap/ui/model/json/JSONModel",
+  "sap/ui/core/mvc/Controller"
+], function (JSONModel, Controller) {
+  "use strict";
+
+  return Controller.extend("sap.f.ShellBarWithFlexibleColumnLayout.controller.AboutPage", {
+    onInit: function () {
+      this.oRouter = this.getOwnerComponent().getRouter();
+      this.oModel = this.getOwnerComponent().getModel();
+    },
+    onBack: function () {
+      window.history.go(-1);
+    }
+  });
+});