igniteui-cli 15.2.2-alpha.3 → 15.3.0

package/templates/react/igr-ts/projects/side-nav-mini-auth/index.js

@@ -0,0 +1,50 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SideNavMiniAuthIgrTsProject = void 0;
+const path = __importStar(require("path"));
+const side_nav_mini_1 = require("../side-nav-mini");
+class SideNavMiniAuthIgrTsProject extends side_nav_mini_1.SideNavMiniIgrTsProject {
+    constructor() {
+        super(...arguments);
+        this.id = "side-nav-mini-auth";
+        this.name = "Side navigation (mini) + login";
+        this.description = "Collapsible mini side navigation extended with user authentication module";
+        this.dependencies = [];
+        this.framework = "react";
+        this.projectType = "igr-ts";
+        this.hasExtraConfiguration = false;
+        this.isHidden = true;
+    }
+    get templatePaths() {
+        return [
+            ...super.templatePaths,
+            path.join(__dirname, "../side-nav-auth/files"),
+            path.join(__dirname, "files")
+        ];
+    }
+}
+exports.SideNavMiniAuthIgrTsProject = SideNavMiniAuthIgrTsProject;
+exports.default = new SideNavMiniAuthIgrTsProject();

package/templates/react/igr-ts/radio-group/default/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const IgniteUIForReactTemplate_1 = require("../../../../../lib/templates/IgniteUIForReactTemplate");
+const constants_1 = require("../../constants");
 class IgrRadioGroupTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplate {
     constructor() {
         super(__dirname);
@@ -11,7 +12,7 @@ class IgrRadioGroupTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactT
         this.projectType = "igr-ts";
         this.name = "Radio Group";
         this.description = "basic IgrRadioGroup";
-        this.packages = ["igniteui-react@~19.5.2"];
+        this.packages = [constants_1.IGNITEUI_REACT_PACKAGE];
     }
 }
 module.exports = new IgrRadioGroupTemplate();

package/templates/react/igr-ts/rating/default/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const IgniteUIForReactTemplate_1 = require("../../../../../lib/templates/IgniteUIForReactTemplate");
+const constants_1 = require("../../constants");
 class IgrRatingTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplate {
     constructor() {
         super(__dirname);
@@ -11,7 +12,7 @@ class IgrRatingTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTempl
         this.projectType = "igr-ts";
         this.name = "Rating";
         this.description = "basic IgrRating";
-        this.packages = ["igniteui-react@~19.5.2"];
+        this.packages = [constants_1.IGNITEUI_REACT_PACKAGE];
     }
 }
 module.exports = new IgrRatingTemplate();

package/templates/react/igr-ts/ripple/default/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const IgniteUIForReactTemplate_1 = require("../../../../../lib/templates/IgniteUIForReactTemplate");
+const constants_1 = require("../../constants");
 class IgrRippleTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplate {
     constructor() {
         super(__dirname);
@@ -11,7 +12,7 @@ class IgrRippleTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTempl
         this.projectType = "igr-ts";
         this.name = "Ripple";
         this.description = "basic IgrRipple";
-        this.packages = ["igniteui-react@~19.5.2"];
+        this.packages = [constants_1.IGNITEUI_REACT_PACKAGE];
     }
 }
 module.exports = new IgrRippleTemplate();

package/templates/react/igr-ts/slider/default/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const IgniteUIForReactTemplate_1 = require("../../../../../lib/templates/IgniteUIForReactTemplate");
+const constants_1 = require("../../constants");
 class IgrSliderTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplate {
     constructor() {
         super(__dirname);
@@ -11,7 +12,7 @@ class IgrSliderTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTempl
         this.projectType = "igr-ts";
         this.name = "Slider";
         this.description = "basic IgrSlider";
-        this.packages = ["igniteui-react@~19.5.2"];
+        this.packages = [constants_1.IGNITEUI_REACT_PACKAGE];
     }
 }
 module.exports = new IgrSliderTemplate();

