fix: restore symbol for currency and percentage

italia · Dec 13, 2023 · 5d7682c · 5d7682c
1 parent a7b5a4f
commit 5d7682c
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 5 deletions.
diff --git a/projects/design-angular-kit/src/lib/components/form/input/input.component.html b/projects/design-angular-kit/src/lib/components/form/input/input.component.html
@@ -20,6 +20,7 @@
     </div>
 
     <ng-container *ngIf="type === 'number'">
+      <span *ngIf="currency || percentage" class="input-group-text fw-semibold">{{symbol}}</span>
       <input type="number"
              [id]="id"
              [step]="step ?? null"
@@ -93,9 +94,9 @@
             </div>
             <it-icon *ngIf="entry.icon" [name]="entry.icon" size="sm"></it-icon>
             <span class="autocomplete-list-text">
-            <span [innerHTML]="entry.value | markMatchingText: autocomplete.searchedValue"></span>
-            <em *ngIf="entry.label">{{entry.label}}</em>
-          </span>
+              <span [innerHTML]="entry.value | markMatchingText: autocomplete.searchedValue"></span>
+              <em *ngIf="entry.label">{{entry.label}}</em>
+            </span>
           </ng-template>
         </li>
       </ul>

diff --git a/projects/design-angular-kit/src/lib/components/form/input/input.component.ts b/projects/design-angular-kit/src/lib/components/form/input/input.component.ts
@@ -80,6 +80,12 @@ export class ItInputComponent extends ItAbstractFormComponent<string | number |
    */
   @Input() percentage: BooleanInput | undefined;
 
+  /**
+   * The currency or percentage symbol [Used only if percentage or currency]
+   * @example '$'
+   */
+  @Input() symbol: string | undefined;
+
   /**
    * To make the numeric field automatically resize according to the value contained in it. [Used only in type = 'number']
    */

diff --git a/src/app/form-input/form-input-number/form-input-number.component.html b/src/app/form-input/form-input-number/form-input-number.component.html
@@ -16,7 +16,8 @@ <h5>Valuta</h5>
   <!-- Input numerico con valuta -->
   <it-input type="number"
             label="Currency"
-            currency="true"></it-input>
+            currency="true"
+            symbol="$"></it-input>
 
 
   <h5>Percentuale</h5>
@@ -25,7 +26,8 @@ <h5>Percentuale</h5>
   <!-- Input numerico con percentuale -->
   <it-input type="number"
             label="Percentage"
-            percentage="true"></it-input>
+            percentage="true"
+            symbol="%"></it-input>
 
   <h5>Ridimensionamento</h5>
   <p class="mb-5">È possibile far sì che il campo numerico si ridimensioni automaticamente a seconda del valore