skcr-autechre 0.0.1

package/README.md

@@ -0,0 +1,63 @@
+# Autechre
+
+This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 21.0.0.
+
+## Code scaffolding
+
+Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
+
+```bash
+ng generate component component-name
+```
+
+For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
+
+```bash
+ng generate --help
+```
+
+## Building
+
+To build the library, run:
+
+```bash
+ng build autechre
+```
+
+This command will compile your project, and the build artifacts will be placed in the `dist/` directory.
+
+### Publishing the Library
+
+Once the project is built, you can publish your library by following these steps:
+
+1. Navigate to the `dist` directory:
+   ```bash
+   cd dist/autechre
+   ```
+
+2. Run the `npm publish` command to publish your library to the npm registry:
+   ```bash
+   npm publish
+   ```
+
+## Running unit tests
+
+To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
+
+```bash
+ng test
+```
+
+## Running end-to-end tests
+
+For end-to-end (e2e) testing, run:
+
+```bash
+ng e2e
+```
+
+Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
+
+## Additional Resources
+
+For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.

package/fesm2022/skcr-autechre.mjs

@@ -0,0 +1,323 @@
+import * as i0 from '@angular/core';
+import { Component, input, model, signal, computed, inject, ElementRef, viewChild, effect, output } from '@angular/core';
+import { trigger, transition, style, animate } from '@angular/animations';
+import * as i1 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+import { NgClass } from '@angular/common';
+import * as i2 from '@angular/cdk/scrolling';
+import { ScrollingModule } from '@angular/cdk/scrolling';
+import { NgIcon } from '@ng-icons/core';
+
+class Autechre {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Autechre, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.3", type: Autechre, isStandalone: true, selector: "lib-autechre", ngImport: i0, template: `
+    <p>
+      autechre works!
+    </p>
+  `, isInline: true, styles: [""] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Autechre, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-autechre', imports: [], template: `
+    <p>
+      autechre works!
+    </p>
+  ` }]
+        }] });
+
+class MultiSelectComponent {
+    constructor() {
+        this.options = input.required(...(ngDevMode ? [{ debugName: "options" }] : []));
+        this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
+        this.placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+        this.searchPlaceholder = input('', ...(ngDevMode ? [{ debugName: "searchPlaceholder" }] : []));
+        this.isInvalid = input(false, ...(ngDevMode ? [{ debugName: "isInvalid" }] : []));
+        this.isDisabled = input(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
+        this.isSearchDisplayed = input(false, ...(ngDevMode ? [{ debugName: "isSearchDisplayed" }] : []));
+        this.isOptional = input(false, ...(ngDevMode ? [{ debugName: "isOptional" }] : []));
+        this.isFullWidth = input(false, ...(ngDevMode ? [{ debugName: "isFullWidth" }] : []));
+        this.areValueDisplayedOutside = input(false, ...(ngDevMode ? [{ debugName: "areValueDisplayedOutside" }] : []));
+        this.tooltipText = input('', ...(ngDevMode ? [{ debugName: "tooltipText" }] : []));
+        this.value = model([], ...(ngDevMode ? [{ debugName: "value" }] : []));
+        this.searchTerm = signal('', ...(ngDevMode ? [{ debugName: "searchTerm" }] : []));
+        this.isOpen = signal(false, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
+        this.dropdownTop = 0;
+        this.dropdownLeft = 0;
+        this.dropdownWidth = 0;
+        this.formattedOptions = computed(() => {
+            let formattedOptions = this.options() || [];
+            if (formattedOptions[0]?.value === undefined) {
+                formattedOptions = formattedOptions.map(option => {
+                    return {
+                        ...option,
+                        value: option.id,
+                    };
+                });
+            }
+            return formattedOptions;
+        }, ...(ngDevMode ? [{ debugName: "formattedOptions" }] : []));
+        this.filteredOptions = computed(() => {
+            const normalizedQuery = this.normalizeString(this.searchTerm());
+            return this.formattedOptions().filter(option => {
+                return this.normalizeString(option.name).includes(normalizedQuery);
+            });
+        }, ...(ngDevMode ? [{ debugName: "filteredOptions" }] : []));
+        this.selectedOptions = computed(() => {
+            return this.formattedOptions().filter(option => this.value().includes(option.value));
+        }, ...(ngDevMode ? [{ debugName: "selectedOptions" }] : []));
+        this.selectedOptionsText = computed(() => {
+            return this.selectedOptions()
+                .map(option => option.name)
+                .join(', ');
+        }, ...(ngDevMode ? [{ debugName: "selectedOptionsText" }] : []));
+        this.elRef = inject(ElementRef);
+        this.searchInputEl = viewChild('searchInput', ...(ngDevMode ? [{ debugName: "searchInputEl" }] : []));
+        this.resizeHandler = () => {
+            if (this.isOpen()) {
+                this.updateDropdownPosition();
+            }
+        };
+        this.clickOutsideHandler = (e) => {
+            if (!this.elRef.nativeElement.contains(e.target) && this.isOpen()) {
+                this.toggleSelect();
+            }
+        };
+        this.Math = Math;
+        effect(() => {
+            const disabledSelectedOptions = this.formattedOptions().filter(option => option.isDisabled && this.value()?.includes(option.value));
+            if (disabledSelectedOptions.length > 0) {
+                const updatedValue = this.value()?.filter(value => !disabledSelectedOptions.some(option => option.value === value));
+                this.value.set(updatedValue || []);
+            }
+        });
+    }
+    toggleSelect(event) {
+        if (event?.defaultPrevented) {
+            return;
+        }
+        this.isOpen.update(isOpen => !isOpen);
+        if (this.isOpen()) {
+            this.updateDropdownPosition();
+            document.addEventListener('click', this.clickOutsideHandler);
+            window.addEventListener('resize', this.resizeHandler);
+            window.addEventListener('scroll', this.resizeHandler, true);
+            this.focusSearchInput();
+        }
+        else {
+            document.removeEventListener('click', this.clickOutsideHandler);
+            window.removeEventListener('resize', this.resizeHandler);
+            window.removeEventListener('scroll', this.resizeHandler, true);
+        }
+    }
+    handleOptionClick(item) {
+        if (!item.isDisabled) {
+            const itemIndex = this.value().indexOf(item.value);
+            const updatedValue = [
+                ...this.value(),
+            ];
+            if (itemIndex >= 0) {
+                updatedValue.splice(itemIndex, 1);
+            }
+            else {
+                updatedValue.push(item.value);
+            }
+            this.value.set(updatedValue);
+        }
+    }
+    isItemSelected(item) {
+        return this.value().includes(item.value);
+    }
+    clearAllSelections(event) {
+        this.value.set([]);
+        event.stopPropagation();
+    }
+    removeOption(option, event) {
+        event.stopPropagation();
+        event.preventDefault();
+        const updatedValue = this.value().filter(value => value !== option.value);
+        this.value.set(updatedValue);
+    }
+    ngOnDestroy() {
+        document.removeEventListener('click', this.clickOutsideHandler);
+        window.removeEventListener('resize', this.resizeHandler);
+        window.removeEventListener('scroll', this.resizeHandler, true);
+    }
+    updateDropdownPosition() {
+        const buttonElement = this.elRef.nativeElement.querySelector('button');
+        if (buttonElement) {
+            const rect = buttonElement.getBoundingClientRect();
+            this.dropdownTop = rect.bottom + window.scrollY;
+            this.dropdownLeft = rect.left + window.scrollX;
+            this.dropdownWidth = rect.width;
+        }
+    }
+    focusSearchInput() {
+        if (!this.isOpen() || !this.isSearchDisplayed())
+            return;
+        setTimeout(() => {
+            requestAnimationFrame(() => {
+                const inputRef = this.searchInputEl();
+                const inputEl = inputRef?.nativeElement;
+                if (inputEl) {
+                    inputEl.focus();
+                    try {
+                        inputEl.select?.();
+                    }
+                    catch { }
+                }
+            });
+        }, 1);
+    }
+    normalizeString(value) {
+        return value
+            .normalize('NFD')
+            .replace(/[\u0300-\u036f]/g, '')
+            .toLocaleLowerCase();
+    }
+    trackByValue(index, item) {
+        return item.value;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: MultiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: MultiSelectComponent, isStandalone: true, selector: "skcr-multi-select", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isSearchDisplayed: { classPropertyName: "isSearchDisplayed", publicName: "isSearchDisplayed", isSignal: true, isRequired: false, transformFunction: null }, isOptional: { classPropertyName: "isOptional", publicName: "isOptional", isSignal: true, isRequired: false, transformFunction: null }, isFullWidth: { classPropertyName: "isFullWidth", publicName: "isFullWidth", isSignal: true, isRequired: false, transformFunction: null }, areValueDisplayedOutside: { classPropertyName: "areValueDisplayedOutside", publicName: "areValueDisplayedOutside", isSignal: true, isRequired: false, transformFunction: null }, tooltipText: { classPropertyName: "tooltipText", publicName: "tooltipText", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, viewQueries: [{ propertyName: "searchInputEl", first: true, predicate: ["searchInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div>\n  @if (label()) {\n    <label\n      class=\"flex items-center justify-between\"\n      id=\"multiselect-label\"\n    >\n      <div class=\"flex items-center gap-2\">\n        {{ label() }}\n\n        @if (isOptional()) {\n          <span class=\"text-xs text-slate-500\">Optional</span>\n        }\n      </div>\n\n      @if (tooltipText()) {\n        <div class=\"flex items-center has-tooltip\">\n          <ng-icon\n            class=\"size-4\"\n            name=\"heroQuestionMarkCircle\"\n          />\n\n          <div class=\"tooltip bg-gray-800 text-white -left-50 top-4 p-2 rounded text-xs max-w-md whitespace-normal\">\n            {{ tooltipText() }}\n          </div>\n        </div>\n      }\n    </label>\n  }\n\n  <div class=\"relative mt-1\">\n    <button\n      class=\"grid w-full min-h-9 cursor-default grid-cols-1 rounded-md shadow-sm py-2 px-3 text-left outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary sm:text-body-small/6\"\n      (click)=\"toggleSelect($event)\"\n      [disabled]=\"isDisabled() || !options().length\"\n      [ngClass]=\"{\n        'outline-destructive focus:outline-destructive focus:ring-destructive': isInvalid(),\n        'outline-border-color focus:outline-primaryBlue focus:ring-primaryBlue': !isInvalid(),\n        'cursor-not-allowed bg-slate-50': isDisabled() || !options().length,\n        'cursor-pointer bg-white': !isDisabled() && !!options().length,\n      }\"\n      type=\"button\"\n      aria-expanded=\"true\"\n      aria-haspopup=\"listbox\"\n      aria-labelledby=\"multiselect-label\"\n    >\n      <div class=\"col-start-1 row-start-1 block gap-2 truncate pr-12\">\n        @if (!selectedOptions()!.length || !!areValueDisplayedOutside()) {\n          <span>\n            {{ placeholder() }}\n          </span>\n        } @else {\n          <div class=\"flex flex-wrap gap-1 max-h-[4rem] overflow-auto scrollbar-hide relative\">\n            @for (selectedOption of selectedOptions(); track selectedOption.value) {\n              <span\n                class=\"px-2 py-0.5 bg-primary-50 text-primary-800 rounded-lg text-caption font-medium flex items-center gap-1\"\n              >\n                {{ selectedOption.name }}\n\n                <span\n                  class=\"cursor-pointer text-primary-800 flex items-center\"\n                  (mousedown)=\"removeOption(selectedOption, $event)\"\n                  (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n                >\n                  <ng-icon\n                    class=\"size-4\"\n                    name=\"heroXMark\"\n                  />\n                </span>\n              </span>\n            }\n          </div>\n        }\n      </div>\n\n      <span class=\"col-start-1 row-start-1 flex items-center gap-2 self-center justify-self-end text-slate-500\">\n        <span class=\"size-5 sm:size-4\">\n          <ng-icon name=\"heroChevronUpDown\" />\n        </span>\n      </span>\n    </button>\n\n    @if (isOpen()) {\n      <div\n        class=\"fixed z-50 w-full rounded-md bg-white text-base shadow-lg ring-1 ring-black/5 focus:outline-hidden sm:text-body-small overflow-hidden\"\n        [style.top.px]=\"dropdownTop\"\n        [style.left.px]=\"dropdownLeft\"\n        [style.width.px]=\"dropdownWidth\"\n        @AnimationTrigger0\n        role=\"listbox\"\n        aria-labelledby=\"multiselect-label\"\n      >\n        @if (isSearchDisplayed()) {\n          <div class=\"relative cursor-default py-2 px-3 shadow-sm select-none\">\n            <div class=\"pointer-events-none absolute inset-y-0 left-1 flex items-center pl-3\">\n              <span class=\"flex items-center\">\n                <ng-icon name=\"heroMagnifyingGlass\" />\n              </span>\n            </div>\n\n            <input\n              class=\"block rounded-md w-full pl-6 pr-3 py-2 text-body-small shadow-sm outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary placeholder:text-slate-500\"\n              #searchInput\n              type=\"text\"\n              [placeholder]=\"searchPlaceholder()\"\n              [(ngModel)]=\"searchTerm\"\n              (click)=\"$event.stopPropagation()\"\n            />\n          </div>\n        }\n\n        <cdk-virtual-scroll-viewport\n          class=\"w-full\"\n          [itemSize]=\"40\"\n          [style.height.px]=\"Math.min(filteredOptions().length * 40, 224)\"\n        >\n          <div\n            class=\"relative cursor-default py-2 pr-9 pl-3 select-none\"\n            *cdkVirtualFor=\"let option of filteredOptions(); trackBy: trackByValue; let i = index\"\n            (click)=\"handleOptionClick(option)\"\n            [class.bg-slate-50]=\"!!option.isDisabled\"\n            [class.hover:bg-primary-50]=\"!option.isDisabled\"\n            [id]=\"'listbox-option-' + i\"\n            role=\"option\"\n          >\n            <span class=\"block truncate\">\n              {{ option.name }}\n            </span>\n\n            @if (isItemSelected(option)) {\n              <span class=\"absolute inset-y-0 right-0 flex items-center pr-4 text-primary\">\n                <ng-icon name=\"heroCheck\" />\n              </span>\n            }\n          </div>\n        </cdk-virtual-scroll-viewport>\n      </div>\n    }\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }], animations: [
+            trigger('AnimationTrigger0', [
+                transition(':leave', [
+                    style({ opacity: 1 }),
+                    animate('200ms ease-in-out', style({ opacity: 0 })),
+                ]),
+            ]),
+        ] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: MultiSelectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'skcr-multi-select', animations: [
+                        trigger('AnimationTrigger0', [
+                            transition(':leave', [
+                                style({ opacity: 1 }),
+                                animate('200ms ease-in-out', style({ opacity: 0 })),
+                            ]),
+                        ]),
+                    ], imports: [
+                        FormsModule,
+                        NgClass,
+                        NgIcon,
+                        ScrollingModule,
+                    ], template: "<div>\n  @if (label()) {\n    <label\n      class=\"flex items-center justify-between\"\n      id=\"multiselect-label\"\n    >\n      <div class=\"flex items-center gap-2\">\n        {{ label() }}\n\n        @if (isOptional()) {\n          <span class=\"text-xs text-slate-500\">Optional</span>\n        }\n      </div>\n\n      @if (tooltipText()) {\n        <div class=\"flex items-center has-tooltip\">\n          <ng-icon\n            class=\"size-4\"\n            name=\"heroQuestionMarkCircle\"\n          />\n\n          <div class=\"tooltip bg-gray-800 text-white -left-50 top-4 p-2 rounded text-xs max-w-md whitespace-normal\">\n            {{ tooltipText() }}\n          </div>\n        </div>\n      }\n    </label>\n  }\n\n  <div class=\"relative mt-1\">\n    <button\n      class=\"grid w-full min-h-9 cursor-default grid-cols-1 rounded-md shadow-sm py-2 px-3 text-left outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary sm:text-body-small/6\"\n      (click)=\"toggleSelect($event)\"\n      [disabled]=\"isDisabled() || !options().length\"\n      [ngClass]=\"{\n        'outline-destructive focus:outline-destructive focus:ring-destructive': isInvalid(),\n        'outline-border-color focus:outline-primaryBlue focus:ring-primaryBlue': !isInvalid(),\n        'cursor-not-allowed bg-slate-50': isDisabled() || !options().length,\n        'cursor-pointer bg-white': !isDisabled() && !!options().length,\n      }\"\n      type=\"button\"\n      aria-expanded=\"true\"\n      aria-haspopup=\"listbox\"\n      aria-labelledby=\"multiselect-label\"\n    >\n      <div class=\"col-start-1 row-start-1 block gap-2 truncate pr-12\">\n        @if (!selectedOptions()!.length || !!areValueDisplayedOutside()) {\n          <span>\n            {{ placeholder() }}\n          </span>\n        } @else {\n          <div class=\"flex flex-wrap gap-1 max-h-[4rem] overflow-auto scrollbar-hide relative\">\n            @for (selectedOption of selectedOptions(); track selectedOption.value) {\n              <span\n                class=\"px-2 py-0.5 bg-primary-50 text-primary-800 rounded-lg text-caption font-medium flex items-center gap-1\"\n              >\n                {{ selectedOption.name }}\n\n                <span\n                  class=\"cursor-pointer text-primary-800 flex items-center\"\n                  (mousedown)=\"removeOption(selectedOption, $event)\"\n                  (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n                >\n                  <ng-icon\n                    class=\"size-4\"\n                    name=\"heroXMark\"\n                  />\n                </span>\n              </span>\n            }\n          </div>\n        }\n      </div>\n\n      <span class=\"col-start-1 row-start-1 flex items-center gap-2 self-center justify-self-end text-slate-500\">\n        <span class=\"size-5 sm:size-4\">\n          <ng-icon name=\"heroChevronUpDown\" />\n        </span>\n      </span>\n    </button>\n\n    @if (isOpen()) {\n      <div\n        class=\"fixed z-50 w-full rounded-md bg-white text-base shadow-lg ring-1 ring-black/5 focus:outline-hidden sm:text-body-small overflow-hidden\"\n        [style.top.px]=\"dropdownTop\"\n        [style.left.px]=\"dropdownLeft\"\n        [style.width.px]=\"dropdownWidth\"\n        @AnimationTrigger0\n        role=\"listbox\"\n        aria-labelledby=\"multiselect-label\"\n      >\n        @if (isSearchDisplayed()) {\n          <div class=\"relative cursor-default py-2 px-3 shadow-sm select-none\">\n            <div class=\"pointer-events-none absolute inset-y-0 left-1 flex items-center pl-3\">\n              <span class=\"flex items-center\">\n                <ng-icon name=\"heroMagnifyingGlass\" />\n              </span>\n            </div>\n\n            <input\n              class=\"block rounded-md w-full pl-6 pr-3 py-2 text-body-small shadow-sm outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary placeholder:text-slate-500\"\n              #searchInput\n              type=\"text\"\n              [placeholder]=\"searchPlaceholder()\"\n              [(ngModel)]=\"searchTerm\"\n              (click)=\"$event.stopPropagation()\"\n            />\n          </div>\n        }\n\n        <cdk-virtual-scroll-viewport\n          class=\"w-full\"\n          [itemSize]=\"40\"\n          [style.height.px]=\"Math.min(filteredOptions().length * 40, 224)\"\n        >\n          <div\n            class=\"relative cursor-default py-2 pr-9 pl-3 select-none\"\n            *cdkVirtualFor=\"let option of filteredOptions(); trackBy: trackByValue; let i = index\"\n            (click)=\"handleOptionClick(option)\"\n            [class.bg-slate-50]=\"!!option.isDisabled\"\n            [class.hover:bg-primary-50]=\"!option.isDisabled\"\n            [id]=\"'listbox-option-' + i\"\n            role=\"option\"\n          >\n            <span class=\"block truncate\">\n              {{ option.name }}\n            </span>\n\n            @if (isItemSelected(option)) {\n              <span class=\"absolute inset-y-0 right-0 flex items-center pr-4 text-primary\">\n                <ng-icon name=\"heroCheck\" />\n              </span>\n            }\n          </div>\n        </cdk-virtual-scroll-viewport>\n      </div>\n    }\n  </div>\n</div>\n" }]
+        }], ctorParameters: () => [], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], isInvalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInvalid", required: false }] }], isDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabled", required: false }] }], isSearchDisplayed: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSearchDisplayed", required: false }] }], isOptional: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOptional", required: false }] }], isFullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "isFullWidth", required: false }] }], areValueDisplayedOutside: [{ type: i0.Input, args: [{ isSignal: true, alias: "areValueDisplayedOutside", required: false }] }], tooltipText: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipText", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], searchInputEl: [{ type: i0.ViewChild, args: ['searchInput', { isSignal: true }] }] } });
+
+class InputComponent {
+    constructor() {
+        this.id = input('', ...(ngDevMode ? [{ debugName: "id" }] : []));
+        this.type = input('text', ...(ngDevMode ? [{ debugName: "type" }] : []));
+        this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
+        this.placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+        this.isOptional = input(false, ...(ngDevMode ? [{ debugName: "isOptional" }] : []));
+        this.isSearchInput = input(false, ...(ngDevMode ? [{ debugName: "isSearchInput" }] : []));
+        this.isInvalid = input(false, ...(ngDevMode ? [{ debugName: "isInvalid" }] : []));
+        this.isDisabled = input(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
+        this.value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
+    }
+    handleChange(event) {
+        const newValue = event.target.value;
+        this.value.set(newValue);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: InputComponent, isStandalone: true, selector: "skcr-input", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, isOptional: { classPropertyName: "isOptional", publicName: "isOptional", isSignal: true, isRequired: false, transformFunction: null }, isSearchInput: { classPropertyName: "isSearchInput", publicName: "isSearchInput", isSignal: true, isRequired: false, transformFunction: null }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, ngImport: i0, template: "<div>\n  @if (label()) {\n    <label\n      class=\"mb-1 flex items-center gap-2\"\n      [for]=\"id()\"\n    >\n      {{ label() }}\n\n      @if (isOptional()) {\n        <span class=\"text-slate-500\"> Optional </span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    @if (isSearchInput()) {\n      <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3\">\n        <span class=\"flex items-center\">\n          <ng-icon name=\"heroMagnifyingGlass\" />\n        </span>\n      </div>\n    }\n\n    <input\n      class=\"block w-full rounded-md px-3 py-2 text-body-small shadow-sm outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary placeholder:text-slate-500\"\n      [id]=\"id() || label()\"\n      [name]=\"id()\"\n      [type]=\"type()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [(ngModel)]=\"value\"\n      (input)=\"handleChange($event)\"\n      [ngClass]=\"{\n        'pl-10': isSearchInput(),\n        'outline-destructive placeholder-destructive focus:outline-destructive focus:ring-destructive': isInvalid(),\n        'outline-lightGrey focus:outline-primary focus:ring-primary': !isInvalid(),\n        'cursor-not-allowed bg-slate-50': isDisabled(),\n      }\"\n    />\n  </div>\n</div>\n", styles: ["input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: InputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'skcr-input', imports: [
+                        FormsModule,
+                        NgClass,
+                        NgIcon
+                    ], template: "<div>\n  @if (label()) {\n    <label\n      class=\"mb-1 flex items-center gap-2\"\n      [for]=\"id()\"\n    >\n      {{ label() }}\n\n      @if (isOptional()) {\n        <span class=\"text-slate-500\"> Optional </span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    @if (isSearchInput()) {\n      <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3\">\n        <span class=\"flex items-center\">\n          <ng-icon name=\"heroMagnifyingGlass\" />\n        </span>\n      </div>\n    }\n\n    <input\n      class=\"block w-full rounded-md px-3 py-2 text-body-small shadow-sm outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary placeholder:text-slate-500\"\n      [id]=\"id() || label()\"\n      [name]=\"id()\"\n      [type]=\"type()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [(ngModel)]=\"value\"\n      (input)=\"handleChange($event)\"\n      [ngClass]=\"{\n        'pl-10': isSearchInput(),\n        'outline-destructive placeholder-destructive focus:outline-destructive focus:ring-destructive': isInvalid(),\n        'outline-lightGrey focus:outline-primary focus:ring-primary': !isInvalid(),\n        'cursor-not-allowed bg-slate-50': isDisabled(),\n      }\"\n    />\n  </div>\n</div>\n", styles: ["input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
+        }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], isOptional: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOptional", required: false }] }], isSearchInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSearchInput", required: false }] }], isInvalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInvalid", required: false }] }], isDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }] } });
+
+class InputNumberComponent {
+    constructor() {
+        this.name = input('', ...(ngDevMode ? [{ debugName: "name" }] : []));
+        this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
+        this.placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+        this.maxFractionDigits = input(0, ...(ngDevMode ? [{ debugName: "maxFractionDigits" }] : []));
+        this.isInvalid = input(false, ...(ngDevMode ? [{ debugName: "isInvalid" }] : []));
+        this.tooltipText = input('', ...(ngDevMode ? [{ debugName: "tooltipText" }] : []));
+        this.value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
+        this.inputPattern = `^\\d+\\.?\\d{0,${this.maxFractionDigits()}}$`;
+    }
+    handleKeyDown(event) {
+        if (!((event.key >= '0' && event.key <= '9') ||
+            [
+                'Backspace',
+                'Tab',
+                'ArrowLeft',
+                'ArrowRight',
+                'Delete',
+                'Home',
+                'End',
+            ].includes(event.key))) {
+            event.preventDefault();
+        }
+    }
+    handleChange(event) {
+        const value = event.target.value;
+        this.value.set(value === '' ? undefined : +value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: InputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: InputNumberComponent, isStandalone: true, selector: "skcr-input-number", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, maxFractionDigits: { classPropertyName: "maxFractionDigits", publicName: "maxFractionDigits", isSignal: true, isRequired: false, transformFunction: null }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: true, isRequired: false, transformFunction: null }, tooltipText: { classPropertyName: "tooltipText", publicName: "tooltipText", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, ngImport: i0, template: "<div>\n  <label\n    class=\"mb-1 flex items-center justify-between\"\n    [for]=\"name()\"\n  >\n    <div class=\"flex items-center gap-2\">\n      {{ label() }}\n    </div>\n\n    @if (tooltipText()) {\n      <div class=\"flex items-center has-tooltip\">\n        <ng-icon\n          class=\"size-4\"\n          name=\"heroQuestionMarkCircle\"\n        />\n\n        <div class=\"tooltip bg-gray-800 text-white -left-50 top-4 p-2 rounded text-xs max-w-md whitespace-normal\">\n          {{ tooltipText() }}\n        </div>\n      </div>\n    }\n  </label>\n\n  <input\n    class=\"block w-full rounded-md px-3 py-2 text-body-small shadow-sm outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary placeholder:text-slate-500\"\n    [id]=\"name()\"\n    [name]=\"name()\"\n    type=\"text\"\n    inputmode=\"numeric\"\n    [pattern]=\"inputPattern\"\n    [placeholder]=\"placeholder()\"\n    (keydown)=\"handleKeyDown($event)\"\n    [(ngModel)]=\"value\"\n    (input)=\"handleChange($event)\"\n    [ngClass]=\"{\n      'outline-destructive placeholder-destructive focus:outline-destructive focus:ring-destructive': isInvalid(),\n      'outline-lightGrey focus:outline-primary focus:ring-primary': !isInvalid(),\n    }\"\n  />\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: InputNumberComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'skcr-input-number', imports: [
+                        NgClass,
+                        FormsModule,
+                        NgIcon,
+                    ], template: "<div>\n  <label\n    class=\"mb-1 flex items-center justify-between\"\n    [for]=\"name()\"\n  >\n    <div class=\"flex items-center gap-2\">\n      {{ label() }}\n    </div>\n\n    @if (tooltipText()) {\n      <div class=\"flex items-center has-tooltip\">\n        <ng-icon\n          class=\"size-4\"\n          name=\"heroQuestionMarkCircle\"\n        />\n\n        <div class=\"tooltip bg-gray-800 text-white -left-50 top-4 p-2 rounded text-xs max-w-md whitespace-normal\">\n          {{ tooltipText() }}\n        </div>\n      </div>\n    }\n  </label>\n\n  <input\n    class=\"block w-full rounded-md px-3 py-2 text-body-small shadow-sm outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary placeholder:text-slate-500\"\n    [id]=\"name()\"\n    [name]=\"name()\"\n    type=\"text\"\n    inputmode=\"numeric\"\n    [pattern]=\"inputPattern\"\n    [placeholder]=\"placeholder()\"\n    (keydown)=\"handleKeyDown($event)\"\n    [(ngModel)]=\"value\"\n    (input)=\"handleChange($event)\"\n    [ngClass]=\"{\n      'outline-destructive placeholder-destructive focus:outline-destructive focus:ring-destructive': isInvalid(),\n      'outline-lightGrey focus:outline-primary focus:ring-primary': !isInvalid(),\n    }\"\n  />\n</div>\n" }]
+        }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], maxFractionDigits: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFractionDigits", required: false }] }], isInvalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInvalid", required: false }] }], tooltipText: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipText", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }] } });
+
+var EButtonColorVariant;
+(function (EButtonColorVariant) {
+    EButtonColorVariant["Primary"] = "btn-primary";
+    EButtonColorVariant["Danger"] = "btn-danger";
+})(EButtonColorVariant || (EButtonColorVariant = {}));
+class SubmitButtonComponent {
+    constructor() {
+        this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
+        this.isLoading = input(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
+        this.isFullWidth = input(false, ...(ngDevMode ? [{ debugName: "isFullWidth" }] : []));
+        this.isDisabled = input(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
+        this.isSuccess = input(false, ...(ngDevMode ? [{ debugName: "isSuccess" }] : []));
+        this.colorVariant = input(EButtonColorVariant.Primary, ...(ngDevMode ? [{ debugName: "colorVariant" }] : []));
+        this.submitClicked = output();
+        this.isSuccessIconDisplayed = signal(false, ...(ngDevMode ? [{ debugName: "isSuccessIconDisplayed" }] : []));
+        effect(() => {
+            if (this.isSuccess()) {
+                this.isSuccessIconDisplayed.set(true);
+                setTimeout(() => {
+                    this.isSuccessIconDisplayed.set(false);
+                }, 1000);
+            }
+        });
+    }
+    handleCLick() {
+        this.submitClicked.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: SubmitButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: SubmitButtonComponent, isStandalone: true, selector: "skcr-submit-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isFullWidth: { classPropertyName: "isFullWidth", publicName: "isFullWidth", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isSuccess: { classPropertyName: "isSuccess", publicName: "isSuccess", isSignal: true, isRequired: false, transformFunction: null }, colorVariant: { classPropertyName: "colorVariant", publicName: "colorVariant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { submitClicked: "submitClicked" }, ngImport: i0, template: "<button\n  class=\"btn btn-large w-full\"\n  type=\"button\"\n  [class]=\"colorVariant()\"\n  [ngClass]=\"{\n    'btn-success': isSuccessIconDisplayed(),\n    'btn-full': isFullWidth(),\n  }\"\n  [disabled]=\"isLoading() || isSuccessIconDisplayed() || isDisabled()\"\n  (click)=\"handleCLick()\"\n>\n  @if (isLoading()) {\n    <span class=\"spinner\"></span>\n  }\n\n  @if (isSuccessIconDisplayed()) {\n    <span class=\"flex items-center justify-center text-inherit\">\n      <ng-icon\n        name=\"heroCheck\"\n        size=\"20px\"\n      />\n    </span>\n  }\n\n  @if (!isLoading() && !isSuccessIconDisplayed()) {\n    {{ label() }}\n  }\n</button>\n", styles: [".spinner{display:inline-block;border-radius:50%;width:1em;height:1em;border:.215em solid transparent;vertical-align:middle;font-size:16px;border-top-color:#fff;animation:spin 1s cubic-bezier(.55,.15,.45,.85) infinite}.btn.btn-success{line-height:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: SubmitButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'skcr-submit-button', imports: [
+                        NgClass,
+                        NgIcon,
+                    ], template: "<button\n  class=\"btn btn-large w-full\"\n  type=\"button\"\n  [class]=\"colorVariant()\"\n  [ngClass]=\"{\n    'btn-success': isSuccessIconDisplayed(),\n    'btn-full': isFullWidth(),\n  }\"\n  [disabled]=\"isLoading() || isSuccessIconDisplayed() || isDisabled()\"\n  (click)=\"handleCLick()\"\n>\n  @if (isLoading()) {\n    <span class=\"spinner\"></span>\n  }\n\n  @if (isSuccessIconDisplayed()) {\n    <span class=\"flex items-center justify-center text-inherit\">\n      <ng-icon\n        name=\"heroCheck\"\n        size=\"20px\"\n      />\n    </span>\n  }\n\n  @if (!isLoading() && !isSuccessIconDisplayed()) {\n    {{ label() }}\n  }\n</button>\n", styles: [".spinner{display:inline-block;border-radius:50%;width:1em;height:1em;border:.215em solid transparent;vertical-align:middle;font-size:16px;border-top-color:#fff;animation:spin 1s cubic-bezier(.55,.15,.45,.85) infinite}.btn.btn-success{line-height:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], isFullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "isFullWidth", required: false }] }], isDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabled", required: false }] }], isSuccess: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSuccess", required: false }] }], colorVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "colorVariant", required: false }] }], submitClicked: [{ type: i0.Output, args: ["submitClicked"] }] } });
+
+/*
+ * Public API Surface of autechre
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Autechre, InputComponent, InputNumberComponent, MultiSelectComponent, SubmitButtonComponent };
+//# sourceMappingURL=skcr-autechre.mjs.map

package/fesm2022/skcr-autechre.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"skcr-autechre.mjs","sources":["../../../projects/skcr-autechre/src/lib/autechre.ts","../../../projects/skcr-autechre/src/lib/multi-select/multi-select.component.ts","../../../projects/skcr-autechre/src/lib/multi-select/multi-select.component.html","../../../projects/skcr-autechre/src/lib/input/input.component.ts","../../../projects/skcr-autechre/src/lib/input/input.component.html","../../../projects/skcr-autechre/src/lib/input-number/input-number.component.ts","../../../projects/skcr-autechre/src/lib/input-number/input-number.component.html","../../../projects/skcr-autechre/src/lib/submit-button/submit-button.component.ts","../../../projects/skcr-autechre/src/lib/submit-button/submit-button.component.html","../../../projects/skcr-autechre/src/public-api.ts","../../../projects/skcr-autechre/src/skcr-autechre.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n  selector: 'lib-autechre',\n  imports: [],\n  template: `\n    <p>\n      autechre works!\n    </p>\n  `,\n  styles: ``,\n})\nexport class Autechre {\n\n}\n","import {\n  Component,\n  computed,\n  effect,\n  ElementRef,\n  inject,\n  input,\n  InputSignal,\n  model,\n  ModelSignal,\n  OnDestroy,\n  Signal,\n  signal,\n  viewChild,\n  WritableSignal,\n} from '@angular/core';\nimport { animate, style, transition, trigger } from '@angular/animations';\nimport { FormsModule } from '@angular/forms';\nimport { NgClass } from '@angular/common';\nimport { ScrollingModule } from '@angular/cdk/scrolling';\nimport { NgIcon } from '@ng-icons/core';\nimport { FormValueControl } from '@angular/forms/signals';\nimport { TSelectOption } from '../types/select-option.type';\n\n@Component({\n  selector: 'skcr-multi-select',\n  templateUrl: './multi-select.component.html',\n  animations: [\n    trigger('AnimationTrigger0', [\n      transition(':leave', [\n        style({ opacity: 1 }),\n        animate('200ms ease-in-out', style({ opacity: 0 })),\n      ]),\n    ]),\n  ],\n  imports: [\n    FormsModule,\n    NgClass,\n    NgIcon,\n    ScrollingModule,\n  ],\n})\nexport class MultiSelectComponent implements FormValueControl<unknown[]>, OnDestroy {\n  options: InputSignal<TSelectOption<unknown>[]> = input.required();\n  label: InputSignal<string> = input('');\n  placeholder: InputSignal<string> = input('');\n  searchPlaceholder: InputSignal<string> = input('');\n  isInvalid: InputSignal<boolean> = input(false);\n  isDisabled: InputSignal<boolean> = input(false);\n  isSearchDisplayed: InputSignal<boolean> = input(false);\n  isOptional: InputSignal<boolean> = input(false);\n  isFullWidth: InputSignal<boolean> = input(false);\n  areValueDisplayedOutside: InputSignal<boolean> = input(false);\n  tooltipText: InputSignal<string> = input('');\n\n  readonly value: ModelSignal<unknown[]> = model<unknown[]>([]);\n\n  searchTerm: Signal<string> = signal('');\n  isOpen: WritableSignal<boolean> = signal(false);\n  dropdownTop = 0;\n  dropdownLeft = 0;\n  dropdownWidth = 0;\n\n  formattedOptions: Signal<TSelectOption<unknown>[]> = computed(() => {\n    let formattedOptions: TSelectOption<unknown>[] = this.options() || [];\n\n    if (formattedOptions[0]?.value === undefined) {\n      formattedOptions = formattedOptions.map(option => {\n        return {\n          ...option,\n          value: option.id,\n        };\n      });\n    }\n\n    return formattedOptions;\n  });\n\n  filteredOptions: Signal<TSelectOption<unknown>[]> = computed(() => {\n    const normalizedQuery: string = this.normalizeString(this.searchTerm());\n\n    return this.formattedOptions().filter(option => {\n      return this.normalizeString(option.name).includes(normalizedQuery);\n    });\n  });\n\n  selectedOptions = computed(() => {\n    return this.formattedOptions().filter(option => this.value()!.includes(option.value));\n  });\n\n  selectedOptionsText = computed(() => {\n    return this.selectedOptions()\n      .map(option => option.name)\n      .join(', ');\n  });\n\n  private elRef: ElementRef = inject(ElementRef);\n  readonly searchInputEl = viewChild<ElementRef<HTMLInputElement>>('searchInput');\n\n  constructor() {\n    effect(() => {\n      const disabledSelectedOptions = this.formattedOptions().filter(\n        option => option.isDisabled && this.value()?.includes(option.value),\n      );\n\n      if (disabledSelectedOptions.length > 0) {\n        const updatedValue = this.value()?.filter(\n          value => !disabledSelectedOptions.some(option => option.value === value),\n        );\n        this.value.set(updatedValue || []);\n      }\n    });\n  }\n\n  toggleSelect(event?: MouseEvent): void {\n    if (event?.defaultPrevented) {\n      return;\n    }\n\n    this.isOpen.update(isOpen => !isOpen);\n\n    if (this.isOpen()) {\n      this.updateDropdownPosition();\n      document.addEventListener('click', this.clickOutsideHandler);\n      window.addEventListener('resize', this.resizeHandler);\n      window.addEventListener('scroll', this.resizeHandler, true);\n      this.focusSearchInput();\n    } else {\n      document.removeEventListener('click', this.clickOutsideHandler);\n      window.removeEventListener('resize', this.resizeHandler);\n      window.removeEventListener('scroll', this.resizeHandler, true);\n    }\n  }\n\n  handleOptionClick(item: TSelectOption<unknown>): void {\n    if (!item.isDisabled) {\n      const itemIndex = this.value()!.indexOf(item.value!);\n      const updatedValue = [\n        ...this.value()!,\n      ];\n\n      if (itemIndex >= 0) {\n        updatedValue.splice(itemIndex, 1);\n      } else {\n        updatedValue.push(item.value!);\n      }\n\n      this.value.set(updatedValue);\n    }\n  }\n\n  isItemSelected(item: TSelectOption<unknown>): boolean {\n    return this.value()!.includes(item.value);\n  }\n\n  clearAllSelections(event: MouseEvent): void {\n    this.value.set([]);\n    event.stopPropagation();\n  }\n\n  removeOption(option: TSelectOption<unknown>, event: MouseEvent): void {\n    event.stopPropagation();\n    event.preventDefault();\n\n    const updatedValue = this.value()!.filter(value => value !== option.value);\n    this.value.set(updatedValue);\n  }\n\n  ngOnDestroy(): void {\n    document.removeEventListener('click', this.clickOutsideHandler);\n    window.removeEventListener('resize', this.resizeHandler);\n    window.removeEventListener('scroll', this.resizeHandler, true);\n  }\n\n  private updateDropdownPosition(): void {\n    const buttonElement = this.elRef.nativeElement.querySelector('button');\n    if (buttonElement) {\n      const rect = buttonElement.getBoundingClientRect();\n      this.dropdownTop = rect.bottom + window.scrollY;\n      this.dropdownLeft = rect.left + window.scrollX;\n      this.dropdownWidth = rect.width;\n    }\n  }\n\n  private resizeHandler = (): void => {\n    if (this.isOpen()) {\n      this.updateDropdownPosition();\n    }\n  };\n\n  private focusSearchInput(): void {\n    if (!this.isOpen() || !this.isSearchDisplayed()) return;\n    setTimeout(() => {\n      requestAnimationFrame(() => {\n        const inputRef = this.searchInputEl();\n        const inputEl = inputRef?.nativeElement;\n        if (inputEl) {\n          inputEl.focus();\n          try {\n            inputEl.select?.();\n          } catch {}\n        }\n      });\n    }, 1);\n  }\n\n  private clickOutsideHandler: (e: MouseEvent) => void = (e: MouseEvent): void => {\n    if (!this.elRef.nativeElement.contains(e.target) && this.isOpen()) {\n      this.toggleSelect();\n    }\n  };\n\n  private normalizeString(value: string): string {\n    return value\n      .normalize('NFD')\n      .replace(/[\\u0300-\\u036f]/g, '')\n      .toLocaleLowerCase();\n  }\n\n  trackByValue(index: number, item: TSelectOption<unknown>): unknown {\n    return item.value;\n  }\n\n  protected readonly Math = Math;\n}\n","<div>\n  @if (label()) {\n    <label\n      class=\"flex items-center justify-between\"\n      id=\"multiselect-label\"\n    >\n      <div class=\"flex items-center gap-2\">\n        {{ label() }}\n\n        @if (isOptional()) {\n          <span class=\"text-xs text-slate-500\">Optional</span>\n        }\n      </div>\n\n      @if (tooltipText()) {\n        <div class=\"flex items-center has-tooltip\">\n          <ng-icon\n            class=\"size-4\"\n            name=\"heroQuestionMarkCircle\"\n          />\n\n          <div class=\"tooltip bg-gray-800 text-white -left-50 top-4 p-2 rounded text-xs max-w-md whitespace-normal\">\n            {{ tooltipText() }}\n          </div>\n        </div>\n      }\n    </label>\n  }\n\n  <div class=\"relative mt-1\">\n    <button\n      class=\"grid w-full min-h-9 cursor-default grid-cols-1 rounded-md shadow-sm py-2 px-3 text-left outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary sm:text-body-small/6\"\n      (click)=\"toggleSelect($event)\"\n      [disabled]=\"isDisabled() || !options().length\"\n      [ngClass]=\"{\n        'outline-destructive focus:outline-destructive focus:ring-destructive': isInvalid(),\n        'outline-border-color focus:outline-primaryBlue focus:ring-primaryBlue': !isInvalid(),\n        'cursor-not-allowed bg-slate-50': isDisabled() || !options().length,\n        'cursor-pointer bg-white': !isDisabled() && !!options().length,\n      }\"\n      type=\"button\"\n      aria-expanded=\"true\"\n      aria-haspopup=\"listbox\"\n      aria-labelledby=\"multiselect-label\"\n    >\n      <div class=\"col-start-1 row-start-1 block gap-2 truncate pr-12\">\n        @if (!selectedOptions()!.length || !!areValueDisplayedOutside()) {\n          <span>\n            {{ placeholder() }}\n          </span>\n        } @else {\n          <div class=\"flex flex-wrap gap-1 max-h-[4rem] overflow-auto scrollbar-hide relative\">\n            @for (selectedOption of selectedOptions(); track selectedOption.value) {\n              <span\n                class=\"px-2 py-0.5 bg-primary-50 text-primary-800 rounded-lg text-caption font-medium flex items-center gap-1\"\n              >\n                {{ selectedOption.name }}\n\n                <span\n                  class=\"cursor-pointer text-primary-800 flex items-center\"\n                  (mousedown)=\"removeOption(selectedOption, $event)\"\n                  (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n                >\n                  <ng-icon\n                    class=\"size-4\"\n                    name=\"heroXMark\"\n                  />\n                </span>\n              </span>\n            }\n          </div>\n        }\n      </div>\n\n      <span class=\"col-start-1 row-start-1 flex items-center gap-2 self-center justify-self-end text-slate-500\">\n        <span class=\"size-5 sm:size-4\">\n          <ng-icon name=\"heroChevronUpDown\" />\n        </span>\n      </span>\n    </button>\n\n    @if (isOpen()) {\n      <div\n        class=\"fixed z-50 w-full rounded-md bg-white text-base shadow-lg ring-1 ring-black/5 focus:outline-hidden sm:text-body-small overflow-hidden\"\n        [style.top.px]=\"dropdownTop\"\n        [style.left.px]=\"dropdownLeft\"\n        [style.width.px]=\"dropdownWidth\"\n        @AnimationTrigger0\n        role=\"listbox\"\n        aria-labelledby=\"multiselect-label\"\n      >\n        @if (isSearchDisplayed()) {\n          <div class=\"relative cursor-default py-2 px-3 shadow-sm select-none\">\n            <div class=\"pointer-events-none absolute inset-y-0 left-1 flex items-center pl-3\">\n              <span class=\"flex items-center\">\n                <ng-icon name=\"heroMagnifyingGlass\" />\n              </span>\n            </div>\n\n            <input\n              class=\"block rounded-md w-full pl-6 pr-3 py-2 text-body-small shadow-sm outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary placeholder:text-slate-500\"\n              #searchInput\n              type=\"text\"\n              [placeholder]=\"searchPlaceholder()\"\n              [(ngModel)]=\"searchTerm\"\n              (click)=\"$event.stopPropagation()\"\n            />\n          </div>\n        }\n\n        <cdk-virtual-scroll-viewport\n          class=\"w-full\"\n          [itemSize]=\"40\"\n          [style.height.px]=\"Math.min(filteredOptions().length * 40, 224)\"\n        >\n          <div\n            class=\"relative cursor-default py-2 pr-9 pl-3 select-none\"\n            *cdkVirtualFor=\"let option of filteredOptions(); trackBy: trackByValue; let i = index\"\n            (click)=\"handleOptionClick(option)\"\n            [class.bg-slate-50]=\"!!option.isDisabled\"\n            [class.hover:bg-primary-50]=\"!option.isDisabled\"\n            [id]=\"'listbox-option-' + i\"\n            role=\"option\"\n          >\n            <span class=\"block truncate\">\n              {{ option.name }}\n            </span>\n\n            @if (isItemSelected(option)) {\n              <span class=\"absolute inset-y-0 right-0 flex items-center pr-4 text-primary\">\n                <ng-icon name=\"heroCheck\" />\n              </span>\n            }\n          </div>\n        </cdk-virtual-scroll-viewport>\n      </div>\n    }\n  </div>\n</div>\n","import { NgClass } from '@angular/common';\nimport { Component, input, InputSignal, model } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { FormValueControl } from '@angular/forms/signals';\nimport { NgIcon } from '@ng-icons/core';\n\n@Component({\n  selector: 'skcr-input',\n  templateUrl: './input.component.html',\n  styleUrls: [\n    './input.component.scss',\n  ],\n  imports: [\n    FormsModule,\n    NgClass,\n    NgIcon\n  ],\n})\nexport class InputComponent implements FormValueControl<string | number | undefined | null> {\n  id: InputSignal<string> = input('');\n  type: InputSignal<string> = input('text');\n  label: InputSignal<string> = input('');\n  placeholder: InputSignal<string> = input('');\n  isOptional: InputSignal<boolean> = input(false);\n  isSearchInput: InputSignal<boolean> = input(false);\n  isInvalid: InputSignal<boolean> = input(false);\n  isDisabled: InputSignal<boolean> = input(false);\n\n  readonly value = model<string | number | undefined | null>();\n\n  handleChange(event: Event) {\n    const newValue = (event.target as HTMLInputElement).value;\n    this.value.set(newValue);\n  }\n}\n","<div>\n  @if (label()) {\n    <label\n      class=\"mb-1 flex items-center gap-2\"\n      [for]=\"id()\"\n    >\n      {{ label() }}\n\n      @if (isOptional()) {\n        <span class=\"text-slate-500\"> Optional </span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    @if (isSearchInput()) {\n      <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3\">\n        <span class=\"flex items-center\">\n          <ng-icon name=\"heroMagnifyingGlass\" />\n        </span>\n      </div>\n    }\n\n    <input\n      class=\"block w-full rounded-md px-3 py-2 text-body-small shadow-sm outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary placeholder:text-slate-500\"\n      [id]=\"id() || label()\"\n      [name]=\"id()\"\n      [type]=\"type()\"\n      [placeholder]=\"placeholder()\"\n      [disabled]=\"isDisabled()\"\n      [(ngModel)]=\"value\"\n      (input)=\"handleChange($event)\"\n      [ngClass]=\"{\n        'pl-10': isSearchInput(),\n        'outline-destructive placeholder-destructive focus:outline-destructive focus:ring-destructive': isInvalid(),\n        'outline-lightGrey focus:outline-primary focus:ring-primary': !isInvalid(),\n        'cursor-not-allowed bg-slate-50': isDisabled(),\n      }\"\n    />\n  </div>\n</div>\n","import { NgClass } from '@angular/common';\nimport { Component, input, InputSignal, model } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { FormValueControl } from '@angular/forms/signals';\nimport { NgIcon } from '@ng-icons/core';\n\n@Component({\n  selector: 'skcr-input-number',\n  templateUrl: './input-number.component.html',\n  imports: [\n    NgClass,\n    FormsModule,\n    NgIcon,\n  ],\n})\nexport class InputNumberComponent implements FormValueControl<number | undefined> {\n  name: InputSignal<string> = input<string>('');\n  label: InputSignal<string> = input<string>('');\n  placeholder: InputSignal<string> = input<string>('');\n  maxFractionDigits: InputSignal<number> = input<number>(0);\n  isInvalid: InputSignal<boolean> = input<boolean>(false);\n  tooltipText: InputSignal<string> = input<string>('');\n\n  readonly value = model<number | undefined>();\n\n  inputPattern = `^\\\\d+\\\\.?\\\\d{0,${this.maxFractionDigits()}}$`;\n\n  handleKeyDown(event: KeyboardEvent): void {\n    if (\n      !(\n        (event.key >= '0' && event.key <= '9') ||\n        [\n          'Backspace',\n          'Tab',\n          'ArrowLeft',\n          'ArrowRight',\n          'Delete',\n          'Home',\n          'End',\n        ].includes(event.key)\n      )\n    ) {\n      event.preventDefault();\n    }\n  }\n\n  handleChange(event: Event) {\n    const value = (event.target as HTMLInputElement).value;\n\n    this.value.set(value === '' ? undefined : +value);\n  }\n}\n","<div>\n  <label\n    class=\"mb-1 flex items-center justify-between\"\n    [for]=\"name()\"\n  >\n    <div class=\"flex items-center gap-2\">\n      {{ label() }}\n    </div>\n\n    @if (tooltipText()) {\n      <div class=\"flex items-center has-tooltip\">\n        <ng-icon\n          class=\"size-4\"\n          name=\"heroQuestionMarkCircle\"\n        />\n\n        <div class=\"tooltip bg-gray-800 text-white -left-50 top-4 p-2 rounded text-xs max-w-md whitespace-normal\">\n          {{ tooltipText() }}\n        </div>\n      </div>\n    }\n  </label>\n\n  <input\n    class=\"block w-full rounded-md px-3 py-2 text-body-small shadow-sm outline-1 -outline-offset-1 outline-border-color focus:outline-2 focus:-outline-offset-2 focus:outline-primary placeholder:text-slate-500\"\n    [id]=\"name()\"\n    [name]=\"name()\"\n    type=\"text\"\n    inputmode=\"numeric\"\n    [pattern]=\"inputPattern\"\n    [placeholder]=\"placeholder()\"\n    (keydown)=\"handleKeyDown($event)\"\n    [(ngModel)]=\"value\"\n    (input)=\"handleChange($event)\"\n    [ngClass]=\"{\n      'outline-destructive placeholder-destructive focus:outline-destructive focus:ring-destructive': isInvalid(),\n      'outline-lightGrey focus:outline-primary focus:ring-primary': !isInvalid(),\n    }\"\n  />\n</div>\n","import { NgClass } from '@angular/common';\nimport { Component, effect, input, InputSignal, output, signal, WritableSignal } from '@angular/core';\nimport { NgIcon } from '@ng-icons/core';\n\nenum EButtonColorVariant {\n  Primary = 'btn-primary',\n  Danger = 'btn-danger',\n}\n\n@Component({\n  selector: 'skcr-submit-button',\n  templateUrl: './submit-button.component.html',\n  styleUrls: [\n    './submit-button.component.scss',\n  ],\n  imports: [\n    NgClass,\n    NgIcon,\n  ],\n})\nexport class SubmitButtonComponent {\n  label: InputSignal<string> = input('');\n  isLoading: InputSignal<boolean> = input<boolean>(false);\n  isFullWidth: InputSignal<boolean> = input<boolean>(false);\n  isDisabled: InputSignal<boolean> = input<boolean>(false);\n  isSuccess: InputSignal<boolean> = input<boolean>(false);\n  colorVariant: InputSignal<EButtonColorVariant> = input<EButtonColorVariant>(EButtonColorVariant.Primary);\n  submitClicked = output<void>();\n\n  constructor() {\n    effect(() => {\n      if (this.isSuccess()) {\n        this.isSuccessIconDisplayed.set(true);\n\n        setTimeout(() => {\n          this.isSuccessIconDisplayed.set(false);\n        }, 1000);\n      }\n    });\n  }\n\n  isSuccessIconDisplayed: WritableSignal<boolean> = signal(false);\n\n  handleCLick(): void {\n    this.submitClicked.emit();\n  }\n}\n","<button\n  class=\"btn btn-large w-full\"\n  type=\"button\"\n  [class]=\"colorVariant()\"\n  [ngClass]=\"{\n    'btn-success': isSuccessIconDisplayed(),\n    'btn-full': isFullWidth(),\n  }\"\n  [disabled]=\"isLoading() || isSuccessIconDisplayed() || isDisabled()\"\n  (click)=\"handleCLick()\"\n>\n  @if (isLoading()) {\n    <span class=\"spinner\"></span>\n  }\n\n  @if (isSuccessIconDisplayed()) {\n    <span class=\"flex items-center justify-center text-inherit\">\n      <ng-icon\n        name=\"heroCheck\"\n        size=\"20px\"\n      />\n    </span>\n  }\n\n  @if (!isLoading() && !isSuccessIconDisplayed()) {\n    {{ label() }}\n  }\n</button>\n","/*\n * Public API Surface of autechre\n */\n\nexport * from './lib/autechre';\nexport * from './lib/multi-select/multi-select.component';\nexport * from './lib/input/input.component';\nexport * from './lib/input-number/input-number.component';\nexport * from './lib/submit-button/submit-button.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "skcr-autechre",
+  "version": "0.0.1",
+  "peerDependencies": {
+    "@ng-icons/core": "^31.3.0",
+    "@ng-icons/heroicons": "^31.3.0",
+    "@angular/animations": "^21.0.0",
+    "@angular/cdk": "^21.0.0",
+    "@angular/common": "^21.0.0",
+    "@angular/core": "^21.0.0"
+  },
+  "module": "fesm2022/skcr-autechre.mjs",
+  "typings": "types/skcr-autechre.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./types/skcr-autechre.d.ts",
+      "default": "./fesm2022/skcr-autechre.mjs"
+    }
+  },
+  "sideEffects": false,
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
+}

package/types/skcr-autechre.d.ts

@@ -0,0 +1,109 @@
+import * as i0 from '@angular/core';
+import { OnDestroy, InputSignal, ModelSignal, Signal, WritableSignal, ElementRef } from '@angular/core';
+import { FormValueControl } from '@angular/forms/signals';
+
+declare class Autechre {
+    static ɵfac: i0.ɵɵFactoryDeclaration<Autechre, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Autechre, "lib-autechre", never, {}, {}, never, never, true, never>;
+}
+
+type TSelectOption<T> = {
+    name: string;
+    value?: T;
+    id?: number;
+    icon?: string;
+    isDisabled?: boolean;
+};
+
+declare class MultiSelectComponent implements FormValueControl<unknown[]>, OnDestroy {
+    options: InputSignal<TSelectOption<unknown>[]>;
+    label: InputSignal<string>;
+    placeholder: InputSignal<string>;
+    searchPlaceholder: InputSignal<string>;
+    isInvalid: InputSignal<boolean>;
+    isDisabled: InputSignal<boolean>;
+    isSearchDisplayed: InputSignal<boolean>;
+    isOptional: InputSignal<boolean>;
+    isFullWidth: InputSignal<boolean>;
+    areValueDisplayedOutside: InputSignal<boolean>;
+    tooltipText: InputSignal<string>;
+    readonly value: ModelSignal<unknown[]>;
+    searchTerm: Signal<string>;
+    isOpen: WritableSignal<boolean>;
+    dropdownTop: number;
+    dropdownLeft: number;
+    dropdownWidth: number;
+    formattedOptions: Signal<TSelectOption<unknown>[]>;
+    filteredOptions: Signal<TSelectOption<unknown>[]>;
+    selectedOptions: Signal<TSelectOption<unknown>[]>;
+    selectedOptionsText: Signal<string>;
+    private elRef;
+    readonly searchInputEl: Signal<ElementRef<HTMLInputElement> | undefined>;
+    constructor();
+    toggleSelect(event?: MouseEvent): void;
+    handleOptionClick(item: TSelectOption<unknown>): void;
+    isItemSelected(item: TSelectOption<unknown>): boolean;
+    clearAllSelections(event: MouseEvent): void;
+    removeOption(option: TSelectOption<unknown>, event: MouseEvent): void;
+    ngOnDestroy(): void;
+    private updateDropdownPosition;
+    private resizeHandler;
+    private focusSearchInput;
+    private clickOutsideHandler;
+    private normalizeString;
+    trackByValue(index: number, item: TSelectOption<unknown>): unknown;
+    protected readonly Math: Math;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectComponent, "skcr-multi-select", never, { "options": { "alias": "options"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "isInvalid": { "alias": "isInvalid"; "required": false; "isSignal": true; }; "isDisabled": { "alias": "isDisabled"; "required": false; "isSignal": true; }; "isSearchDisplayed": { "alias": "isSearchDisplayed"; "required": false; "isSignal": true; }; "isOptional": { "alias": "isOptional"; "required": false; "isSignal": true; }; "isFullWidth": { "alias": "isFullWidth"; "required": false; "isSignal": true; }; "areValueDisplayedOutside": { "alias": "areValueDisplayedOutside"; "required": false; "isSignal": true; }; "tooltipText": { "alias": "tooltipText"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+}
+
+declare class InputComponent implements FormValueControl<string | number | undefined | null> {
+    id: InputSignal<string>;
+    type: InputSignal<string>;
+    label: InputSignal<string>;
+    placeholder: InputSignal<string>;
+    isOptional: InputSignal<boolean>;
+    isSearchInput: InputSignal<boolean>;
+    isInvalid: InputSignal<boolean>;
+    isDisabled: InputSignal<boolean>;
+    readonly value: i0.ModelSignal<string | number | null | undefined>;
+    handleChange(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputComponent, "skcr-input", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "isOptional": { "alias": "isOptional"; "required": false; "isSignal": true; }; "isSearchInput": { "alias": "isSearchInput"; "required": false; "isSignal": true; }; "isInvalid": { "alias": "isInvalid"; "required": false; "isSignal": true; }; "isDisabled": { "alias": "isDisabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+}
+
+declare class InputNumberComponent implements FormValueControl<number | undefined> {
+    name: InputSignal<string>;
+    label: InputSignal<string>;
+    placeholder: InputSignal<string>;
+    maxFractionDigits: InputSignal<number>;
+    isInvalid: InputSignal<boolean>;
+    tooltipText: InputSignal<string>;
+    readonly value: i0.ModelSignal<number | undefined>;
+    inputPattern: string;
+    handleKeyDown(event: KeyboardEvent): void;
+    handleChange(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputNumberComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputNumberComponent, "skcr-input-number", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "maxFractionDigits": { "alias": "maxFractionDigits"; "required": false; "isSignal": true; }; "isInvalid": { "alias": "isInvalid"; "required": false; "isSignal": true; }; "tooltipText": { "alias": "tooltipText"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+}
+
+declare enum EButtonColorVariant {
+    Primary = "btn-primary",
+    Danger = "btn-danger"
+}
+declare class SubmitButtonComponent {
+    label: InputSignal<string>;
+    isLoading: InputSignal<boolean>;
+    isFullWidth: InputSignal<boolean>;
+    isDisabled: InputSignal<boolean>;
+    isSuccess: InputSignal<boolean>;
+    colorVariant: InputSignal<EButtonColorVariant>;
+    submitClicked: i0.OutputEmitterRef<void>;
+    constructor();
+    isSuccessIconDisplayed: WritableSignal<boolean>;
+    handleCLick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SubmitButtonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SubmitButtonComponent, "skcr-submit-button", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "isFullWidth": { "alias": "isFullWidth"; "required": false; "isSignal": true; }; "isDisabled": { "alias": "isDisabled"; "required": false; "isSignal": true; }; "isSuccess": { "alias": "isSuccess"; "required": false; "isSignal": true; }; "colorVariant": { "alias": "colorVariant"; "required": false; "isSignal": true; }; }, { "submitClicked": "submitClicked"; }, never, never, true, never>;
+}
+
+export { Autechre, InputComponent, InputNumberComponent, MultiSelectComponent, SubmitButtonComponent };