@agorapulse/ui-components 0.0.3 → 1.0.0-SNAPSHOT-YOUTUBE.2

package/fesm2022/agorapulse-ui-components-legacy-input.mjs

@@ -0,0 +1,196 @@
+import { SymbolRegistry, apErrorFill, apRoundedCheckFill, apClose, apSearch, SymbolComponent } from '@agorapulse/ui-symbol';
+import * as i0 from '@angular/core';
+import { forwardRef, inject, ElementRef, EventEmitter, signal, booleanAttribute, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChildren, ViewChild, Input, Output } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormsModule } from '@angular/forms';
+
+const AP_INPUT_CONTROL_VALUE_ACCESSOR = {
+    provide: NG_VALUE_ACCESSOR,
+    useExisting: forwardRef(() => InputComponent),
+    multi: true,
+};
+const SEARCH_SYMBOL_ID = 'search';
+/**
+ * @deprecated use native input with directive apInput, ap-input-group and ap-form-field instead
+ */
+class InputComponent {
+    elementRef = inject(ElementRef);
+    symbolRegistry = inject(SymbolRegistry);
+    symbols;
+    symbolWrapper;
+    inputElement;
+    ariaLabel;
+    ariaLabelledBy;
+    ariaDescribedBy;
+    disabled = false;
+    clearable = false;
+    inputType = 'text';
+    inputId;
+    name;
+    label;
+    description;
+    prefix;
+    suffix;
+    required = false;
+    placeholder;
+    errorMessage;
+    successMessage;
+    symbolId;
+    symbolPosition = 'right';
+    // eslint-disable-next-line @angular-eslint/no-output-native
+    focus = new EventEmitter();
+    // eslint-disable-next-line @angular-eslint/no-output-native
+    blur = new EventEmitter();
+    // eslint-disable-next-line @angular-eslint/no-output-native
+    keyup = new EventEmitter();
+    _controlValueAccessorChangeFn;
+    hostDataTest = signal(undefined);
+    value;
+    onTouched;
+    ngOnInit() {
+        if (this.label && !this.inputId) {
+            throw Error('You have to provide an input id if you want to use a label.');
+        }
+        if (this.inputType === 'search') {
+            this.symbolId = SEARCH_SYMBOL_ID;
+            this.symbolPosition = 'left';
+        }
+        this.hostDataTest.set(this.elementRef.nativeElement.getAttribute('data-test'));
+        this.elementRef.nativeElement.removeAttribute('data-test');
+        this.symbolRegistry.registerSymbols([apErrorFill, apRoundedCheckFill, apClose, apSearch]);
+    }
+    // Sometimes attributes like the id, or the data-test are dynamic and can change between the constructor and the initialization.
+    // In order to have the last attributes value we check if it changes, and if it does, we run a mark for check to update the view.
+    ngAfterViewInit() {
+        const hostDataTest = this.elementRef.nativeElement.getAttribute('data-test');
+        if (hostDataTest && this.hostDataTest() !== hostDataTest) {
+            this.hostDataTest.set(hostDataTest);
+            this.elementRef.nativeElement.removeAttribute('data-test');
+        }
+    }
+    validate() {
+        const isNotValid = !this.value && this.required;
+        return (isNotValid && {
+            invalid: true,
+        });
+    }
+    onValueChange() {
+        if (this.onTouched) {
+            this.onTouched();
+        }
+        if (!this.disabled) {
+            if (this._controlValueAccessorChangeFn) {
+                this._controlValueAccessorChangeFn(this.value);
+            }
+        }
+    }
+    writeValue(value) {
+        this.value = value;
+    }
+    registerOnChange(fn) {
+        this._controlValueAccessorChangeFn = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+    }
+    focusInput() {
+        this.inputElement.nativeElement.focus();
+    }
+    onBlurHandle($event) {
+        this.blur.emit($event);
+    }
+    onFocusHandle($event) {
+        this.focus.emit($event);
+    }
+    onKeyup($event) {
+        this.keyup.emit($event);
+    }
+    onClear() {
+        this.writeValue(null);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: InputComponent, isStandalone: true, selector: "ap-input", inputs: { ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaDescribedBy: "ariaDescribedBy", disabled: "disabled", clearable: "clearable", inputType: "inputType", inputId: "inputId", name: "name", label: "label", description: "description", prefix: "prefix", suffix: "suffix", required: ["required", "required", booleanAttribute], placeholder: "placeholder", errorMessage: "errorMessage", successMessage: "successMessage", symbolId: "symbolId", symbolPosition: "symbolPosition" }, outputs: { focus: "focus", blur: "blur", keyup: "keyup" }, providers: [
+            AP_INPUT_CONTROL_VALUE_ACCESSOR,
+            {
+                provide: NG_VALIDATORS,
+                useExisting: InputComponent,
+                multi: true,
+            },
+        ], queries: [{ propertyName: "symbols", predicate: SymbolComponent }], viewQueries: [{ propertyName: "symbolWrapper", first: true, predicate: ["symbol"], descendants: true }, { propertyName: "inputElement", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "@if (label) {\n    <label [for]=\"inputId\">\n        <span>\n            {{ label }}\n        </span>\n        @if (description) {\n            <span class=\"description\">\n                {{ description }}\n            </span>\n        }\n    </label>\n}\n\n<div\n    tabindex=\"0\"\n    class=\"input-wrapper\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [class.with-icon]=\"symbolId\"\n    [class.with-prefix]=\"prefix\"\n    [class.with-suffix]=\"suffix\"\n    [class.with-error]=\"errorMessage\"\n    [class.with-success]=\"successMessage\"\n    [class.disabled]=\"disabled\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-labelledby]=\"ariaLabelledBy || null\"\n    [attr.aria-describedby]=\"ariaDescribedBy || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"focusInput()\"\n    (keydown.enter)=\"focusInput()\">\n    @if (prefix) {\n        <div class=\"prefix\">\n            <span>\n                {{ prefix }}\n            </span>\n            <span class=\"divider\"></span>\n        </div>\n    }\n    <div class=\"content\">\n        <input\n            #input\n            [type]=\"inputType\"\n            [disabled]=\"disabled\"\n            [placeholder]=\"placeholder\"\n            [id]=\"inputId ?? ''\"\n            [attr.data-test]=\"hostDataTest() ? hostDataTest() : name\"\n            [(ngModel)]=\"value\"\n            (blur)=\"onBlurHandle($event)\"\n            (focus)=\"onFocusHandle($event)\"\n            (keyup)=\"onKeyup($event)\"\n            (ngModelChange)=\"onValueChange()\" />\n        @if (clearable) {\n            <button\n                type=\"button\"\n                class=\"clear-button\"\n                (click)=\"onClear()\">\n                <ap-symbol symbolId=\"close\" />\n            </button>\n        }\n    </div>\n    @if (suffix) {\n        <div class=\"suffix\">\n            <span class=\"divider\"></span>\n            <span>\n                {{ suffix }}\n            </span>\n        </div>\n    }\n    @if (symbolId) {\n        <ap-symbol\n            size=\"sm\"\n            [symbolId]=\"symbolId\" />\n    }\n</div>\n\n@if (errorMessage) {\n    <div class=\"form-message error\">\n        <ap-symbol\n            symbolId=\"error_fill\"\n            size=\"sm\" />\n        <span>\n            {{ errorMessage }}\n        </span>\n    </div>\n}\n\n@if (successMessage) {\n    <div class=\"form-message success\">\n        <ap-symbol\n            symbolId=\"rounded-check_fill\"\n            size=\"sm\" />\n        <span>\n            {{ successMessage }}\n        </span>\n    </div>\n}\n", styles: ["ap-input{display:flex;flex-direction:column;gap:var(--comp-input-spacing-horizontal);--border-width: 1px}ap-input.full-width{width:100%}ap-input.full-width .input-wrapper{min-width:100%}ap-input label{display:flex;flex-direction:column;gap:var(--comp-forms-label-spacing-vertical);font-size:var(--comp-forms-label-size);font-weight:var(--comp-forms-label-font-weight);line-height:var(--comp-forms-label-line-height);font-family:var(--comp-forms-label-font-family);color:var(--comp-forms-label-text-color)}ap-input label .description{font-size:var(--comp-forms-label-description-text-size);font-weight:var(--comp-forms-label-description-text-font-weight);line-height:var(--comp-forms-label-description-text-line-height);font-family:var(--comp-forms-label-description-text-font-family);color:var(--comp-forms-label-description-text-color)}ap-input .input-wrapper{display:flex;align-items:center;position:relative;min-width:var(--comp-input-width-default);height:var(--comp-input-height);border:var(--border-width) solid var(--comp-input-border-default-color);box-sizing:border-box;border-radius:var(--comp-input-border-radius);overflow:hidden;background-color:var(--comp-input-fill-color)}ap-input .input-wrapper:hover:not(.disabled){border-color:var(--comp-input-border-hover-color)}ap-input .input-wrapper:focus-within:not(.disabled){border-color:var(--comp-input-border-focused-color)}ap-input .input-wrapper:focus-visible:not(.disabled){outline:none}ap-input .input-wrapper:active:not(.disabled){border-color:var(--comp-input-border-focused-color)}ap-input .input-wrapper.disabled{background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input .input-wrapper .content{display:flex;gap:var(--comp-input-spacing-horizontal);flex:1;align-items:center}ap-input .input-wrapper .content input{border:none;outline:none;box-sizing:border-box;min-height:34px;max-height:34px;padding:0 var(--comp-input-padding-horizontal);flex:1;font-size:var(--comp-input-text-size);font-weight:var(--comp-input-text-font-weight);line-height:var(--comp-input-text-line-height);font-family:var(--comp-input-text-font-family);color:var(--comp-input-text-default-color);min-width:0}ap-input .input-wrapper .content input::placeholder{color:var(--comp-input-text-placeholder-color)}ap-input .input-wrapper .content input:disabled{cursor:not-allowed;pointer-events:none;background:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input .input-wrapper .content input:disabled:placeholder{color:var(--comp-input-text-placeholder-color)}ap-input .input-wrapper .content input[type=search]::-webkit-search-decoration,ap-input .input-wrapper .content input[type=search]::-webkit-search-cancel-button,ap-input .input-wrapper .content input[type=search]::-webkit-search-results-button,ap-input .input-wrapper .content input[type=search]::-webkit-search-results-decoration{display:none}ap-input .input-wrapper .content .counter{font-size:var(--comp-input-text-counter-size);font-weight:var(--comp-input-text-counter-font-weight);line-height:var(--comp-input-text-counter-line-height);font-family:var(--comp-input-text-counter-font-family);color:var(--comp-input-text-counter-color);padding-right:var(--comp-input-spacing-horizontal)}ap-input .input-wrapper .content .clear-button{display:flex;align-items:center;justify-content:center;border:none;margin:0;padding:0 var(--comp-input-spacing-horizontal) 0 0;background-color:transparent}ap-input .input-wrapper .content .clear-button:hover{cursor:pointer}ap-input .input-wrapper .content .clear-button ap-symbol{padding:0}ap-input .input-wrapper .prefix,ap-input .input-wrapper .suffix{height:100%;display:flex;justify-content:center;align-items:center;font-size:var(--sys-text-style-body-size);font-weight:var(--sys-text-style-body-weight);line-height:var(--sys-text-style-body-line-height);font-family:var(--ref-font-family);color:var(--ref-color-grey-100)}ap-input .input-wrapper .prefix .divider,ap-input .input-wrapper .suffix .divider{height:18px;width:var(--border-width);background:var(--ref-color-grey-10)}ap-input .input-wrapper ap-symbol{height:var(--comp-input-icon-size);width:var(--comp-input-icon-size);min-height:var(--comp-input-icon-size);min-width:var(--comp-input-icon-size);max-height:var(--comp-input-icon-size);max-width:var(--comp-input-icon-size);color:var(--comp-input-icon-color);padding-right:var(--comp-input-padding-horizontal);pointer-events:none;box-sizing:content-box}ap-input .input-wrapper ap-symbol:hover{cursor:text}ap-input .input-wrapper.inverse{flex-direction:row-reverse}ap-input .input-wrapper.inverse.with-icon input{padding-left:0}ap-input .input-wrapper.inverse.with-icon ap-symbol{padding-right:var(--comp-input-spacing-horizontal);padding-left:var(--comp-input-padding-horizontal)}ap-input .input-wrapper.with-icon input{padding-right:var(--ref-spacing-xxxs)}ap-input .input-wrapper.with-prefix input{padding-left:var(--ref-spacing-xxs)}ap-input .input-wrapper.with-prefix .prefix{padding-left:var(--comp-input-padding-horizontal);gap:var(--ref-spacing-xxs)}ap-input .input-wrapper.with-suffix input{padding-right:var(--ref-spacing-xxs)}ap-input .input-wrapper.with-suffix .suffix{padding-right:var(--comp-input-padding-horizontal);gap:var(--ref-spacing-xxs)}ap-input .input-wrapper.with-counter input{padding-right:0}ap-input .input-wrapper.with-error{border-color:var(--comp-input-border-error-color)}ap-input .input-wrapper.with-success{border-color:var(--comp-input-border-success-color)}.form-message{font-size:var(--comp-forms-status-text-size);font-weight:var(--comp-forms-status-text-font-weight);line-height:var(--comp-forms-status-text-line-height);font-family:var(--comp-forms-status-text-font-family);margin:0;display:flex;gap:var(--ref-spacing-xxxs)}.form-message.error{color:var(--comp-forms-status-text-error-color)}.form-message.error ap-symbol{color:var(--comp-forms-status-icon-error-color)}.form-message.success{color:var(--comp-forms-status-text-success-color)}.form-message.success ap-symbol{color:var(--comp-forms-status-icon-success-color)}form.ng-submitted ap-input.ng-valid .input-wrapper{border-color:var(--comp-input-border-success-color)}form.ng-submitted ap-input.ng-invalid .input-wrapper{border-color:var(--comp-input-border-error-color)}\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: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["color", "symbolId", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputComponent, decorators: [{
+            type: Component,
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-input', standalone: true, imports: [FormsModule, SymbolComponent], providers: [
+                        AP_INPUT_CONTROL_VALUE_ACCESSOR,
+                        {
+                            provide: NG_VALIDATORS,
+                            useExisting: InputComponent,
+                            multi: true,
+                        },
+                    ], encapsulation: ViewEncapsulation.None, template: "@if (label) {\n    <label [for]=\"inputId\">\n        <span>\n            {{ label }}\n        </span>\n        @if (description) {\n            <span class=\"description\">\n                {{ description }}\n            </span>\n        }\n    </label>\n}\n\n<div\n    tabindex=\"0\"\n    class=\"input-wrapper\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [class.with-icon]=\"symbolId\"\n    [class.with-prefix]=\"prefix\"\n    [class.with-suffix]=\"suffix\"\n    [class.with-error]=\"errorMessage\"\n    [class.with-success]=\"successMessage\"\n    [class.disabled]=\"disabled\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-labelledby]=\"ariaLabelledBy || null\"\n    [attr.aria-describedby]=\"ariaDescribedBy || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"focusInput()\"\n    (keydown.enter)=\"focusInput()\">\n    @if (prefix) {\n        <div class=\"prefix\">\n            <span>\n                {{ prefix }}\n            </span>\n            <span class=\"divider\"></span>\n        </div>\n    }\n    <div class=\"content\">\n        <input\n            #input\n            [type]=\"inputType\"\n            [disabled]=\"disabled\"\n            [placeholder]=\"placeholder\"\n            [id]=\"inputId ?? ''\"\n            [attr.data-test]=\"hostDataTest() ? hostDataTest() : name\"\n            [(ngModel)]=\"value\"\n            (blur)=\"onBlurHandle($event)\"\n            (focus)=\"onFocusHandle($event)\"\n            (keyup)=\"onKeyup($event)\"\n            (ngModelChange)=\"onValueChange()\" />\n        @if (clearable) {\n            <button\n                type=\"button\"\n                class=\"clear-button\"\n                (click)=\"onClear()\">\n                <ap-symbol symbolId=\"close\" />\n            </button>\n        }\n    </div>\n    @if (suffix) {\n        <div class=\"suffix\">\n            <span class=\"divider\"></span>\n            <span>\n                {{ suffix }}\n            </span>\n        </div>\n    }\n    @if (symbolId) {\n        <ap-symbol\n            size=\"sm\"\n            [symbolId]=\"symbolId\" />\n    }\n</div>\n\n@if (errorMessage) {\n    <div class=\"form-message error\">\n        <ap-symbol\n            symbolId=\"error_fill\"\n            size=\"sm\" />\n        <span>\n            {{ errorMessage }}\n        </span>\n    </div>\n}\n\n@if (successMessage) {\n    <div class=\"form-message success\">\n        <ap-symbol\n            symbolId=\"rounded-check_fill\"\n            size=\"sm\" />\n        <span>\n            {{ successMessage }}\n        </span>\n    </div>\n}\n", styles: ["ap-input{display:flex;flex-direction:column;gap:var(--comp-input-spacing-horizontal);--border-width: 1px}ap-input.full-width{width:100%}ap-input.full-width .input-wrapper{min-width:100%}ap-input label{display:flex;flex-direction:column;gap:var(--comp-forms-label-spacing-vertical);font-size:var(--comp-forms-label-size);font-weight:var(--comp-forms-label-font-weight);line-height:var(--comp-forms-label-line-height);font-family:var(--comp-forms-label-font-family);color:var(--comp-forms-label-text-color)}ap-input label .description{font-size:var(--comp-forms-label-description-text-size);font-weight:var(--comp-forms-label-description-text-font-weight);line-height:var(--comp-forms-label-description-text-line-height);font-family:var(--comp-forms-label-description-text-font-family);color:var(--comp-forms-label-description-text-color)}ap-input .input-wrapper{display:flex;align-items:center;position:relative;min-width:var(--comp-input-width-default);height:var(--comp-input-height);border:var(--border-width) solid var(--comp-input-border-default-color);box-sizing:border-box;border-radius:var(--comp-input-border-radius);overflow:hidden;background-color:var(--comp-input-fill-color)}ap-input .input-wrapper:hover:not(.disabled){border-color:var(--comp-input-border-hover-color)}ap-input .input-wrapper:focus-within:not(.disabled){border-color:var(--comp-input-border-focused-color)}ap-input .input-wrapper:focus-visible:not(.disabled){outline:none}ap-input .input-wrapper:active:not(.disabled){border-color:var(--comp-input-border-focused-color)}ap-input .input-wrapper.disabled{background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input .input-wrapper .content{display:flex;gap:var(--comp-input-spacing-horizontal);flex:1;align-items:center}ap-input .input-wrapper .content input{border:none;outline:none;box-sizing:border-box;min-height:34px;max-height:34px;padding:0 var(--comp-input-padding-horizontal);flex:1;font-size:var(--comp-input-text-size);font-weight:var(--comp-input-text-font-weight);line-height:var(--comp-input-text-line-height);font-family:var(--comp-input-text-font-family);color:var(--comp-input-text-default-color);min-width:0}ap-input .input-wrapper .content input::placeholder{color:var(--comp-input-text-placeholder-color)}ap-input .input-wrapper .content input:disabled{cursor:not-allowed;pointer-events:none;background:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input .input-wrapper .content input:disabled:placeholder{color:var(--comp-input-text-placeholder-color)}ap-input .input-wrapper .content input[type=search]::-webkit-search-decoration,ap-input .input-wrapper .content input[type=search]::-webkit-search-cancel-button,ap-input .input-wrapper .content input[type=search]::-webkit-search-results-button,ap-input .input-wrapper .content input[type=search]::-webkit-search-results-decoration{display:none}ap-input .input-wrapper .content .counter{font-size:var(--comp-input-text-counter-size);font-weight:var(--comp-input-text-counter-font-weight);line-height:var(--comp-input-text-counter-line-height);font-family:var(--comp-input-text-counter-font-family);color:var(--comp-input-text-counter-color);padding-right:var(--comp-input-spacing-horizontal)}ap-input .input-wrapper .content .clear-button{display:flex;align-items:center;justify-content:center;border:none;margin:0;padding:0 var(--comp-input-spacing-horizontal) 0 0;background-color:transparent}ap-input .input-wrapper .content .clear-button:hover{cursor:pointer}ap-input .input-wrapper .content .clear-button ap-symbol{padding:0}ap-input .input-wrapper .prefix,ap-input .input-wrapper .suffix{height:100%;display:flex;justify-content:center;align-items:center;font-size:var(--sys-text-style-body-size);font-weight:var(--sys-text-style-body-weight);line-height:var(--sys-text-style-body-line-height);font-family:var(--ref-font-family);color:var(--ref-color-grey-100)}ap-input .input-wrapper .prefix .divider,ap-input .input-wrapper .suffix .divider{height:18px;width:var(--border-width);background:var(--ref-color-grey-10)}ap-input .input-wrapper ap-symbol{height:var(--comp-input-icon-size);width:var(--comp-input-icon-size);min-height:var(--comp-input-icon-size);min-width:var(--comp-input-icon-size);max-height:var(--comp-input-icon-size);max-width:var(--comp-input-icon-size);color:var(--comp-input-icon-color);padding-right:var(--comp-input-padding-horizontal);pointer-events:none;box-sizing:content-box}ap-input .input-wrapper ap-symbol:hover{cursor:text}ap-input .input-wrapper.inverse{flex-direction:row-reverse}ap-input .input-wrapper.inverse.with-icon input{padding-left:0}ap-input .input-wrapper.inverse.with-icon ap-symbol{padding-right:var(--comp-input-spacing-horizontal);padding-left:var(--comp-input-padding-horizontal)}ap-input .input-wrapper.with-icon input{padding-right:var(--ref-spacing-xxxs)}ap-input .input-wrapper.with-prefix input{padding-left:var(--ref-spacing-xxs)}ap-input .input-wrapper.with-prefix .prefix{padding-left:var(--comp-input-padding-horizontal);gap:var(--ref-spacing-xxs)}ap-input .input-wrapper.with-suffix input{padding-right:var(--ref-spacing-xxs)}ap-input .input-wrapper.with-suffix .suffix{padding-right:var(--comp-input-padding-horizontal);gap:var(--ref-spacing-xxs)}ap-input .input-wrapper.with-counter input{padding-right:0}ap-input .input-wrapper.with-error{border-color:var(--comp-input-border-error-color)}ap-input .input-wrapper.with-success{border-color:var(--comp-input-border-success-color)}.form-message{font-size:var(--comp-forms-status-text-size);font-weight:var(--comp-forms-status-text-font-weight);line-height:var(--comp-forms-status-text-line-height);font-family:var(--comp-forms-status-text-font-family);margin:0;display:flex;gap:var(--ref-spacing-xxxs)}.form-message.error{color:var(--comp-forms-status-text-error-color)}.form-message.error ap-symbol{color:var(--comp-forms-status-icon-error-color)}.form-message.success{color:var(--comp-forms-status-text-success-color)}.form-message.success ap-symbol{color:var(--comp-forms-status-icon-success-color)}form.ng-submitted ap-input.ng-valid .input-wrapper{border-color:var(--comp-input-border-success-color)}form.ng-submitted ap-input.ng-invalid .input-wrapper{border-color:var(--comp-input-border-error-color)}\n"] }]
+        }], propDecorators: { symbols: [{
+                type: ContentChildren,
+                args: [SymbolComponent]
+            }], symbolWrapper: [{
+                type: ViewChild,
+                args: ['symbol']
+            }], inputElement: [{
+                type: ViewChild,
+                args: ['input']
+            }], ariaLabel: [{
+                type: Input
+            }], ariaLabelledBy: [{
+                type: Input
+            }], ariaDescribedBy: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], clearable: [{
+                type: Input
+            }], inputType: [{
+                type: Input
+            }], inputId: [{
+                type: Input
+            }], name: [{
+                type: Input,
+                args: [{
+                        required: true,
+                    }]
+            }], label: [{
+                type: Input
+            }], description: [{
+                type: Input
+            }], prefix: [{
+                type: Input
+            }], suffix: [{
+                type: Input
+            }], required: [{
+                type: Input,
+                args: [{ transform: booleanAttribute }]
+            }], placeholder: [{
+                type: Input
+            }], errorMessage: [{
+                type: Input
+            }], successMessage: [{
+                type: Input
+            }], symbolId: [{
+                type: Input
+            }], symbolPosition: [{
+                type: Input
+            }], focus: [{
+                type: Output
+            }], blur: [{
+                type: Output
+            }], keyup: [{
+                type: Output
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AP_INPUT_CONTROL_VALUE_ACCESSOR, InputComponent };
+//# sourceMappingURL=agorapulse-ui-components-legacy-input.mjs.map

package/fesm2022/agorapulse-ui-components-legacy-input.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"agorapulse-ui-components-legacy-input.mjs","sources":["../../../libs/ui-components/legacy/input/src/input.component.ts","../../../libs/ui-components/legacy/input/src/input.component.html","../../../libs/ui-components/legacy/input/src/agorapulse-ui-components-legacy-input.ts"],"sourcesContent":["import { SymbolComponent, SymbolRegistry, apErrorFill, apRoundedCheckFill, apClose, apSearch } from '@agorapulse/ui-symbol';\n\nimport {\n    AfterViewInit,\n    ChangeDetectionStrategy,\n    Component,\n    ContentChildren,\n    ElementRef,\n    EventEmitter,\n    Input,\n    OnInit,\n    Output,\n    QueryList,\n    ViewChild,\n    ViewEncapsulation,\n    WritableSignal,\n    booleanAttribute,\n    forwardRef,\n    inject,\n    signal,\n} from '@angular/core';\nimport { ControlValueAccessor, FormsModule, NG_VALIDATORS, NG_VALUE_ACCESSOR } from '@angular/forms';\n\ntype InputType =\n    | 'color'\n    | 'datetime'\n    | 'datetime-local'\n    | 'email'\n    | 'hidden'\n    | 'month'\n    | 'number'\n    | 'password'\n    | 'range'\n    | 'search'\n    | 'text'\n    | 'tel'\n    | 'time'\n    | 'url'\n    | 'week';\n\nexport const AP_INPUT_CONTROL_VALUE_ACCESSOR = {\n    provide: NG_VALUE_ACCESSOR,\n    useExisting: forwardRef(() => InputComponent),\n    multi: true,\n};\n\nconst SEARCH_SYMBOL_ID = 'search';\n\n/**\n * @deprecated use native input with directive apInput, ap-input-group and ap-form-field instead\n */\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-input',\n    styleUrls: ['./input.component.scss'],\n    standalone: true,\n    imports: [FormsModule, SymbolComponent],\n    providers: [\n        AP_INPUT_CONTROL_VALUE_ACCESSOR,\n\n        {\n            provide: NG_VALIDATORS,\n\n            useExisting: InputComponent,\n\n            multi: true,\n        },\n    ],\n    templateUrl: './input.component.html',\n    encapsulation: ViewEncapsulation.None,\n})\nexport class InputComponent implements OnInit, AfterViewInit, ControlValueAccessor {\n    readonly elementRef: ElementRef = inject(ElementRef);\n    readonly symbolRegistry: SymbolRegistry = inject(SymbolRegistry);\n\n    @ContentChildren(SymbolComponent) symbols!: QueryList<SymbolComponent>;\n    @ViewChild('symbol') symbolWrapper!: ElementRef;\n    @ViewChild('input') inputElement!: ElementRef;\n\n    @Input() ariaLabel!: string;\n\n    @Input() ariaLabelledBy!: string;\n\n    @Input() ariaDescribedBy!: string;\n\n    @Input() disabled: boolean = false;\n\n    @Input() clearable: boolean = false;\n\n    @Input() inputType: InputType = 'text';\n\n    @Input() inputId?: string;\n\n    @Input({\n        required: true,\n    })\n    name!: string;\n\n    @Input() label?: string;\n\n    @Input() description?: string;\n\n    @Input() prefix?: string;\n\n    @Input() suffix?: string;\n\n    @Input({ transform: booleanAttribute }) required: boolean = false;\n\n    @Input() placeholder?: string;\n\n    @Input() errorMessage?: string;\n\n    @Input() successMessage?: string;\n\n    @Input() symbolId?: string;\n    @Input() symbolPosition: 'left' | 'right' = 'right';\n\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() focus = new EventEmitter<FocusEvent>();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() blur = new EventEmitter<FocusEvent>();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() keyup = new EventEmitter<KeyboardEvent>();\n\n    private _controlValueAccessorChangeFn!: (value: string | null) => void;\n\n    hostDataTest: WritableSignal<string | undefined> = signal<string | undefined>(undefined);\n\n    value!: string | null;\n\n    onTouched!: () => void;\n\n    ngOnInit(): void {\n        if (this.label && !this.inputId) {\n            throw Error('You have to provide an input id if you want to use a label.');\n        }\n        if (this.inputType === 'search') {\n            this.symbolId = SEARCH_SYMBOL_ID;\n            this.symbolPosition = 'left';\n        }\n        this.hostDataTest.set(this.elementRef.nativeElement.getAttribute('data-test'));\n        this.elementRef.nativeElement.removeAttribute('data-test');\n        this.symbolRegistry.registerSymbols([apErrorFill, apRoundedCheckFill, apClose, apSearch]);\n    }\n\n    // Sometimes attributes like the id, or the data-test are dynamic and can change between the constructor and the initialization.\n    // In order to have the last attributes value we check if it changes, and if it does, we run a mark for check to update the view.\n    ngAfterViewInit(): void {\n        const hostDataTest = this.elementRef.nativeElement.getAttribute('data-test');\n\n        if (hostDataTest && this.hostDataTest() !== hostDataTest) {\n            this.hostDataTest.set(hostDataTest);\n            this.elementRef.nativeElement.removeAttribute('data-test');\n        }\n    }\n\n    validate() {\n        const isNotValid = !this.value && this.required;\n        return (\n            isNotValid && {\n                invalid: true,\n            }\n        );\n    }\n\n    onValueChange() {\n        if (this.onTouched) {\n            this.onTouched();\n        }\n\n        if (!this.disabled) {\n            if (this._controlValueAccessorChangeFn) {\n                this._controlValueAccessorChangeFn(this.value);\n            }\n        }\n    }\n\n    writeValue(value: string | null): void {\n        this.value = value;\n    }\n\n    registerOnChange(fn: (value: string | null) => void): void {\n        this._controlValueAccessorChangeFn = fn;\n    }\n\n    registerOnTouched(fn: () => void): void {\n        this.onTouched = fn;\n    }\n\n    setDisabledState(isDisabled: boolean): void {\n        this.disabled = isDisabled;\n    }\n\n    focusInput(): void {\n        this.inputElement.nativeElement.focus();\n    }\n\n    onBlurHandle($event: FocusEvent): void {\n        this.blur.emit($event);\n    }\n\n    onFocusHandle($event: FocusEvent): void {\n        this.focus.emit($event);\n    }\n\n    onKeyup($event: KeyboardEvent): void {\n        this.keyup.emit($event);\n    }\n\n    onClear(): void {\n        this.writeValue(null);\n    }\n}\n","@if (label) {\n    <label [for]=\"inputId\">\n        <span>\n            {{ label }}\n        </span>\n        @if (description) {\n            <span class=\"description\">\n                {{ description }}\n            </span>\n        }\n    </label>\n}\n\n<div\n    tabindex=\"0\"\n    class=\"input-wrapper\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [class.with-icon]=\"symbolId\"\n    [class.with-prefix]=\"prefix\"\n    [class.with-suffix]=\"suffix\"\n    [class.with-error]=\"errorMessage\"\n    [class.with-success]=\"successMessage\"\n    [class.disabled]=\"disabled\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-labelledby]=\"ariaLabelledBy || null\"\n    [attr.aria-describedby]=\"ariaDescribedBy || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"focusInput()\"\n    (keydown.enter)=\"focusInput()\">\n    @if (prefix) {\n        <div class=\"prefix\">\n            <span>\n                {{ prefix }}\n            </span>\n            <span class=\"divider\"></span>\n        </div>\n    }\n    <div class=\"content\">\n        <input\n            #input\n            [type]=\"inputType\"\n            [disabled]=\"disabled\"\n            [placeholder]=\"placeholder\"\n            [id]=\"inputId ?? ''\"\n            [attr.data-test]=\"hostDataTest() ? hostDataTest() : name\"\n            [(ngModel)]=\"value\"\n            (blur)=\"onBlurHandle($event)\"\n            (focus)=\"onFocusHandle($event)\"\n            (keyup)=\"onKeyup($event)\"\n            (ngModelChange)=\"onValueChange()\" />\n        @if (clearable) {\n            <button\n                type=\"button\"\n                class=\"clear-button\"\n                (click)=\"onClear()\">\n                <ap-symbol symbolId=\"close\" />\n            </button>\n        }\n    </div>\n    @if (suffix) {\n        <div class=\"suffix\">\n            <span class=\"divider\"></span>\n            <span>\n                {{ suffix }}\n            </span>\n        </div>\n    }\n    @if (symbolId) {\n        <ap-symbol\n            size=\"sm\"\n            [symbolId]=\"symbolId\" />\n    }\n</div>\n\n@if (errorMessage) {\n    <div class=\"form-message error\">\n        <ap-symbol\n            symbolId=\"error_fill\"\n            size=\"sm\" />\n        <span>\n            {{ errorMessage }}\n        </span>\n    </div>\n}\n\n@if (successMessage) {\n    <div class=\"form-message success\">\n        <ap-symbol\n            symbolId=\"rounded-check_fill\"\n            size=\"sm\" />\n        <span>\n            {{ successMessage }}\n        </span>\n    </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}