bpm-core 0.0.126 → 0.0.127

package/README.md

@@ -3,10 +3,107 @@
 
 > Ensure your project is updated to Angular 19 to avoid compatibility issues.
 
-## Recently Added Features
-- ### Time Picker
+## [Recently Added Features](#recently-added-features)
+- ### [Input Mapping and Filtering](#input-mapping-and-filtering)
+  The `app-input` component now supports two powerful inputs:
+
+  - **`[mapFn]`** — A function that modifies the input value **before it's rendered**, allowing for transformations like uppercase conversion, formatting, or character replacement.
+  - **`[filterFn]`** — A function that validates or restricts what characters can be typed, pasted, or dropped into the input.
+  
+  **Built-in Utility Classes Provided:**
+  >
+  > - `InputFilters`:
+  >   - `InputFilters.arabicOnly`
+  >   - `InputFilters.englishOnly`
+  >   - `InputFilters.digitsOnly`
+  >   - `InputFilters.buildPattern()`
+  >
+  > - `InputMappers`:
+  >   - `InputMappers.toUpperCase`
+  >   - `InputMappers.toLowerCase`
+
+  **Example 1: Custom filter – Allow only numbers**
+  ```ts
+  numbersOnlyFilter: InputFilterFn = (char, current, next, keyType) => {
+    if (keyType !== 'character') return true;
+    return /^[0-9]+$/.test(char);
+  };
+  ```
+  ```html
+  <app-input
+    label="Phone Number"
+    [filterFn]="numbersOnlyFilter"
+  ></app-input>
+  ```
+
+  **Example 2: Built-in filter – Arabic-only characters**
+  ```ts
+  import { InputFilters } from 'bpm-core';
+
+  class MyComponent {
+    InputFilters = InputFilters;
+  }
+  ```
+  ```html
+  <app-input
+    label="الاسم بالعربية"
+    [filterFn]="InputFilters.arabicOnly"
+  ></app-input>
+  ```
+  > 💡 **Hint:** Use `InputFilters.buildPattern()` when you need to **customize exactly which characters are allowed** in an input.  
+  > You can combine multiple character groups like Arabic letters, digits, symbols, and spaces then generate a custom filter function using `.build()`.
+
+  **Example 3: Custom filter using `buildPattern()` — Allow English letters, digits, spaces, and symbols**
+
+  ```ts
+  import { InputFilters } from 'bpm-core';
+
+  class MyComponent {
+    customEnglishFilter = InputFilters.buildPattern()
+      .allowEnglishAlphabets()
+      .allowDigits()
+      .allowSpace()
+      .allowSymbols()
+      .build();
+  }
+  ```
+  ```html
+  <app-input
+    label="Username"
+    [filterFn]="customEnglishFilter"
+  ></app-input>
+  ```
+  **Example 4: Custom map — Capitalize first letter of each word**
+  ```ts
+  capitalizeWordsMapFn: InputMapFn = (char, current, next) => {
+    return next.replace(/\b\w/g, (match) => match.toUpperCase());
+  };
+  ```
+  ```html
+  <app-input
+    label="Full Name"
+    [mapFn]="capitalizeWordsMapFn"
+  ></app-input>
+  ```
+
+  **Example 5: Built-in map — Force lowercase:**
+  ```ts
+  import { InputMappers } from 'bpm-core';
+
+  class MyComponent {
+    InputMappers = InputMappers;
+  }
+  ```
+  ```html
+  <app-input
+    label="Email"
+    [mapFn]="InputMappers.toLowercase"
+  ></app-input>
+  ```
+
+- ### [Time Picker](#time-picker) 
   To use it, import `TimepickerComponent` in your TypeScript file and add `<app-timepicker>` to your template. For more information, hover over the selector after adding it to your template.
-- ### Summary Section / Stage  
+- ### [Summary Section](#summary-section)  
   This is a stage that appears before the request stage.
 
   To enable this feature:
@@ -63,17 +160,23 @@
   ```
   </details> 
 
-## Changes Log
+## [Changes Log](#changes-log)
+
+<a id="bpm-core00127-2025-08-06"></a>
+### [bpm-core@0.0.127 — 2025-08-06](#bpm-core00127-2025-08-06)
+- feat(app-input): `app-input` now supports `filterFn` and `mapFn` inputs.
+- feat(validation-errors): Added default error messages for `max` and `min` validators.
+
 
 <a id="bpm-core00126-2025-07-30"></a>
 ### [bpm-core@0.0.126 — 2025-07-30](#bpm-core00126-2025-07-30)
-- Fix (file-uploader): avoid clearing attachments with multiple enabled.
-- Fix (file-uploader): activate "maxLength" input to specify maximum number of files
-- Fix (attachment-section): resolve _intl console error and translate MatPaginator labels to Arabic.
+- fix(file-uploader): avoid clearing attachments with multiple enabled.
+- fix(file-uploader): activate "maxLength" input to specify maximum number of files
+- fix(attachment-section): resolve _intl console error and translate MatPaginator labels to Arabic.
 
 <a id="bpm-core00125-2025-07-23"></a>
 ### [bpm-core@0.0.125 — 2025-07-23](#bpm-core00125-2025-07-23)
-- Fix: resolve issue with downloading attachments from comments history.
+- fix: resolve issue with downloading attachments from comments history.
 
 <a id="bpm-core00124-2025-07-17"></a>
 ### [bpm-core@0.0.124 — 2025-07-17](#bpm-core00124-2025-07-17)