feat(project): delete dependancy to primeng

This commit is contained in:
thomas
2023-11-10 15:27:04 +01:00
parent e57a2aaecb
commit 986b3e1bb6
20 changed files with 266 additions and 61 deletions

View File

@@ -4,24 +4,7 @@
"overrides": [
{
"files": ["*.ts"],
"rules": {
"@angular-eslint/directive-selector": [
"error",
{
"type": "attribute",
"prefix": "app",
"style": "camelCase"
}
],
"@angular-eslint/component-selector": [
"error",
{
"type": "element",
"prefix": "app",
"style": "kebab-case"
}
]
},
"rules": {},
"extends": [
"plugin:@nx/angular",
"plugin:@angular-eslint/template/process-inline-templates"

View File

@@ -19,12 +19,7 @@
"apps/angular/di/src/favicon.ico",
"apps/angular/di/src/assets"
],
"styles": [
"apps/angular/di/src/styles.scss",
"node_modules/primeicons/primeicons.css",
"node_modules/primeng/resources/themes/lara-light-blue/theme.css",
"node_modules/primeng/resources/primeng.min.css"
],
"styles": ["apps/angular/di/src/styles.scss"],
"scripts": []
},
"configurations": {

View File

@@ -1,7 +1,6 @@
/* eslint-disable @angular-eslint/directive-selector */
import { TableComponent } from '@angular-challenges/angular/di';
import { AsyncPipe, NgFor } from '@angular/common';
import { Component, Directive } from '@angular/core';
import { TableModule } from 'primeng/table';
import { CurrencyPipe } from './currency.pipe';
import { CurrencyService } from './currency.service';
import { Product, products } from './product.model';
@@ -11,7 +10,7 @@ interface ProductContext {
}
@Directive({
selector: 'ng-template[pTemplate="body"]',
selector: 'ng-template[product]',
standalone: true,
})
export class ProductDirective {
@@ -25,19 +24,19 @@ export class ProductDirective {
@Component({
standalone: true,
imports: [TableModule, CurrencyPipe, AsyncPipe, NgFor, ProductDirective],
imports: [TableComponent, CurrencyPipe, AsyncPipe, NgFor, ProductDirective],
providers: [CurrencyService],
selector: 'app-root',
template: `
<p-table [value]="products">
<ng-template pTemplate="header">
<table [items]="products">
<ng-template #header>
<tr>
<th *ngFor="let col of displayedColumns">
{{ col }}
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-product>
<ng-template #body product let-product>
<tr>
<td>{{ product.name }}</td>
<td>{{ product.priceA | currency | async }}</td>
@@ -45,7 +44,7 @@ export class ProductDirective {
<td>{{ product.priceC | currency | async }}</td>
</tr>
</ng-template>
</p-table>
</table>
`,
})
export class AppComponent {

View File

@@ -1 +1,21 @@
/* You can add global styles to this file, and also import other style files */
table {
width: 100%;
}
table thead > tr > th {
text-align: left;
padding: 1rem 1rem;
border: 1px solid #dee2e6;
border-width: 0 0 1px 0;
font-weight: 700;
color: #343a40;
background: #f8f9fa;
transition: box-shadow 0.2s;
}
table tbody > tr > td {
text-align: left;
border: 1px solid #dee2e6;
border-width: 0 0 1px 0;
padding: 1rem 1rem;
}

View File

@@ -0,0 +1,26 @@
{
"extends": ["../../../.eslintrc.json"],
"ignorePatterns": ["!**/*"],
"overrides": [
{
"files": ["*.ts"],
"extends": [
"plugin:@nx/angular",
"plugin:@angular-eslint/template/process-inline-templates"
],
"rules": {}
},
{
"files": ["*.html"],
"extends": ["plugin:@nx/angular-template"],
"rules": {}
},
{
"files": ["*.json"],
"parser": "jsonc-eslint-parser",
"rules": {
"@nx/dependency-checks": "error"
}
}
]
}

View File

@@ -0,0 +1,7 @@
# angular/di
This library was generated with [Nx](https://nx.dev).
## Running unit tests
Run `nx test angular/di` to execute the unit tests.

View File

@@ -0,0 +1,22 @@
/* eslint-disable */
export default {
displayName: 'angular/di',
preset: '../../../jest.preset.js',
setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
coverageDirectory: '../../../coverage/libs/angular/di',
transform: {
'^.+\\.(ts|mjs|js|html)$': [
'jest-preset-angular',
{
tsconfig: '<rootDir>/tsconfig.spec.json',
stringifyContentPathRegex: '\\.(html|svg)$',
},
],
},
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
snapshotSerializers: [
'jest-preset-angular/build/serializers/no-ng-attributes',
'jest-preset-angular/build/serializers/ng-snapshot',
'jest-preset-angular/build/serializers/html-comment',
],
};

View File

@@ -0,0 +1,7 @@
{
"$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
"dest": "../../../dist/libs/angular/di",
"lib": {
"entryFile": "src/index.ts"
}
}

View File

@@ -0,0 +1,12 @@
{
"name": "angular/di",
"version": "0.0.1",
"peerDependencies": {
"@angular/common": "^16.2.0",
"@angular/core": "^16.2.0"
},
"dependencies": {
"tslib": "^2.3.0"
},
"sideEffects": false
}

View File

@@ -0,0 +1,51 @@
{
"name": "angular/di",
"$schema": "../../../node_modules/nx/schemas/project-schema.json",
"sourceRoot": "libs/angular/di/src",
"prefix": "lib",
"tags": [],
"projectType": "library",
"targets": {
"build": {
"executor": "@nx/angular:ng-packagr-lite",
"outputs": ["{workspaceRoot}/dist/{projectRoot}"],
"options": {
"project": "libs/angular/di/ng-package.json"
},
"configurations": {
"production": {
"tsConfig": "libs/angular/di/tsconfig.lib.prod.json"
},
"development": {
"tsConfig": "libs/angular/di/tsconfig.lib.json"
}
},
"defaultConfiguration": "production"
},
"test": {
"executor": "@nx/jest:jest",
"outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
"options": {
"jestConfig": "libs/angular/di/jest.config.ts",
"passWithNoTests": true
},
"configurations": {
"ci": {
"ci": true,
"codeCoverage": true
}
}
},
"lint": {
"executor": "@nx/eslint:lint",
"outputs": ["{options.outputFile}"],
"options": {
"lintFilePatterns": [
"libs/angular/di/**/*.ts",
"libs/angular/di/**/*.html",
"libs/angular/di/package.json"
]
}
}
}
}

View File

@@ -0,0 +1 @@
export { TableComponent } from './lib/table.component';

View File

@@ -0,0 +1,29 @@
import { NgFor, NgTemplateOutlet } from '@angular/common';
import { Component, ContentChild, Input, TemplateRef } from '@angular/core';
@Component({
selector: 'table',
standalone: true,
imports: [NgTemplateOutlet, NgFor],
template: `
<thead>
<ng-container *ngTemplateOutlet="headerTemplate"></ng-container>
</thead>
<tbody *ngFor="let item of items">
<ng-container
*ngTemplateOutlet="
bodyTemplate;
context: { $implicit: item }
"></ng-container>
</tbody>
`,
})
export class TableComponent<T> {
@Input() items!: T[];
@ContentChild('header', { read: TemplateRef })
headerTemplate!: TemplateRef<void>;
@ContentChild('body', { read: TemplateRef })
bodyTemplate!: TemplateRef<{ $implicit: T }>;
}

View File

@@ -0,0 +1,8 @@
// @ts-expect-error https://thymikee.github.io/jest-preset-angular/docs/getting-started/test-environment
globalThis.ngJest = {
testEnvironmentOptions: {
errorOnUnknownElements: true,
errorOnUnknownProperties: true,
},
};
import 'jest-preset-angular/setup-jest';

View File

@@ -0,0 +1,29 @@
{
"compilerOptions": {
"target": "es2022",
"useDefineForClassFields": false,
"forceConsistentCasingInFileNames": true,
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true
},
"files": [],
"include": [],
"references": [
{
"path": "./tsconfig.lib.json"
},
{
"path": "./tsconfig.spec.json"
}
],
"extends": "../../../tsconfig.base.json",
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": true
}
}

View File

@@ -0,0 +1,17 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "../../../dist/out-tsc",
"declaration": true,
"declarationMap": true,
"inlineSources": true,
"types": []
},
"exclude": [
"src/**/*.spec.ts",
"src/test-setup.ts",
"jest.config.ts",
"src/**/*.test.ts"
],
"include": ["src/**/*.ts"]
}

View File

@@ -0,0 +1,7 @@
{
"extends": "./tsconfig.lib.json",
"compilerOptions": {
"declarationMap": false
},
"angularCompilerOptions": {}
}

View File

@@ -0,0 +1,16 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "../../../dist/out-tsc",
"module": "commonjs",
"target": "es2016",
"types": ["jest", "node"]
},
"files": ["src/test-setup.ts"],
"include": [
"jest.config.ts",
"src/**/*.test.ts",
"src/**/*.spec.ts",
"src/**/*.d.ts"
]
}

23
package-lock.json generated
View File

@@ -7,7 +7,6 @@
"": {
"name": "angular-challenges",
"version": "0.0.0",
"hasInstallScript": true,
"license": "MIT",
"dependencies": {
"@angular/animations": "~16.2.0",
@@ -32,8 +31,6 @@
"@rx-angular/state": "^1.7.0",
"@rx-angular/template": "^1.0.0-rc.5",
"@swc/helpers": "0.5.3",
"primeicons": "6.0.1",
"primeng": "16.0.2",
"rxjs": "7.8.1",
"tailwindcss": "^3.2.1",
"tslib": "^2.3.0",
@@ -24564,26 +24561,6 @@
"url": "https://github.com/chalk/ansi-styles?sponsor=1"
}
},
"node_modules/primeicons": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/primeicons/-/primeicons-6.0.1.tgz",
"integrity": "sha512-KDeO94CbWI4pKsPnYpA1FPjo79EsY9I+M8ywoPBSf9XMXoe/0crjbUK7jcQEDHuc0ZMRIZsxH3TYLv4TUtHmAA=="
},
"node_modules/primeng": {
"version": "16.0.2",
"resolved": "https://registry.npmjs.org/primeng/-/primeng-16.0.2.tgz",
"integrity": "sha512-gLFUSQ0fV5948yM1fMCv9oGaJ54AS8+HHSMOeR2lHWFiZzomxjXR0MST9yyAQ0NjrOlhke3BBpl+zYjISBeEJg==",
"dependencies": {
"tslib": "^2.3.0"
},
"peerDependencies": {
"@angular/common": "^16.0.0",
"@angular/core": "^16.0.0",
"@angular/forms": "^16.0.0",
"rxjs": "^6.0.0 || ^7.8.1",
"zone.js": "~0.13.0"
}
},
"node_modules/proc-log": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/proc-log/-/proc-log-3.0.0.tgz",

