diff --git a/.github/workflows/commit-lint.yml b/.github/workflows/commit-lint.yml index 461d9f32..943f723d 100644 --- a/.github/workflows/commit-lint.yml +++ b/.github/workflows/commit-lint.yml @@ -17,6 +17,6 @@ jobs: fetch-depth: 0 - uses: actions/setup-node@v3 with: - node-version: 18 + node-version: 20 - run: npm install @commitlint/config-conventional @commitlint/cli - run: npx commitlint --from HEAD~${{ github.event.pull_request.commits }} --to HEAD diff --git a/.github/workflows/publish-release.yml b/.github/workflows/publish-release.yml index 0cde3525..bf3f67b7 100644 --- a/.github/workflows/publish-release.yml +++ b/.github/workflows/publish-release.yml @@ -26,7 +26,7 @@ jobs: - name: Setup Node.js uses: actions/setup-node@v3 with: - node-version: 18 + node-version: 20 - name: Install dependencies run: npm ci - name: Verify the integrity of provenance attestations and registry signatures for installed dependencies diff --git a/.github/workflows/run-tests.yml b/.github/workflows/run-tests.yml index 5370df4a..185fe424 100644 --- a/.github/workflows/run-tests.yml +++ b/.github/workflows/run-tests.yml @@ -18,7 +18,7 @@ jobs: - uses: actions/setup-node@v3 with: - node-version: 18 + node-version: 20 - run: npm ci - run: npm run build - run: npm run build:lib diff --git a/.github/workflows/update-docs.yml b/.github/workflows/update-docs.yml index 284167ba..5d08f7fb 100644 --- a/.github/workflows/update-docs.yml +++ b/.github/workflows/update-docs.yml @@ -21,7 +21,7 @@ jobs: - name: Setup Node.js uses: actions/setup-node@v3 with: - node-version: 18 + node-version: 20 - name: Git config run: | git config user.name "${GITHUB_ACTOR}" diff --git a/.husky/commit-msg b/.husky/commit-msg index c160a771..0398b7a8 100644 --- a/.husky/commit-msg +++ b/.husky/commit-msg @@ -1,4 +1 @@ -#!/usr/bin/env sh -. "$(dirname -- "$0")/_/husky.sh" - npx --no -- commitlint --edit ${1} diff --git a/.husky/pre-commit b/.husky/pre-commit index d24fdfc6..2312dc58 100644 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,4 +1 @@ -#!/usr/bin/env sh -. "$(dirname -- "$0")/_/husky.sh" - npx lint-staged diff --git a/release.config.js b/.releaserc.js similarity index 100% rename from release.config.js rename to .releaserc.js diff --git a/.vscode/extensions.json b/.vscode/extensions.json new file mode 100644 index 00000000..835cacf7 --- /dev/null +++ b/.vscode/extensions.json @@ -0,0 +1,4 @@ +{ + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846 + "recommendations": ["angular.ng-template", "cyrilletuzi.angular-schematics", "esbenp.prettier-vscode", "dbaeumer.vscode-eslint", "vivaxy.vscode-conventional-commits"] +} diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 00000000..925af837 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,20 @@ +{ + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "name": "ng serve", + "type": "chrome", + "request": "launch", + "preLaunchTask": "npm: start", + "url": "http://localhost:4200/" + }, + { + "name": "ng test", + "type": "chrome", + "request": "launch", + "preLaunchTask": "npm: test", + "url": "http://localhost:9876/debug.html" + } + ] +} diff --git a/.vscode/tasks.json b/.vscode/tasks.json new file mode 100644 index 00000000..a298b5bd --- /dev/null +++ b/.vscode/tasks.json @@ -0,0 +1,42 @@ +{ + // For more information, visit: https://go.microsoft.com/fwlink/?LinkId=733558 + "version": "2.0.0", + "tasks": [ + { + "type": "npm", + "script": "start", + "isBackground": true, + "problemMatcher": { + "owner": "typescript", + "pattern": "$tsc", + "background": { + "activeOnStart": true, + "beginsPattern": { + "regexp": "(.*?)" + }, + "endsPattern": { + "regexp": "bundle generation complete" + } + } + } + }, + { + "type": "npm", + "script": "test", + "isBackground": true, + "problemMatcher": { + "owner": "typescript", + "pattern": "$tsc", + "background": { + "activeOnStart": true, + "beginsPattern": { + "regexp": "(.*?)" + }, + "endsPattern": { + "regexp": "bundle generation complete" + } + } + } + } + ] +} diff --git a/README.md b/README.md index e3e82659..91db9e1f 100644 --- a/README.md +++ b/README.md @@ -26,25 +26,14 @@
+ + _⚠️ Attenzione: questo codice è ancora in fase di sviluppo e non è pronto per essere utilizzato! Stiamo lavorando all'aggiornamento per portare il kit alla versione 1.0.0, commenti e contributi di tutta la community sono più che benvenuti! Se si necessita della vecchia versione il codice e la sua documentazione possono essere reperiti [qua](https://github.com/italia/design-angular-kit/tree/0.x)._ @@ -69,7 +58,7 @@ Sul branch `main` potete trovare il codice dei lavori in corso e nella [mileston - [Discussione sulla nuova release](https://github.com/italia/design-angular-kit/discussions/127) - [Milestone 1.0.0](https://github.com/italia/design-angular-kit/milestone/3) -## Come iniziare +## Installazione Design Angular Kit è disponibile su NPM, per installarlo su una applicazione esistente sulla quale provare la libreria (attualmente non stabile) esegui il comando @@ -77,66 +66,128 @@ Design Angular Kit è disponibile su NPM, per installarlo su una applicazione es npm install design-angular-kit@prerelease --save ``` -Procedi a registrare `DesignAngularKitModule` nel tuo **app.module.ts**. +Scegli la versione corrispondente alla tua versione Angular: + +| Angular | design-angular-kit | +|---------|-----------------------| +| 17+ | v1.0.0-prerelease.2 + | +| 16+ | v1.0.0-17 + | +| 15+ | v1.0.0-2 + | + +## Configurazione + +### Configurazione app + +La libreria `design-angular-kit` può essere utilizzata con i componenti _standalone_ o con l'applicazione che utilizza i moduli. Segui la sezione di +configurazione che corrisponde alla tua applicazione. + +#### Applicazione standalone + +Utilizza la funzione `provideDesignAngularKit` nella configurazione dell'applicazione `ApplicationConfig` per +poter inizializzare le funzionalità della libreria. ```typescript -import {DesignAngularKitModule, ItComponentsModule} from 'design-angular-kit'; +import { provideHttpClient } from '@angular/common/http'; +import { provideAnimations } from '@angular/platform-browser/animations'; +import { provideDesignAngularKit } from 'design-angular-kit'; + +export const appConfig: ApplicationConfig = { + providers: [ + ... + provideAnimations(), // Necessario per il funzionamento della libreria + provideHttpClient(), // Necessario per il funzionamento della libreria + provideDesignAngularKit(), + ] +} +``` + +#### Applicazione modulare + +È necessario importare `DesignAngularKitModule` all'interno del modulo principale dell'applicazione (solitamente denominato **AppModule**) +utilizzando il metodo `forRoot` per poter inizializzare le funzionalità della libreria e importare tutti i componenti. + +```typescript +import { HttpClientModule } from '@angular/common/http'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { DesignAngularKitModule } from 'design-angular-kit'; @NgModule({ imports: [ ... - DesignAngularKitModule, - ItComponentsModule // importa tutti i componenti della libreria + HttpClientModule, // Necessario per il funzionamento della libreria + BrowserAnimationsModule, // Necessario per il funzionamento della libreria + DesignAngularKitModule.forRoot() ] }) +export class AppModule { } ``` -