package/templates/react/igr-ts/switch/default/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const IgniteUIForReactTemplate_1 = require("../../../../../lib/templates/IgniteUIForReactTemplate");
+const constants_1 = require("../../constants");
 class IgrSwitchTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplate {
     constructor() {
         super(__dirname);
@@ -11,7 +12,7 @@ class IgrSwitchTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTempl
         this.projectType = "igr-ts";
         this.name = "Switch";
         this.description = "basic IgrSwitch";
-        this.packages = ["igniteui-react@~19.5.2"];
+        this.packages = [constants_1.IGNITEUI_REACT_PACKAGE];
     }
 }
 module.exports = new IgrSwitchTemplate();

package/templates/react/igr-ts/tabs/default/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const IgniteUIForReactTemplate_1 = require("../../../../../lib/templates/IgniteUIForReactTemplate");
+const constants_1 = require("../../constants");
 class IgrTabsTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplate {
     constructor() {
         super(__dirname);
@@ -11,7 +12,7 @@ class IgrTabsTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplat
         this.projectType = "igr-ts";
         this.name = "Tabs";
         this.description = "basic IgrTabs";
-        this.packages = ["igniteui-react@~19.5.2"];
+        this.packages = [constants_1.IGNITEUI_REACT_PACKAGE];
     }
 }
 module.exports = new IgrTabsTemplate();

package/templates/react/igr-ts/text-area/default/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const IgniteUIForReactTemplate_1 = require("../../../../../lib/templates/IgniteUIForReactTemplate");
+const constants_1 = require("../../constants");
 class IgrTextAreaTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplate {
     constructor() {
         super(__dirname);
@@ -11,7 +12,7 @@ class IgrTextAreaTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTem
         this.projectType = "igr-ts";
         this.name = "Text area";
         this.description = "basic IgrTextarea";
-        this.packages = ["igniteui-react@~19.5.2"];
+        this.packages = [constants_1.IGNITEUI_REACT_PACKAGE];
     }
 }
 module.exports = new IgrTextAreaTemplate();

package/templates/react/igr-ts/tree/default/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const IgniteUIForReactTemplate_1 = require("../../../../../lib/templates/IgniteUIForReactTemplate");
+const constants_1 = require("../../constants");
 class IgrTreeTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplate {
     constructor() {
         super(__dirname);
@@ -11,7 +12,7 @@ class IgrTreeTemplate extends IgniteUIForReactTemplate_1.IgniteUIForReactTemplat
         this.projectType = "igr-ts";
         this.name = "Tree";
         this.description = "basic IgrTree";
-        this.packages = ["igniteui-react@~19.5.2"];
+        this.packages = [constants_1.IGNITEUI_REACT_PACKAGE];
     }
 }
 module.exports = new IgrTreeTemplate();

package/templates/webcomponents/igc-ts/grid/default/index.js

@@ -11,7 +11,7 @@ class IgcGridTemplate extends IgniteUIForWebComponentsTemplate_1.IgniteUIForWebC
         this.projectType = "igc-ts";
         this.name = "Grid";
         this.description = "IgcGrid with local data";
-        this.packages = ["igniteui-webcomponents-grids@~7.0.0"];
+        this.packages = ["igniteui-webcomponents-grids@~7.1.0"];
     }
 }
 module.exports = new IgcGridTemplate();

package/templates/webcomponents/igc-ts/grid/grid-editing/index.js

@@ -11,7 +11,7 @@ class IgcGridEditingTemplate extends IgniteUIForWebComponentsTemplate_1.IgniteUI
         this.projectType = "igc-ts";
         this.name = "Grid Editing";
         this.description = "IgcGrid with editing enabled";
-        this.packages = ["igniteui-webcomponents-grids@~7.0.0"];
+        this.packages = ["igniteui-webcomponents-grids@~7.1.0"];
     }
 }
 module.exports = new IgcGridEditingTemplate();

