@rivet-health/design-system 36.2.0 → 37.0.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.
- package/esm2020/lib/input/alphabetic-field/alphabetic-field.component.mjs +2 -2
- package/esm2020/lib/input/currency-field/currency-field.component.mjs +3 -3
- package/esm2020/lib/input/number-field/number-field.component.mjs +2 -2
- package/esm2020/lib/input/percentage-field/percentage-field.component.mjs +3 -3
- package/esm2020/lib/input/phone-field/phone-field.component.mjs +2 -2
- package/esm2020/lib/input/search/search.component.mjs +2 -2
- package/esm2020/lib/input/text-field/text-field.component.mjs +2 -2
- package/esm2020/lib/visualization/chart/chart.component.mjs +26 -11
- package/esm2020/lib/visualization/chart/chart.mjs +156 -77
- package/fesm2015/rivet-health-design-system.mjs +194 -101
- package/fesm2015/rivet-health-design-system.mjs.map +1 -1
- package/fesm2020/rivet-health-design-system.mjs +194 -100
- package/fesm2020/rivet-health-design-system.mjs.map +1 -1
- package/lib/visualization/chart/chart.component.d.ts +8 -3
- package/lib/visualization/chart/chart.d.ts +4 -2
- package/package.json +1 -1
- package/styles/tokens/size.css +21 -0
|
@@ -23,10 +23,10 @@ export class AlphabeticFieldComponent extends TextFieldComponent {
|
|
|
23
23
|
}
|
|
24
24
|
}
|
|
25
25
|
AlphabeticFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AlphabeticFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
26
|
-
AlphabeticFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AlphabeticFieldComponent, selector: "riv-alphabetic-field", usesInheritance: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
26
|
+
AlphabeticFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AlphabeticFieldComponent, selector: "riv-alphabetic-field", usesInheritance: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
27
27
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AlphabeticFieldComponent, decorators: [{
|
|
28
28
|
type: Component,
|
|
29
|
-
args: [{ selector: 'riv-alphabetic-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n"] }]
|
|
29
|
+
args: [{ selector: 'riv-alphabetic-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n"] }]
|
|
30
30
|
}] });
|
|
31
31
|
(function (AlphabeticFieldComponent) {
|
|
32
32
|
function clean(v, casing) {
|
|
@@ -12,10 +12,10 @@ export class CurrencyFieldComponent extends NumberFieldComponent {
|
|
|
12
12
|
}
|
|
13
13
|
}
|
|
14
14
|
CurrencyFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CurrencyFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
15
|
-
CurrencyFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CurrencyFieldComponent, selector: "riv-currency-field", inputs: { placeholder: "placeholder", minimumFractionDigits: "minimumFractionDigits", maximumFractionDigits: "maximumFractionDigits" }, usesInheritance: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <span
|
|
15
|
+
CurrencyFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CurrencyFieldComponent, selector: "riv-currency-field", inputs: { placeholder: "placeholder", minimumFractionDigits: "minimumFractionDigits", maximumFractionDigits: "maximumFractionDigits" }, usesInheritance: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <span\n class=\"prefix\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n >$</span\n >\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: [":host{display:block;position:relative}.prefix{position:absolute;font:var(--input-medium);padding:var(--size-small)}.prefix.small{font:var(--input-small)}.prefix.large{font:var(--input-large);padding:var(--size-medium) var(--size-small)}input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium) var(--size-small) var(--size-xlarge);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium) var(--size-small) var(--size-xlarge);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium) var(--size-medium) var(--size-medium) var(--size-xlarge);height:var(--input-field-height-large)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
16
16
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CurrencyFieldComponent, decorators: [{
|
|
17
17
|
type: Component,
|
|
18
|
-
args: [{ selector: 'riv-currency-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <span
|
|
18
|
+
args: [{ selector: 'riv-currency-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <span\n class=\"prefix\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n >$</span\n >\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: [":host{display:block;position:relative}.prefix{position:absolute;font:var(--input-medium);padding:var(--size-small)}.prefix.small{font:var(--input-small)}.prefix.large{font:var(--input-large);padding:var(--size-medium) var(--size-small)}input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium) var(--size-small) var(--size-xlarge);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium) var(--size-small) var(--size-xlarge);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium) var(--size-medium) var(--size-medium) var(--size-xlarge);height:var(--input-field-height-large)}\n"] }]
|
|
19
19
|
}], propDecorators: { placeholder: [{
|
|
20
20
|
type: Input
|
|
21
21
|
}], minimumFractionDigits: [{
|
|
@@ -23,4 +23,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
23
23
|
}], maximumFractionDigits: [{
|
|
24
24
|
type: Input
|
|
25
25
|
}] } });
|
|
26
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
26
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3VycmVuY3ktZmllbGQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvcml2L3NyYy9saWIvaW5wdXQvY3VycmVuY3ktZmllbGQvY3VycmVuY3ktZmllbGQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvcml2L3NyYy9saWIvaW5wdXQvY3VycmVuY3ktZmllbGQvY3VycmVuY3ktZmllbGQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUUsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sd0NBQXdDLENBQUM7Ozs7QUFROUUsTUFBTSxPQUFPLHNCQUF1QixTQUFRLG9CQUFvQjtJQU5oRTs7UUFRVyxnQkFBVyxHQUFXLE1BQU0sQ0FBQztRQUc3QiwwQkFBcUIsR0FBVyxDQUFDLENBQUM7UUFHbEMsMEJBQXFCLEdBQVcsQ0FBQyxDQUFDO0tBQzVDOzttSEFUWSxzQkFBc0I7dUdBQXRCLHNCQUFzQix5TkNUbkMsZ2hDQXVDQTsyRkQ5QmEsc0JBQXNCO2tCQU5sQyxTQUFTOytCQUNFLG9CQUFvQixtQkFHYix1QkFBdUIsQ0FBQyxNQUFNOzhCQUl0QyxXQUFXO3NCQURuQixLQUFLO2dCQUlHLHFCQUFxQjtzQkFEN0IsS0FBSztnQkFJRyxxQkFBcUI7c0JBRDdCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTnVtYmVyRmllbGRDb21wb25lbnQgfSBmcm9tICcuLi9udW1iZXItZmllbGQvbnVtYmVyLWZpZWxkLmNvbXBvbmVudCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3Jpdi1jdXJyZW5jeS1maWVsZCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9jdXJyZW5jeS1maWVsZC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2N1cnJlbmN5LWZpZWxkLmNvbXBvbmVudC5jc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIEN1cnJlbmN5RmllbGRDb21wb25lbnQgZXh0ZW5kcyBOdW1iZXJGaWVsZENvbXBvbmVudCB7XG4gIEBJbnB1dCgpXG4gIG92ZXJyaWRlIHBsYWNlaG9sZGVyOiBzdHJpbmcgPSAnMC4wMCc7XG5cbiAgQElucHV0KClcbiAgb3ZlcnJpZGUgbWluaW11bUZyYWN0aW9uRGlnaXRzOiBudW1iZXIgPSAyO1xuXG4gIEBJbnB1dCgpXG4gIG92ZXJyaWRlIG1heGltdW1GcmFjdGlvbkRpZ2l0czogbnVtYmVyID0gMjtcbn1cbiIsIjxyaXYtaW5wdXQtbGFiZWxcbiAgW2xhYmVsXT1cImxhYmVsXCJcbiAgW2hlbHBdPVwiaGVscFwiXG4gIFtyZXF1aXJlZF09XCJyZXF1aXJlZFwiXG4gIFtzdGF0ZV09XCJzdGF0ZVwiXG4gIFtlcnJvck1lc3NhZ2VdPVwiZXJyb3JNZXNzYWdlXCJcbiAgW2xhYmVsQWN0aW9uVGV4dF09XCJsYWJlbEFjdGlvblRleHRcIlxuICAobGFiZWxBY3Rpb24pPVwibGFiZWxBY3Rpb24uZW1pdCgkZXZlbnQpXCJcbj5cbiAgPHNwYW5cbiAgICBjbGFzcz1cInByZWZpeFwiXG4gICAgW2NsYXNzLnNtYWxsXT1cInNpemUgPT09ICdzbWFsbCdcIlxuICAgIFtjbGFzcy5sYXJnZV09XCJzaXplID09PSAnbGFyZ2UnXCJcbiAgICA+JDwvc3BhblxuICA+XG4gIDxpbnB1dFxuICAgICNpbnB1dFxuICAgIFtuYW1lXT1cIm5hbWVcIlxuICAgIFtwbGFjZWhvbGRlcl09XCJwbGFjZWhvbGRlclwiXG4gICAgdHlwZT1cInRleHRcIlxuICAgIFtyZXF1aXJlZF09XCJyZXF1aXJlZFwiXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICBbcmVhZG9ubHldPVwicmVhZG9ubHlcIlxuICAgIFt2YWx1ZV09XCJ0ZXh0XCJcbiAgICBbYXR0ci5hcmlhLWxhYmVsXT1cImxhYmVsIHx8IG51bGxcIlxuICAgIChpbnB1dCk9XCJ0ZXh0ID0gaW5wdXQudmFsdWVcIlxuICAgIFtjbGFzcy53YXJuaW5nXT1cInN0YXRlID09PSAnd2FybmluZydcIlxuICAgIFtjbGFzcy5lcnJvcl09XCJzdGF0ZSA9PT0gJ2Vycm9yJ1wiXG4gICAgW2NsYXNzLnNtYWxsXT1cInNpemUgPT09ICdzbWFsbCdcIlxuICAgIFtjbGFzcy5sYXJnZV09XCJzaXplID09PSAnbGFyZ2UnXCJcbiAgICBbc3R5bGUudGV4dEFsaWduXT1cImFsaWduXCJcbiAgICBbcml2LWF1dG8tZm9jdXNdPVwiYXV0b0ZvY3VzXCJcbiAgICBhdXRvY29tcGxldGU9XCJvZmZcIlxuICAgIGF1dG9jb3JyZWN0PVwib2ZmXCJcbiAgICBhdXRvY2FwaXRhbGl6ZT1cIm9mZlwiXG4gICAgc3BlbGxjaGVjaz1cImZhbHNlXCJcbiAgICAoYmx1cik9XCJpbnB1dEJsdXIoKVwiXG4gIC8+XG48L3Jpdi1pbnB1dC1sYWJlbD5cbiJdfQ==
|
|
@@ -53,10 +53,10 @@ export class NumberFieldComponent extends InputLabelComponent {
|
|
|
53
53
|
}
|
|
54
54
|
}
|
|
55
55
|
NumberFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NumberFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
56
|
-
NumberFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: NumberFieldComponent, selector: "riv-number-field", inputs: { disabled: "disabled", readonly: "readonly", placeholder: "placeholder", maximumFractionDigits: "maximumFractionDigits", minimumFractionDigits: "minimumFractionDigits", min: "min", max: "max", align: "align", size: "size", autoFocus: "autoFocus", name: "name", value: "value" }, outputs: { valueChange: "valueChange", blur: "blur" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
56
|
+
NumberFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: NumberFieldComponent, selector: "riv-number-field", inputs: { disabled: "disabled", readonly: "readonly", placeholder: "placeholder", maximumFractionDigits: "maximumFractionDigits", minimumFractionDigits: "minimumFractionDigits", min: "min", max: "max", align: "align", size: "size", autoFocus: "autoFocus", name: "name", value: "value" }, outputs: { valueChange: "valueChange", blur: "blur" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
57
57
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NumberFieldComponent, decorators: [{
|
|
58
58
|
type: Component,
|
|
59
|
-
args: [{ selector: 'riv-number-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n"] }]
|
|
59
|
+
args: [{ selector: 'riv-number-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n"] }]
|
|
60
60
|
}], propDecorators: { disabled: [{
|
|
61
61
|
type: Input
|
|
62
62
|
}], readonly: [{
|
|
@@ -10,11 +10,11 @@ export class PercentageFieldComponent extends NumberFieldComponent {
|
|
|
10
10
|
}
|
|
11
11
|
}
|
|
12
12
|
PercentageFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PercentageFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
13
|
-
PercentageFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PercentageFieldComponent, selector: "riv-percentage-field", inputs: { align: "align" }, usesInheritance: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n <span
|
|
13
|
+
PercentageFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PercentageFieldComponent, selector: "riv-percentage-field", inputs: { align: "align" }, usesInheritance: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n <span\n class=\"suffix\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n >%</span\n >\n</riv-input-label>\n", styles: [":host{display:block;position:relative}.suffix{position:absolute;right:0;font:var(--input-medium);padding:var(--size-small)}.suffix.small{font:var(--input-small)}.suffix.large{font:var(--input-large);padding:var(--size-medium) var(--size-small)}input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-xlarge) var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-xlarge) var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium) var(--size-xlarge) var(--size-medium) var(--size-medium);height:var(--input-field-height-large)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
14
14
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PercentageFieldComponent, decorators: [{
|
|
15
15
|
type: Component,
|
|
16
|
-
args: [{ selector: 'riv-percentage-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n <span
|
|
16
|
+
args: [{ selector: 'riv-percentage-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n [labelActionText]=\"labelActionText\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n type=\"text\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [style.textAlign]=\"align\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n <span\n class=\"suffix\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n >%</span\n >\n</riv-input-label>\n", styles: [":host{display:block;position:relative}.suffix{position:absolute;right:0;font:var(--input-medium);padding:var(--size-small)}.suffix.small{font:var(--input-small)}.suffix.large{font:var(--input-large);padding:var(--size-medium) var(--size-small)}input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-xlarge) var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-xlarge) var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium) var(--size-xlarge) var(--size-medium) var(--size-medium);height:var(--input-field-height-large)}\n"] }]
|
|
17
17
|
}], propDecorators: { align: [{
|
|
18
18
|
type: Input
|
|
19
19
|
}] } });
|
|
20
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
20
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGVyY2VudGFnZS1maWVsZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9yaXYvc3JjL2xpYi9pbnB1dC9wZXJjZW50YWdlLWZpZWxkL3BlcmNlbnRhZ2UtZmllbGQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvcml2L3NyYy9saWIvaW5wdXQvcGVyY2VudGFnZS1maWVsZC9wZXJjZW50YWdlLWZpZWxkLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzFFLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLHdDQUF3QyxDQUFDOzs7O0FBUTlFLE1BQU0sT0FBTyx3QkFBeUIsU0FBUSxvQkFBb0I7SUFObEU7O1FBUVcsVUFBSyxHQUFtQyxPQUFPLENBQUM7S0FDMUQ7O3FIQUhZLHdCQUF3Qjt5R0FBeEIsd0JBQXdCLCtHQ1RyQyxnaENBdUNBOzJGRDlCYSx3QkFBd0I7a0JBTnBDLFNBQVM7K0JBQ0Usc0JBQXNCLG1CQUdmLHVCQUF1QixDQUFDLE1BQU07OEJBSXRDLEtBQUs7c0JBRGIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBOdW1iZXJGaWVsZENvbXBvbmVudCB9IGZyb20gJy4uL251bWJlci1maWVsZC9udW1iZXItZmllbGQuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAncml2LXBlcmNlbnRhZ2UtZmllbGQnLFxuICB0ZW1wbGF0ZVVybDogJy4vcGVyY2VudGFnZS1maWVsZC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3BlcmNlbnRhZ2UtZmllbGQuY29tcG9uZW50LmNzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgUGVyY2VudGFnZUZpZWxkQ29tcG9uZW50IGV4dGVuZHMgTnVtYmVyRmllbGRDb21wb25lbnQge1xuICBASW5wdXQoKVxuICBvdmVycmlkZSBhbGlnbjogTnVtYmVyRmllbGRDb21wb25lbnQuQWxpZ25tZW50ID0gJ3JpZ2h0Jztcbn1cbiIsIjxyaXYtaW5wdXQtbGFiZWxcbiAgW2xhYmVsXT1cImxhYmVsXCJcbiAgW2hlbHBdPVwiaGVscFwiXG4gIFtyZXF1aXJlZF09XCJyZXF1aXJlZFwiXG4gIFtzdGF0ZV09XCJzdGF0ZVwiXG4gIFtlcnJvck1lc3NhZ2VdPVwiZXJyb3JNZXNzYWdlXCJcbiAgW2xhYmVsQWN0aW9uVGV4dF09XCJsYWJlbEFjdGlvblRleHRcIlxuICAobGFiZWxBY3Rpb24pPVwibGFiZWxBY3Rpb24uZW1pdCgkZXZlbnQpXCJcbj5cbiAgPGlucHV0XG4gICAgI2lucHV0XG4gICAgW25hbWVdPVwibmFtZVwiXG4gICAgW3BsYWNlaG9sZGVyXT1cInBsYWNlaG9sZGVyXCJcbiAgICB0eXBlPVwidGV4dFwiXG4gICAgW3JlcXVpcmVkXT1cInJlcXVpcmVkXCJcbiAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuICAgIFtyZWFkb25seV09XCJyZWFkb25seVwiXG4gICAgW3ZhbHVlXT1cInRleHRcIlxuICAgIFthdHRyLmFyaWEtbGFiZWxdPVwibGFiZWwgfHwgbnVsbFwiXG4gICAgKGlucHV0KT1cInRleHQgPSBpbnB1dC52YWx1ZVwiXG4gICAgW2NsYXNzLndhcm5pbmddPVwic3RhdGUgPT09ICd3YXJuaW5nJ1wiXG4gICAgW2NsYXNzLmVycm9yXT1cInN0YXRlID09PSAnZXJyb3InXCJcbiAgICBbY2xhc3Muc21hbGxdPVwic2l6ZSA9PT0gJ3NtYWxsJ1wiXG4gICAgW2NsYXNzLmxhcmdlXT1cInNpemUgPT09ICdsYXJnZSdcIlxuICAgIFtzdHlsZS50ZXh0QWxpZ25dPVwiYWxpZ25cIlxuICAgIFtyaXYtYXV0by1mb2N1c109XCJhdXRvRm9jdXNcIlxuICAgIGF1dG9jb21wbGV0ZT1cIm9mZlwiXG4gICAgYXV0b2NvcnJlY3Q9XCJvZmZcIlxuICAgIGF1dG9jYXBpdGFsaXplPVwib2ZmXCJcbiAgICBzcGVsbGNoZWNrPVwiZmFsc2VcIlxuICAgIChibHVyKT1cImlucHV0Qmx1cigpXCJcbiAgLz5cbiAgPHNwYW5cbiAgICBjbGFzcz1cInN1ZmZpeFwiXG4gICAgW2NsYXNzLnNtYWxsXT1cInNpemUgPT09ICdzbWFsbCdcIlxuICAgIFtjbGFzcy5sYXJnZV09XCJzaXplID09PSAnbGFyZ2UnXCJcbiAgICA+JTwvc3BhblxuICA+XG48L3Jpdi1pbnB1dC1sYWJlbD5cbiJdfQ==
|
|
@@ -29,10 +29,10 @@ export class PhoneFieldComponent extends TextFieldComponent {
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
PhoneFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PhoneFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
32
|
-
PhoneFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PhoneFieldComponent, selector: "riv-phone-field", inputs: { placeholder: "placeholder", type: "type", maxLength: "maxLength" }, usesInheritance: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
32
|
+
PhoneFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PhoneFieldComponent, selector: "riv-phone-field", inputs: { placeholder: "placeholder", type: "type", maxLength: "maxLength" }, usesInheritance: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
33
33
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PhoneFieldComponent, decorators: [{
|
|
34
34
|
type: Component,
|
|
35
|
-
args: [{ selector: 'riv-phone-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n"] }]
|
|
35
|
+
args: [{ selector: 'riv-phone-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n"] }]
|
|
36
36
|
}], propDecorators: { placeholder: [{
|
|
37
37
|
type: Input
|
|
38
38
|
}], type: [{
|
|
@@ -12,10 +12,10 @@ export class SearchComponent extends TextFieldComponent {
|
|
|
12
12
|
}
|
|
13
13
|
}
|
|
14
14
|
SearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SearchComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
15
|
-
SearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SearchComponent, selector: "riv-search", inputs: { placeholder: "placeholder", name: "name", labelTemplate: "labelTemplate" }, usesInheritance: true, ngImport: i0, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [class.clickable]=\"!!text\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n class=\"clickable\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-medium)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}.clickable:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i3.IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
15
|
+
SearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SearchComponent, selector: "riv-search", inputs: { placeholder: "placeholder", name: "name", labelTemplate: "labelTemplate" }, usesInheritance: true, ngImport: i0, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [class.clickable]=\"!!text\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n class=\"clickable\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-medium)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}.clickable:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i3.IconComponent, selector: "riv-icon", inputs: ["name", "size", "customSize", "strokeWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
16
16
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SearchComponent, decorators: [{
|
|
17
17
|
type: Component,
|
|
18
|
-
args: [{ selector: 'riv-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [class.clickable]=\"!!text\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n class=\"clickable\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-medium)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}.clickable:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}\n"] }]
|
|
18
|
+
args: [{ selector: 'riv-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\n #input\n [id]=\"name\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n (input)=\"text = input.value\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n/>\n<div class=\"label\">\n <label [for]=\"name\" [class.close]=\"!!text\" (click)=\"text = ''\">\n <riv-icon\n *ngIf=\"!labelTemplate\"\n [class.clickable]=\"!!text\"\n [name]=\"!!text ? 'X' : 'Search'\"\n [size]=\"20\"\n ></riv-icon>\n <riv-icon\n *ngIf=\"labelTemplate && !!text\"\n class=\"clickable\"\n [name]=\"'X'\"\n [size]=\"20\"\n ></riv-icon>\n </label>\n <ng-container *ngIf=\"labelTemplate\" class=\"search-columns\"\n ><ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template\n ></ng-container>\n</div>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n", ":host{position:relative}input{padding-right:calc(var(--size-xlarge) + var(--size-xsmall))}.label{position:absolute;top:0;right:0;bottom:0;color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center;padding-right:var(--size-medium)}.label label{color:var(--type-light-low-contrast);display:flex;align-items:center;justify-content:center}label.close{color:var(--type-light-high-contrast)}.clickable:hover{background-color:var(--black-20);cursor:pointer;transition:background-color var(--short-transition)}\n"] }]
|
|
19
19
|
}], propDecorators: { placeholder: [{
|
|
20
20
|
type: Input
|
|
21
21
|
}], name: [{
|
|
@@ -52,10 +52,10 @@ export class TextFieldComponent extends InputLabelComponent {
|
|
|
52
52
|
}
|
|
53
53
|
}
|
|
54
54
|
TextFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TextFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
55
|
-
TextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TextFieldComponent, selector: "riv-text-field", inputs: { disabled: "disabled", readonly: "readonly", placeholder: "placeholder", casing: "casing", type: "type", size: "size", autoFocus: "autoFocus", name: "name", minLength: "minLength", maxLength: "maxLength", value: "value" }, outputs: { valueChange: "valueChange", blur: "blur" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
55
|
+
TextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TextFieldComponent, selector: "riv-text-field", inputs: { disabled: "disabled", readonly: "readonly", placeholder: "placeholder", casing: "casing", type: "type", size: "size", autoFocus: "autoFocus", name: "name", minLength: "minLength", maxLength: "maxLength", value: "value" }, outputs: { valueChange: "valueChange", blur: "blur" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n"], dependencies: [{ kind: "directive", type: i1.AutoFocusDirective, selector: "[riv-auto-focus]", inputs: ["riv-auto-focus"] }, { kind: "component", type: i2.InputLabelComponent, selector: "riv-input-label", inputs: ["label", "help", "required", "labelActionText", "errorMessage", "state"], outputs: ["labelAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
56
56
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TextFieldComponent, decorators: [{
|
|
57
57
|
type: Component,
|
|
58
|
-
args: [{ selector: 'riv-text-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium)}input.large{font:var(--input-large);padding:var(--size-medium)}\n"] }]
|
|
58
|
+
args: [{ selector: 'riv-text-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<riv-input-label\n [label]=\"label\"\n [help]=\"help\"\n [required]=\"required\"\n [labelActionText]=\"labelActionText\"\n [state]=\"state\"\n [errorMessage]=\"errorMessage\"\n (labelAction)=\"labelAction.emit($event)\"\n>\n <input\n #input\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [type]=\"type\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"text\"\n [attr.aria-label]=\"label || null\"\n (input)=\"text = input.value\"\n [class.small]=\"size === 'small'\"\n [class.large]=\"size === 'large'\"\n [attr.maxlength]=\"maxLength\"\n [attr.minlength]=\"minLength\"\n [class.warning]=\"state === 'warning'\"\n [class.error]=\"state === 'error'\"\n [riv-auto-focus]=\"autoFocus\"\n autocomplete=\"off\"\n autocorrect=\"off\"\n autocapitalize=\"off\"\n spellcheck=\"false\"\n (blur)=\"inputBlur()\"\n />\n</riv-input-label>\n", styles: ["input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-medium)}input::placeholder{color:var(--type-light-disabled)}input:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}input:read-only{background-color:var(--surface-light-1)}input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}input.warning{border-color:var(--surface-dark-caution)}input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}input.small{font:var(--input-small);padding:var(--size-small) var(--size-medium);height:var(--input-field-height-small)}input.large{font:var(--input-large);padding:var(--size-medium);height:var(--input-field-height-large)}\n"] }]
|
|
59
59
|
}], propDecorators: { disabled: [{
|
|
60
60
|
type: Input
|
|
61
61
|
}], readonly: [{
|