Merged PR 2035: fix(utils-positive-integer-input, crm-customer-booking, crm-customer-card): a...

fix(utils-positive-integer-input, crm-customer-booking, crm-customer-card): add missing path mapping in tsconfig

Add the @isa/utils/positive-integer-input path mapping to tsconfig.base.json
to resolve module resolution issues. The library was created but the path
alias was not properly registered, causing import errors in consuming modules.

Ref: #5492

libs/crm/feature/customer-booking/src/lib/crm-feature-customer-booking/crm-feature-customer-booking.component.html

@@ -30,9 +30,13 @@
           name="points"
           placeholder="Punkte"
           type="number"
+          positiveIntegerInput
           [ngModel]="points()"
           (ngModelChange)="points.set($event)"
-          min="0"
+          min="1"
+          step="1"
+          pattern="[1-9][0-9]*"
+          inputmode="numeric"
           data-what="input"
           data-which="points"
           class="w-20 isa-text-body-2-bold bg-isa-neutral-200 placeholder:isa-text-body-2-regular placeholder:text-isa-neutral-500 text-isa-neutral-900 focus:outline-none px-4 text-right border-none"

libs/crm/feature/customer-booking/src/lib/crm-feature-customer-booking/crm-feature-customer-booking.component.ts

@@ -8,6 +8,7 @@ import {
   OnDestroy,
 } from '@angular/core';
 import { FormsModule } from '@angular/forms';
+import { PositiveIntegerInputDirective } from '@isa/utils/positive-integer-input';
 import { ButtonComponent } from '@isa/ui/buttons';
 import {
   CustomerBookingReasonsResource,
@@ -29,6 +30,7 @@ import { TooltipIconComponent } from '@isa/ui/tooltip';
   selector: 'crm-customer-booking',
   imports: [
     FormsModule,
+    PositiveIntegerInputDirective,
     ButtonComponent,
     DropdownButtonComponent,
     DropdownOptionComponent,

libs/crm/feature/customer-card-transactions/src/lib/crm-feature-customer-card-transactions/crm-feature-customer-card-transactions.component.html

@@ -57,7 +57,11 @@
           @if (t.type === 'BURN' && t.amount >= 0) {
             -
           }
-          {{ t.amount || 0 | number: '1.2-2' : 'de-DE' }} EUR
+          {{
+            t.amount
+              ? (t.amount || 0 | number: '1.2-2' : 'de-DE') + ' EUR'
+              : '-'
+          }}
         </td>
       </ng-container>
 

libs/utils/positive-integer-input/README.md

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

libs/utils/positive-integer-input/eslint.config.cjs

@@ -0,0 +1,34 @@
+const nx = require('@nx/eslint-plugin');
+const baseConfig = require('../../../eslint.config.js');
+
+module.exports = [
+  ...baseConfig,
+  ...nx.configs['flat/angular'],
+  ...nx.configs['flat/angular-template'],
+  {
+    files: ['**/*.ts'],
+    rules: {
+      '@angular-eslint/directive-selector': [
+        'error',
+        {
+          type: 'attribute',
+          prefix: 'lib',
+          style: 'camelCase',
+        },
+      ],
+      '@angular-eslint/component-selector': [
+        'error',
+        {
+          type: 'element',
+          prefix: 'lib',
+          style: 'kebab-case',
+        },
+      ],
+    },
+  },
+  {
+    files: ['**/*.html'],
+    // Override or add rules here
+    rules: {},
+  },
+];

libs/utils/positive-integer-input/project.json

@@ -0,0 +1,20 @@
+{
+  "name": "utils-positive-integer-input",
+  "$schema": "../../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "libs/utils/positive-integer-input/src",
+  "prefix": "lib",
+  "projectType": "library",
+  "tags": [],
+  "targets": {
+    "test": {
+      "executor": "@nx/vite:test",
+      "outputs": ["{options.reportsDirectory}"],
+      "options": {
+        "reportsDirectory": "../../../coverage/libs/utils/positive-integer-input"
+      }
+    },
+    "lint": {
+      "executor": "@nx/eslint:lint"
+    }
+  }
+}

libs/utils/positive-integer-input/src/index.ts

@@ -0,0 +1 @@
+export * from './lib/positive-integer-input.directive';

libs/utils/positive-integer-input/src/lib/positive-integer-input.directive.ts

@@ -0,0 +1,25 @@
+import { Directive, HostListener } from '@angular/core';
+
+/**
+ * Directive that prevents non-numeric input in number input fields.
+ * Blocks: decimal points (. and ,), negative signs (-), plus signs (+), and exponential notation (e, E)
+ *
+ * Usage:
+ * ```html
+ * <input type="number" positiveIntegerInput />
+ * ```
+ */
+@Directive({
+  selector: 'input[type="number"][positiveIntegerInput]',
+  standalone: true,
+})
+export class PositiveIntegerInputDirective {
+  private readonly blockedKeys = new Set(['.', ',', '-', '+', 'e', 'E']);
+
+  @HostListener('keydown', ['$event'])
+  onKeyDown(event: KeyboardEvent): void {
+    if (this.blockedKeys.has(event.key)) {
+      event.preventDefault();
+    }
+  }
+}

libs/utils/positive-integer-input/src/test-setup.ts

@@ -0,0 +1,13 @@
+import '@angular/compiler';
+import '@analogjs/vitest-angular/setup-zone';
+
+import {
+  BrowserTestingModule,
+  platformBrowserTesting,
+} from '@angular/platform-browser/testing';
+import { getTestBed } from '@angular/core/testing';
+
+getTestBed().initTestEnvironment(
+  BrowserTestingModule,
+  platformBrowserTesting(),
+);

libs/utils/positive-integer-input/tsconfig.json

@@ -0,0 +1,30 @@
+{
+  "extends": "../../../tsconfig.base.json",
+  "compilerOptions": {
+    "importHelpers": true,
+    "moduleResolution": "bundler",
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    "module": "preserve"
+  },
+  "angularCompilerOptions": {
+    "enableI18nLegacyMessageIdFormat": false,
+    "strictInjectionParameters": true,
+    "strictInputAccessModifiers": true,
+    "typeCheckHostBindings": true,
+    "strictTemplates": true
+  },
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}

libs/utils/positive-integer-input/tsconfig.lib.json

@@ -0,0 +1,27 @@
+{
+  "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",
+    "vite.config.ts",
+    "vite.config.mts",
+    "vitest.config.ts",
+    "vitest.config.mts",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.tsx",
+    "src/**/*.test.js",
+    "src/**/*.spec.js",
+    "src/**/*.test.jsx",
+    "src/**/*.spec.jsx"
+  ],
+  "include": ["src/**/*.ts"]
+}

libs/utils/positive-integer-input/tsconfig.spec.json

@@ -0,0 +1,29 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../../dist/out-tsc",
+    "types": [
+      "vitest/globals",
+      "vitest/importMeta",
+      "vite/client",
+      "node",
+      "vitest"
+    ]
+  },
+  "include": [
+    "vite.config.ts",
+    "vite.config.mts",
+    "vitest.config.ts",
+    "vitest.config.mts",
+    "src/**/*.test.ts",
+    "src/**/*.spec.ts",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.tsx",
+    "src/**/*.test.js",
+    "src/**/*.spec.js",
+    "src/**/*.test.jsx",
+    "src/**/*.spec.jsx",
+    "src/**/*.d.ts"
+  ],
+  "files": ["src/test-setup.ts"]
+}