package/templates/webcomponents/igc-ts/grid/grid-summaries/index.js

@@ -11,7 +11,7 @@ class IgcGridSummariesTemplate extends IgniteUIForWebComponentsTemplate_1.Ignite
         this.projectType = "igc-ts";
         this.name = "Grid Summaries";
         this.description = "IgcGrid with column summaries";
-        this.packages = ["igniteui-webcomponents-grids@~7.0.0"];
+        this.packages = ["igniteui-webcomponents-grids@~7.1.0"];
     }
 }
 module.exports = new IgcGridSummariesTemplate();

package/templates/webcomponents/igc-ts/projects/_base/files/package.json

@@ -13,7 +13,7 @@
   },
   "dependencies": {
     "@vaadin/router": "^2.0.0",
-    "igniteui-webcomponents": "~7.1.3",
+    "igniteui-webcomponents": "~7.2.0",
     "lit": "^3.3.2"
   },
   "devDependencies": {

package/templates/webcomponents/igc-ts/projects/_base/files/src/app/app.ts

@@ -6,6 +6,11 @@ import { routes } from './app-routing.js';
 @customElement('app-root')
 export default class App extends LitElement {
   static styles = css`
+    :host {
+      display: block;
+      min-height: 100vh;
+    }
+
     router-outlet {
       width: 100%;
     }
@@ -13,7 +18,7 @@ export default class App extends LitElement {
     .outer-wrapper {
       display: flex;
       justify-content: center;
-      height: 100%;
+      min-height: 100vh;
     }
   `;
 

package/templates/webcomponents/igc-ts/projects/_base/files/styles.css

@@ -2,6 +2,7 @@ body {
   background: var(--ig-surface-500, 0 0% 100%);
   color: var(--ig-surface-500-contrast, black);
   font-family: var(--ig-font-family);
+  font-weight: 400;
 }
 
 html,

package/templates/webcomponents/igc-ts/projects/_base_with_home/files/index.html

@@ -4,7 +4,9 @@
 <head>
   <meta charset="utf-8">
   <base href="/">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Ignite UI for Web Components</title>
+  <link rel="icon" type="image/png" href="./src/assets/wc.png">
   <link rel="stylesheet" href="./node_modules/igniteui-webcomponents/themes/light/bootstrap.css">
   <link rel="stylesheet" href="./styles.css">
 </head>

package/templates/webcomponents/igc-ts/projects/_base_with_home/files/package.json

@@ -15,11 +15,11 @@
     "@vaadin/router": "^2.0.0",
     "@igniteui/material-icons-extended": "^3.0.2",
     "igniteui-dockmanager": "^2.1.1",
-    "igniteui-webcomponents": "~7.1.3",
+    "igniteui-webcomponents": "~7.2.0",
     "igniteui-webcomponents-charts": "~7.0.0",
     "igniteui-webcomponents-core": "~7.0.0",
     "igniteui-webcomponents-gauges": "~7.0.0",
-    "igniteui-webcomponents-grids": "~7.0.0",
+    "igniteui-webcomponents-grids": "~7.1.0",
     "igniteui-webcomponents-inputs": "~7.0.0",
     "igniteui-webcomponents-layouts": "~7.0.0",
     "lit": "^3.3.2"

package/templates/webcomponents/igc-ts/projects/_base_with_home/files/src/app/home/home.ts

@@ -1,40 +1,134 @@
 import { html, css, LitElement } from 'lit';
 import { customElement } from 'lit/decorators.js';
+import { github } from '@igniteui/material-icons-extended';
+import {
+  defineComponents,
+  IgcIconComponent,
+  registerIconFromText,
+} from 'igniteui-webcomponents';
+
+defineComponents(IgcIconComponent);
+registerIconFromText(github.name, github.value, 'imx-icons');
 
 @customElement('app-home')
 export class HomeComponent extends LitElement {
   static styles = css`
+    :host {
+      display: flex;
+      flex-flow: column nowrap;
+      align-items: center;
+      width: 100%;
+      padding: 24px;
+      text-align: center;
+      box-sizing: border-box;
+    }
+
+    h1 {
+      color: #09f;
+      font-size: 80px;
+      font-weight: 300;
+      line-height: 1.2;
+      margin: 0 0 16px;
+    }
+
+    h4 {
+      font-size: 28px;
+      font-weight: 400;
+      line-height: 1.4;
+      margin: 0 0 32px;
+      max-width: 1120px;
+    }
+
     p {
+      font-size: 16px;
       margin: 0px 0px 8px 0px;
     }
+
+    p:nth-last-child(2) {
+      padding-top: 16px;
+    }
+
+    .content__container--wide {
+      display: flex;
+      flex-flow: row wrap;
+      justify-content: center;
+      gap: 24px;
+    }
+
+    .content__github-item {
+      display: flex;
+      flex-flow: row nowrap;
+      align-items: center;
+    }
+
+    .content__github-icon {
+      display: inline-flex;
+      width: 24px;
+      height: 24px;
+      margin-right: 8px;
+      flex: 0 0 24px;
+      color: #000;
+    }
+
     img {
-      margin-bottom: 48px;
-      max-height: 480px;
+      display: block;
+      width: 500px;
+      height: 350px;
+      margin-bottom: 32px;
       max-width: 100%;
+      object-fit: contain;
+    }
+
+    a {
+      font-size: 16px;
+    }
+
+    @media (max-width: 768px) {
+      h1 {
+        font-size: 40px;
+      }
+
+      h4 {
+        font-size: 20px;
+      }
+
+      img {
+        width: 100%;
+        height: 240px;
+      }
     }
   `;
 
   render() {
     return html`
       <h1>Welcome to Ignite UI for Web Components!</h1>
-      <h4>A complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.</h4>
-      <img src="./src/assets/astronaut-components.svg" alt="indigoDesign">
+      <h4>A complete library of 50+ UI components for building modern web applications with reusable Web Components.</h4>
+      <img src="./src/assets/astronaut-components.svg" alt="Ignite UI for Web Components">
       <p class="ig-typography__subtitle-1">Discover more at</p>
       <p>
-        <a href="https://www.infragistics.com/products/ignite-ui-web-components" target="_blank">
+        <a href="https://www.infragistics.com/products/ignite-ui-web-components" target="_blank" rel="noopener noreferrer">
           www.infragistics.com/products/ignite-ui-web-components
         </a>
       </p>
       <p>
-        <a href="https://www.infragistics.com/products/indigo-design" target="_blank">
+        <a href="https://www.infragistics.com/products/indigo-design" target="_blank" rel="noopener noreferrer">
           www.infragistics.com/products/indigo-design
         </a>
       </p>
       <p class="ig-typography__subtitle-1">We are also on GitHub</p>
       <p class="content__container--wide">
-        <a href="https://github.com/IgniteUI/igniteui-cli" target="_blank">
-          <span class="content__link-image"></span>Ignite UI CLI
-        </a>
+        <span class="content__github-item">
+          <igc-icon class="content__github-icon" name="github" collection="imx-icons" aria-hidden="true"></igc-icon>
+          <a href="https://github.com/IgniteUI/igniteui-webcomponents" target="_blank" rel="noopener noreferrer" class="content__link--github">
+            Ignite UI Web Components
+          </a>
+        </span>
+        <span class="content__github-item">
+          <igc-icon class="content__github-icon" name="github" collection="imx-icons" aria-hidden="true"></igc-icon>
+          <a href="https://github.com/IgniteUI/igniteui-cli" target="_blank" rel="noopener noreferrer" class="content__link--github">
+            Ignite UI CLI
+          </a>
+        </span>
       </p>
     `;
   }