@ifsworld/granite-components 13.2.7 → 13.2.9-beta.1

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.
@@ -78,14 +78,9 @@ export class GraniteInputFieldComponent {
78
78
  this._passwordFieldIcon = 'view-disabled';
79
79
  }
80
80
  }
81
- _onKeyUp(event) {
82
- const inputEvent = event.target;
83
- this._applyCharacterCount(inputEvent.value);
84
- this._empty = inputEvent.value == null || inputEvent.value === '';
85
- this.valueChange.emit(inputEvent.value);
86
- }
87
81
  _onInput(event) {
88
82
  const inputEvent = event.target;
83
+ this._applyCharacterCount(inputEvent.value);
89
84
  this._empty = inputEvent.value == null || inputEvent.value === '';
90
85
  this.valueChange.emit(inputEvent.value);
91
86
  }
@@ -111,13 +106,13 @@ export class GraniteInputFieldComponent {
111
106
  return this._textareaElement.nativeElement;
112
107
  }
113
108
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: GraniteInputFieldComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
114
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: GraniteInputFieldComponent, selector: "granite-input-field", inputs: { id: "id", name: "name", type: "type", value: "value", required: "required", readonly: "readonly", invalid: "invalid", disabled: "disabled", placeholder: "placeholder", prefixicon: "prefixicon", maxlength: "maxlength", countcharacters: "countcharacters", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "granite-input-field" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }, { propertyName: "_textareaElement", first: true, predicate: ["textarea"], descendants: true }], exportAs: ["graniteInputField"], usesOnChanges: true, ngImport: i0, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-invalid]=\"invalid\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-container *ngIf=\"!_passwordField\">\n <ng-content select=\"[graniteInputSuffixButton]\"></ng-content>\n </ng-container>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-medium)}.granite-input-container .granite-input-top-row:hover:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-hard)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-invalid:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-8);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-signal-failure),inset .125rem 0 var(--granite-color-signal-failure),inset -.125rem 0 var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-8);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-8);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}:host ::ng-deep button[graniteInputSuffixButton]{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative;margin:0;border-radius:0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
109
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: GraniteInputFieldComponent, selector: "granite-input-field", inputs: { id: "id", name: "name", type: "type", value: "value", required: "required", readonly: "readonly", invalid: "invalid", disabled: "disabled", placeholder: "placeholder", prefixicon: "prefixicon", maxlength: "maxlength", countcharacters: "countcharacters", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "granite-input-field" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }, { propertyName: "_textareaElement", first: true, predicate: ["textarea"], descendants: true }], exportAs: ["graniteInputField"], usesOnChanges: true, ngImport: i0, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-invalid]=\"invalid\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-container *ngIf=\"!_passwordField\">\n <ng-content select=\"[graniteInputSuffixButton]\"></ng-content>\n </ng-container>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-medium)}.granite-input-container .granite-input-top-row:hover:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-hard)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-invalid:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-8);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-signal-failure),inset .125rem 0 var(--granite-color-signal-failure),inset -.125rem 0 var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-8);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-8);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}:host ::ng-deep button[graniteInputSuffixButton]{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative;margin:0;border-radius:0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
115
110
  }
116
111
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: GraniteInputFieldComponent, decorators: [{
117
112
  type: Component,
118
113
  args: [{ selector: 'granite-input-field', exportAs: 'graniteInputField', host: {
119
114
  class: 'granite-input-field',
120
- }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-invalid]=\"invalid\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-container *ngIf=\"!_passwordField\">\n <ng-content select=\"[graniteInputSuffixButton]\"></ng-content>\n </ng-container>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-medium)}.granite-input-container .granite-input-top-row:hover:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-hard)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-invalid:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-8);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-signal-failure),inset .125rem 0 var(--granite-color-signal-failure),inset -.125rem 0 var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-8);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-8);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}:host ::ng-deep button[graniteInputSuffixButton]{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative;margin:0;border-radius:0}\n"] }]
115
+ }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-invalid]=\"invalid\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-container *ngIf=\"!_passwordField\">\n <ng-content select=\"[graniteInputSuffixButton]\"></ng-content>\n </ng-container>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-medium)}.granite-input-container .granite-input-top-row:hover:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-hard)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-invalid:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-8);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-signal-failure),inset .125rem 0 var(--granite-color-signal-failure),inset -.125rem 0 var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-8);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-8);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}:host ::ng-deep button[graniteInputSuffixButton]{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative;margin:0;border-radius:0}\n"] }]
121
116
  }], ctorParameters: () => [{ type: i1.FocusMonitor }], propDecorators: { id: [{
122
117
  type: Input
123
118
  }], name: [{
@@ -157,4 +152,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
157
152
  type: ViewChild,
158
153
  args: ['textarea']
159
154
  }] } });
