@educarehq/solaris-components 0.3.6 → 0.3.8
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.
|
@@ -10,7 +10,7 @@ import { RouterLink } from '@angular/router';
|
|
|
10
10
|
import { NgClass, NgTemplateOutlet, NgStyle, isPlatformBrowser, DOCUMENT, NgOptimizedImage } from '@angular/common';
|
|
11
11
|
import { SOLARIS_TRANSLATION, SOLARIS_TRANSLATION_CONFIGURATION, SolarisTranslationPipe } from '@educarehq/solaris-services';
|
|
12
12
|
import * as i1 from '@angular/forms';
|
|
13
|
-
import { NG_VALUE_ACCESSOR, FormsModule,
|
|
13
|
+
import { NG_VALUE_ACCESSOR, FormsModule, NgForm, FormGroupDirective, NgControl, NG_VALIDATORS } from '@angular/forms';
|
|
14
14
|
import { getCountries, getCountryCallingCode, parsePhoneNumberFromString, AsYouType } from 'libphonenumber-js';
|
|
15
15
|
import intlTelInput from 'intl-tel-input';
|
|
16
16
|
|
|
@@ -562,7 +562,6 @@ class SolarisPopover {
|
|
|
562
562
|
return typeof v === 'boolean' ? v : this._internalOpen();
|
|
563
563
|
}, ...(ngDevMode ? [{ debugName: "isOpen" }] : []));
|
|
564
564
|
set open(v) {
|
|
565
|
-
console.log(`[Popover#${this._id} ${this.panelClass}] input open=`, v);
|
|
566
565
|
this._openInput.set(v);
|
|
567
566
|
}
|
|
568
567
|
get open() {
|
|
@@ -571,11 +570,9 @@ class SolarisPopover {
|
|
|
571
570
|
panelDir;
|
|
572
571
|
triggerDir;
|
|
573
572
|
raf = 0;
|
|
574
|
-
static seq = 0;
|
|
575
573
|
_setting = false;
|
|
576
574
|
panelHost;
|
|
577
575
|
panelView;
|
|
578
|
-
_id = ++SolarisPopover.seq;
|
|
579
576
|
get dataOpen() {
|
|
580
577
|
return this.isOpen() ? 'true' : null;
|
|
581
578
|
}
|
|
@@ -601,7 +598,6 @@ class SolarisPopover {
|
|
|
601
598
|
const clickedInsidePanel = this.panelHost.contains(t);
|
|
602
599
|
const clickedOnTrigger = triggerEl.contains(t);
|
|
603
600
|
if (!clickedInsidePanel && !clickedOnTrigger) {
|
|
604
|
-
console.log(`[Popover#${this._id} ${this.panelClass}] outside -> close`);
|
|
605
601
|
this.setOpen(false);
|
|
606
602
|
}
|
|
607
603
|
};
|
|
@@ -3693,14 +3689,72 @@ function getInitialCountryFromBrowser(fallbackIso2) {
|
|
|
3693
3689
|
return region.length === 2 ? region : fallbackIso2;
|
|
3694
3690
|
}
|
|
3695
3691
|
|
|
3692
|
+
const SOLARIS_FORM_FIELD_FEATURES = new InjectionToken('SOLARIS_FORM_FIELD_FEATURES');
|
|
3693
|
+
|
|
3694
|
+
class SolarisFormFieldController {
|
|
3695
|
+
features = inject(SOLARIS_FORM_FIELD_FEATURES, { optional: true }) ?? [];
|
|
3696
|
+
ngForm = inject(NgForm, { optional: true });
|
|
3697
|
+
formGroupDir = inject(FormGroupDirective, { optional: true });
|
|
3698
|
+
destroyRef = inject(DestroyRef);
|
|
3699
|
+
submitted = signal(false, ...(ngDevMode ? [{ debugName: "submitted" }] : []));
|
|
3700
|
+
control = signal(null, ...(ngDevMode ? [{ debugName: "control" }] : []));
|
|
3701
|
+
email = signal(null, ...(ngDevMode ? [{ debugName: "email" }] : []));
|
|
3702
|
+
password = signal(null, ...(ngDevMode ? [{ debugName: "password" }] : []));
|
|
3703
|
+
constructor() {
|
|
3704
|
+
this.formGroupDir?.ngSubmit
|
|
3705
|
+
.pipe(takeUntilDestroyed(this.destroyRef))
|
|
3706
|
+
.subscribe(() => this.submitted.set(true));
|
|
3707
|
+
this.ngForm?.ngSubmit
|
|
3708
|
+
.pipe(takeUntilDestroyed(this.destroyRef))
|
|
3709
|
+
.subscribe(() => this.submitted.set(true));
|
|
3710
|
+
}
|
|
3711
|
+
registerPassword(dir) {
|
|
3712
|
+
this.password.set(dir);
|
|
3713
|
+
}
|
|
3714
|
+
registerEmail(dir) {
|
|
3715
|
+
this.email.set(dir);
|
|
3716
|
+
}
|
|
3717
|
+
registerControl(ctrl) {
|
|
3718
|
+
if (!ctrl && this.control())
|
|
3719
|
+
return;
|
|
3720
|
+
this.control.set(ctrl);
|
|
3721
|
+
}
|
|
3722
|
+
passwordVisible() {
|
|
3723
|
+
return this.password()?.visible() ?? false;
|
|
3724
|
+
}
|
|
3725
|
+
togglePasswordVisibility() {
|
|
3726
|
+
this.password()?.toggle();
|
|
3727
|
+
}
|
|
3728
|
+
resetSubmitted() {
|
|
3729
|
+
this.submitted.set(false);
|
|
3730
|
+
}
|
|
3731
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SolarisFormFieldController, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3732
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SolarisFormFieldController });
|
|
3733
|
+
}
|
|
3734
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SolarisFormFieldController, decorators: [{
|
|
3735
|
+
type: Injectable
|
|
3736
|
+
}], ctorParameters: () => [], propDecorators: { ngForm: [{
|
|
3737
|
+
type: Optional
|
|
3738
|
+
}], formGroupDir: [{
|
|
3739
|
+
type: Optional
|
|
3740
|
+
}] } });
|
|
3741
|
+
|
|
3696
3742
|
const SOLARIS_INPUT = new InjectionToken('SOLARIS_INPUT');
|
|
3697
3743
|
|
|
3698
3744
|
class InputTextDirective {
|
|
3699
3745
|
el = inject((ElementRef));
|
|
3746
|
+
injector = inject(Injector);
|
|
3747
|
+
field = inject(SolarisFormFieldController, { optional: true });
|
|
3700
3748
|
attr = '';
|
|
3701
3749
|
get placeholderAttr() {
|
|
3702
3750
|
return this.el.nativeElement.getAttribute('placeholder');
|
|
3703
3751
|
}
|
|
3752
|
+
constructor() {
|
|
3753
|
+
queueMicrotask(() => {
|
|
3754
|
+
const ngc = this.injector.get(NgControl, null, { self: true, optional: true });
|
|
3755
|
+
this.field?.registerControl(ngc);
|
|
3756
|
+
});
|
|
3757
|
+
}
|
|
3704
3758
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: InputTextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
3705
3759
|
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: InputTextDirective, isStandalone: true, selector: "input[solaris-input],textarea[solaris-input]", host: { properties: { "attr.solaris-input": "this.attr", "attr.placeholder": "this.placeholderAttr" } }, providers: [
|
|
3706
3760
|
{
|
|
@@ -3741,7 +3795,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
|
|
|
3741
3795
|
},
|
|
3742
3796
|
],
|
|
3743
3797
|
}]
|
|
3744
|
-
}], propDecorators: {
|
|
3798
|
+
}], ctorParameters: () => [], propDecorators: { field: [{
|
|
3799
|
+
type: Optional
|
|
3800
|
+
}], attr: [{
|
|
3745
3801
|
type: HostBinding,
|
|
3746
3802
|
args: ['attr.solaris-input']
|
|
3747
3803
|
}], placeholderAttr: [{
|
|
@@ -4114,56 +4170,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImpor
|
|
|
4114
4170
|
args: [{ alias: 'preferred-countries' }]
|
|
4115
4171
|
}] } });
|
|
4116
4172
|
|
|
4117
|
-
const SOLARIS_FORM_FIELD_FEATURES = new InjectionToken('SOLARIS_FORM_FIELD_FEATURES');
|
|
4118
|
-
|
|
4119
|
-
class SolarisFormFieldController {
|
|
4120
|
-
features = inject(SOLARIS_FORM_FIELD_FEATURES, { optional: true }) ?? [];
|
|
4121
|
-
ngForm = inject(NgForm, { optional: true });
|
|
4122
|
-
formGroupDir = inject(FormGroupDirective, { optional: true });
|
|
4123
|
-
destroyRef = inject(DestroyRef);
|
|
4124
|
-
submitted = signal(false, ...(ngDevMode ? [{ debugName: "submitted" }] : []));
|
|
4125
|
-
control = signal(null, ...(ngDevMode ? [{ debugName: "control" }] : []));
|
|
4126
|
-
email = signal(null, ...(ngDevMode ? [{ debugName: "email" }] : []));
|
|
4127
|
-
password = signal(null, ...(ngDevMode ? [{ debugName: "password" }] : []));
|
|
4128
|
-
constructor() {
|
|
4129
|
-
this.formGroupDir?.ngSubmit
|
|
4130
|
-
.pipe(takeUntilDestroyed(this.destroyRef))
|
|
4131
|
-
.subscribe(() => this.submitted.set(true));
|
|
4132
|
-
this.ngForm?.ngSubmit
|
|
4133
|
-
.pipe(takeUntilDestroyed(this.destroyRef))
|
|
4134
|
-
.subscribe(() => this.submitted.set(true));
|
|
4135
|
-
}
|
|
4136
|
-
registerPassword(dir) {
|
|
4137
|
-
this.password.set(dir);
|
|
4138
|
-
}
|
|
4139
|
-
registerEmail(dir) {
|
|
4140
|
-
this.email.set(dir);
|
|
4141
|
-
}
|
|
4142
|
-
registerControl(ctrl) {
|
|
4143
|
-
if (!ctrl && this.control())
|
|
4144
|
-
return;
|
|
4145
|
-
this.control.set(ctrl);
|
|
4146
|
-
}
|
|
4147
|
-
passwordVisible() {
|
|
4148
|
-
return this.password()?.visible() ?? false;
|
|
4149
|
-
}
|
|
4150
|
-
togglePasswordVisibility() {
|
|
4151
|
-
this.password()?.toggle();
|
|
4152
|
-
}
|
|
4153
|
-
resetSubmitted() {
|
|
4154
|
-
this.submitted.set(false);
|
|
4155
|
-
}
|
|
4156
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SolarisFormFieldController, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
4157
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SolarisFormFieldController });
|
|
4158
|
-
}
|
|
4159
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: SolarisFormFieldController, decorators: [{
|
|
4160
|
-
type: Injectable
|
|
4161
|
-
}], ctorParameters: () => [], propDecorators: { ngForm: [{
|
|
4162
|
-
type: Optional
|
|
4163
|
-
}], formGroupDir: [{
|
|
4164
|
-
type: Optional
|
|
4165
|
-
}] } });
|
|
4166
|
-
|
|
4167
4173
|
class SolarisPasswordDirective {
|
|
4168
4174
|
minLength = 8;
|
|
4169
4175
|
requireUpper = true;
|
|
@@ -4542,14 +4548,14 @@ class FormField {
|
|
|
4542
4548
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: FormField, isStandalone: true, selector: "solaris-form-field", inputs: { hint: { classPropertyName: "hint", publicName: "hint", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, hintKey: { classPropertyName: "hintKey", publicName: "hintKey", isSignal: false, isRequired: false, transformFunction: null }, labelKey: { classPropertyName: "labelKey", publicName: "labelKey", isSignal: false, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: false, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: false, isRequired: false, transformFunction: null }, showErrors: { classPropertyName: "showErrors", publicName: "showErrors", isSignal: false, isRequired: false, transformFunction: null }, customErrorKey: { classPropertyName: "customErrorKey", publicName: "customErrorKey", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, customErrorParams: { classPropertyName: "customErrorParams", publicName: "customErrorParams", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
4543
4549
|
SolarisFormFieldController,
|
|
4544
4550
|
{ provide: SOLARIS_FORM_FIELD_CONTROLLER, useExisting: SolarisFormFieldController },
|
|
4545
|
-
], queries: [{ propertyName: "prefix", first: true, predicate: SolarisPrefixDirective, descendants: true }, { propertyName: "suffix", first: true, predicate: SolarisSuffixDirective, descendants: true }], ngImport: i0, template: "<div class=\"solaris-form-field\" [class.solaris-form-field--has-prefix]=\"hasPrefix\" [attr.data-appearance]=\"appearance\"\r\n [attr.data-invalid]=\"invalidComputed() ? 'true' : null\" [attr.data-radius]=\"radius\"\r\n [attr.data-disabled]=\"disabledComputed() ? 'true' : null\">\r\n @if ((label || labelKey)) {\r\n <label class=\"solaris-form-field__label\">\r\n @if (labelKey) { {{ labelKey | translate }} }\r\n @else if (label) { {{ label }} }\r\n </label>\r\n }\r\n\r\n <div class=\"solaris-form-field__frame\">\r\n @if (hasPrefix) {\r\n <span class=\"solaris-form-field__prefix\" aria-hidden=\"true\">\r\n <ng-content select=\"[solaris-prefix]\"></ng-content>\r\n </span>\r\n }\r\n\r\n <div class=\"solaris-form-field__body\">\r\n <div class=\"solaris-form-field__control-slot\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n @if (hasSuffix || showPasswordToggle() || invalidComputed() || disabledComputed()) {\r\n <span class=\"solaris-form-field__suffix\">\r\n @if (disabledComputed()) {\r\n <span class=\"solaris-form-field__status solaris-form-field__status--disabled\" aria-hidden=\"true\">\r\n <i class=\"ph ph-lock-simple\"></i>\r\n </span>\r\n } @else {\r\n <ng-content select=\"[solaris-suffix]\"></ng-content>\r\n\r\n @if (showPasswordToggle()) {\r\n <solaris-password-toggle></solaris-password-toggle>\r\n }\r\n\r\n @if (invalidComputed()) {\r\n <span class=\"solaris-form-field__status\" aria-hidden=\"true\">\r\n <i class=\"ph ph-warning-circle\"></i>\r\n </span>\r\n }\r\n }\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n\r\n @if (errorKey()) {\r\n <solaris-field-error [textKey]=\"errorKey()\" [textParams]=\"errorParams()\"></solaris-field-error>\r\n } @else {\r\n <ng-content select=\"[form-field-message]\"></ng-content>\r\n }\r\n\r\n @if (hint || hintKey) {\r\n <div class=\"solaris-form-field__hint\">\r\n @if (hintKey) { {{ hintKey | translate }} }\r\n @else { {{ hint }} }\r\n </div>\r\n }\r\n</div>\r\n", styles: [".solaris-form-field{display:grid;gap:var(--solaris-space-2);--solaris-form-field-radius: var(--solaris-radius-sm);--solaris-form-field-bg: var(--solaris-color-surface-2);--solaris-form-field-border: var(--solaris-color-border);--solaris-form-field-border-hover: color-mix(in srgb, var(--solaris-color-border) 70%, var(--solaris-color-text-muted))}.solaris-form-field[data-radius=none]{--solaris-form-field-radius: var(--solaris-radius-none)}.solaris-form-field[data-radius=xs]{--solaris-form-field-radius: var(--solaris-radius-xs)}.solaris-form-field[data-radius=sm]{--solaris-form-field-radius: var(--solaris-radius-sm)}.solaris-form-field[data-radius=md]{--solaris-form-field-radius: var(--solaris-radius-md)}.solaris-form-field[data-radius=lg]{--solaris-form-field-radius: var(--solaris-radius-lg)}.solaris-form-field[data-radius=full]{--solaris-form-field-radius: var(--solaris-radius-full)}.solaris-form-field[data-appearance=outline]{--solaris-form-field-bg: transparent;--solaris-form-field-border: color-mix(in srgb, var(--solaris-color-border) 85%, transparent);--solaris-form-field-border-hover: color-mix(in srgb, var(--solaris-color-border) 65%, var(--solaris-color-text-muted))}.solaris-form-field__label{font-weight:600;font-size:var(--solaris-fs-14);color:var(--solaris-color-text);margin-left:var(--solaris-space-1)}.solaris-form-field__frame{display:grid;min-height:3.8rem;align-items:stretch;grid-template-columns:1fr;background:var(--solaris-form-field-bg);border-radius:var(--solaris-form-field-radius);border:1px solid var(--solaris-form-field-border);transition:border-color .12s ease,box-shadow .12s ease,background-color .12s ease}.solaris-form-field--has-prefix .solaris-form-field__frame{grid-template-columns:3.8rem 1fr}.solaris-form-field__prefix{opacity:.5;display:grid;width:3.8rem;line-height:0;place-items:center;font-size:var(--solaris-fs-14);color:var(--solaris-color-text-muted);transition:opacity .3s ease,filter .3s ease;border-right:1px solid color-mix(in srgb,var(--solaris-color-border) 85%,transparent)}.solaris-form-field__frame:hover .solaris-form-field__prefix,.solaris-form-field__frame:focus-within .solaris-form-field__prefix{opacity:1;filter:brightness(1.05)}.solaris-form-field__prefix :is(i,svg,[solarisPrefixIcon]){display:block;line-height:1}.solaris-form-field__prefix i.ph{opacity:.6;font-size:var(--solaris-fs-18)}.solaris-form-field__prefix svg{width:var(--solaris-fs-18);height:var(--solaris-fs-18)}.solaris-form-field__body{min-width:0;display:grid;padding-right:0;position:relative;align-items:center;padding-left:var(--solaris-space-3);grid-template-columns:minmax(0,1fr) auto}.solaris-form-field__control-slot{width:100%;min-width:0;display:flex;flex:1 1 auto;align-items:center}.solaris-form-field__control-slot>*{flex:1 1 0;width:100%;min-width:0}.solaris-form-field__control-slot :is(input,textarea){margin:0;border:0;width:100%;min-width:0;outline:none;padding:.9rem 0;background:transparent;font-size:var(--solaris-fs-14);color:var(--solaris-color-text);line-height:var(--solaris-lh-normal)}.solaris-form-field__control-slot :is(input,textarea)::placeholder{opacity:.9;color:var(--solaris-color-text-muted)}.solaris-form-field__suffix{display:inline-flex;align-items:center;justify-content:center;padding-right:var(--solaris-space-3);gap:var(--solaris-space-2)}.solaris-form-field__suffix :is(button,a){height:3.6rem;align-self:stretch;align-items:center;display:inline-flex}.solaris-form-field__status{width:3.8rem;display:grid;opacity:.95;height:3.8rem;place-items:center;color:var(--solaris-color-error)}.solaris-form-field__status i.ph{line-height:1;font-size:var(--solaris-fs-18)}.solaris-form-field__hint{font-size:var(--solaris-fs-12);color:var(--solaris-color-text-muted)}.solaris-form-field__frame:has(:focus-visible){box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-primary) 5%,transparent);border-color:color-mix(in srgb,var(--solaris-color-primary) 70%,var(--solaris-color-border))}.solaris-form-field[data-invalid=true] .solaris-form-field__frame{box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-error) 5%,transparent);border-color:color-mix(in srgb,var(--solaris-color-error) 70%,var(--solaris-color-border))}.solaris-form-field[data-invalid=true] .solaris-form-field__frame:focus-within{border-color:color-mix(in srgb,var(--solaris-color-error) 80%,var(--solaris-color-border));box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-error) 16%,transparent)}.solaris-form-field[data-invalid=true] .solaris-form-field__prefix{border-right-color:color-mix(in srgb,var(--solaris-color-error) 30%,var(--solaris-color-border));color:color-mix(in srgb,var(--solaris-color-error) 75%,var(--solaris-color-text-muted))}.solaris-form-field[data-invalid=true] .solaris-form-field__control-slot :is(input,textarea)::placeholder{color:color-mix(in srgb,var(--solaris-color-error) 45%,var(--solaris-color-text-muted))}.solaris-form-field__body:has(solaris-phone-input){padding-left:0}.solaris-form-field[data-disabled=true] .solaris-form-field__frame{opacity:.45;cursor:not-allowed}.solaris-form-field[data-disabled=true] .solaris-form-field__frame *,.solaris-form-field[data-disabled=true] .solaris-form-field__label,.solaris-form-field[data-disabled=true] .solaris-form-field__hint{cursor:not-allowed}.solaris-form-field[data-disabled=true] .solaris-form-field__prefix,.solaris-form-field[data-disabled=true] .solaris-form-field__suffix,.solaris-form-field[data-disabled=true] .solaris-form-field__label,.solaris-form-field[data-disabled=true] .solaris-form-field__hint{color:var(--solaris-color-text-muted)}.solaris-form-field__status--disabled{opacity:.9;width:3.8rem;display:grid;height:3.8rem;place-items:center;color:var(--solaris-color-text-muted)}.solaris-form-field__status--disabled i{line-height:1;font-size:var(--solaris-fs-18)}\n"], dependencies: [{ kind: "component", type: PasswordToggle, selector: "solaris-password-toggle" }, { kind: "component", type: FieldErrorComponent, selector: "solaris-field-error", inputs: ["text", "textKey", "textParams"] }, { kind: "pipe", type: SolarisTranslationPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4551
|
+
], queries: [{ propertyName: "prefix", first: true, predicate: SolarisPrefixDirective, descendants: true }, { propertyName: "suffix", first: true, predicate: SolarisSuffixDirective, descendants: true }], ngImport: i0, template: "<div class=\"solaris-form-field\" [class.solaris-form-field--has-prefix]=\"hasPrefix\" [attr.data-appearance]=\"appearance\"\r\n [attr.data-invalid]=\"invalidComputed() ? 'true' : null\" [attr.data-radius]=\"radius\"\r\n [attr.data-disabled]=\"disabledComputed() ? 'true' : null\">\r\n @if ((label || labelKey)) {\r\n <label class=\"solaris-form-field__label\">\r\n @if (labelKey) { {{ labelKey | translate }} }\r\n @else if (label) { {{ label }} }\r\n </label>\r\n }\r\n\r\n <div class=\"solaris-form-field__frame\">\r\n @if (hasPrefix) {\r\n <span class=\"solaris-form-field__prefix\" aria-hidden=\"true\">\r\n <ng-content select=\"[solaris-prefix]\"></ng-content>\r\n </span>\r\n }\r\n\r\n <div class=\"solaris-form-field__body\">\r\n <div class=\"solaris-form-field__control-slot\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n @if (hasSuffix || showPasswordToggle() || invalidComputed() || disabledComputed()) {\r\n <span class=\"solaris-form-field__suffix\">\r\n @if (disabledComputed()) {\r\n <span class=\"solaris-form-field__status solaris-form-field__status--disabled\" aria-hidden=\"true\">\r\n <i class=\"ph ph-lock-simple\"></i>\r\n </span>\r\n } @else {\r\n <ng-content select=\"[solaris-suffix]\"></ng-content>\r\n\r\n @if (showPasswordToggle()) {\r\n <solaris-password-toggle></solaris-password-toggle>\r\n }\r\n\r\n @if (invalidComputed()) {\r\n <span class=\"solaris-form-field__status\" aria-hidden=\"true\">\r\n <i class=\"ph ph-warning-circle\"></i>\r\n </span>\r\n }\r\n }\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n\r\n @if (errorKey()) {\r\n <solaris-field-error [textKey]=\"errorKey()\" [textParams]=\"errorParams()\"></solaris-field-error>\r\n } @else {\r\n <ng-content select=\"[form-field-message]\"></ng-content>\r\n }\r\n\r\n @if (hint || hintKey) {\r\n <div class=\"solaris-form-field__hint\">\r\n @if (hintKey) { {{ hintKey | translate }} }\r\n @else { {{ hint }} }\r\n </div>\r\n }\r\n</div>\r\n", styles: [".solaris-form-field{display:grid;gap:var(--solaris-space-2);--solaris-form-field-radius: var(--solaris-radius-sm);--solaris-form-field-bg: var(--solaris-color-surface-2);--solaris-form-field-border: var(--solaris-color-border);--solaris-form-field-border-hover: color-mix(in srgb, var(--solaris-color-border) 70%, var(--solaris-color-text-muted))}.solaris-form-field[data-radius=none]{--solaris-form-field-radius: var(--solaris-radius-none)}.solaris-form-field[data-radius=xs]{--solaris-form-field-radius: var(--solaris-radius-xs)}.solaris-form-field[data-radius=sm]{--solaris-form-field-radius: var(--solaris-radius-sm)}.solaris-form-field[data-radius=md]{--solaris-form-field-radius: var(--solaris-radius-md)}.solaris-form-field[data-radius=lg]{--solaris-form-field-radius: var(--solaris-radius-lg)}.solaris-form-field[data-radius=full]{--solaris-form-field-radius: var(--solaris-radius-full)}.solaris-form-field[data-appearance=outline]{--solaris-form-field-bg: transparent;--solaris-form-field-border: color-mix(in srgb, var(--solaris-color-border) 85%, transparent);--solaris-form-field-border-hover: color-mix(in srgb, var(--solaris-color-border) 65%, var(--solaris-color-text-muted))}.solaris-form-field__label{font-weight:600;font-size:var(--solaris-fs-14);color:var(--solaris-color-text);margin-left:var(--solaris-space-1)}.solaris-form-field__frame{display:grid;min-height:3.8rem;align-items:stretch;grid-template-columns:1fr;background:var(--solaris-form-field-bg);border-radius:var(--solaris-form-field-radius);border:1px solid var(--solaris-form-field-border);transition:border-color .12s ease,box-shadow .12s ease,background-color .12s ease}.solaris-form-field--has-prefix .solaris-form-field__frame{grid-template-columns:3.8rem 1fr}.solaris-form-field__prefix{opacity:.5;display:grid;width:3.8rem;line-height:0;place-items:center;font-size:var(--solaris-fs-14);color:var(--solaris-color-text-muted);transition:opacity .3s ease,filter .3s ease;border-right:1px solid color-mix(in srgb,var(--solaris-color-border) 85%,transparent)}.solaris-form-field__frame:hover .solaris-form-field__prefix,.solaris-form-field__frame:focus-within .solaris-form-field__prefix{opacity:1;filter:brightness(1.05)}.solaris-form-field__prefix :is(i,svg,[solarisPrefixIcon]){display:block;line-height:1}.solaris-form-field__prefix i.ph{opacity:.6;font-size:var(--solaris-fs-18)}.solaris-form-field__prefix svg{width:var(--solaris-fs-18);height:var(--solaris-fs-18)}.solaris-form-field__body{min-width:0;display:grid;padding-right:0;position:relative;align-items:center;padding-left:var(--solaris-space-3);grid-template-columns:minmax(0,1fr) auto}.solaris-form-field__control-slot{width:100%;min-width:0;display:flex;flex:1 1 auto;align-items:center}.solaris-form-field__control-slot>*{flex:1 1 0;width:100%;min-width:0}.solaris-form-field__control-slot :is(input,textarea){margin:0;border:0;width:100%;min-width:0;outline:none;padding:.9rem 0;background:transparent;font-size:var(--solaris-fs-14);color:var(--solaris-color-text);line-height:var(--solaris-lh-normal)}.solaris-form-field__control-slot :is(input,textarea)::placeholder{opacity:.9;color:var(--solaris-color-text-muted)}.solaris-form-field__suffix{display:inline-flex;align-items:center;justify-content:center;padding-right:var(--solaris-space-3);gap:var(--solaris-space-2)}.solaris-form-field__suffix :is(button,a){height:3.6rem;align-self:stretch;align-items:center;display:inline-flex}.solaris-form-field__status{width:3.8rem;display:grid;opacity:.95;height:3.8rem;place-items:center;color:var(--solaris-color-error)}.solaris-form-field__status i.ph{line-height:1;font-size:var(--solaris-fs-18)}.solaris-form-field__hint{font-size:var(--solaris-fs-12);color:var(--solaris-color-text-muted)}.solaris-form-field__frame:has(:focus-visible){box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-primary) 5%,transparent);border-color:color-mix(in srgb,var(--solaris-color-primary) 70%,var(--solaris-color-border))}.solaris-form-field[data-invalid=true] .solaris-form-field__frame{box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-error) 5%,transparent);border-color:color-mix(in srgb,var(--solaris-color-error) 70%,var(--solaris-color-border))}.solaris-form-field[data-invalid=true] .solaris-form-field__frame:focus-within{border-color:color-mix(in srgb,var(--solaris-color-error) 80%,var(--solaris-color-border));box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-error) 16%,transparent)}.solaris-form-field[data-invalid=true] .solaris-form-field__prefix{border-right-color:color-mix(in srgb,var(--solaris-color-error) 30%,var(--solaris-color-border));color:color-mix(in srgb,var(--solaris-color-error) 75%,var(--solaris-color-text-muted))}.solaris-form-field[data-invalid=true] .solaris-form-field__control-slot :is(input,textarea)::placeholder{color:color-mix(in srgb,var(--solaris-color-error) 45%,var(--solaris-color-text-muted))}.solaris-form-field__body:has(solaris-phone-input){padding-left:0}.solaris-form-field[data-disabled=true] .solaris-form-field__frame{opacity:.45;cursor:not-allowed}.solaris-form-field[data-disabled=true] .solaris-form-field__frame *,.solaris-form-field[data-disabled=true] .solaris-form-field__label,.solaris-form-field[data-disabled=true] .solaris-form-field__hint{cursor:not-allowed}.solaris-form-field[data-disabled=true] .solaris-form-field__prefix,.solaris-form-field[data-disabled=true] .solaris-form-field__suffix,.solaris-form-field[data-disabled=true] .solaris-form-field__label,.solaris-form-field[data-disabled=true] .solaris-form-field__hint{color:var(--solaris-color-text-muted)}.solaris-form-field__status--disabled{opacity:.9;width:3.8rem;display:grid;height:3.8rem;place-items:center;color:var(--solaris-color-text-muted)}.solaris-form-field[data-disabled=true] .solaris-form-field__frame,.solaris-form-field[data-disabled=true] .solaris-form-field__control-slot,.solaris-form-field[data-disabled=true] .solaris-form-field__control-slot>*,.solaris-form-field[data-disabled=true] .solaris-form-field__control-slot :is(input,textarea,select,button){cursor:not-allowed!important}.solaris-form-field__status--disabled i{line-height:1;font-size:var(--solaris-fs-18)}\n"], dependencies: [{ kind: "component", type: PasswordToggle, selector: "solaris-password-toggle" }, { kind: "component", type: FieldErrorComponent, selector: "solaris-field-error", inputs: ["text", "textKey", "textParams"] }, { kind: "pipe", type: SolarisTranslationPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4546
4552
|
}
|
|
4547
4553
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: FormField, decorators: [{
|
|
4548
4554
|
type: Component,
|
|
4549
4555
|
args: [{ selector: 'solaris-form-field', standalone: true, imports: [PasswordToggle, FieldErrorComponent, SolarisTranslationPipe], providers: [
|
|
4550
4556
|
SolarisFormFieldController,
|
|
4551
4557
|
{ provide: SOLARIS_FORM_FIELD_CONTROLLER, useExisting: SolarisFormFieldController },
|
|
4552
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"solaris-form-field\" [class.solaris-form-field--has-prefix]=\"hasPrefix\" [attr.data-appearance]=\"appearance\"\r\n [attr.data-invalid]=\"invalidComputed() ? 'true' : null\" [attr.data-radius]=\"radius\"\r\n [attr.data-disabled]=\"disabledComputed() ? 'true' : null\">\r\n @if ((label || labelKey)) {\r\n <label class=\"solaris-form-field__label\">\r\n @if (labelKey) { {{ labelKey | translate }} }\r\n @else if (label) { {{ label }} }\r\n </label>\r\n }\r\n\r\n <div class=\"solaris-form-field__frame\">\r\n @if (hasPrefix) {\r\n <span class=\"solaris-form-field__prefix\" aria-hidden=\"true\">\r\n <ng-content select=\"[solaris-prefix]\"></ng-content>\r\n </span>\r\n }\r\n\r\n <div class=\"solaris-form-field__body\">\r\n <div class=\"solaris-form-field__control-slot\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n @if (hasSuffix || showPasswordToggle() || invalidComputed() || disabledComputed()) {\r\n <span class=\"solaris-form-field__suffix\">\r\n @if (disabledComputed()) {\r\n <span class=\"solaris-form-field__status solaris-form-field__status--disabled\" aria-hidden=\"true\">\r\n <i class=\"ph ph-lock-simple\"></i>\r\n </span>\r\n } @else {\r\n <ng-content select=\"[solaris-suffix]\"></ng-content>\r\n\r\n @if (showPasswordToggle()) {\r\n <solaris-password-toggle></solaris-password-toggle>\r\n }\r\n\r\n @if (invalidComputed()) {\r\n <span class=\"solaris-form-field__status\" aria-hidden=\"true\">\r\n <i class=\"ph ph-warning-circle\"></i>\r\n </span>\r\n }\r\n }\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n\r\n @if (errorKey()) {\r\n <solaris-field-error [textKey]=\"errorKey()\" [textParams]=\"errorParams()\"></solaris-field-error>\r\n } @else {\r\n <ng-content select=\"[form-field-message]\"></ng-content>\r\n }\r\n\r\n @if (hint || hintKey) {\r\n <div class=\"solaris-form-field__hint\">\r\n @if (hintKey) { {{ hintKey | translate }} }\r\n @else { {{ hint }} }\r\n </div>\r\n }\r\n</div>\r\n", styles: [".solaris-form-field{display:grid;gap:var(--solaris-space-2);--solaris-form-field-radius: var(--solaris-radius-sm);--solaris-form-field-bg: var(--solaris-color-surface-2);--solaris-form-field-border: var(--solaris-color-border);--solaris-form-field-border-hover: color-mix(in srgb, var(--solaris-color-border) 70%, var(--solaris-color-text-muted))}.solaris-form-field[data-radius=none]{--solaris-form-field-radius: var(--solaris-radius-none)}.solaris-form-field[data-radius=xs]{--solaris-form-field-radius: var(--solaris-radius-xs)}.solaris-form-field[data-radius=sm]{--solaris-form-field-radius: var(--solaris-radius-sm)}.solaris-form-field[data-radius=md]{--solaris-form-field-radius: var(--solaris-radius-md)}.solaris-form-field[data-radius=lg]{--solaris-form-field-radius: var(--solaris-radius-lg)}.solaris-form-field[data-radius=full]{--solaris-form-field-radius: var(--solaris-radius-full)}.solaris-form-field[data-appearance=outline]{--solaris-form-field-bg: transparent;--solaris-form-field-border: color-mix(in srgb, var(--solaris-color-border) 85%, transparent);--solaris-form-field-border-hover: color-mix(in srgb, var(--solaris-color-border) 65%, var(--solaris-color-text-muted))}.solaris-form-field__label{font-weight:600;font-size:var(--solaris-fs-14);color:var(--solaris-color-text);margin-left:var(--solaris-space-1)}.solaris-form-field__frame{display:grid;min-height:3.8rem;align-items:stretch;grid-template-columns:1fr;background:var(--solaris-form-field-bg);border-radius:var(--solaris-form-field-radius);border:1px solid var(--solaris-form-field-border);transition:border-color .12s ease,box-shadow .12s ease,background-color .12s ease}.solaris-form-field--has-prefix .solaris-form-field__frame{grid-template-columns:3.8rem 1fr}.solaris-form-field__prefix{opacity:.5;display:grid;width:3.8rem;line-height:0;place-items:center;font-size:var(--solaris-fs-14);color:var(--solaris-color-text-muted);transition:opacity .3s ease,filter .3s ease;border-right:1px solid color-mix(in srgb,var(--solaris-color-border) 85%,transparent)}.solaris-form-field__frame:hover .solaris-form-field__prefix,.solaris-form-field__frame:focus-within .solaris-form-field__prefix{opacity:1;filter:brightness(1.05)}.solaris-form-field__prefix :is(i,svg,[solarisPrefixIcon]){display:block;line-height:1}.solaris-form-field__prefix i.ph{opacity:.6;font-size:var(--solaris-fs-18)}.solaris-form-field__prefix svg{width:var(--solaris-fs-18);height:var(--solaris-fs-18)}.solaris-form-field__body{min-width:0;display:grid;padding-right:0;position:relative;align-items:center;padding-left:var(--solaris-space-3);grid-template-columns:minmax(0,1fr) auto}.solaris-form-field__control-slot{width:100%;min-width:0;display:flex;flex:1 1 auto;align-items:center}.solaris-form-field__control-slot>*{flex:1 1 0;width:100%;min-width:0}.solaris-form-field__control-slot :is(input,textarea){margin:0;border:0;width:100%;min-width:0;outline:none;padding:.9rem 0;background:transparent;font-size:var(--solaris-fs-14);color:var(--solaris-color-text);line-height:var(--solaris-lh-normal)}.solaris-form-field__control-slot :is(input,textarea)::placeholder{opacity:.9;color:var(--solaris-color-text-muted)}.solaris-form-field__suffix{display:inline-flex;align-items:center;justify-content:center;padding-right:var(--solaris-space-3);gap:var(--solaris-space-2)}.solaris-form-field__suffix :is(button,a){height:3.6rem;align-self:stretch;align-items:center;display:inline-flex}.solaris-form-field__status{width:3.8rem;display:grid;opacity:.95;height:3.8rem;place-items:center;color:var(--solaris-color-error)}.solaris-form-field__status i.ph{line-height:1;font-size:var(--solaris-fs-18)}.solaris-form-field__hint{font-size:var(--solaris-fs-12);color:var(--solaris-color-text-muted)}.solaris-form-field__frame:has(:focus-visible){box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-primary) 5%,transparent);border-color:color-mix(in srgb,var(--solaris-color-primary) 70%,var(--solaris-color-border))}.solaris-form-field[data-invalid=true] .solaris-form-field__frame{box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-error) 5%,transparent);border-color:color-mix(in srgb,var(--solaris-color-error) 70%,var(--solaris-color-border))}.solaris-form-field[data-invalid=true] .solaris-form-field__frame:focus-within{border-color:color-mix(in srgb,var(--solaris-color-error) 80%,var(--solaris-color-border));box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-error) 16%,transparent)}.solaris-form-field[data-invalid=true] .solaris-form-field__prefix{border-right-color:color-mix(in srgb,var(--solaris-color-error) 30%,var(--solaris-color-border));color:color-mix(in srgb,var(--solaris-color-error) 75%,var(--solaris-color-text-muted))}.solaris-form-field[data-invalid=true] .solaris-form-field__control-slot :is(input,textarea)::placeholder{color:color-mix(in srgb,var(--solaris-color-error) 45%,var(--solaris-color-text-muted))}.solaris-form-field__body:has(solaris-phone-input){padding-left:0}.solaris-form-field[data-disabled=true] .solaris-form-field__frame{opacity:.45;cursor:not-allowed}.solaris-form-field[data-disabled=true] .solaris-form-field__frame *,.solaris-form-field[data-disabled=true] .solaris-form-field__label,.solaris-form-field[data-disabled=true] .solaris-form-field__hint{cursor:not-allowed}.solaris-form-field[data-disabled=true] .solaris-form-field__prefix,.solaris-form-field[data-disabled=true] .solaris-form-field__suffix,.solaris-form-field[data-disabled=true] .solaris-form-field__label,.solaris-form-field[data-disabled=true] .solaris-form-field__hint{color:var(--solaris-color-text-muted)}.solaris-form-field__status--disabled{opacity:.9;width:3.8rem;display:grid;height:3.8rem;place-items:center;color:var(--solaris-color-text-muted)}.solaris-form-field__status--disabled i{line-height:1;font-size:var(--solaris-fs-18)}\n"] }]
|
|
4558
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"solaris-form-field\" [class.solaris-form-field--has-prefix]=\"hasPrefix\" [attr.data-appearance]=\"appearance\"\r\n [attr.data-invalid]=\"invalidComputed() ? 'true' : null\" [attr.data-radius]=\"radius\"\r\n [attr.data-disabled]=\"disabledComputed() ? 'true' : null\">\r\n @if ((label || labelKey)) {\r\n <label class=\"solaris-form-field__label\">\r\n @if (labelKey) { {{ labelKey | translate }} }\r\n @else if (label) { {{ label }} }\r\n </label>\r\n }\r\n\r\n <div class=\"solaris-form-field__frame\">\r\n @if (hasPrefix) {\r\n <span class=\"solaris-form-field__prefix\" aria-hidden=\"true\">\r\n <ng-content select=\"[solaris-prefix]\"></ng-content>\r\n </span>\r\n }\r\n\r\n <div class=\"solaris-form-field__body\">\r\n <div class=\"solaris-form-field__control-slot\">\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n @if (hasSuffix || showPasswordToggle() || invalidComputed() || disabledComputed()) {\r\n <span class=\"solaris-form-field__suffix\">\r\n @if (disabledComputed()) {\r\n <span class=\"solaris-form-field__status solaris-form-field__status--disabled\" aria-hidden=\"true\">\r\n <i class=\"ph ph-lock-simple\"></i>\r\n </span>\r\n } @else {\r\n <ng-content select=\"[solaris-suffix]\"></ng-content>\r\n\r\n @if (showPasswordToggle()) {\r\n <solaris-password-toggle></solaris-password-toggle>\r\n }\r\n\r\n @if (invalidComputed()) {\r\n <span class=\"solaris-form-field__status\" aria-hidden=\"true\">\r\n <i class=\"ph ph-warning-circle\"></i>\r\n </span>\r\n }\r\n }\r\n </span>\r\n }\r\n </div>\r\n </div>\r\n\r\n @if (errorKey()) {\r\n <solaris-field-error [textKey]=\"errorKey()\" [textParams]=\"errorParams()\"></solaris-field-error>\r\n } @else {\r\n <ng-content select=\"[form-field-message]\"></ng-content>\r\n }\r\n\r\n @if (hint || hintKey) {\r\n <div class=\"solaris-form-field__hint\">\r\n @if (hintKey) { {{ hintKey | translate }} }\r\n @else { {{ hint }} }\r\n </div>\r\n }\r\n</div>\r\n", styles: [".solaris-form-field{display:grid;gap:var(--solaris-space-2);--solaris-form-field-radius: var(--solaris-radius-sm);--solaris-form-field-bg: var(--solaris-color-surface-2);--solaris-form-field-border: var(--solaris-color-border);--solaris-form-field-border-hover: color-mix(in srgb, var(--solaris-color-border) 70%, var(--solaris-color-text-muted))}.solaris-form-field[data-radius=none]{--solaris-form-field-radius: var(--solaris-radius-none)}.solaris-form-field[data-radius=xs]{--solaris-form-field-radius: var(--solaris-radius-xs)}.solaris-form-field[data-radius=sm]{--solaris-form-field-radius: var(--solaris-radius-sm)}.solaris-form-field[data-radius=md]{--solaris-form-field-radius: var(--solaris-radius-md)}.solaris-form-field[data-radius=lg]{--solaris-form-field-radius: var(--solaris-radius-lg)}.solaris-form-field[data-radius=full]{--solaris-form-field-radius: var(--solaris-radius-full)}.solaris-form-field[data-appearance=outline]{--solaris-form-field-bg: transparent;--solaris-form-field-border: color-mix(in srgb, var(--solaris-color-border) 85%, transparent);--solaris-form-field-border-hover: color-mix(in srgb, var(--solaris-color-border) 65%, var(--solaris-color-text-muted))}.solaris-form-field__label{font-weight:600;font-size:var(--solaris-fs-14);color:var(--solaris-color-text);margin-left:var(--solaris-space-1)}.solaris-form-field__frame{display:grid;min-height:3.8rem;align-items:stretch;grid-template-columns:1fr;background:var(--solaris-form-field-bg);border-radius:var(--solaris-form-field-radius);border:1px solid var(--solaris-form-field-border);transition:border-color .12s ease,box-shadow .12s ease,background-color .12s ease}.solaris-form-field--has-prefix .solaris-form-field__frame{grid-template-columns:3.8rem 1fr}.solaris-form-field__prefix{opacity:.5;display:grid;width:3.8rem;line-height:0;place-items:center;font-size:var(--solaris-fs-14);color:var(--solaris-color-text-muted);transition:opacity .3s ease,filter .3s ease;border-right:1px solid color-mix(in srgb,var(--solaris-color-border) 85%,transparent)}.solaris-form-field__frame:hover .solaris-form-field__prefix,.solaris-form-field__frame:focus-within .solaris-form-field__prefix{opacity:1;filter:brightness(1.05)}.solaris-form-field__prefix :is(i,svg,[solarisPrefixIcon]){display:block;line-height:1}.solaris-form-field__prefix i.ph{opacity:.6;font-size:var(--solaris-fs-18)}.solaris-form-field__prefix svg{width:var(--solaris-fs-18);height:var(--solaris-fs-18)}.solaris-form-field__body{min-width:0;display:grid;padding-right:0;position:relative;align-items:center;padding-left:var(--solaris-space-3);grid-template-columns:minmax(0,1fr) auto}.solaris-form-field__control-slot{width:100%;min-width:0;display:flex;flex:1 1 auto;align-items:center}.solaris-form-field__control-slot>*{flex:1 1 0;width:100%;min-width:0}.solaris-form-field__control-slot :is(input,textarea){margin:0;border:0;width:100%;min-width:0;outline:none;padding:.9rem 0;background:transparent;font-size:var(--solaris-fs-14);color:var(--solaris-color-text);line-height:var(--solaris-lh-normal)}.solaris-form-field__control-slot :is(input,textarea)::placeholder{opacity:.9;color:var(--solaris-color-text-muted)}.solaris-form-field__suffix{display:inline-flex;align-items:center;justify-content:center;padding-right:var(--solaris-space-3);gap:var(--solaris-space-2)}.solaris-form-field__suffix :is(button,a){height:3.6rem;align-self:stretch;align-items:center;display:inline-flex}.solaris-form-field__status{width:3.8rem;display:grid;opacity:.95;height:3.8rem;place-items:center;color:var(--solaris-color-error)}.solaris-form-field__status i.ph{line-height:1;font-size:var(--solaris-fs-18)}.solaris-form-field__hint{font-size:var(--solaris-fs-12);color:var(--solaris-color-text-muted)}.solaris-form-field__frame:has(:focus-visible){box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-primary) 5%,transparent);border-color:color-mix(in srgb,var(--solaris-color-primary) 70%,var(--solaris-color-border))}.solaris-form-field[data-invalid=true] .solaris-form-field__frame{box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-error) 5%,transparent);border-color:color-mix(in srgb,var(--solaris-color-error) 70%,var(--solaris-color-border))}.solaris-form-field[data-invalid=true] .solaris-form-field__frame:focus-within{border-color:color-mix(in srgb,var(--solaris-color-error) 80%,var(--solaris-color-border));box-shadow:0 0 .5rem .25rem color-mix(in srgb,var(--solaris-color-error) 16%,transparent)}.solaris-form-field[data-invalid=true] .solaris-form-field__prefix{border-right-color:color-mix(in srgb,var(--solaris-color-error) 30%,var(--solaris-color-border));color:color-mix(in srgb,var(--solaris-color-error) 75%,var(--solaris-color-text-muted))}.solaris-form-field[data-invalid=true] .solaris-form-field__control-slot :is(input,textarea)::placeholder{color:color-mix(in srgb,var(--solaris-color-error) 45%,var(--solaris-color-text-muted))}.solaris-form-field__body:has(solaris-phone-input){padding-left:0}.solaris-form-field[data-disabled=true] .solaris-form-field__frame{opacity:.45;cursor:not-allowed}.solaris-form-field[data-disabled=true] .solaris-form-field__frame *,.solaris-form-field[data-disabled=true] .solaris-form-field__label,.solaris-form-field[data-disabled=true] .solaris-form-field__hint{cursor:not-allowed}.solaris-form-field[data-disabled=true] .solaris-form-field__prefix,.solaris-form-field[data-disabled=true] .solaris-form-field__suffix,.solaris-form-field[data-disabled=true] .solaris-form-field__label,.solaris-form-field[data-disabled=true] .solaris-form-field__hint{color:var(--solaris-color-text-muted)}.solaris-form-field__status--disabled{opacity:.9;width:3.8rem;display:grid;height:3.8rem;place-items:center;color:var(--solaris-color-text-muted)}.solaris-form-field[data-disabled=true] .solaris-form-field__frame,.solaris-form-field[data-disabled=true] .solaris-form-field__control-slot,.solaris-form-field[data-disabled=true] .solaris-form-field__control-slot>*,.solaris-form-field[data-disabled=true] .solaris-form-field__control-slot :is(input,textarea,select,button){cursor:not-allowed!important}.solaris-form-field__status--disabled i{line-height:1;font-size:var(--solaris-fs-18)}\n"] }]
|
|
4553
4559
|
}], ctorParameters: () => [], propDecorators: { prefix: [{
|
|
4554
4560
|
type: ContentChild,
|
|
4555
4561
|
args: [SolarisPrefixDirective]
|
|
@@ -4766,12 +4772,9 @@ class SolarisSelect {
|
|
|
4766
4772
|
this.destroyRef.onDestroy(() => this.resizeObs?.disconnect());
|
|
4767
4773
|
}
|
|
4768
4774
|
writeValue(obj) {
|
|
4769
|
-
console.count('[Select] writeValue');
|
|
4770
|
-
console.log('[Select] writeValue obj:', obj);
|
|
4771
4775
|
this._value.set(this.sanitizeValue(obj));
|
|
4772
4776
|
}
|
|
4773
4777
|
registerOnChange(fn) {
|
|
4774
|
-
console.count('[Select] registerOnChange');
|
|
4775
4778
|
this.propagateChange = fn;
|
|
4776
4779
|
}
|
|
4777
4780
|
registerOnTouched(fn) { this.propagateTouched = fn; }
|
|
@@ -4976,9 +4979,7 @@ class SolarisSelect {
|
|
|
4976
4979
|
return v != null && this.eq(v, value);
|
|
4977
4980
|
}
|
|
4978
4981
|
setValue(next) {
|
|
4979
|
-
console.count('[Select] setValue (user)');
|
|
4980
4982
|
const cur = this._value();
|
|
4981
|
-
console.log('[Select] setValue cur:', cur, 'next:', next);
|
|
4982
4983
|
if (this.sameCvaValue(cur, next))
|
|
4983
4984
|
return;
|
|
4984
4985
|
this._value.set(next);
|