@agorapulse/ui-components 17.1.2 → 17.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/agorapulse-ui-components-17.1.4.tgz +0 -0
- package/esm2022/input-group/input-group.component.mjs +3 -3
- package/esm2022/input-group/input-prefix/input-prefix.component.mjs +11 -0
- package/esm2022/input-group/public_api.mjs +2 -1
- package/esm2022/phone-number-input/agorapulse-ui-components-phone-number-input.mjs +5 -0
- package/esm2022/phone-number-input/phone-number-input.component.mjs +147 -0
- package/esm2022/phone-number-input/public_api.mjs +2 -0
- package/fesm2022/agorapulse-ui-components-input-group.mjs +12 -3
- package/fesm2022/agorapulse-ui-components-input-group.mjs.map +1 -1
- package/fesm2022/agorapulse-ui-components-phone-number-input.mjs +154 -0
- package/fesm2022/agorapulse-ui-components-phone-number-input.mjs.map +1 -0
- package/input-group/input-group.component.d.ts +1 -1
- package/input-group/input-prefix/input-prefix.component.d.ts +5 -0
- package/input-group/public_api.d.ts +1 -0
- package/package.json +13 -7
- package/phone-number-input/index.d.ts +5 -0
- package/phone-number-input/phone-number-input.component.d.ts +41 -0
- package/phone-number-input/public_api.d.ts +1 -0
- package/agorapulse-ui-components-17.1.2.tgz +0 -0
|
Binary file
|
|
@@ -3,12 +3,12 @@ import * as i0 from "@angular/core";
|
|
|
3
3
|
export class InputGroupComponent {
|
|
4
4
|
symbolPosition = 'left';
|
|
5
5
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: InputGroupComponent, isStandalone: true, selector: "ap-input-group", inputs: { symbolPosition: "symbolPosition" }, ngImport: i0, template: "<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-
|
|
6
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: InputGroupComponent, isStandalone: true, selector: "ap-input-group", inputs: { symbolPosition: "symbolPosition" }, ngImport: i0, template: "<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-input-prefix\" />\n <ng-content select=\"ap-symbol\" />\n <ng-content select=\"input[apInput]\" />\n</div>\n", styles: ["ap-input-group.valid .ap-input-group{border-color:var(--comp-input-border-success-color)}ap-input-group.invalid .ap-input-group{border-color:var(--comp-input-border-error-color)}ap-input-group .ap-input-group{width:100%;display:inline-flex;align-items:center;height:var(--comp-input-height);border:1px 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);gap:var(--ref-spacing-xxs);padding:0 var(--ref-spacing-xs)}ap-input-group .ap-input-group:has(input[disabled]){background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input-group .ap-input-group:has(input.valid){border-color:var(--comp-input-border-success-color)}ap-input-group .ap-input-group:has(input.invalid),ap-input-group .ap-input-group:has(input.ng-invalid.ng-dirty.ng-touched){border-color:var(--comp-input-border-error-color)}ap-input-group .ap-input-group:hover:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-hover-color)}ap-input-group .ap-input-group:focus-within:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-focused-color)}ap-input-group .ap-input-group:focus-visible:not(.disabled):not(:has(input[disabled])){outline:none}ap-input-group .ap-input-group:active:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-focused-color)}ap-input-group .ap-input-group.disabled{background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input-group .ap-input-group.inverse{flex-direction:row-reverse}ap-input-group .ap-input-group input.ap-input{flex:1;padding-left:0;padding-right:0}ap-input-group .ap-input-group input.ap-input.valid:not([disabled]):not(:focus):not(:hover){border:none}ap-input-group .ap-input-group input.ap-input.invalid:not([disabled]):not(:focus):not(:hover),ap-input-group .ap-input-group input.ap-input.ng-invalid.ng-dirty.ng-touched:not([disabled]):not(:focus):not(:hover){border:none}ap-input-group .ap-input-group 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);pointer-events:none;box-sizing:content-box}ap-input-group .ap-input-group ap-symbol:hover{cursor:text}ap-input-group .ap-input-group .ap-input{border:none;outline:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
7
7
|
}
|
|
8
8
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputGroupComponent, decorators: [{
|
|
9
9
|
type: Component,
|
|
10
|
-
args: [{ selector: 'ap-input-group', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-
|
|
10
|
+
args: [{ selector: 'ap-input-group', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-input-prefix\" />\n <ng-content select=\"ap-symbol\" />\n <ng-content select=\"input[apInput]\" />\n</div>\n", styles: ["ap-input-group.valid .ap-input-group{border-color:var(--comp-input-border-success-color)}ap-input-group.invalid .ap-input-group{border-color:var(--comp-input-border-error-color)}ap-input-group .ap-input-group{width:100%;display:inline-flex;align-items:center;height:var(--comp-input-height);border:1px 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);gap:var(--ref-spacing-xxs);padding:0 var(--ref-spacing-xs)}ap-input-group .ap-input-group:has(input[disabled]){background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input-group .ap-input-group:has(input.valid){border-color:var(--comp-input-border-success-color)}ap-input-group .ap-input-group:has(input.invalid),ap-input-group .ap-input-group:has(input.ng-invalid.ng-dirty.ng-touched){border-color:var(--comp-input-border-error-color)}ap-input-group .ap-input-group:hover:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-hover-color)}ap-input-group .ap-input-group:focus-within:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-focused-color)}ap-input-group .ap-input-group:focus-visible:not(.disabled):not(:has(input[disabled])){outline:none}ap-input-group .ap-input-group:active:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-focused-color)}ap-input-group .ap-input-group.disabled{background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input-group .ap-input-group.inverse{flex-direction:row-reverse}ap-input-group .ap-input-group input.ap-input{flex:1;padding-left:0;padding-right:0}ap-input-group .ap-input-group input.ap-input.valid:not([disabled]):not(:focus):not(:hover){border:none}ap-input-group .ap-input-group input.ap-input.invalid:not([disabled]):not(:focus):not(:hover),ap-input-group .ap-input-group input.ap-input.ng-invalid.ng-dirty.ng-touched:not([disabled]):not(:focus):not(:hover){border:none}ap-input-group .ap-input-group 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);pointer-events:none;box-sizing:content-box}ap-input-group .ap-input-group ap-symbol:hover{cursor:text}ap-input-group .ap-input-group .ap-input{border:none;outline:none}\n"] }]
|
|
11
11
|
}], propDecorators: { symbolPosition: [{
|
|
12
12
|
type: Input
|
|
13
13
|
}] } });
|
|
14
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
14
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQtZ3JvdXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vbGlicy91aS1jb21wb25lbnRzL2lucHV0LWdyb3VwL3NyYy9pbnB1dC1ncm91cC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvaW5wdXQtZ3JvdXAvc3JjL2lucHV0LWdyb3VwLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDOztBQVU3RixNQUFNLE9BQU8sbUJBQW1CO0lBQ25CLGNBQWMsR0FBcUIsTUFBTSxDQUFDO3VHQUQxQyxtQkFBbUI7MkZBQW5CLG1CQUFtQix3SENWaEMseU9BT0E7OzJGREdhLG1CQUFtQjtrQkFSL0IsU0FBUzsrQkFDSSxnQkFBZ0IsY0FHZCxJQUFJLG1CQUNDLHVCQUF1QixDQUFDLE1BQU0saUJBQ2hDLGlCQUFpQixDQUFDLElBQUk7OEJBRzVCLGNBQWM7c0JBQXRCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBJbnB1dCwgVmlld0VuY2Fwc3VsYXRpb24gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdhcC1pbnB1dC1ncm91cCcsXG4gICAgdGVtcGxhdGVVcmw6ICcuL2lucHV0LWdyb3VwLmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9pbnB1dC1ncm91cC5jb21wb25lbnQuc2NzcyddLFxuICAgIHN0YW5kYWxvbmU6IHRydWUsXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbn0pXG5leHBvcnQgY2xhc3MgSW5wdXRHcm91cENvbXBvbmVudCB7XG4gICAgQElucHV0KCkgc3ltYm9sUG9zaXRpb246ICdsZWZ0JyB8ICdyaWdodCcgPSAnbGVmdCc7XG59XG4iLCI8ZGl2XG4gICAgY2xhc3M9XCJhcC1pbnB1dC1ncm91cFwiXG4gICAgW2NsYXNzLmludmVyc2VdPVwic3ltYm9sUG9zaXRpb24gPT09ICdyaWdodCdcIj5cbiAgICA8bmctY29udGVudCBzZWxlY3Q9XCJhcC1pbnB1dC1wcmVmaXhcIiAvPlxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cImFwLXN5bWJvbFwiIC8+XG4gICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiaW5wdXRbYXBJbnB1dF1cIiAvPlxuPC9kaXY+XG4iXX0=
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class InputPrefixComponent {
|
|
4
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputPrefixComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: InputPrefixComponent, isStandalone: true, selector: "ap-input-prefix", ngImport: i0, template: "<ng-content/>\n", styles: ["ap-input-prefix{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-right:var(--ref-spacing-xxs);border-right:1px solid var(--ref-color-grey-20);color:var(--comp-input-text-default-color);font-family:var(--comp-input-text-font-family);font-size:var(--comp-input-text-size);font-weight:var(--comp-input-text-font-weight)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
6
|
+
}
|
|
7
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputPrefixComponent, decorators: [{
|
|
8
|
+
type: Component,
|
|
9
|
+
args: [{ selector: 'ap-input-prefix', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content/>\n", styles: ["ap-input-prefix{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-right:var(--ref-spacing-xxs);border-right:1px solid var(--ref-color-grey-20);color:var(--comp-input-text-default-color);font-family:var(--comp-input-text-font-family);font-size:var(--comp-input-text-size);font-weight:var(--comp-input-text-font-weight)}\n"] }]
|
|
10
|
+
}] });
|
|
11
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQtcHJlZml4LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvdWktY29tcG9uZW50cy9pbnB1dC1ncm91cC9zcmMvaW5wdXQtcHJlZml4L2lucHV0LXByZWZpeC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvaW5wdXQtZ3JvdXAvc3JjL2lucHV0LXByZWZpeC9pbnB1dC1wcmVmaXguY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxpQkFBaUIsRUFBQyxNQUFNLGVBQWUsQ0FBQzs7QUFVcEYsTUFBTSxPQUFPLG9CQUFvQjt1R0FBcEIsb0JBQW9COzJGQUFwQixvQkFBb0IsMkVDVmpDLGlCQUNBOzsyRkRTYSxvQkFBb0I7a0JBUmhDLFNBQVM7K0JBQ0ksaUJBQWlCLGNBR2YsSUFBSSxtQkFDQyx1QkFBdUIsQ0FBQyxNQUFNLGlCQUNoQyxpQkFBaUIsQ0FBQyxJQUFJIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBWaWV3RW5jYXBzdWxhdGlvbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnYXAtaW5wdXQtcHJlZml4JyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vaW5wdXQtcHJlZml4LmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9pbnB1dC1wcmVmaXguY29tcG9uZW50LnNjc3MnXSxcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG59KVxuZXhwb3J0IGNsYXNzIElucHV0UHJlZml4Q29tcG9uZW50IHtcbn1cbiIsIjxuZy1jb250ZW50Lz5cbiJdfQ==
|
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
export * from './input-group.component';
|
|
2
|
-
|
|
2
|
+
export * from './input-prefix/input-prefix.component';
|
|
3
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvdWktY29tcG9uZW50cy9pbnB1dC1ncm91cC9zcmMvcHVibGljX2FwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLHlCQUF5QixDQUFDO0FBQ3hDLGNBQWMsdUNBQXVDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2lucHV0LWdyb3VwLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2lucHV0LXByZWZpeC9pbnB1dC1wcmVmaXguY29tcG9uZW50JztcbiJdfQ==
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Generated bundle index. Do not edit.
|
|
3
|
+
*/
|
|
4
|
+
export * from './public_api';
|
|
5
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWdvcmFwdWxzZS11aS1jb21wb25lbnRzLXBob25lLW51bWJlci1pbnB1dC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvdWktY29tcG9uZW50cy9waG9uZS1udW1iZXItaW5wdXQvc3JjL2Fnb3JhcHVsc2UtdWktY29tcG9uZW50cy1waG9uZS1udW1iZXItaW5wdXQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9wdWJsaWNfYXBpJztcbiJdfQ==
|
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
/* eslint-disable @typescript-eslint/no-empty-function */
|
|
2
|
+
import { Component, EventEmitter, forwardRef, Input, Output, ViewEncapsulation } from '@angular/core';
|
|
3
|
+
import { FormControl, FormGroup, FormsModule, NG_VALIDATORS, NG_VALUE_ACCESSOR, ReactiveFormsModule, Validators, } from '@angular/forms';
|
|
4
|
+
import { CommonModule, NgOptimizedImage } from '@angular/common';
|
|
5
|
+
import { NgSelectModule } from '@ng-select/ng-select';
|
|
6
|
+
import { InputGroupComponent, InputPrefixComponent } from "@agorapulse/ui-components/input-group";
|
|
7
|
+
import { DropdownItemSingleOneLineComponent, SelectBaseDirective } from "@agorapulse/ui-components/select";
|
|
8
|
+
import { InputDirective } from "@agorapulse/ui-components/input";
|
|
9
|
+
import * as i0 from "@angular/core";
|
|
10
|
+
import * as i1 from "@angular/forms";
|
|
11
|
+
import * as i2 from "@ng-select/ng-select";
|
|
12
|
+
const INITIAL_PHONE_NUMBER_INPUT_VALUE = {
|
|
13
|
+
phoneNumber: '',
|
|
14
|
+
phoneNumberCode: '',
|
|
15
|
+
};
|
|
16
|
+
const NUMBER_ONLY_PATTERN = /[0-9]/;
|
|
17
|
+
export class PhoneNumberInputComponent {
|
|
18
|
+
set errorsDisplayForced(errorsDisplayForced) {
|
|
19
|
+
if (errorsDisplayForced) {
|
|
20
|
+
this.formGroup.markAllAsTouched();
|
|
21
|
+
Object.values(this.formGroup.controls).forEach((control) => control.markAsDirty());
|
|
22
|
+
this.formGroup.updateValueAndValidity();
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
flagsBucketUrl;
|
|
26
|
+
set phoneNumberInfos(phoneNumberInfos) {
|
|
27
|
+
this.codeNumberInfos = phoneNumberInfos ?? [];
|
|
28
|
+
if (phoneNumberInfos.length > 0) {
|
|
29
|
+
// DS Behavior: select by default the first phone number code
|
|
30
|
+
const defaultValue = phoneNumberInfos[0].phoneNumberCode;
|
|
31
|
+
this.formGroup.controls.phoneNumberCode.setValue(defaultValue);
|
|
32
|
+
this.phoneNumberCode = defaultValue;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
codeNumberInfos = [];
|
|
36
|
+
name;
|
|
37
|
+
placeholder;
|
|
38
|
+
set phoneNumber(phoneNumber) {
|
|
39
|
+
this.formGroup.controls.phoneNumber.setValue(phoneNumber);
|
|
40
|
+
}
|
|
41
|
+
set phoneNumberCode(phoneNumberCode) {
|
|
42
|
+
this.formGroup.controls.phoneNumberCode.setValue(phoneNumberCode);
|
|
43
|
+
}
|
|
44
|
+
changePhoneNumber = new EventEmitter();
|
|
45
|
+
changePhoneNumberCode = new EventEmitter();
|
|
46
|
+
formGroup = new FormGroup({
|
|
47
|
+
phoneNumberCode: new FormControl('', [Validators.required]),
|
|
48
|
+
phoneNumber: new FormControl('', [Validators.required]),
|
|
49
|
+
});
|
|
50
|
+
onTouched = () => { };
|
|
51
|
+
onChanged = () => { };
|
|
52
|
+
registerOnChange(fn) {
|
|
53
|
+
this.onChanged = fn;
|
|
54
|
+
}
|
|
55
|
+
registerOnTouched(fn) {
|
|
56
|
+
this.onTouched = fn;
|
|
57
|
+
}
|
|
58
|
+
validate() {
|
|
59
|
+
return this.formGroup.valid ? null : { phoneNumber: 'invalid', ...this.formGroup.errors };
|
|
60
|
+
}
|
|
61
|
+
writeValue(phone) {
|
|
62
|
+
this.formGroup.setValue(phone === null ? INITIAL_PHONE_NUMBER_INPUT_VALUE : phone);
|
|
63
|
+
if (phone === null) {
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
this.formGroup.markAllAsTouched();
|
|
67
|
+
Object.values(this.formGroup.controls).forEach((control) => control.markAsDirty());
|
|
68
|
+
}
|
|
69
|
+
phoneNumberCodeSearchFn(term, item) {
|
|
70
|
+
const termCased = term.toLocaleLowerCase();
|
|
71
|
+
return item.countryName.toLocaleLowerCase().indexOf(termCased) > -1 || item.phoneNumberCode.toLocaleLowerCase().indexOf(termCased) > -1;
|
|
72
|
+
}
|
|
73
|
+
/**
|
|
74
|
+
* Filter the phone number input to only allow numbers
|
|
75
|
+
*/
|
|
76
|
+
filterChars(event) {
|
|
77
|
+
if (event.inputType !== 'insertText') {
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
const inputChar = event.data;
|
|
81
|
+
if (inputChar && !NUMBER_ONLY_PATTERN.test(inputChar)) {
|
|
82
|
+
event.preventDefault();
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: PhoneNumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
86
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: PhoneNumberInputComponent, isStandalone: true, selector: "ap-phone-number-input", inputs: { errorsDisplayForced: "errorsDisplayForced", flagsBucketUrl: "flagsBucketUrl", phoneNumberInfos: "phoneNumberInfos", name: "name", placeholder: "placeholder", phoneNumber: "phoneNumber", phoneNumberCode: "phoneNumberCode" }, outputs: { changePhoneNumber: "changePhoneNumber", changePhoneNumberCode: "changePhoneNumberCode" }, providers: [
|
|
87
|
+
{
|
|
88
|
+
provide: NG_VALUE_ACCESSOR,
|
|
89
|
+
useExisting: forwardRef(() => PhoneNumberInputComponent),
|
|
90
|
+
multi: true,
|
|
91
|
+
},
|
|
92
|
+
{
|
|
93
|
+
provide: NG_VALIDATORS,
|
|
94
|
+
useExisting: forwardRef(() => PhoneNumberInputComponent),
|
|
95
|
+
multi: true,
|
|
96
|
+
},
|
|
97
|
+
], ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\n <ng-select\n apSelect\n data-test=\"subscription-billing-infos-phoneNumberCode\"\n class=\"ap-phone-number-code-select\"\n bindLabel=\"countryName\"\n bindValue=\"phoneNumberCode\"\n notFoundText=\"\"\n formControlName=\"phoneNumberCode\"\n [items]=\"codeNumberInfos\"\n [clearable]=\"false\"\n [searchable]=\"true\"\n [searchFn]=\"phoneNumberCodeSearchFn\"\n (blur)=\"onTouched()\">\n <ng-template\n let-item=\"item\"\n ng-label-tmp>\n @if (item && item.countryCode) {\n <div class=\"flag\">\n @if (!!flagsBucketUrl) {\n <img\n width=\"24\"\n height=\"16\"\n alt=\"flag\"\n [ngSrc]=\"flagsBucketUrl + '/' + item.countryCode.toUpperCase() + '.png'\" />\n } @else {\n <span>{{ item.countryCode }}</span>\n }\n </div>\n }\n </ng-template>\n <ng-template\n let-item=\"item\"\n let-item$=\"item$\"\n ng-option-tmp>\n <ap-dropdown-item-single-one-line\n [text]=\"item.countryName + ' - ' + item.phoneNumberCode\"\n [selected]=\"item$.selected\"\n />\n </ng-template>\n </ng-select>\n <ap-input-group class=\"phone-number-input-group\">\n <ap-input-prefix>{{formGroup.controls.phoneNumberCode.value}}</ap-input-prefix>\n <input\n apInput\n class=\"phone-field\"\n data-test=\"subscription-billing-infos-phoneNumberInput\"\n type=\"text\"\n data-recurly=\"phone\"\n formControlName=\"phoneNumber\"\n [placeholder]=\"placeholder\"\n [attr.name]=\"name\"\n (beforeinput)=\"filterChars($event)\"\n (blur)=\"onTouched()\"\n />\n </ap-input-group>\n</ng-container>\n", styles: ["ng-dropdown-panel.ap-phone-number-code-select{width:auto!important}ap-phone-number-input{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--ref-spacing-xxs)}ap-phone-number-input .ap-phone-number-code-select{flex:0 0 70px;width:70px}ap-phone-number-input .ap-phone-number-code-select .flag{display:flex;flex-direction:row;align-items:center;justify-content:center;overflow:hidden}ap-phone-number-input .ap-phone-number-code-select .flag img{max-height:16px;max-width:24px;object-fit:cover;border-radius:4px;object-position:center center}ap-phone-number-input .ap-phone-number-code-select .ng-input{padding:2px var(--ref-spacing-sm)}ap-phone-number-input .phone-number-input-group{flex:1 0 auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "component", type: InputGroupComponent, selector: "ap-input-group", inputs: ["symbolPosition"] }, { kind: "directive", type: SelectBaseDirective, selector: "ng-select[apSelect]", inputs: ["inlineLabel", "symbolId"] }, { kind: "directive", type: InputDirective, selector: "[apInput]" }, { kind: "component", type: InputPrefixComponent, selector: "ap-input-prefix" }, { kind: "component", type: DropdownItemSingleOneLineComponent, selector: "ap-dropdown-item-single-one-line", inputs: ["text", "selected", "disabled", "avatarUrl", "symbolId", "disabledTooltip", "badgeText", "dividerEnabled", "network"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
98
|
+
}
|
|
99
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: PhoneNumberInputComponent, decorators: [{
|
|
100
|
+
type: Component,
|
|
101
|
+
args: [{ selector: 'ap-phone-number-input', standalone: true, imports: [
|
|
102
|
+
CommonModule,
|
|
103
|
+
FormsModule,
|
|
104
|
+
NgSelectModule,
|
|
105
|
+
InputGroupComponent,
|
|
106
|
+
SelectBaseDirective,
|
|
107
|
+
InputDirective,
|
|
108
|
+
InputPrefixComponent,
|
|
109
|
+
DropdownItemSingleOneLineComponent,
|
|
110
|
+
ReactiveFormsModule,
|
|
111
|
+
NgOptimizedImage,
|
|
112
|
+
], providers: [
|
|
113
|
+
{
|
|
114
|
+
provide: NG_VALUE_ACCESSOR,
|
|
115
|
+
useExisting: forwardRef(() => PhoneNumberInputComponent),
|
|
116
|
+
multi: true,
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
provide: NG_VALIDATORS,
|
|
120
|
+
useExisting: forwardRef(() => PhoneNumberInputComponent),
|
|
121
|
+
multi: true,
|
|
122
|
+
},
|
|
123
|
+
], encapsulation: ViewEncapsulation.None, template: "<ng-container [formGroup]=\"formGroup\">\n <ng-select\n apSelect\n data-test=\"subscription-billing-infos-phoneNumberCode\"\n class=\"ap-phone-number-code-select\"\n bindLabel=\"countryName\"\n bindValue=\"phoneNumberCode\"\n notFoundText=\"\"\n formControlName=\"phoneNumberCode\"\n [items]=\"codeNumberInfos\"\n [clearable]=\"false\"\n [searchable]=\"true\"\n [searchFn]=\"phoneNumberCodeSearchFn\"\n (blur)=\"onTouched()\">\n <ng-template\n let-item=\"item\"\n ng-label-tmp>\n @if (item && item.countryCode) {\n <div class=\"flag\">\n @if (!!flagsBucketUrl) {\n <img\n width=\"24\"\n height=\"16\"\n alt=\"flag\"\n [ngSrc]=\"flagsBucketUrl + '/' + item.countryCode.toUpperCase() + '.png'\" />\n } @else {\n <span>{{ item.countryCode }}</span>\n }\n </div>\n }\n </ng-template>\n <ng-template\n let-item=\"item\"\n let-item$=\"item$\"\n ng-option-tmp>\n <ap-dropdown-item-single-one-line\n [text]=\"item.countryName + ' - ' + item.phoneNumberCode\"\n [selected]=\"item$.selected\"\n />\n </ng-template>\n </ng-select>\n <ap-input-group class=\"phone-number-input-group\">\n <ap-input-prefix>{{formGroup.controls.phoneNumberCode.value}}</ap-input-prefix>\n <input\n apInput\n class=\"phone-field\"\n data-test=\"subscription-billing-infos-phoneNumberInput\"\n type=\"text\"\n data-recurly=\"phone\"\n formControlName=\"phoneNumber\"\n [placeholder]=\"placeholder\"\n [attr.name]=\"name\"\n (beforeinput)=\"filterChars($event)\"\n (blur)=\"onTouched()\"\n />\n </ap-input-group>\n</ng-container>\n", styles: ["ng-dropdown-panel.ap-phone-number-code-select{width:auto!important}ap-phone-number-input{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--ref-spacing-xxs)}ap-phone-number-input .ap-phone-number-code-select{flex:0 0 70px;width:70px}ap-phone-number-input .ap-phone-number-code-select .flag{display:flex;flex-direction:row;align-items:center;justify-content:center;overflow:hidden}ap-phone-number-input .ap-phone-number-code-select .flag img{max-height:16px;max-width:24px;object-fit:cover;border-radius:4px;object-position:center center}ap-phone-number-input .ap-phone-number-code-select .ng-input{padding:2px var(--ref-spacing-sm)}ap-phone-number-input .phone-number-input-group{flex:1 0 auto}\n"] }]
|
|
124
|
+
}], propDecorators: { errorsDisplayForced: [{
|
|
125
|
+
type: Input
|
|
126
|
+
}], flagsBucketUrl: [{
|
|
127
|
+
type: Input,
|
|
128
|
+
args: [{ required: true }]
|
|
129
|
+
}], phoneNumberInfos: [{
|
|
130
|
+
type: Input,
|
|
131
|
+
args: [{ required: true }]
|
|
132
|
+
}], name: [{
|
|
133
|
+
type: Input,
|
|
134
|
+
args: [{ required: true }]
|
|
135
|
+
}], placeholder: [{
|
|
136
|
+
type: Input,
|
|
137
|
+
args: [{ required: true }]
|
|
138
|
+
}], phoneNumber: [{
|
|
139
|
+
type: Input
|
|
140
|
+
}], phoneNumberCode: [{
|
|
141
|
+
type: Input
|
|
142
|
+
}], changePhoneNumber: [{
|
|
143
|
+
type: Output
|
|
144
|
+
}], changePhoneNumberCode: [{
|
|
145
|
+
type: Output
|
|
146
|
+
}] } });
|
|
147
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGhvbmUtbnVtYmVyLWlucHV0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvdWktY29tcG9uZW50cy9waG9uZS1udW1iZXItaW5wdXQvc3JjL3Bob25lLW51bWJlci1pbnB1dC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9saWJzL3VpLWNvbXBvbmVudHMvcGhvbmUtbnVtYmVyLWlucHV0L3NyYy9waG9uZS1udW1iZXItaW5wdXQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEseURBQXlEO0FBQ3pELE9BQU8sRUFBQyxTQUFTLEVBQUUsWUFBWSxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLGlCQUFpQixFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ3BHLE9BQU8sRUFFSCxXQUFXLEVBQ1gsU0FBUyxFQUNULFdBQVcsRUFDWCxhQUFhLEVBQ2IsaUJBQWlCLEVBQ2pCLG1CQUFtQixFQUduQixVQUFVLEdBQ2IsTUFBTSxnQkFBZ0IsQ0FBQztBQUN4QixPQUFPLEVBQUMsWUFBWSxFQUFFLGdCQUFnQixFQUFDLE1BQU0saUJBQWlCLENBQUM7QUFDL0QsT0FBTyxFQUFDLGNBQWMsRUFBQyxNQUFNLHNCQUFzQixDQUFDO0FBQ3BELE9BQU8sRUFBQyxtQkFBbUIsRUFBRSxvQkFBb0IsRUFBQyxNQUFNLHVDQUF1QyxDQUFDO0FBQ2hHLE9BQU8sRUFBQyxrQ0FBa0MsRUFBRSxtQkFBbUIsRUFBQyxNQUFNLGtDQUFrQyxDQUFDO0FBQ3pHLE9BQU8sRUFBQyxjQUFjLEVBQUMsTUFBTSxpQ0FBaUMsQ0FBQzs7OztBQWEvRCxNQUFNLGdDQUFnQyxHQUFVO0lBQzVDLFdBQVcsRUFBRSxFQUFFO0lBQ2YsZUFBZSxFQUFFLEVBQUU7Q0FDdEIsQ0FBQztBQUVGLE1BQU0sbUJBQW1CLEdBQUcsT0FBTyxDQUFDO0FBaUNwQyxNQUFNLE9BQU8seUJBQXlCO0lBQ2xDLElBQWEsbUJB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b250ZW50IjpbIi8qIGVzbGludC1kaXNhYmxlIEB0eXBlc2NyaXB0LWVzbGludC9uby1lbXB0eS1mdW5jdGlvbiAqL1xuaW1wb3J0IHtDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgZm9yd2FyZFJlZiwgSW5wdXQsIE91dHB1dCwgVmlld0VuY2Fwc3VsYXRpb259IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtcbiAgICBDb250cm9sVmFsdWVBY2Nlc3NvcixcbiAgICBGb3JtQ29udHJvbCxcbiAgICBGb3JtR3JvdXAsXG4gICAgRm9ybXNNb2R1bGUsXG4gICAgTkdfVkFMSURBVE9SUyxcbiAgICBOR19WQUxVRV9BQ0NFU1NPUixcbiAgICBSZWFjdGl2ZUZvcm1zTW9kdWxlLFxuICAgIFZhbGlkYXRpb25FcnJvcnMsXG4gICAgVmFsaWRhdG9yLFxuICAgIFZhbGlkYXRvcnMsXG59IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7Q29tbW9uTW9kdWxlLCBOZ09wdGltaXplZEltYWdlfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHtOZ1NlbGVjdE1vZHVsZX0gZnJvbSAnQG5nLXNlbGVjdC9uZy1zZWxlY3QnO1xuaW1wb3J0IHtJbnB1dEdyb3VwQ29tcG9uZW50LCBJbnB1dFByZWZpeENvbXBvbmVudH0gZnJvbSBcIkBhZ29yYXB1bHNlL3VpLWNvbXBvbmVudHMvaW5wdXQtZ3JvdXBcIjtcbmltcG9ydCB7RHJvcGRvd25JdGVtU2luZ2xlT25lTGluZUNvbXBvbmVudCwgU2VsZWN0QmFzZURpcmVjdGl2ZX0gZnJvbSBcIkBhZ29yYXB1bHNlL3VpLWNvbXBvbmVudHMvc2VsZWN0XCI7XG5pbXBvcnQge0lucHV0RGlyZWN0aXZlfSBmcm9tIFwiQGFnb3JhcHVsc2UvdWktY29tcG9uZW50cy9pbnB1dFwiO1xuXG5leHBvcnQgaW50ZXJmYWNlIFBob25lTnVtYmVySW5mbyB7XG4gICAgY291bnRyeUNvZGU6IHN0cmluZztcbiAgICBjb3VudHJ5TmFtZTogc3RyaW5nO1xuICAgIHBob25lTnVtYmVyQ29kZTogc3RyaW5nO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIFBob25lIHtcbiAgICBwaG9uZU51bWJlcjogc3RyaW5nO1xuICAgIHBob25lTnVtYmVyQ29kZTogc3RyaW5nO1xufVxuXG5jb25zdCBJTklUSUFMX1BIT05FX05VTUJFUl9JTlBVVF9WQUxVRTogUGhvbmUgPSB7XG4gICAgcGhvbmVOdW1iZXI6ICcnLFxuICAgIHBob25lTnVtYmVyQ29kZTogJycsXG59O1xuXG5jb25zdCBOVU1CRVJfT05MWV9QQVRURVJOID0gL1swLTldLztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdhcC1waG9uZS1udW1iZXItaW5wdXQnLFxuICAgIHRlbXBsYXRlVXJsOiAncGhvbmUtbnVtYmVyLWlucHV0LmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsncGhvbmUtbnVtYmVyLWlucHV0LmNvbXBvbmVudC5zY3NzJ10sXG4gICAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgICBpbXBvcnRzOiBbXG4gICAgICAgIENvbW1vbk1vZHVsZSxcbiAgICAgICAgRm9ybXNNb2R1bGUsXG4gICAgICAgIE5nU2VsZWN0TW9kdWxlLFxuICAgICAgICBJbnB1dEdyb3VwQ29tcG9uZW50LFxuICAgICAgICBTZWxlY3RCYXNlRGlyZWN0aXZlLFxuICAgICAgICBJbnB1dERpcmVjdGl2ZSxcbiAgICAgICAgSW5wdXRQcmVmaXhDb21wb25lbnQsXG4gICAgICAgIERyb3Bkb3duSXRlbVNpbmdsZU9uZUxpbmVDb21wb25lbnQsXG4gICAgICAgIFJlYWN0aXZlRm9ybXNNb2R1bGUsXG4gICAgICAgIE5nT3B0aW1pemVkSW1hZ2UsXG4gICAgXSxcbiAgICBwcm92aWRlcnM6IFtcbiAgICAgICAge1xuICAgICAgICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXG4gICAgICAgICAgICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBQaG9uZU51bWJlcklucHV0Q29tcG9uZW50KSxcbiAgICAgICAgICAgIG11bHRpOiB0cnVlLFxuICAgICAgICB9LFxuICAgICAgICB7XG4gICAgICAgICAgICBwcm92aWRlOiBOR19WQUxJREFUT1JTLFxuICAgICAgICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gUGhvbmVOdW1iZXJJbnB1dENvbXBvbmVudCksXG4gICAgICAgICAgICBtdWx0aTogdHJ1ZSxcbiAgICAgICAgfSxcbiAgICBdLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG59KVxuZXhwb3J0IGNsYXNzIFBob25lTnVtYmVySW5wdXRDb21wb25lbnQgaW1wbGVtZW50cyBDb250cm9sVmFsdWVBY2Nlc3NvciwgVmFsaWRhdG9yIHtcbiAgICBASW5wdXQoKSBzZXQgZXJyb3JzRGlzcGxheUZvcmNlZChlcnJvcnNEaXNwbGF5Rm9yY2VkOiBib29sZWFuKSB7XG4gICAgICAgIGlmIChlcnJvcnNEaXNwbGF5Rm9yY2VkKSB7XG4gICAgICAgICAgICB0aGlzLmZvcm1Hcm91cC5tYXJrQWxsQXNUb3VjaGVkKCk7XG4gICAgICAgICAgICBPYmplY3QudmFsdWVzKHRoaXMuZm9ybUdyb3VwLmNvbnRyb2xzKS5mb3JFYWNoKChjb250cm9sKSA9PiBjb250cm9sLm1hcmtBc0RpcnR5KCkpO1xuICAgICAgICAgICAgdGhpcy5mb3JtR3JvdXAudXBkYXRlVmFsdWVBbmRWYWxpZGl0eSgpO1xuICAgICAgICB9XG4gICAgfVxuICAgIEBJbnB1dCh7IHJlcXVpcmVkOiB0cnVlIH0pIGZsYWdzQnVja2V0VXJsITogc3RyaW5nO1xuICAgIEBJbnB1dCh7IHJlcXVpcmVkOiB0cnVlIH0pIHNldCBwaG9uZU51bWJlckluZm9zKHBob25lTnVtYmVySW5mb3M6IFBob25lTnVtYmVySW5mb1tdKSB7XG4gICAgICAgIHRoaXMuY29kZU51bWJlckluZm9zID0gcGhvbmVOdW1iZXJJbmZvcyA/PyBbXTtcbiAgICAgICAgaWYgKHBob25lTnVtYmVySW5mb3MubGVuZ3RoID4gMCkge1xuICAgICAgICAgICAgLy8gRFMgQmVoYXZpb3I6IHNlbGVjdCBieSBkZWZhdWx0IHRoZSBmaXJzdCBwaG9uZSBudW1iZXIgY29kZVxuICAgICAgICAgICAgY29uc3QgZGVmYXVsdFZhbHVlID0gcGhvbmVOdW1iZXJJbmZvc1swXS5waG9uZU51bWJlckNvZGU7XG4gICAgICAgICAgICB0aGlzLmZvcm1Hcm91cC5jb250cm9scy5waG9uZU51bWJlckNvZGUuc2V0VmFsdWUoZGVmYXVsdFZhbHVlKTtcbiAgICAgICAgICAgIHRoaXMucGhvbmVOdW1iZXJDb2RlID0gZGVmYXVsdFZhbHVlO1xuICAgICAgICB9XG4gICAgfVxuICAgIGNvZGVOdW1iZXJJbmZvczogUGhvbmVOdW1iZXJJbmZvW10gPSBbXTtcbiAgICBASW5wdXQoeyByZXF1aXJlZDogdHJ1ZSB9KSBuYW1lITogc3RyaW5nO1xuICAgIEBJbnB1dCh7IHJlcXVpcmVkOiB0cnVlIH0pIHBsYWNlaG9sZGVyITogc3RyaW5nO1xuICAgIEBJbnB1dCgpIHNldCBwaG9uZU51bWJlcihwaG9uZU51bWJlcjogc3RyaW5nKSB7XG4gICAgICAgIHRoaXMuZm9ybUdyb3VwLmNvbnRyb2xzLnBob25lTnVtYmVyLnNldFZhbHVlKHBob25lTnVtYmVyKTtcbiAgICB9XG4gICAgQElucHV0KCkgc2V0IHBob25lTnVtYmVyQ29kZShwaG9uZU51bWJlckNvZGU6IHN0cmluZykge1xuICAgICAgICB0aGlzLmZvcm1Hcm91cC5jb250cm9scy5waG9uZU51bWJlckNvZGUuc2V0VmFsdWUocGhvbmVOdW1iZXJDb2RlKTtcbiAgICB9XG5cbiAgICBAT3V0cHV0KCkgY2hhbmdlUGhvbmVOdW1iZXI6IEV2ZW50RW1pdHRlcjxzdHJpbmc+ID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XG4gICAgQE91dHB1dCgpIGNoYW5nZVBob25lTnVtYmVyQ29kZTogRXZlbnRFbWl0dGVyPHN0cmluZz4gPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcblxuICAgIGZvcm1Hcm91cCA9IG5ldyBGb3JtR3JvdXAoe1xuICAgICAgICBwaG9uZU51bWJlckNvZGU6IG5ldyBGb3JtQ29udHJvbDxzdHJpbmc+KCcnLCBbVmFsaWRhdG9ycy5yZXF1aXJlZF0pLFxuICAgICAgICBwaG9uZU51bWJlcjogbmV3IEZvcm1Db250cm9sPHN0cmluZz4oJycsIFtWYWxpZGF0b3JzLnJlcXVpcmVkXSksXG4gICAgfSk7XG5cbiAgICBwdWJsaWMgb25Ub3VjaGVkOiAoKSA9PiB2b2lkID0gKCkgPT4ge307XG5cbiAgICBwdWJsaWMgb25DaGFuZ2VkOiAodmFsdWU6IGFueSkgPT4gdm9pZCA9ICgpID0+IHt9O1xuXG4gICAgcmVnaXN0ZXJPbkNoYW5nZShmbjogKHZhbHVlOiBhbnkpID0+IHZvaWQpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5vbkNoYW5nZWQgPSBmbjtcbiAgICB9XG5cbiAgICByZWdpc3Rlck9uVG91Y2hlZChmbjogYW55KTogdm9pZCB7XG4gICAgICAgIHRoaXMub25Ub3VjaGVkID0gZm47XG4gICAgfVxuXG4gICAgdmFsaWRhdGUoKTogVmFsaWRhdGlvbkVycm9ycyB8IG51bGwge1xuICAgICAgICByZXR1cm4gdGhpcy5mb3JtR3JvdXAudmFsaWQgPyBudWxsIDogeyBwaG9uZU51bWJlcjogJ2ludmFsaWQnLCAuLi50aGlzLmZvcm1Hcm91cC5lcnJvcnMgfTtcbiAgICB9XG5cbiAgICB3cml0ZVZhbHVlKHBob25lOiBQaG9uZSB8IG51bGwpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5mb3JtR3JvdXAuc2V0VmFsdWUocGhvbmUgPT09IG51bGwgPyBJTklUSUFMX1BIT05FX05VTUJFUl9JTlBVVF9WQUxVRSA6IHBob25lKTtcbiAgICAgICAgaWYgKHBob25lID09PSBudWxsKSB7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cbiAgICAgICAgdGhpcy5mb3JtR3JvdXAubWFya0FsbEFzVG91Y2hlZCgpO1xuICAgICAgICBPYmplY3QudmFsdWVzKHRoaXMuZm9ybUdyb3VwLmNvbnRyb2xzKS5mb3JFYWNoKChjb250cm9sKSA9PiBjb250cm9sLm1hcmtBc0RpcnR5KCkpO1xuICAgIH1cblxuICAgIHBob25lTnVtYmVyQ29kZVNlYXJjaEZuKHRlcm06IHN0cmluZywgaXRlbTogUGhvbmVOdW1iZXJJbmZvKTogYm9vbGVhbiB7XG4gICAgICAgIGNvbnN0IHRlcm1DYXNlZCA9IHRlcm0udG9Mb2NhbGVMb3dlckNhc2UoKTtcbiAgICAgICAgcmV0dXJuIGl0ZW0uY291bnRyeU5hbWUudG9Mb2NhbGVMb3dlckNhc2UoKS5pbmRleE9mKHRlcm1DYXNlZCkgPiAtMSB8fCBpdGVtLnBob25lTnVtYmVyQ29kZS50b0xvY2FsZUxvd2VyQ2FzZSgpLmluZGV4T2YodGVybUNhc2VkKSA+IC0xO1xuICAgIH1cblxuICAgIC8qKlxuICAgICAqIEZpbHRlciB0aGUgcGhvbmUgbnVtYmVyIGlucHV0IHRvIG9ubHkgYWxsb3cgbnVtYmVyc1xuICAgICAqL1xuICAgIGZpbHRlckNoYXJzKGV2ZW50OiBJbnB1dEV2ZW50KTogdm9pZCB7XG4gICAgICAgIGlmIChldmVudC5pbnB1dFR5cGUgIT09ICdpbnNlcnRUZXh0Jykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG4gICAgICAgIGNvbnN0IGlucHV0Q2hhcjogc3RyaW5nIHwgbnVsbCA9IGV2ZW50LmRhdGE7XG4gICAgICAgIGlmIChpbnB1dENoYXIgJiYgIU5VTUJFUl9PTkxZX1BBVFRFUk4udGVzdChpbnB1dENoYXIpKSB7XG4gICAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICB9XG4gICAgfVxufVxuIiwiPG5nLWNvbnRhaW5lciBbZm9ybUdyb3VwXT1cImZvcm1Hcm91cFwiPlxuICAgIDxuZy1zZWxlY3RcbiAgICAgICAgICAgIGFwU2VsZWN0XG4gICAgICAgICAgICBkYXRhLXRlc3Q9XCJzdWJzY3JpcHRpb24tYmlsbGluZy1pbmZvcy1waG9uZU51bWJlckNvZGVcIlxuICAgICAgICAgICAgY2xhc3M9XCJhcC1waG9uZS1udW1iZXItY29kZS1zZWxlY3RcIlxuICAgICAgICAgICAgYmluZExhYmVsPVwiY291bnRyeU5hbWVcIlxuICAgICAgICAgICAgYmluZFZhbHVlPVwicGhvbmVOdW1iZXJDb2RlXCJcbiAgICAgICAgICAgIG5vdEZvdW5kVGV4dD1cIlwiXG4gICAgICAgICAgICBmb3JtQ29udHJvbE5hbWU9XCJwaG9uZU51bWJlckNvZGVcIlxuICAgICAgICAgICAgW2l0ZW1zXT1cImNvZGVOdW1iZXJJbmZvc1wiXG4gICAgICAgICAgICBbY2xlYXJhYmxlXT1cImZhbHNlXCJcbiAgICAgICAgICAgIFtzZWFyY2hhYmxlXT1cInRydWVcIlxuICAgICAgICAgICAgW3NlYXJjaEZuXT1cInBob25lTnVtYmVyQ29kZVNlYXJjaEZuXCJcbiAgICAgICAgICAgIChibHVyKT1cIm9uVG91Y2hlZCgpXCI+XG4gICAgICAgICAgICA8bmctdGVtcGxhdGVcbiAgICAgICAgICAgICAgICBsZXQtaXRlbT1cIml0ZW1cIlxuICAgICAgICAgICAgICAgIG5nLWxhYmVsLXRtcD5cbiAgICAgICAgICAgICAgICBAaWYgKGl0ZW0gJiYgaXRlbS5jb3VudHJ5Q29kZSkge1xuICAgICAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiZmxhZ1wiPlxuICAgICAgICAgICAgICAgICAgICAgICAgQGlmICghIWZsYWdzQnVja2V0VXJsKSB7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPGltZ1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB3aWR0aD1cIjI0XCJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgaGVpZ2h0PVwiMTZcIlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBhbHQ9XCJmbGFnXCJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgW25nU3JjXT1cImZsYWdzQnVja2V0VXJsICsgJy8nICsgaXRlbS5jb3VudHJ5Q29kZS50b1VwcGVyQ2FzZSgpICsgJy5wbmcnXCIgLz5cbiAgICAgICAgICAgICAgICAgICAgICAgIH0gQGVsc2Uge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxzcGFuPnt7IGl0ZW0uY291bnRyeUNvZGUgfX08L3NwYW4+XG4gICAgICAgICAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIDwvbmctdGVtcGxhdGU+XG4gICAgICAgICAgICA8bmctdGVtcGxhdGVcbiAgICAgICAgICAgICAgICBsZXQtaXRlbT1cIml0ZW1cIlxuICAgICAgICAgICAgICAgIGxldC1pdGVtJD1cIml0ZW0kXCJcbiAgICAgICAgICAgICAgICBuZy1vcHRpb24tdG1wPlxuICAgICAgICAgICAgICAgIDxhcC1kcm9wZG93bi1pdGVtLXNpbmdsZS1vbmUtbGluZVxuICAgICAgICAgICAgICAgICAgICBbdGV4dF09XCJpdGVtLmNvdW50cnlOYW1lICsgJyAtICcgKyBpdGVtLnBob25lTnVtYmVyQ29kZVwiXG4gICAgICAgICAgICAgICAgICAgIFtzZWxlY3RlZF09XCJpdGVtJC5zZWxlY3RlZFwiXG4gICAgICAgICAgICAgICAgLz5cbiAgICAgICAgICAgIDwvbmctdGVtcGxhdGU+XG4gICAgPC9uZy1zZWxlY3Q+XG4gICAgPGFwLWlucHV0LWdyb3VwIGNsYXNzPVwicGhvbmUtbnVtYmVyLWlucHV0LWdyb3VwXCI+XG4gICAgICAgIDxhcC1pbnB1dC1wcmVmaXg+e3tmb3JtR3JvdXAuY29udHJvbHMucGhvbmVOdW1iZXJDb2RlLnZhbHVlfX08L2FwLWlucHV0LXByZWZpeD5cbiAgICAgICAgPGlucHV0XG4gICAgICAgICAgICAgICAgYXBJbnB1dFxuICAgICAgICAgICAgICAgIGNsYXNzPVwicGhvbmUtZmllbGRcIlxuICAgICAgICAgICAgICAgIGRhdGEtdGVzdD1cInN1YnNjcmlwdGlvbi1iaWxsaW5nLWluZm9zLXBob25lTnVtYmVySW5wdXRcIlxuICAgICAgICAgICAgICAgIHR5cGU9XCJ0ZXh0XCJcbiAgICAgICAgICAgICAgICBkYXRhLXJlY3VybHk9XCJwaG9uZVwiXG4gICAgICAgICAgICAgICAgZm9ybUNvbnRyb2xOYW1lPVwicGhvbmVOdW1iZXJcIlxuICAgICAgICAgICAgICAgIFtwbGFjZWhvbGRlcl09XCJwbGFjZWhvbGRlclwiXG4gICAgICAgICAgICAgICAgW2F0dHIubmFtZV09XCJuYW1lXCJcbiAgICAgICAgICAgICAgICAoYmVmb3JlaW5wdXQpPVwiZmlsdGVyQ2hhcnMoJGV2ZW50KVwiXG4gICAgICAgICAgICAgICAgKGJsdXIpPVwib25Ub3VjaGVkKClcIlxuICAgICAgICAvPlxuICAgIDwvYXAtaW5wdXQtZ3JvdXA+XG48L25nLWNvbnRhaW5lcj5cbiJdfQ==
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
export * from './phone-number-input.component';
|
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2xpYnMvdWktY29tcG9uZW50cy9waG9uZS1udW1iZXItaW5wdXQvc3JjL3B1YmxpY19hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxnQ0FBZ0MsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vcGhvbmUtbnVtYmVyLWlucHV0LmNvbXBvbmVudCc7XG4iXX0=
|
|
@@ -4,18 +4,27 @@ import { Component, ChangeDetectionStrategy, ViewEncapsulation, Input } from '@a
|
|
|
4
4
|
class InputGroupComponent {
|
|
5
5
|
symbolPosition = 'left';
|
|
6
6
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: InputGroupComponent, isStandalone: true, selector: "ap-input-group", inputs: { symbolPosition: "symbolPosition" }, ngImport: i0, template: "<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-
|
|
7
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: InputGroupComponent, isStandalone: true, selector: "ap-input-group", inputs: { symbolPosition: "symbolPosition" }, ngImport: i0, template: "<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-input-prefix\" />\n <ng-content select=\"ap-symbol\" />\n <ng-content select=\"input[apInput]\" />\n</div>\n", styles: ["ap-input-group.valid .ap-input-group{border-color:var(--comp-input-border-success-color)}ap-input-group.invalid .ap-input-group{border-color:var(--comp-input-border-error-color)}ap-input-group .ap-input-group{width:100%;display:inline-flex;align-items:center;height:var(--comp-input-height);border:1px 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);gap:var(--ref-spacing-xxs);padding:0 var(--ref-spacing-xs)}ap-input-group .ap-input-group:has(input[disabled]){background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input-group .ap-input-group:has(input.valid){border-color:var(--comp-input-border-success-color)}ap-input-group .ap-input-group:has(input.invalid),ap-input-group .ap-input-group:has(input.ng-invalid.ng-dirty.ng-touched){border-color:var(--comp-input-border-error-color)}ap-input-group .ap-input-group:hover:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-hover-color)}ap-input-group .ap-input-group:focus-within:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-focused-color)}ap-input-group .ap-input-group:focus-visible:not(.disabled):not(:has(input[disabled])){outline:none}ap-input-group .ap-input-group:active:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-focused-color)}ap-input-group .ap-input-group.disabled{background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input-group .ap-input-group.inverse{flex-direction:row-reverse}ap-input-group .ap-input-group input.ap-input{flex:1;padding-left:0;padding-right:0}ap-input-group .ap-input-group input.ap-input.valid:not([disabled]):not(:focus):not(:hover){border:none}ap-input-group .ap-input-group input.ap-input.invalid:not([disabled]):not(:focus):not(:hover),ap-input-group .ap-input-group input.ap-input.ng-invalid.ng-dirty.ng-touched:not([disabled]):not(:focus):not(:hover){border:none}ap-input-group .ap-input-group 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);pointer-events:none;box-sizing:content-box}ap-input-group .ap-input-group ap-symbol:hover{cursor:text}ap-input-group .ap-input-group .ap-input{border:none;outline:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
8
8
|
}
|
|
9
9
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputGroupComponent, decorators: [{
|
|
10
10
|
type: Component,
|
|
11
|
-
args: [{ selector: 'ap-input-group', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-
|
|
11
|
+
args: [{ selector: 'ap-input-group', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-input-prefix\" />\n <ng-content select=\"ap-symbol\" />\n <ng-content select=\"input[apInput]\" />\n</div>\n", styles: ["ap-input-group.valid .ap-input-group{border-color:var(--comp-input-border-success-color)}ap-input-group.invalid .ap-input-group{border-color:var(--comp-input-border-error-color)}ap-input-group .ap-input-group{width:100%;display:inline-flex;align-items:center;height:var(--comp-input-height);border:1px 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);gap:var(--ref-spacing-xxs);padding:0 var(--ref-spacing-xs)}ap-input-group .ap-input-group:has(input[disabled]){background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input-group .ap-input-group:has(input.valid){border-color:var(--comp-input-border-success-color)}ap-input-group .ap-input-group:has(input.invalid),ap-input-group .ap-input-group:has(input.ng-invalid.ng-dirty.ng-touched){border-color:var(--comp-input-border-error-color)}ap-input-group .ap-input-group:hover:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-hover-color)}ap-input-group .ap-input-group:focus-within:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-focused-color)}ap-input-group .ap-input-group:focus-visible:not(.disabled):not(:has(input[disabled])){outline:none}ap-input-group .ap-input-group:active:not(.disabled):not(:has(input[disabled])){border-color:var(--comp-input-border-focused-color)}ap-input-group .ap-input-group.disabled{background-color:var(--comp-input-fill-disabled-color);color:var(--comp-input-text-disabled-color)}ap-input-group .ap-input-group.inverse{flex-direction:row-reverse}ap-input-group .ap-input-group input.ap-input{flex:1;padding-left:0;padding-right:0}ap-input-group .ap-input-group input.ap-input.valid:not([disabled]):not(:focus):not(:hover){border:none}ap-input-group .ap-input-group input.ap-input.invalid:not([disabled]):not(:focus):not(:hover),ap-input-group .ap-input-group input.ap-input.ng-invalid.ng-dirty.ng-touched:not([disabled]):not(:focus):not(:hover){border:none}ap-input-group .ap-input-group 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);pointer-events:none;box-sizing:content-box}ap-input-group .ap-input-group ap-symbol:hover{cursor:text}ap-input-group .ap-input-group .ap-input{border:none;outline:none}\n"] }]
|
|
12
12
|
}], propDecorators: { symbolPosition: [{
|
|
13
13
|
type: Input
|
|
14
14
|
}] } });
|
|
15
15
|
|
|
16
|
+
class InputPrefixComponent {
|
|
17
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputPrefixComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
18
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.3", type: InputPrefixComponent, isStandalone: true, selector: "ap-input-prefix", ngImport: i0, template: "<ng-content/>\n", styles: ["ap-input-prefix{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-right:var(--ref-spacing-xxs);border-right:1px solid var(--ref-color-grey-20);color:var(--comp-input-text-default-color);font-family:var(--comp-input-text-font-family);font-size:var(--comp-input-text-size);font-weight:var(--comp-input-text-font-weight)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
19
|
+
}
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: InputPrefixComponent, decorators: [{
|
|
21
|
+
type: Component,
|
|
22
|
+
args: [{ selector: 'ap-input-prefix', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content/>\n", styles: ["ap-input-prefix{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-right:var(--ref-spacing-xxs);border-right:1px solid var(--ref-color-grey-20);color:var(--comp-input-text-default-color);font-family:var(--comp-input-text-font-family);font-size:var(--comp-input-text-size);font-weight:var(--comp-input-text-font-weight)}\n"] }]
|
|
23
|
+
}] });
|
|
24
|
+
|
|
16
25
|
/**
|
|
17
26
|
* Generated bundle index. Do not edit.
|
|
18
27
|
*/
|
|
19
28
|
|
|
20
|
-
export { InputGroupComponent };
|
|
29
|
+
export { InputGroupComponent, InputPrefixComponent };
|
|
21
30
|
//# sourceMappingURL=agorapulse-ui-components-input-group.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"agorapulse-ui-components-input-group.mjs","sources":["../../../libs/ui-components/input-group/src/input-group.component.ts","../../../libs/ui-components/input-group/src/input-group.component.html","../../../libs/ui-components/input-group/src/agorapulse-ui-components-input-group.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'ap-input-group',\n templateUrl: './input-group.component.html',\n styleUrls: ['./input-group.component.scss'],\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class InputGroupComponent {\n @Input() symbolPosition: 'left' | 'right' = 'left';\n}\n","<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-
|
|
1
|
+
{"version":3,"file":"agorapulse-ui-components-input-group.mjs","sources":["../../../libs/ui-components/input-group/src/input-group.component.ts","../../../libs/ui-components/input-group/src/input-group.component.html","../../../libs/ui-components/input-group/src/input-prefix/input-prefix.component.ts","../../../libs/ui-components/input-group/src/input-prefix/input-prefix.component.html","../../../libs/ui-components/input-group/src/agorapulse-ui-components-input-group.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'ap-input-group',\n templateUrl: './input-group.component.html',\n styleUrls: ['./input-group.component.scss'],\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class InputGroupComponent {\n @Input() symbolPosition: 'left' | 'right' = 'left';\n}\n","<div\n class=\"ap-input-group\"\n [class.inverse]=\"symbolPosition === 'right'\">\n <ng-content select=\"ap-input-prefix\" />\n <ng-content select=\"ap-symbol\" />\n <ng-content select=\"input[apInput]\" />\n</div>\n","import {ChangeDetectionStrategy, Component, ViewEncapsulation} from '@angular/core';\n\n@Component({\n selector: 'ap-input-prefix',\n templateUrl: './input-prefix.component.html',\n styleUrls: ['./input-prefix.component.scss'],\n standalone: true,\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class InputPrefixComponent {\n}\n","<ng-content/>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;MAUa,mBAAmB,CAAA;IACnB,cAAc,GAAqB,MAAM,CAAC;uGAD1C,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,wHCVhC,yOAOA,EAAA,MAAA,EAAA,CAAA,k/EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FDGa,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAR/B,SAAS;+BACI,gBAAgB,EAAA,UAAA,EAGd,IAAI,EACC,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,yOAAA,EAAA,MAAA,EAAA,CAAA,k/EAAA,CAAA,EAAA,CAAA;8BAG5B,cAAc,EAAA,CAAA;sBAAtB,KAAK;;;MEDG,oBAAoB,CAAA;uGAApB,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,2ECVjC,iBACA,EAAA,MAAA,EAAA,CAAA,kWAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FDSa,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBARhC,SAAS;+BACI,iBAAiB,EAAA,UAAA,EAGf,IAAI,EACC,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,kWAAA,CAAA,EAAA,CAAA;;;AERzC;;AAEG;;;;"}
|
|
@@ -0,0 +1,154 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { EventEmitter, forwardRef, Component, ViewEncapsulation, Input, Output } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/forms';
|
|
4
|
+
import { FormGroup, FormControl, Validators, NG_VALUE_ACCESSOR, NG_VALIDATORS, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
5
|
+
import { CommonModule, NgOptimizedImage } from '@angular/common';
|
|
6
|
+
import * as i2 from '@ng-select/ng-select';
|
|
7
|
+
import { NgSelectModule } from '@ng-select/ng-select';
|
|
8
|
+
import { InputGroupComponent, InputPrefixComponent } from '@agorapulse/ui-components/input-group';
|
|
9
|
+
import { SelectBaseDirective, DropdownItemSingleOneLineComponent } from '@agorapulse/ui-components/select';
|
|
10
|
+
import { InputDirective } from '@agorapulse/ui-components/input';
|
|
11
|
+
|
|
12
|
+
/* eslint-disable @typescript-eslint/no-empty-function */
|
|
13
|
+
const INITIAL_PHONE_NUMBER_INPUT_VALUE = {
|
|
14
|
+
phoneNumber: '',
|
|
15
|
+
phoneNumberCode: '',
|
|
16
|
+
};
|
|
17
|
+
const NUMBER_ONLY_PATTERN = /[0-9]/;
|
|
18
|
+
class PhoneNumberInputComponent {
|
|
19
|
+
set errorsDisplayForced(errorsDisplayForced) {
|
|
20
|
+
if (errorsDisplayForced) {
|
|
21
|
+
this.formGroup.markAllAsTouched();
|
|
22
|
+
Object.values(this.formGroup.controls).forEach((control) => control.markAsDirty());
|
|
23
|
+
this.formGroup.updateValueAndValidity();
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
flagsBucketUrl;
|
|
27
|
+
set phoneNumberInfos(phoneNumberInfos) {
|
|
28
|
+
this.codeNumberInfos = phoneNumberInfos ?? [];
|
|
29
|
+
if (phoneNumberInfos.length > 0) {
|
|
30
|
+
// DS Behavior: select by default the first phone number code
|
|
31
|
+
const defaultValue = phoneNumberInfos[0].phoneNumberCode;
|
|
32
|
+
this.formGroup.controls.phoneNumberCode.setValue(defaultValue);
|
|
33
|
+
this.phoneNumberCode = defaultValue;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
codeNumberInfos = [];
|
|
37
|
+
name;
|
|
38
|
+
placeholder;
|
|
39
|
+
set phoneNumber(phoneNumber) {
|
|
40
|
+
this.formGroup.controls.phoneNumber.setValue(phoneNumber);
|
|
41
|
+
}
|
|
42
|
+
set phoneNumberCode(phoneNumberCode) {
|
|
43
|
+
this.formGroup.controls.phoneNumberCode.setValue(phoneNumberCode);
|
|
44
|
+
}
|
|
45
|
+
changePhoneNumber = new EventEmitter();
|
|
46
|
+
changePhoneNumberCode = new EventEmitter();
|
|
47
|
+
formGroup = new FormGroup({
|
|
48
|
+
phoneNumberCode: new FormControl('', [Validators.required]),
|
|
49
|
+
phoneNumber: new FormControl('', [Validators.required]),
|
|
50
|
+
});
|
|
51
|
+
onTouched = () => { };
|
|
52
|
+
onChanged = () => { };
|
|
53
|
+
registerOnChange(fn) {
|
|
54
|
+
this.onChanged = fn;
|
|
55
|
+
}
|
|
56
|
+
registerOnTouched(fn) {
|
|
57
|
+
this.onTouched = fn;
|
|
58
|
+
}
|
|
59
|
+
validate() {
|
|
60
|
+
return this.formGroup.valid ? null : { phoneNumber: 'invalid', ...this.formGroup.errors };
|
|
61
|
+
}
|
|
62
|
+
writeValue(phone) {
|
|
63
|
+
this.formGroup.setValue(phone === null ? INITIAL_PHONE_NUMBER_INPUT_VALUE : phone);
|
|
64
|
+
if (phone === null) {
|
|
65
|
+
return;
|
|
66
|
+
}
|
|
67
|
+
this.formGroup.markAllAsTouched();
|
|
68
|
+
Object.values(this.formGroup.controls).forEach((control) => control.markAsDirty());
|
|
69
|
+
}
|
|
70
|
+
phoneNumberCodeSearchFn(term, item) {
|
|
71
|
+
const termCased = term.toLocaleLowerCase();
|
|
72
|
+
return item.countryName.toLocaleLowerCase().indexOf(termCased) > -1 || item.phoneNumberCode.toLocaleLowerCase().indexOf(termCased) > -1;
|
|
73
|
+
}
|
|
74
|
+
/**
|
|
75
|
+
* Filter the phone number input to only allow numbers
|
|
76
|
+
*/
|
|
77
|
+
filterChars(event) {
|
|
78
|
+
if (event.inputType !== 'insertText') {
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
const inputChar = event.data;
|
|
82
|
+
if (inputChar && !NUMBER_ONLY_PATTERN.test(inputChar)) {
|
|
83
|
+
event.preventDefault();
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: PhoneNumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
87
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.3", type: PhoneNumberInputComponent, isStandalone: true, selector: "ap-phone-number-input", inputs: { errorsDisplayForced: "errorsDisplayForced", flagsBucketUrl: "flagsBucketUrl", phoneNumberInfos: "phoneNumberInfos", name: "name", placeholder: "placeholder", phoneNumber: "phoneNumber", phoneNumberCode: "phoneNumberCode" }, outputs: { changePhoneNumber: "changePhoneNumber", changePhoneNumberCode: "changePhoneNumberCode" }, providers: [
|
|
88
|
+
{
|
|
89
|
+
provide: NG_VALUE_ACCESSOR,
|
|
90
|
+
useExisting: forwardRef(() => PhoneNumberInputComponent),
|
|
91
|
+
multi: true,
|
|
92
|
+
},
|
|
93
|
+
{
|
|
94
|
+
provide: NG_VALIDATORS,
|
|
95
|
+
useExisting: forwardRef(() => PhoneNumberInputComponent),
|
|
96
|
+
multi: true,
|
|
97
|
+
},
|
|
98
|
+
], ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\n <ng-select\n apSelect\n data-test=\"subscription-billing-infos-phoneNumberCode\"\n class=\"ap-phone-number-code-select\"\n bindLabel=\"countryName\"\n bindValue=\"phoneNumberCode\"\n notFoundText=\"\"\n formControlName=\"phoneNumberCode\"\n [items]=\"codeNumberInfos\"\n [clearable]=\"false\"\n [searchable]=\"true\"\n [searchFn]=\"phoneNumberCodeSearchFn\"\n (blur)=\"onTouched()\">\n <ng-template\n let-item=\"item\"\n ng-label-tmp>\n @if (item && item.countryCode) {\n <div class=\"flag\">\n @if (!!flagsBucketUrl) {\n <img\n width=\"24\"\n height=\"16\"\n alt=\"flag\"\n [ngSrc]=\"flagsBucketUrl + '/' + item.countryCode.toUpperCase() + '.png'\" />\n } @else {\n <span>{{ item.countryCode }}</span>\n }\n </div>\n }\n </ng-template>\n <ng-template\n let-item=\"item\"\n let-item$=\"item$\"\n ng-option-tmp>\n <ap-dropdown-item-single-one-line\n [text]=\"item.countryName + ' - ' + item.phoneNumberCode\"\n [selected]=\"item$.selected\"\n />\n </ng-template>\n </ng-select>\n <ap-input-group class=\"phone-number-input-group\">\n <ap-input-prefix>{{formGroup.controls.phoneNumberCode.value}}</ap-input-prefix>\n <input\n apInput\n class=\"phone-field\"\n data-test=\"subscription-billing-infos-phoneNumberInput\"\n type=\"text\"\n data-recurly=\"phone\"\n formControlName=\"phoneNumber\"\n [placeholder]=\"placeholder\"\n [attr.name]=\"name\"\n (beforeinput)=\"filterChars($event)\"\n (blur)=\"onTouched()\"\n />\n </ap-input-group>\n</ng-container>\n", styles: ["ng-dropdown-panel.ap-phone-number-code-select{width:auto!important}ap-phone-number-input{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--ref-spacing-xxs)}ap-phone-number-input .ap-phone-number-code-select{flex:0 0 70px;width:70px}ap-phone-number-input .ap-phone-number-code-select .flag{display:flex;flex-direction:row;align-items:center;justify-content:center;overflow:hidden}ap-phone-number-input .ap-phone-number-code-select .flag img{max-height:16px;max-width:24px;object-fit:cover;border-radius:4px;object-position:center center}ap-phone-number-input .ap-phone-number-code-select .ng-input{padding:2px var(--ref-spacing-sm)}ap-phone-number-input .phone-number-input-group{flex:1 0 auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "component", type: InputGroupComponent, selector: "ap-input-group", inputs: ["symbolPosition"] }, { kind: "directive", type: SelectBaseDirective, selector: "ng-select[apSelect]", inputs: ["inlineLabel", "symbolId"] }, { kind: "directive", type: InputDirective, selector: "[apInput]" }, { kind: "component", type: InputPrefixComponent, selector: "ap-input-prefix" }, { kind: "component", type: DropdownItemSingleOneLineComponent, selector: "ap-dropdown-item-single-one-line", inputs: ["text", "selected", "disabled", "avatarUrl", "symbolId", "disabledTooltip", "badgeText", "dividerEnabled", "network"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
99
|
+
}
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: PhoneNumberInputComponent, decorators: [{
|
|
101
|
+
type: Component,
|
|
102
|
+
args: [{ selector: 'ap-phone-number-input', standalone: true, imports: [
|
|
103
|
+
CommonModule,
|
|
104
|
+
FormsModule,
|
|
105
|
+
NgSelectModule,
|
|
106
|
+
InputGroupComponent,
|
|
107
|
+
SelectBaseDirective,
|
|
108
|
+
InputDirective,
|
|
109
|
+
InputPrefixComponent,
|
|
110
|
+
DropdownItemSingleOneLineComponent,
|
|
111
|
+
ReactiveFormsModule,
|
|
112
|
+
NgOptimizedImage,
|
|
113
|
+
], providers: [
|
|
114
|
+
{
|
|
115
|
+
provide: NG_VALUE_ACCESSOR,
|
|
116
|
+
useExisting: forwardRef(() => PhoneNumberInputComponent),
|
|
117
|
+
multi: true,
|
|
118
|
+
},
|
|
119
|
+
{
|
|
120
|
+
provide: NG_VALIDATORS,
|
|
121
|
+
useExisting: forwardRef(() => PhoneNumberInputComponent),
|
|
122
|
+
multi: true,
|
|
123
|
+
},
|
|
124
|
+
], encapsulation: ViewEncapsulation.None, template: "<ng-container [formGroup]=\"formGroup\">\n <ng-select\n apSelect\n data-test=\"subscription-billing-infos-phoneNumberCode\"\n class=\"ap-phone-number-code-select\"\n bindLabel=\"countryName\"\n bindValue=\"phoneNumberCode\"\n notFoundText=\"\"\n formControlName=\"phoneNumberCode\"\n [items]=\"codeNumberInfos\"\n [clearable]=\"false\"\n [searchable]=\"true\"\n [searchFn]=\"phoneNumberCodeSearchFn\"\n (blur)=\"onTouched()\">\n <ng-template\n let-item=\"item\"\n ng-label-tmp>\n @if (item && item.countryCode) {\n <div class=\"flag\">\n @if (!!flagsBucketUrl) {\n <img\n width=\"24\"\n height=\"16\"\n alt=\"flag\"\n [ngSrc]=\"flagsBucketUrl + '/' + item.countryCode.toUpperCase() + '.png'\" />\n } @else {\n <span>{{ item.countryCode }}</span>\n }\n </div>\n }\n </ng-template>\n <ng-template\n let-item=\"item\"\n let-item$=\"item$\"\n ng-option-tmp>\n <ap-dropdown-item-single-one-line\n [text]=\"item.countryName + ' - ' + item.phoneNumberCode\"\n [selected]=\"item$.selected\"\n />\n </ng-template>\n </ng-select>\n <ap-input-group class=\"phone-number-input-group\">\n <ap-input-prefix>{{formGroup.controls.phoneNumberCode.value}}</ap-input-prefix>\n <input\n apInput\n class=\"phone-field\"\n data-test=\"subscription-billing-infos-phoneNumberInput\"\n type=\"text\"\n data-recurly=\"phone\"\n formControlName=\"phoneNumber\"\n [placeholder]=\"placeholder\"\n [attr.name]=\"name\"\n (beforeinput)=\"filterChars($event)\"\n (blur)=\"onTouched()\"\n />\n </ap-input-group>\n</ng-container>\n", styles: ["ng-dropdown-panel.ap-phone-number-code-select{width:auto!important}ap-phone-number-input{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--ref-spacing-xxs)}ap-phone-number-input .ap-phone-number-code-select{flex:0 0 70px;width:70px}ap-phone-number-input .ap-phone-number-code-select .flag{display:flex;flex-direction:row;align-items:center;justify-content:center;overflow:hidden}ap-phone-number-input .ap-phone-number-code-select .flag img{max-height:16px;max-width:24px;object-fit:cover;border-radius:4px;object-position:center center}ap-phone-number-input .ap-phone-number-code-select .ng-input{padding:2px var(--ref-spacing-sm)}ap-phone-number-input .phone-number-input-group{flex:1 0 auto}\n"] }]
|
|
125
|
+
}], propDecorators: { errorsDisplayForced: [{
|
|
126
|
+
type: Input
|
|
127
|
+
}], flagsBucketUrl: [{
|
|
128
|
+
type: Input,
|
|
129
|
+
args: [{ required: true }]
|
|
130
|
+
}], phoneNumberInfos: [{
|
|
131
|
+
type: Input,
|
|
132
|
+
args: [{ required: true }]
|
|
133
|
+
}], name: [{
|
|
134
|
+
type: Input,
|
|
135
|
+
args: [{ required: true }]
|
|
136
|
+
}], placeholder: [{
|
|
137
|
+
type: Input,
|
|
138
|
+
args: [{ required: true }]
|
|
139
|
+
}], phoneNumber: [{
|
|
140
|
+
type: Input
|
|
141
|
+
}], phoneNumberCode: [{
|
|
142
|
+
type: Input
|
|
143
|
+
}], changePhoneNumber: [{
|
|
144
|
+
type: Output
|
|
145
|
+
}], changePhoneNumberCode: [{
|
|
146
|
+
type: Output
|
|
147
|
+
}] } });
|
|
148
|
+
|
|
149
|
+
/**
|
|
150
|
+
* Generated bundle index. Do not edit.
|
|
151
|
+
*/
|
|
152
|
+
|
|
153
|
+
export { PhoneNumberInputComponent };
|
|
154
|
+
//# sourceMappingURL=agorapulse-ui-components-phone-number-input.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"agorapulse-ui-components-phone-number-input.mjs","sources":["../../../libs/ui-components/phone-number-input/src/phone-number-input.component.ts","../../../libs/ui-components/phone-number-input/src/phone-number-input.component.html","../../../libs/ui-components/phone-number-input/src/agorapulse-ui-components-phone-number-input.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-empty-function */\nimport {Component, EventEmitter, forwardRef, Input, Output, ViewEncapsulation} from '@angular/core';\nimport {\n ControlValueAccessor,\n FormControl,\n FormGroup,\n FormsModule,\n NG_VALIDATORS,\n NG_VALUE_ACCESSOR,\n ReactiveFormsModule,\n ValidationErrors,\n Validator,\n Validators,\n} from '@angular/forms';\nimport {CommonModule, NgOptimizedImage} from '@angular/common';\nimport {NgSelectModule} from '@ng-select/ng-select';\nimport {InputGroupComponent, InputPrefixComponent} from \"@agorapulse/ui-components/input-group\";\nimport {DropdownItemSingleOneLineComponent, SelectBaseDirective} from \"@agorapulse/ui-components/select\";\nimport {InputDirective} from \"@agorapulse/ui-components/input\";\n\nexport interface PhoneNumberInfo {\n countryCode: string;\n countryName: string;\n phoneNumberCode: string;\n}\n\nexport interface Phone {\n phoneNumber: string;\n phoneNumberCode: string;\n}\n\nconst INITIAL_PHONE_NUMBER_INPUT_VALUE: Phone = {\n phoneNumber: '',\n phoneNumberCode: '',\n};\n\nconst NUMBER_ONLY_PATTERN = /[0-9]/;\n\n@Component({\n selector: 'ap-phone-number-input',\n templateUrl: 'phone-number-input.component.html',\n styleUrls: ['phone-number-input.component.scss'],\n standalone: true,\n imports: [\n CommonModule,\n FormsModule,\n NgSelectModule,\n InputGroupComponent,\n SelectBaseDirective,\n InputDirective,\n InputPrefixComponent,\n DropdownItemSingleOneLineComponent,\n ReactiveFormsModule,\n NgOptimizedImage,\n ],\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => PhoneNumberInputComponent),\n multi: true,\n },\n {\n provide: NG_VALIDATORS,\n useExisting: forwardRef(() => PhoneNumberInputComponent),\n multi: true,\n },\n ],\n encapsulation: ViewEncapsulation.None,\n})\nexport class PhoneNumberInputComponent implements ControlValueAccessor, Validator {\n @Input() set errorsDisplayForced(errorsDisplayForced: boolean) {\n if (errorsDisplayForced) {\n this.formGroup.markAllAsTouched();\n Object.values(this.formGroup.controls).forEach((control) => control.markAsDirty());\n this.formGroup.updateValueAndValidity();\n }\n }\n @Input({ required: true }) flagsBucketUrl!: string;\n @Input({ required: true }) set phoneNumberInfos(phoneNumberInfos: PhoneNumberInfo[]) {\n this.codeNumberInfos = phoneNumberInfos ?? [];\n if (phoneNumberInfos.length > 0) {\n // DS Behavior: select by default the first phone number code\n const defaultValue = phoneNumberInfos[0].phoneNumberCode;\n this.formGroup.controls.phoneNumberCode.setValue(defaultValue);\n this.phoneNumberCode = defaultValue;\n }\n }\n codeNumberInfos: PhoneNumberInfo[] = [];\n @Input({ required: true }) name!: string;\n @Input({ required: true }) placeholder!: string;\n @Input() set phoneNumber(phoneNumber: string) {\n this.formGroup.controls.phoneNumber.setValue(phoneNumber);\n }\n @Input() set phoneNumberCode(phoneNumberCode: string) {\n this.formGroup.controls.phoneNumberCode.setValue(phoneNumberCode);\n }\n\n @Output() changePhoneNumber: EventEmitter<string> = new EventEmitter<string>();\n @Output() changePhoneNumberCode: EventEmitter<string> = new EventEmitter<string>();\n\n formGroup = new FormGroup({\n phoneNumberCode: new FormControl<string>('', [Validators.required]),\n phoneNumber: new FormControl<string>('', [Validators.required]),\n });\n\n public onTouched: () => void = () => {};\n\n public onChanged: (value: any) => void = () => {};\n\n registerOnChange(fn: (value: any) => void): void {\n this.onChanged = fn;\n }\n\n registerOnTouched(fn: any): void {\n this.onTouched = fn;\n }\n\n validate(): ValidationErrors | null {\n return this.formGroup.valid ? null : { phoneNumber: 'invalid', ...this.formGroup.errors };\n }\n\n writeValue(phone: Phone | null): void {\n this.formGroup.setValue(phone === null ? INITIAL_PHONE_NUMBER_INPUT_VALUE : phone);\n if (phone === null) {\n return;\n }\n this.formGroup.markAllAsTouched();\n Object.values(this.formGroup.controls).forEach((control) => control.markAsDirty());\n }\n\n phoneNumberCodeSearchFn(term: string, item: PhoneNumberInfo): boolean {\n const termCased = term.toLocaleLowerCase();\n return item.countryName.toLocaleLowerCase().indexOf(termCased) > -1 || item.phoneNumberCode.toLocaleLowerCase().indexOf(termCased) > -1;\n }\n\n /**\n * Filter the phone number input to only allow numbers\n */\n filterChars(event: InputEvent): void {\n if (event.inputType !== 'insertText') {\n return;\n }\n const inputChar: string | null = event.data;\n if (inputChar && !NUMBER_ONLY_PATTERN.test(inputChar)) {\n event.preventDefault();\n }\n }\n}\n","<ng-container [formGroup]=\"formGroup\">\n <ng-select\n apSelect\n data-test=\"subscription-billing-infos-phoneNumberCode\"\n class=\"ap-phone-number-code-select\"\n bindLabel=\"countryName\"\n bindValue=\"phoneNumberCode\"\n notFoundText=\"\"\n formControlName=\"phoneNumberCode\"\n [items]=\"codeNumberInfos\"\n [clearable]=\"false\"\n [searchable]=\"true\"\n [searchFn]=\"phoneNumberCodeSearchFn\"\n (blur)=\"onTouched()\">\n <ng-template\n let-item=\"item\"\n ng-label-tmp>\n @if (item && item.countryCode) {\n <div class=\"flag\">\n @if (!!flagsBucketUrl) {\n <img\n width=\"24\"\n height=\"16\"\n alt=\"flag\"\n [ngSrc]=\"flagsBucketUrl + '/' + item.countryCode.toUpperCase() + '.png'\" />\n } @else {\n <span>{{ item.countryCode }}</span>\n }\n </div>\n }\n </ng-template>\n <ng-template\n let-item=\"item\"\n let-item$=\"item$\"\n ng-option-tmp>\n <ap-dropdown-item-single-one-line\n [text]=\"item.countryName + ' - ' + item.phoneNumberCode\"\n [selected]=\"item$.selected\"\n />\n </ng-template>\n </ng-select>\n <ap-input-group class=\"phone-number-input-group\">\n <ap-input-prefix>{{formGroup.controls.phoneNumberCode.value}}</ap-input-prefix>\n <input\n apInput\n class=\"phone-field\"\n data-test=\"subscription-billing-infos-phoneNumberInput\"\n type=\"text\"\n data-recurly=\"phone\"\n formControlName=\"phoneNumber\"\n [placeholder]=\"placeholder\"\n [attr.name]=\"name\"\n (beforeinput)=\"filterChars($event)\"\n (blur)=\"onTouched()\"\n />\n </ap-input-group>\n</ng-container>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;;;;;AAAA;AA+BA,MAAM,gCAAgC,GAAU;AAC5C,IAAA,WAAW,EAAE,EAAE;AACf,IAAA,eAAe,EAAE,EAAE;CACtB,CAAC;AAEF,MAAM,mBAAmB,GAAG,OAAO,CAAC;MAiCvB,yBAAyB,CAAA;IAClC,IAAa,mBAAmB,CAAC,mBAA4B,EAAA;QACzD,IAAI,mBAAmB,EAAE;AACrB,YAAA,IAAI,CAAC,SAAS,CAAC,gBAAgB,EAAE,CAAC;YAClC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,KAAK,OAAO,CAAC,WAAW,EAAE,CAAC,CAAC;AACnF,YAAA,IAAI,CAAC,SAAS,CAAC,sBAAsB,EAAE,CAAC;SAC3C;KACJ;AAC0B,IAAA,cAAc,CAAU;IACnD,IAA+B,gBAAgB,CAAC,gBAAmC,EAAA;AAC/E,QAAA,IAAI,CAAC,eAAe,GAAG,gBAAgB,IAAI,EAAE,CAAC;AAC9C,QAAA,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE;;YAE7B,MAAM,YAAY,GAAG,gBAAgB,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC;YACzD,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;AAC/D,YAAA,IAAI,CAAC,eAAe,GAAG,YAAY,CAAC;SACvC;KACJ;IACD,eAAe,GAAsB,EAAE,CAAC;AACb,IAAA,IAAI,CAAU;AACd,IAAA,WAAW,CAAU;IAChD,IAAa,WAAW,CAAC,WAAmB,EAAA;QACxC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;KAC7D;IACD,IAAa,eAAe,CAAC,eAAuB,EAAA;QAChD,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;KACrE;AAES,IAAA,iBAAiB,GAAyB,IAAI,YAAY,EAAU,CAAC;AACrE,IAAA,qBAAqB,GAAyB,IAAI,YAAY,EAAU,CAAC;IAEnF,SAAS,GAAG,IAAI,SAAS,CAAC;QACtB,eAAe,EAAE,IAAI,WAAW,CAAS,EAAE,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;QACnE,WAAW,EAAE,IAAI,WAAW,CAAS,EAAE,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;AAClE,KAAA,CAAC,CAAC;AAEI,IAAA,SAAS,GAAe,MAAK,GAAG,CAAC;AAEjC,IAAA,SAAS,GAAyB,MAAK,GAAG,CAAC;AAElD,IAAA,gBAAgB,CAAC,EAAwB,EAAA;AACrC,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;KACvB;AAED,IAAA,iBAAiB,CAAC,EAAO,EAAA;AACrB,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;KACvB;IAED,QAAQ,GAAA;QACJ,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,GAAG,IAAI,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC;KAC7F;AAED,IAAA,UAAU,CAAC,KAAmB,EAAA;AAC1B,QAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,KAAK,IAAI,GAAG,gCAAgC,GAAG,KAAK,CAAC,CAAC;AACnF,QAAA,IAAI,KAAK,KAAK,IAAI,EAAE;YAChB,OAAO;SACV;AACD,QAAA,IAAI,CAAC,SAAS,CAAC,gBAAgB,EAAE,CAAC;QAClC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,KAAK,OAAO,CAAC,WAAW,EAAE,CAAC,CAAC;KACtF;IAED,uBAAuB,CAAC,IAAY,EAAE,IAAqB,EAAA;AACvD,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;AAC3C,QAAA,OAAO,IAAI,CAAC,WAAW,CAAC,iBAAiB,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,IAAI,CAAC,eAAe,CAAC,iBAAiB,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC;KAC3I;AAED;;AAEG;AACH,IAAA,WAAW,CAAC,KAAiB,EAAA;AACzB,QAAA,IAAI,KAAK,CAAC,SAAS,KAAK,YAAY,EAAE;YAClC,OAAO;SACV;AACD,QAAA,MAAM,SAAS,GAAkB,KAAK,CAAC,IAAI,CAAC;QAC5C,IAAI,SAAS,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE;YACnD,KAAK,CAAC,cAAc,EAAE,CAAC;SAC1B;KACJ;uGA7EQ,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAzB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,yBAAyB,EAdvB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,MAAA,EAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,IAAA,EAAA,MAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,uBAAA,EAAA,EAAA,SAAA,EAAA;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,yBAAyB,CAAC;AACxD,gBAAA,KAAK,EAAE,IAAI;AACd,aAAA;AACD,YAAA;AACI,gBAAA,OAAO,EAAE,aAAa;AACtB,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,yBAAyB,CAAC;AACxD,gBAAA,KAAK,EAAE,IAAI;AACd,aAAA;SACJ,EClEL,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,4wEAyDA,sxBDbQ,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACZ,WAAW,EACX,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,8MAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,0FAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,cAAc,mkCACd,mBAAmB,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,mBAAmB,EACnB,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,cAAc,sDACd,oBAAoB,EAAA,QAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACpB,kCAAkC,EAClC,QAAA,EAAA,kCAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,mBAAmB,gVACnB,gBAAgB,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,UAAA,EAAA,cAAA,EAAA,wBAAA,EAAA,MAAA,EAAA,aAAA,EAAA,mBAAA,EAAA,KAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAgBX,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBA/BrC,SAAS;+BACI,uBAAuB,EAAA,UAAA,EAGrB,IAAI,EACP,OAAA,EAAA;wBACL,YAAY;wBACZ,WAAW;wBACX,cAAc;wBACd,mBAAmB;wBACnB,mBAAmB;wBACnB,cAAc;wBACd,oBAAoB;wBACpB,kCAAkC;wBAClC,mBAAmB;wBACnB,gBAAgB;qBACnB,EACU,SAAA,EAAA;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,+BAA+B,CAAC;AACxD,4BAAA,KAAK,EAAE,IAAI;AACd,yBAAA;AACD,wBAAA;AACI,4BAAA,OAAO,EAAE,aAAa;AACtB,4BAAA,WAAW,EAAE,UAAU,CAAC,+BAA+B,CAAC;AACxD,4BAAA,KAAK,EAAE,IAAI;AACd,yBAAA;qBACJ,EACc,aAAA,EAAA,iBAAiB,CAAC,IAAI,EAAA,QAAA,EAAA,4wEAAA,EAAA,MAAA,EAAA,CAAA,+tBAAA,CAAA,EAAA,CAAA;8BAGxB,mBAAmB,EAAA,CAAA;sBAA/B,KAAK;gBAOqB,cAAc,EAAA,CAAA;sBAAxC,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAA;gBACM,gBAAgB,EAAA,CAAA;sBAA9C,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAA;gBAUE,IAAI,EAAA,CAAA;sBAA9B,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAA;gBACE,WAAW,EAAA,CAAA;sBAArC,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAA;gBACZ,WAAW,EAAA,CAAA;sBAAvB,KAAK;gBAGO,eAAe,EAAA,CAAA;sBAA3B,KAAK;gBAII,iBAAiB,EAAA,CAAA;sBAA1B,MAAM;gBACG,qBAAqB,EAAA,CAAA;sBAA9B,MAAM;;;AElGX;;AAEG;;;;"}
|
|
@@ -2,5 +2,5 @@ import * as i0 from "@angular/core";
|
|
|
2
2
|
export declare class InputGroupComponent {
|
|
3
3
|
symbolPosition: 'left' | 'right';
|
|
4
4
|
static ɵfac: i0.ɵɵFactoryDeclaration<InputGroupComponent, never>;
|
|
5
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<InputGroupComponent, "ap-input-group", never, { "symbolPosition": { "alias": "symbolPosition"; "required": false; }; }, {}, never, ["ap-symbol", "input[apInput]"], true, never>;
|
|
5
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<InputGroupComponent, "ap-input-group", never, { "symbolPosition": { "alias": "symbolPosition"; "required": false; }; }, {}, never, ["ap-input-prefix", "ap-symbol", "input[apInput]"], true, never>;
|
|
6
6
|
}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
export declare class InputPrefixComponent {
|
|
3
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<InputPrefixComponent, never>;
|
|
4
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<InputPrefixComponent, "ap-input-prefix", never, {}, {}, never, ["*"], true, never>;
|
|
5
|
+
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@agorapulse/ui-components",
|
|
3
3
|
"description": "Agorapulse UI Components Library",
|
|
4
|
-
"version": "17.1.
|
|
4
|
+
"version": "17.1.4",
|
|
5
5
|
"author": "Benoit Hediard",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -163,18 +163,18 @@
|
|
|
163
163
|
"esm": "./esm2022/modal/agorapulse-ui-components-modal.mjs",
|
|
164
164
|
"default": "./fesm2022/agorapulse-ui-components-modal.mjs"
|
|
165
165
|
},
|
|
166
|
-
"./neo-datepicker": {
|
|
167
|
-
"types": "./neo-datepicker/index.d.ts",
|
|
168
|
-
"esm2022": "./esm2022/neo-datepicker/agorapulse-ui-components-neo-datepicker.mjs",
|
|
169
|
-
"esm": "./esm2022/neo-datepicker/agorapulse-ui-components-neo-datepicker.mjs",
|
|
170
|
-
"default": "./fesm2022/agorapulse-ui-components-neo-datepicker.mjs"
|
|
171
|
-
},
|
|
172
166
|
"./notification": {
|
|
173
167
|
"types": "./notification/index.d.ts",
|
|
174
168
|
"esm2022": "./esm2022/notification/agorapulse-ui-components-notification.mjs",
|
|
175
169
|
"esm": "./esm2022/notification/agorapulse-ui-components-notification.mjs",
|
|
176
170
|
"default": "./fesm2022/agorapulse-ui-components-notification.mjs"
|
|
177
171
|
},
|
|
172
|
+
"./neo-datepicker": {
|
|
173
|
+
"types": "./neo-datepicker/index.d.ts",
|
|
174
|
+
"esm2022": "./esm2022/neo-datepicker/agorapulse-ui-components-neo-datepicker.mjs",
|
|
175
|
+
"esm": "./esm2022/neo-datepicker/agorapulse-ui-components-neo-datepicker.mjs",
|
|
176
|
+
"default": "./fesm2022/agorapulse-ui-components-neo-datepicker.mjs"
|
|
177
|
+
},
|
|
178
178
|
"./paginator": {
|
|
179
179
|
"types": "./paginator/index.d.ts",
|
|
180
180
|
"esm2022": "./esm2022/paginator/agorapulse-ui-components-paginator.mjs",
|
|
@@ -187,6 +187,12 @@
|
|
|
187
187
|
"esm": "./esm2022/password-input/agorapulse-ui-components-password-input.mjs",
|
|
188
188
|
"default": "./fesm2022/agorapulse-ui-components-password-input.mjs"
|
|
189
189
|
},
|
|
190
|
+
"./phone-number-input": {
|
|
191
|
+
"types": "./phone-number-input/index.d.ts",
|
|
192
|
+
"esm2022": "./esm2022/phone-number-input/agorapulse-ui-components-phone-number-input.mjs",
|
|
193
|
+
"esm": "./esm2022/phone-number-input/agorapulse-ui-components-phone-number-input.mjs",
|
|
194
|
+
"default": "./fesm2022/agorapulse-ui-components-phone-number-input.mjs"
|
|
195
|
+
},
|
|
190
196
|
"./popmenu": {
|
|
191
197
|
"types": "./popmenu/index.d.ts",
|
|
192
198
|
"esm2022": "./esm2022/popmenu/agorapulse-ui-components-popmenu.mjs",
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { EventEmitter } from '@angular/core';
|
|
2
|
+
import { ControlValueAccessor, FormControl, FormGroup, ValidationErrors, Validator } from '@angular/forms';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
export interface PhoneNumberInfo {
|
|
5
|
+
countryCode: string;
|
|
6
|
+
countryName: string;
|
|
7
|
+
phoneNumberCode: string;
|
|
8
|
+
}
|
|
9
|
+
export interface Phone {
|
|
10
|
+
phoneNumber: string;
|
|
11
|
+
phoneNumberCode: string;
|
|
12
|
+
}
|
|
13
|
+
export declare class PhoneNumberInputComponent implements ControlValueAccessor, Validator {
|
|
14
|
+
set errorsDisplayForced(errorsDisplayForced: boolean);
|
|
15
|
+
flagsBucketUrl: string;
|
|
16
|
+
set phoneNumberInfos(phoneNumberInfos: PhoneNumberInfo[]);
|
|
17
|
+
codeNumberInfos: PhoneNumberInfo[];
|
|
18
|
+
name: string;
|
|
19
|
+
placeholder: string;
|
|
20
|
+
set phoneNumber(phoneNumber: string);
|
|
21
|
+
set phoneNumberCode(phoneNumberCode: string);
|
|
22
|
+
changePhoneNumber: EventEmitter<string>;
|
|
23
|
+
changePhoneNumberCode: EventEmitter<string>;
|
|
24
|
+
formGroup: FormGroup<{
|
|
25
|
+
phoneNumberCode: FormControl<string | null>;
|
|
26
|
+
phoneNumber: FormControl<string | null>;
|
|
27
|
+
}>;
|
|
28
|
+
onTouched: () => void;
|
|
29
|
+
onChanged: (value: any) => void;
|
|
30
|
+
registerOnChange(fn: (value: any) => void): void;
|
|
31
|
+
registerOnTouched(fn: any): void;
|
|
32
|
+
validate(): ValidationErrors | null;
|
|
33
|
+
writeValue(phone: Phone | null): void;
|
|
34
|
+
phoneNumberCodeSearchFn(term: string, item: PhoneNumberInfo): boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Filter the phone number input to only allow numbers
|
|
37
|
+
*/
|
|
38
|
+
filterChars(event: InputEvent): void;
|
|
39
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<PhoneNumberInputComponent, never>;
|
|
40
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<PhoneNumberInputComponent, "ap-phone-number-input", never, { "errorsDisplayForced": { "alias": "errorsDisplayForced"; "required": false; }; "flagsBucketUrl": { "alias": "flagsBucketUrl"; "required": true; }; "phoneNumberInfos": { "alias": "phoneNumberInfos"; "required": true; }; "name": { "alias": "name"; "required": true; }; "placeholder": { "alias": "placeholder"; "required": true; }; "phoneNumber": { "alias": "phoneNumber"; "required": false; }; "phoneNumberCode": { "alias": "phoneNumberCode"; "required": false; }; }, { "changePhoneNumber": "changePhoneNumber"; "changePhoneNumberCode": "changePhoneNumberCode"; }, never, never, true, never>;
|
|
41
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './phone-number-input.component';
|
|
Binary file
|