@educarehq/solaris-ui 0.13.0 → 0.14.0
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { InjectionToken, inject, PLATFORM_ID, Injectable, Pipe, Directive, signal, DestroyRef, DOCUMENT, input, computed, ChangeDetectionStrategy, Component, output, ElementRef, EnvironmentInjector, effect, createComponent, HostListener, contentChild, contentChildren, NgZone, TemplateRef, ViewContainerRef, Injector, viewChild, isDevMode, forwardRef, ChangeDetectorRef, booleanAttribute, numberAttribute, afterNextRender, ApplicationRef, model
|
|
2
|
+
import { InjectionToken, inject, PLATFORM_ID, Injectable, Pipe, Directive, signal, DestroyRef, DOCUMENT, input, computed, ChangeDetectionStrategy, Component, output, ElementRef, EnvironmentInjector, effect, createComponent, HostListener, contentChild, contentChildren, NgZone, TemplateRef, ViewContainerRef, Injector, viewChild, isDevMode, forwardRef, ChangeDetectorRef, booleanAttribute, numberAttribute, afterNextRender, viewChildren, ApplicationRef, model } from '@angular/core';
|
|
3
3
|
import { isPlatformBrowser, NgTemplateOutlet, DOCUMENT as DOCUMENT$1 } from '@angular/common';
|
|
4
4
|
import { FormControlDirective, FormControlName, NgModel, NG_VALUE_ACCESSOR, NgControl, FormsModule } from '@angular/forms';
|
|
5
5
|
import { Overlay, OverlayConfig } from '@angular/cdk/overlay';
|
|
@@ -125,6 +125,9 @@ const SOLARIS_TRANSLATE_DEFAULT_CONFIG = {
|
|
|
125
125
|
'solaris.phone-field.empty': 'No countries available',
|
|
126
126
|
'solaris.phone-field.noResults': 'No results found',
|
|
127
127
|
'solaris.phone-field.country': 'Select country code',
|
|
128
|
+
'solaris.otp-input.required': 'Code is required.',
|
|
129
|
+
'solaris.otp-input.invalid': 'Enter a valid code.',
|
|
130
|
+
'solaris.otp-input.box': 'Digit {{current}} of {{total}}',
|
|
128
131
|
},
|
|
129
132
|
'pt-BR': {
|
|
130
133
|
'solaris.button.loading': 'Carregando...',
|
|
@@ -201,6 +204,9 @@ const SOLARIS_TRANSLATE_DEFAULT_CONFIG = {
|
|
|
201
204
|
'solaris.phone-field.empty': 'Nenhum país disponível',
|
|
202
205
|
'solaris.phone-field.noResults': 'Nenhum resultado encontrado',
|
|
203
206
|
'solaris.phone-field.country': 'Selecionar código do país',
|
|
207
|
+
'solaris.otp-input.required': 'O código é obrigatório.',
|
|
208
|
+
'solaris.otp-input.invalid': 'Insira um código válido.',
|
|
209
|
+
'solaris.otp-input.box': 'Dígito {{current}} de {{total}}',
|
|
204
210
|
},
|
|
205
211
|
},
|
|
206
212
|
useBrowserLocale: true,
|
|
@@ -9715,6 +9721,7 @@ function getExampleNumberFor(country) {
|
|
|
9715
9721
|
class SolarisPhoneFieldComponent {
|
|
9716
9722
|
translateService = inject(SolarisTranslateService);
|
|
9717
9723
|
countryListFactory = inject(SOLARIS_PHONE_COUNTRY_LIST);
|
|
9724
|
+
themeService = inject(SolarisThemeService);
|
|
9718
9725
|
inputElementRef = viewChild('inputElement', ...(ngDevMode ? [{ debugName: "inputElementRef" }] : /* istanbul ignore next */ []));
|
|
9719
9726
|
popoverTrigger = viewChild(SolarisPopoverTriggerDirective, ...(ngDevMode ? [{ debugName: "popoverTrigger" }] : /* istanbul ignore next */ []));
|
|
9720
9727
|
projectedPrefix = contentChild(SolarisFormPrefixDirective, ...(ngDevMode ? [{ debugName: "projectedPrefix" }] : /* istanbul ignore next */ []));
|
|
@@ -9818,6 +9825,9 @@ class SolarisPhoneFieldComponent {
|
|
|
9818
9825
|
isEffectivelyDisabled = computed(() => {
|
|
9819
9826
|
return this.disabled() || this.internalDisabled();
|
|
9820
9827
|
}, ...(ngDevMode ? [{ debugName: "isEffectivelyDisabled" }] : /* istanbul ignore next */ []));
|
|
9828
|
+
effectiveDensity = computed(() => {
|
|
9829
|
+
return this.density() ?? this.themeService.density;
|
|
9830
|
+
}, ...(ngDevMode ? [{ debugName: "effectiveDensity" }] : /* istanbul ignore next */ []));
|
|
9821
9831
|
isEffectivelyReadonly = computed(() => {
|
|
9822
9832
|
return this.readonly();
|
|
9823
9833
|
}, ...(ngDevMode ? [{ debugName: "isEffectivelyReadonly" }] : /* istanbul ignore next */ []));
|
|
@@ -10075,13 +10085,13 @@ class SolarisPhoneFieldComponent {
|
|
|
10075
10085
|
this.translateWithDefault(fallbackKey, fallbackDefault));
|
|
10076
10086
|
}
|
|
10077
10087
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisPhoneFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10078
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SolarisPhoneFieldComponent, isStandalone: true, selector: "solaris-phone-field", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, hintKey: { classPropertyName: "hintKey", publicName: "hintKey", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, labelKey: { classPropertyName: "labelKey", publicName: "labelKey", isSignal: true, isRequired: false, transformFunction: null }, errorKey: { classPropertyName: "errorKey", publicName: "errorKey", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, invalidError: { classPropertyName: "invalidError", publicName: "invalidError", isSignal: true, isRequired: false, transformFunction: null }, requiredError: { classPropertyName: "requiredError", publicName: "requiredError", isSignal: true, isRequired: false, transformFunction: null }, placeholderKey: { classPropertyName: "placeholderKey", publicName: "placeholderKey", isSignal: true, isRequired: false, transformFunction: null }, invalidErrorKey: { classPropertyName: "invalidErrorKey", publicName: "invalidErrorKey", isSignal: true, isRequired: false, transformFunction: null }, requiredErrorKey: { classPropertyName: "requiredErrorKey", publicName: "requiredErrorKey", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, defaultCountry: { classPropertyName: "defaultCountry", publicName: "defaultCountry", isSignal: true, isRequired: false, transformFunction: null }, country: { classPropertyName: "country", publicName: "country", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, allowAnyCountry: { classPropertyName: "allowAnyCountry", publicName: "allowAnyCountry", isSignal: true, isRequired: false, transformFunction: null }, countryList: { classPropertyName: "countryList", publicName: "countryList", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, emptyTextKey: { classPropertyName: "emptyTextKey", publicName: "emptyTextKey", isSignal: true, isRequired: false, transformFunction: null }, noResultsText: { classPropertyName: "noResultsText", publicName: "noResultsText", isSignal: true, isRequired: false, transformFunction: null }, noResultsTextKey: { classPropertyName: "noResultsTextKey", publicName: "noResultsTextKey", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholderKey: { classPropertyName: "searchPlaceholderKey", publicName: "searchPlaceholderKey", isSignal: true, isRequired: false, transformFunction: null }, countryButtonLabel: { classPropertyName: "countryButtonLabel", publicName: "countryButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, countryButtonLabelKey: { classPropertyName: "countryButtonLabelKey", publicName: "countryButtonLabelKey", isSignal: true, isRequired: false, transformFunction: null }, panelMaxWidth: { classPropertyName: "panelMaxWidth", publicName: "panelMaxWidth", isSignal: true, isRequired: false, transformFunction: null }, panelMaxHeight: { classPropertyName: "panelMaxHeight", publicName: "panelMaxHeight", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", countryChange: "countryChange" }, host: { properties: { "attr.data-open": "panelOpen() ? \"\" : null" }, classAttribute: "solaris-phone-field" }, providers: [
|
|
10088
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SolarisPhoneFieldComponent, isStandalone: true, selector: "solaris-phone-field", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, hintKey: { classPropertyName: "hintKey", publicName: "hintKey", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, labelKey: { classPropertyName: "labelKey", publicName: "labelKey", isSignal: true, isRequired: false, transformFunction: null }, errorKey: { classPropertyName: "errorKey", publicName: "errorKey", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, invalidError: { classPropertyName: "invalidError", publicName: "invalidError", isSignal: true, isRequired: false, transformFunction: null }, requiredError: { classPropertyName: "requiredError", publicName: "requiredError", isSignal: true, isRequired: false, transformFunction: null }, placeholderKey: { classPropertyName: "placeholderKey", publicName: "placeholderKey", isSignal: true, isRequired: false, transformFunction: null }, invalidErrorKey: { classPropertyName: "invalidErrorKey", publicName: "invalidErrorKey", isSignal: true, isRequired: false, transformFunction: null }, requiredErrorKey: { classPropertyName: "requiredErrorKey", publicName: "requiredErrorKey", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, defaultCountry: { classPropertyName: "defaultCountry", publicName: "defaultCountry", isSignal: true, isRequired: false, transformFunction: null }, country: { classPropertyName: "country", publicName: "country", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, allowAnyCountry: { classPropertyName: "allowAnyCountry", publicName: "allowAnyCountry", isSignal: true, isRequired: false, transformFunction: null }, countryList: { classPropertyName: "countryList", publicName: "countryList", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, emptyTextKey: { classPropertyName: "emptyTextKey", publicName: "emptyTextKey", isSignal: true, isRequired: false, transformFunction: null }, noResultsText: { classPropertyName: "noResultsText", publicName: "noResultsText", isSignal: true, isRequired: false, transformFunction: null }, noResultsTextKey: { classPropertyName: "noResultsTextKey", publicName: "noResultsTextKey", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholderKey: { classPropertyName: "searchPlaceholderKey", publicName: "searchPlaceholderKey", isSignal: true, isRequired: false, transformFunction: null }, countryButtonLabel: { classPropertyName: "countryButtonLabel", publicName: "countryButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, countryButtonLabelKey: { classPropertyName: "countryButtonLabelKey", publicName: "countryButtonLabelKey", isSignal: true, isRequired: false, transformFunction: null }, panelMaxWidth: { classPropertyName: "panelMaxWidth", publicName: "panelMaxWidth", isSignal: true, isRequired: false, transformFunction: null }, panelMaxHeight: { classPropertyName: "panelMaxHeight", publicName: "panelMaxHeight", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", countryChange: "countryChange" }, host: { properties: { "attr.data-open": "panelOpen() ? \"\" : null", "attr.data-density": "effectiveDensity()" }, classAttribute: "solaris-phone-field" }, providers: [
|
|
10079
10089
|
{
|
|
10080
10090
|
provide: NG_VALUE_ACCESSOR,
|
|
10081
10091
|
useExisting: forwardRef(() => SolarisPhoneFieldComponent),
|
|
10082
10092
|
multi: true,
|
|
10083
10093
|
},
|
|
10084
|
-
], queries: [{ propertyName: "projectedPrefix", first: true, predicate: SolarisFormPrefixDirective, descendants: true, isSignal: true }, { propertyName: "projectedSuffix", first: true, predicate: SolarisFormSuffixDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }, { propertyName: "popoverTrigger", first: true, predicate: SolarisPopoverTriggerDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<solaris-form-field\n [hint]=\"hint()\"\n [label]=\"label()\"\n [radius]=\"radius()\"\n [density]=\"density()\"\n [hintKey]=\"hintKey()\"\n [labelKey]=\"labelKey()\"\n [errorKey]=\"errorKey()\"\n [required]=\"required()\"\n [optional]=\"optional()\"\n [readonly]=\"isEffectivelyReadonly()\"\n [appearance]=\"appearance()\"\n [invalid]=\"isFieldInvalid()\"\n [error]=\"error() || computedError()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [hasPrefix]=\"hasPrefix()\"\n [hasSuffix]=\"hasSuffix()\"\n solaris-popover-trigger\n [solarisPopoverTriggerFor]=\"countryPopover\"\n [solarisPopoverDisabled]=\"!canOpen()\"\n [solarisPopoverPlacement]=\"'bottom'\"\n [solarisPopoverAlign]=\"'start'\"\n [solarisPopoverOffset]=\"8\"\n [solarisPopoverPadding]=\"'none'\"\n [solarisPopoverRadius]=\"radius()\"\n [solarisPopoverMaxWidth]=\"panelMaxWidth()\"\n [solarisPopoverAppearance]=\"popoverAppearance()\"\n [solarisPopoverAutoFocus]=\"'first-tabbable'\"\n [solarisPopoverAriaHasPopup]=\"'listbox'\"\n>\n <button\n type=\"button\"\n class=\"solaris-phone-field__country\"\n solaris-form-prefix\n [attr.aria-label]=\"countryButtonLabelText()\"\n [attr.aria-haspopup]=\"'listbox'\"\n [attr.aria-expanded]=\"panelOpen() ? 'true' : 'false'\"\n [disabled]=\"!canOpen()\"\n (click)=\"onCountryToggle($event)\"\n >\n <span\n class=\"solaris-phone-field__flag\"\n [innerHTML]=\"selectedFlag() | solarisSafeHtml\"\n ></span>\n <solaris-icon\n class=\"solaris-phone-field__chevron\"\n name=\"chevron-down\"\n [decorative]=\"true\"\n />\n </button>\n\n <span class=\"solaris-phone-field__dial-code\"\n >+{{ selectedCallingCode() }}</span\n >\n\n <input\n type=\"tel\"\n #inputElement\n solaris-input\n data-bwignore=\"true\"\n [density]=\"density()\"\n (blur)=\"onInputBlur()\"\n [readonly]=\"isEffectivelyReadonly()\"\n (focus)=\"onInputFocus()\"\n (click)=\"onInputClick($event)\"\n [attr.id]=\"id() ?? null\"\n (input)=\"onInput($event)\"\n [value]=\"displayValue()\"\n [attr.inputmode]=\"'tel'\"\n [attr.autocapitalize]=\"'none'\"\n [attr.spellcheck]=\"'false'\"\n [attr.name]=\"name() ?? null\"\n [attr.autocomplete]=\"autocomplete()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [attr.maxlength]=\"maxLength() ?? null\"\n [attr.placeholder]=\"placeholderText() || null\"\n />\n\n @if (suffix() && !projectedSuffix()) {\n <span solaris-form-suffix>\n <solaris-icon [name]=\"suffix() ?? ''\" [decorative]=\"true\" />\n </span>\n }\n <ng-content\n select=\"[solaris-form-suffix]\"\n ngProjectAs=\"[solaris-form-suffix]\"\n />\n <ng-content\n select=\"[solaris-form-label-action]\"\n ngProjectAs=\"[solaris-form-label-action]\"\n />\n</solaris-form-field>\n\n<ng-template #countryPopover=\"solarisPopover\" solaris-popover>\n <solaris-phone-country-list\n [countries]=\"countries()\"\n [selectedCode]=\"effectiveCountry()\"\n [searchable]=\"searchable()\"\n [searchPlaceholder]=\"searchPlaceholderText()\"\n [noResultsText]=\"noResultsTextValue()\"\n [emptyText]=\"emptyTextValue()\"\n [maxHeight]=\"panelMaxHeight()\"\n (countrySelected)=\"selectCountry($event)\"\n (closeRequest)=\"closeCountryPanel()\"\n />\n</ng-template>\n", styles: [":host{--solaris-phone-field-country-gap: var(--solaris-spacing-1);--solaris-phone-field-country-padding-inline: var(--solaris-spacing-2);--solaris-phone-field-dial-code-color: var(--solaris-text-muted);--solaris-phone-field-flag-size: var(--solaris-font-size-sm);--solaris-phone-field-chevron-size: var(--solaris-font-size-xs);display:block;box-sizing:border-box}:host .solaris-phone-field__country.solaris-form-prefix{all:unset;display:inline-flex;box-sizing:border-box;align-items:center;gap:var(--solaris-phone-field-country-gap);padding-inline:var(--solaris-phone-field-country-padding-inline);cursor:pointer;color:var(--solaris-text-default);font-size:var(--solaris-font-size
|
|
10094
|
+
], queries: [{ propertyName: "projectedPrefix", first: true, predicate: SolarisFormPrefixDirective, descendants: true, isSignal: true }, { propertyName: "projectedSuffix", first: true, predicate: SolarisFormSuffixDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }, { propertyName: "popoverTrigger", first: true, predicate: SolarisPopoverTriggerDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<solaris-form-field\n [hint]=\"hint()\"\n [label]=\"label()\"\n [radius]=\"radius()\"\n [density]=\"density()\"\n [hintKey]=\"hintKey()\"\n [labelKey]=\"labelKey()\"\n [errorKey]=\"errorKey()\"\n [required]=\"required()\"\n [optional]=\"optional()\"\n [readonly]=\"isEffectivelyReadonly()\"\n [appearance]=\"appearance()\"\n [invalid]=\"isFieldInvalid()\"\n [error]=\"error() || computedError()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [hasPrefix]=\"hasPrefix()\"\n [hasSuffix]=\"hasSuffix()\"\n solaris-popover-trigger\n [solarisPopoverTriggerFor]=\"countryPopover\"\n [solarisPopoverDisabled]=\"!canOpen()\"\n [solarisPopoverPlacement]=\"'bottom'\"\n [solarisPopoverAlign]=\"'start'\"\n [solarisPopoverOffset]=\"8\"\n [solarisPopoverPadding]=\"'none'\"\n [solarisPopoverRadius]=\"radius()\"\n [solarisPopoverMaxWidth]=\"panelMaxWidth()\"\n [solarisPopoverAppearance]=\"popoverAppearance()\"\n [solarisPopoverAutoFocus]=\"'first-tabbable'\"\n [solarisPopoverAriaHasPopup]=\"'listbox'\"\n>\n <button\n type=\"button\"\n class=\"solaris-phone-field__country\"\n solaris-form-prefix\n [attr.aria-label]=\"countryButtonLabelText()\"\n [attr.aria-haspopup]=\"'listbox'\"\n [attr.aria-expanded]=\"panelOpen() ? 'true' : 'false'\"\n [disabled]=\"!canOpen()\"\n (click)=\"onCountryToggle($event)\"\n >\n <span\n class=\"solaris-phone-field__flag\"\n [innerHTML]=\"selectedFlag() | solarisSafeHtml\"\n ></span>\n <solaris-icon\n class=\"solaris-phone-field__chevron\"\n name=\"chevron-down\"\n [decorative]=\"true\"\n />\n </button>\n\n <span class=\"solaris-phone-field__dial-code\"\n >+{{ selectedCallingCode() }}</span\n >\n\n <input\n type=\"tel\"\n #inputElement\n solaris-input\n data-bwignore=\"true\"\n [density]=\"density()\"\n (blur)=\"onInputBlur()\"\n [readonly]=\"isEffectivelyReadonly()\"\n (focus)=\"onInputFocus()\"\n (click)=\"onInputClick($event)\"\n [attr.id]=\"id() ?? null\"\n (input)=\"onInput($event)\"\n [value]=\"displayValue()\"\n [attr.inputmode]=\"'tel'\"\n [attr.autocapitalize]=\"'none'\"\n [attr.spellcheck]=\"'false'\"\n [attr.name]=\"name() ?? null\"\n [attr.autocomplete]=\"autocomplete()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [attr.maxlength]=\"maxLength() ?? null\"\n [attr.placeholder]=\"placeholderText() || null\"\n />\n\n @if (suffix() && !projectedSuffix()) {\n <span solaris-form-suffix>\n <solaris-icon [name]=\"suffix() ?? ''\" [decorative]=\"true\" />\n </span>\n }\n <ng-content\n select=\"[solaris-form-suffix]\"\n ngProjectAs=\"[solaris-form-suffix]\"\n />\n <ng-content\n select=\"[solaris-form-label-action]\"\n ngProjectAs=\"[solaris-form-label-action]\"\n />\n</solaris-form-field>\n\n<ng-template #countryPopover=\"solarisPopover\" solaris-popover>\n <solaris-phone-country-list\n [countries]=\"countries()\"\n [selectedCode]=\"effectiveCountry()\"\n [searchable]=\"searchable()\"\n [searchPlaceholder]=\"searchPlaceholderText()\"\n [noResultsText]=\"noResultsTextValue()\"\n [emptyText]=\"emptyTextValue()\"\n [maxHeight]=\"panelMaxHeight()\"\n (countrySelected)=\"selectCountry($event)\"\n (closeRequest)=\"closeCountryPanel()\"\n />\n</ng-template>\n", styles: [":host{--solaris-phone-field-country-gap: var(--solaris-spacing-1);--solaris-phone-field-country-padding-inline: var(--solaris-spacing-2);--solaris-phone-field-dial-code-color: var(--solaris-text-muted);--solaris-phone-field-flag-size: var(--solaris-font-size-sm);--solaris-phone-field-chevron-size: var(--solaris-font-size-xs);--solaris-phone-field-country-font-size: var(--solaris-font-size-sm);display:block;box-sizing:border-box}:host .solaris-phone-field__country.solaris-form-prefix{all:unset;display:inline-flex;box-sizing:border-box;align-items:center;gap:var(--solaris-phone-field-country-gap);padding-inline:var(--solaris-phone-field-country-padding-inline);cursor:pointer;color:var(--solaris-text-default);font-size:var(--solaris-phone-field-country-font-size);line-height:var(--solaris-line-height-md)}:host .solaris-phone-field__country.solaris-form-prefix:focus-visible{outline-offset:2px;outline:2px solid var(--solaris-primary-base)}:host .solaris-phone-field__country.solaris-form-prefix[disabled]{cursor:not-allowed;opacity:.5}.solaris-phone-field__flag{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--solaris-phone-field-flag-size);font-size:var(--solaris-phone-field-flag-size);line-height:1}.solaris-phone-field__flag svg{display:block;width:100%;height:auto}:host .solaris-phone-field__country .solaris-phone-field__chevron{flex-shrink:0;color:var(--solaris-text-muted);block-size:var(--solaris-phone-field-chevron-size);inline-size:var(--solaris-phone-field-chevron-size);transition:transform var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}:host([data-open]) .solaris-phone-field__chevron{transform:rotate(180deg)}.solaris-phone-field__dial-code{flex:0 0 auto;-webkit-user-select:none;user-select:none;cursor:default;color:var(--solaris-phone-field-dial-code-color);font-size:var(--solaris-phone-field-country-font-size);line-height:var(--solaris-line-height-md);margin-inline-end:var(--solaris-spacing-1)}:host([data-density=compact]){--solaris-phone-field-country-font-size: var(--solaris-density-font-size);--solaris-phone-field-country-padding-inline: var( --solaris-density-padding-sm );--solaris-phone-field-flag-size: var(--solaris-font-size-xs);--solaris-phone-field-chevron-size: 10px}:host([data-density=normal]){--solaris-phone-field-country-font-size: var(--solaris-density-font-size);--solaris-phone-field-country-padding-inline: var( --solaris-density-padding-md );--solaris-phone-field-flag-size: var(--solaris-font-size-sm);--solaris-phone-field-chevron-size: var(--solaris-font-size-xs)}:host([data-density=comfortable]){--solaris-phone-field-country-font-size: var(--solaris-density-font-size);--solaris-phone-field-country-padding-inline: var( --solaris-density-padding-lg );--solaris-phone-field-flag-size: var(--solaris-font-size-md);--solaris-phone-field-chevron-size: var(--solaris-font-size-sm)}@media(prefers-reduced-motion:reduce){.solaris-phone-field__chevron{transition:none}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: SolarisFormFieldComponent, selector: "solaris-form-field", inputs: ["hintKey", "labelKey", "hint", "errorKey", "label", "error", "optionalLabel", "requiredLabel", "optionalLabelKey", "requiredLabelKey", "required", "optional", "invalid", "disabled", "readonly", "density", "radius", "appearance", "control", "hasPrefix", "hasSuffix", "prefix", "suffix"] }, { kind: "directive", type: SolarisFormPrefixDirective, selector: "[solaris-form-prefix]" }, { kind: "directive", type: SolarisFormSuffixDirective, selector: "[solaris-form-suffix]" }, { kind: "directive", type: SolarisInputDirective, selector: "[solaris-input]", inputs: ["appearance", "radius", "size", "density", "invalid", "fullWidth"] }, { kind: "component", type: SolarisIconComponent, selector: "solaris-icon", inputs: ["name", "ariaLabel", "decorative", "inheritColor"] }, { kind: "directive", type: SolarisPopoverDirective, selector: "ng-template[solaris-popover]", exportAs: ["solarisPopover"] }, { kind: "directive", type: SolarisPopoverTriggerDirective, selector: "[solaris-popover-trigger]", inputs: ["solarisPopoverTriggerFor", "solarisPopoverOpen", "solarisPopoverDisabled", "solarisPopoverPlacement", "solarisPopoverAlign", "solarisPopoverOffset", "solarisPopoverMatchTriggerWidth", "solarisPopoverMinWidth", "solarisPopoverMaxWidth", "solarisPopoverCloseOnOutsideClick", "solarisPopoverCloseOnEscape", "solarisPopoverRestoreFocus", "solarisPopoverAutoFocus", "solarisPopoverScrollStrategy", "solarisPopoverPanelRole", "solarisPopoverAriaHasPopup", "solarisPopoverAppearance", "solarisPopoverPadding", "solarisPopoverRadius", "solarisPopoverTopConnected"], outputs: ["solarisPopoverOpened", "solarisPopoverClosed", "solarisPopoverOpenChange"] }, { kind: "component", type: SolarisPhoneCountryListComponent, selector: "solaris-phone-country-list", inputs: ["countries", "selectedCode", "searchable", "searchPlaceholder", "noResultsText", "emptyText", "maxHeight"], outputs: ["countrySelected", "closeRequest"] }, { kind: "pipe", type: SolarisSafeHtmlPipe, name: "solarisSafeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10085
10095
|
}
|
|
10086
10096
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisPhoneFieldComponent, decorators: [{
|
|
10087
10097
|
type: Component,
|
|
@@ -10105,7 +10115,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
|
|
|
10105
10115
|
], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
10106
10116
|
class: 'solaris-phone-field',
|
|
10107
10117
|
'[attr.data-open]': 'panelOpen() ? "" : null',
|
|
10108
|
-
|
|
10118
|
+
'[attr.data-density]': 'effectiveDensity()',
|
|
10119
|
+
}, template: "<solaris-form-field\n [hint]=\"hint()\"\n [label]=\"label()\"\n [radius]=\"radius()\"\n [density]=\"density()\"\n [hintKey]=\"hintKey()\"\n [labelKey]=\"labelKey()\"\n [errorKey]=\"errorKey()\"\n [required]=\"required()\"\n [optional]=\"optional()\"\n [readonly]=\"isEffectivelyReadonly()\"\n [appearance]=\"appearance()\"\n [invalid]=\"isFieldInvalid()\"\n [error]=\"error() || computedError()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [hasPrefix]=\"hasPrefix()\"\n [hasSuffix]=\"hasSuffix()\"\n solaris-popover-trigger\n [solarisPopoverTriggerFor]=\"countryPopover\"\n [solarisPopoverDisabled]=\"!canOpen()\"\n [solarisPopoverPlacement]=\"'bottom'\"\n [solarisPopoverAlign]=\"'start'\"\n [solarisPopoverOffset]=\"8\"\n [solarisPopoverPadding]=\"'none'\"\n [solarisPopoverRadius]=\"radius()\"\n [solarisPopoverMaxWidth]=\"panelMaxWidth()\"\n [solarisPopoverAppearance]=\"popoverAppearance()\"\n [solarisPopoverAutoFocus]=\"'first-tabbable'\"\n [solarisPopoverAriaHasPopup]=\"'listbox'\"\n>\n <button\n type=\"button\"\n class=\"solaris-phone-field__country\"\n solaris-form-prefix\n [attr.aria-label]=\"countryButtonLabelText()\"\n [attr.aria-haspopup]=\"'listbox'\"\n [attr.aria-expanded]=\"panelOpen() ? 'true' : 'false'\"\n [disabled]=\"!canOpen()\"\n (click)=\"onCountryToggle($event)\"\n >\n <span\n class=\"solaris-phone-field__flag\"\n [innerHTML]=\"selectedFlag() | solarisSafeHtml\"\n ></span>\n <solaris-icon\n class=\"solaris-phone-field__chevron\"\n name=\"chevron-down\"\n [decorative]=\"true\"\n />\n </button>\n\n <span class=\"solaris-phone-field__dial-code\"\n >+{{ selectedCallingCode() }}</span\n >\n\n <input\n type=\"tel\"\n #inputElement\n solaris-input\n data-bwignore=\"true\"\n [density]=\"density()\"\n (blur)=\"onInputBlur()\"\n [readonly]=\"isEffectivelyReadonly()\"\n (focus)=\"onInputFocus()\"\n (click)=\"onInputClick($event)\"\n [attr.id]=\"id() ?? null\"\n (input)=\"onInput($event)\"\n [value]=\"displayValue()\"\n [attr.inputmode]=\"'tel'\"\n [attr.autocapitalize]=\"'none'\"\n [attr.spellcheck]=\"'false'\"\n [attr.name]=\"name() ?? null\"\n [attr.autocomplete]=\"autocomplete()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [attr.maxlength]=\"maxLength() ?? null\"\n [attr.placeholder]=\"placeholderText() || null\"\n />\n\n @if (suffix() && !projectedSuffix()) {\n <span solaris-form-suffix>\n <solaris-icon [name]=\"suffix() ?? ''\" [decorative]=\"true\" />\n </span>\n }\n <ng-content\n select=\"[solaris-form-suffix]\"\n ngProjectAs=\"[solaris-form-suffix]\"\n />\n <ng-content\n select=\"[solaris-form-label-action]\"\n ngProjectAs=\"[solaris-form-label-action]\"\n />\n</solaris-form-field>\n\n<ng-template #countryPopover=\"solarisPopover\" solaris-popover>\n <solaris-phone-country-list\n [countries]=\"countries()\"\n [selectedCode]=\"effectiveCountry()\"\n [searchable]=\"searchable()\"\n [searchPlaceholder]=\"searchPlaceholderText()\"\n [noResultsText]=\"noResultsTextValue()\"\n [emptyText]=\"emptyTextValue()\"\n [maxHeight]=\"panelMaxHeight()\"\n (countrySelected)=\"selectCountry($event)\"\n (closeRequest)=\"closeCountryPanel()\"\n />\n</ng-template>\n", styles: [":host{--solaris-phone-field-country-gap: var(--solaris-spacing-1);--solaris-phone-field-country-padding-inline: var(--solaris-spacing-2);--solaris-phone-field-dial-code-color: var(--solaris-text-muted);--solaris-phone-field-flag-size: var(--solaris-font-size-sm);--solaris-phone-field-chevron-size: var(--solaris-font-size-xs);--solaris-phone-field-country-font-size: var(--solaris-font-size-sm);display:block;box-sizing:border-box}:host .solaris-phone-field__country.solaris-form-prefix{all:unset;display:inline-flex;box-sizing:border-box;align-items:center;gap:var(--solaris-phone-field-country-gap);padding-inline:var(--solaris-phone-field-country-padding-inline);cursor:pointer;color:var(--solaris-text-default);font-size:var(--solaris-phone-field-country-font-size);line-height:var(--solaris-line-height-md)}:host .solaris-phone-field__country.solaris-form-prefix:focus-visible{outline-offset:2px;outline:2px solid var(--solaris-primary-base)}:host .solaris-phone-field__country.solaris-form-prefix[disabled]{cursor:not-allowed;opacity:.5}.solaris-phone-field__flag{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--solaris-phone-field-flag-size);font-size:var(--solaris-phone-field-flag-size);line-height:1}.solaris-phone-field__flag svg{display:block;width:100%;height:auto}:host .solaris-phone-field__country .solaris-phone-field__chevron{flex-shrink:0;color:var(--solaris-text-muted);block-size:var(--solaris-phone-field-chevron-size);inline-size:var(--solaris-phone-field-chevron-size);transition:transform var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}:host([data-open]) .solaris-phone-field__chevron{transform:rotate(180deg)}.solaris-phone-field__dial-code{flex:0 0 auto;-webkit-user-select:none;user-select:none;cursor:default;color:var(--solaris-phone-field-dial-code-color);font-size:var(--solaris-phone-field-country-font-size);line-height:var(--solaris-line-height-md);margin-inline-end:var(--solaris-spacing-1)}:host([data-density=compact]){--solaris-phone-field-country-font-size: var(--solaris-density-font-size);--solaris-phone-field-country-padding-inline: var( --solaris-density-padding-sm );--solaris-phone-field-flag-size: var(--solaris-font-size-xs);--solaris-phone-field-chevron-size: 10px}:host([data-density=normal]){--solaris-phone-field-country-font-size: var(--solaris-density-font-size);--solaris-phone-field-country-padding-inline: var( --solaris-density-padding-md );--solaris-phone-field-flag-size: var(--solaris-font-size-sm);--solaris-phone-field-chevron-size: var(--solaris-font-size-xs)}:host([data-density=comfortable]){--solaris-phone-field-country-font-size: var(--solaris-density-font-size);--solaris-phone-field-country-padding-inline: var( --solaris-density-padding-lg );--solaris-phone-field-flag-size: var(--solaris-font-size-md);--solaris-phone-field-chevron-size: var(--solaris-font-size-sm)}@media(prefers-reduced-motion:reduce){.solaris-phone-field__chevron{transition:none}}\n"] }]
|
|
10109
10120
|
}], ctorParameters: () => [], propDecorators: { inputElementRef: [{ type: i0.ViewChild, args: ['inputElement', { isSignal: true }] }], popoverTrigger: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SolarisPopoverTriggerDirective), { isSignal: true }] }], projectedPrefix: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SolarisFormPrefixDirective), { isSignal: true }] }], projectedSuffix: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SolarisFormSuffixDirective), { isSignal: true }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], hintKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintKey", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], labelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelKey", required: false }] }], errorKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorKey", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], invalidError: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalidError", required: false }] }], requiredError: [{ type: i0.Input, args: [{ isSignal: true, alias: "requiredError", required: false }] }], placeholderKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholderKey", required: false }] }], invalidErrorKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalidErrorKey", required: false }] }], requiredErrorKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "requiredErrorKey", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], autocomplete: [{ type: i0.Input, args: [{ isSignal: true, alias: "autocomplete", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], radius: [{ type: i0.Input, args: [{ isSignal: true, alias: "radius", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], maxLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxLength", required: false }] }], suffix: [{ type: i0.Input, args: [{ isSignal: true, alias: "suffix", required: false }] }], defaultCountry: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultCountry", required: false }] }], country: [{ type: i0.Input, args: [{ isSignal: true, alias: "country", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], allowAnyCountry: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowAnyCountry", required: false }] }], countryList: [{ type: i0.Input, args: [{ isSignal: true, alias: "countryList", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], emptyTextKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTextKey", required: false }] }], noResultsText: [{ type: i0.Input, args: [{ isSignal: true, alias: "noResultsText", required: false }] }], noResultsTextKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "noResultsTextKey", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], searchPlaceholderKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholderKey", required: false }] }], countryButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "countryButtonLabel", required: false }] }], countryButtonLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "countryButtonLabelKey", required: false }] }], panelMaxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelMaxWidth", required: false }] }], panelMaxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelMaxHeight", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], countryChange: [{ type: i0.Output, args: ["countryChange"] }] } });
|
|
10110
10121
|
|
|
10111
10122
|
function solarisPhoneValidator(country) {
|
|
@@ -10122,6 +10133,405 @@ function solarisPhoneValidator(country) {
|
|
|
10122
10133
|
};
|
|
10123
10134
|
}
|
|
10124
10135
|
|
|
10136
|
+
// SECURITY_EXCEPTION_FILE: nativeElement.focus() required to move focus between OTP boxes on typing/navigation.
|
|
10137
|
+
// Standard DOM method used by Angular CDK. ElementRef SSR-safe.
|
|
10138
|
+
// SECURITY_EXCEPTION_FILE: nativeElement.value read in onBoxInput to obtain the raw box value.
|
|
10139
|
+
const MASK_CHAR = '•';
|
|
10140
|
+
class SolarisOtpInputComponent extends SolarisFormControl {
|
|
10141
|
+
elementRef = inject(ElementRef);
|
|
10142
|
+
translateService = inject(SolarisTranslateService);
|
|
10143
|
+
themeService = inject(SolarisThemeService);
|
|
10144
|
+
boxRefs = viewChildren('box', ...(ngDevMode ? [{ debugName: "boxRefs" }] : /* istanbul ignore next */ []));
|
|
10145
|
+
hintKey = input(...(ngDevMode ? [undefined, { debugName: "hintKey" }] : /* istanbul ignore next */ []));
|
|
10146
|
+
hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
|
|
10147
|
+
labelKey = input(...(ngDevMode ? [undefined, { debugName: "labelKey" }] : /* istanbul ignore next */ []));
|
|
10148
|
+
errorKey = input(...(ngDevMode ? [undefined, { debugName: "errorKey" }] : /* istanbul ignore next */ []));
|
|
10149
|
+
value = input('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
10150
|
+
label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
10151
|
+
error = input('', ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
|
|
10152
|
+
requiredError = input(...(ngDevMode ? [undefined, { debugName: "requiredError" }] : /* istanbul ignore next */ []));
|
|
10153
|
+
invalidError = input(...(ngDevMode ? [undefined, { debugName: "invalidError" }] : /* istanbul ignore next */ []));
|
|
10154
|
+
requiredErrorKey = input(...(ngDevMode ? [undefined, { debugName: "requiredErrorKey" }] : /* istanbul ignore next */ []));
|
|
10155
|
+
invalidErrorKey = input(...(ngDevMode ? [undefined, { debugName: "invalidErrorKey" }] : /* istanbul ignore next */ []));
|
|
10156
|
+
requiredInput = input(false, { ...(ngDevMode ? { debugName: "requiredInput" } : /* istanbul ignore next */ {}), alias: 'required' });
|
|
10157
|
+
optional = input(false, ...(ngDevMode ? [{ debugName: "optional" }] : /* istanbul ignore next */ []));
|
|
10158
|
+
disabledInput = input(false, { ...(ngDevMode ? { debugName: "disabledInput" } : /* istanbul ignore next */ {}), alias: 'disabled' });
|
|
10159
|
+
readonlyInput = input(false, { ...(ngDevMode ? { debugName: "readonlyInput" } : /* istanbul ignore next */ {}), alias: 'readonly' });
|
|
10160
|
+
manualInvalid = input(undefined, { ...(ngDevMode ? { debugName: "manualInvalid" } : /* istanbul ignore next */ {}), alias: 'invalid' });
|
|
10161
|
+
maxLength = input(12, ...(ngDevMode ? [{ debugName: "maxLength" }] : /* istanbul ignore next */ []));
|
|
10162
|
+
minLength = input(1, ...(ngDevMode ? [{ debugName: "minLength" }] : /* istanbul ignore next */ []));
|
|
10163
|
+
charType = input('numeric', ...(ngDevMode ? [{ debugName: "charType" }] : /* istanbul ignore next */ []));
|
|
10164
|
+
masked = input(false, ...(ngDevMode ? [{ debugName: "masked" }] : /* istanbul ignore next */ []));
|
|
10165
|
+
separatorEvery = input(0, ...(ngDevMode ? [{ debugName: "separatorEvery" }] : /* istanbul ignore next */ []));
|
|
10166
|
+
autoFocus = input(false, ...(ngDevMode ? [{ debugName: "autoFocus" }] : /* istanbul ignore next */ []));
|
|
10167
|
+
appearance = input('outline', ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
|
|
10168
|
+
density = input(...(ngDevMode ? [undefined, { debugName: "density" }] : /* istanbul ignore next */ []));
|
|
10169
|
+
radius = input('md', ...(ngDevMode ? [{ debugName: "radius" }] : /* istanbul ignore next */ []));
|
|
10170
|
+
valueChange = output();
|
|
10171
|
+
completed = output();
|
|
10172
|
+
boxChars = signal([], ...(ngDevMode ? [{ debugName: "boxChars" }] : /* istanbul ignore next */ []));
|
|
10173
|
+
internalDisabled = signal(false, ...(ngDevMode ? [{ debugName: "internalDisabled" }] : /* istanbul ignore next */ []));
|
|
10174
|
+
internalFocused = signal(false, ...(ngDevMode ? [{ debugName: "internalFocused" }] : /* istanbul ignore next */ []));
|
|
10175
|
+
touched = signal(false, ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
|
|
10176
|
+
dirty = signal(false, ...(ngDevMode ? [{ debugName: "dirty" }] : /* istanbul ignore next */ []));
|
|
10177
|
+
focusedIndex = signal(-1, ...(ngDevMode ? [{ debugName: "focusedIndex" }] : /* istanbul ignore next */ []));
|
|
10178
|
+
_describedByIds = signal([], ...(ngDevMode ? [{ debugName: "_describedByIds" }] : /* istanbul ignore next */ []));
|
|
10179
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
10180
|
+
onChange = () => { };
|
|
10181
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
10182
|
+
onTouched = () => { };
|
|
10183
|
+
elementId = computed(() => {
|
|
10184
|
+
return resolveElementId(this.elementRef, 'solaris-otp-input');
|
|
10185
|
+
}, ...(ngDevMode ? [{ debugName: "elementId" }] : /* istanbul ignore next */ []));
|
|
10186
|
+
effectiveDensity = computed(() => {
|
|
10187
|
+
return this.density() ?? this.themeService.density;
|
|
10188
|
+
}, ...(ngDevMode ? [{ debugName: "effectiveDensity" }] : /* istanbul ignore next */ []));
|
|
10189
|
+
isEffectivelyDisabled = computed(() => {
|
|
10190
|
+
return this.disabledInput() || this.internalDisabled();
|
|
10191
|
+
}, ...(ngDevMode ? [{ debugName: "isEffectivelyDisabled" }] : /* istanbul ignore next */ []));
|
|
10192
|
+
isEffectivelyReadonly = computed(() => {
|
|
10193
|
+
return this.readonlyInput();
|
|
10194
|
+
}, ...(ngDevMode ? [{ debugName: "isEffectivelyReadonly" }] : /* istanbul ignore next */ []));
|
|
10195
|
+
inputmode = computed(() => {
|
|
10196
|
+
return this.charType() === 'numeric' ? 'numeric' : 'text';
|
|
10197
|
+
}, ...(ngDevMode ? [{ debugName: "inputmode" }] : /* istanbul ignore next */ []));
|
|
10198
|
+
boxes = computed(() => {
|
|
10199
|
+
const masked = this.masked();
|
|
10200
|
+
return this.boxChars().map((char) => (masked && char ? MASK_CHAR : char));
|
|
10201
|
+
}, ...(ngDevMode ? [{ debugName: "boxes" }] : /* istanbul ignore next */ []));
|
|
10202
|
+
valueString = computed(() => {
|
|
10203
|
+
return this.boxChars().join('');
|
|
10204
|
+
}, ...(ngDevMode ? [{ debugName: "valueString" }] : /* istanbul ignore next */ []));
|
|
10205
|
+
groupAriaLabel = computed(() => {
|
|
10206
|
+
const key = this.labelKey();
|
|
10207
|
+
if (key) {
|
|
10208
|
+
return this.translateService.translate(key) || this.label() || '';
|
|
10209
|
+
}
|
|
10210
|
+
return this.label() ?? '';
|
|
10211
|
+
}, ...(ngDevMode ? [{ debugName: "groupAriaLabel" }] : /* istanbul ignore next */ []));
|
|
10212
|
+
ariaDescribedBy = computed(() => {
|
|
10213
|
+
const ids = this._describedByIds();
|
|
10214
|
+
return ids.length > 0 ? ids.join(' ') : null;
|
|
10215
|
+
}, ...(ngDevMode ? [{ debugName: "ariaDescribedBy" }] : /* istanbul ignore next */ []));
|
|
10216
|
+
computedError = computed(() => {
|
|
10217
|
+
const manualError = this.error() || this.translateKey(this.errorKey());
|
|
10218
|
+
if (manualError)
|
|
10219
|
+
return manualError;
|
|
10220
|
+
const isTouchedOrDirty = this.touched() || this.dirty();
|
|
10221
|
+
if (!isTouchedOrDirty || this.internalFocused())
|
|
10222
|
+
return '';
|
|
10223
|
+
const value = this.valueString();
|
|
10224
|
+
if (!value) {
|
|
10225
|
+
if (this.requiredInput()) {
|
|
10226
|
+
return this.buildError(this.requiredError(), this.requiredErrorKey(), 'solaris.otp-input.required', 'Code is required.');
|
|
10227
|
+
}
|
|
10228
|
+
return '';
|
|
10229
|
+
}
|
|
10230
|
+
if (value.length < this.minLength()) {
|
|
10231
|
+
return this.buildError(this.invalidError(), this.invalidErrorKey(), 'solaris.otp-input.invalid', 'Enter a valid code.');
|
|
10232
|
+
}
|
|
10233
|
+
return '';
|
|
10234
|
+
}, ...(ngDevMode ? [{ debugName: "computedError" }] : /* istanbul ignore next */ []));
|
|
10235
|
+
isFieldInvalid = computed(() => {
|
|
10236
|
+
const manual = this.manualInvalid();
|
|
10237
|
+
if (manual !== undefined) {
|
|
10238
|
+
return manual;
|
|
10239
|
+
}
|
|
10240
|
+
if (this.internalFocused()) {
|
|
10241
|
+
return false;
|
|
10242
|
+
}
|
|
10243
|
+
const isTouchedOrDirty = this.touched() || this.dirty();
|
|
10244
|
+
if (!isTouchedOrDirty) {
|
|
10245
|
+
return false;
|
|
10246
|
+
}
|
|
10247
|
+
return !!this.computedError();
|
|
10248
|
+
}, ...(ngDevMode ? [{ debugName: "isFieldInvalid" }] : /* istanbul ignore next */ []));
|
|
10249
|
+
constructor() {
|
|
10250
|
+
super();
|
|
10251
|
+
this.boxChars.set(this.emptyChars());
|
|
10252
|
+
effect(() => {
|
|
10253
|
+
const length = this.maxLength();
|
|
10254
|
+
const current = this.boxChars();
|
|
10255
|
+
if (current.length !== length) {
|
|
10256
|
+
const resized = Array.from({ length }, (_, index) => current[index] ?? '');
|
|
10257
|
+
this.boxChars.set(resized);
|
|
10258
|
+
}
|
|
10259
|
+
});
|
|
10260
|
+
effect(() => {
|
|
10261
|
+
const value = this.value();
|
|
10262
|
+
if (value !== this.lastAppliedValue) {
|
|
10263
|
+
this.lastAppliedValue = value;
|
|
10264
|
+
this.boxChars.set(this.distributeValue(value));
|
|
10265
|
+
}
|
|
10266
|
+
});
|
|
10267
|
+
}
|
|
10268
|
+
lastAppliedValue = '';
|
|
10269
|
+
get id() {
|
|
10270
|
+
return this.elementId();
|
|
10271
|
+
}
|
|
10272
|
+
get focused() {
|
|
10273
|
+
return this.internalFocused();
|
|
10274
|
+
}
|
|
10275
|
+
get disabled() {
|
|
10276
|
+
return this.isEffectivelyDisabled();
|
|
10277
|
+
}
|
|
10278
|
+
get readonly() {
|
|
10279
|
+
return this.isEffectivelyReadonly();
|
|
10280
|
+
}
|
|
10281
|
+
get invalid() {
|
|
10282
|
+
return this.isFieldInvalid();
|
|
10283
|
+
}
|
|
10284
|
+
get required() {
|
|
10285
|
+
return this.requiredInput();
|
|
10286
|
+
}
|
|
10287
|
+
get describedByIds() {
|
|
10288
|
+
return this._describedByIds();
|
|
10289
|
+
}
|
|
10290
|
+
setDescribedByIds(ids) {
|
|
10291
|
+
this._describedByIds.set([...ids]);
|
|
10292
|
+
}
|
|
10293
|
+
focus() {
|
|
10294
|
+
const index = this.boxChars().findIndex((char) => !char);
|
|
10295
|
+
this.focusBox(index >= 0 ? index : 0);
|
|
10296
|
+
}
|
|
10297
|
+
ngAfterViewInit() {
|
|
10298
|
+
if (this.autoFocus()) {
|
|
10299
|
+
this.focusBox(0);
|
|
10300
|
+
}
|
|
10301
|
+
}
|
|
10302
|
+
writeValue(value) {
|
|
10303
|
+
this.boxChars.set(this.distributeValue(value));
|
|
10304
|
+
}
|
|
10305
|
+
registerOnChange(fn) {
|
|
10306
|
+
this.onChange = fn;
|
|
10307
|
+
}
|
|
10308
|
+
registerOnTouched(fn) {
|
|
10309
|
+
this.onTouched = fn;
|
|
10310
|
+
}
|
|
10311
|
+
setDisabledState(isDisabled) {
|
|
10312
|
+
this.internalDisabled.set(isDisabled);
|
|
10313
|
+
}
|
|
10314
|
+
onBoxInput(event, index) {
|
|
10315
|
+
const target = event.target;
|
|
10316
|
+
const raw = target.value;
|
|
10317
|
+
if (!this.dirty()) {
|
|
10318
|
+
this.dirty.set(true);
|
|
10319
|
+
}
|
|
10320
|
+
const filtered = this.filterChars(raw);
|
|
10321
|
+
const chars = this.currentChars();
|
|
10322
|
+
let cursor = index;
|
|
10323
|
+
for (const char of filtered) {
|
|
10324
|
+
if (cursor >= this.maxLength())
|
|
10325
|
+
break;
|
|
10326
|
+
chars[cursor] = char;
|
|
10327
|
+
cursor++;
|
|
10328
|
+
}
|
|
10329
|
+
this.commitValue(chars);
|
|
10330
|
+
target.value = chars[index] ?? '';
|
|
10331
|
+
const next = cursor < this.maxLength() ? cursor : this.maxLength() - 1;
|
|
10332
|
+
this.focusBox(next);
|
|
10333
|
+
}
|
|
10334
|
+
onBoxKeydown(event, index) {
|
|
10335
|
+
switch (event.key) {
|
|
10336
|
+
case 'Backspace':
|
|
10337
|
+
event.preventDefault();
|
|
10338
|
+
this.handleBackspace(index);
|
|
10339
|
+
break;
|
|
10340
|
+
case 'Delete':
|
|
10341
|
+
event.preventDefault();
|
|
10342
|
+
this.handleDelete(index);
|
|
10343
|
+
break;
|
|
10344
|
+
case 'ArrowLeft':
|
|
10345
|
+
event.preventDefault();
|
|
10346
|
+
this.focusBox(index - 1);
|
|
10347
|
+
break;
|
|
10348
|
+
case 'ArrowRight':
|
|
10349
|
+
event.preventDefault();
|
|
10350
|
+
this.focusBox(index + 1);
|
|
10351
|
+
break;
|
|
10352
|
+
case 'Home':
|
|
10353
|
+
event.preventDefault();
|
|
10354
|
+
this.focusBox(0);
|
|
10355
|
+
break;
|
|
10356
|
+
case 'End':
|
|
10357
|
+
event.preventDefault();
|
|
10358
|
+
this.focusBox(this.maxLength() - 1);
|
|
10359
|
+
break;
|
|
10360
|
+
case 'Enter':
|
|
10361
|
+
event.preventDefault();
|
|
10362
|
+
break;
|
|
10363
|
+
}
|
|
10364
|
+
}
|
|
10365
|
+
onBoxPaste(event, index) {
|
|
10366
|
+
event.preventDefault();
|
|
10367
|
+
const text = event.clipboardData?.getData('text') ?? '';
|
|
10368
|
+
if (!text)
|
|
10369
|
+
return;
|
|
10370
|
+
const filtered = this.filterChars(text);
|
|
10371
|
+
const chars = this.currentChars();
|
|
10372
|
+
let cursor = index;
|
|
10373
|
+
for (const char of filtered) {
|
|
10374
|
+
if (cursor >= this.maxLength())
|
|
10375
|
+
break;
|
|
10376
|
+
chars[cursor] = char;
|
|
10377
|
+
cursor++;
|
|
10378
|
+
}
|
|
10379
|
+
this.commitValue(chars);
|
|
10380
|
+
this.focusBox(cursor < this.maxLength() ? cursor : this.maxLength() - 1);
|
|
10381
|
+
}
|
|
10382
|
+
onBoxFocus(index) {
|
|
10383
|
+
this.internalFocused.set(true);
|
|
10384
|
+
this.focusedIndex.set(index);
|
|
10385
|
+
}
|
|
10386
|
+
onBoxBlur() {
|
|
10387
|
+
this.internalFocused.set(false);
|
|
10388
|
+
this.focusedIndex.set(-1);
|
|
10389
|
+
this.markAsTouched();
|
|
10390
|
+
}
|
|
10391
|
+
boxAriaLabel(index) {
|
|
10392
|
+
return this.translateWithDefault('solaris.otp-input.box', `Digit ${index + 1} of ${this.maxLength()}`, { current: index + 1, total: this.maxLength() });
|
|
10393
|
+
}
|
|
10394
|
+
showSeparatorAfter(index) {
|
|
10395
|
+
const every = this.separatorEvery();
|
|
10396
|
+
return (every > 0 && (index + 1) % every === 0 && index < this.maxLength() - 1);
|
|
10397
|
+
}
|
|
10398
|
+
currentChars() {
|
|
10399
|
+
return [...this.boxChars()];
|
|
10400
|
+
}
|
|
10401
|
+
commitValue(chars) {
|
|
10402
|
+
this.boxChars.set([...chars]);
|
|
10403
|
+
const newValue = chars.join('');
|
|
10404
|
+
this.onChange(newValue);
|
|
10405
|
+
this.valueChange.emit(newValue);
|
|
10406
|
+
if (newValue.length === this.maxLength()) {
|
|
10407
|
+
this.completed.emit();
|
|
10408
|
+
}
|
|
10409
|
+
}
|
|
10410
|
+
handleBackspace(index) {
|
|
10411
|
+
const chars = this.currentChars();
|
|
10412
|
+
if (chars[index]) {
|
|
10413
|
+
chars[index] = '';
|
|
10414
|
+
this.commitValue(chars);
|
|
10415
|
+
}
|
|
10416
|
+
else if (index > 0) {
|
|
10417
|
+
chars[index - 1] = '';
|
|
10418
|
+
this.commitValue(chars);
|
|
10419
|
+
this.focusBox(index - 1);
|
|
10420
|
+
}
|
|
10421
|
+
}
|
|
10422
|
+
handleDelete(index) {
|
|
10423
|
+
const chars = this.currentChars();
|
|
10424
|
+
if (chars[index]) {
|
|
10425
|
+
chars[index] = '';
|
|
10426
|
+
this.commitValue(chars);
|
|
10427
|
+
}
|
|
10428
|
+
}
|
|
10429
|
+
filterChars(value) {
|
|
10430
|
+
if (this.charType() === 'numeric') {
|
|
10431
|
+
return value.replace(/\D+/g, '');
|
|
10432
|
+
}
|
|
10433
|
+
return value.toUpperCase().replace(/[^A-Z0-9]/g, '');
|
|
10434
|
+
}
|
|
10435
|
+
emptyChars() {
|
|
10436
|
+
return Array.from({ length: this.maxLength() }, () => '');
|
|
10437
|
+
}
|
|
10438
|
+
distributeValue(value) {
|
|
10439
|
+
const chars = this.emptyChars();
|
|
10440
|
+
const source = String(value ?? '');
|
|
10441
|
+
for (let i = 0; i < source.length && i < this.maxLength(); i++) {
|
|
10442
|
+
chars[i] = source[i];
|
|
10443
|
+
}
|
|
10444
|
+
return chars;
|
|
10445
|
+
}
|
|
10446
|
+
focusBox(index) {
|
|
10447
|
+
if (index < 0 || index >= this.maxLength()) {
|
|
10448
|
+
return;
|
|
10449
|
+
}
|
|
10450
|
+
const ref = this.boxRefs()[index];
|
|
10451
|
+
ref?.nativeElement.focus();
|
|
10452
|
+
}
|
|
10453
|
+
markAsTouched() {
|
|
10454
|
+
if (!this.touched()) {
|
|
10455
|
+
this.touched.set(true);
|
|
10456
|
+
this.onTouched();
|
|
10457
|
+
}
|
|
10458
|
+
}
|
|
10459
|
+
translateWithDefault(key, defaultText, params) {
|
|
10460
|
+
const result = this.translateService.translate(key, params);
|
|
10461
|
+
return result !== key ? result : defaultText;
|
|
10462
|
+
}
|
|
10463
|
+
translateKey(key) {
|
|
10464
|
+
if (key) {
|
|
10465
|
+
const translated = this.translateService.translate(key);
|
|
10466
|
+
return translated !== key ? translated : undefined;
|
|
10467
|
+
}
|
|
10468
|
+
return undefined;
|
|
10469
|
+
}
|
|
10470
|
+
buildError(direct, key, fallbackKey, fallbackDefault) {
|
|
10471
|
+
return (direct ??
|
|
10472
|
+
this.translateKey(key) ??
|
|
10473
|
+
this.translateWithDefault(fallbackKey, fallbackDefault));
|
|
10474
|
+
}
|
|
10475
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisOtpInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10476
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SolarisOtpInputComponent, isStandalone: true, selector: "solaris-otp-input", inputs: { hintKey: { classPropertyName: "hintKey", publicName: "hintKey", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, labelKey: { classPropertyName: "labelKey", publicName: "labelKey", isSignal: true, isRequired: false, transformFunction: null }, errorKey: { classPropertyName: "errorKey", publicName: "errorKey", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, requiredError: { classPropertyName: "requiredError", publicName: "requiredError", isSignal: true, isRequired: false, transformFunction: null }, invalidError: { classPropertyName: "invalidError", publicName: "invalidError", isSignal: true, isRequired: false, transformFunction: null }, requiredErrorKey: { classPropertyName: "requiredErrorKey", publicName: "requiredErrorKey", isSignal: true, isRequired: false, transformFunction: null }, invalidErrorKey: { classPropertyName: "invalidErrorKey", publicName: "invalidErrorKey", isSignal: true, isRequired: false, transformFunction: null }, requiredInput: { classPropertyName: "requiredInput", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonlyInput: { classPropertyName: "readonlyInput", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, manualInvalid: { classPropertyName: "manualInvalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, minLength: { classPropertyName: "minLength", publicName: "minLength", isSignal: true, isRequired: false, transformFunction: null }, charType: { classPropertyName: "charType", publicName: "charType", isSignal: true, isRequired: false, transformFunction: null }, masked: { classPropertyName: "masked", publicName: "masked", isSignal: true, isRequired: false, transformFunction: null }, separatorEvery: { classPropertyName: "separatorEvery", publicName: "separatorEvery", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", completed: "completed" }, host: { properties: { "attr.id": "elementId()", "attr.data-density": "effectiveDensity()", "attr.data-appearance": "appearance()", "attr.data-length": "maxLength()", "attr.data-masked": "masked() ? \"\" : null", "attr.data-char-type": "charType()", "attr.data-invalid": "isFieldInvalid() ? \"\" : null" }, classAttribute: "solaris-otp-input" }, providers: [
|
|
10477
|
+
{
|
|
10478
|
+
provide: NG_VALUE_ACCESSOR,
|
|
10479
|
+
useExisting: forwardRef(() => SolarisOtpInputComponent),
|
|
10480
|
+
multi: true,
|
|
10481
|
+
},
|
|
10482
|
+
{
|
|
10483
|
+
provide: SolarisFormControl,
|
|
10484
|
+
useExisting: forwardRef(() => SolarisOtpInputComponent),
|
|
10485
|
+
},
|
|
10486
|
+
], viewQueries: [{ propertyName: "boxRefs", predicate: ["box"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<solaris-form-field\n [label]=\"label()\"\n [hint]=\"hint()\"\n [error]=\"error() || computedError()\"\n [labelKey]=\"labelKey()\"\n [hintKey]=\"hintKey()\"\n [errorKey]=\"errorKey()\"\n [required]=\"requiredInput()\"\n [optional]=\"optional()\"\n [appearance]=\"appearance()\"\n [density]=\"density()\"\n [radius]=\"radius()\"\n [invalid]=\"isFieldInvalid()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [readonly]=\"isEffectivelyReadonly()\"\n [control]=\"this\"\n>\n <div\n class=\"solaris-otp-input__boxes\"\n solaris-form-field-trigger\n role=\"group\"\n [attr.aria-label]=\"groupAriaLabel() || null\"\n >\n @for (box of boxes(); track $index; let index = $index) {\n <input\n #box\n type=\"text\"\n class=\"solaris-otp-input__box\"\n [attr.inputmode]=\"inputmode()\"\n maxlength=\"1\"\n autocomplete=\"one-time-code\"\n [attr.aria-label]=\"boxAriaLabel(index)\"\n [attr.aria-describedby]=\"ariaDescribedBy()\"\n [attr.data-active]=\"focusedIndex() === index ? '' : null\"\n [value]=\"box\"\n [disabled]=\"isEffectivelyDisabled()\"\n [readonly]=\"isEffectivelyReadonly()\"\n (input)=\"onBoxInput($event, index)\"\n (keydown)=\"onBoxKeydown($event, index)\"\n (paste)=\"onBoxPaste($event, index)\"\n (focus)=\"onBoxFocus(index)\"\n (blur)=\"onBoxBlur()\"\n />\n @if (showSeparatorAfter(index)) {\n <span class=\"solaris-otp-input__separator\" aria-hidden=\"true\">-</span>\n }\n }\n </div>\n <ng-content\n select=\"[solaris-form-label-action]\"\n ngProjectAs=\"[solaris-form-label-action]\"\n />\n</solaris-form-field>\n", styles: [":host{--solaris-otp-input-gap: var(--solaris-spacing-2);--solaris-otp-input-box-radius: var(--solaris-radius-sm);--solaris-otp-input-box-border-color: var(--solaris-border-subtle);--solaris-otp-input-box-border-width: var(--solaris-border-width-sm);--solaris-otp-input-box-background: transparent;--solaris-otp-input-box-color: var(--solaris-text-default);--solaris-otp-input-box-focus-border-color: var(--solaris-primary-base);--solaris-otp-input-box-error-border-color: var(--solaris-danger-base);--solaris-otp-input-box-width: calc(var(--solaris-density-min-height) * .9);--solaris-otp-input-box-height: calc( var(--solaris-density-min-height) * 1.15 );--solaris-otp-input-separator-color: var(--solaris-text-muted);display:block;box-sizing:border-box}:host solaris-form-field ::ng-deep .solaris-form-field__control-wrapper{background:transparent;border:0;border-color:transparent}.solaris-otp-input__boxes{display:flex;box-sizing:border-box;align-items:center;gap:var(--solaris-otp-input-gap);padding-block:var(--solaris-spacing-2)}.solaris-otp-input__box{box-sizing:border-box;width:var(--solaris-otp-input-box-width);height:var(--solaris-otp-input-box-height);margin:0;padding:0;text-align:center;color:var(--solaris-otp-input-box-color);font-size:var(--solaris-density-font-size);line-height:var(--solaris-line-height-none);background:var(--solaris-otp-input-box-background);border-radius:var(--solaris-otp-input-box-radius);border:var(--solaris-otp-input-box-border-width) solid var(--solaris-otp-input-box-border-color);transition:border-color var(--solaris-motion-duration-fast) var(--solaris-motion-easing-standard),box-shadow var(--solaris-motion-duration-fast) var(--solaris-motion-easing-standard)}.solaris-otp-input__box:focus{outline:none;border-color:var(--solaris-otp-input-box-focus-border-color);box-shadow:0 0 0 2px var(--solaris-otp-input-box-focus-border-color)}.solaris-otp-input__box[data-active]{border-color:var(--solaris-otp-input-box-focus-border-color)}.solaris-otp-input__box[disabled]{cursor:not-allowed;opacity:.5}:host([data-appearance=surface]){--solaris-otp-input-box-background: var(--solaris-surface-subtle);--solaris-otp-input-box-border-width: 0}:host([data-appearance=filled]){--solaris-otp-input-box-background: var(--solaris-surface-subtle);--solaris-otp-input-box-border-width: var(--solaris-border-width-sm)}:host([data-invalid]) .solaris-otp-input__box{border-color:var(--solaris-otp-input-box-error-border-color)}.solaris-otp-input__separator{flex:0 0 auto;-webkit-user-select:none;user-select:none;color:var(--solaris-otp-input-separator-color);font-size:var(--solaris-density-font-size);line-height:var(--solaris-line-height-none)}@media(prefers-reduced-motion:reduce){.solaris-otp-input__box{transition:none}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: SolarisFormFieldComponent, selector: "solaris-form-field", inputs: ["hintKey", "labelKey", "hint", "errorKey", "label", "error", "optionalLabel", "requiredLabel", "optionalLabelKey", "requiredLabelKey", "required", "optional", "invalid", "disabled", "readonly", "density", "radius", "appearance", "control", "hasPrefix", "hasSuffix", "prefix", "suffix"] }, { kind: "directive", type: SolarisFormFieldTriggerDirective, selector: "[solaris-form-field-trigger]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10487
|
+
}
|
|
10488
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisOtpInputComponent, decorators: [{
|
|
10489
|
+
type: Component,
|
|
10490
|
+
args: [{ selector: 'solaris-otp-input', standalone: true, imports: [
|
|
10491
|
+
FormsModule,
|
|
10492
|
+
SolarisFormFieldComponent,
|
|
10493
|
+
SolarisFormFieldTriggerDirective,
|
|
10494
|
+
], providers: [
|
|
10495
|
+
{
|
|
10496
|
+
provide: NG_VALUE_ACCESSOR,
|
|
10497
|
+
useExisting: forwardRef(() => SolarisOtpInputComponent),
|
|
10498
|
+
multi: true,
|
|
10499
|
+
},
|
|
10500
|
+
{
|
|
10501
|
+
provide: SolarisFormControl,
|
|
10502
|
+
useExisting: forwardRef(() => SolarisOtpInputComponent),
|
|
10503
|
+
},
|
|
10504
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
10505
|
+
class: 'solaris-otp-input',
|
|
10506
|
+
'[attr.id]': 'elementId()',
|
|
10507
|
+
'[attr.data-density]': 'effectiveDensity()',
|
|
10508
|
+
'[attr.data-appearance]': 'appearance()',
|
|
10509
|
+
'[attr.data-length]': 'maxLength()',
|
|
10510
|
+
'[attr.data-masked]': 'masked() ? "" : null',
|
|
10511
|
+
'[attr.data-char-type]': 'charType()',
|
|
10512
|
+
'[attr.data-invalid]': 'isFieldInvalid() ? "" : null',
|
|
10513
|
+
}, template: "<solaris-form-field\n [label]=\"label()\"\n [hint]=\"hint()\"\n [error]=\"error() || computedError()\"\n [labelKey]=\"labelKey()\"\n [hintKey]=\"hintKey()\"\n [errorKey]=\"errorKey()\"\n [required]=\"requiredInput()\"\n [optional]=\"optional()\"\n [appearance]=\"appearance()\"\n [density]=\"density()\"\n [radius]=\"radius()\"\n [invalid]=\"isFieldInvalid()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [readonly]=\"isEffectivelyReadonly()\"\n [control]=\"this\"\n>\n <div\n class=\"solaris-otp-input__boxes\"\n solaris-form-field-trigger\n role=\"group\"\n [attr.aria-label]=\"groupAriaLabel() || null\"\n >\n @for (box of boxes(); track $index; let index = $index) {\n <input\n #box\n type=\"text\"\n class=\"solaris-otp-input__box\"\n [attr.inputmode]=\"inputmode()\"\n maxlength=\"1\"\n autocomplete=\"one-time-code\"\n [attr.aria-label]=\"boxAriaLabel(index)\"\n [attr.aria-describedby]=\"ariaDescribedBy()\"\n [attr.data-active]=\"focusedIndex() === index ? '' : null\"\n [value]=\"box\"\n [disabled]=\"isEffectivelyDisabled()\"\n [readonly]=\"isEffectivelyReadonly()\"\n (input)=\"onBoxInput($event, index)\"\n (keydown)=\"onBoxKeydown($event, index)\"\n (paste)=\"onBoxPaste($event, index)\"\n (focus)=\"onBoxFocus(index)\"\n (blur)=\"onBoxBlur()\"\n />\n @if (showSeparatorAfter(index)) {\n <span class=\"solaris-otp-input__separator\" aria-hidden=\"true\">-</span>\n }\n }\n </div>\n <ng-content\n select=\"[solaris-form-label-action]\"\n ngProjectAs=\"[solaris-form-label-action]\"\n />\n</solaris-form-field>\n", styles: [":host{--solaris-otp-input-gap: var(--solaris-spacing-2);--solaris-otp-input-box-radius: var(--solaris-radius-sm);--solaris-otp-input-box-border-color: var(--solaris-border-subtle);--solaris-otp-input-box-border-width: var(--solaris-border-width-sm);--solaris-otp-input-box-background: transparent;--solaris-otp-input-box-color: var(--solaris-text-default);--solaris-otp-input-box-focus-border-color: var(--solaris-primary-base);--solaris-otp-input-box-error-border-color: var(--solaris-danger-base);--solaris-otp-input-box-width: calc(var(--solaris-density-min-height) * .9);--solaris-otp-input-box-height: calc( var(--solaris-density-min-height) * 1.15 );--solaris-otp-input-separator-color: var(--solaris-text-muted);display:block;box-sizing:border-box}:host solaris-form-field ::ng-deep .solaris-form-field__control-wrapper{background:transparent;border:0;border-color:transparent}.solaris-otp-input__boxes{display:flex;box-sizing:border-box;align-items:center;gap:var(--solaris-otp-input-gap);padding-block:var(--solaris-spacing-2)}.solaris-otp-input__box{box-sizing:border-box;width:var(--solaris-otp-input-box-width);height:var(--solaris-otp-input-box-height);margin:0;padding:0;text-align:center;color:var(--solaris-otp-input-box-color);font-size:var(--solaris-density-font-size);line-height:var(--solaris-line-height-none);background:var(--solaris-otp-input-box-background);border-radius:var(--solaris-otp-input-box-radius);border:var(--solaris-otp-input-box-border-width) solid var(--solaris-otp-input-box-border-color);transition:border-color var(--solaris-motion-duration-fast) var(--solaris-motion-easing-standard),box-shadow var(--solaris-motion-duration-fast) var(--solaris-motion-easing-standard)}.solaris-otp-input__box:focus{outline:none;border-color:var(--solaris-otp-input-box-focus-border-color);box-shadow:0 0 0 2px var(--solaris-otp-input-box-focus-border-color)}.solaris-otp-input__box[data-active]{border-color:var(--solaris-otp-input-box-focus-border-color)}.solaris-otp-input__box[disabled]{cursor:not-allowed;opacity:.5}:host([data-appearance=surface]){--solaris-otp-input-box-background: var(--solaris-surface-subtle);--solaris-otp-input-box-border-width: 0}:host([data-appearance=filled]){--solaris-otp-input-box-background: var(--solaris-surface-subtle);--solaris-otp-input-box-border-width: var(--solaris-border-width-sm)}:host([data-invalid]) .solaris-otp-input__box{border-color:var(--solaris-otp-input-box-error-border-color)}.solaris-otp-input__separator{flex:0 0 auto;-webkit-user-select:none;user-select:none;color:var(--solaris-otp-input-separator-color);font-size:var(--solaris-density-font-size);line-height:var(--solaris-line-height-none)}@media(prefers-reduced-motion:reduce){.solaris-otp-input__box{transition:none}}\n"] }]
|
|
10514
|
+
}], ctorParameters: () => [], propDecorators: { boxRefs: [{ type: i0.ViewChildren, args: ['box', { isSignal: true }] }], hintKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "hintKey", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], labelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelKey", required: false }] }], errorKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorKey", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], requiredError: [{ type: i0.Input, args: [{ isSignal: true, alias: "requiredError", required: false }] }], invalidError: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalidError", required: false }] }], requiredErrorKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "requiredErrorKey", required: false }] }], invalidErrorKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalidErrorKey", required: false }] }], requiredInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonlyInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], manualInvalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], maxLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxLength", required: false }] }], minLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minLength", required: false }] }], charType: [{ type: i0.Input, args: [{ isSignal: true, alias: "charType", required: false }] }], masked: [{ type: i0.Input, args: [{ isSignal: true, alias: "masked", required: false }] }], separatorEvery: [{ type: i0.Input, args: [{ isSignal: true, alias: "separatorEvery", required: false }] }], autoFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoFocus", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], radius: [{ type: i0.Input, args: [{ isSignal: true, alias: "radius", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], completed: [{ type: i0.Output, args: ["completed"] }] } });
|
|
10515
|
+
|
|
10516
|
+
function solarisOtpValidator(minLength, maxLength) {
|
|
10517
|
+
return (control) => {
|
|
10518
|
+
const value = control.value;
|
|
10519
|
+
if (value == null || value === '') {
|
|
10520
|
+
return null;
|
|
10521
|
+
}
|
|
10522
|
+
const length = String(value).length;
|
|
10523
|
+
if (length < minLength || length > maxLength) {
|
|
10524
|
+
return {
|
|
10525
|
+
solarisOtpLength: {
|
|
10526
|
+
requiredLength: maxLength,
|
|
10527
|
+
actualLength: length,
|
|
10528
|
+
},
|
|
10529
|
+
};
|
|
10530
|
+
}
|
|
10531
|
+
return null;
|
|
10532
|
+
};
|
|
10533
|
+
}
|
|
10534
|
+
|
|
10125
10535
|
class SolarisSkeletonComponent {
|
|
10126
10536
|
variant = input('text', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
10127
10537
|
animation = input('pulse', ...(ngDevMode ? [{ debugName: "animation" }] : /* istanbul ignore next */ []));
|
|
@@ -14610,5 +15020,5 @@ function provideSolaris(config) {
|
|
|
14610
15020
|
* Generated bundle index. Do not edit.
|
|
14611
15021
|
*/
|
|
14612
15022
|
|
|
14613
|
-
export { SOLARIS_ACCESSIBILITY_CONFIG, SOLARIS_BUILT_IN_ICONS, SOLARIS_DIALOG_CONFIG, SOLARIS_DIALOG_DATA, SOLARIS_DIALOG_REF, SOLARIS_ICONS_CONFIG, SOLARIS_SEGMENTED_CONTROL, SOLARIS_STEPPER, SOLARIS_TABS, SOLARIS_THEME_CONFIG, SOLARIS_TOAST_CONFIG, SOLARIS_TRANSLATE_CONFIG, SolarisAccessibilityService, SolarisAccordionComponent, SolarisAlertActionsComponent, SolarisAlertComponent, SolarisAlertDescriptionDirective, SolarisAlertTitleDirective, SolarisBadgeComponent, SolarisBadgeIconDirective, SolarisBreadcrumbComponent, SolarisButtonDirective, SolarisButtonGroupComponent, SolarisButtonIconDirective, SolarisCardActionsDirective, SolarisCardComponent, SolarisCardContentDirective, SolarisCardDescriptionDirective, SolarisCardFooterDirective, SolarisCardHeaderDirective, SolarisCardMediaDirective, SolarisCardTitleDirective, SolarisCheckboxComponent, SolarisCheckboxGroupComponent, SolarisCollapsibleComponent, SolarisDialogActionsComponent, SolarisDialogComponent, SolarisDialogContainerComponent, SolarisDialogContentComponent, SolarisDialogFlowComponent, SolarisDialogHeaderComponent, SolarisDialogRef, SolarisDialogService, SolarisDialogStepComponent, SolarisDividerComponent, SolarisDividerStackComponent, SolarisDropdownMenuComponent, SolarisDropdownMenuGroupComponent, SolarisDropdownMenuItemComponent, SolarisDropdownMenuLabelComponent, SolarisDropdownMenuTriggerDirective, SolarisDropdownSubmenuComponent, SolarisDropdownSubmenuTriggerComponent, SolarisEditableTabComponent, SolarisEditableTabsComponent, SolarisEmailFieldComponent, SolarisFormErrorComponent, SolarisFormFieldComponent, SolarisFormHintComponent, SolarisFormLabelActionDirective, SolarisFormLabelComponent, SolarisFormPrefixDirective, SolarisFormSuffixDirective, SolarisIconButtonBadgeDirective, SolarisIconButtonDirective, SolarisIconComponent, SolarisIconRegistryService, SolarisInputDirective, SolarisLoadingTextComponent, SolarisMultiSelectComponent, SolarisOptionComponent, SolarisOptionDescriptionDirective, SolarisOptionGroupComponent, SolarisOptionLabelDirective, SolarisOptionLeadingDirective, SolarisOptionMetaDirective, SolarisOptionTrailingDirective, SolarisPasswordFieldComponent, SolarisPhoneCountryListComponent, SolarisPhoneFieldComponent, SolarisPopoverDirective, SolarisPopoverPanelComponent, SolarisPopoverTriggerDirective, SolarisProgressComponent, SolarisRadioComponent, SolarisRadioGroupComponent, SolarisSegmentedControlComponent, SolarisSegmentedItemComponent, SolarisSelectComponent, SolarisSkeletonComponent, SolarisSpinnerComponent, SolarisStepComponent, SolarisStepperActionsComponent, SolarisStepperComponent, SolarisStepperContentComponent, SolarisSwitchComponent, SolarisSwitchGroupComponent, SolarisTabComponent, SolarisTabPanelComponent, SolarisTabsComponent, SolarisTextareaDirective, SolarisThemeService, SolarisToastComponent, SolarisToastContainerComponent, SolarisToastService, SolarisTooltipDirective, SolarisTooltipPanelComponent, SolarisTranslatePipe, SolarisTranslateService, SolarisVisuallyHiddenDirective, configureSolarisTesting, nextIdFor, provideSolaris, provideSolarisAccessibilityTesting, provideSolarisTesting, provideSolarisThemeTesting, provideSolarisTranslateTesting, resolveElementId, solarisAllowedDomainsValidator, solarisBlockedDomainsValidator, solarisEmailValidator, solarisPasswordValidator, solarisPhoneValidator };
|
|
15023
|
+
export { SOLARIS_ACCESSIBILITY_CONFIG, SOLARIS_BUILT_IN_ICONS, SOLARIS_DIALOG_CONFIG, SOLARIS_DIALOG_DATA, SOLARIS_DIALOG_REF, SOLARIS_ICONS_CONFIG, SOLARIS_SEGMENTED_CONTROL, SOLARIS_STEPPER, SOLARIS_TABS, SOLARIS_THEME_CONFIG, SOLARIS_TOAST_CONFIG, SOLARIS_TRANSLATE_CONFIG, SolarisAccessibilityService, SolarisAccordionComponent, SolarisAlertActionsComponent, SolarisAlertComponent, SolarisAlertDescriptionDirective, SolarisAlertTitleDirective, SolarisBadgeComponent, SolarisBadgeIconDirective, SolarisBreadcrumbComponent, SolarisButtonDirective, SolarisButtonGroupComponent, SolarisButtonIconDirective, SolarisCardActionsDirective, SolarisCardComponent, SolarisCardContentDirective, SolarisCardDescriptionDirective, SolarisCardFooterDirective, SolarisCardHeaderDirective, SolarisCardMediaDirective, SolarisCardTitleDirective, SolarisCheckboxComponent, SolarisCheckboxGroupComponent, SolarisCollapsibleComponent, SolarisDialogActionsComponent, SolarisDialogComponent, SolarisDialogContainerComponent, SolarisDialogContentComponent, SolarisDialogFlowComponent, SolarisDialogHeaderComponent, SolarisDialogRef, SolarisDialogService, SolarisDialogStepComponent, SolarisDividerComponent, SolarisDividerStackComponent, SolarisDropdownMenuComponent, SolarisDropdownMenuGroupComponent, SolarisDropdownMenuItemComponent, SolarisDropdownMenuLabelComponent, SolarisDropdownMenuTriggerDirective, SolarisDropdownSubmenuComponent, SolarisDropdownSubmenuTriggerComponent, SolarisEditableTabComponent, SolarisEditableTabsComponent, SolarisEmailFieldComponent, SolarisFormErrorComponent, SolarisFormFieldComponent, SolarisFormHintComponent, SolarisFormLabelActionDirective, SolarisFormLabelComponent, SolarisFormPrefixDirective, SolarisFormSuffixDirective, SolarisIconButtonBadgeDirective, SolarisIconButtonDirective, SolarisIconComponent, SolarisIconRegistryService, SolarisInputDirective, SolarisLoadingTextComponent, SolarisMultiSelectComponent, SolarisOptionComponent, SolarisOptionDescriptionDirective, SolarisOptionGroupComponent, SolarisOptionLabelDirective, SolarisOptionLeadingDirective, SolarisOptionMetaDirective, SolarisOptionTrailingDirective, SolarisOtpInputComponent, SolarisPasswordFieldComponent, SolarisPhoneCountryListComponent, SolarisPhoneFieldComponent, SolarisPopoverDirective, SolarisPopoverPanelComponent, SolarisPopoverTriggerDirective, SolarisProgressComponent, SolarisRadioComponent, SolarisRadioGroupComponent, SolarisSegmentedControlComponent, SolarisSegmentedItemComponent, SolarisSelectComponent, SolarisSkeletonComponent, SolarisSpinnerComponent, SolarisStepComponent, SolarisStepperActionsComponent, SolarisStepperComponent, SolarisStepperContentComponent, SolarisSwitchComponent, SolarisSwitchGroupComponent, SolarisTabComponent, SolarisTabPanelComponent, SolarisTabsComponent, SolarisTextareaDirective, SolarisThemeService, SolarisToastComponent, SolarisToastContainerComponent, SolarisToastService, SolarisTooltipDirective, SolarisTooltipPanelComponent, SolarisTranslatePipe, SolarisTranslateService, SolarisVisuallyHiddenDirective, configureSolarisTesting, nextIdFor, provideSolaris, provideSolarisAccessibilityTesting, provideSolarisTesting, provideSolarisThemeTesting, provideSolarisTranslateTesting, resolveElementId, solarisAllowedDomainsValidator, solarisBlockedDomainsValidator, solarisEmailValidator, solarisOtpValidator, solarisPasswordValidator, solarisPhoneValidator };
|
|
14614
15024
|
//# sourceMappingURL=educarehq-solaris-ui.mjs.map
|