From 9584d959789936cc62fc42d9da9ddc556fb7c9c2 Mon Sep 17 00:00:00 2001
From: Wouter Willems <wouter@klippa.com>
Date: Thu, 12 Sep 2024 14:57:53 +0200
Subject: [PATCH] support small height text input

---
 projects/demo/src/app/demo/demo.component.html                 | 2 +-
 projects/klippa/ngx-enhancy-forms/package.json                 | 2 +-
 .../src/lib/elements/text-input/text-input.component.html      | 2 +-
 .../src/lib/elements/text-input/text-input.component.scss      | 3 +++
 .../src/lib/elements/text-input/text-input.component.ts        | 1 +
 5 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/projects/demo/src/app/demo/demo.component.html b/projects/demo/src/app/demo/demo.component.html
index 07e383c..d82f941 100644
--- a/projects/demo/src/app/demo/demo.component.html
+++ b/projects/demo/src/app/demo/demo.component.html
@@ -6,7 +6,7 @@
 
 		<div style="flex: 1 1 0px; margin-top: 5rem; margin-bottom: 10rem; margin-left: 20rem; max-width: 16rem;">
 			<klp-form-element caption="Name Je weet erfjwefwewkfjewerfjwefjewerfjwefwewkfjewerfjwefjew" spaceDistribution="34-66" direction="vertical">
-				<klp-form-text-input formControlName="name" [clearable]="true">
+				<klp-form-text-input formControlName="name" [clearable]="true" size="small">
 				</klp-form-text-input>
 				<klp-form-error error="async"></klp-form-error>
 			</klp-form-element>
diff --git a/projects/klippa/ngx-enhancy-forms/package.json b/projects/klippa/ngx-enhancy-forms/package.json
index 17c9f1e..a3f6e99 100644
--- a/projects/klippa/ngx-enhancy-forms/package.json
+++ b/projects/klippa/ngx-enhancy-forms/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@klippa/ngx-enhancy-forms",
-  "version": "14.22.17",
+  "version": "14.22.18",
   "publishConfig": {
     "access": "public"
   },
diff --git a/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.html b/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.html
index 2cc9bfd..c44a4d5 100644
--- a/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.html
+++ b/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.html
@@ -1,4 +1,4 @@
-<div class="componentContainer">
+<div class="componentContainer" [ngClass]="{smallSized: size === 'small'}">
 	<ng-container *ngIf="icon?.length > 0">
 		<i class="ti-search" *ngIf="icon === 'search'"></i>
 	</ng-container>
diff --git a/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.scss b/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.scss
index 0364d26..e664fc9 100644
--- a/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.scss
+++ b/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.scss
@@ -11,6 +11,9 @@
 
 .componentContainer {
 	position: relative;
+	&.smallSized input {
+		height: 32px;
+	}
 }
 
 i {
diff --git a/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.ts b/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.ts
index 77c76d9..ae86992 100644
--- a/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.ts
+++ b/projects/klippa/ngx-enhancy-forms/src/lib/elements/text-input/text-input.component.ts
@@ -18,6 +18,7 @@ export class TextInputComponent extends ValueAccessorBase<string> {
 	@Input() hasBorderLeft = true;
 	@Input() hasBorderRight = true;
 	@Input() passwordPeekIcon: TemplateRef<any>;
+	@Input() size: 'small' | 'medium' = 'medium';
 	@Output() onBlur = new EventEmitter<void>();
 
 	public togglePeakPassword(): void {