@eui/cli 15.4.1 → 15.4.2

package/lib/skeletons/web-symfony/myapp-web/package.json

@@ -1,24 +1,24 @@
-{
-    "name": "eui-angular-app",
-    "version": "15.4.1-snapshot-1690986565745",
-    "license": "EUPL-1.1",
-    "description": "eUI JEE Symfony app scripts",
-    "scripts": {
-        "ng": "ng",
-        "e2e": "ng e2e",
-        "stylelint": "stylelint \"src/**/*.scss\"",
-        "tslint": "tslint \"src/**/*.ts\"",
-        "clean": "rimraf out-tsc dist packages/**/dist/** packages/**/out-tsc/** packages/**/src/lib/**/*.js packages/**/src/lib/**/*.js.map",
-        "start-symfony": "eui-scripts start-symfony --configuration=dev",
-        "start-serve": "eui-scripts serve-app --configuration=proxy-mock",
-        "start": "npm run clean && npm-run-all --parallel start-symfony start-serve",
-        "start-mean": "npm run clean && npm-run-all --parallel start-mock-server-mean start-serve",
-        "start-proxy": "npm run clean && eui-scripts serve-app --configuration=proxy",
-        "start-openid": "npm run clean && eui-scripts serve-app --configuration=local-openid",
-        "generate-changelog": "eui-scripts generate-changelog"
-    },
-    "private": true,
-    "dependencies": {
-        "@eui/deps-base": "15.4.1-snapshot-1690986565745"
-    }
+{
+    "name": "eui-angular-app",
+    "version": "15.4.2",
+    "license": "EUPL-1.1",
+    "description": "eUI JEE Symfony app scripts",
+    "scripts": {
+        "ng": "ng",
+        "e2e": "ng e2e",
+        "stylelint": "stylelint \"src/**/*.scss\"",
+        "tslint": "tslint \"src/**/*.ts\"",
+        "clean": "rimraf out-tsc dist packages/**/dist/** packages/**/out-tsc/** packages/**/src/lib/**/*.js packages/**/src/lib/**/*.js.map",
+        "start-symfony": "eui-scripts start-symfony --configuration=dev",
+        "start-serve": "eui-scripts serve-app --configuration=proxy-mock",
+        "start": "npm run clean && npm-run-all --parallel start-symfony start-serve",
+        "start-mean": "npm run clean && npm-run-all --parallel start-mock-server-mean start-serve",
+        "start-proxy": "npm run clean && eui-scripts serve-app --configuration=proxy",
+        "start-openid": "npm run clean && eui-scripts serve-app --configuration=local-openid",
+        "generate-changelog": "eui-scripts generate-changelog"
+    },
+    "private": true,
+    "dependencies": {
+        "@eui/deps-base": "15.4.2"
+    }
 }

package/lib/skeletons/web-symfony/myapp-web/src/app/app-routing.module.ts

@@ -1,18 +1,18 @@
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
-
-const routes: Routes = [
-    { path: '', redirectTo: 'screen/home', pathMatch: 'full' },
-    { path: 'index.jsp', redirectTo: 'screen/home' },
-    { path: 'screen/home', loadChildren: './features/home/home.module#Module' },
-    { path: 'screen/products', loadChildren: './features/products/products.module#ProductsModule' },
-    { path: 'screen/module1', loadChildren: './features/module1/module1.module#Module' },
-    { path: 'screen/module2', loadChildren: './features/module2/module2.module#Module' }
-];
-
-@NgModule({
-    imports: [
-        RouterModule.forRoot(routes),
-    ],
-})
-export class AppRoutingModule {}
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+
+const routes: Routes = [
+    { path: '', redirectTo: 'screen/home', pathMatch: 'full' },
+    { path: 'index.jsp', redirectTo: 'screen/home' },
+    { path: 'screen/home', loadChildren: './features/home/home.module#Module' },
+    { path: 'screen/products', loadChildren: './features/products/products.module#ProductsModule' },
+    { path: 'screen/module1', loadChildren: './features/module1/module1.module#Module' },
+    { path: 'screen/module2', loadChildren: './features/module2/module2.module#Module' }
+];
+
+@NgModule({
+    imports: [
+        RouterModule.forRoot(routes),
+    ],
+})
+export class AppRoutingModule {}

package/lib/skeletons/web-symfony/myapp-web/src/app/app.component.ts

@@ -1,77 +1,77 @@
-import { Component, OnInit } from '@angular/core';
-import { TranslateService } from '@ngx-translate/core';
-import { Observable } from 'rxjs/Observable';
-import { Store } from '@ngrx/store';
-
-import { UserState, getUserState, UxLink, UxLanguage } from '@eui/core';
-
-@Component({
-    selector: 'app-root',
-    templateUrl: './app.component.html'
-})
-export class AppComponent implements OnInit {
-    userState: Observable<UserState>;
-
-    menuLinks: UxLink[] = [];
-    notificationLinks: UxLink[] = [];
-
-    constructor(
-        private translateService: TranslateService,
-        private store: Store<any>,
-    ) {
-    }
-
-    ngOnInit() {
-        this.userState = <any>this.store.select(getUserState);
-
-        this._createMenuLinks();
-        this._createNotifications();
-    }
-
-    onLanguageChanged(language: UxLanguage) {
-        this.translateService.use(language.code);
-    }
-
-    private _createMenuLinks() {
-        this.menuLinks = [
-            new UxLink(
-                {
-                    label: 'HOME', url: '/screen/home', isHome: true
-                }
-            ),
-            new UxLink(
-                {
-                    label: 'Module1', url: '/screen/module1', children: [
-                        new UxLink({ label: 'disabled item', disabled: true }),
-                        new UxLink({ label: 'Page 1', url: '/screen/module1/page1' }),
-                        new UxLink({ label: 'Page 2', url: '/screen/module1/page2' })
-                    ]
-                }
-            ),
-            new UxLink(
-                {
-                    label: 'Module2', url: '/screen/module2'
-                }
-            ),
-            new UxLink(
-                {
-                    label: 'Products', url: '/screen/products'
-                }
-            )
-        ];
-    }
-
-    private _createNotifications() {
-        this.notificationLinks = [
-            new UxLink(
-                { label: 'Notification title', subLabel: 'This is the description of the noficiation' }
-            ),
-            new UxLink(
-                { label: 'Notification title', subLabel: 'This is the description of the noficiation' }
-            ),
-            new UxLink(
-                 { label: 'Notification title', subLabel: 'This is the description of the noficiation' }
-            ),
-        ];
-    }
-}
+import { Component, OnInit } from '@angular/core';
+import { TranslateService } from '@ngx-translate/core';
+import { Observable } from 'rxjs/Observable';
+import { Store } from '@ngrx/store';
+
+import { UserState, getUserState, UxLink, UxLanguage } from '@eui/core';
+
+@Component({
+    selector: 'app-root',
+    templateUrl: './app.component.html'
+})
+export class AppComponent implements OnInit {
+    userState: Observable<UserState>;
+
+    menuLinks: UxLink[] = [];
+    notificationLinks: UxLink[] = [];
+
+    constructor(
+        private translateService: TranslateService,
+        private store: Store<any>,
+    ) {
+    }
+
+    ngOnInit() {
+        this.userState = <any>this.store.select(getUserState);
+
+        this._createMenuLinks();
+        this._createNotifications();
+    }
+
+    onLanguageChanged(language: UxLanguage) {
+        this.translateService.use(language.code);
+    }
+
+    private _createMenuLinks() {
+        this.menuLinks = [
+            new UxLink(
+                {
+                    label: 'HOME', url: '/screen/home', isHome: true
+                }
+            ),
+            new UxLink(
+                {
+                    label: 'Module1', url: '/screen/module1', children: [
+                        new UxLink({ label: 'disabled item', disabled: true }),
+                        new UxLink({ label: 'Page 1', url: '/screen/module1/page1' }),
+                        new UxLink({ label: 'Page 2', url: '/screen/module1/page2' })
+                    ]
+                }
+            ),
+            new UxLink(
+                {
+                    label: 'Module2', url: '/screen/module2'
+                }
+            ),
+            new UxLink(
+                {
+                    label: 'Products', url: '/screen/products'
+                }
+            )
+        ];
+    }
+
+    private _createNotifications() {
+        this.notificationLinks = [
+            new UxLink(
+                { label: 'Notification title', subLabel: 'This is the description of the noficiation' }
+            ),
+            new UxLink(
+                { label: 'Notification title', subLabel: 'This is the description of the noficiation' }
+            ),
+            new UxLink(
+                 { label: 'Notification title', subLabel: 'This is the description of the noficiation' }
+            ),
+        ];
+    }
+}

package/lib/skeletons/web-symfony/myapp-web/src/app/features/products/components/products.component.html

@@ -1,160 +1,160 @@
-<div class="page-title">
-    List of products
-</div>
-
-<div class="row">
-    <div class="col-sm-8">
-        <ux-panel label="List of Products" [isBlocked]="mode === 'load'" contentHeight="60vh">
-
-            <uxPanelHeaderRightContent>
-                <div class="flex-container">
-                    <ux-button-group [hasPairedIcon]="true" styleClass="ml-3" (clicked)="addItem()">
-                        <ux-button-group-item label="Create new product"></ux-button-group-item>
-                        <ux-button-group-item iconClass="fa fa-plus"></ux-button-group-item>
-                    </ux-button-group>
-                </div>
-            </uxPanelHeaderRightContent>
-
-
-            <ng-container *ngIf="products && mode !== 'load'; else loading">
-
-
-                <p-table [value]="products" [paginator]="true" [rows]="10" [pageLinks]="3" [rowsPerPageOptions]="[5,10,20]" >
-                    <ng-template pTemplate="header" let-columns>
-                        <tr>
-                            <th [pSortableColumn]="'productId'">ID <p-sortIcon [field]="'productId'"></p-sortIcon></th>
-                            <th [pSortableColumn]="'name'">Name <p-sortIcon [field]="'name'"></p-sortIcon></th>
-                            <th [pSortableColumn]="'price'">Price <p-sortIcon [field]="'price'"></p-sortIcon></th>
-                            <th [pSortableColumn]="'description'">Description <p-sortIcon [field]="'description'"></p-sortIcon></th>
-                            <th class="actionsColumn">ACTIONS</th>
-                        </tr>
-                    </ng-template>
-
-                    <ng-template pTemplate="body" let-rowData let-columns="columns" let-rowIndex="rowIndex" >
-                        <tr [pSelectableRow]="rowData" [pSelectableRowIndex]="rowIndex">
-                            <td>{{rowData.productId}}</td>
-                            <td>
-                                <ux-badge typeClass="default">
-                                    {{ rowData.name }}
-                                </ux-badge>
-                            </td>
-                            <td>{{rowData.price}}</td>
-                            <td>{{rowData.description}}</td>
-
-                            <td class="actionsColumn">
-                                <div class="flex-container justify-content-center">
-                                    <ux-button [isFlat]="true" iconClass="fa fa-pencil" typeClass="info" (click)="editProduct(rowData)"></ux-button>
-                                    <ux-button [isFlat]="true" iconClass="fa fa-trash-o" typeClass="danger" (click)="deleteProduct(rowData.productId)"></ux-button>
-                                </div>
-                            </td>
-                        </tr>
-                    </ng-template>
-
-
-                </p-table>
-            </ng-container>
-
-
-
-            <ng-template #loading>
-                <ng-container *ngIf="! serviceError; else error">
-                    Loading...
-                </ng-container>
-            </ng-template>
-
-            <ng-template #error>
-                <ux-alert typeClass="warning">
-                    Unable to retrieve the list of products; please <a (click)="loadProducts()">try again</a> later.<br/>
-                    If the problem persists, please contact the administrator.<br/>
-                    <br/>
-                    <a (click)="serviceErrorVisible = !serviceErrorVisible">
-                        <span *ngIf="!serviceErrorVisible">Show technical reason</span>
-                        <span *ngIf="serviceErrorVisible">Hide technical reason</span>
-                    </a>
-                    <pre *ngIf="serviceErrorVisible">{{serviceError.message}}</pre>
-                </ux-alert>
-            </ng-template>
-        </ux-panel>
-    </div>
-
-    <div class="col-sm-4">
-            <ux-panel label="Products" [isBlocked]="mode === 'load'" contentHeight="60vh">
-                <pre>{{products | json}}</pre>
-            </ux-panel>
-    </div>
-</div>
-
-
-
-<!-- MODAL EDIT / NEW-->
-<ux-modal id="modal1b" titleLabel="{{actionLabel}}" [isFooterVisible]="false" [isSizeSmall]="true" (onDismiss)="onModalDismiss($event)" (onAccept)="onModalAccept($event)">
-    <uxModalBody>
-        <form [formGroup]="formInput" *ngIf="ItemSelected">
-                <div class="row">
-                    <div class="col-10">
-                        <ux-form-group label="Name:" isRequired="true">
-                            <ux-form-control  [(ngModel)]="ItemSelected.name" formControlName="name" placeholderLabel="es: iPad Pro 512GB" ></ux-form-control>
-                        </ux-form-group>
-
-                        <ux-form-group label="Price:" isRequired="true">
-                            <ux-form-control [(ngModel)]="ItemSelected.price"  [isNumber]="true" formControlName="price" placeholderLabel="price"></ux-form-control>
-                        </ux-form-group>
-
-
-                        <ux-form-group label="Description:" isRequired=true>
-                            <ux-form-control [(ngModel)]="ItemSelected.description" [isTextarea]="true" formControlName="description" placeholderLabel="description"></ux-form-control>
-                        </ux-form-group>
-
-                        <div class="text-right mt-3">
-                                <ux-button (click)="onUpdateSubmit(ItemSelected)"    class='ml-3' [isDisabled]="!formInput.valid">
-                                        Update Product
-                                </ux-button>
-                        </div>
-
-                    </div>
-                </div>
-        </form>
-
-
-        <form [formGroup]="formInput" *ngIf="!ItemSelected">
-                <div class="row">
-                    <div class="col-10">
-                        <ux-form-group label="Name:" isRequired="true">
-                            <ux-form-control  formControlName="name" placeholderLabel="es: iPad Pro 512GB" ></ux-form-control>
-                        </ux-form-group>
-
-                        <ux-form-group label="Price:" isRequired="true">
-                            <ux-form-control   [isNumber]="true" formControlName="price" placeholderLabel="price"></ux-form-control>
-                        </ux-form-group>
-
-
-                        <ux-form-group label="Description:" isRequired=true>
-                            <ux-form-control [isTextarea]="true" formControlName="description" placeholderLabel="description"></ux-form-control>
-                        </ux-form-group>
-
-                        <div class="text-right mt-3">
-                                <ux-button (click)="onSubmit()"    class='ml-3' [isDisabled]="!formInput.valid">
-                                        Save Product
-                                </ux-button>
-                        </div>
-
-                    </div>
-                </div>
-        </form>
-
-
-
-
-    </uxModalBody>
-</ux-modal>
-
-
-<!-- MODAL DELETE -->
-<ux-modal id="modaldelete" titleLabel="Modal title" [isSizeSmall]="true"
-    [isHandleCloseOnDismiss]="false" [isHandleCloseOnAccept]="false" [isHandleCloseOnClose]="false"
-    (onDismiss)="onModalDismiss($event)" (onAccept)="onModalAccept($event)" (onClose)="onModalClose($event)">
-    <uxModalBody>
-        <p>Are you sure to delete it?</p>
-    </uxModalBody>
-</ux-modal>
-
+<div class="page-title">
+    List of products
+</div>
+
+<div class="row">
+    <div class="col-sm-8">
+        <ux-panel label="List of Products" [isBlocked]="mode === 'load'" contentHeight="60vh">
+
+            <uxPanelHeaderRightContent>
+                <div class="flex-container">
+                    <ux-button-group [hasPairedIcon]="true" styleClass="ml-3" (clicked)="addItem()">
+                        <ux-button-group-item label="Create new product"></ux-button-group-item>
+                        <ux-button-group-item iconClass="fa fa-plus"></ux-button-group-item>
+                    </ux-button-group>
+                </div>
+            </uxPanelHeaderRightContent>
+
+
+            <ng-container *ngIf="products && mode !== 'load'; else loading">
+
+
+                <p-table [value]="products" [paginator]="true" [rows]="10" [pageLinks]="3" [rowsPerPageOptions]="[5,10,20]" >
+                    <ng-template pTemplate="header" let-columns>
+                        <tr>
+                            <th [pSortableColumn]="'productId'">ID <p-sortIcon [field]="'productId'"></p-sortIcon></th>
+                            <th [pSortableColumn]="'name'">Name <p-sortIcon [field]="'name'"></p-sortIcon></th>
+                            <th [pSortableColumn]="'price'">Price <p-sortIcon [field]="'price'"></p-sortIcon></th>
+                            <th [pSortableColumn]="'description'">Description <p-sortIcon [field]="'description'"></p-sortIcon></th>
+                            <th class="actionsColumn">ACTIONS</th>
+                        </tr>
+                    </ng-template>
+
+                    <ng-template pTemplate="body" let-rowData let-columns="columns" let-rowIndex="rowIndex" >
+                        <tr [pSelectableRow]="rowData" [pSelectableRowIndex]="rowIndex">
+                            <td>{{rowData.productId}}</td>
+                            <td>
+                                <ux-badge typeClass="default">
+                                    {{ rowData.name }}
+                                </ux-badge>
+                            </td>
+                            <td>{{rowData.price}}</td>
+                            <td>{{rowData.description}}</td>
+
+                            <td class="actionsColumn">
+                                <div class="flex-container justify-content-center">
+                                    <ux-button [isFlat]="true" iconClass="fa fa-pencil" typeClass="info" (click)="editProduct(rowData)"></ux-button>
+                                    <ux-button [isFlat]="true" iconClass="fa fa-trash-o" typeClass="danger" (click)="deleteProduct(rowData.productId)"></ux-button>
+                                </div>
+                            </td>
+                        </tr>
+                    </ng-template>
+
+
+                </p-table>
+            </ng-container>
+
+
+
+            <ng-template #loading>
+                <ng-container *ngIf="! serviceError; else error">
+                    Loading...
+                </ng-container>
+            </ng-template>
+
+            <ng-template #error>
+                <ux-alert typeClass="warning">
+                    Unable to retrieve the list of products; please <a (click)="loadProducts()">try again</a> later.<br/>
+                    If the problem persists, please contact the administrator.<br/>
+                    <br/>
+                    <a (click)="serviceErrorVisible = !serviceErrorVisible">
+                        <span *ngIf="!serviceErrorVisible">Show technical reason</span>
+                        <span *ngIf="serviceErrorVisible">Hide technical reason</span>
+                    </a>
+                    <pre *ngIf="serviceErrorVisible">{{serviceError.message}}</pre>
+                </ux-alert>
+            </ng-template>
+        </ux-panel>
+    </div>
+
+    <div class="col-sm-4">
+            <ux-panel label="Products" [isBlocked]="mode === 'load'" contentHeight="60vh">
+                <pre>{{products | json}}</pre>
+            </ux-panel>
+    </div>
+</div>
+
+
+
+<!-- MODAL EDIT / NEW-->
+<ux-modal id="modal1b" titleLabel="{{actionLabel}}" [isFooterVisible]="false" [isSizeSmall]="true" (onDismiss)="onModalDismiss($event)" (onAccept)="onModalAccept($event)">
+    <uxModalBody>
+        <form [formGroup]="formInput" *ngIf="ItemSelected">
+                <div class="row">
+                    <div class="col-10">
+                        <ux-form-group label="Name:" isRequired="true">
+                            <ux-form-control  [(ngModel)]="ItemSelected.name" formControlName="name" placeholderLabel="es: iPad Pro 512GB" ></ux-form-control>
+                        </ux-form-group>
+
+                        <ux-form-group label="Price:" isRequired="true">
+                            <ux-form-control [(ngModel)]="ItemSelected.price"  [isNumber]="true" formControlName="price" placeholderLabel="price"></ux-form-control>
+                        </ux-form-group>
+
+
+                        <ux-form-group label="Description:" isRequired=true>
+                            <ux-form-control [(ngModel)]="ItemSelected.description" [isTextarea]="true" formControlName="description" placeholderLabel="description"></ux-form-control>
+                        </ux-form-group>
+
+                        <div class="text-right mt-3">
+                                <ux-button (click)="onUpdateSubmit(ItemSelected)"    class='ml-3' [isDisabled]="!formInput.valid">
+                                        Update Product
+                                </ux-button>
+                        </div>
+
+                    </div>
+                </div>
+        </form>
+
+
+        <form [formGroup]="formInput" *ngIf="!ItemSelected">
+                <div class="row">
+                    <div class="col-10">
+                        <ux-form-group label="Name:" isRequired="true">
+                            <ux-form-control  formControlName="name" placeholderLabel="es: iPad Pro 512GB" ></ux-form-control>
+                        </ux-form-group>
+
+                        <ux-form-group label="Price:" isRequired="true">
+                            <ux-form-control   [isNumber]="true" formControlName="price" placeholderLabel="price"></ux-form-control>
+                        </ux-form-group>
+
+
+                        <ux-form-group label="Description:" isRequired=true>
+                            <ux-form-control [isTextarea]="true" formControlName="description" placeholderLabel="description"></ux-form-control>
+                        </ux-form-group>
+
+                        <div class="text-right mt-3">
+                                <ux-button (click)="onSubmit()"    class='ml-3' [isDisabled]="!formInput.valid">
+                                        Save Product
+                                </ux-button>
+                        </div>
+
+                    </div>
+                </div>
+        </form>
+
+
+
+
+    </uxModalBody>
+</ux-modal>
+
+
+<!-- MODAL DELETE -->
+<ux-modal id="modaldelete" titleLabel="Modal title" [isSizeSmall]="true"
+    [isHandleCloseOnDismiss]="false" [isHandleCloseOnAccept]="false" [isHandleCloseOnClose]="false"
+    (onDismiss)="onModalDismiss($event)" (onAccept)="onModalAccept($event)" (onClose)="onModalClose($event)">
+    <uxModalBody>
+        <p>Are you sure to delete it?</p>
+    </uxModalBody>
+</ux-modal>
+