160
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQtZmllbGQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9ncmFuaXRlLWNvbXBvbmVudHMvc3JjL2xpYi9pbnB1dC1maWVsZC9pbnB1dC1maWVsZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2dyYW5pdGUtY29tcG9uZW50cy9zcmMvbGliL2lucHV0LWZpZWxkL2lucHV0LWZpZWxkLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQWUsTUFBTSxtQkFBbUIsQ0FBQztBQUM5RCxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUM5RCxPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxVQUFVLEVBQ1YsWUFBWSxFQUNaLEtBQUssRUFHTCxNQUFNLEVBRU4sU0FBUyxHQUNWLE1BQU0sZUFBZSxDQUFDOzs7OztBQUV2QixNQUFNLHNCQUFzQixHQUFHLENBQUMsTUFBTSxFQUFFLFFBQVEsRUFBRSxVQUFVLEVBQUUsVUFBVSxDQUFDLENBQUM7QUFZMUUsTUFBTSxPQUFPLDBCQUEwQjtJQTJEckMsWUFBb0IsYUFBMkI7UUFBM0Isa0JBQWEsR0FBYixhQUFhLENBQWM7UUF6RC9DLE9BQUUsR0FBa0IsSUFBSSxDQUFDO1FBR3pCLFNBQUksR0FBa0IsSUFBSSxDQUFDO1FBRzNCLFNBQUksR0FBVyxNQUFNLENBQUM7UUFHdEIsVUFBSyxHQUFvQixFQUFFLENBQUM7UUFHNUIsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUcxQixhQUFRLEdBQVksS0FBSyxDQUFDO1FBRzFCLFlBQU8sR0FBWSxLQUFLLENBQUM7UUFHekIsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUcxQixnQkFBVyxHQUFXLEVBQUUsQ0FBQztRQU16QixjQUFTLEdBQVcsR0FBRyxDQUFDO1FBR3hCLG9CQUFlLEdBQVksS0FB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TUFBTTtnQkFJQyxhQUFhO3NCQURwQixTQUFTO3VCQUFDLE9BQU87Z0JBSVYsZ0JBQWdCO3NCQUR2QixTQUFTO3VCQUFDLFVBQVUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBGb2N1c01vbml0b3IsIEZvY3VzT3JpZ2luIH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2ExMXknO1xuaW1wb3J0IHsgY29lcmNlQm9vbGVhblByb3BlcnR5IH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2NvZXJjaW9uJztcbmltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDb21wb25lbnQsXG4gIEVsZW1lbnRSZWYsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE9uQ2hhbmdlcyxcbiAgT25Jbml0LFxuICBPdXRwdXQsXG4gIFNpbXBsZUNoYW5nZXMsXG4gIFZpZXdDaGlsZCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmNvbnN0IEdSQU5JVEVfSU5QVVRfSU5DTFVERVMgPSBbJ3RleHQnLCAnbnVtYmVyJywgJ3Bhc3N3b3JkJywgJ3RleHRhcmVhJ107XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2dyYW5pdGUtaW5wdXQtZmllbGQnLFxuICBleHBvcnRBczogJ2dyYW5pdGVJbnB1dEZpZWxkJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2lucHV0LWZpZWxkLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vaW5wdXQtZmllbGQuY29tcG9uZW50LnNjc3MnXSxcbiAgaG9zdDoge1xuICAgIGNsYXNzOiAnZ3Jhbml0ZS1pbnB1dC1maWVsZCcsXG4gIH0sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBHcmFuaXRlSW5wdXRGaWVsZENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgT25DaGFuZ2VzIHtcbiAgQElucHV0KClcbiAgaWQ6IHN0cmluZyB8IG51bGwgPSBudWxsO1xuXG4gIEBJbnB1dCgpXG4gIG5hbWU6IHN0cmluZyB8IG51bGwgPSBudWxsO1xuXG4gIEBJbnB1dCgpXG4gIHR5cGU6IHN0cmluZyA9ICd0ZXh0JztcblxuICBASW5wdXQoKVxuICB2YWx1ZTogc3RyaW5nIHwgbnVtYmVyID0gJyc7XG5cbiAgQElucHV0KClcbiAgcmVxdWlyZWQ6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBASW5wdXQoKVxuICByZWFkb25seTogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIEBJbnB1dCgpXG4gIGludmFsaWQ6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBASW5wdXQoKVxuICBkaXNhYmxlZDogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIEBJbnB1dCgpXG4gIHBsYWNlaG9sZGVyOiBzdHJpbmcgPSAnJztcblxuICBASW5wdXQoKVxuICBwcmVmaXhpY29uOiBzdHJpbmc7XG5cbiAgQElucHV0KClcbiAgbWF4bGVuZ3RoOiBudW1iZXIgPSAyNTU7XG5cbiAgQElucHV0KClcbiAgY291bnRjaGFyYWN0ZXJzOiBib29sZWFuID0gZmFsc2U7XG5cbiAgQElucHV0KCdhcmlhLWxhYmVsJylcbiAgYXJpYUxhYmVsOiBzdHJpbmcgfCBudWxsID0gbnVsbDtcblxuICBASW5wdXQoJ2FyaWEtbGFiZWxsZWRieScpXG4gIGFyaWFMYWJlbGxlZGJ5OiBzdHJpbmcgfCBudWxsID0gbnVsbDtcblxuICBAT3V0cHV0KClcbiAgcmVhZG9ubHkgdmFsdWVDaGFuZ2U6IEV2ZW50RW1pdHRlcjxzdHJpbmc+ID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XG5cbiAgQFZpZXdDaGlsZCgnaW5wdXQnKVxuICBwcml2YXRlIF9pbnB1dEVsZW1lbnQ6IEVsZW1lbnRSZWY8SFRNTElucHV0RWxlbWVudD47XG5cbiAgQFZpZXdDaGlsZCgndGV4dGFyZWEnKVxuICBwcml2YXRlIF90ZXh0YXJlYUVsZW1lbnQ6IEVsZW1lbnRSZWY8SFRNTFRleHRBcmVhRWxlbWVudD47XG5cbiAgX3N1cHBvcnRlZDogYm9vbGVhbiA9IHRydWU7XG4gIF9lbXB0eTogYm9vbGVhbiA9IGZhbHNlO1xuICBfcGFzc3dvcmRGaWVsZEljb246IHN0cmluZyA9ICd2aWV3JztcbiAgX3Bhc3N3b3JkRmllbGQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgX2N1cnJlbnRDaGFyQ291bnQgPSAwO1xuICBwcml2YXRlIF9wYXNzd29yZFRvZ2dsZWQ6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIF9mb2N1c01vbml0b3I6IEZvY3VzTW9uaXRvcikge31cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLl92YWxpZGF0ZVR5cGUoKTtcblxuICAgIHRoaXMuX3Bhc3N3b3JkRmllbGQgPSB0aGlzLnR5cGUgPT0gJ3Bhc3N3b3JkJztcblxuICAgIHRoaXMuX2VtcHR5ID0gdGhpcy52YWx1ZSA9PSBudWxsIHx8IHRoaXMudmFsdWUgPT09ICcnO1xuICB9XG5cbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xuICAgIGlmIChjaGFuZ2VzLnJlcXVpcmVkKSB7XG4gICAgICB0aGlzLnJlcXVpcmVkID0gY29lcmNlQm9vbGVhblByb3BlcnR5KGNoYW5nZXMucmVxdWlyZWQuY3VycmVudFZhbHVlKTtcbiAgICB9XG5cbiAgICBpZiAoY2hhbmdlcy5yZWFkb25seSkge1xuICAgICAgdGhpcy5yZWFkb25seSA9IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eShjaGFuZ2VzLnJlYWRvbmx5LmN1cnJlbnRWYWx1ZSk7XG4gICAgfVxuXG4gICAgaWYgKGNoYW5nZXMuaW52YWxpZCkge1xuICAgICAgdGhpcy5pbnZhbGlkID0gY29lcmNlQm9vbGVhblByb3BlcnR5KGNoYW5nZXMuaW52YWxpZC5jdXJyZW50VmFsdWUpO1xuICAgIH1cblxuICAgIGlmIChjaGFuZ2VzLmRpc2FibGVkKSB7XG4gICAgICB0aGlzLmRpc2FibGVkID0gY29lcmNlQm9vbGVhblByb3BlcnR5KGNoYW5nZXMuZGlzYWJsZWQuY3VycmVudFZhbHVlKTtcbiAgICB9XG5cbiAgICBpZiAoY2hhbmdlcy5jb3VudGNoYXJhY3RlcnMpIHtcbiAgICAgIHRoaXMuY291bnRjaGFyYWN0ZXJzID0gY29lcmNlQm9vbGVhblByb3BlcnR5KFxuICAgICAgICBjaGFuZ2VzLmNvdW50Y2hhcmFjdGVycy5jdXJyZW50VmFsdWVcbiAgICAgICk7XG4gICAgfVxuXG4gICAgaWYgKGNoYW5nZXMudmFsdWUpIHtcbiAgICAgIHRoaXMuX2VtcHR5ID0gdGhpcy52YWx1ZSA9PSBudWxsIHx8IHRoaXMudmFsdWUgPT09ICcnO1xuICAgIH1cblxuICAgIGlmIChjaGFuZ2VzLnR5cGUpIHtcbiAgICAgIHRoaXMuX3ZhbGlkYXRlVHlwZSgpO1xuICAgIH1cbiAgfVxuXG4gIGZvY3VzKG9yaWdpbjogRm9jdXNPcmlnaW4gPSAncHJvZ3JhbScsIG9wdGlvbnM/OiBGb2N1c09wdGlvbnMpOiB2b2lkIHtcbiAgICBpZiAodGhpcy50eXBlID09PSAndGV4dCcpIHtcbiAgICAgIHRoaXMuX2ZvY3VzTW9uaXRvci5mb2N1c1ZpYSh0aGlzLl9nZXRJbnB1dEVsZW1lbnQoKSwgb3JpZ2luLCBvcHRpb25zKTtcbiAgICB9IGVsc2UgaWYgKHRoaXMudHlwZSA9PT0gJ3RleHRhcmVhJykge1xuICAgICAgdGhpcy5fZm9jdXNNb25pdG9yLmZvY3VzVmlhKHRoaXMuX2dldFRleHRhcmVhRWxlbWVudCgpLCBvcmlnaW4sIG9wdGlvbnMpO1xuICAgIH1cbiAgfVxuXG4gIF90b2dnbGVQYXNzd29yZCgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5fcGFzc3dvcmRUb2dnbGVkKSB7XG4gICAgICB0aGlzLl9wYXNzd29yZFRvZ2dsZWQgPSBmYWxzZTtcbiAgICAgIHRoaXMudHlwZSA9ICdwYXNzd29yZCc7XG4gICAgICB0aGlzLl9wYXNzd29yZEZpZWxkSWNvbiA9ICd2aWV3JztcbiAgICB9IGVsc2Uge1xuICAgICAgdGhpcy5fcGFzc3dvcmRUb2dnbGVkID0gdHJ1ZTtcbiAgICAgIHRoaXMudHlwZSA9ICd0ZXh0JztcbiAgICAgIHRoaXMuX3Bhc3N3b3JkRmllbGRJY29uID0gJ3ZpZXctZGlzYWJsZWQnO1xuICAgIH1cbiAgfVxuXG4gIF9vbktleVVwKGV2ZW50OiBLZXlib2FyZEV2ZW50KTogdm9pZCB7XG4gICAgY29uc3QgaW5wdXRFdmVudCA9IGV2ZW50LnRhcmdldCBhcyBIVE1MSW5wdXRFbGVtZW50O1xuICAgIHRoaXMuX2FwcGx5Q2hhcmFjdGVyQ291bnQoaW5wdXRFdmVudC52YWx1ZSk7XG4gICAgdGhpcy5fZW1wdHkgPSBpbnB1dEV2ZW50LnZhbHVlID09IG51bGwgfHwgaW5wdXRFdmVudC52YWx1ZSA9PT0gJyc7XG4gICAgdGhpcy52YWx1ZUNoYW5nZS5lbWl0KGlucHV0RXZlbnQudmFsdWUpO1xuICB9XG5cbiAgX29uSW5wdXQoZXZlbnQ6IEV2ZW50KTogdm9pZCB7XG4gICAgY29uc3QgaW5wdXRFdmVudCA9IGV2ZW50LnRhcmdldCBhcyBIVE1MSW5wdXRFbGVtZW50O1xuICAgIHRoaXMuX2VtcHR5ID0gaW5wdXRFdmVudC52YWx1ZSA9PSBudWxsIHx8IGlucHV0RXZlbnQudmFsdWUgPT09ICcnO1xuICAgIHRoaXMudmFsdWVDaGFuZ2UuZW1pdChpbnB1dEV2ZW50LnZhbHVlKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBfdmFsaWRhdGVUeXBlKCk6IHZvaWQge1xuICAgIGlmIChHUkFOSVRFX0lOUFVUX0lOQ0xVREVTLmluZGV4T2YodGhpcy50eXBlKSA8IDApIHtcbiAgICAgIHRoaXMuX3N1cHBvcnRlZCA9IGZhbHNlO1xuICAgICAgdGhyb3cgRXJyb3IoXG4gICAgICAgIGBJbnB1dCB0eXBlIFwiJHt0aGlzLnR5cGV9XCIgaXNuJ3Qgc3VwcG9ydGVkIGJ5IGdyYW5pdGVJbnB1dEZpZWxkLmBcbiAgICAgICk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBfYXBwbHlDaGFyYWN0ZXJDb3VudChpbnB1dFN0cmluZzogc3RyaW5nKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuY291bnRjaGFyYWN0ZXJzKSB7XG4gICAgICB0aGlzLl9jdXJyZW50Q2hhckNvdW50ID0gaW5wdXRTdHJpbmcubGVuZ3RoO1xuXG4gICAgICBpZiAodGhpcy5fY3VycmVudENoYXJDb3VudCA+IHRoaXMubWF4bGVuZ3RoKSB7XG4gICAgICAgIGlucHV0U3RyaW5nID0gaW5wdXRTdHJpbmcuc2xpY2UoMCwgdGhpcy5tYXhsZW5ndGgpO1xuICAgICAgICB0aGlzLl9jdXJyZW50Q2hhckNvdW50ID0gdGhpcy5tYXhsZW5ndGg7XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBfZ2V0SW5wdXRFbGVtZW50KCk6IEhUTUxJbnB1dEVsZW1lbnQge1xuICAgIHJldHVybiB0aGlzLl9pbnB1dEVsZW1lbnQubmF0aXZlRWxlbWVudDtcbiAgfVxuXG4gIHByaXZhdGUgX2dldFRleHRhcmVhRWxlbWVudCgpOiBIVE1MVGV4dEFyZWFFbGVtZW50IHtcbiAgICByZXR1cm4gdGhpcy5fdGV4dGFyZWFFbGVtZW50Lm5hdGl2ZUVsZW1lbnQ7XG4gIH1cbn1cbiIsIjxkaXZcbiAgKm5nSWY9XCJfc3VwcG9ydGVkXCJcbiAgY2xhc3M9XCJncmFuaXRlLWlucHV0LWNvbnRhaW5lclwiXG4gIFtjbGFzcy5ncmFuaXRlLWlucHV0LWRpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtcmVhZG9ubHldPVwicmVhZG9ubHlcIlxuICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1kaXNhYmxlZF09XCJkaXNhYmxlZFwiXG4gIFtjbGFzcy5ncmFuaXRlLWlucHV0LXJlYWRvbmx5XT1cInJlYWRvbmx5XCJcbj5cbiAgPGRpdlxuICAgIGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC10b3Atcm93XCJcbiAgICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1yZXF1aXJlZF09XCJyZXF1aXJlZFwiXG4gICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtZW1wdHldPVwiX2VtcHR5XCJcbiAgICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1kaXNhYmxlZF09XCJkaXNhYmxlZFwiXG4gICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtcmVhZG9ubHldPVwicmVhZG9ubHlcIlxuICAgIFtjbGFzcy5ncmFuaXRlLWlucHV0LWludmFsaWRdPVwiaW52YWxpZFwiXG4gID5cbiAgICA8ZGl2XG4gICAgICAqbmdJZj1cInByZWZpeGljb25cIlxuICAgICAgY2xhc3M9XCJncmFuaXRlLWlucHV0LXByZXBlbmRcIlxuICAgICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxuICAgICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtZW1wdHldPVwiX2VtcHR5XCJcbiAgICA+XG4gICAgICA8Z3Jhbml0ZS1pY29uIGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC1wcmVwZW5kLWljb25cIj5cbiAgICAgICAge3sgcHJlZml4aWNvbiB9fVxuICAgICAgPC9ncmFuaXRlLWljb24+XG4gICAgPC9kaXY+XG5cbiAgICA8bmctY29udGFpbmVyXG4gICAgICAqbmdJZj1cInR5cGUgIT09ICd0ZXh0YXJlYSc7IHRoZW4gaW5wdXRFbGVtZW50OyBlbHNlIHRleHRhcmVhRWxlbWVudFwiXG4gICAgPjwvbmctY29udGFpbmVyPlxuXG4gICAgPG5nLXRlbXBsYXRlICNpbnB1dEVsZW1lbnQ+XG4gICAgICA8aW5wdXRcbiAgICAgICAgI2lucHV0XG4gICAgICAgIFtpZF09XCJpZFwiXG4gICAgICAgIGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC1iYXNlXCJcbiAgICAgICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtaW52YWxpZF09XCJpbnZhbGlkXCJcbiAgICAgICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtZW1wdHldPVwiX2VtcHR5XCJcbiAgICAgICAgW25hbWVdPVwibmFtZVwiXG4gICAgICAgIFthdHRyLnR5cGVdPVwidHlwZVwiXG4gICAgICAgIFtyZXF1aXJlZF09XCJyZXF1aXJlZFwiXG4gICAgICAgIFtyZWFkb25seV09XCJyZWFkb25seVwiXG4gICAgICAgIFtkaXNhYmxlZF09XCJkaXNhYmxlZFwiXG4gICAgICAgIFtwbGFjZWhvbGRlcl09XCJwbGFjZWhvbGRlclwiXG4gICAgICAgIFthdHRyLm1heGxlbmd0aF09XCJtYXhsZW5ndGhcIlxuICAgICAgICBbdmFsdWVdPVwidmFsdWVcIlxuICAgICAgICBbYXR0ci5hcmlhLWxhYmVsXT1cImFyaWFMYWJlbFwiXG4gICAgICAgIFthdHRyLmFyaWEtbGFiZWxsZWRieV09XCJhcmlhTGFiZWxsZWRieVwiXG4gICAgICAgIFthdHRyLmFyaWEtaW52YWxpZF09XCJpbnZhbGlkXCJcbiAgICAgICAgKGtleXVwKT1cIl9vbktleVVwKCRldmVudClcIlxuICAgICAgICAoaW5wdXQpPVwiX29uSW5wdXQoJGV2ZW50KVwiXG4gICAgICAvPlxuICAgIDwvbmctdGVtcGxhdGU+XG5cbiAgICA8YnV0dG9uXG4gICAgICAqbmdJZj1cIl9wYXNzd29yZEZpZWxkXCJcbiAgICAgIGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC1hcHBlbmRcIlxuICAgICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxuICAgICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtZW1wdHldPVwiX2VtcHR5XCJcbiAgICAgIChjbGljayk9XCJfdG9nZ2xlUGFzc3dvcmQoKVwiXG4gICAgPlxuICAgICAgPGdyYW5pdGUtaWNvbiBjbGFzcz1cImdyYW5pdGUtaW5wdXQtcGFzc3dvcmQtdG9nZ2xlLWljb25cIj5cbiAgICAgICAge3sgX3Bhc3N3b3JkRmllbGRJY29uIH19XG4gICAgICA8L2dyYW5pdGUtaWNvbj5cbiAgICA8L2J1dHRvbj5cblxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCIhX3Bhc3N3b3JkRmllbGRcIj5cbiAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltncmFuaXRlSW5wdXRTdWZmaXhCdXR0b25dXCI+PC9uZy1jb250ZW50PlxuICAgIDwvbmctY29udGFpbmVyPlxuXG4gICAgPG5nLXRlbXBsYXRlICN0ZXh0YXJlYUVsZW1lbnQ+XG4gICAgICA8dGV4dGFyZWFcbiAgICAgICAgI3RleHRhcmVhXG4gICAgICAgIFtpZF09XCJpZFwiXG4gICAgICAgIGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC1iYXNlIGdyYW5pdGUtdGV4dC1hcmVhXCJcbiAgICAgICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtaW52YWxpZF09XCJpbnZhbGlkXCJcbiAgICAgICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtZW1wdHldPVwiX2VtcHR5XCJcbiAgICAgICAgcm93cz1cIjFcIlxuICAgICAgICBbbmFtZV09XCJuYW1lXCJcbiAgICAgICAgW2F0dHIudHlwZV09XCJ0eXBlXCJcbiAgICAgICAgW3JlcXVpcmVkXT1cInJlcXVpcmVkXCJcbiAgICAgICAgW3JlYWRvbmx5XT1cInJlYWRvbmx5XCJcbiAgICAgICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICAgICAgW3BsYWNlaG9sZGVyXT1cInBsYWNlaG9sZGVyXCJcbiAgICAgICAgW3ZhbHVlXT1cInZhbHVlXCJcbiAgICAgICAgW2F0dHIubWF4bGVuZ3RoXT1cIm1heGxlbmd0aFwiXG4gICAgICAgIFthdHRyLmFyaWEtbGFiZWxdPVwiYXJpYUxhYmVsXCJcbiAgICAgICAgW2F0dHIuYXJpYS1sYWJlbGxlZGJ5XT1cImFyaWFMYWJlbGxlZGJ5XCJcbiAgICAgICAgW2F0dHIuYXJpYS1yZXF1aXJlZF09XCJyZXF1aXJlZFwiXG4gICAgICAgIFthdHRyLmFyaWEtaW52YWxpZF09XCJpbnZhbGlkXCJcbiAgICAgICAgKGtleXVwKT1cIl9vbktleVVwKCRldmVudClcIlxuICAgICAgICAoaW5wdXQpPVwiX29uSW5wdXQoJGV2ZW50KVwiXG4gICAgICA+PC90ZXh0YXJlYT5cbiAgICA8L25nLXRlbXBsYXRlPlxuICA8L2Rpdj5cblxuICA8ZGl2ICpuZ0lmPVwiY291bnRjaGFyYWN0ZXJzXCIgY2xhc3M9XCJncmFuaXRlLWlucHV0LWJvdHRvbS1yb3dcIj5cbiAgICA8ZGl2IGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC1jaGFyLWNvdW50XCI+XG4gICAgICB7eyBfY3VycmVudENoYXJDb3VudCB9fS97eyBtYXhsZW5ndGggfX1cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
155
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQtZmllbGQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9ncmFuaXRlLWNvbXBvbmVudHMvc3JjL2xpYi9pbnB1dC1maWVsZC9pbnB1dC1maWVsZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2dyYW5pdGUtY29tcG9uZW50cy9zcmMvbGliL2lucHV0LWZpZWxkL2lucHV0LWZpZWxkLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQWUsTUFBTSxtQkFBbUIsQ0FBQztBQUM5RCxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUM5RCxPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxVQUFVLEVBQ1YsWUFBWSxFQUNaLEtBQUssRUFHTCxNQUFNLEVBRU4sU0FBUyxHQUNWLE1BQU0sZUFBZSxDQUFDOzs7OztBQUV2QixNQUFNLHNCQUFzQixHQUFHLENBQUMsTUFBTSxFQUFFLFFBQVEsRUFBRSxVQUFVLEVBQUUsVUFBVSxDQUFDLENBQUM7QUFZMUUsTUFBTSxPQUFPLDBCQUEwQjtJQTJEckMsWUFBb0IsYUFBMkI7UUFBM0Isa0JBQWEsR0FBYixhQUFhLENBQWM7UUF6RC9DLE9BQUUsR0FBa0IsSUFBSSxDQUFDO1FBR3pCLFNBQUksR0FBa0IsSUFBSSxDQUFDO1FBRzNCLFNBQUksR0FBVyxNQUFNLENBQUM7UUFHdEIsVUFBSyxHQUFvQixFQUFFLENBQUM7UUFHNUIsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUcxQixhQUFRLEdBQVksS0FBSyxDQUFDO1FBRzFCLFlBQU8sR0FBWSxLQUFLLENBQUM7UUFHekIsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUcxQixnQkFBVyxHQUFXLEVBQUUsQ0FBQztRQU16QixjQUFTLEdBQVcsR0FBRyxDQUFDO1FBR3hCLG9CQUFlLEdBQVksS0FB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QVMsQ0FBQztZQUMxQyxDQUFDO1FBQ0gsQ0FBQztJQUNILENBQUM7SUFFTyxnQkFBZ0I7UUFDdEIsT0FBTyxJQUFJLENBQUMsYUFBYSxDQUFDLGFBQWEsQ0FBQztJQUMxQyxDQUFDO0lBRU8sbUJBQW1CO1FBQ3pCLE9BQU8sSUFBSSxDQUFDLGdCQUFnQixDQUFDLGFBQWEsQ0FBQztJQUM3QyxDQUFDOzhHQTFKVSwwQkFBMEI7a0dBQTFCLDBCQUEwQiwydkJDM0J2Qyw0a0dBb0dBOzsyRkR6RWEsMEJBQTBCO2tCQVZ0QyxTQUFTOytCQUNFLHFCQUFxQixZQUNyQixtQkFBbUIsUUFHdkI7d0JBQ0osS0FBSyxFQUFFLHFCQUFxQjtxQkFDN0IsbUJBQ2dCLHVCQUF1QixDQUFDLE1BQU07aUZBSS9DLEVBQUU7c0JBREQsS0FBSztnQkFJTixJQUFJO3NCQURILEtBQUs7Z0JBSU4sSUFBSTtzQkFESCxLQUFLO2dCQUlOLEtBQUs7c0JBREosS0FBSztnQkFJTixRQUFRO3NCQURQLEtBQUs7Z0JBSU4sUUFBUTtzQkFEUCxLQUFLO2dCQUlOLE9BQU87c0JBRE4sS0FBSztnQkFJTixRQUFRO3NCQURQLEtBQUs7Z0JBSU4sV0FBVztzQkFEVixLQUFLO2dCQUlOLFVBQVU7c0JBRFQsS0FBSztnQkFJTixTQUFTO3NCQURSLEtBQUs7Z0JBSU4sZUFBZTtzQkFEZCxLQUFLO2dCQUlOLFNBQVM7c0JBRFIsS0FBSzt1QkFBQyxZQUFZO2dCQUluQixjQUFjO3NCQURiLEtBQUs7dUJBQUMsaUJBQWlCO2dCQUlmLFdBQVc7c0JBRG5CLE1BQU07Z0JBSUMsYUFBYTtzQkFEcEIsU0FBUzt1QkFBQyxPQUFPO2dCQUlWLGdCQUFnQjtzQkFEdkIsU0FBUzt1QkFBQyxVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRm9jdXNNb25pdG9yLCBGb2N1c09yaWdpbiB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9hMTF5JztcbmltcG9ydCB7IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eSB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9jb2VyY2lvbic7XG5pbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBFbGVtZW50UmVmLFxuICBFdmVudEVtaXR0ZXIsXG4gIElucHV0LFxuICBPbkNoYW5nZXMsXG4gIE9uSW5pdCxcbiAgT3V0cHV0LFxuICBTaW1wbGVDaGFuZ2VzLFxuICBWaWV3Q2hpbGQsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5jb25zdCBHUkFOSVRFX0lOUFVUX0lOQ0xVREVTID0gWyd0ZXh0JywgJ251bWJlcicsICdwYXNzd29yZCcsICd0ZXh0YXJlYSddO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdncmFuaXRlLWlucHV0LWZpZWxkJyxcbiAgZXhwb3J0QXM6ICdncmFuaXRlSW5wdXRGaWVsZCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9pbnB1dC1maWVsZC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2lucHV0LWZpZWxkLmNvbXBvbmVudC5zY3NzJ10sXG4gIGhvc3Q6IHtcbiAgICBjbGFzczogJ2dyYW5pdGUtaW5wdXQtZmllbGQnLFxuICB9LFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgR3Jhbml0ZUlucHV0RmllbGRDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcyB7XG4gIEBJbnB1dCgpXG4gIGlkOiBzdHJpbmcgfCBudWxsID0gbnVsbDtcblxuICBASW5wdXQoKVxuICBuYW1lOiBzdHJpbmcgfCBudWxsID0gbnVsbDtcblxuICBASW5wdXQoKVxuICB0eXBlOiBzdHJpbmcgPSAndGV4dCc7XG5cbiAgQElucHV0KClcbiAgdmFsdWU6IHN0cmluZyB8IG51bWJlciA9ICcnO1xuXG4gIEBJbnB1dCgpXG4gIHJlcXVpcmVkOiBib29sZWFuID0gZmFsc2U7XG5cbiAgQElucHV0KClcbiAgcmVhZG9ubHk6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBASW5wdXQoKVxuICBpbnZhbGlkOiBib29sZWFuID0gZmFsc2U7XG5cbiAgQElucHV0KClcbiAgZGlzYWJsZWQ6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBASW5wdXQoKVxuICBwbGFjZWhvbGRlcjogc3RyaW5nID0gJyc7XG5cbiAgQElucHV0KClcbiAgcHJlZml4aWNvbjogc3RyaW5nO1xuXG4gIEBJbnB1dCgpXG4gIG1heGxlbmd0aDogbnVtYmVyID0gMjU1O1xuXG4gIEBJbnB1dCgpXG4gIGNvdW50Y2hhcmFjdGVyczogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIEBJbnB1dCgnYXJpYS1sYWJlbCcpXG4gIGFyaWFMYWJlbDogc3RyaW5nIHwgbnVsbCA9IG51bGw7XG5cbiAgQElucHV0KCdhcmlhLWxhYmVsbGVkYnknKVxuICBhcmlhTGFiZWxsZWRieTogc3RyaW5nIHwgbnVsbCA9IG51bGw7XG5cbiAgQE91dHB1dCgpXG4gIHJlYWRvbmx5IHZhbHVlQ2hhbmdlOiBFdmVudEVtaXR0ZXI8c3RyaW5nPiA9IG5ldyBFdmVudEVtaXR0ZXI8c3RyaW5nPigpO1xuXG4gIEBWaWV3Q2hpbGQoJ2lucHV0JylcbiAgcHJpdmF0ZSBfaW5wdXRFbGVtZW50OiBFbGVtZW50UmVmPEhUTUxJbnB1dEVsZW1lbnQ+O1xuXG4gIEBWaWV3Q2hpbGQoJ3RleHRhcmVhJylcbiAgcHJpdmF0ZSBfdGV4dGFyZWFFbGVtZW50OiBFbGVtZW50UmVmPEhUTUxUZXh0QXJlYUVsZW1lbnQ+O1xuXG4gIF9zdXBwb3J0ZWQ6IGJvb2xlYW4gPSB0cnVlO1xuICBfZW1wdHk6IGJvb2xlYW4gPSBmYWxzZTtcbiAgX3Bhc3N3b3JkRmllbGRJY29uOiBzdHJpbmcgPSAndmlldyc7XG4gIF9wYXNzd29yZEZpZWxkOiBib29sZWFuID0gZmFsc2U7XG4gIF9jdXJyZW50Q2hhckNvdW50ID0gMDtcbiAgcHJpdmF0ZSBfcGFzc3dvcmRUb2dnbGVkOiBib29sZWFuID0gZmFsc2U7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBfZm9jdXNNb25pdG9yOiBGb2N1c01vbml0b3IpIHt9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy5fdmFsaWRhdGVUeXBlKCk7XG5cbiAgICB0aGlzLl9wYXNzd29yZEZpZWxkID0gdGhpcy50eXBlID09ICdwYXNzd29yZCc7XG5cbiAgICB0aGlzLl9lbXB0eSA9IHRoaXMudmFsdWUgPT0gbnVsbCB8fCB0aGlzLnZhbHVlID09PSAnJztcbiAgfVxuXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcbiAgICBpZiAoY2hhbmdlcy5yZXF1aXJlZCkge1xuICAgICAgdGhpcy5yZXF1aXJlZCA9IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eShjaGFuZ2VzLnJlcXVpcmVkLmN1cnJlbnRWYWx1ZSk7XG4gICAgfVxuXG4gICAgaWYgKGNoYW5nZXMucmVhZG9ubHkpIHtcbiAgICAgIHRoaXMucmVhZG9ubHkgPSBjb2VyY2VCb29sZWFuUHJvcGVydHkoY2hhbmdlcy5yZWFkb25seS5jdXJyZW50VmFsdWUpO1xuICAgIH1cblxuICAgIGlmIChjaGFuZ2VzLmludmFsaWQpIHtcbiAgICAgIHRoaXMuaW52YWxpZCA9IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eShjaGFuZ2VzLmludmFsaWQuY3VycmVudFZhbHVlKTtcbiAgICB9XG5cbiAgICBpZiAoY2hhbmdlcy5kaXNhYmxlZCkge1xuICAgICAgdGhpcy5kaXNhYmxlZCA9IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eShjaGFuZ2VzLmRpc2FibGVkLmN1cnJlbnRWYWx1ZSk7XG4gICAgfVxuXG4gICAgaWYgKGNoYW5nZXMuY291bnRjaGFyYWN0ZXJzKSB7XG4gICAgICB0aGlzLmNvdW50Y2hhcmFjdGVycyA9IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eShcbiAgICAgICAgY2hhbmdlcy5jb3VudGNoYXJhY3RlcnMuY3VycmVudFZhbHVlXG4gICAgICApO1xuICAgIH1cblxuICAgIGlmIChjaGFuZ2VzLnZhbHVlKSB7XG4gICAgICB0aGlzLl9lbXB0eSA9IHRoaXMudmFsdWUgPT0gbnVsbCB8fCB0aGlzLnZhbHVlID09PSAnJztcbiAgICB9XG5cbiAgICBpZiAoY2hhbmdlcy50eXBlKSB7XG4gICAgICB0aGlzLl92YWxpZGF0ZVR5cGUoKTtcbiAgICB9XG4gIH1cblxuICBmb2N1cyhvcmlnaW46IEZvY3VzT3JpZ2luID0gJ3Byb2dyYW0nLCBvcHRpb25zPzogRm9jdXNPcHRpb25zKTogdm9pZCB7XG4gICAgaWYgKHRoaXMudHlwZSA9PT0gJ3RleHQnKSB7XG4gICAgICB0aGlzLl9mb2N1c01vbml0b3IuZm9jdXNWaWEodGhpcy5fZ2V0SW5wdXRFbGVtZW50KCksIG9yaWdpbiwgb3B0aW9ucyk7XG4gICAgfSBlbHNlIGlmICh0aGlzLnR5cGUgPT09ICd0ZXh0YXJlYScpIHtcbiAgICAgIHRoaXMuX2ZvY3VzTW9uaXRvci5mb2N1c1ZpYSh0aGlzLl9nZXRUZXh0YXJlYUVsZW1lbnQoKSwgb3JpZ2luLCBvcHRpb25zKTtcbiAgICB9XG4gIH1cblxuICBfdG9nZ2xlUGFzc3dvcmQoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuX3Bhc3N3b3JkVG9nZ2xlZCkge1xuICAgICAgdGhpcy5fcGFzc3dvcmRUb2dnbGVkID0gZmFsc2U7XG4gICAgICB0aGlzLnR5cGUgPSAncGFzc3dvcmQnO1xuICAgICAgdGhpcy5fcGFzc3dvcmRGaWVsZEljb24gPSAndmlldyc7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuX3Bhc3N3b3JkVG9nZ2xlZCA9IHRydWU7XG4gICAgICB0aGlzLnR5cGUgPSAndGV4dCc7XG4gICAgICB0aGlzLl9wYXNzd29yZEZpZWxkSWNvbiA9ICd2aWV3LWRpc2FibGVkJztcbiAgICB9XG4gIH1cblxuICBfb25JbnB1dChldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICBjb25zdCBpbnB1dEV2ZW50ID0gZXZlbnQudGFyZ2V0IGFzIEhUTUxJbnB1dEVsZW1lbnQ7XG4gICAgdGhpcy5fYXBwbHlDaGFyYWN0ZXJDb3VudChpbnB1dEV2ZW50LnZhbHVlKTtcbiAgICB0aGlzLl9lbXB0eSA9IGlucHV0RXZlbnQudmFsdWUgPT0gbnVsbCB8fCBpbnB1dEV2ZW50LnZhbHVlID09PSAnJztcbiAgICB0aGlzLnZhbHVlQ2hhbmdlLmVtaXQoaW5wdXRFdmVudC52YWx1ZSk7XG4gIH1cblxuICBwcm90ZWN0ZWQgX3ZhbGlkYXRlVHlwZSgpOiB2b2lkIHtcbiAgICBpZiAoR1JBTklURV9JTlBVVF9JTkNMVURFUy5pbmRleE9mKHRoaXMudHlwZSkgPCAwKSB7XG4gICAgICB0aGlzLl9zdXBwb3J0ZWQgPSBmYWxzZTtcbiAgICAgIHRocm93IEVycm9yKFxuICAgICAgICBgSW5wdXQgdHlwZSBcIiR7dGhpcy50eXBlfVwiIGlzbid0IHN1cHBvcnRlZCBieSBncmFuaXRlSW5wdXRGaWVsZC5gXG4gICAgICApO1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgX2FwcGx5Q2hhcmFjdGVyQ291bnQoaW5wdXRTdHJpbmc6IHN0cmluZyk6IHZvaWQge1xuICAgIGlmICh0aGlzLmNvdW50Y2hhcmFjdGVycykge1xuICAgICAgdGhpcy5fY3VycmVudENoYXJDb3VudCA9IGlucHV0U3RyaW5nLmxlbmd0aDtcblxuICAgICAgaWYgKHRoaXMuX2N1cnJlbnRDaGFyQ291bnQgPiB0aGlzLm1heGxlbmd0aCkge1xuICAgICAgICBpbnB1dFN0cmluZyA9IGlucHV0U3RyaW5nLnNsaWNlKDAsIHRoaXMubWF4bGVuZ3RoKTtcbiAgICAgICAgdGhpcy5fY3VycmVudENoYXJDb3VudCA9IHRoaXMubWF4bGVuZ3RoO1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgX2dldElucHV0RWxlbWVudCgpOiBIVE1MSW5wdXRFbGVtZW50IHtcbiAgICByZXR1cm4gdGhpcy5faW5wdXRFbGVtZW50Lm5hdGl2ZUVsZW1lbnQ7XG4gIH1cblxuICBwcml2YXRlIF9nZXRUZXh0YXJlYUVsZW1lbnQoKTogSFRNTFRleHRBcmVhRWxlbWVudCB7XG4gICAgcmV0dXJuIHRoaXMuX3RleHRhcmVhRWxlbWVudC5uYXRpdmVFbGVtZW50O1xuICB9XG59XG4iLCI8ZGl2XG4gICpuZ0lmPVwiX3N1cHBvcnRlZFwiXG4gIGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC1jb250YWluZXJcIlxuICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1kaXNhYmxlZF09XCJkaXNhYmxlZFwiXG4gIFtjbGFzcy5ncmFuaXRlLWlucHV0LXJlYWRvbmx5XT1cInJlYWRvbmx5XCJcbiAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1yZWFkb25seV09XCJyZWFkb25seVwiXG4+XG4gIDxkaXZcbiAgICBjbGFzcz1cImdyYW5pdGUtaW5wdXQtdG9wLXJvd1wiXG4gICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxuICAgIFtjbGFzcy5ncmFuaXRlLWlucHV0LWVtcHR5XT1cIl9lbXB0eVwiXG4gICAgW2NsYXNzLmdyYW5pdGUtaW5wdXQtZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuICAgIFtjbGFzcy5ncmFuaXRlLWlucHV0LXJlYWRvbmx5XT1cInJlYWRvbmx5XCJcbiAgICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1pbnZhbGlkXT1cImludmFsaWRcIlxuICA+XG4gICAgPGRpdlxuICAgICAgKm5nSWY9XCJwcmVmaXhpY29uXCJcbiAgICAgIGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC1wcmVwZW5kXCJcbiAgICAgIFtjbGFzcy5ncmFuaXRlLWlucHV0LXJlcXVpcmVkXT1cInJlcXVpcmVkXCJcbiAgICAgIFtjbGFzcy5ncmFuaXRlLWlucHV0LWVtcHR5XT1cIl9lbXB0eVwiXG4gICAgPlxuICAgICAgPGdyYW5pdGUtaWNvbiBjbGFzcz1cImdyYW5pdGUtaW5wdXQtcHJlcGVuZC1pY29uXCI+XG4gICAgICAgIHt7IHByZWZpeGljb24gfX1cbiAgICAgIDwvZ3Jhbml0ZS1pY29uPlxuICAgIDwvZGl2PlxuXG4gICAgPG5nLWNvbnRhaW5lclxuICAgICAgKm5nSWY9XCJ0eXBlICE9PSAndGV4dGFyZWEnOyB0aGVuIGlucHV0RWxlbWVudDsgZWxzZSB0ZXh0YXJlYUVsZW1lbnRcIlxuICAgID48L25nLWNvbnRhaW5lcj5cblxuICAgIDxuZy10ZW1wbGF0ZSAjaW5wdXRFbGVtZW50PlxuICAgICAgPGlucHV0XG4gICAgICAgICNpbnB1dFxuICAgICAgICBbaWRdPVwiaWRcIlxuICAgICAgICBjbGFzcz1cImdyYW5pdGUtaW5wdXQtYmFzZVwiXG4gICAgICAgIFtjbGFzcy5ncmFuaXRlLWlucHV0LWludmFsaWRdPVwiaW52YWxpZFwiXG4gICAgICAgIFtjbGFzcy5ncmFuaXRlLWlucHV0LWVtcHR5XT1cIl9lbXB0eVwiXG4gICAgICAgIFtuYW1lXT1cIm5hbWVcIlxuICAgICAgICBbYXR0ci50eXBlXT1cInR5cGVcIlxuICAgICAgICBbcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxuICAgICAgICBbcmVhZG9ubHldPVwicmVhZG9ubHlcIlxuICAgICAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuICAgICAgICBbcGxhY2Vob2xkZXJdPVwicGxhY2Vob2xkZXJcIlxuICAgICAgICBbYXR0ci5tYXhsZW5ndGhdPVwibWF4bGVuZ3RoXCJcbiAgICAgICAgW3ZhbHVlXT1cInZhbHVlXCJcbiAgICAgICAgW2F0dHIuYXJpYS1sYWJlbF09XCJhcmlhTGFiZWxcIlxuICAgICAgICBbYXR0ci5hcmlhLWxhYmVsbGVkYnldPVwiYXJpYUxhYmVsbGVkYnlcIlxuICAgICAgICBbYXR0ci5hcmlhLWludmFsaWRdPVwiaW52YWxpZFwiXG4gICAgICAgIChpbnB1dCk9XCJfb25JbnB1dCgkZXZlbnQpXCJcbiAgICAgIC8+XG4gICAgPC9uZy10ZW1wbGF0ZT5cblxuICAgIDxidXR0b25cbiAgICAgICpuZ0lmPVwiX3Bhc3N3b3JkRmllbGRcIlxuICAgICAgY2xhc3M9XCJncmFuaXRlLWlucHV0LWFwcGVuZFwiXG4gICAgICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1yZXF1aXJlZF09XCJyZXF1aXJlZFwiXG4gICAgICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1lbXB0eV09XCJfZW1wdHlcIlxuICAgICAgKGNsaWNrKT1cIl90b2dnbGVQYXNzd29yZCgpXCJcbiAgICA+XG4gICAgICA8Z3Jhbml0ZS1pY29uIGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC1wYXNzd29yZC10b2dnbGUtaWNvblwiPlxuICAgICAgICB7eyBfcGFzc3dvcmRGaWVsZEljb24gfX1cbiAgICAgIDwvZ3Jhbml0ZS1pY29uPlxuICAgIDwvYnV0dG9uPlxuXG4gICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIiFfcGFzc3dvcmRGaWVsZFwiPlxuICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2dyYW5pdGVJbnB1dFN1ZmZpeEJ1dHRvbl1cIj48L25nLWNvbnRlbnQ+XG4gICAgPC9uZy1jb250YWluZXI+XG5cbiAgICA8bmctdGVtcGxhdGUgI3RleHRhcmVhRWxlbWVudD5cbiAgICAgIDx0ZXh0YXJlYVxuICAgICAgICAjdGV4dGFyZWFcbiAgICAgICAgW2lkXT1cImlkXCJcbiAgICAgICAgY2xhc3M9XCJncmFuaXRlLWlucHV0LWJhc2UgZ3Jhbml0ZS10ZXh0LWFyZWFcIlxuICAgICAgICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1pbnZhbGlkXT1cImludmFsaWRcIlxuICAgICAgICBbY2xhc3MuZ3Jhbml0ZS1pbnB1dC1lbXB0eV09XCJfZW1wdHlcIlxuICAgICAgICByb3dzPVwiMVwiXG4gICAgICAgIFtuYW1lXT1cIm5hbWVcIlxuICAgICAgICBbYXR0ci50eXBlXT1cInR5cGVcIlxuICAgICAgICBbcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxuICAgICAgICBbcmVhZG9ubHldPVwicmVhZG9ubHlcIlxuICAgICAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxuICAgICAgICBbcGxhY2Vob2xkZXJdPVwicGxhY2Vob2xkZXJcIlxuICAgICAgICBbdmFsdWVdPVwidmFsdWVcIlxuICAgICAgICBbYXR0ci5tYXhsZW5ndGhdPVwibWF4bGVuZ3RoXCJcbiAgICAgICAgW2F0dHIuYXJpYS1sYWJlbF09XCJhcmlhTGFiZWxcIlxuICAgICAgICBbYXR0ci5hcmlhLWxhYmVsbGVkYnldPVwiYXJpYUxhYmVsbGVkYnlcIlxuICAgICAgICBbYXR0ci5hcmlhLXJlcXVpcmVkXT1cInJlcXVpcmVkXCJcbiAgICAgICAgW2F0dHIuYXJpYS1pbnZhbGlkXT1cImludmFsaWRcIlxuICAgICAgICAoaW5wdXQpPVwiX29uSW5wdXQoJGV2ZW50KVwiXG4gICAgICA+PC90ZXh0YXJlYT5cbiAgICA8L25nLXRlbXBsYXRlPlxuICA8L2Rpdj5cblxuICA8ZGl2ICpuZ0lmPVwiY291bnRjaGFyYWN0ZXJzXCIgY2xhc3M9XCJncmFuaXRlLWlucHV0LWJvdHRvbS1yb3dcIj5cbiAgICA8ZGl2IGNsYXNzPVwiZ3Jhbml0ZS1pbnB1dC1jaGFyLWNvdW50XCI+XG4gICAgICB7eyBfY3VycmVudENoYXJDb3VudCB9fS97eyBtYXhsZW5ndGggfX1cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
@@ -60,7 +60,7 @@ export class GraniteToggleSwitchComponent {
60
60
  return this._inputElement.nativeElement;
61
61
  }
