@skyux/code-examples 13.0.0-alpha.2 → 13.0.0-alpha.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/skyux-code-examples.mjs +26 -26
- package/fesm2022/skyux-code-examples.mjs.map +1 -1
- package/index.d.ts +1 -1
- package/package.json +33 -33
|
@@ -1088,7 +1088,7 @@ let FilterModalComponent$4 = class FilterModalComponent {
|
|
|
1088
1088
|
this.#instance.cancel();
|
|
1089
1089
|
}
|
|
1090
1090
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1091
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter employees\">\n <sky-modal-content>\n <label [for]=\"jobTitleInput.id\">Job Title</label>\n <select\n #jobTitleInput\n class=\"sky-form-control\"\n skyId=\"jobTitleInput\"\n [(ngModel)]=\"jobTitle\"\n >\n <option value=\"any\">Any job title</option>\n <option value=\"Product Manager\">Product Manager</option>\n <option value=\"Software Engineer\">Software Engineer</option>\n </select>\n <div class=\"sky-margin-stacked-lg\">\n <sky-checkbox labelText=\"Hide Sales employees\" [(ngModel)]=\"hideSales\" />\n </div>\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply filters\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear all filters\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
1091
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter employees\">\n <sky-modal-content>\n <label [for]=\"jobTitleInput.id\">Job Title</label>\n <select\n #jobTitleInput\n class=\"sky-form-control\"\n skyId=\"jobTitleInput\"\n [(ngModel)]=\"jobTitle\"\n >\n <option value=\"any\">Any job title</option>\n <option value=\"Product Manager\">Product Manager</option>\n <option value=\"Software Engineer\">Software Engineer</option>\n </select>\n <div class=\"sky-margin-stacked-lg\">\n <sky-checkbox labelText=\"Hide Sales employees\" [(ngModel)]=\"hideSales\" />\n </div>\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply filters\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear all filters\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3$2.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3.λ3, selector: "sky-modal-footer" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1092
1092
|
};
|
|
1093
1093
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent$4, decorators: [{
|
|
1094
1094
|
type: Component,
|
|
@@ -2982,7 +2982,7 @@ let FilterModalComponent$3 = class FilterModalComponent {
|
|
|
2982
2982
|
this.#instance.cancel();
|
|
2983
2983
|
}
|
|
2984
2984
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2985
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter employees\">\n <sky-modal-content>\n <label [for]=\"jobTitleInput.id\">Job Title</label>\n <select\n #jobTitleInput\n class=\"sky-form-control\"\n skyId=\"jobTitleInput\"\n [(ngModel)]=\"jobTitle\"\n >\n <option value=\"any\">Any job title</option>\n <option value=\"Product Manager\">Product Manager</option>\n <option value=\"Software Engineer\">Software Engineer</option>\n </select>\n <div class=\"sky-margin-stacked-lg\">\n <sky-checkbox labelText=\"Hide Sales employees\" [(ngModel)]=\"hideSales\" />\n </div>\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply filters\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear all filters\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
2985
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter employees\">\n <sky-modal-content>\n <label [for]=\"jobTitleInput.id\">Job Title</label>\n <select\n #jobTitleInput\n class=\"sky-form-control\"\n skyId=\"jobTitleInput\"\n [(ngModel)]=\"jobTitle\"\n >\n <option value=\"any\">Any job title</option>\n <option value=\"Product Manager\">Product Manager</option>\n <option value=\"Software Engineer\">Software Engineer</option>\n </select>\n <div class=\"sky-margin-stacked-lg\">\n <sky-checkbox labelText=\"Hide Sales employees\" [(ngModel)]=\"hideSales\" />\n </div>\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply filters\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear all filters\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3$2.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3.λ3, selector: "sky-modal-footer" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2986
2986
|
};
|
|
2987
2987
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent$3, decorators: [{
|
|
2988
2988
|
type: Component,
|
|
@@ -3537,7 +3537,7 @@ let FilterModalComponent$2 = class FilterModalComponent {
|
|
|
3537
3537
|
this.#instance.cancel();
|
|
3538
3538
|
}
|
|
3539
3539
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3540
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter employees\">\n <sky-modal-content>\n <label [for]=\"jobTitleInput.id\">Job Title</label>\n <select\n #jobTitleInput\n class=\"sky-form-control\"\n skyId=\"jobTitleInput\"\n [(ngModel)]=\"jobTitle\"\n >\n <option value=\"any\">Any job title</option>\n <option value=\"Product Manager\">Product Manager</option>\n <option value=\"Software Engineer\">Software Engineer</option>\n </select>\n <div class=\"sky-margin-stacked-lg\">\n <sky-checkbox labelText=\"Hide Sales employees\" [(ngModel)]=\"hideSales\" />\n </div>\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply filters\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear all filters\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
3540
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter employees\">\n <sky-modal-content>\n <label [for]=\"jobTitleInput.id\">Job Title</label>\n <select\n #jobTitleInput\n class=\"sky-form-control\"\n skyId=\"jobTitleInput\"\n [(ngModel)]=\"jobTitle\"\n >\n <option value=\"any\">Any job title</option>\n <option value=\"Product Manager\">Product Manager</option>\n <option value=\"Software Engineer\">Software Engineer</option>\n </select>\n <div class=\"sky-margin-stacked-lg\">\n <sky-checkbox labelText=\"Hide Sales employees\" [(ngModel)]=\"hideSales\" />\n </div>\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply filters\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear all filters\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3$2.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3.λ3, selector: "sky-modal-footer" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3541
3541
|
};
|
|
3542
3542
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent$2, decorators: [{
|
|
3543
3543
|
type: Component,
|
|
@@ -5456,7 +5456,7 @@ let FilterModalComponent$1 = class FilterModalComponent {
|
|
|
5456
5456
|
this.#instance.cancel();
|
|
5457
5457
|
}
|
|
5458
5458
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5459
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter your fruit\">\n <sky-modal-content>\n <sky-input-box labelText=\"Fruit type\" stacked=\"true\">\n <select class=\"sky-form-control\" [(ngModel)]=\"fruitType\">\n <option value=\"any\">Any fruit</option>\n <option value=\"citrus\">Citrus</option>\n <option value=\"berry\">Berry</option>\n </select>\n </sky-input-box>\n <sky-checkbox labelText=\"Hide orange fruits\" [(ngModel)]=\"hideOrange\" />\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply filters\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear all filters\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
5459
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter your fruit\">\n <sky-modal-content>\n <sky-input-box labelText=\"Fruit type\" stacked=\"true\">\n <select class=\"sky-form-control\" [(ngModel)]=\"fruitType\">\n <option value=\"any\">Any fruit</option>\n <option value=\"citrus\">Citrus</option>\n <option value=\"berry\">Berry</option>\n </select>\n </sky-input-box>\n <sky-checkbox labelText=\"Hide orange fruits\" [(ngModel)]=\"hideOrange\" />\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply filters\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear all filters\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2$2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3.λ3, selector: "sky-modal-footer" }] }); }
|
|
5460
5460
|
};
|
|
5461
5461
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent$1, decorators: [{
|
|
5462
5462
|
type: Component,
|
|
@@ -6550,7 +6550,7 @@ class FormsCheckboxBasicExampleComponent {
|
|
|
6550
6550
|
console.log(this.formGroup.value);
|
|
6551
6551
|
}
|
|
6552
6552
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsCheckboxBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6553
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsCheckboxBasicExampleComponent, isStandalone: true, selector: "app-forms-checkbox-basic-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\n <sky-checkbox-group\n data-sky-id=\"checkbox-group\"\n headingText=\"Contact method\"\n headingStyle=\"5\"\n helpPopoverContent=\"We use your contact info to keep you informed on current events. We will not sell your information.\"\n hintText=\"Please select at least one phone-based method.\"\n [formGroup]=\"contactMethod\"\n [required]=\"true\"\n [stacked]=\"true\"\n >\n <sky-checkbox formControlName=\"email\" labelText=\"Email\" />\n <sky-checkbox formControlName=\"phone\" labelText=\"Phone\" />\n <sky-checkbox formControlName=\"text\" labelText=\"Text\" />\n @if (contactMethod.errors?.['emailOnly']) {\n <sky-form-error\n errorName=\"emailOnly\"\n errorText=\"Email cannot be the only contact method.\"\n />\n }\n </sky-checkbox-group>\n <sky-checkbox\n data-sky-id=\"single-checkbox\"\n formControlName=\"terms\"\n labelText=\"I agree to the terms and conditions\"\n [required]=\"true\"\n [stacked]=\"true\"\n />\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
6553
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsCheckboxBasicExampleComponent, isStandalone: true, selector: "app-forms-checkbox-basic-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\n <sky-checkbox-group\n data-sky-id=\"checkbox-group\"\n headingText=\"Contact method\"\n headingStyle=\"5\"\n helpPopoverContent=\"We use your contact info to keep you informed on current events. We will not sell your information.\"\n hintText=\"Please select at least one phone-based method.\"\n [formGroup]=\"contactMethod\"\n [required]=\"true\"\n [stacked]=\"true\"\n >\n <sky-checkbox formControlName=\"email\" labelText=\"Email\" />\n <sky-checkbox formControlName=\"phone\" labelText=\"Phone\" />\n <sky-checkbox formControlName=\"text\" labelText=\"Text\" />\n @if (contactMethod.errors?.['emailOnly']) {\n <sky-form-error\n errorName=\"emailOnly\"\n errorText=\"Email cannot be the only contact method.\"\n />\n }\n </sky-checkbox-group>\n <sky-checkbox\n data-sky-id=\"single-checkbox\"\n formControlName=\"terms\"\n labelText=\"I agree to the terms and conditions\"\n [required]=\"true\"\n [stacked]=\"true\"\n />\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "component", type: i2$2.λ24, selector: "sky-checkbox-group", inputs: ["helpPopoverContent", "helpPopoverTitle", "headingText", "headingHidden", "headingLevel", "headingStyle", "hintText", "required", "stacked", "helpKey"] }, { kind: "component", type: i2$2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }] }); }
|
|
6554
6554
|
}
|
|
6555
6555
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsCheckboxBasicExampleComponent, decorators: [{
|
|
6556
6556
|
type: Component,
|
|
@@ -6590,7 +6590,7 @@ class FormsCheckboxHelpKeyExampleComponent {
|
|
|
6590
6590
|
console.log(this.formGroup.value);
|
|
6591
6591
|
}
|
|
6592
6592
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsCheckboxHelpKeyExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6593
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsCheckboxHelpKeyExampleComponent, isStandalone: true, selector: "app-forms-checkbox-help-key-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\n <sky-checkbox-group\n data-sky-id=\"checkbox-group\"\n headingText=\"Contact method\"\n headingStyle=\"5\"\n helpKey=\"contact-help\"\n hintText=\"Please select at least one phone-based method.\"\n [formGroup]=\"contactMethod\"\n [required]=\"true\"\n [stacked]=\"true\"\n >\n <sky-checkbox formControlName=\"email\" labelText=\"Email\" />\n <sky-checkbox formControlName=\"phone\" labelText=\"Phone\" />\n <sky-checkbox formControlName=\"text\" labelText=\"Text\" />\n @if (contactMethod.errors?.['emailOnly']) {\n <sky-form-error\n errorName=\"emailOnly\"\n errorText=\"Email cannot be the only contact method.\"\n />\n }\n </sky-checkbox-group>\n <sky-checkbox\n data-sky-id=\"single-checkbox\"\n formControlName=\"terms\"\n helpKey=\"terms-help\"\n labelText=\"I agree to the terms and conditions\"\n [required]=\"true\"\n [stacked]=\"true\"\n />\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
6593
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsCheckboxHelpKeyExampleComponent, isStandalone: true, selector: "app-forms-checkbox-help-key-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\n <sky-checkbox-group\n data-sky-id=\"checkbox-group\"\n headingText=\"Contact method\"\n headingStyle=\"5\"\n helpKey=\"contact-help\"\n hintText=\"Please select at least one phone-based method.\"\n [formGroup]=\"contactMethod\"\n [required]=\"true\"\n [stacked]=\"true\"\n >\n <sky-checkbox formControlName=\"email\" labelText=\"Email\" />\n <sky-checkbox formControlName=\"phone\" labelText=\"Phone\" />\n <sky-checkbox formControlName=\"text\" labelText=\"Text\" />\n @if (contactMethod.errors?.['emailOnly']) {\n <sky-form-error\n errorName=\"emailOnly\"\n errorText=\"Email cannot be the only contact method.\"\n />\n }\n </sky-checkbox-group>\n <sky-checkbox\n data-sky-id=\"single-checkbox\"\n formControlName=\"terms\"\n helpKey=\"terms-help\"\n labelText=\"I agree to the terms and conditions\"\n [required]=\"true\"\n [stacked]=\"true\"\n />\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "component", type: i2$2.λ24, selector: "sky-checkbox-group", inputs: ["helpPopoverContent", "helpPopoverTitle", "headingText", "headingHidden", "headingLevel", "headingStyle", "hintText", "required", "stacked", "helpKey"] }, { kind: "component", type: i2$2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }] }); }
|
|
6594
6594
|
}
|
|
6595
6595
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsCheckboxHelpKeyExampleComponent, decorators: [{
|
|
6596
6596
|
type: Component,
|
|
@@ -6612,7 +6612,7 @@ class FormsCheckboxIconGroupExampleComponent {
|
|
|
6612
6612
|
console.log(this.formGroup.value);
|
|
6613
6613
|
}
|
|
6614
6614
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsCheckboxIconGroupExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6615
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FormsCheckboxIconGroupExampleComponent, isStandalone: true, selector: "app-forms-checkbox-icon-group-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\n <sky-checkbox-group\n headingText=\"Text formatting\"\n [formGroup]=\"formGroup\"\n [headingHidden]=\"true\"\n [stacked]=\"true\"\n >\n <sky-checkbox\n formControlName=\"bold\"\n iconName=\"text-bold\"\n labelHidden=\"true\"\n labelText=\"Bold\"\n />\n <sky-checkbox\n formControlName=\"italic\"\n iconName=\"text-italic\"\n labelHidden=\"true\"\n labelText=\"Italic\"\n />\n <sky-checkbox\n formControlName=\"underline\"\n iconName=\"text-underline\"\n labelHidden=\"true\"\n labelText=\"Underline\"\n />\n </sky-checkbox-group>\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
6615
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FormsCheckboxIconGroupExampleComponent, isStandalone: true, selector: "app-forms-checkbox-icon-group-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\n <sky-checkbox-group\n headingText=\"Text formatting\"\n [formGroup]=\"formGroup\"\n [headingHidden]=\"true\"\n [stacked]=\"true\"\n >\n <sky-checkbox\n formControlName=\"bold\"\n iconName=\"text-bold\"\n labelHidden=\"true\"\n labelText=\"Bold\"\n />\n <sky-checkbox\n formControlName=\"italic\"\n iconName=\"text-italic\"\n labelHidden=\"true\"\n labelText=\"Italic\"\n />\n <sky-checkbox\n formControlName=\"underline\"\n iconName=\"text-underline\"\n labelHidden=\"true\"\n labelText=\"Underline\"\n />\n </sky-checkbox-group>\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "component", type: i2$2.λ24, selector: "sky-checkbox-group", inputs: ["helpPopoverContent", "helpPopoverTitle", "headingText", "headingHidden", "headingLevel", "headingStyle", "hintText", "required", "stacked", "helpKey"] }] }); }
|
|
6616
6616
|
}
|
|
6617
6617
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsCheckboxIconGroupExampleComponent, decorators: [{
|
|
6618
6618
|
type: Component,
|
|
@@ -7071,7 +7071,7 @@ class FormsRadioHelpKeyExampleComponent {
|
|
|
7071
7071
|
});
|
|
7072
7072
|
}
|
|
7073
7073
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsRadioHelpKeyExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7074
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsRadioHelpKeyExampleComponent, isStandalone: true, selector: "app-forms-radio-help-key-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-radio-group\n data-sky-id=\"radio-group\"\n formControlName=\"paymentMethod\"\n headingLevel=\"4\"\n headingText=\"Payment method\"\n helpKey=\"payment-help\"\n [hintText]=\"hintText\"\n >\n @for (option of paymentOptions; track option) {\n <sky-radio\n [disabled]=\"option.disabled\"\n [value]=\"option.value\"\n [labelText]=\"option.name\"\n [helpKey]=\"option.helpKey\"\n [hintText]=\"option.hintText\"\n />\n }\n @if (paymentMethod.errors?.['processingIssue']) {\n <sky-form-error\n errorName=\"processingIssue\"\n errorText=\"An error occurred with this payment method. Please contact us to resolve.\"\n />\n }\n </sky-radio-group>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyRadioModule }, { kind: "component", type: i2$2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }, { kind: "component", type: i2$2.λ13, selector: "sky-radio", inputs: ["checked", "disabled", "id", "label", "labelledBy", "name", "tabindex", "value", "helpPopoverContent", "helpPopoverTitle", "
|
|
7074
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsRadioHelpKeyExampleComponent, isStandalone: true, selector: "app-forms-radio-help-key-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-radio-group\n data-sky-id=\"radio-group\"\n formControlName=\"paymentMethod\"\n headingLevel=\"4\"\n headingText=\"Payment method\"\n helpKey=\"payment-help\"\n [hintText]=\"hintText\"\n >\n @for (option of paymentOptions; track option) {\n <sky-radio\n [disabled]=\"option.disabled\"\n [value]=\"option.value\"\n [labelText]=\"option.name\"\n [helpKey]=\"option.helpKey\"\n [hintText]=\"option.hintText\"\n />\n }\n @if (paymentMethod.errors?.['processingIssue']) {\n <sky-form-error\n errorName=\"processingIssue\"\n errorText=\"An error occurred with this payment method. Please contact us to resolve.\"\n />\n }\n </sky-radio-group>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyRadioModule }, { kind: "component", type: i2$2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }, { kind: "component", type: i2$2.λ13, selector: "sky-radio", inputs: ["checked", "disabled", "id", "label", "labelledBy", "name", "tabindex", "value", "helpPopoverContent", "helpPopoverTitle", "iconName", "radioType", "labelText", "labelHidden", "hintText", "helpKey"], outputs: ["change", "checkedChange", "disabledChange"] }, { kind: "component", type: i2$2.λ11, selector: "sky-radio-group", inputs: ["ariaLabelledBy", "ariaLabel", "disabled", "headingLevel", "headingStyle", "name", "required", "stacked", "value", "tabIndex", "headingText", "headingHidden", "hintText", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }] }); }
|
|
7075
7075
|
}
|
|
7076
7076
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsRadioHelpKeyExampleComponent, decorators: [{
|
|
7077
7077
|
type: Component,
|
|
@@ -7084,20 +7084,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
|
|
|
7084
7084
|
class FormsRadioIconExampleComponent {
|
|
7085
7085
|
constructor() {
|
|
7086
7086
|
this.views = [
|
|
7087
|
-
{
|
|
7088
|
-
{
|
|
7089
|
-
{
|
|
7087
|
+
{ iconName: 'table', label: 'Table', name: 'table' },
|
|
7088
|
+
{ iconName: 'text-number-list-ltr', label: 'List', name: 'list' },
|
|
7089
|
+
{ iconName: 'location', label: 'Map', name: 'map' },
|
|
7090
7090
|
];
|
|
7091
7091
|
this.formGroup = inject(FormBuilder).group({
|
|
7092
7092
|
myView: this.views[0].name,
|
|
7093
7093
|
});
|
|
7094
7094
|
}
|
|
7095
7095
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsRadioIconExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7096
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsRadioIconExampleComponent, isStandalone: true, selector: "app-forms-radio-icon-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-radio-group\n class=\"sky-switch-icon-group\"\n formControlName=\"myView\"\n headingHidden=\"true\"\n headingText=\"View\"\n >\n @for (view of views; track view) {\n <sky-radio\n [labelHidden]=\"true\"\n [iconName]=\"view.
|
|
7096
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsRadioIconExampleComponent, isStandalone: true, selector: "app-forms-radio-icon-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-radio-group\n class=\"sky-switch-icon-group\"\n formControlName=\"myView\"\n headingHidden=\"true\"\n headingText=\"View\"\n >\n @for (view of views; track view) {\n <sky-radio\n [labelHidden]=\"true\"\n [iconName]=\"view.iconName\"\n [labelText]=\"view.label\"\n [value]=\"view.name\"\n />\n }\n </sky-radio-group>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyRadioModule }, { kind: "component", type: i2$2.λ13, selector: "sky-radio", inputs: ["checked", "disabled", "id", "label", "labelledBy", "name", "tabindex", "value", "helpPopoverContent", "helpPopoverTitle", "iconName", "radioType", "labelText", "labelHidden", "hintText", "helpKey"], outputs: ["change", "checkedChange", "disabledChange"] }, { kind: "component", type: i2$2.λ11, selector: "sky-radio-group", inputs: ["ariaLabelledBy", "ariaLabel", "disabled", "headingLevel", "headingStyle", "name", "required", "stacked", "value", "tabIndex", "headingText", "headingHidden", "hintText", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }] }); }
|
|
7097
7097
|
}
|
|
7098
7098
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsRadioIconExampleComponent, decorators: [{
|
|
7099
7099
|
type: Component,
|
|
7100
|
-
args: [{ selector: 'app-forms-radio-icon-example', imports: [FormsModule, ReactiveFormsModule, SkyRadioModule], template: "<form [formGroup]=\"formGroup\">\n <sky-radio-group\n class=\"sky-switch-icon-group\"\n formControlName=\"myView\"\n headingHidden=\"true\"\n headingText=\"View\"\n >\n @for (view of views; track view) {\n <sky-radio\n [labelHidden]=\"true\"\n [iconName]=\"view.
|
|
7100
|
+
args: [{ selector: 'app-forms-radio-icon-example', imports: [FormsModule, ReactiveFormsModule, SkyRadioModule], template: "<form [formGroup]=\"formGroup\">\n <sky-radio-group\n class=\"sky-switch-icon-group\"\n formControlName=\"myView\"\n headingHidden=\"true\"\n headingText=\"View\"\n >\n @for (view of views; track view) {\n <sky-radio\n [labelHidden]=\"true\"\n [iconName]=\"view.iconName\"\n [labelText]=\"view.label\"\n [value]=\"view.name\"\n />\n }\n </sky-radio-group>\n</form>\n" }]
|
|
7101
7101
|
}], ctorParameters: () => [] });
|
|
7102
7102
|
|
|
7103
7103
|
function validatePaymentMethod(control) {
|
|
@@ -7136,7 +7136,7 @@ class FormsRadioStandardExampleComponent {
|
|
|
7136
7136
|
});
|
|
7137
7137
|
}
|
|
7138
7138
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsRadioStandardExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7139
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsRadioStandardExampleComponent, isStandalone: true, selector: "app-forms-radio-standard-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-radio-group\n data-sky-id=\"radio-group\"\n formControlName=\"paymentMethod\"\n headingLevel=\"4\"\n headingText=\"Payment method\"\n [helpPopoverContent]=\"helpPopoverContent\"\n [helpPopoverTitle]=\"helpPopoverTitle\"\n [hintText]=\"hintText\"\n >\n @for (option of paymentOptions; track option) {\n <sky-radio\n [disabled]=\"option.disabled\"\n [value]=\"option.value\"\n [labelText]=\"option.name\"\n [helpPopoverContent]=\"option.helpContent\"\n [hintText]=\"option.hintText\"\n />\n }\n @if (paymentMethod.errors?.['processingIssue']) {\n <sky-form-error\n errorName=\"processingIssue\"\n errorText=\"An error occurred with this payment method. Please contact us to resolve.\"\n />\n }\n </sky-radio-group>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyRadioModule }, { kind: "component", type: i2$2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }, { kind: "component", type: i2$2.λ13, selector: "sky-radio", inputs: ["checked", "disabled", "id", "label", "labelledBy", "name", "tabindex", "value", "helpPopoverContent", "helpPopoverTitle", "
|
|
7139
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsRadioStandardExampleComponent, isStandalone: true, selector: "app-forms-radio-standard-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-radio-group\n data-sky-id=\"radio-group\"\n formControlName=\"paymentMethod\"\n headingLevel=\"4\"\n headingText=\"Payment method\"\n [helpPopoverContent]=\"helpPopoverContent\"\n [helpPopoverTitle]=\"helpPopoverTitle\"\n [hintText]=\"hintText\"\n >\n @for (option of paymentOptions; track option) {\n <sky-radio\n [disabled]=\"option.disabled\"\n [value]=\"option.value\"\n [labelText]=\"option.name\"\n [helpPopoverContent]=\"option.helpContent\"\n [hintText]=\"option.hintText\"\n />\n }\n @if (paymentMethod.errors?.['processingIssue']) {\n <sky-form-error\n errorName=\"processingIssue\"\n errorText=\"An error occurred with this payment method. Please contact us to resolve.\"\n />\n }\n </sky-radio-group>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyRadioModule }, { kind: "component", type: i2$2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }, { kind: "component", type: i2$2.λ13, selector: "sky-radio", inputs: ["checked", "disabled", "id", "label", "labelledBy", "name", "tabindex", "value", "helpPopoverContent", "helpPopoverTitle", "iconName", "radioType", "labelText", "labelHidden", "hintText", "helpKey"], outputs: ["change", "checkedChange", "disabledChange"] }, { kind: "component", type: i2$2.λ11, selector: "sky-radio-group", inputs: ["ariaLabelledBy", "ariaLabel", "disabled", "headingLevel", "headingStyle", "name", "required", "stacked", "value", "tabIndex", "headingText", "headingHidden", "hintText", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }] }); }
|
|
7140
7140
|
}
|
|
7141
7141
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsRadioStandardExampleComponent, decorators: [{
|
|
7142
7142
|
type: Component,
|
|
@@ -7178,7 +7178,7 @@ class FormsSelectionBoxCheckboxExampleComponent {
|
|
|
7178
7178
|
return this.#formBuilder.array(checkboxArray);
|
|
7179
7179
|
}
|
|
7180
7180
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsSelectionBoxCheckboxExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7181
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsSelectionBoxCheckboxExampleComponent, isStandalone: true, selector: "app-forms-selection-box-checkbox-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-selection-box-grid>\n @for (control of checkboxControls; track control; let i = $index) {\n <sky-selection-box [control]=\"checkbox\">\n <sky-icon [iconName]=\"selectionBoxes[i].icon\" />\n <sky-selection-box-header #checkboxHeaderId=\"skyId\" skyId>\n {{ selectionBoxes[i].name }}\n </sky-selection-box-header>\n <sky-selection-box-description>\n {{ selectionBoxes[i].description }}\n </sky-selection-box-description>\n <sky-checkbox\n #checkbox\n [formControl]=\"control\"\n [labelledBy]=\"checkboxHeaderId.id\"\n />\n </sky-selection-box>\n }\n </sky-selection-box-grid>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
7181
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsSelectionBoxCheckboxExampleComponent, isStandalone: true, selector: "app-forms-selection-box-checkbox-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <sky-selection-box-grid>\n @for (control of checkboxControls; track control; let i = $index) {\n <sky-selection-box [control]=\"checkbox\">\n <sky-icon [iconName]=\"selectionBoxes[i].icon\" />\n <sky-selection-box-header #checkboxHeaderId=\"skyId\" skyId>\n {{ selectionBoxes[i].name }}\n </sky-selection-box-header>\n <sky-selection-box-description>\n {{ selectionBoxes[i].description }}\n </sky-selection-box-description>\n <sky-checkbox\n #checkbox\n [formControl]=\"control\"\n [labelledBy]=\"checkboxHeaderId.id\"\n />\n </sky-selection-box>\n }\n </sky-selection-box-grid>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$9.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3$2.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkySelectionBoxModule }, { kind: "component", type: i2$2.λ15, selector: "sky-selection-box-grid", inputs: ["alignItems"] }, { kind: "component", type: i2$2.λ17, selector: "sky-selection-box", inputs: ["control"] }, { kind: "component", type: i2$2.λ14, selector: "sky-selection-box-description" }, { kind: "component", type: i2$2.λ16, selector: "sky-selection-box-header" }] }); }
|
|
7182
7182
|
}
|
|
7183
7183
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsSelectionBoxCheckboxExampleComponent, decorators: [{
|
|
7184
7184
|
type: Component,
|
|
@@ -7222,7 +7222,7 @@ class FormsSelectionBoxRadioExampleComponent {
|
|
|
7222
7222
|
});
|
|
7223
7223
|
}
|
|
7224
7224
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsSelectionBoxRadioExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7225
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsSelectionBoxRadioExampleComponent, isStandalone: true, selector: "app-forms-selection-box-radio-example", ngImport: i0, template: "<form novalidate [formGroup]=\"formGroup\">\n <sky-radio-group ariaLabel=\"Demo options\" formControlName=\"myOption\">\n <sky-selection-box-grid>\n @for (item of items; track item) {\n <sky-selection-box [control]=\"radio\">\n <sky-icon [iconName]=\"item['icon']\" />\n <sky-selection-box-header #radioHeaderId=\"skyId\" skyId>\n {{ item['name'] }}\n </sky-selection-box-header>\n <sky-selection-box-description>\n {{ item['description'] }}\n </sky-selection-box-description>\n <sky-radio\n #radio\n [labelledBy]=\"radioHeaderId.id\"\n [value]=\"item['value']\"\n />\n </sky-selection-box>\n }\n </sky-selection-box-grid>\n </sky-radio-group>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$9.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3$2.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyRadioModule }, { kind: "component", type: i2$2.λ13, selector: "sky-radio", inputs: ["checked", "disabled", "id", "label", "labelledBy", "name", "tabindex", "value", "helpPopoverContent", "helpPopoverTitle", "
|
|
7225
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FormsSelectionBoxRadioExampleComponent, isStandalone: true, selector: "app-forms-selection-box-radio-example", ngImport: i0, template: "<form novalidate [formGroup]=\"formGroup\">\n <sky-radio-group ariaLabel=\"Demo options\" formControlName=\"myOption\">\n <sky-selection-box-grid>\n @for (item of items; track item) {\n <sky-selection-box [control]=\"radio\">\n <sky-icon [iconName]=\"item['icon']\" />\n <sky-selection-box-header #radioHeaderId=\"skyId\" skyId>\n {{ item['name'] }}\n </sky-selection-box-header>\n <sky-selection-box-description>\n {{ item['description'] }}\n </sky-selection-box-description>\n <sky-radio\n #radio\n [labelledBy]=\"radioHeaderId.id\"\n [value]=\"item['value']\"\n />\n </sky-selection-box>\n }\n </sky-selection-box-grid>\n </sky-radio-group>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$9.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3$2.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyRadioModule }, { kind: "component", type: i2$2.λ13, selector: "sky-radio", inputs: ["checked", "disabled", "id", "label", "labelledBy", "name", "tabindex", "value", "helpPopoverContent", "helpPopoverTitle", "iconName", "radioType", "labelText", "labelHidden", "hintText", "helpKey"], outputs: ["change", "checkedChange", "disabledChange"] }, { kind: "component", type: i2$2.λ11, selector: "sky-radio-group", inputs: ["ariaLabelledBy", "ariaLabel", "disabled", "headingLevel", "headingStyle", "name", "required", "stacked", "value", "tabIndex", "headingText", "headingHidden", "hintText", "helpPopoverContent", "helpPopoverTitle", "helpKey"] }, { kind: "ngmodule", type: SkySelectionBoxModule }, { kind: "component", type: i2$2.λ15, selector: "sky-selection-box-grid", inputs: ["alignItems"] }, { kind: "component", type: i2$2.λ17, selector: "sky-selection-box", inputs: ["control"] }, { kind: "component", type: i2$2.λ14, selector: "sky-selection-box-description" }, { kind: "component", type: i2$2.λ16, selector: "sky-selection-box-header" }] }); }
|
|
7226
7226
|
}
|
|
7227
7227
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FormsSelectionBoxRadioExampleComponent, decorators: [{
|
|
7228
7228
|
type: Component,
|
|
@@ -7520,7 +7520,7 @@ class IndicatorsTextHighlightBasicExampleComponent {
|
|
|
7520
7520
|
this.showAdditionalContent = false;
|
|
7521
7521
|
}
|
|
7522
7522
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: IndicatorsTextHighlightBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7523
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: IndicatorsTextHighlightBasicExampleComponent, isStandalone: true, selector: "app-indicators-text-highlight-basic-example", ngImport: i0, template: "<div class=\"sky-margin-stacked-lg\">\n <sky-input-box labelText=\"Text to highlight\" [stacked]=\"true\">\n <input type=\"text\" [(ngModel)]=\"searchTerm\" />\n </sky-input-box>\n</div>\n\n<div class=\"sky-margin-stacked-lg\">\n <sky-checkbox\n labelText=\"Display additional content\"\n [(ngModel)]=\"showAdditionalContent\"\n />\n</div>\n\n<div [skyHighlight]=\"searchTerm\">\n The text that you enter is highlighted here.\n @if (showAdditionalContent) {\n <div>This additional content is highlighted too!</div>\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
7523
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: IndicatorsTextHighlightBasicExampleComponent, isStandalone: true, selector: "app-indicators-text-highlight-basic-example", ngImport: i0, template: "<div class=\"sky-margin-stacked-lg\">\n <sky-input-box labelText=\"Text to highlight\" [stacked]=\"true\">\n <input type=\"text\" [(ngModel)]=\"searchTerm\" />\n </sky-input-box>\n</div>\n\n<div class=\"sky-margin-stacked-lg\">\n <sky-checkbox\n labelText=\"Display additional content\"\n [(ngModel)]=\"showAdditionalContent\"\n />\n</div>\n\n<div [skyHighlight]=\"searchTerm\">\n The text that you enter is highlighted here.\n @if (showAdditionalContent) {\n <div>This additional content is highlighted too!</div>\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2$2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2$2.λ20, selector: "input:not([skyId]):not(.sky-form-control),select:not([skyId]):not(.sky-form-control),textarea:not([skyId]):not(.sky-form-control)", inputs: ["autocomplete"] }, { kind: "ngmodule", type: SkyTextHighlightModule }, { kind: "directive", type: i1.SkyTextHighlightDirective, selector: "[skyHighlight]", inputs: ["skyHighlight"] }] }); }
|
|
7524
7524
|
}
|
|
7525
7525
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: IndicatorsTextHighlightBasicExampleComponent, decorators: [{
|
|
7526
7526
|
type: Component,
|
|
@@ -7883,7 +7883,7 @@ class LayoutActionButtonBasicExampleComponent {
|
|
|
7883
7883
|
alert('Open action clicked');
|
|
7884
7884
|
}
|
|
7885
7885
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LayoutActionButtonBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7886
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: LayoutActionButtonBasicExampleComponent, isStandalone: true, selector: "app-layout-action-button-basic-example", ngImport: i0, template: "<sky-action-button-container>\n <sky-action-button (actionClick)=\"filterActionClick()\">\n <sky-action-button-icon iconName=\"filter\" />\n <sky-action-button-header> Build a new list </sky-action-button-header>\n <sky-action-button-details>\n Start from scratch and fine-tune with filters.\n </sky-action-button-details>\n </sky-action-button>\n\n <sky-action-button (actionClick)=\"openActionClick()\">\n <sky-action-button-icon iconName=\"folder-open\" />\n <sky-action-button-header> Open a saved list </sky-action-button-header>\n <sky-action-button-details>\n Open a list with filters saved in the web view.\n </sky-action-button-details>\n </sky-action-button>\n</sky-action-button-container>\n", dependencies: [{ kind: "ngmodule", type: SkyActionButtonModule }, { kind: "component", type: i1$5.λ1, selector: "sky-action-button", inputs: ["permalink"], outputs: ["actionClick"] }, { kind: "component", type: i1$5.λ2, selector: "sky-action-button-container", inputs: ["alignItems"] }, { kind: "component", type: i1$5.λ3, selector: "sky-action-button-details" }, { kind: "component", type: i1$5.λ4, selector: "sky-action-button-header" }, { kind: "component", type: i1$5.λ5, selector: "sky-action-button-icon", inputs: ["
|
|
7886
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: LayoutActionButtonBasicExampleComponent, isStandalone: true, selector: "app-layout-action-button-basic-example", ngImport: i0, template: "<sky-action-button-container>\n <sky-action-button (actionClick)=\"filterActionClick()\">\n <sky-action-button-icon iconName=\"filter\" />\n <sky-action-button-header> Build a new list </sky-action-button-header>\n <sky-action-button-details>\n Start from scratch and fine-tune with filters.\n </sky-action-button-details>\n </sky-action-button>\n\n <sky-action-button (actionClick)=\"openActionClick()\">\n <sky-action-button-icon iconName=\"folder-open\" />\n <sky-action-button-header> Open a saved list </sky-action-button-header>\n <sky-action-button-details>\n Open a list with filters saved in the web view.\n </sky-action-button-details>\n </sky-action-button>\n</sky-action-button-container>\n", dependencies: [{ kind: "ngmodule", type: SkyActionButtonModule }, { kind: "component", type: i1$5.λ1, selector: "sky-action-button", inputs: ["permalink"], outputs: ["actionClick"] }, { kind: "component", type: i1$5.λ2, selector: "sky-action-button-container", inputs: ["alignItems"] }, { kind: "component", type: i1$5.λ3, selector: "sky-action-button-details" }, { kind: "component", type: i1$5.λ4, selector: "sky-action-button-header" }, { kind: "component", type: i1$5.λ5, selector: "sky-action-button-icon", inputs: ["iconName"] }] }); }
|
|
7887
7887
|
}
|
|
7888
7888
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LayoutActionButtonBasicExampleComponent, decorators: [{
|
|
7889
7889
|
type: Component,
|
|
@@ -7910,7 +7910,7 @@ class LayoutActionButtonPermalinkExampleComponent {
|
|
|
7910
7910
|
};
|
|
7911
7911
|
}
|
|
7912
7912
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LayoutActionButtonPermalinkExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7913
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: LayoutActionButtonPermalinkExampleComponent, isStandalone: true, selector: "app-layout-action-button-permalink-example", ngImport: i0, template: "<sky-action-button-container>\n <sky-action-button [permalink]=\"url\">\n <sky-action-button-icon iconName=\"link\" />\n <sky-action-button-header> Open a link </sky-action-button-header>\n <sky-action-button-details> Open a link. </sky-action-button-details>\n </sky-action-button>\n\n <sky-action-button [permalink]=\"routerlink\">\n <sky-action-button-icon iconName=\"link\" />\n <sky-action-button-header> Open a router link </sky-action-button-header>\n <sky-action-button-details> Open a router link. </sky-action-button-details>\n </sky-action-button>\n</sky-action-button-container>\n", dependencies: [{ kind: "ngmodule", type: SkyActionButtonModule }, { kind: "component", type: i1$5.λ1, selector: "sky-action-button", inputs: ["permalink"], outputs: ["actionClick"] }, { kind: "component", type: i1$5.λ2, selector: "sky-action-button-container", inputs: ["alignItems"] }, { kind: "component", type: i1$5.λ3, selector: "sky-action-button-details" }, { kind: "component", type: i1$5.λ4, selector: "sky-action-button-header" }, { kind: "component", type: i1$5.λ5, selector: "sky-action-button-icon", inputs: ["
|
|
7913
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: LayoutActionButtonPermalinkExampleComponent, isStandalone: true, selector: "app-layout-action-button-permalink-example", ngImport: i0, template: "<sky-action-button-container>\n <sky-action-button [permalink]=\"url\">\n <sky-action-button-icon iconName=\"link\" />\n <sky-action-button-header> Open a link </sky-action-button-header>\n <sky-action-button-details> Open a link. </sky-action-button-details>\n </sky-action-button>\n\n <sky-action-button [permalink]=\"routerlink\">\n <sky-action-button-icon iconName=\"link\" />\n <sky-action-button-header> Open a router link </sky-action-button-header>\n <sky-action-button-details> Open a router link. </sky-action-button-details>\n </sky-action-button>\n</sky-action-button-container>\n", dependencies: [{ kind: "ngmodule", type: SkyActionButtonModule }, { kind: "component", type: i1$5.λ1, selector: "sky-action-button", inputs: ["permalink"], outputs: ["actionClick"] }, { kind: "component", type: i1$5.λ2, selector: "sky-action-button-container", inputs: ["alignItems"] }, { kind: "component", type: i1$5.λ3, selector: "sky-action-button-details" }, { kind: "component", type: i1$5.λ4, selector: "sky-action-button-header" }, { kind: "component", type: i1$5.λ5, selector: "sky-action-button-icon", inputs: ["iconName"] }] }); }
|
|
7914
7914
|
}
|
|
7915
7915
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LayoutActionButtonPermalinkExampleComponent, decorators: [{
|
|
7916
7916
|
type: Component,
|
|
@@ -8231,7 +8231,7 @@ class LayoutCardBasicExampleComponent {
|
|
|
8231
8231
|
alert('Action clicked!');
|
|
8232
8232
|
}
|
|
8233
8233
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LayoutCardBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8234
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: LayoutCardBasicExampleComponent, isStandalone: true, selector: "app-layout-card-basic-example", ngImport: i0, template: "<sky-card [selectable]=\"showCheckbox\">\n @if (showTitle) {\n <sky-card-title> Large card </sky-card-title>\n }\n @if (showContent) {\n <sky-card-content>\n This card examplenstrates the amount of space that is available for a card\n that uses the default large size. If the content does not require this\n much space, you can set the card size to small. The type of content to\n display in the body of a card varies based on what the card represents and\n whether it prompts users to action.\n </sky-card-content>\n }\n @if (showAction) {\n <sky-card-actions>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"triggerAlert()\"\n >\n Action\n </button>\n </sky-card-actions>\n }\n</sky-card>\n<sky-card size=\"small\" [selectable]=\"showCheckbox\">\n @if (showTitle) {\n <sky-card-title> Small card </sky-card-title>\n }\n @if (showContent) {\n <sky-card-content>\n This card examplenstrates the reduced amount of space that is available\n when you set the card size to small.\n </sky-card-content>\n }\n @if (showAction) {\n <sky-card-actions>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button type=\"button\" (click)=\"triggerAlert()\">Action</button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-card-actions>\n }\n</sky-card>\n\n<ul class=\"sky-list-unstyled\">\n <li>\n <sky-checkbox labelText=\"Show title\" [(ngModel)]=\"showTitle\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show content\" [(ngModel)]=\"showContent\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show action\" [(ngModel)]=\"showAction\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show checkbox\" [(ngModel)]=\"showCheckbox\" />\n </li>\n</ul>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCardModule }, { kind: "component", type: i1$5.λ10, selector: "sky-card-actions" }, { kind: "component", type: i1$5.λ9, selector: "sky-card", inputs: ["size", "selectable", "selected"], outputs: ["selectedChange"] }, { kind: "component", type: i1$5.λ11, selector: "sky-card-content" }, { kind: "component", type: i1$5.λ12, selector: "sky-card-title" }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
8234
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: LayoutCardBasicExampleComponent, isStandalone: true, selector: "app-layout-card-basic-example", ngImport: i0, template: "<sky-card [selectable]=\"showCheckbox\">\n @if (showTitle) {\n <sky-card-title> Large card </sky-card-title>\n }\n @if (showContent) {\n <sky-card-content>\n This card examplenstrates the amount of space that is available for a card\n that uses the default large size. If the content does not require this\n much space, you can set the card size to small. The type of content to\n display in the body of a card varies based on what the card represents and\n whether it prompts users to action.\n </sky-card-content>\n }\n @if (showAction) {\n <sky-card-actions>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"triggerAlert()\"\n >\n Action\n </button>\n </sky-card-actions>\n }\n</sky-card>\n<sky-card size=\"small\" [selectable]=\"showCheckbox\">\n @if (showTitle) {\n <sky-card-title> Small card </sky-card-title>\n }\n @if (showContent) {\n <sky-card-content>\n This card examplenstrates the reduced amount of space that is available\n when you set the card size to small.\n </sky-card-content>\n }\n @if (showAction) {\n <sky-card-actions>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button type=\"button\" (click)=\"triggerAlert()\">Action</button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-card-actions>\n }\n</sky-card>\n\n<ul class=\"sky-list-unstyled\">\n <li>\n <sky-checkbox labelText=\"Show title\" [(ngModel)]=\"showTitle\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show content\" [(ngModel)]=\"showContent\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show action\" [(ngModel)]=\"showAction\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show checkbox\" [(ngModel)]=\"showCheckbox\" />\n </li>\n</ul>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCardModule }, { kind: "component", type: i1$5.λ10, selector: "sky-card-actions" }, { kind: "component", type: i1$5.λ9, selector: "sky-card", inputs: ["size", "selectable", "selected"], outputs: ["selectedChange"] }, { kind: "component", type: i1$5.λ11, selector: "sky-card-content" }, { kind: "component", type: i1$5.λ12, selector: "sky-card-title" }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyDropdownModule }, { kind: "component", type: i1$3.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i1$3.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i1$3.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }] }); }
|
|
8235
8235
|
}
|
|
8236
8236
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LayoutCardBasicExampleComponent, decorators: [{
|
|
8237
8237
|
type: Component,
|
|
@@ -8554,7 +8554,7 @@ class LayoutPageSummaryBasicExampleComponent {
|
|
|
8554
8554
|
this.showTitle = true;
|
|
8555
8555
|
}
|
|
8556
8556
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LayoutPageSummaryBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8557
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: LayoutPageSummaryBasicExampleComponent, isStandalone: true, selector: "app-layout-page-summary-basic-example", ngImport: i0, template: "<sky-page-summary>\n @if (showAlert) {\n <sky-page-summary-alert>\n <sky-alert alertType=\"info\"> This is an alert. </sky-alert>\n </sky-page-summary-alert>\n }\n @if (showImage) {\n <sky-page-summary-image>\n <sky-avatar [name]=\"name\" [canChange]=\"true\" />\n </sky-page-summary-image>\n }\n @if (showTitle) {\n <sky-page-summary-title>\n {{ name }}\n </sky-page-summary-title>\n }\n @if (showSubtitle) {\n <sky-page-summary-subtitle> Board member </sky-page-summary-subtitle>\n }\n @if (showStatus) {\n <sky-page-summary-status>\n <sky-label labelType=\"success\"> Fundraiser </sky-label>\n <sky-label> Inactive </sky-label>\n </sky-page-summary-status>\n }\n @if (showContent) {\n <sky-page-summary-content>\n This is the arbitrary content section. You can display any kind of content\n to complement the content on a page. We recommend that you display content\n to support the key tasks of users of users who visit the page. We also\n recommend that you keep in mind the context of how users will use the\n content and limit the amount of content to avoid overloading the summary.\n </sky-page-summary-content>\n }\n @if (showKeyInfo) {\n <sky-page-summary-key-info>\n <sky-key-info>\n <sky-key-info-value> $1,500 </sky-key-info-value>\n <sky-key-info-label> Largest gift </sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value> 37 </sky-key-info-value>\n <sky-key-info-label> Total gifts </sky-key-info-label>\n </sky-key-info>\n </sky-page-summary-key-info>\n }\n</sky-page-summary>\n\n<ul class=\"sky-list-unstyled\">\n <li>\n <sky-checkbox labelText=\"Show title\" [(ngModel)]=\"showTitle\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show subtitle\" [(ngModel)]=\"showSubtitle\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show image\" [(ngModel)]=\"showImage\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show record status\" [(ngModel)]=\"showStatus\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show key information\" [(ngModel)]=\"showKeyInfo\" />\n </li>\n <li>\n <sky-checkbox\n labelText=\"Show arbitrary content\"\n [(ngModel)]=\"showContent\"\n />\n </li>\n <li>\n <sky-checkbox labelText=\"Show alert\" [(ngModel)]=\"showAlert\" />\n </li>\n</ul>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyAlertModule }, { kind: "component", type: i1.λ1, selector: "sky-alert", inputs: ["alertType", "closeable", "closed", "descriptionType", "customDescription"], outputs: ["closedChange"] }, { kind: "ngmodule", type: SkyAvatarModule }, { kind: "component", type: i1$8.λ1, selector: "sky-avatar", inputs: ["canChange", "name", "src", "maxFileSize", "size"], outputs: ["avatarChanged"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
8557
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: LayoutPageSummaryBasicExampleComponent, isStandalone: true, selector: "app-layout-page-summary-basic-example", ngImport: i0, template: "<sky-page-summary>\n @if (showAlert) {\n <sky-page-summary-alert>\n <sky-alert alertType=\"info\"> This is an alert. </sky-alert>\n </sky-page-summary-alert>\n }\n @if (showImage) {\n <sky-page-summary-image>\n <sky-avatar [name]=\"name\" [canChange]=\"true\" />\n </sky-page-summary-image>\n }\n @if (showTitle) {\n <sky-page-summary-title>\n {{ name }}\n </sky-page-summary-title>\n }\n @if (showSubtitle) {\n <sky-page-summary-subtitle> Board member </sky-page-summary-subtitle>\n }\n @if (showStatus) {\n <sky-page-summary-status>\n <sky-label labelType=\"success\"> Fundraiser </sky-label>\n <sky-label> Inactive </sky-label>\n </sky-page-summary-status>\n }\n @if (showContent) {\n <sky-page-summary-content>\n This is the arbitrary content section. You can display any kind of content\n to complement the content on a page. We recommend that you display content\n to support the key tasks of users of users who visit the page. We also\n recommend that you keep in mind the context of how users will use the\n content and limit the amount of content to avoid overloading the summary.\n </sky-page-summary-content>\n }\n @if (showKeyInfo) {\n <sky-page-summary-key-info>\n <sky-key-info>\n <sky-key-info-value> $1,500 </sky-key-info-value>\n <sky-key-info-label> Largest gift </sky-key-info-label>\n </sky-key-info>\n <sky-key-info>\n <sky-key-info-value> 37 </sky-key-info-value>\n <sky-key-info-label> Total gifts </sky-key-info-label>\n </sky-key-info>\n </sky-page-summary-key-info>\n }\n</sky-page-summary>\n\n<ul class=\"sky-list-unstyled\">\n <li>\n <sky-checkbox labelText=\"Show title\" [(ngModel)]=\"showTitle\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show subtitle\" [(ngModel)]=\"showSubtitle\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show image\" [(ngModel)]=\"showImage\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show record status\" [(ngModel)]=\"showStatus\" />\n </li>\n <li>\n <sky-checkbox labelText=\"Show key information\" [(ngModel)]=\"showKeyInfo\" />\n </li>\n <li>\n <sky-checkbox\n labelText=\"Show arbitrary content\"\n [(ngModel)]=\"showContent\"\n />\n </li>\n <li>\n <sky-checkbox labelText=\"Show alert\" [(ngModel)]=\"showAlert\" />\n </li>\n</ul>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyAlertModule }, { kind: "component", type: i1.λ1, selector: "sky-alert", inputs: ["alertType", "closeable", "closed", "descriptionType", "customDescription"], outputs: ["closedChange"] }, { kind: "ngmodule", type: SkyAvatarModule }, { kind: "component", type: i1$8.λ1, selector: "sky-avatar", inputs: ["canChange", "name", "src", "maxFileSize", "size"], outputs: ["avatarChanged"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkyLabelModule }, { kind: "component", type: i1.λ9, selector: "sky-label", inputs: ["labelType", "descriptionType", "customDescription"] }, { kind: "ngmodule", type: SkyPageSummaryModule }, { kind: "component", type: i1$5.λ28, selector: "sky-page-summary-alert" }, { kind: "component", type: i1$5.λ27, selector: "sky-page-summary" }, { kind: "component", type: i1$5.λ29, selector: "sky-page-summary-content" }, { kind: "component", type: i1$5.λ30, selector: "sky-page-summary-image" }, { kind: "component", type: i1$5.λ31, selector: "sky-page-summary-key-info" }, { kind: "component", type: i1$5.λ32, selector: "sky-page-summary-status" }, { kind: "component", type: i1$5.λ33, selector: "sky-page-summary-subtitle" }, { kind: "component", type: i1$5.λ34, selector: "sky-page-summary-title" }] }); }
|
|
8558
8558
|
}
|
|
8559
8559
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LayoutPageSummaryBasicExampleComponent, decorators: [{
|
|
8560
8560
|
type: Component,
|
|
@@ -8777,7 +8777,7 @@ class ListsFilterInlineExampleComponent {
|
|
|
8777
8777
|
return result;
|
|
8778
8778
|
}
|
|
8779
8779
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ListsFilterInlineExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8780
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: ListsFilterInlineExampleComponent, isStandalone: true, selector: "app-lists-filter-inline-example", ngImport: i0, template: "<sky-toolbar>\n <sky-toolbar-section>\n <sky-toolbar-item>\n <sky-filter-button\n data-sky-id=\"my-filter-button\"\n [active]=\"filtersActive\"\n [ariaControls]=\"inlineFilters.id\"\n [ariaExpanded]=\"showInlineFilters\"\n [showButtonText]=\"true\"\n (filterButtonClick)=\"filterButtonClicked()\"\n />\n </sky-toolbar-item>\n </sky-toolbar-section>\n</sky-toolbar>\n\n<div #inlineFilters skyId [hidden]=\"!showInlineFilters\">\n <sky-filter-inline data-sky-id=\"filter-inline\">\n <sky-filter-inline-item data-sky-id=\"fruit-filter\">\n <sky-input-box labelText=\"Fruit type\">\n <select [ngModel]=\"fruitType\" (ngModelChange)=\"fruitTypeChange($event)\">\n <option value=\"any\">Any fruit</option>\n <option value=\"citrus\">Citrus</option>\n <option value=\"berry\">Berry</option>\n </select>\n </sky-input-box>\n </sky-filter-inline-item>\n <sky-filter-inline-item data-sky-id=\"hide-orange-filter\">\n <sky-checkbox\n labelText=\"Hide orange fruits\"\n [ngModel]=\"hideOrange\"\n (ngModelChange)=\"hideOrangeChange($event)\"\n />\n </sky-filter-inline-item>\n </sky-filter-inline>\n</div>\n\n<sky-repeater expandMode=\"none\">\n @for (item of filteredItems; track item) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ item.name }}\n </sky-repeater-item-title>\n </sky-repeater-item>\n }\n</sky-repeater>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
8780
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: ListsFilterInlineExampleComponent, isStandalone: true, selector: "app-lists-filter-inline-example", ngImport: i0, template: "<sky-toolbar>\n <sky-toolbar-section>\n <sky-toolbar-item>\n <sky-filter-button\n data-sky-id=\"my-filter-button\"\n [active]=\"filtersActive\"\n [ariaControls]=\"inlineFilters.id\"\n [ariaExpanded]=\"showInlineFilters\"\n [showButtonText]=\"true\"\n (filterButtonClick)=\"filterButtonClicked()\"\n />\n </sky-toolbar-item>\n </sky-toolbar-section>\n</sky-toolbar>\n\n<div #inlineFilters skyId [hidden]=\"!showInlineFilters\">\n <sky-filter-inline data-sky-id=\"filter-inline\">\n <sky-filter-inline-item data-sky-id=\"fruit-filter\">\n <sky-input-box labelText=\"Fruit type\">\n <select [ngModel]=\"fruitType\" (ngModelChange)=\"fruitTypeChange($event)\">\n <option value=\"any\">Any fruit</option>\n <option value=\"citrus\">Citrus</option>\n <option value=\"berry\">Berry</option>\n </select>\n </sky-input-box>\n </sky-filter-inline-item>\n <sky-filter-inline-item data-sky-id=\"hide-orange-filter\">\n <sky-checkbox\n labelText=\"Hide orange fruits\"\n [ngModel]=\"hideOrange\"\n (ngModelChange)=\"hideOrangeChange($event)\"\n />\n </sky-filter-inline-item>\n </sky-filter-inline>\n</div>\n\n<sky-repeater expandMode=\"none\">\n @for (item of filteredItems; track item) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ item.name }}\n </sky-repeater-item-title>\n </sky-repeater-item>\n }\n</sky-repeater>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3$2.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyFilterModule }, { kind: "component", type: i2$3.λ1, selector: "sky-filter-button", inputs: ["filterButtonId", "ariaControls", "ariaExpanded", "ariaLabel", "active", "disabled", "showButtonText"], outputs: ["filterButtonClick"] }, { kind: "component", type: i2$3.λ2, selector: "sky-filter-inline" }, { kind: "component", type: i2$3.λ3, selector: "sky-filter-inline-item" }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2$2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2$2.λ20, selector: "input:not([skyId]):not(.sky-form-control),select:not([skyId]):not(.sky-form-control),textarea:not([skyId]):not(.sky-form-control)", inputs: ["autocomplete"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$3.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$3.λ10, selector: "sky-repeater-item", inputs: ["disabled", "itemName", "inlineFormConfig", "inlineFormTemplate", "isExpanded", "isSelected", "reorderable", "selectable", "showInlineForm", "tag"], outputs: ["collapse", "expand", "inlineFormClose", "isSelectedChange"] }, { kind: "component", type: i2$3.λ12, selector: "sky-repeater-item-title" }, { kind: "ngmodule", type: SkyToolbarModule }, { kind: "component", type: i1$5.λ37, selector: "sky-toolbar", inputs: ["listDescriptor"] }, { kind: "component", type: i1$5.λ39, selector: "sky-toolbar-item" }, { kind: "component", type: i1$5.λ38, selector: "sky-toolbar-section" }] }); }
|
|
8781
8781
|
}
|
|
8782
8782
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ListsFilterInlineExampleComponent, decorators: [{
|
|
8783
8783
|
type: Component,
|
|
@@ -8851,7 +8851,7 @@ class FilterModalComponent {
|
|
|
8851
8851
|
}
|
|
8852
8852
|
}
|
|
8853
8853
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8854
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter food preferences\">\n <sky-modal-content>\n <sky-input-box labelText=\"Fruit type\" stacked=\"true\">\n <select [(ngModel)]=\"fruitType\">\n <option value=\"any\">Any fruit</option>\n <option value=\"citrus\">Citrus</option>\n <option value=\"berry\">Berry</option>\n </select>\n </sky-input-box>\n <sky-checkbox labelText=\"Hide orange fruits\" [(ngModel)]=\"hideOrange\" />\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
8854
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: FilterModalComponent, isStandalone: true, selector: "app-filter-modal", ngImport: i0, template: "<sky-modal headingText=\"Filter food preferences\">\n <sky-modal-content>\n <sky-input-box labelText=\"Fruit type\" stacked=\"true\">\n <select [(ngModel)]=\"fruitType\">\n <option value=\"any\">Any fruit</option>\n <option value=\"citrus\">Citrus</option>\n <option value=\"berry\">Berry</option>\n </select>\n </sky-input-box>\n <sky-checkbox labelText=\"Hide orange fruits\" [(ngModel)]=\"hideOrange\" />\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"applyFilters()\"\n >\n Apply\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"clearAllFilters()\"\n >\n Clear\n </button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"cancel()\">\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2$2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2$2.λ20, selector: "input:not([skyId]):not(.sky-form-control),select:not([skyId]):not(.sky-form-control),textarea:not([skyId]):not(.sky-form-control)", inputs: ["autocomplete"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3.λ3, selector: "sky-modal-footer" }] }); }
|
|
8855
8855
|
}
|
|
8856
8856
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FilterModalComponent, decorators: [{
|
|
8857
8857
|
type: Component,
|
|
@@ -10013,7 +10013,7 @@ class PickerModalComponent {
|
|
|
10013
10013
|
this.#modalInstance.save(selectedPeople);
|
|
10014
10014
|
}
|
|
10015
10015
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: PickerModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10016
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: PickerModalComponent, isStandalone: true, selector: "app-picker-modal", ngImport: i0, template: "<sky-modal class=\"lookup-custom-picker-modal\" headingText=\"Names\">\n <sky-modal-content>\n @if (peopleForm) {\n <form [formGroup]=\"peopleForm\">\n <sky-selection-box-grid>\n @for (\n personControl of peopleForm.controls.people.controls;\n track personControl;\n let i = $index\n ) {\n <sky-selection-box [control]=\"checkbox\">\n <sky-icon iconName=\"person\" />\n <sky-selection-box-header>\n {{ people[i].name }}\n </sky-selection-box-header>\n <sky-selection-box-description>\n {{ people[i].formal }}\n </sky-selection-box-description>\n <sky-checkbox #checkbox [formControl]=\"personControl\" />\n </sky-selection-box>\n }\n </sky-selection-box-grid>\n </form>\n } @else {\n <div class=\"wait-container\">\n <sky-wait [isWaiting]=\"true\" />\n </div>\n }\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary lookup-custom-picker-save-button\"\n type=\"button\"\n (click)=\"save()\"\n >\n Save\n </button>\n </sky-modal-footer>\n</sky-modal>\n", styles: [".wait-container{height:100px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
10016
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: PickerModalComponent, isStandalone: true, selector: "app-picker-modal", ngImport: i0, template: "<sky-modal class=\"lookup-custom-picker-modal\" headingText=\"Names\">\n <sky-modal-content>\n @if (peopleForm) {\n <form [formGroup]=\"peopleForm\">\n <sky-selection-box-grid>\n @for (\n personControl of peopleForm.controls.people.controls;\n track personControl;\n let i = $index\n ) {\n <sky-selection-box [control]=\"checkbox\">\n <sky-icon iconName=\"person\" />\n <sky-selection-box-header>\n {{ people[i].name }}\n </sky-selection-box-header>\n <sky-selection-box-description>\n {{ people[i].formal }}\n </sky-selection-box-description>\n <sky-checkbox #checkbox [formControl]=\"personControl\" />\n </sky-selection-box>\n }\n </sky-selection-box-grid>\n </form>\n } @else {\n <div class=\"wait-container\">\n <sky-wait [isWaiting]=\"true\" />\n </div>\n }\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary lookup-custom-picker-save-button\"\n type=\"button\"\n (click)=\"save()\"\n >\n Save\n </button>\n </sky-modal-footer>\n</sky-modal>\n", styles: [".wait-container{height:100px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$9.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3.λ3, selector: "sky-modal-footer" }, { kind: "ngmodule", type: SkySelectionBoxModule }, { kind: "component", type: i2$2.λ15, selector: "sky-selection-box-grid", inputs: ["alignItems"] }, { kind: "component", type: i2$2.λ17, selector: "sky-selection-box", inputs: ["control"] }, { kind: "component", type: i2$2.λ14, selector: "sky-selection-box-description" }, { kind: "component", type: i2$2.λ16, selector: "sky-selection-box-header" }, { kind: "ngmodule", type: SkyWaitModule }, { kind: "component", type: i1.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking", "screenReaderCompletedText"] }] }); }
|
|
10017
10017
|
}
|
|
10018
10018
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: PickerModalComponent, decorators: [{
|
|
10019
10019
|
type: Component,
|
|
@@ -12980,7 +12980,7 @@ let ModalComponent$2 = class ModalComponent {
|
|
|
12980
12980
|
this.activeIndex = changes.activeIndex;
|
|
12981
12981
|
}
|
|
12982
12982
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12983
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: ModalComponent, isStandalone: true, selector: "app-modal", ngImport: i0, template: "<sky-modal [headingText]=\"title\">\n <sky-modal-content>\n <form [formGroup]=\"formGroup\">\n <sky-progress-indicator\n #wizardDemo\n [displayMode]=\"displayMode\"\n (progressChanges)=\"updateIndex($event)\"\n >\n <sky-progress-indicator-item title=\"First step\">\n <sky-input-box labelText=\"Enter text to continue\">\n <input type=\"text\" formControlName=\"requiredValue1\" />\n </sky-input-box>\n </sky-progress-indicator-item>\n\n <sky-progress-indicator-item title=\"Second step\">\n <div>\n <sky-checkbox\n formControlName=\"requiredValue2\"\n labelText=\"Select to continue\"\n />\n </div>\n </sky-progress-indicator-item>\n\n <sky-progress-indicator-item title=\"Third step\">\n <div>Additional content or tasks go here.</div>\n </sky-progress-indicator-item>\n </sky-progress-indicator>\n </form>\n </sky-modal-content>\n <sky-modal-footer>\n <sky-progress-indicator-nav-button\n buttonType=\"previous\"\n [progressIndicator]=\"wizardDemo\"\n />\n <sky-progress-indicator-nav-button\n buttonType=\"next\"\n [disabled]=\"!requirementsMet\"\n [progressIndicator]=\"wizardDemo\"\n />\n <sky-progress-indicator-nav-button\n buttonType=\"finish\"\n buttonText=\"Finish\"\n [progressIndicator]=\"wizardDemo\"\n (actionClick)=\"onSaveClick($event)\"\n />\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"onCancelClick()\"\n >\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
12983
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: ModalComponent, isStandalone: true, selector: "app-modal", ngImport: i0, template: "<sky-modal [headingText]=\"title\">\n <sky-modal-content>\n <form [formGroup]=\"formGroup\">\n <sky-progress-indicator\n #wizardDemo\n [displayMode]=\"displayMode\"\n (progressChanges)=\"updateIndex($event)\"\n >\n <sky-progress-indicator-item title=\"First step\">\n <sky-input-box labelText=\"Enter text to continue\">\n <input type=\"text\" formControlName=\"requiredValue1\" />\n </sky-input-box>\n </sky-progress-indicator-item>\n\n <sky-progress-indicator-item title=\"Second step\">\n <div>\n <sky-checkbox\n formControlName=\"requiredValue2\"\n labelText=\"Select to continue\"\n />\n </div>\n </sky-progress-indicator-item>\n\n <sky-progress-indicator-item title=\"Third step\">\n <div>Additional content or tasks go here.</div>\n </sky-progress-indicator-item>\n </sky-progress-indicator>\n </form>\n </sky-modal-content>\n <sky-modal-footer>\n <sky-progress-indicator-nav-button\n buttonType=\"previous\"\n [progressIndicator]=\"wizardDemo\"\n />\n <sky-progress-indicator-nav-button\n buttonType=\"next\"\n [disabled]=\"!requirementsMet\"\n [progressIndicator]=\"wizardDemo\"\n />\n <sky-progress-indicator-nav-button\n buttonType=\"finish\"\n buttonText=\"Finish\"\n [progressIndicator]=\"wizardDemo\"\n (actionClick)=\"onSaveClick($event)\"\n />\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"onCancelClick()\"\n >\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2$2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2$2.λ20, selector: "input:not([skyId]):not(.sky-form-control),select:not([skyId]):not(.sky-form-control),textarea:not([skyId]):not(.sky-form-control)", inputs: ["autocomplete"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3.λ3, selector: "sky-modal-footer" }, { kind: "ngmodule", type: SkyProgressIndicatorModule }, { kind: "component", type: i1$f.λ2, selector: "sky-progress-indicator", inputs: ["displayMode", "isPassive", "messageStream", "startingIndex"], outputs: ["progressChanges"] }, { kind: "component", type: i1$f.λ1, selector: "sky-progress-indicator-item", inputs: ["title", "helpKey", "helpPopoverContent", "helpPopoverTitle"] }, { kind: "component", type: i1$f.λ3, selector: "sky-progress-indicator-nav-button", inputs: ["buttonText", "buttonType", "disabled", "progressIndicator"], outputs: ["actionClick"] }] }); }
|
|
12984
12984
|
};
|
|
12985
12985
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ModalComponent$2, decorators: [{
|
|
12986
12986
|
type: Component,
|
|
@@ -13718,7 +13718,7 @@ class ModalComponent {
|
|
|
13718
13718
|
this.isSaveDisabled = !this.formGroup?.get('termsAccepted')?.value;
|
|
13719
13719
|
}
|
|
13720
13720
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
13721
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: ModalComponent, isStandalone: true, selector: "app-modal", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"onSave()\">\n <sky-modal [headingText]=\"title\">\n <sky-modal-content>\n <sky-tabset\n #wizardDemo\n ariaLabel=\"Sign-up steps\"\n data-sky-id=\"sign-up-wizard\"\n tabStyle=\"wizard\"\n [(active)]=\"activeIndex\"\n >\n <sky-tab tabHeading=\"1. Biographical Details\">\n <sky-fluid-grid gutterSize=\"small\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"4\">\n <sky-input-box labelText=\"First name\" [stacked]=\"true\">\n <input type=\"text\" formControlName=\"firstName\" />\n </sky-input-box>\n </sky-column>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"4\">\n <sky-input-box labelText=\"Middle name\" [stacked]=\"true\">\n <input type=\"text\" formControlName=\"middleName\" />\n </sky-input-box>\n </sky-column>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"4\">\n <sky-input-box labelText=\"Last name\">\n <input type=\"text\" formControlName=\"lastName\" />\n </sky-input-box>\n </sky-column>\n </sky-row>\n </sky-fluid-grid>\n </sky-tab>\n <sky-tab\n tabHeading=\"2. Contact Information\"\n [disabled]=\"isStep2Disabled\"\n >\n <sky-fluid-grid gutterSize=\"small\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"6\">\n <sky-input-box labelText=\"Phone Number\" [stacked]=\"true\">\n <sky-phone-field defaultCountry=\"us\">\n <input formControlName=\"phoneNumber\" skyPhoneFieldInput />\n </sky-phone-field>\n </sky-input-box>\n </sky-column>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"6\">\n <sky-input-box labelText=\"Email\">\n <input type=\"email\" formControlName=\"email\" />\n </sky-input-box>\n </sky-column>\n </sky-row>\n </sky-fluid-grid>\n </sky-tab>\n <sky-tab tabHeading=\"3. More Information\" [disabled]=\"isStep3Disabled\">\n <sky-fluid-grid gutterSize=\"small\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"12\">\n <sky-checkbox\n formControlName=\"termsAccepted\"\n labelText=\"Accept terms and conditions\"\n required\n />\n </sky-column>\n <sky-column [screenSmall]=\"12\">\n <sky-checkbox\n formControlName=\"mailingList\"\n labelText=\"Sign up for our email newsletter\"\n />\n </sky-column>\n </sky-row>\n </sky-fluid-grid>\n </sky-tab>\n </sky-tabset>\n </sky-modal-content>\n <sky-modal-footer>\n <sky-tabset-nav-button buttonType=\"previous\" [tabset]=\"wizardDemo\" />\n <sky-tabset-nav-button buttonType=\"next\" [tabset]=\"wizardDemo\" />\n <sky-tabset-nav-button\n buttonType=\"finish\"\n [tabset]=\"wizardDemo\"\n [disabled]=\"isSaveDisabled\"\n />\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"onCancelClick()\"\n >\n Cancel\n </button>\n </sky-modal-footer>\n </sky-modal>\n</form>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "
|
|
13721
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.5", type: ModalComponent, isStandalone: true, selector: "app-modal", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"onSave()\">\n <sky-modal [headingText]=\"title\">\n <sky-modal-content>\n <sky-tabset\n #wizardDemo\n ariaLabel=\"Sign-up steps\"\n data-sky-id=\"sign-up-wizard\"\n tabStyle=\"wizard\"\n [(active)]=\"activeIndex\"\n >\n <sky-tab tabHeading=\"1. Biographical Details\">\n <sky-fluid-grid gutterSize=\"small\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"4\">\n <sky-input-box labelText=\"First name\" [stacked]=\"true\">\n <input type=\"text\" formControlName=\"firstName\" />\n </sky-input-box>\n </sky-column>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"4\">\n <sky-input-box labelText=\"Middle name\" [stacked]=\"true\">\n <input type=\"text\" formControlName=\"middleName\" />\n </sky-input-box>\n </sky-column>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"4\">\n <sky-input-box labelText=\"Last name\">\n <input type=\"text\" formControlName=\"lastName\" />\n </sky-input-box>\n </sky-column>\n </sky-row>\n </sky-fluid-grid>\n </sky-tab>\n <sky-tab\n tabHeading=\"2. Contact Information\"\n [disabled]=\"isStep2Disabled\"\n >\n <sky-fluid-grid gutterSize=\"small\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"6\">\n <sky-input-box labelText=\"Phone Number\" [stacked]=\"true\">\n <sky-phone-field defaultCountry=\"us\">\n <input formControlName=\"phoneNumber\" skyPhoneFieldInput />\n </sky-phone-field>\n </sky-input-box>\n </sky-column>\n <sky-column [screenSmall]=\"12\" [screenMedium]=\"6\">\n <sky-input-box labelText=\"Email\">\n <input type=\"email\" formControlName=\"email\" />\n </sky-input-box>\n </sky-column>\n </sky-row>\n </sky-fluid-grid>\n </sky-tab>\n <sky-tab tabHeading=\"3. More Information\" [disabled]=\"isStep3Disabled\">\n <sky-fluid-grid gutterSize=\"small\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"12\">\n <sky-checkbox\n formControlName=\"termsAccepted\"\n labelText=\"Accept terms and conditions\"\n required\n />\n </sky-column>\n <sky-column [screenSmall]=\"12\">\n <sky-checkbox\n formControlName=\"mailingList\"\n labelText=\"Sign up for our email newsletter\"\n />\n </sky-column>\n </sky-row>\n </sky-fluid-grid>\n </sky-tab>\n </sky-tabset>\n </sky-modal-content>\n <sky-modal-footer>\n <sky-tabset-nav-button buttonType=\"previous\" [tabset]=\"wizardDemo\" />\n <sky-tabset-nav-button buttonType=\"next\" [tabset]=\"wizardDemo\" />\n <sky-tabset-nav-button\n buttonType=\"finish\"\n [tabset]=\"wizardDemo\"\n [disabled]=\"isSaveDisabled\"\n />\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"onCancelClick()\"\n >\n Cancel\n </button>\n </sky-modal-footer>\n </sky-modal>\n</form>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SkyCheckboxModule }, { kind: "component", type: i2$2.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyFluidGridModule }, { kind: "component", type: i1$5.λ23, selector: "sky-row", inputs: ["reverseColumnOrder"] }, { kind: "component", type: i1$5.λ24, selector: "sky-column", inputs: ["screenXSmall", "screenSmall", "screenMedium", "screenLarge"] }, { kind: "component", type: i1$5.λ22, selector: "sky-fluid-grid", inputs: ["disableMargin", "gutterSize"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2$2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2$2.λ20, selector: "input:not([skyId]):not(.sky-form-control),select:not([skyId]):not(.sky-form-control),textarea:not([skyId]):not(.sky-form-control)", inputs: ["autocomplete"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3.λ3, selector: "sky-modal-footer" }, { kind: "ngmodule", type: SkyPhoneFieldModule }, { kind: "component", type: i3$7.λ1, selector: "sky-phone-field", inputs: ["allowExtensions", "defaultCountry", "returnFormat", "supportedCountryISOs", "selectedCountry"], outputs: ["selectedCountryChange"] }, { kind: "directive", type: i3$7.λ2, selector: "[skyPhoneFieldInput]", inputs: ["disabled", "skyPhoneFieldNoValidate"] }, { kind: "ngmodule", type: SkyTabsModule }, { kind: "component", type: i1$2.λ1, selector: "sky-tab", inputs: ["active", "disabled", "permalinkValue", "tabHeaderCount", "tabHeading", "tabIndexValue", "layout"], outputs: ["close"] }, { kind: "component", type: i1$2.λ2, selector: "sky-tabset", inputs: ["active", "ariaLabel", "ariaLabelledBy", "permalinkId", "tabStyle"], outputs: ["activeChange", "newTab", "openTab", "tabIndexesChange"] }, { kind: "component", type: i1$2.λ3, selector: "sky-tabset-nav-button", inputs: ["tabset", "buttonType", "buttonText", "disabled"] }] }); }
|
|
13722
13722
|
}
|
|
13723
13723
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ModalComponent, decorators: [{
|
|
13724
13724
|
type: Component,
|