View File

@@ -34,8 +34,6 @@
"@rx-angular/state": "^1.7.0",
"@rx-angular/template": "^1.0.0-rc.5",
"@swc/helpers": "0.5.3",
"primeicons": "6.0.1",
"primeng": "16.0.2",
"rxjs": "7.8.1",
"tailwindcss": "^3.2.1",
"tslib": "^2.3.0",
@@ -58,6 +56,7 @@
"@ngrx/schematics": "16.0.0",
"@nx/cypress": "17.0.1",
"@nx/devkit": "17.0.1",
"@nx/eslint": "17.0.1",
"@nx/eslint-plugin": "17.0.1",
"@nx/jest": "17.0.1",
"@nx/js": "17.0.1",
@@ -97,8 +96,7 @@
"testing-library-selector": "^0.2.1",
"ts-jest": "29.1.0",
"ts-node": "10.9.1",
"typescript": "5.1.6",
"@nx/eslint": "17.0.1"
"typescript": "5.1.6"
},
"lint-staged": {
"*.{ts,json,md}": [

View File

@@ -75,7 +75,8 @@
],
"@tomalaforge/ngrx-callstate-store": [
"libs/shared/ngrx-callstate-store/src/index.ts"
]
],
"@angular-challenges/angular/di": ["libs/angular/di/src/index.ts"]
}
},
"exclude": ["node_modules", "tmp"]