diff --git a/src/app/libraries/components/input/input.component.html b/src/app/libraries/components/input/input.component.html
new file mode 100644
index 0000000..18f3f7c
--- /dev/null
+++ b/src/app/libraries/components/input/input.component.html
@@ -0,0 +1,10 @@
+
+
diff --git a/src/app/libraries/components/input/input.component.scss b/src/app/libraries/components/input/input.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/libraries/components/input/input.component.spec.ts b/src/app/libraries/components/input/input.component.spec.ts
new file mode 100644
index 0000000..8f18cc9
--- /dev/null
+++ b/src/app/libraries/components/input/input.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { InputComponent } from './input.component';
+
+describe('InputComponent', () => {
+ let component: InputComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [InputComponent]
+ })
+ .compileComponents();
+
+ fixture = TestBed.createComponent(InputComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/libraries/components/input/input.component.ts b/src/app/libraries/components/input/input.component.ts
new file mode 100644
index 0000000..999b317
--- /dev/null
+++ b/src/app/libraries/components/input/input.component.ts
@@ -0,0 +1,61 @@
+import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
+import {InputModel, InputType} from "./input.model";
+import {FormsModule} from "@angular/forms";
+import {nanoid} from "nanoid";
+
+@Component({
+ selector: 'rlh-input',
+ standalone: true,
+ imports: [
+ FormsModule
+ ],
+ templateUrl: './input.component.html',
+ styleUrl: './input.component.scss'
+})
+export class InputComponent implements OnInit {
+
+ renderModel: any
+
+ @Input() input: InputModel = {
+ type: InputType.TEXT,
+ disabled: () => false,
+ modelChange: () => {}
+ };
+
+ @Input()
+ get model() {
+ return this.renderModel;
+ }
+ set model(val: any) {
+ if (val !== this.renderModel) {
+ this.renderModel = val;
+ this.modelChange.emit(val);
+ }
+ }
+
+ @Output() modelChange = new EventEmitter();
+
+
+ isDisabled: () => boolean = () => {
+ return false;
+ };
+
+ ngOnInit() {
+ this.input.disabled = this.input.disabled
+ ? this.input.disabled
+ : () => false;
+
+ setTimeout(() => {
+ this.isDisabled = () => {
+ return this.input.disabled();
+ };
+ });
+
+ if(!this.input.id || this.input.id.length < 1) {
+ this.input.id = nanoid(12);
+ }
+ }
+
+
+
+}
diff --git a/src/app/libraries/components/input/input.model.spec.ts b/src/app/libraries/components/input/input.model.spec.ts
new file mode 100644
index 0000000..56db551
--- /dev/null
+++ b/src/app/libraries/components/input/input.model.spec.ts
@@ -0,0 +1,7 @@
+import { InputModel } from './input.model';
+
+describe('InputModel', () => {
+ it('should create an instance', () => {
+ expect(new InputModel()).toBeTruthy();
+ });
+});
diff --git a/src/app/libraries/components/input/input.model.ts b/src/app/libraries/components/input/input.model.ts
new file mode 100644
index 0000000..3eb5693
--- /dev/null
+++ b/src/app/libraries/components/input/input.model.ts
@@ -0,0 +1,13 @@
+export class InputModel {
+ id?: string;
+ type: InputType;
+ disabled: () => boolean;
+ modelChange: () => void;
+}
+
+export enum InputType {
+ TEXT = 'text',
+ NUMBER = 'number',
+ EMAIL = 'email',
+ PASSWORD = 'password'
+}