62
62
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: GraniteToggleSwitchComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
63
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: GraniteToggleSwitchComponent, selector: "granite-toggle-switch", inputs: { id: "id", checked: "checked", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange", toggleChange: "toggleChange", toggleBlur: "toggleBlur" }, host: { properties: { "class.granite-toggle-switch-checked": "checked", "class.granite-toggle-switch-disabled": "disabled", "class.granite-toggle-switch-readonly": "readonly", "class.granite-toggle-switch-label-before": "_positionBefore" }, classAttribute: "granite-toggle-switch" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteToggleSwitch"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{box-shadow:0 0 0 .0625rem var(--granite-color-focus)}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
63
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: GraniteToggleSwitchComponent, selector: "granite-toggle-switch", inputs: { id: "id", checked: "checked", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange", toggleChange: "toggleChange", toggleBlur: "toggleBlur" }, host: { properties: { "class.granite-toggle-switch-checked": "checked", "class.granite-toggle-switch-disabled": "disabled", "class.granite-toggle-switch-readonly": "readonly", "class.granite-toggle-switch-label-before": "_positionBefore" }, classAttribute: "granite-toggle-switch" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteToggleSwitch"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{outline:var(--granite-spacing-2) solid var(--granite-color-focus);outline-offset:var(--granite-spacing-2);box-shadow:none}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content;padding-block:var(--granite-spacing-4)}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
64
64
  }