libs/utils/positive-integer-input/vite.config.mts

@@ -0,0 +1,27 @@
+/// <reference types='vitest' />
+import { defineConfig } from 'vite';
+import angular from '@analogjs/vite-plugin-angular';
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+import { nxCopyAssetsPlugin } from '@nx/vite/plugins/nx-copy-assets.plugin';
+
+export default defineConfig(() => ({
+  root: __dirname,
+  cacheDir: '../../../node_modules/.vite/libs/utils/positive-integer-input',
+  plugins: [angular(), nxViteTsPaths(), nxCopyAssetsPlugin(['*.md'])],
+  // Uncomment this if you are using workers.
+  // worker: {
+  //  plugins: [ nxViteTsPaths() ],
+  // },
+  test: {
+    watch: false,
+    globals: true,
+    environment: 'jsdom',
+    include: ['{src,tests}/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
+    setupFiles: ['src/test-setup.ts'],
+    reporters: ['default'],
+    coverage: {
+      reportsDirectory: '../../../coverage/libs/utils/positive-integer-input',
+      provider: 'v8' as const,
+    },
+  },
+}));

tsconfig.base.json

@@ -157,6 +157,9 @@
       "@isa/ui/tooltip": ["libs/ui/tooltip/src/index.ts"],
       "@isa/utils/ean-validation": ["libs/utils/ean-validation/src/index.ts"],
       "@isa/utils/format-name": ["libs/utils/format-name/src/index.ts"],
+      "@isa/utils/positive-integer-input": [
+        "libs/utils/positive-integer-input/src/index.ts"
+      ],
       "@isa/utils/scroll-position": ["libs/utils/scroll-position/src/index.ts"],
       "@isa/utils/z-safe-parse": ["libs/utils/z-safe-parse/src/index.ts"],
       "@modal/*": ["apps/isa-app/src/modal/*/index.ts"],