65
65
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: GraniteToggleSwitchComponent, decorators: [{
66
66
  type: Component,
@@ -70,7 +70,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
70
70
  '[class.granite-toggle-switch-disabled]': 'disabled',
71
71
  '[class.granite-toggle-switch-readonly]': 'readonly',
72
72
  '[class.granite-toggle-switch-label-before]': '_positionBefore',
73
- }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{box-shadow:0 0 0 .0625rem var(--granite-color-focus)}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}\n"] }]
73
+ }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{outline:var(--granite-spacing-2) solid var(--granite-color-focus);outline-offset:var(--granite-spacing-2);box-shadow:none}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content;padding-block:var(--granite-spacing-4)}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}\n"] }]
74
74
  }], ctorParameters: () => [{ type: i1.FocusMonitor }], propDecorators: { id: [{
75
75
  type: Input
76
76
  }], checked: [{
@@ -2256,7 +2256,7 @@ class GraniteToggleSwitchComponent {
2256
2256
  return this._inputElement.nativeElement;
2257
2257
  }
2258
2258
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: GraniteToggleSwitchComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
2259
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: GraniteToggleSwitchComponent, selector: "granite-toggle-switch", inputs: { id: "id", checked: "checked", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange", toggleChange: "toggleChange", toggleBlur: "toggleBlur" }, host: { properties: { "class.granite-toggle-switch-checked": "checked", "class.granite-toggle-switch-disabled": "disabled", "class.granite-toggle-switch-readonly": "readonly", "class.granite-toggle-switch-label-before": "_positionBefore" }, classAttribute: "granite-toggle-switch" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteToggleSwitch"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{box-shadow:0 0 0 .0625rem var(--granite-color-focus)}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2259
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: GraniteToggleSwitchComponent, selector: "granite-toggle-switch", inputs: { id: "id", checked: "checked", disabled: "disabled", readonly: "readonly", labelPosition: "labelPosition", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange", toggleChange: "toggleChange", toggleBlur: "toggleBlur" }, host: { properties: { "class.granite-toggle-switch-checked": "checked", "class.granite-toggle-switch-disabled": "disabled", "class.granite-toggle-switch-readonly": "readonly", "class.granite-toggle-switch-label-before": "_positionBefore" }, classAttribute: "granite-toggle-switch" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["graniteToggleSwitch"], usesOnChanges: true, ngImport: i0, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{outline:var(--granite-spacing-2) solid var(--granite-color-focus);outline-offset:var(--granite-spacing-2);box-shadow:none}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content;padding-block:var(--granite-spacing-4)}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2260
2260
  }
2261
2261
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: GraniteToggleSwitchComponent, decorators: [{
2262
2262
  type: Component,
@@ -2266,7 +2266,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
2266
2266
  '[class.granite-toggle-switch-disabled]': 'disabled',
2267
2267
  '[class.granite-toggle-switch-readonly]': 'readonly',
2268
2268
  '[class.granite-toggle-switch-label-before]': '_positionBefore',
2269
- }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{box-shadow:0 0 0 .0625rem var(--granite-color-focus)}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}\n"] }]
2269
+ }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label [attr.for]=\"id\" class=\"granite-toggle-switch-label\">\n <div class=\"granite-toggle-switch-bar\">\n <input\n #input\n [id]=\"id\"\n class=\"granite-toggle-switch-input cdk-visually-hidden\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-checked]=\"checked.toString()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [checked]=\"checked\"\n [disabled]=\"_toggleSwitchDisabled\"\n [readonly]=\"readonly\"\n (click)=\"_toggleSwitchClick()\"\n (change)=\"_toggleSwitchChange()\"\n (blur)=\"_onBlur()\"\n />\n <div class=\"granite-toggle-switch-thumb\"></div>\n </div>\n <span class=\"granite-toggle-switch-text\"><ng-content></ng-content></span>\n</label>\n", styles: [".cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}:host{box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit;cursor:pointer}:host(.granite-toggle-switch){color:var(--granite-color-text)}.granite-toggle-switch-bar{width:2rem;height:1rem;border-radius:.5rem;background-color:var(--granite-color-background-inactive);transition:background-color .1s linear;position:relative}.granite-toggle-switch-bar:focus-within{outline:var(--granite-spacing-2) solid var(--granite-color-focus);outline-offset:var(--granite-spacing-2);box-shadow:none}.granite-toggle-switch-thumb{width:1rem;height:1rem;border-radius:1rem;background-color:var(--granite-color-text-static-light);border:.0625rem solid var(--granite-color-background-inactive);transition:float .1s linear}html[dir=ltr] .granite-toggle-switch-thumb{float:left}:host-context([dir=ltr]) .granite-toggle-switch-thumb{float:left}html[dir=rtl] .granite-toggle-switch-thumb{float:right}:host-context([dir=rtl]) .granite-toggle-switch-thumb{float:right}:host(.granite-toggle-switch-checked) .granite-toggle-switch-bar{background-color:var(--granite-color-background-active)}:host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{border:.0625rem solid var(--granite-color-background-active)}html[dir=ltr] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}:host-context([dir=ltr]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:right}html[dir=rtl] :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}:host-context([dir=rtl]) :host(.granite-toggle-switch-checked) .granite-toggle-switch-thumb{float:left}.granite-toggle-switch-label{display:flex;align-items:center;width:max-content;padding-block:var(--granite-spacing-4)}:host(.granite-toggle-switch-disabled) .granite-toggle-switch-label{opacity:.6}:host(.granite-toggle-switch-disabled) *{cursor:default}:host(.granite-toggle-switch-readonly) *{cursor:default}.granite-toggle-switch-text{padding-inline-start:var(--granite-spacing-8);font-size:var(--granite-font-size-body-small)}.granite-toggle-switch-text:empty{display:none}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-label{flex-direction:row-reverse}:host(.granite-toggle-switch-label-before) .granite-toggle-switch-text{padding-inline-start:0;padding-inline-end:var(--granite-spacing-8)}\n"] }]
2270
2270
  }], ctorParameters: () => [{ type: i1.FocusMonitor }], propDecorators: { id: [{
2271
2271
  type: Input
2272
2272
  }], checked: [{
@@ -2775,14 +2775,9 @@ class GraniteInputFieldComponent {
2775
2775
  this._passwordFieldIcon = 'view-disabled';
2776
2776
  }
2777
2777
  }
2778
- _onKeyUp(event) {
2779
- const inputEvent = event.target;
2780
- this._applyCharacterCount(inputEvent.value);
2781
- this._empty = inputEvent.value == null || inputEvent.value === '';
2782
- this.valueChange.emit(inputEvent.value);
2783
- }
2784
2778
  _onInput(event) {
2785
2779
  const inputEvent = event.target;
2780
+ this._applyCharacterCount(inputEvent.value);
2786
2781
  this._empty = inputEvent.value == null || inputEvent.value === '';
2787
2782
  this.valueChange.emit(inputEvent.value);
2788
2783
  }
@@ -2808,13 +2803,13 @@ class GraniteInputFieldComponent {
2808
2803
  return this._textareaElement.nativeElement;
2809
2804
  }
2810
2805
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: GraniteInputFieldComponent, deps: [{ token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
2811
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: GraniteInputFieldComponent, selector: "granite-input-field", inputs: { id: "id", name: "name", type: "type", value: "value", required: "required", readonly: "readonly", invalid: "invalid", disabled: "disabled", placeholder: "placeholder", prefixicon: "prefixicon", maxlength: "maxlength", countcharacters: "countcharacters", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "granite-input-field" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }, { propertyName: "_textareaElement", first: true, predicate: ["textarea"], descendants: true }], exportAs: ["graniteInputField"], usesOnChanges: true, ngImport: i0, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-invalid]=\"invalid\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-container *ngIf=\"!_passwordField\">\n <ng-content select=\"[graniteInputSuffixButton]\"></ng-content>\n </ng-container>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-medium)}.granite-input-container .granite-input-top-row:hover:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-hard)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-invalid:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-8);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-signal-failure),inset .125rem 0 var(--granite-color-signal-failure),inset -.125rem 0 var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-8);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-8);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}:host ::ng-deep button[graniteInputSuffixButton]{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative;margin:0;border-radius:0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2806
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: GraniteInputFieldComponent, selector: "granite-input-field", inputs: { id: "id", name: "name", type: "type", value: "value", required: "required", readonly: "readonly", invalid: "invalid", disabled: "disabled", placeholder: "placeholder", prefixicon: "prefixicon", maxlength: "maxlength", countcharacters: "countcharacters", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "granite-input-field" }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }, { propertyName: "_textareaElement", first: true, predicate: ["textarea"], descendants: true }], exportAs: ["graniteInputField"], usesOnChanges: true, ngImport: i0, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-invalid]=\"invalid\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-container *ngIf=\"!_passwordField\">\n <ng-content select=\"[graniteInputSuffixButton]\"></ng-content>\n </ng-container>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-medium)}.granite-input-container .granite-input-top-row:hover:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-hard)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-invalid:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-8);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-signal-failure),inset .125rem 0 var(--granite-color-signal-failure),inset -.125rem 0 var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-8);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-8);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}:host ::ng-deep button[graniteInputSuffixButton]{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative;margin:0;border-radius:0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GraniteIconComponent, selector: "granite-icon", inputs: ["fontIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2812
2807
  }
2813
2808
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: GraniteInputFieldComponent, decorators: [{
2814
2809
  type: Component,
2815
2810
  args: [{ selector: 'granite-input-field', exportAs: 'graniteInputField', host: {
2816
2811
  class: 'granite-input-field',
2817
- }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-invalid]=\"invalid\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-container *ngIf=\"!_passwordField\">\n <ng-content select=\"[graniteInputSuffixButton]\"></ng-content>\n </ng-container>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (keyup)=\"_onKeyUp($event)\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-medium)}.granite-input-container .granite-input-top-row:hover:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-hard)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-invalid:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-8);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-signal-failure),inset .125rem 0 var(--granite-color-signal-failure),inset -.125rem 0 var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-8);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-8);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}:host ::ng-deep button[graniteInputSuffixButton]{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative;margin:0;border-radius:0}\n"] }]
2812
+ }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"_supported\"\n class=\"granite-input-container\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n>\n <div\n class=\"granite-input-top-row\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n [class.granite-input-disabled]=\"disabled\"\n [class.granite-input-readonly]=\"readonly\"\n [class.granite-input-invalid]=\"invalid\"\n >\n <div\n *ngIf=\"prefixicon\"\n class=\"granite-input-prepend\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n >\n <granite-icon class=\"granite-input-prepend-icon\">\n {{ prefixicon }}\n </granite-icon>\n </div>\n\n <ng-container\n *ngIf=\"type !== 'textarea'; then inputElement; else textareaElement\"\n ></ng-container>\n\n <ng-template #inputElement>\n <input\n #input\n [id]=\"id\"\n class=\"granite-input-base\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-invalid]=\"invalid\"\n (input)=\"_onInput($event)\"\n />\n </ng-template>\n\n <button\n *ngIf=\"_passwordField\"\n class=\"granite-input-append\"\n [class.granite-input-required]=\"required\"\n [class.granite-input-empty]=\"_empty\"\n (click)=\"_togglePassword()\"\n >\n <granite-icon class=\"granite-input-password-toggle-icon\">\n {{ _passwordFieldIcon }}\n </granite-icon>\n </button>\n\n <ng-container *ngIf=\"!_passwordField\">\n <ng-content select=\"[graniteInputSuffixButton]\"></ng-content>\n </ng-container>\n\n <ng-template #textareaElement>\n <textarea\n #textarea\n [id]=\"id\"\n class=\"granite-input-base granite-text-area\"\n [class.granite-input-invalid]=\"invalid\"\n [class.granite-input-empty]=\"_empty\"\n rows=\"1\"\n [name]=\"name\"\n [attr.type]=\"type\"\n [required]=\"required\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [placeholder]=\"placeholder\"\n [value]=\"value\"\n [attr.maxlength]=\"maxlength\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-required]=\"required\"\n [attr.aria-invalid]=\"invalid\"\n (input)=\"_onInput($event)\"\n ></textarea>\n </ng-template>\n </div>\n\n <div *ngIf=\"countcharacters\" class=\"granite-input-bottom-row\">\n <div class=\"granite-input-char-count\">\n {{ _currentCharCount }}/{{ maxlength }}\n </div>\n </div>\n</div>\n", styles: [":host{transition:all .2s ease-out;width:14.5rem;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}.granite-input-container{width:inherit;font-size:var(--granite-font-size-body-small)}.granite-input-container .granite-input-top-row{display:inline-flex;width:inherit;position:relative;background:var(--granite-color-background)}.granite-input-container .granite-input-top-row:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-medium)}.granite-input-container .granite-input-top-row:hover:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-border-hard)}.granite-input-container .granite-input-top-row .granite-text-area{min-width:14.5rem;min-height:2rem}.granite-input-container .granite-input-top-row.granite-input-disabled,.granite-input-container .granite-input-top-row.granite-input-readonly{background-color:transparent;box-shadow:none}.granite-input-container .granite-input-top-row.granite-input-invalid:not(:focus-within){outline:var(--granite-border-width-regular) solid var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);padding:var(--granite-spacing-8);width:inherit;color:var(--granite-color-text);font:inherit;font-weight:var(--granite-font-weight-regular);line-height:var(--granite-line-height-regular)}.granite-input-container .granite-input-top-row .granite-input-base::placeholder{color:var(--granite-color-text-hint)}.granite-input-container .granite-input-top-row .granite-input-base:required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-top-row .granite-input-base:required::placeholder{color:var(--granite-color-text-weak)}.granite-input-container .granite-input-top-row .granite-input-base:read-only{background-color:transparent}.granite-input-container .granite-input-top-row .granite-input-base:disabled{opacity:.3}.granite-input-container .granite-input-top-row .granite-input-base:hover::placeholder{color:var(--granite-color-text)}.granite-input-container .granite-input-top-row .granite-input-base:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-top-row .granite-input-base:focus.granite-input-invalid{box-shadow:inset 0 -.125rem var(--granite-color-signal-failure),inset 0 .125rem var(--granite-color-signal-failure),inset .125rem 0 var(--granite-color-signal-failure),inset -.125rem 0 var(--granite-color-signal-failure)}.granite-input-container .granite-input-top-row .granite-input-base:focus::placeholder{color:transparent}.granite-input-container .granite-input-prepend{display:flex;align-items:center;padding:0 var(--granite-spacing-8);background:var(--granite-color-background-input)}.granite-input-container .granite-input-prepend .granite-input-prepend-icon{width:1rem;height:1rem;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-prepend.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-append{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative}.granite-input-container .granite-input-append:focus{box-shadow:inset 0 .125rem var(--granite-color-focus),inset .125rem 0 var(--granite-color-focus),inset -.125rem 0 var(--granite-color-focus),inset 0 -.125rem var(--granite-color-focus)}.granite-input-container .granite-input-append .granite-input-password-toggle-icon{width:max-content;height:max-content;color:var(--granite-color-text);box-shadow:none}.granite-input-container .granite-input-append.granite-input-required.granite-input-empty{background-color:var(--granite-color-background-failure)}.granite-input-container .granite-input-bottom-row{box-shadow:none}.granite-input-container .granite-input-char-count{background:var(--granite-color-background-warning);border-radius:0 0 .25rem .25rem;padding:var(--granite-spacing-8);background-size:contain;width:-moz-fit-content;width:fit-content;box-shadow:none}.granite-input-container.granite-input-disabled,.granite-input-container.granite-input-readonly{background-color:transparent}:host ::ng-deep button[graniteInputSuffixButton]{appearance:none;outline:none;border:none;background-color:var(--granite-color-background-input);position:relative;margin:0;border-radius:0}\n"] }]
2818
2813
  }], ctorParameters: () => [{ type: i1.FocusMonitor }], propDecorators: { id: [{
2819
2814
  type: Input
2820
2815
  }], name: [{