@skyux/code-examples 12.0.0-alpha.9 → 12.0.0-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/skyux-code-examples.mjs +100 -90
- package/fesm2022/skyux-code-examples.mjs.map +1 -1
- package/lib/modules/layout/back-to-top/infinite-scroll/example.component.d.ts +1 -0
- package/lib/modules/layout/back-to-top/repeater/example.component.d.ts +1 -0
- package/lib/modules/layout/page/layout-fit/example.component.d.ts +1 -0
- package/lib/modules/pages/action-hub/example.component.d.ts +1 -0
- package/lib/modules/pages/page/home-page-blocks-layout-demo/example.component.d.ts +1 -0
- package/lib/modules/pages/page/list-page-list-layout-demo/example.component.d.ts +1 -0
- package/lib/modules/pages/page/list-page-tabs-layout-demo/example.component.d.ts +1 -0
- package/lib/modules/pages/page/record-page-blocks-layout-demo/example.component.d.ts +1 -0
- package/lib/modules/pages/page/record-page-tabs-layout-demo/example.component.d.ts +1 -0
- package/lib/modules/pages/page/split-view-page-fit-layout-demo/example.component.d.ts +1 -0
- package/package.json +33 -33
|
@@ -54,7 +54,7 @@ import * as i2$7 from '@skyux/lists';
|
|
|
54
54
|
import { SkyPagingModule, SkyRepeaterModule, SkyInfiniteScrollModule, SkyFilterModule, SkySortModule } from '@skyux/lists';
|
|
55
55
|
import { map, filter, takeUntil as takeUntil$1, delay as delay$1, take } from 'rxjs/operators';
|
|
56
56
|
import * as i1$c from '@angular/common';
|
|
57
|
-
import { CommonModule
|
|
57
|
+
import { CommonModule } from '@angular/common';
|
|
58
58
|
import { toSignal, takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
59
59
|
import * as i3$5 from '@skyux/datetime';
|
|
60
60
|
import { SkyDateRangeCalculatorId, SkyDateRangePickerModule, SkyDateRangeService, SkyDateRangeCalculatorType, SkyDatepickerModule, SkyDatePipeModule, SkyTimepickerModule } from '@skyux/datetime';
|
|
@@ -182,11 +182,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
182
182
|
*/
|
|
183
183
|
class IconBasicExampleComponent {
|
|
184
184
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IconBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
185
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: IconBasicExampleComponent, isStandalone: true, selector: "app-icon-basic-example", ngImport: i0, template: "<sky-icon
|
|
185
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: IconBasicExampleComponent, isStandalone: true, selector: "app-icon-basic-example", ngImport: i0, template: "<sky-icon iconName=\"calendar-ltr\" iconSize=\"xxxs\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xxs\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xs\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"s\" />\n<sky-icon iconName=\"calendar-ltr\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"l\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xl\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xxl\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xxxl\" />\n<sky-icon\n data-sky-id=\"icon-example\"\n iconName=\"calendar-ltr\"\n variant=\"solid\"\n iconSize=\"xl\"\n/>\n\n<div>\n <sky-icon iconName=\"navigation\" iconSize=\"xl\" />\n</div>\n\n<div>\n <sky-icon iconName=\"chevron-down\" iconSize=\"xl\" />\n</div>\n", dependencies: [{ kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }] }); }
|
|
186
186
|
}
|
|
187
187
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IconBasicExampleComponent, decorators: [{
|
|
188
188
|
type: Component,
|
|
189
|
-
args: [{ selector: 'app-icon-basic-example', imports: [SkyIconModule], template: "<sky-icon
|
|
189
|
+
args: [{ selector: 'app-icon-basic-example', imports: [SkyIconModule], template: "<sky-icon iconName=\"calendar-ltr\" iconSize=\"xxxs\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xxs\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xs\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"s\" />\n<sky-icon iconName=\"calendar-ltr\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"l\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xl\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xxl\" />\n<sky-icon iconName=\"calendar-ltr\" iconSize=\"xxxl\" />\n<sky-icon\n data-sky-id=\"icon-example\"\n iconName=\"calendar-ltr\"\n variant=\"solid\"\n iconSize=\"xl\"\n/>\n\n<div>\n <sky-icon iconName=\"navigation\" iconSize=\"xl\" />\n</div>\n\n<div>\n <sky-icon iconName=\"chevron-down\" iconSize=\"xl\" />\n</div>\n" }]
|
|
190
190
|
}] });
|
|
191
191
|
|
|
192
192
|
/**
|
|
@@ -200,11 +200,11 @@ class IconIconButtonExampleComponent {
|
|
|
200
200
|
alert('Icon only button clicked');
|
|
201
201
|
}
|
|
202
202
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IconIconButtonExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
203
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: IconIconButtonExampleComponent, isStandalone: true, selector: "app-icon-icon-button-example", ngImport: i0, template: "<button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"textButtonClick()\"\n>\n Save\n <sky-icon data-sky-id=\"text-button-icon\"
|
|
203
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: IconIconButtonExampleComponent, isStandalone: true, selector: "app-icon-icon-button-example", ngImport: i0, template: "<button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"textButtonClick()\"\n>\n Save\n <sky-icon data-sky-id=\"text-button-icon\" iconName=\"save\" />\n</button>\n\n<button\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"iconOnlyButtonClick()\"\n>\n <sky-icon data-sky-id=\"button-icon\" iconName=\"edit\" />\n</button>\n", dependencies: [{ kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }] }); }
|
|
204
204
|
}
|
|
205
205
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IconIconButtonExampleComponent, decorators: [{
|
|
206
206
|
type: Component,
|
|
207
|
-
args: [{ selector: 'app-icon-icon-button-example', imports: [SkyIconModule], template: "<button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"textButtonClick()\"\n>\n Save\n <sky-icon data-sky-id=\"text-button-icon\"
|
|
207
|
+
args: [{ selector: 'app-icon-icon-button-example', imports: [SkyIconModule], template: "<button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"textButtonClick()\"\n>\n Save\n <sky-icon data-sky-id=\"text-button-icon\" iconName=\"save\" />\n</button>\n\n<button\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"iconOnlyButtonClick()\"\n>\n <sky-icon data-sky-id=\"button-icon\" iconName=\"edit\" />\n</button>\n" }]
|
|
208
208
|
}] });
|
|
209
209
|
|
|
210
210
|
/**
|
|
@@ -293,7 +293,7 @@ class SettingsModalComponent {
|
|
|
293
293
|
});
|
|
294
294
|
}
|
|
295
295
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SettingsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
296
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SettingsModalComponent, isStandalone: true, selector: "app-settings-modal", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (submit)=\"modalInstance.save()\">\n <sky-modal data-sky-id=\"settings-modal\" [headingText]=\"title\">\n <sky-modal-content>\n @for (field of fields; track field) {\n <ng-container class=\"row\">\n @switch (title) {\n @case ('Color') {\n <sky-colorpicker #colorPicker stacked [labelText]=\"field\">\n <input\n type=\"text\"\n [formControlName]=\"field\"\n [skyColorpickerInput]=\"colorPicker\"\n />\n </sky-colorpicker>\n }\n @default {\n <sky-input-box stacked [labelText]=\"field\">\n <input type=\"text\" [formControlName]=\"field\" />\n </sky-input-box>\n }\n }\n </ng-container>\n }\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary sky-margin-inline-sm\"\n type=\"submit\"\n >\n Save\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"modalInstance.close()\"\n >\n Close\n </button>\n </sky-modal-footer>\n </sky-modal>\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.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: "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: SkyColorpickerModule }, { kind: "component", type: i2$1.λ1, selector: "sky-colorpicker", inputs: ["pickerButtonIcon", "
|
|
296
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SettingsModalComponent, isStandalone: true, selector: "app-settings-modal", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (submit)=\"modalInstance.save()\">\n <sky-modal data-sky-id=\"settings-modal\" [headingText]=\"title\">\n <sky-modal-content>\n @for (field of fields; track field) {\n <ng-container class=\"row\">\n @switch (title) {\n @case ('Color') {\n <sky-colorpicker #colorPicker stacked [labelText]=\"field\">\n <input\n type=\"text\"\n [formControlName]=\"field\"\n [skyColorpickerInput]=\"colorPicker\"\n />\n </sky-colorpicker>\n }\n @default {\n <sky-input-box stacked [labelText]=\"field\">\n <input type=\"text\" [formControlName]=\"field\" />\n </sky-input-box>\n }\n }\n </ng-container>\n }\n </sky-modal-content>\n <sky-modal-footer>\n <button\n class=\"sky-btn sky-btn-primary sky-margin-inline-sm\"\n type=\"submit\"\n >\n Save\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"modalInstance.close()\"\n >\n Close\n </button>\n </sky-modal-footer>\n </sky-modal>\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.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: "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: SkyColorpickerModule }, { kind: "component", type: i2$1.λ1, selector: "sky-colorpicker", inputs: ["pickerButtonIcon", "label", "labelledBy", "labelText", "labelHidden", "helpKey", "helpPopoverContent", "helpPopoverTitle", "hintText", "stacked", "messageStream", "showResetButton"], outputs: ["selectedColorChanged", "selectedColorApplied"] }, { kind: "directive", type: i2$1.λ2, selector: "[skyColorpickerInput]", inputs: ["skyColorpickerInput", "initialColor", "id", "returnFormat", "outputFormat", "presetColors", "alphaChannel", "allowTransparency"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2.λ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$2.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3$2.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3$2.λ3, selector: "sky-modal-footer" }] }); }
|
|
297
297
|
}
|
|
298
298
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SettingsModalComponent, decorators: [{
|
|
299
299
|
type: Component,
|
|
@@ -313,6 +313,7 @@ const pastHours = Array.from(Array(5).keys()).map((i) => {
|
|
|
313
313
|
});
|
|
314
314
|
/**
|
|
315
315
|
* @title Action hub with basic setup
|
|
316
|
+
* @docsDemoHidden
|
|
316
317
|
*/
|
|
317
318
|
class PagesActionHubExampleComponent {
|
|
318
319
|
constructor() {
|
|
@@ -5566,7 +5567,7 @@ class ColorpickerBasicExampleComponent {
|
|
|
5566
5567
|
alert('Your favorite color is: \n' + favoriteColor);
|
|
5567
5568
|
}
|
|
5568
5569
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ColorpickerBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5569
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ColorpickerBasicExampleComponent, isStandalone: true, selector: "app-colorpicker-basic-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\">\n <sky-colorpicker\n #colorPicker\n data-sky-id=\"favorite-color\"\n labelText=\"What is your favorite color?\"\n hintText=\"Pick a color with at least 80% opacity.\"\n [stacked]=\"true\"\n (selectedColorChanged)=\"onSelectedColorChanged($event)\"\n >\n <input\n formControlName=\"favoriteColor\"\n type=\"text\"\n [presetColors]=\"swatches\"\n [skyColorpickerInput]=\"colorPicker\"\n />\n @if (favoriteColor.errors?.['opaque']) {\n <sky-form-error\n errorName=\"opaque\"\n errorText=\"Color must have at least 80% opacity.\"\n />\n }\n </sky-colorpicker>\n\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\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.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: SkyColorpickerModule }, { kind: "component", type: i2$1.λ1, selector: "sky-colorpicker", inputs: ["pickerButtonIcon", "
|
|
5570
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ColorpickerBasicExampleComponent, isStandalone: true, selector: "app-colorpicker-basic-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\">\n <sky-colorpicker\n #colorPicker\n data-sky-id=\"favorite-color\"\n labelText=\"What is your favorite color?\"\n hintText=\"Pick a color with at least 80% opacity.\"\n [stacked]=\"true\"\n (selectedColorChanged)=\"onSelectedColorChanged($event)\"\n >\n <input\n formControlName=\"favoriteColor\"\n type=\"text\"\n [presetColors]=\"swatches\"\n [skyColorpickerInput]=\"colorPicker\"\n />\n @if (favoriteColor.errors?.['opaque']) {\n <sky-form-error\n errorName=\"opaque\"\n errorText=\"Color must have at least 80% opacity.\"\n />\n }\n </sky-colorpicker>\n\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\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.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: SkyColorpickerModule }, { kind: "component", type: i2$1.λ1, selector: "sky-colorpicker", inputs: ["pickerButtonIcon", "label", "labelledBy", "labelText", "labelHidden", "helpKey", "helpPopoverContent", "helpPopoverTitle", "hintText", "stacked", "messageStream", "showResetButton"], outputs: ["selectedColorChanged", "selectedColorApplied"] }, { kind: "directive", type: i2$1.λ2, selector: "[skyColorpickerInput]", inputs: ["skyColorpickerInput", "initialColor", "id", "returnFormat", "outputFormat", "presetColors", "alphaChannel", "allowTransparency"] }, { kind: "component", type: i2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }] }); }
|
|
5570
5571
|
}
|
|
5571
5572
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ColorpickerBasicExampleComponent, decorators: [{
|
|
5572
5573
|
type: Component,
|
|
@@ -5615,7 +5616,7 @@ class ColorpickerHelpKeyExampleComponent {
|
|
|
5615
5616
|
alert('Your favorite color is: \n' + favoriteColor);
|
|
5616
5617
|
}
|
|
5617
5618
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ColorpickerHelpKeyExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5618
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ColorpickerHelpKeyExampleComponent, isStandalone: true, selector: "app-colorpicker-help-key-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\">\n <sky-colorpicker\n #colorPicker\n data-sky-id=\"favorite-color\"\n labelText=\"What is your favorite color?\"\n helpKey=\"color-help\"\n hintText=\"Pick a color with at least 80% opacity.\"\n [stacked]=\"true\"\n (selectedColorChanged)=\"onSelectedColorChanged($event)\"\n >\n <input\n formControlName=\"favoriteColor\"\n type=\"text\"\n [presetColors]=\"swatches\"\n [skyColorpickerInput]=\"colorPicker\"\n />\n @if (favoriteColor.errors?.['opaque']) {\n <sky-form-error\n errorName=\"opaque\"\n errorText=\"Color must have at least 80% opacity.\"\n />\n }\n </sky-colorpicker>\n\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\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.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: SkyColorpickerModule }, { kind: "component", type: i2$1.λ1, selector: "sky-colorpicker", inputs: ["pickerButtonIcon", "
|
|
5619
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ColorpickerHelpKeyExampleComponent, isStandalone: true, selector: "app-colorpicker-help-key-example", ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\">\n <sky-colorpicker\n #colorPicker\n data-sky-id=\"favorite-color\"\n labelText=\"What is your favorite color?\"\n helpKey=\"color-help\"\n hintText=\"Pick a color with at least 80% opacity.\"\n [stacked]=\"true\"\n (selectedColorChanged)=\"onSelectedColorChanged($event)\"\n >\n <input\n formControlName=\"favoriteColor\"\n type=\"text\"\n [presetColors]=\"swatches\"\n [skyColorpickerInput]=\"colorPicker\"\n />\n @if (favoriteColor.errors?.['opaque']) {\n <sky-form-error\n errorName=\"opaque\"\n errorText=\"Color must have at least 80% opacity.\"\n />\n }\n </sky-colorpicker>\n\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Submit</button>\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.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: SkyColorpickerModule }, { kind: "component", type: i2$1.λ1, selector: "sky-colorpicker", inputs: ["pickerButtonIcon", "label", "labelledBy", "labelText", "labelHidden", "helpKey", "helpPopoverContent", "helpPopoverTitle", "hintText", "stacked", "messageStream", "showResetButton"], outputs: ["selectedColorChanged", "selectedColorApplied"] }, { kind: "directive", type: i2$1.λ2, selector: "[skyColorpickerInput]", inputs: ["skyColorpickerInput", "initialColor", "id", "returnFormat", "outputFormat", "presetColors", "alphaChannel", "allowTransparency"] }, { kind: "component", type: i2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }] }); }
|
|
5619
5620
|
}
|
|
5620
5621
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ColorpickerHelpKeyExampleComponent, decorators: [{
|
|
5621
5622
|
type: Component,
|
|
@@ -5660,7 +5661,7 @@ class ColorpickerProgrammaticExampleComponent {
|
|
|
5660
5661
|
this.colorpickerController.next({ type });
|
|
5661
5662
|
}
|
|
5662
5663
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ColorpickerProgrammaticExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5663
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ColorpickerProgrammaticExampleComponent, isStandalone: true, selector: "app-colorpicker-programmatic-example", ngImport: i0, template: "<form class=\"sky-margin-stacked-xxl\" [formGroup]=\"formGroup\">\n <sky-colorpicker\n #colorPicker\n labelText=\"What is your favorite color?\"\n hintText=\"Pick a color with at least 80% opacity.\"\n [messageStream]=\"colorpickerController\"\n [showResetButton]=\"showResetButton\"\n [stacked]=\"true\"\n >\n <input\n formControlName=\"favoriteColor\"\n type=\"text\"\n [skyColorpickerInput]=\"colorPicker\"\n />\n @if (favoriteColor.errors?.['opaque']) {\n <sky-form-error\n errorName=\"opaque\"\n errorText=\"Color must have at least 80% opacity.\"\n />\n }\n </sky-colorpicker>\n</form>\n\n<button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"openColorpicker()\"\n>\n Open colorpicker\n</button>\n\n<button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"resetColorpicker()\"\n>\n Reset colorpicker\n</button>\n\n<button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"toggleResetButton()\"\n>\n Toggle reset button\n</button>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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: "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: SkyColorpickerModule }, { kind: "component", type: i2$1.λ1, selector: "sky-colorpicker", inputs: ["pickerButtonIcon", "
|
|
5664
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ColorpickerProgrammaticExampleComponent, isStandalone: true, selector: "app-colorpicker-programmatic-example", ngImport: i0, template: "<form class=\"sky-margin-stacked-xxl\" [formGroup]=\"formGroup\">\n <sky-colorpicker\n #colorPicker\n labelText=\"What is your favorite color?\"\n hintText=\"Pick a color with at least 80% opacity.\"\n [messageStream]=\"colorpickerController\"\n [showResetButton]=\"showResetButton\"\n [stacked]=\"true\"\n >\n <input\n formControlName=\"favoriteColor\"\n type=\"text\"\n [skyColorpickerInput]=\"colorPicker\"\n />\n @if (favoriteColor.errors?.['opaque']) {\n <sky-form-error\n errorName=\"opaque\"\n errorText=\"Color must have at least 80% opacity.\"\n />\n }\n </sky-colorpicker>\n</form>\n\n<button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"openColorpicker()\"\n>\n Open colorpicker\n</button>\n\n<button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"resetColorpicker()\"\n>\n Reset colorpicker\n</button>\n\n<button\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"toggleResetButton()\"\n>\n Toggle reset button\n</button>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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: "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: SkyColorpickerModule }, { kind: "component", type: i2$1.λ1, selector: "sky-colorpicker", inputs: ["pickerButtonIcon", "label", "labelledBy", "labelText", "labelHidden", "helpKey", "helpPopoverContent", "helpPopoverTitle", "hintText", "stacked", "messageStream", "showResetButton"], outputs: ["selectedColorChanged", "selectedColorApplied"] }, { kind: "directive", type: i2$1.λ2, selector: "[skyColorpickerInput]", inputs: ["skyColorpickerInput", "initialColor", "id", "returnFormat", "outputFormat", "presetColors", "alphaChannel", "allowTransparency"] }, { kind: "component", type: i2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }] }); }
|
|
5664
5665
|
}
|
|
5665
5666
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ColorpickerProgrammaticExampleComponent, decorators: [{
|
|
5666
5667
|
type: Component,
|
|
@@ -5675,11 +5676,11 @@ class CoreMediaQueryBasicExampleComponent {
|
|
|
5675
5676
|
this.breakpoint = toSignal(inject(SkyMediaQueryService).breakpointChange);
|
|
5676
5677
|
}
|
|
5677
5678
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreMediaQueryBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5678
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: CoreMediaQueryBasicExampleComponent, isStandalone: true, selector: "app-core-media-query-basic-example", ngImport: i0, template: "<p>Current media breakpoint: {{ breakpoint() }}</p>\n\n@if (breakpoint() === 'xs') {\n <nav class=\"my-nav-mobile\">\n <ul>\n <li>\n <button aria-label=\"Home\" type=\"button\">\n <sky-icon
|
|
5679
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: CoreMediaQueryBasicExampleComponent, isStandalone: true, selector: "app-core-media-query-basic-example", ngImport: i0, template: "<p>Current media breakpoint: {{ breakpoint() }}</p>\n\n@if (breakpoint() === 'xs') {\n <nav class=\"my-nav-mobile\">\n <ul>\n <li>\n <button aria-label=\"Home\" type=\"button\">\n <sky-icon iconName=\"building\" />\n </button>\n </li>\n </ul>\n </nav>\n} @else {\n <nav class=\"my-nav-desktop\">\n <ul>\n <li>\n <a href=\"#\">Home</a>\n </li>\n </ul>\n </nav>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }] }); }
|
|
5679
5680
|
}
|
|
5680
5681
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreMediaQueryBasicExampleComponent, decorators: [{
|
|
5681
5682
|
type: Component,
|
|
5682
|
-
args: [{ imports: [CommonModule, SkyIconModule], selector: 'app-core-media-query-basic-example', template: "<p>Current media breakpoint: {{ breakpoint() }}</p>\n\n@if (breakpoint() === 'xs') {\n <nav class=\"my-nav-mobile\">\n <ul>\n <li>\n <button aria-label=\"Home\" type=\"button\">\n <sky-icon
|
|
5683
|
+
args: [{ imports: [CommonModule, SkyIconModule], selector: 'app-core-media-query-basic-example', template: "<p>Current media breakpoint: {{ breakpoint() }}</p>\n\n@if (breakpoint() === 'xs') {\n <nav class=\"my-nav-mobile\">\n <ul>\n <li>\n <button aria-label=\"Home\" type=\"button\">\n <sky-icon iconName=\"building\" />\n </button>\n </li>\n </ul>\n </nav>\n} @else {\n <nav class=\"my-nav-desktop\">\n <ul>\n <li>\n <a href=\"#\">Home</a>\n </li>\n </ul>\n </nav>\n}\n" }]
|
|
5683
5684
|
}] });
|
|
5684
5685
|
|
|
5685
5686
|
class DemoChildComponent {
|
|
@@ -7047,11 +7048,11 @@ class FormsCheckboxIconGroupExampleComponent {
|
|
|
7047
7048
|
console.log(this.formGroup.value);
|
|
7048
7049
|
}
|
|
7049
7050
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsCheckboxIconGroupExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7050
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", 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
|
|
7051
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", 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.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "icon", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "component", type: i2.λ24, selector: "sky-checkbox-group", inputs: ["helpPopoverContent", "helpPopoverTitle", "headingText", "headingHidden", "headingLevel", "headingStyle", "hintText", "required", "stacked", "helpKey"] }] }); }
|
|
7051
7052
|
}
|
|
7052
7053
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsCheckboxIconGroupExampleComponent, decorators: [{
|
|
7053
7054
|
type: Component,
|
|
7054
|
-
args: [{ selector: 'app-forms-checkbox-icon-group-example', imports: [FormsModule, ReactiveFormsModule, SkyCheckboxModule], 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
|
|
7055
|
+
args: [{ selector: 'app-forms-checkbox-icon-group-example', imports: [FormsModule, ReactiveFormsModule, SkyCheckboxModule], 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" }]
|
|
7055
7056
|
}], ctorParameters: () => [] });
|
|
7056
7057
|
|
|
7057
7058
|
/**
|
|
@@ -7485,13 +7486,13 @@ class FormsSelectionBoxRadioExampleComponent {
|
|
|
7485
7486
|
},
|
|
7486
7487
|
{
|
|
7487
7488
|
name: 'Boost engagement',
|
|
7488
|
-
icon: '
|
|
7489
|
+
icon: 'person',
|
|
7489
7490
|
description: 'Encourage supporters to interact with your organization.',
|
|
7490
7491
|
value: 'engagement',
|
|
7491
7492
|
},
|
|
7492
7493
|
{
|
|
7493
7494
|
name: 'Build relationships',
|
|
7494
|
-
icon: '
|
|
7495
|
+
icon: 'people-team',
|
|
7495
7496
|
description: 'Connect to supporters on a personal level and maintain accurate data.',
|
|
7496
7497
|
value: 'relationships',
|
|
7497
7498
|
},
|
|
@@ -7501,7 +7502,7 @@ class FormsSelectionBoxRadioExampleComponent {
|
|
|
7501
7502
|
});
|
|
7502
7503
|
}
|
|
7503
7504
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsSelectionBoxRadioExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7504
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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 [
|
|
7505
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyRadioModule }, { kind: "component", type: i2.λ13, selector: "sky-radio", inputs: ["checked", "disabled", "id", "label", "labelledBy", "name", "tabindex", "value", "helpPopoverContent", "helpPopoverTitle", "icon", "iconName", "radioType", "labelText", "labelHidden", "hintText", "helpKey"], outputs: ["change", "checkedChange", "disabledChange"] }, { kind: "component", type: i2.λ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.λ15, selector: "sky-selection-box-grid", inputs: ["alignItems"] }, { kind: "component", type: i2.λ17, selector: "sky-selection-box", inputs: ["control"] }, { kind: "component", type: i2.λ14, selector: "sky-selection-box-description" }, { kind: "component", type: i2.λ16, selector: "sky-selection-box-header" }] }); }
|
|
7505
7506
|
}
|
|
7506
7507
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsSelectionBoxRadioExampleComponent, decorators: [{
|
|
7507
7508
|
type: Component,
|
|
@@ -7512,7 +7513,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
7512
7513
|
SkyIdModule,
|
|
7513
7514
|
SkyRadioModule,
|
|
7514
7515
|
SkySelectionBoxModule,
|
|
7515
|
-
], 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 [
|
|
7516
|
+
], 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" }]
|
|
7516
7517
|
}], ctorParameters: () => [] });
|
|
7517
7518
|
|
|
7518
7519
|
/**
|
|
@@ -7529,12 +7530,12 @@ class FormsSelectionBoxCheckboxExampleComponent {
|
|
|
7529
7530
|
},
|
|
7530
7531
|
{
|
|
7531
7532
|
name: 'Boost engagement',
|
|
7532
|
-
icon: '
|
|
7533
|
+
icon: 'person',
|
|
7533
7534
|
description: 'Encourage supporters to interact with your organization.',
|
|
7534
7535
|
},
|
|
7535
7536
|
{
|
|
7536
7537
|
name: 'Build relationships',
|
|
7537
|
-
icon: '
|
|
7538
|
+
icon: 'people-team',
|
|
7538
7539
|
description: 'Connect to supporters on a personal level and maintain accurate data.',
|
|
7539
7540
|
},
|
|
7540
7541
|
];
|
|
@@ -7550,7 +7551,7 @@ class FormsSelectionBoxCheckboxExampleComponent {
|
|
|
7550
7551
|
return this.#formBuilder.array(checkboxArray);
|
|
7551
7552
|
}
|
|
7552
7553
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsSelectionBoxCheckboxExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7553
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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 [
|
|
7554
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "icon", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkySelectionBoxModule }, { kind: "component", type: i2.λ15, selector: "sky-selection-box-grid", inputs: ["alignItems"] }, { kind: "component", type: i2.λ17, selector: "sky-selection-box", inputs: ["control"] }, { kind: "component", type: i2.λ14, selector: "sky-selection-box-description" }, { kind: "component", type: i2.λ16, selector: "sky-selection-box-header" }] }); }
|
|
7554
7555
|
}
|
|
7555
7556
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormsSelectionBoxCheckboxExampleComponent, decorators: [{
|
|
7556
7557
|
type: Component,
|
|
@@ -7561,7 +7562,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
7561
7562
|
SkyIconModule,
|
|
7562
7563
|
SkyIdModule,
|
|
7563
7564
|
SkySelectionBoxModule,
|
|
7564
|
-
], 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 [
|
|
7565
|
+
], 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" }]
|
|
7565
7566
|
}], ctorParameters: () => [] });
|
|
7566
7567
|
|
|
7567
7568
|
/**
|
|
@@ -7965,7 +7966,7 @@ class InlineFormRepeatersExampleComponent {
|
|
|
7965
7966
|
this.activeInlineFormId = undefined;
|
|
7966
7967
|
}
|
|
7967
7968
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InlineFormRepeatersExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7968
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: InlineFormRepeatersExampleComponent, isStandalone: true, selector: "app-inline-form-repeaters-example", ngImport: i0, template: "<sky-repeater>\n @for (item of items; track item) {\n <sky-repeater-item\n [inlineFormConfig]=\"inlineFormConfig\"\n [inlineFormTemplate]=\"inlineFormTemplate\"\n [showInlineForm]=\"activeInlineFormId === item.id\"\n (inlineFormClose)=\"onInlineFormClose($event)\"\n >\n <sky-repeater-item-title>\n <div class=\"sky-font-emphasized\">\n {{ item.title }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"showInlineForm(item)\"\n >\n <sky-icon
|
|
7969
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: InlineFormRepeatersExampleComponent, isStandalone: true, selector: "app-inline-form-repeaters-example", ngImport: i0, template: "<sky-repeater>\n @for (item of items; track item) {\n <sky-repeater-item\n [inlineFormConfig]=\"inlineFormConfig\"\n [inlineFormTemplate]=\"inlineFormTemplate\"\n [showInlineForm]=\"activeInlineFormId === item.id\"\n (inlineFormClose)=\"onInlineFormClose($event)\"\n >\n <sky-repeater-item-title>\n <div class=\"sky-font-emphasized\">\n {{ item.title }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"showInlineForm(item)\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </sky-repeater-item-context-menu>\n\n <sky-repeater-item-content>\n {{ item.note }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n\n<ng-template #inlineFormTemplate>\n <form novalidate [formGroup]=\"formGroup\">\n <sky-input-box labelTex=\"Title\" stacked=\"true\">\n <input formControlName=\"title\" type=\"text\" />\n </sky-input-box>\n <sky-input-box labelText=\"Note\">\n <input formControlName=\"note\" type=\"text\" />\n </sky-input-box>\n </form>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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: "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$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2.λ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$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ9, selector: "sky-repeater-item-context-menu" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
7969
7970
|
}
|
|
7970
7971
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InlineFormRepeatersExampleComponent, decorators: [{
|
|
7971
7972
|
type: Component,
|
|
@@ -7975,7 +7976,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
7975
7976
|
SkyIconModule,
|
|
7976
7977
|
SkyInputBoxModule,
|
|
7977
7978
|
SkyRepeaterModule,
|
|
7978
|
-
], template: "<sky-repeater>\n @for (item of items; track item) {\n <sky-repeater-item\n [inlineFormConfig]=\"inlineFormConfig\"\n [inlineFormTemplate]=\"inlineFormTemplate\"\n [showInlineForm]=\"activeInlineFormId === item.id\"\n (inlineFormClose)=\"onInlineFormClose($event)\"\n >\n <sky-repeater-item-title>\n <div class=\"sky-font-emphasized\">\n {{ item.title }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"showInlineForm(item)\"\n >\n <sky-icon
|
|
7979
|
+
], template: "<sky-repeater>\n @for (item of items; track item) {\n <sky-repeater-item\n [inlineFormConfig]=\"inlineFormConfig\"\n [inlineFormTemplate]=\"inlineFormTemplate\"\n [showInlineForm]=\"activeInlineFormId === item.id\"\n (inlineFormClose)=\"onInlineFormClose($event)\"\n >\n <sky-repeater-item-title>\n <div class=\"sky-font-emphasized\">\n {{ item.title }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"showInlineForm(item)\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </sky-repeater-item-context-menu>\n\n <sky-repeater-item-content>\n {{ item.note }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n\n<ng-template #inlineFormTemplate>\n <form novalidate [formGroup]=\"formGroup\">\n <sky-input-box labelTex=\"Title\" stacked=\"true\">\n <input formControlName=\"title\" type=\"text\" />\n </sky-input-box>\n <sky-input-box labelText=\"Note\">\n <input formControlName=\"note\" type=\"text\" />\n </sky-input-box>\n </form>\n</ng-template>\n" }]
|
|
7979
7980
|
}], ctorParameters: () => [] });
|
|
7980
7981
|
|
|
7981
7982
|
/**
|
|
@@ -8008,7 +8009,7 @@ class InlineFormBasicExampleComponent {
|
|
|
8008
8009
|
});
|
|
8009
8010
|
}
|
|
8010
8011
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InlineFormBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8011
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: InlineFormBasicExampleComponent, isStandalone: true, selector: "app-inline-form-basic-example", ngImport: i0, template: "<sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n>\n <table>\n <tr>\n <th>First name:</th>\n <td>\n {{ firstName }}\n </td>\n <td>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"onInlineFormOpen()\"\n >\n <sky-icon
|
|
8012
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: InlineFormBasicExampleComponent, isStandalone: true, selector: "app-inline-form-basic-example", ngImport: i0, template: "<sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n>\n <table>\n <tr>\n <th>First name:</th>\n <td>\n {{ firstName }}\n </td>\n <td>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"onInlineFormOpen()\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </td>\n </tr>\n </table>\n</sky-inline-form>\n\n<ng-template #inlineFormTemplate>\n <form [formGroup]=\"formGroup\">\n <sky-input-box labelText=\"First name\">\n <input formControlName=\"firstName\" type=\"text\" />\n </sky-input-box>\n </form>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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: "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$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyInlineFormModule }, { kind: "component", type: i3$6.λ1, selector: "sky-inline-form", inputs: ["config", "template", "showForm"], outputs: ["close"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2.λ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"] }] }); }
|
|
8012
8013
|
}
|
|
8013
8014
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InlineFormBasicExampleComponent, decorators: [{
|
|
8014
8015
|
type: Component,
|
|
@@ -8018,7 +8019,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
8018
8019
|
SkyIconModule,
|
|
8019
8020
|
SkyInlineFormModule,
|
|
8020
8021
|
SkyInputBoxModule,
|
|
8021
|
-
], template: "<sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n>\n <table>\n <tr>\n <th>First name:</th>\n <td>\n {{ firstName }}\n </td>\n <td>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"onInlineFormOpen()\"\n >\n <sky-icon
|
|
8022
|
+
], template: "<sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n>\n <table>\n <tr>\n <th>First name:</th>\n <td>\n {{ firstName }}\n </td>\n <td>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"onInlineFormOpen()\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </td>\n </tr>\n </table>\n</sky-inline-form>\n\n<ng-template #inlineFormTemplate>\n <form [formGroup]=\"formGroup\">\n <sky-input-box labelText=\"First name\">\n <input formControlName=\"firstName\" type=\"text\" />\n </sky-input-box>\n </form>\n</ng-template>\n" }]
|
|
8022
8023
|
}], ctorParameters: () => [] });
|
|
8023
8024
|
|
|
8024
8025
|
/**
|
|
@@ -8029,11 +8030,11 @@ class IndicatorsWaitElementExampleComponent {
|
|
|
8029
8030
|
this.isWaiting = false;
|
|
8030
8031
|
}
|
|
8031
8032
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IndicatorsWaitElementExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8032
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: IndicatorsWaitElementExampleComponent, isStandalone: true, selector: "app-indicators-wait-element-example", ngImport: i0, template: "<button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"isWaiting = !isWaiting\"\n>\n Toggle wait\n</button>\n\n<div
|
|
8033
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: IndicatorsWaitElementExampleComponent, isStandalone: true, selector: "app-indicators-wait-element-example", ngImport: i0, template: "<button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"isWaiting = !isWaiting\"\n>\n Toggle wait\n</button>\n\n<div class=\"wrapper\">\n The <code>sky-wait</code> directive can apply to a large area.\n <sky-wait data-sky-id=\"wait-example\" [isWaiting]=\"isWaiting\" />\n</div>\n", styles: [".wrapper{height:200px;width:200px;margin:10px}\n"], dependencies: [{ kind: "ngmodule", type: SkyWaitModule }, { kind: "component", type: i1$2.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking", "screenReaderCompletedText"] }] }); }
|
|
8033
8034
|
}
|
|
8034
8035
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IndicatorsWaitElementExampleComponent, decorators: [{
|
|
8035
8036
|
type: Component,
|
|
8036
|
-
args: [{ selector: 'app-indicators-wait-element-example', imports: [SkyWaitModule], template: "<button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"isWaiting = !isWaiting\"\n>\n Toggle wait\n</button>\n\n<div
|
|
8037
|
+
args: [{ selector: 'app-indicators-wait-element-example', imports: [SkyWaitModule], template: "<button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"isWaiting = !isWaiting\"\n>\n Toggle wait\n</button>\n\n<div class=\"wrapper\">\n The <code>sky-wait</code> directive can apply to a large area.\n <sky-wait data-sky-id=\"wait-example\" [isWaiting]=\"isWaiting\" />\n</div>\n", styles: [".wrapper{height:200px;width:200px;margin:10px}\n"] }]
|
|
8037
8038
|
}] });
|
|
8038
8039
|
|
|
8039
8040
|
/**
|
|
@@ -8105,7 +8106,7 @@ class InlineFormCustomButtonsExampleComponent {
|
|
|
8105
8106
|
});
|
|
8106
8107
|
}
|
|
8107
8108
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InlineFormCustomButtonsExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8108
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: InlineFormCustomButtonsExampleComponent, isStandalone: true, selector: "app-inline-form-custom-buttons-example", ngImport: i0, template: "<sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n>\n <table>\n <tr>\n <th>First name:</th>\n <td>\n {{ firstName }}\n </td>\n <td>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"onInlineFormOpen()\"\n >\n <sky-icon
|
|
8109
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: InlineFormCustomButtonsExampleComponent, isStandalone: true, selector: "app-inline-form-custom-buttons-example", ngImport: i0, template: "<sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n>\n <table>\n <tr>\n <th>First name:</th>\n <td>\n {{ firstName }}\n </td>\n <td>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"onInlineFormOpen()\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </td>\n </tr>\n </table>\n</sky-inline-form>\n\n<ng-template #inlineFormTemplate>\n <form [formGroup]=\"formGroup\">\n <sky-input-box labelText=\"First name\">\n <input formControlName=\"firstName\" required type=\"text\" />\n </sky-input-box>\n </form>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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: "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$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyInlineFormModule }, { kind: "component", type: i3$6.λ1, selector: "sky-inline-form", inputs: ["config", "template", "showForm"], outputs: ["close"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2.λ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"] }] }); }
|
|
8109
8110
|
}
|
|
8110
8111
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InlineFormCustomButtonsExampleComponent, decorators: [{
|
|
8111
8112
|
type: Component,
|
|
@@ -8115,11 +8116,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
8115
8116
|
SkyIconModule,
|
|
8116
8117
|
SkyInlineFormModule,
|
|
8117
8118
|
SkyInputBoxModule,
|
|
8118
|
-
], template: "<sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n>\n <table>\n <tr>\n <th>First name:</th>\n <td>\n {{ firstName }}\n </td>\n <td>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"onInlineFormOpen()\"\n >\n <sky-icon
|
|
8119
|
+
], template: "<sky-inline-form\n [config]=\"inlineFormConfig\"\n [showForm]=\"showForm\"\n [template]=\"inlineFormTemplate\"\n (close)=\"onInlineFormClose($event)\"\n>\n <table>\n <tr>\n <th>First name:</th>\n <td>\n {{ firstName }}\n </td>\n <td>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"onInlineFormOpen()\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </td>\n </tr>\n </table>\n</sky-inline-form>\n\n<ng-template #inlineFormTemplate>\n <form [formGroup]=\"formGroup\">\n <sky-input-box labelText=\"First name\">\n <input formControlName=\"firstName\" required type=\"text\" />\n </sky-input-box>\n </form>\n</ng-template>\n" }]
|
|
8119
8120
|
}], ctorParameters: () => [] });
|
|
8120
8121
|
|
|
8121
8122
|
/**
|
|
8122
8123
|
* @title Infinite scroll with back to top directive
|
|
8124
|
+
* @docsDemoHidden
|
|
8123
8125
|
*/
|
|
8124
8126
|
class LayoutBackToTopInfiniteScrollExampleComponent {
|
|
8125
8127
|
constructor() {
|
|
@@ -8233,10 +8235,10 @@ class LayoutBackToTopInfiniteScrollExampleComponent {
|
|
|
8233
8235
|
];
|
|
8234
8236
|
}
|
|
8235
8237
|
ngOnInit() {
|
|
8236
|
-
void this.#addData(0,
|
|
8238
|
+
void this.#addData(0, 10);
|
|
8237
8239
|
}
|
|
8238
8240
|
onScrollEnd() {
|
|
8239
|
-
void this.#addData(this.personList.length,
|
|
8241
|
+
void this.#addData(this.personList.length, 10);
|
|
8240
8242
|
}
|
|
8241
8243
|
async #addData(start, rowSize) {
|
|
8242
8244
|
if (this.hasMore) {
|
|
@@ -8265,11 +8267,11 @@ class LayoutBackToTopInfiniteScrollExampleComponent {
|
|
|
8265
8267
|
});
|
|
8266
8268
|
}
|
|
8267
8269
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutBackToTopInfiniteScrollExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8268
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LayoutBackToTopInfiniteScrollExampleComponent, isStandalone: true, selector: "app-layout-back-to-top-infinite-scroll-example", ngImport: i0, template: "<sky-repeater skyBackToTop>\n @for (person of personList; track person) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ person.name }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ person.address }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n<sky-infinite-scroll [enabled]=\"hasMore\" (scrollEnd)=\"onScrollEnd()\" />\n", dependencies: [{ kind: "ngmodule", type: SkyBackToTopModule }, { kind: "directive", type: i1$5.λ7, selector: "[skyBackToTop]", inputs: ["skyBackToTop", "skyBackToTopMessageStream"] }, { kind: "ngmodule", type: SkyInfiniteScrollModule }, { kind: "component", type: i2$7.λ6, selector: "sky-infinite-scroll", inputs: ["enabled", "loading"], outputs: ["scrollEnd"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
8270
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LayoutBackToTopInfiniteScrollExampleComponent, isStandalone: true, selector: "app-layout-back-to-top-infinite-scroll-example", ngImport: i0, template: "<div class=\"target\"></div>\n<sky-repeater skyBackToTop>\n @for (person of personList; track person) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ person.name }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ person.address }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n<sky-infinite-scroll [enabled]=\"hasMore\" (scrollEnd)=\"onScrollEnd()\" />\n", dependencies: [{ kind: "ngmodule", type: SkyBackToTopModule }, { kind: "directive", type: i1$5.λ7, selector: "[skyBackToTop]", inputs: ["skyBackToTop", "skyBackToTopMessageStream"] }, { kind: "ngmodule", type: SkyInfiniteScrollModule }, { kind: "component", type: i2$7.λ6, selector: "sky-infinite-scroll", inputs: ["enabled", "loading"], outputs: ["scrollEnd"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
8269
8271
|
}
|
|
8270
8272
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutBackToTopInfiniteScrollExampleComponent, decorators: [{
|
|
8271
8273
|
type: Component,
|
|
8272
|
-
args: [{ selector: 'app-layout-back-to-top-infinite-scroll-example', imports: [SkyBackToTopModule, SkyInfiniteScrollModule, SkyRepeaterModule], template: "<sky-repeater skyBackToTop>\n @for (person of personList; track person) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ person.name }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ person.address }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n<sky-infinite-scroll [enabled]=\"hasMore\" (scrollEnd)=\"onScrollEnd()\" />\n" }]
|
|
8274
|
+
args: [{ selector: 'app-layout-back-to-top-infinite-scroll-example', imports: [SkyBackToTopModule, SkyInfiniteScrollModule, SkyRepeaterModule], template: "<div class=\"target\"></div>\n<sky-repeater skyBackToTop>\n @for (person of personList; track person) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ person.name }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ person.address }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n<sky-infinite-scroll [enabled]=\"hasMore\" (scrollEnd)=\"onScrollEnd()\" />\n" }]
|
|
8273
8275
|
}] });
|
|
8274
8276
|
|
|
8275
8277
|
/**
|
|
@@ -8329,11 +8331,11 @@ class LayoutActionButtonPermalinkExampleComponent {
|
|
|
8329
8331
|
};
|
|
8330
8332
|
}
|
|
8331
8333
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutActionButtonPermalinkExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8332
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", 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
|
|
8334
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", 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: ["iconType", "iconName"] }] }); }
|
|
8333
8335
|
}
|
|
8334
8336
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutActionButtonPermalinkExampleComponent, decorators: [{
|
|
8335
8337
|
type: Component,
|
|
8336
|
-
args: [{ selector: 'app-layout-action-button-permalink-example', imports: [SkyActionButtonModule], template: "<sky-action-button-container>\n <sky-action-button [permalink]=\"url\">\n <sky-action-button-icon
|
|
8338
|
+
args: [{ selector: 'app-layout-action-button-permalink-example', imports: [SkyActionButtonModule], 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" }]
|
|
8337
8339
|
}] });
|
|
8338
8340
|
|
|
8339
8341
|
/**
|
|
@@ -8347,15 +8349,16 @@ class LayoutActionButtonBasicExampleComponent {
|
|
|
8347
8349
|
alert('Open action clicked');
|
|
8348
8350
|
}
|
|
8349
8351
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutActionButtonBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8350
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", 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
|
|
8352
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", 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: ["iconType", "iconName"] }] }); }
|
|
8351
8353
|
}
|
|
8352
8354
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutActionButtonBasicExampleComponent, decorators: [{
|
|
8353
8355
|
type: Component,
|
|
8354
|
-
args: [{ selector: 'app-layout-action-button-basic-example', imports: [SkyActionButtonModule], template: "<sky-action-button-container>\n <sky-action-button (actionClick)=\"filterActionClick()\">\n <sky-action-button-icon
|
|
8356
|
+
args: [{ selector: 'app-layout-action-button-basic-example', imports: [SkyActionButtonModule], 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" }]
|
|
8355
8357
|
}] });
|
|
8356
8358
|
|
|
8357
8359
|
/**
|
|
8358
8360
|
* @title Repeater with back to top directive
|
|
8361
|
+
* @docsDemoHidden
|
|
8359
8362
|
*/
|
|
8360
8363
|
class LayoutBackToTopRepeaterExampleComponent {
|
|
8361
8364
|
constructor() {
|
|
@@ -8467,11 +8470,11 @@ class LayoutBackToTopRepeaterExampleComponent {
|
|
|
8467
8470
|
];
|
|
8468
8471
|
}
|
|
8469
8472
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutBackToTopRepeaterExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8470
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LayoutBackToTopRepeaterExampleComponent, isStandalone: true, selector: "app-layout-back-to-top-repeater-example", ngImport: i0, template: "<sky-repeater skyBackToTop>\n @for (person of personList; track person) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ person.name }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ person.address }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n", dependencies: [{ kind: "ngmodule", type: SkyBackToTopModule }, { kind: "directive", type: i1$5.λ7, selector: "[skyBackToTop]", inputs: ["skyBackToTop", "skyBackToTopMessageStream"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
8473
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LayoutBackToTopRepeaterExampleComponent, isStandalone: true, selector: "app-layout-back-to-top-repeater-example", ngImport: i0, template: "<div class=\"target\"></div>\n<sky-repeater skyBackToTop>\n @for (person of personList; track person) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ person.name }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ person.address }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n", dependencies: [{ kind: "ngmodule", type: SkyBackToTopModule }, { kind: "directive", type: i1$5.λ7, selector: "[skyBackToTop]", inputs: ["skyBackToTop", "skyBackToTopMessageStream"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
8471
8474
|
}
|
|
8472
8475
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutBackToTopRepeaterExampleComponent, decorators: [{
|
|
8473
8476
|
type: Component,
|
|
8474
|
-
args: [{ selector: 'app-layout-back-to-top-repeater-example', imports: [SkyBackToTopModule, SkyRepeaterModule], template: "<sky-repeater skyBackToTop>\n @for (person of personList; track person) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ person.name }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ person.address }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n" }]
|
|
8477
|
+
args: [{ selector: 'app-layout-back-to-top-repeater-example', imports: [SkyBackToTopModule, SkyRepeaterModule], template: "<div class=\"target\"></div>\n<sky-repeater skyBackToTop>\n @for (person of personList; track person) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ person.name }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ person.address }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n" }]
|
|
8475
8478
|
}] });
|
|
8476
8479
|
|
|
8477
8480
|
/**
|
|
@@ -8676,11 +8679,11 @@ class LayoutInlineDeleteCustomExampleComponent {
|
|
|
8676
8679
|
this.pending = true;
|
|
8677
8680
|
}
|
|
8678
8681
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutInlineDeleteCustomExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8679
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LayoutInlineDeleteCustomExampleComponent, isStandalone: true, selector: "app-layout-inline-delete-custom-example", ngImport: i0, template: "<div class=\"inline-delete-container\">\n <strong>Custom content</strong>\n <div>\n <button\n class=\"sky-btn sky-btn-danger inline-delete-trigger\"\n type=\"button\"\n (click)=\"deleteItem()\"\n >\n <sky-icon
|
|
8682
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LayoutInlineDeleteCustomExampleComponent, isStandalone: true, selector: "app-layout-inline-delete-custom-example", ngImport: i0, template: "<div class=\"inline-delete-container\">\n <strong>Custom content</strong>\n <div>\n <button\n class=\"sky-btn sky-btn-danger inline-delete-trigger\"\n type=\"button\"\n (click)=\"deleteItem()\"\n >\n <sky-icon iconName=\"delete\" />\n </button>\n </div>\n @if (deleting) {\n <sky-inline-delete\n [pending]=\"pending\"\n (cancelTriggered)=\"onCancelTriggered()\"\n (deleteTriggered)=\"onDeleteTriggered()\"\n />\n }\n</div>\n", styles: [".inline-delete-container{padding:15px;background-color:#fff;border:black solid 1px;height:400px;width:400px;position:relative}.inline-delete-trigger{position:absolute;bottom:10px;left:0;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyInlineDeleteModule }, { kind: "component", type: i1$5.λ8, selector: "sky-inline-delete", inputs: ["pending"], outputs: ["cancelTriggered", "deleteTriggered"] }] }); }
|
|
8680
8683
|
}
|
|
8681
8684
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutInlineDeleteCustomExampleComponent, decorators: [{
|
|
8682
8685
|
type: Component,
|
|
8683
|
-
args: [{ selector: 'app-layout-inline-delete-custom-example', imports: [SkyIconModule, SkyInlineDeleteModule], template: "<div class=\"inline-delete-container\">\n <strong>Custom content</strong>\n <div>\n <button\n class=\"sky-btn sky-btn-danger inline-delete-trigger\"\n type=\"button\"\n (click)=\"deleteItem()\"\n >\n <sky-icon
|
|
8686
|
+
args: [{ selector: 'app-layout-inline-delete-custom-example', imports: [SkyIconModule, SkyInlineDeleteModule], template: "<div class=\"inline-delete-container\">\n <strong>Custom content</strong>\n <div>\n <button\n class=\"sky-btn sky-btn-danger inline-delete-trigger\"\n type=\"button\"\n (click)=\"deleteItem()\"\n >\n <sky-icon iconName=\"delete\" />\n </button>\n </div>\n @if (deleting) {\n <sky-inline-delete\n [pending]=\"pending\"\n (cancelTriggered)=\"onCancelTriggered()\"\n (deleteTriggered)=\"onDeleteTriggered()\"\n />\n }\n</div>\n", styles: [".inline-delete-container{padding:15px;background-color:#fff;border:black solid 1px;height:400px;width:400px;position:relative}.inline-delete-trigger{position:absolute;bottom:10px;left:0;width:100%}\n"] }]
|
|
8684
8687
|
}] });
|
|
8685
8688
|
|
|
8686
8689
|
/**
|
|
@@ -8753,11 +8756,11 @@ class LayoutInlineDeleteRepeaterExampleComponent {
|
|
|
8753
8756
|
this.repeaterDemoShownInlineDeletes = [];
|
|
8754
8757
|
}
|
|
8755
8758
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutInlineDeleteRepeaterExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8756
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LayoutInlineDeleteRepeaterExampleComponent, isStandalone: true, selector: "app-layout-inline-delete-repeater-example", ngImport: i0, template: "<sky-repeater
|
|
8759
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LayoutInlineDeleteRepeaterExampleComponent, isStandalone: true, selector: "app-layout-inline-delete-repeater-example", ngImport: i0, template: "<sky-repeater>\n @for (item of repeaterDemoItems; track item) {\n <sky-repeater-item>\n <sky-repeater-item-context-menu>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button type=\"button\" (click)=\"showInlineDelete(item.title)\">\n Delete\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n <sky-repeater-item-title class=\"sky-example-inline-delete-flex\">\n <div>\n {{ item.title }}\n </div>\n <div>\n {{ item.cost }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ item.description }}\n </sky-repeater-item-content>\n @if (repeaterDemoShownInlineDeletes.indexOf(item.title) >= 0) {\n <sky-inline-delete\n (cancelTriggered)=\"cancelDeletion(item.title)\"\n (deleteTriggered)=\"deleteItem(item.title)\"\n />\n }\n </sky-repeater-item>\n }\n</sky-repeater>\n\n<button class=\"sky-btn sky-btn-primary\" type=\"button\" (click)=\"onResetClick()\">\n Reset Repeater\n</button>\n", dependencies: [{ kind: "ngmodule", type: SkyDropdownModule }, { kind: "component", type: i1$7.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i1$7.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i1$7.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "ngmodule", type: SkyInlineDeleteModule }, { kind: "component", type: i1$5.λ8, selector: "sky-inline-delete", inputs: ["pending"], outputs: ["cancelTriggered", "deleteTriggered"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ9, selector: "sky-repeater-item-context-menu" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
8757
8760
|
}
|
|
8758
8761
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutInlineDeleteRepeaterExampleComponent, decorators: [{
|
|
8759
8762
|
type: Component,
|
|
8760
|
-
args: [{ selector: 'app-layout-inline-delete-repeater-example', imports: [SkyDropdownModule, SkyInlineDeleteModule, SkyRepeaterModule], template: "<sky-repeater
|
|
8763
|
+
args: [{ selector: 'app-layout-inline-delete-repeater-example', imports: [SkyDropdownModule, SkyInlineDeleteModule, SkyRepeaterModule], template: "<sky-repeater>\n @for (item of repeaterDemoItems; track item) {\n <sky-repeater-item>\n <sky-repeater-item-context-menu>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button type=\"button\" (click)=\"showInlineDelete(item.title)\">\n Delete\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n <sky-repeater-item-title class=\"sky-example-inline-delete-flex\">\n <div>\n {{ item.title }}\n </div>\n <div>\n {{ item.cost }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n {{ item.description }}\n </sky-repeater-item-content>\n @if (repeaterDemoShownInlineDeletes.indexOf(item.title) >= 0) {\n <sky-inline-delete\n (cancelTriggered)=\"cancelDeletion(item.title)\"\n (deleteTriggered)=\"deleteItem(item.title)\"\n />\n }\n </sky-repeater-item>\n }\n</sky-repeater>\n\n<button class=\"sky-btn sky-btn-primary\" type=\"button\" (click)=\"onResetClick()\">\n Reset Repeater\n</button>\n" }]
|
|
8761
8764
|
}] });
|
|
8762
8765
|
|
|
8763
8766
|
/**
|
|
@@ -8795,6 +8798,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
8795
8798
|
|
|
8796
8799
|
/**
|
|
8797
8800
|
* @title Page with basic setup
|
|
8801
|
+
* @docsDemoHidden
|
|
8798
8802
|
*/
|
|
8799
8803
|
class LayoutPageLayoutFitExampleComponent {
|
|
8800
8804
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutPageLayoutFitExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
@@ -8873,11 +8877,11 @@ class LayoutToolbarBasicExampleComponent {
|
|
|
8873
8877
|
alert(buttonText + ' clicked!');
|
|
8874
8878
|
}
|
|
8875
8879
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutToolbarBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8876
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: LayoutToolbarBasicExampleComponent, isStandalone: true, selector: "app-layout-toolbar-basic-example", ngImport: i0, template: "<sky-toolbar data-sky-id=\"basic-toolbar\">\n <sky-toolbar-item data-sky-id=\"toolbar-item-1\">\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 1')\"\n >\n Button 1\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"toolbar-item-2\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 2')\"\n >\n Button 2\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort descending\"\n type=\"button\"\n (click)=\"onButtonClicked('Expand')\"\n >\n <sky-icon
|
|
8880
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: LayoutToolbarBasicExampleComponent, isStandalone: true, selector: "app-layout-toolbar-basic-example", ngImport: i0, template: "<sky-toolbar data-sky-id=\"basic-toolbar\">\n <sky-toolbar-item data-sky-id=\"toolbar-item-1\">\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 1')\"\n >\n Button 1\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"toolbar-item-2\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 2')\"\n >\n Button 2\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort descending\"\n type=\"button\"\n (click)=\"onButtonClicked('Expand')\"\n >\n <sky-icon iconName=\"chevron-double-down\" />\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort ascending\"\n type=\"button\"\n (click)=\"onButtonClicked('Collapse')\"\n >\n <sky-icon iconName=\"chevron-double-up\" />\n </button>\n </sky-toolbar-view-actions>\n</sky-toolbar>\n", dependencies: [{ kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { 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.λ40, selector: "sky-toolbar-view-actions" }] }); }
|
|
8877
8881
|
}
|
|
8878
8882
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutToolbarBasicExampleComponent, decorators: [{
|
|
8879
8883
|
type: Component,
|
|
8880
|
-
args: [{ selector: 'app-layout-toolbar-basic-example', imports: [SkyIconModule, SkyToolbarModule], template: "<sky-toolbar data-sky-id=\"basic-toolbar\">\n <sky-toolbar-item data-sky-id=\"toolbar-item-1\">\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 1')\"\n >\n Button 1\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"toolbar-item-2\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 2')\"\n >\n Button 2\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort descending\"\n type=\"button\"\n (click)=\"onButtonClicked('Expand')\"\n >\n <sky-icon
|
|
8884
|
+
args: [{ selector: 'app-layout-toolbar-basic-example', imports: [SkyIconModule, SkyToolbarModule], template: "<sky-toolbar data-sky-id=\"basic-toolbar\">\n <sky-toolbar-item data-sky-id=\"toolbar-item-1\">\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 1')\"\n >\n Button 1\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"toolbar-item-2\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 2')\"\n >\n Button 2\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort descending\"\n type=\"button\"\n (click)=\"onButtonClicked('Expand')\"\n >\n <sky-icon iconName=\"chevron-double-down\" />\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort ascending\"\n type=\"button\"\n (click)=\"onButtonClicked('Collapse')\"\n >\n <sky-icon iconName=\"chevron-double-up\" />\n </button>\n </sky-toolbar-view-actions>\n</sky-toolbar>\n" }]
|
|
8881
8885
|
}] });
|
|
8882
8886
|
|
|
8883
8887
|
/**
|
|
@@ -8903,11 +8907,11 @@ class LayoutToolbarSectionedExampleComponent {
|
|
|
8903
8907
|
alert(buttonText + ' clicked!');
|
|
8904
8908
|
}
|
|
8905
8909
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutToolbarSectionedExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8906
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: LayoutToolbarSectionedExampleComponent, isStandalone: true, selector: "app-layout-toolbar-sectioned-example", ngImport: i0, template: "<sky-toolbar data-sky-id=\"sectioned-toolbar\">\n <sky-toolbar-section data-sky-id=\"top-section\">\n <sky-toolbar-item data-sky-id=\"toolbar-item-1\">\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 1')\"\n >\n Button 1\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"toolbar-item-2\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 2')\"\n >\n Button 2\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort descending\"\n type=\"button\"\n (click)=\"onButtonClicked('Expand')\"\n >\n <sky-icon
|
|
8910
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: LayoutToolbarSectionedExampleComponent, isStandalone: true, selector: "app-layout-toolbar-sectioned-example", ngImport: i0, template: "<sky-toolbar data-sky-id=\"sectioned-toolbar\">\n <sky-toolbar-section data-sky-id=\"top-section\">\n <sky-toolbar-item data-sky-id=\"toolbar-item-1\">\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 1')\"\n >\n Button 1\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"toolbar-item-2\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 2')\"\n >\n Button 2\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort descending\"\n type=\"button\"\n (click)=\"onButtonClicked('Expand')\"\n >\n <sky-icon iconName=\"chevron-double-down\" />\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort ascending\"\n type=\"button\"\n (click)=\"onButtonClicked('Collapse')\"\n >\n <sky-icon iconName=\"chevron-double-up\" />\n </button>\n </sky-toolbar-view-actions>\n </sky-toolbar-section>\n <sky-toolbar-section data-sky-id=\"bottom-section\">\n <sky-toolbar-item data-sky-id=\"sort-button\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Sort')\"\n >\n <sky-icon iconName=\"arrow-bidirectional-up-down\" />\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"filter-button\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Filter')\"\n >\n <sky-icon iconName=\"filter\" />\n </button>\n </sky-toolbar-item>\n </sky-toolbar-section>\n</sky-toolbar>\n", dependencies: [{ kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { 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" }, { kind: "component", type: i1$5.λ40, selector: "sky-toolbar-view-actions" }] }); }
|
|
8907
8911
|
}
|
|
8908
8912
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutToolbarSectionedExampleComponent, decorators: [{
|
|
8909
8913
|
type: Component,
|
|
8910
|
-
args: [{ selector: 'app-layout-toolbar-sectioned-example', imports: [SkyIconModule, SkyToolbarModule], template: "<sky-toolbar data-sky-id=\"sectioned-toolbar\">\n <sky-toolbar-section data-sky-id=\"top-section\">\n <sky-toolbar-item data-sky-id=\"toolbar-item-1\">\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 1')\"\n >\n Button 1\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"toolbar-item-2\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 2')\"\n >\n Button 2\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort descending\"\n type=\"button\"\n (click)=\"onButtonClicked('Expand')\"\n >\n <sky-icon
|
|
8914
|
+
args: [{ selector: 'app-layout-toolbar-sectioned-example', imports: [SkyIconModule, SkyToolbarModule], template: "<sky-toolbar data-sky-id=\"sectioned-toolbar\">\n <sky-toolbar-section data-sky-id=\"top-section\">\n <sky-toolbar-item data-sky-id=\"toolbar-item-1\">\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 1')\"\n >\n Button 1\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"toolbar-item-2\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Button 2')\"\n >\n Button 2\n </button>\n </sky-toolbar-item>\n <sky-toolbar-view-actions>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort descending\"\n type=\"button\"\n (click)=\"onButtonClicked('Expand')\"\n >\n <sky-icon iconName=\"chevron-double-down\" />\n </button>\n <button\n class=\"sky-btn sky-btn-default sky-btn-icon\"\n title=\"Sort ascending\"\n type=\"button\"\n (click)=\"onButtonClicked('Collapse')\"\n >\n <sky-icon iconName=\"chevron-double-up\" />\n </button>\n </sky-toolbar-view-actions>\n </sky-toolbar-section>\n <sky-toolbar-section data-sky-id=\"bottom-section\">\n <sky-toolbar-item data-sky-id=\"sort-button\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Sort')\"\n >\n <sky-icon iconName=\"arrow-bidirectional-up-down\" />\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item data-sky-id=\"filter-button\">\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"onButtonClicked('Filter')\"\n >\n <sky-icon iconName=\"filter\" />\n </button>\n </sky-toolbar-item>\n </sky-toolbar-section>\n</sky-toolbar>\n" }]
|
|
8911
8915
|
}] });
|
|
8912
8916
|
|
|
8913
8917
|
/**
|
|
@@ -9009,7 +9013,7 @@ class ListsFilterInlineExampleComponent {
|
|
|
9009
9013
|
return result;
|
|
9010
9014
|
}
|
|
9011
9015
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsFilterInlineExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9012
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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 [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>\n <sky-filter-inline-item>\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>\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.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "icon", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyFilterModule }, { kind: "component", type: i2$7.λ1, selector: "sky-filter-button", inputs: ["filterButtonId", "ariaControls", "ariaExpanded", "ariaLabel", "active", "disabled", "showButtonText"], outputs: ["filterButtonClick"] }, { kind: "component", type: i2$7.λ2, selector: "sky-filter-inline" }, { kind: "component", type: i2$7.λ3, selector: "sky-filter-inline-item" }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2.λ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$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ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" }] }); }
|
|
9016
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "icon", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "ngmodule", type: SkyFilterModule }, { kind: "component", type: i2$7.λ1, selector: "sky-filter-button", inputs: ["filterButtonId", "ariaControls", "ariaExpanded", "ariaLabel", "active", "disabled", "showButtonText"], outputs: ["filterButtonClick"] }, { kind: "component", type: i2$7.λ2, selector: "sky-filter-inline" }, { kind: "component", type: i2$7.λ3, selector: "sky-filter-inline-item" }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2.λ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$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ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" }] }); }
|
|
9013
9017
|
}
|
|
9014
9018
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsFilterInlineExampleComponent, decorators: [{
|
|
9015
9019
|
type: Component,
|
|
@@ -9021,7 +9025,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
9021
9025
|
SkyInputBoxModule,
|
|
9022
9026
|
SkyRepeaterModule,
|
|
9023
9027
|
SkyToolbarModule,
|
|
9024
|
-
], template: "<sky-toolbar>\n <sky-toolbar-section>\n <sky-toolbar-item>\n <sky-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>\n <sky-filter-inline-item>\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>\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" }]
|
|
9028
|
+
], 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" }]
|
|
9025
9029
|
}], ctorParameters: () => [] });
|
|
9026
9030
|
|
|
9027
9031
|
class FilterModalContext {
|
|
@@ -9186,11 +9190,11 @@ class ListsFilterModalExampleComponent {
|
|
|
9186
9190
|
return (filter.name === 'hideOrange' && !!filter.value && item.color === 'orange');
|
|
9187
9191
|
}
|
|
9188
9192
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsFilterModalExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9189
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsFilterModalExampleComponent, isStandalone: true, selector: "app-lists-filter-modal-example", ngImport: i0, template: "<sky-toolbar>\n <sky-toolbar-section>\n <sky-toolbar-item>\n <sky-filter-button\n [showButtonText]=\"true\"\n (filterButtonClick)=\"onModalFilterButtonClick()\"\n />\n </sky-toolbar-item>\n </sky-toolbar-section>\n @if (appliedFilters && appliedFilters.length > 0) {\n <sky-toolbar-section>\n <sky-filter-summary>\n @for (item of appliedFilters; track item; let i = $index) {\n <sky-filter-summary-item (dismiss)=\"onDismiss(i)\">\n {{ item.label }}\n </sky-filter-summary-item>\n }\n </sky-filter-summary>\n </sky-toolbar-section>\n }\n</sky-toolbar>\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: SkyFilterModule }, { kind: "component", type: i2$7.λ1, selector: "sky-filter-button", inputs: ["filterButtonId", "ariaControls", "ariaExpanded", "ariaLabel", "active", "disabled", "showButtonText"], outputs: ["filterButtonClick"] }, { kind: "component", type: i2$7.λ5, selector: "sky-filter-summary" }, { kind: "component", type: i2$7.λ4, selector: "sky-filter-summary-item", inputs: ["dismissible"], outputs: ["dismiss", "itemClick"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ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" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9193
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsFilterModalExampleComponent, isStandalone: true, selector: "app-lists-filter-modal-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 [showButtonText]=\"true\"\n (filterButtonClick)=\"onModalFilterButtonClick()\"\n />\n </sky-toolbar-item>\n </sky-toolbar-section>\n @if (appliedFilters && appliedFilters.length > 0) {\n <sky-toolbar-section>\n <sky-filter-summary data-sky-id=\"filter-summary\">\n @for (item of appliedFilters; track item; let i = $index) {\n <sky-filter-summary-item (dismiss)=\"onDismiss(i)\">\n {{ item.label }}\n </sky-filter-summary-item>\n }\n </sky-filter-summary>\n </sky-toolbar-section>\n }\n</sky-toolbar>\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: SkyFilterModule }, { kind: "component", type: i2$7.λ1, selector: "sky-filter-button", inputs: ["filterButtonId", "ariaControls", "ariaExpanded", "ariaLabel", "active", "disabled", "showButtonText"], outputs: ["filterButtonClick"] }, { kind: "component", type: i2$7.λ5, selector: "sky-filter-summary" }, { kind: "component", type: i2$7.λ4, selector: "sky-filter-summary-item", inputs: ["dismissible"], outputs: ["dismiss", "itemClick"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ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" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9190
9194
|
}
|
|
9191
9195
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsFilterModalExampleComponent, decorators: [{
|
|
9192
9196
|
type: Component,
|
|
9193
|
-
args: [{ selector: 'app-lists-filter-modal-example', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SkyFilterModule, SkyRepeaterModule, SkyToolbarModule], template: "<sky-toolbar>\n <sky-toolbar-section>\n <sky-toolbar-item>\n <sky-filter-button\n [showButtonText]=\"true\"\n (filterButtonClick)=\"onModalFilterButtonClick()\"\n />\n </sky-toolbar-item>\n </sky-toolbar-section>\n @if (appliedFilters && appliedFilters.length > 0) {\n <sky-toolbar-section>\n <sky-filter-summary>\n @for (item of appliedFilters; track item; let i = $index) {\n <sky-filter-summary-item (dismiss)=\"onDismiss(i)\">\n {{ item.label }}\n </sky-filter-summary-item>\n }\n </sky-filter-summary>\n </sky-toolbar-section>\n }\n</sky-toolbar>\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" }]
|
|
9197
|
+
args: [{ selector: 'app-lists-filter-modal-example', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SkyFilterModule, SkyRepeaterModule, SkyToolbarModule], template: "<sky-toolbar>\n <sky-toolbar-section>\n <sky-toolbar-item>\n <sky-filter-button\n data-sky-id=\"my-filter-button\"\n [showButtonText]=\"true\"\n (filterButtonClick)=\"onModalFilterButtonClick()\"\n />\n </sky-toolbar-item>\n </sky-toolbar-section>\n @if (appliedFilters && appliedFilters.length > 0) {\n <sky-toolbar-section>\n <sky-filter-summary data-sky-id=\"filter-summary\">\n @for (item of appliedFilters; track item; let i = $index) {\n <sky-filter-summary-item (dismiss)=\"onDismiss(i)\">\n {{ item.label }}\n </sky-filter-summary-item>\n }\n </sky-filter-summary>\n </sky-toolbar-section>\n }\n</sky-toolbar>\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" }]
|
|
9194
9198
|
}], ctorParameters: () => [] });
|
|
9195
9199
|
|
|
9196
9200
|
const people$7 = [
|
|
@@ -9388,11 +9392,11 @@ class ListsRepeaterAddRemoveExampleComponent {
|
|
|
9388
9392
|
this.items = this.items.filter((item) => !item.isSelected);
|
|
9389
9393
|
}
|
|
9390
9394
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsRepeaterAddRemoveExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9391
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsRepeaterAddRemoveExampleComponent, isStandalone: true, selector: "app-lists-repeater-add-remove-example", ngImport: i0, template: "<div class=\"sky-margin-stacked-lg\">\n <sky-repeater\n data-sky-id=\"repeater-example\"\n [expandMode]=\"'single'\"\n [reorderable]=\"true\"\n (orderChange)=\"changeItems($event)\"\n >\n @for (item of items; track item) {\n <sky-repeater-item\n [selectable]=\"true\"\n [tag]=\"item.note\"\n [(isSelected)]=\"item.isSelected\"\n >\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title
|
|
9395
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsRepeaterAddRemoveExampleComponent, isStandalone: true, selector: "app-lists-repeater-add-remove-example", ngImport: i0, template: "<div class=\"sky-margin-stacked-lg\">\n <sky-repeater\n data-sky-id=\"repeater-example\"\n [expandMode]=\"'single'\"\n [reorderable]=\"true\"\n (orderChange)=\"changeItems($event)\"\n >\n @for (item of items; track item) {\n <sky-repeater-item\n [selectable]=\"true\"\n [tag]=\"item.note\"\n [(isSelected)]=\"item.isSelected\"\n >\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title\">\n {{ item.title }}\n </div>\n <div>\n {{ item.status }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button type=\"button\" (click)=\"onActionClicked('Action 1')\">\n Action 1\n </button>\n </sky-dropdown-item>\n <sky-dropdown-item>\n <button type=\"button\" (click)=\"onActionClicked('Action 2')\">\n Action 2\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n <sky-repeater-item-content>\n {{ item.note }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n </sky-repeater>\n</div>\n\n<button\n data-sky-id=\"add-button\"\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"addItem()\"\n>\n Add item\n</button>\n\n<button\n data-sky-id=\"remove-button\"\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"removeItems()\"\n>\n Remove selected items\n</button>\n", styles: [".example-repeater-flex{display:flex;flex-wrap:wrap}.example-repeater-flex .example-repeater-item-title{flex-grow:1}\n"], dependencies: [{ kind: "ngmodule", type: SkyDropdownModule }, { kind: "component", type: i1$7.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i1$7.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i1$7.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ9, selector: "sky-repeater-item-context-menu" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
9392
9396
|
}
|
|
9393
9397
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsRepeaterAddRemoveExampleComponent, decorators: [{
|
|
9394
9398
|
type: Component,
|
|
9395
|
-
args: [{ selector: 'app-lists-repeater-add-remove-example', imports: [SkyDropdownModule, SkyRepeaterModule], template: "<div class=\"sky-margin-stacked-lg\">\n <sky-repeater\n data-sky-id=\"repeater-example\"\n [expandMode]=\"'single'\"\n [reorderable]=\"true\"\n (orderChange)=\"changeItems($event)\"\n >\n @for (item of items; track item) {\n <sky-repeater-item\n [selectable]=\"true\"\n [tag]=\"item.note\"\n [(isSelected)]=\"item.isSelected\"\n >\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title
|
|
9399
|
+
args: [{ selector: 'app-lists-repeater-add-remove-example', imports: [SkyDropdownModule, SkyRepeaterModule], template: "<div class=\"sky-margin-stacked-lg\">\n <sky-repeater\n data-sky-id=\"repeater-example\"\n [expandMode]=\"'single'\"\n [reorderable]=\"true\"\n (orderChange)=\"changeItems($event)\"\n >\n @for (item of items; track item) {\n <sky-repeater-item\n [selectable]=\"true\"\n [tag]=\"item.note\"\n [(isSelected)]=\"item.isSelected\"\n >\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title\">\n {{ item.title }}\n </div>\n <div>\n {{ item.status }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button type=\"button\" (click)=\"onActionClicked('Action 1')\">\n Action 1\n </button>\n </sky-dropdown-item>\n <sky-dropdown-item>\n <button type=\"button\" (click)=\"onActionClicked('Action 2')\">\n Action 2\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n <sky-repeater-item-content>\n {{ item.note }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n </sky-repeater>\n</div>\n\n<button\n data-sky-id=\"add-button\"\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"addItem()\"\n>\n Add item\n</button>\n\n<button\n data-sky-id=\"remove-button\"\n class=\"sky-btn sky-btn-default sky-margin-inline-sm\"\n type=\"button\"\n (click)=\"removeItems()\"\n>\n Remove selected items\n</button>\n", styles: [".example-repeater-flex{display:flex;flex-wrap:wrap}.example-repeater-flex .example-repeater-item-title{flex-grow:1}\n"] }]
|
|
9396
9400
|
}] });
|
|
9397
9401
|
|
|
9398
9402
|
let nextId$2 = 0;
|
|
@@ -9419,7 +9423,7 @@ class ListsInfiniteScrollRepeaterExampleComponent {
|
|
|
9419
9423
|
}
|
|
9420
9424
|
#mockRemote() {
|
|
9421
9425
|
const data = [];
|
|
9422
|
-
for (let i = 0; i <
|
|
9426
|
+
for (let i = 0; i < 20; i++) {
|
|
9423
9427
|
data.push({
|
|
9424
9428
|
name: `Item #${++nextId$2}`,
|
|
9425
9429
|
});
|
|
@@ -9435,11 +9439,11 @@ class ListsInfiniteScrollRepeaterExampleComponent {
|
|
|
9435
9439
|
});
|
|
9436
9440
|
}
|
|
9437
9441
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsInfiniteScrollRepeaterExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9438
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsInfiniteScrollRepeaterExampleComponent, isStandalone: true, selector: "app-lists-infinite-scroll-repeater-example", ngImport: i0, template: "<div
|
|
9442
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsInfiniteScrollRepeaterExampleComponent, isStandalone: true, selector: "app-lists-infinite-scroll-repeater-example", ngImport: i0, template: "<div class=\"wrapper\">\n <sky-repeater>\n @for (item of items; 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 <sky-infinite-scroll [enabled]=\"itemsHaveMore\" (scrollEnd)=\"onScrollEnd()\" />\n</div>\n", styles: [".wrapper{overflow-y:auto;max-height:500px;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: SkyInfiniteScrollModule }, { kind: "component", type: i2$7.λ6, selector: "sky-infinite-scroll", inputs: ["enabled", "loading"], outputs: ["scrollEnd"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
9439
9443
|
}
|
|
9440
9444
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsInfiniteScrollRepeaterExampleComponent, decorators: [{
|
|
9441
9445
|
type: Component,
|
|
9442
|
-
args: [{ selector: 'app-lists-infinite-scroll-repeater-example', imports: [SkyInfiniteScrollModule, SkyRepeaterModule], template: "<div
|
|
9446
|
+
args: [{ selector: 'app-lists-infinite-scroll-repeater-example', imports: [SkyInfiniteScrollModule, SkyRepeaterModule], template: "<div class=\"wrapper\">\n <sky-repeater>\n @for (item of items; 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 <sky-infinite-scroll [enabled]=\"itemsHaveMore\" (scrollEnd)=\"onScrollEnd()\" />\n</div>\n", styles: [".wrapper{overflow-y:auto;max-height:500px;position:relative}\n"] }]
|
|
9443
9447
|
}] });
|
|
9444
9448
|
|
|
9445
9449
|
/**
|
|
@@ -9501,7 +9505,7 @@ class ListsRepeaterInlineFormExampleComponent {
|
|
|
9501
9505
|
this.activeInlineFormId = undefined;
|
|
9502
9506
|
}
|
|
9503
9507
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsRepeaterInlineFormExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9504
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsRepeaterInlineFormExampleComponent, isStandalone: true, selector: "app-lists-repeater-inline-form-example", ngImport: i0, template: "<sky-repeater>\n @for (item of items; track item) {\n <sky-repeater-item\n [inlineFormConfig]=\"inlineFormConfig\"\n [inlineFormTemplate]=\"inlineFormTemplate\"\n [showInlineForm]=\"activeInlineFormId === item.id\"\n (inlineFormClose)=\"onInlineFormClose($event)\"\n >\n <sky-repeater-item-title>\n <div class=\"sky-font-emphasized\">\n {{ item.title }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"showInlineForm(item)\"\n >\n <sky-icon
|
|
9508
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsRepeaterInlineFormExampleComponent, isStandalone: true, selector: "app-lists-repeater-inline-form-example", ngImport: i0, template: "<sky-repeater>\n @for (item of items; track item) {\n <sky-repeater-item\n [inlineFormConfig]=\"inlineFormConfig\"\n [inlineFormTemplate]=\"inlineFormTemplate\"\n [showInlineForm]=\"activeInlineFormId === item.id\"\n (inlineFormClose)=\"onInlineFormClose($event)\"\n >\n <sky-repeater-item-title>\n <div class=\"sky-font-emphasized\">\n {{ item.title }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"showInlineForm(item)\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </sky-repeater-item-context-menu>\n\n <sky-repeater-item-content>\n {{ item.note }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n\n<ng-template #inlineFormTemplate>\n <form novalidate [formGroup]=\"formGroup\">\n <sky-input-box labelText=\"Title\" stacked=\"true\">\n <input formControlName=\"title\" type=\"text\" />\n </sky-input-box>\n <sky-input-box labelText=\"Note\">\n <input formControlName=\"note\" type=\"text\" />\n </sky-input-box>\n </form>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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: "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$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "directive", type: i2.λ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$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ9, selector: "sky-repeater-item-context-menu" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
9505
9509
|
}
|
|
9506
9510
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsRepeaterInlineFormExampleComponent, decorators: [{
|
|
9507
9511
|
type: Component,
|
|
@@ -9511,7 +9515,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
9511
9515
|
SkyIconModule,
|
|
9512
9516
|
SkyInputBoxModule,
|
|
9513
9517
|
SkyRepeaterModule,
|
|
9514
|
-
], template: "<sky-repeater>\n @for (item of items; track item) {\n <sky-repeater-item\n [inlineFormConfig]=\"inlineFormConfig\"\n [inlineFormTemplate]=\"inlineFormTemplate\"\n [showInlineForm]=\"activeInlineFormId === item.id\"\n (inlineFormClose)=\"onInlineFormClose($event)\"\n >\n <sky-repeater-item-title>\n <div class=\"sky-font-emphasized\">\n {{ item.title }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"showInlineForm(item)\"\n >\n <sky-icon
|
|
9518
|
+
], template: "<sky-repeater>\n @for (item of items; track item) {\n <sky-repeater-item\n [inlineFormConfig]=\"inlineFormConfig\"\n [inlineFormTemplate]=\"inlineFormTemplate\"\n [showInlineForm]=\"activeInlineFormId === item.id\"\n (inlineFormClose)=\"onInlineFormClose($event)\"\n >\n <sky-repeater-item-title>\n <div class=\"sky-font-emphasized\">\n {{ item.title }}\n </div>\n </sky-repeater-item-title>\n <sky-repeater-item-context-menu>\n <button\n aria-label=\"Edit\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n (click)=\"showInlineForm(item)\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </sky-repeater-item-context-menu>\n\n <sky-repeater-item-content>\n {{ item.note }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n\n<ng-template #inlineFormTemplate>\n <form novalidate [formGroup]=\"formGroup\">\n <sky-input-box labelText=\"Title\" stacked=\"true\">\n <input formControlName=\"title\" type=\"text\" />\n </sky-input-box>\n <sky-input-box labelText=\"Note\">\n <input formControlName=\"note\" type=\"text\" />\n </sky-input-box>\n </form>\n</ng-template>\n" }]
|
|
9515
9519
|
}], ctorParameters: () => [] });
|
|
9516
9520
|
|
|
9517
9521
|
/**
|
|
@@ -9550,11 +9554,11 @@ class ListsRepeaterBasicExampleComponent {
|
|
|
9550
9554
|
alert(buttonText + ' was clicked!');
|
|
9551
9555
|
}
|
|
9552
9556
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsRepeaterBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9553
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsRepeaterBasicExampleComponent, isStandalone: true, selector: "app-lists-repeater-basic-example", ngImport: i0, template: "<sky-repeater data-sky-id=\"repeater-example\">\n @for (item of items; track item) {\n <sky-repeater-item [itemName]=\"item.accessibilityLabel\">\n @if (item.title) {\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title
|
|
9557
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsRepeaterBasicExampleComponent, isStandalone: true, selector: "app-lists-repeater-basic-example", ngImport: i0, template: "<sky-repeater data-sky-id=\"repeater-example\">\n @for (item of items; track item) {\n <sky-repeater-item [itemName]=\"item.accessibilityLabel\">\n @if (item.title) {\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title\">\n {{ item.title }}\n </div>\n <div>\n {{ item.status }}\n </div>\n </sky-repeater-item-title>\n }\n <sky-repeater-item-context-menu>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Action 1 for ' + (item.title ?? item.accessibilityLabel)\n \"\n (click)=\"onActionClicked('Action 1')\"\n >\n Action 1\n </button>\n </sky-dropdown-item>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Action 2 for ' + (item.title ?? item.accessibilityLabel)\n \"\n (click)=\"onActionClicked('Action 2')\"\n >\n Action 2\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n <sky-repeater-item-content>\n {{ item.note }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n", styles: [".example-repeater-flex{display:flex;flex-wrap:wrap}.example-repeater-flex .example-repeater-item-title{flex-grow:1}\n"], dependencies: [{ kind: "ngmodule", type: SkyDropdownModule }, { kind: "component", type: i1$7.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i1$7.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i1$7.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ9, selector: "sky-repeater-item-context-menu" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
9554
9558
|
}
|
|
9555
9559
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsRepeaterBasicExampleComponent, decorators: [{
|
|
9556
9560
|
type: Component,
|
|
9557
|
-
args: [{ selector: 'app-lists-repeater-basic-example', imports: [SkyDropdownModule, SkyRepeaterModule], template: "<sky-repeater data-sky-id=\"repeater-example\">\n @for (item of items; track item) {\n <sky-repeater-item [itemName]=\"item.accessibilityLabel\">\n @if (item.title) {\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title
|
|
9561
|
+
args: [{ selector: 'app-lists-repeater-basic-example', imports: [SkyDropdownModule, SkyRepeaterModule], template: "<sky-repeater data-sky-id=\"repeater-example\">\n @for (item of items; track item) {\n <sky-repeater-item [itemName]=\"item.accessibilityLabel\">\n @if (item.title) {\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title\">\n {{ item.title }}\n </div>\n <div>\n {{ item.status }}\n </div>\n </sky-repeater-item-title>\n }\n <sky-repeater-item-context-menu>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Action 1 for ' + (item.title ?? item.accessibilityLabel)\n \"\n (click)=\"onActionClicked('Action 1')\"\n >\n Action 1\n </button>\n </sky-dropdown-item>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Action 2 for ' + (item.title ?? item.accessibilityLabel)\n \"\n (click)=\"onActionClicked('Action 2')\"\n >\n Action 2\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n <sky-repeater-item-content>\n {{ item.note }}\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n", styles: [".example-repeater-flex{display:flex;flex-wrap:wrap}.example-repeater-flex .example-repeater-item-title{flex-grow:1}\n"] }]
|
|
9558
9562
|
}] });
|
|
9559
9563
|
|
|
9560
9564
|
/**
|
|
@@ -9653,11 +9657,11 @@ class ListsSortBasicExampleComponent {
|
|
|
9653
9657
|
});
|
|
9654
9658
|
}
|
|
9655
9659
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsSortBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9656
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsSortBasicExampleComponent, isStandalone: true, selector: "app-lists-sort-basic-example", ngImport: i0, template: "<sky-toolbar>\n <sky-toolbar-item>\n <sky-sort [showButtonText]=\"true\">\n @for (item of sortOptions; track item) {\n <sky-sort-item\n [active]=\"initialState === item.id\"\n (itemSelect)=\"sortItems(item)\"\n >\n {{ item.label }}\n </sky-sort-item>\n }\n </sky-sort>\n </sky-toolbar-item>\n</sky-toolbar>\n<sky-repeater expandMode=\"none\">\n @for (item of sortedItems; track item) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ item.title }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n <div
|
|
9660
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ListsSortBasicExampleComponent, isStandalone: true, selector: "app-lists-sort-basic-example", ngImport: i0, template: "<sky-toolbar>\n <sky-toolbar-item>\n <sky-sort [showButtonText]=\"true\">\n @for (item of sortOptions; track item) {\n <sky-sort-item\n [active]=\"initialState === item.id\"\n (itemSelect)=\"sortItems(item)\"\n >\n {{ item.label }}\n </sky-sort-item>\n }\n </sky-sort>\n </sky-toolbar-item>\n</sky-toolbar>\n<sky-repeater expandMode=\"none\">\n @for (item of sortedItems; track item) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ item.title }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n <div class=\"item-wrapper\">\n <div>Assigned to {{ item.assignee }}</div>\n <div>Created {{ item.date | date }}</div>\n </div>\n <div>\n {{ item.note }}\n </div>\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n", styles: [".item-wrapper{display:flex;justify-content:space-between}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$c.DatePipe, name: "date" }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }, { kind: "ngmodule", type: SkySortModule }, { kind: "component", type: i2$7.λ14, selector: "sky-sort", inputs: ["ariaLabel", "showButtonText"] }, { kind: "component", type: i2$7.λ13, selector: "sky-sort-item", inputs: ["active"], outputs: ["itemSelect"] }, { 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" }] }); }
|
|
9657
9661
|
}
|
|
9658
9662
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListsSortBasicExampleComponent, decorators: [{
|
|
9659
9663
|
type: Component,
|
|
9660
|
-
args: [{ selector: 'app-lists-sort-basic-example', imports: [CommonModule, SkyRepeaterModule, SkySortModule, SkyToolbarModule], template: "<sky-toolbar>\n <sky-toolbar-item>\n <sky-sort [showButtonText]=\"true\">\n @for (item of sortOptions; track item) {\n <sky-sort-item\n [active]=\"initialState === item.id\"\n (itemSelect)=\"sortItems(item)\"\n >\n {{ item.label }}\n </sky-sort-item>\n }\n </sky-sort>\n </sky-toolbar-item>\n</sky-toolbar>\n<sky-repeater expandMode=\"none\">\n @for (item of sortedItems; track item) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ item.title }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n <div
|
|
9664
|
+
args: [{ selector: 'app-lists-sort-basic-example', imports: [CommonModule, SkyRepeaterModule, SkySortModule, SkyToolbarModule], template: "<sky-toolbar>\n <sky-toolbar-item>\n <sky-sort [showButtonText]=\"true\">\n @for (item of sortOptions; track item) {\n <sky-sort-item\n [active]=\"initialState === item.id\"\n (itemSelect)=\"sortItems(item)\"\n >\n {{ item.label }}\n </sky-sort-item>\n }\n </sky-sort>\n </sky-toolbar-item>\n</sky-toolbar>\n<sky-repeater expandMode=\"none\">\n @for (item of sortedItems; track item) {\n <sky-repeater-item>\n <sky-repeater-item-title>\n {{ item.title }}\n </sky-repeater-item-title>\n <sky-repeater-item-content>\n <div class=\"item-wrapper\">\n <div>Assigned to {{ item.assignee }}</div>\n <div>Created {{ item.date | date }}</div>\n </div>\n <div>\n {{ item.note }}\n </div>\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n", styles: [".item-wrapper{display:flex;justify-content:space-between}\n"] }]
|
|
9661
9665
|
}] });
|
|
9662
9666
|
|
|
9663
9667
|
/**
|
|
@@ -9731,7 +9735,7 @@ class LookupAutocompleteCustomSearchExampleComponent {
|
|
|
9731
9735
|
return searchFunction;
|
|
9732
9736
|
}
|
|
9733
9737
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LookupAutocompleteCustomSearchExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9734
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: LookupAutocompleteCustomSearchExampleComponent, isStandalone: true, selector: "app-lookup-autocomplete-custom-search-example", ngImport: i0, template: "<form novalidate [formGroup]=\"formGroup\">\n <p>\n The following field has a preselected value and utilizes a custom search\n function, as well as a custom template for the search results.\n </p>\n <div class=\"sky-margin-stacked-lg\">\n <label class=\"sky-control-label\" [for]=\"largestOceanInput.id\">\n Largest ocean\n </label>\n <sky-autocomplete\n descriptorProperty=\"title\"\n [data]=\"oceans\"\n [search]=\"getOceanSearchFunction()\"\n [searchResultTemplate]=\"oceanSearchResultTemplate\"\n >\n <input\n #largestOceanInput=\"skyId\"\n formControlName=\"largestOcean\"\n type=\"text\"\n skyAutocomplete\n skyId\n />\n </sky-autocomplete>\n </div>\n <p class=\"sky-font-emphasized\">Form model:</p>\n <pre>{{ formGroup.value | json }}</pre>\n</form>\n\n<ng-template #oceanSearchResultTemplate let-item=\"item\">\n <sky-icon
|
|
9738
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: LookupAutocompleteCustomSearchExampleComponent, isStandalone: true, selector: "app-lookup-autocomplete-custom-search-example", ngImport: i0, template: "<form novalidate [formGroup]=\"formGroup\">\n <p>\n The following field has a preselected value and utilizes a custom search\n function, as well as a custom template for the search results.\n </p>\n <div class=\"sky-margin-stacked-lg\">\n <label class=\"sky-control-label\" [for]=\"largestOceanInput.id\">\n Largest ocean\n </label>\n <sky-autocomplete\n descriptorProperty=\"title\"\n [data]=\"oceans\"\n [search]=\"getOceanSearchFunction()\"\n [searchResultTemplate]=\"oceanSearchResultTemplate\"\n >\n <input\n #largestOceanInput=\"skyId\"\n formControlName=\"largestOcean\"\n type=\"text\"\n skyAutocomplete\n skyId\n />\n </sky-autocomplete>\n </div>\n <p class=\"sky-font-emphasized\">Form model:</p>\n <pre>{{ formGroup.value | json }}</pre>\n</form>\n\n<ng-template #oceanSearchResultTemplate let-item=\"item\">\n <sky-icon iconName=\"arrow-right\" />\n {{ item.title }} • ID {{ item.id }}\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$c.JsonPipe, name: "json" }, { kind: "ngmodule", type: FormsModule }, { 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: "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: SkyAutocompleteModule }, { kind: "component", type: i3$3.λ2, selector: "sky-autocomplete", inputs: ["ariaLabelledBy", "data", "debounceTime", "descriptorProperty", "dropdownHintText", "enableShowMore", "messageStream", "wrapperClass", "propertiesToSearch", "search", "searchResultTemplate", "searchTextMinimumCharacters", "searchFilters", "searchResultsLimit", "showAddButton", "noResultsFoundText", "searchAsyncDisabled"], outputs: ["addClick", "showMoreClick", "selectionChange", "searchAsync", "openChange"] }, { kind: "directive", type: i3$3.λ1, selector: "input[skyAutocomplete], textarea[skyAutocomplete]", inputs: ["autocompleteAttribute", "disabled"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i3.λ2, selector: "[skyId]", exportAs: ["skyId"] }] }); }
|
|
9735
9739
|
}
|
|
9736
9740
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LookupAutocompleteCustomSearchExampleComponent, decorators: [{
|
|
9737
9741
|
type: Component,
|
|
@@ -9742,7 +9746,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
9742
9746
|
SkyAutocompleteModule,
|
|
9743
9747
|
SkyIconModule,
|
|
9744
9748
|
SkyIdModule,
|
|
9745
|
-
], template: "<form novalidate [formGroup]=\"formGroup\">\n <p>\n The following field has a preselected value and utilizes a custom search\n function, as well as a custom template for the search results.\n </p>\n <div class=\"sky-margin-stacked-lg\">\n <label class=\"sky-control-label\" [for]=\"largestOceanInput.id\">\n Largest ocean\n </label>\n <sky-autocomplete\n descriptorProperty=\"title\"\n [data]=\"oceans\"\n [search]=\"getOceanSearchFunction()\"\n [searchResultTemplate]=\"oceanSearchResultTemplate\"\n >\n <input\n #largestOceanInput=\"skyId\"\n formControlName=\"largestOcean\"\n type=\"text\"\n skyAutocomplete\n skyId\n />\n </sky-autocomplete>\n </div>\n <p class=\"sky-font-emphasized\">Form model:</p>\n <pre>{{ formGroup.value | json }}</pre>\n</form>\n\n<ng-template #oceanSearchResultTemplate let-item=\"item\">\n <sky-icon
|
|
9749
|
+
], template: "<form novalidate [formGroup]=\"formGroup\">\n <p>\n The following field has a preselected value and utilizes a custom search\n function, as well as a custom template for the search results.\n </p>\n <div class=\"sky-margin-stacked-lg\">\n <label class=\"sky-control-label\" [for]=\"largestOceanInput.id\">\n Largest ocean\n </label>\n <sky-autocomplete\n descriptorProperty=\"title\"\n [data]=\"oceans\"\n [search]=\"getOceanSearchFunction()\"\n [searchResultTemplate]=\"oceanSearchResultTemplate\"\n >\n <input\n #largestOceanInput=\"skyId\"\n formControlName=\"largestOcean\"\n type=\"text\"\n skyAutocomplete\n skyId\n />\n </sky-autocomplete>\n </div>\n <p class=\"sky-font-emphasized\">Form model:</p>\n <pre>{{ formGroup.value | json }}</pre>\n</form>\n\n<ng-template #oceanSearchResultTemplate let-item=\"item\">\n <sky-icon iconName=\"arrow-right\" />\n {{ item.title }} • ID {{ item.id }}\n</ng-template>\n" }]
|
|
9746
9750
|
}], ctorParameters: () => [] });
|
|
9747
9751
|
|
|
9748
9752
|
/**
|
|
@@ -9862,7 +9866,7 @@ class LookupCountryFieldBasicExampleComponent {
|
|
|
9862
9866
|
});
|
|
9863
9867
|
}
|
|
9864
9868
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LookupCountryFieldBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9865
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LookupCountryFieldBasicExampleComponent, isStandalone: true, selector: "app-lookup-country-field-basic-example", ngImport: i0, template: "<form [formGroup]=\"countryForm\">\n <sky-input-box\n data-sky-id=\"country-field\"\n hintText=\"If you have multiple countries, choose your primary country.\"\n labelText=\"Country\"\n [helpPopoverContent]=\"helpPopoverContent\"\n >\n <sky-country-field formControlName=\"country\" />\n @if (countryControl.errors?.['invalidCountry']) {\n <sky-form-error\n errorName=\"invalidCountry\"\n errorText=\"This country is no longer available for the date you selected.\"\n />\n }\n </sky-input-box>\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: SkyCountryFieldModule }, { kind: "component", type: i3$3.λ3, selector: "sky-country-field", inputs: ["autocompleteAttribute", "defaultCountry", "disabled", "supportedCountryISOs"], outputs: ["selectedCountryChange"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "component", type: i2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }] }); }
|
|
9869
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: LookupCountryFieldBasicExampleComponent, isStandalone: true, selector: "app-lookup-country-field-basic-example", ngImport: i0, template: "<form [formGroup]=\"countryForm\">\n <sky-input-box\n data-sky-id=\"country-field\"\n hintText=\"If you have multiple countries, choose your primary country.\"\n labelText=\"Country\"\n [helpPopoverContent]=\"helpPopoverContent\"\n >\n <sky-country-field formControlName=\"country\" />\n @if (countryControl.errors?.['invalidCountry']) {\n <sky-form-error\n errorName=\"invalidCountry\"\n errorText=\"This country is no longer available for the date you selected.\"\n />\n }\n </sky-input-box>\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: SkyCountryFieldModule }, { kind: "component", type: i3$3.λ3, selector: "sky-country-field", inputs: ["autocompleteAttribute", "defaultCountry", "disabled", "supportedCountryISOs"], outputs: ["selectedCountryChange", "countryFieldFocusout"] }, { kind: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "component", type: i2.λ22, selector: "sky-form-error", inputs: ["errorName", "errorText"] }] }); }
|
|
9866
9870
|
}
|
|
9867
9871
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LookupCountryFieldBasicExampleComponent, decorators: [{
|
|
9868
9872
|
type: Component,
|
|
@@ -10017,7 +10021,7 @@ class PickerModalComponent {
|
|
|
10017
10021
|
this.#modalInstance.save(selectedPeople);
|
|
10018
10022
|
}
|
|
10019
10023
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PickerModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10020
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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
|
|
10024
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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.λ3, selector: "sky-checkbox", inputs: ["label", "labelledBy", "id", "disabled", "tabindex", "name", "helpPopoverContent", "helpPopoverTitle", "icon", "iconName", "checkboxType", "checked", "indeterminate", "required", "labelText", "labelHidden", "hintText", "stacked", "helpKey"], outputs: ["change", "checkedChange", "disabledChange", "indeterminateChange"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3$2.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3$2.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3$2.λ3, selector: "sky-modal-footer" }, { kind: "ngmodule", type: SkySelectionBoxModule }, { kind: "component", type: i2.λ15, selector: "sky-selection-box-grid", inputs: ["alignItems"] }, { kind: "component", type: i2.λ17, selector: "sky-selection-box", inputs: ["control"] }, { kind: "component", type: i2.λ14, selector: "sky-selection-box-description" }, { kind: "component", type: i2.λ16, selector: "sky-selection-box-header" }, { kind: "ngmodule", type: SkyWaitModule }, { kind: "component", type: i1$2.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking", "screenReaderCompletedText"] }] }); }
|
|
10021
10025
|
}
|
|
10022
10026
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PickerModalComponent, decorators: [{
|
|
10023
10027
|
type: Component,
|
|
@@ -10029,7 +10033,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
10029
10033
|
SkyModalModule,
|
|
10030
10034
|
SkySelectionBoxModule,
|
|
10031
10035
|
SkyWaitModule,
|
|
10032
|
-
], 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
|
|
10036
|
+
], 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"] }]
|
|
10033
10037
|
}], ctorParameters: () => [] });
|
|
10034
10038
|
|
|
10035
10039
|
/**
|
|
@@ -11653,11 +11657,11 @@ class TileMyActionsComponent {
|
|
|
11653
11657
|
alert(buttonText + ' was clicked!');
|
|
11654
11658
|
}
|
|
11655
11659
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TileMyActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11656
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TileMyActionsComponent, isStandalone: true, selector: "app-tile-my-actions", ngImport: i0, template: "<sky-tile tileName=\"My actions\">\n <sky-tile-title> My actions </sky-tile-title>\n <sky-tile-summary> 3 </sky-tile-summary>\n <sky-tile-content>\n <sky-tile-content-section>\n <sky-repeater data-sky-id=\"repeater-example\">\n @for (item of items; track item) {\n <sky-repeater-item [itemName]=\"item.accessibilityLabel\">\n @if (item.title) {\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div
|
|
11660
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TileMyActionsComponent, isStandalone: true, selector: "app-tile-my-actions", ngImport: i0, template: "<sky-tile tileName=\"My actions\">\n <sky-tile-title> My actions </sky-tile-title>\n <sky-tile-summary> 3 </sky-tile-summary>\n <sky-tile-content>\n <sky-tile-content-section>\n <sky-repeater data-sky-id=\"repeater-example\">\n @for (item of items; track item) {\n <sky-repeater-item [itemName]=\"item.accessibilityLabel\">\n @if (item.title) {\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title sky-margin-stacked-sm\">\n <a href=\"/\">{{ item.title }}</a>\n </div>\n <div class=\"sky-font-deemphasized\">{{ item.date }}</div>\n </sky-repeater-item-title>\n }\n <sky-repeater-item-context-menu>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Action 1 for ' +\n (item.title ?? item.accessibilityLabel)\n \"\n (click)=\"onActionClicked('Action 1')\"\n >\n Edit\n </button>\n </sky-dropdown-item>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Action 2 for ' +\n (item.title ?? item.accessibilityLabel)\n \"\n (click)=\"onActionClicked('Action 2')\"\n >\n Mark as complete\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n </sky-repeater-item>\n }\n </sky-repeater>\n </sky-tile-content-section>\n </sky-tile-content>\n</sky-tile>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: SkyTilesModule }, { kind: "component", type: i1$e.λ5, selector: "sky-tile-content" }, { kind: "component", type: i1$e.λ4, selector: "sky-tile-content-section" }, { kind: "component", type: i1$e.λ1, selector: "sky-tile", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "showSettings", "showHelp", "tileName", "isCollapsed"], outputs: ["settingsClick", "isCollapsedChange", "helpClick"] }, { kind: "component", type: i1$e.λ2, selector: "sky-tile-summary" }, { kind: "component", type: i1$e.λ3, selector: "sky-tile-title" }, { kind: "ngmodule", type: SkyDropdownModule }, { kind: "component", type: i1$7.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i1$7.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i1$7.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ9, selector: "sky-repeater-item-context-menu" }, { kind: "component", type: i2$7.λ12, selector: "sky-repeater-item-title" }] }); }
|
|
11657
11661
|
}
|
|
11658
11662
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TileMyActionsComponent, decorators: [{
|
|
11659
11663
|
type: Component,
|
|
11660
|
-
args: [{ selector: 'app-tile-my-actions', imports: [SkyTilesModule, SkyDropdownModule, SkyRepeaterModule], template: "<sky-tile tileName=\"My actions\">\n <sky-tile-title> My actions </sky-tile-title>\n <sky-tile-summary> 3 </sky-tile-summary>\n <sky-tile-content>\n <sky-tile-content-section>\n <sky-repeater data-sky-id=\"repeater-example\">\n @for (item of items; track item) {\n <sky-repeater-item [itemName]=\"item.accessibilityLabel\">\n @if (item.title) {\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div
|
|
11664
|
+
args: [{ selector: 'app-tile-my-actions', imports: [SkyTilesModule, SkyDropdownModule, SkyRepeaterModule], template: "<sky-tile tileName=\"My actions\">\n <sky-tile-title> My actions </sky-tile-title>\n <sky-tile-summary> 3 </sky-tile-summary>\n <sky-tile-content>\n <sky-tile-content-section>\n <sky-repeater data-sky-id=\"repeater-example\">\n @for (item of items; track item) {\n <sky-repeater-item [itemName]=\"item.accessibilityLabel\">\n @if (item.title) {\n <sky-repeater-item-title class=\"example-repeater-flex\">\n <div class=\"example-repeater-item-title sky-margin-stacked-sm\">\n <a href=\"/\">{{ item.title }}</a>\n </div>\n <div class=\"sky-font-deemphasized\">{{ item.date }}</div>\n </sky-repeater-item-title>\n }\n <sky-repeater-item-context-menu>\n <sky-dropdown buttonType=\"context-menu\">\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Action 1 for ' +\n (item.title ?? item.accessibilityLabel)\n \"\n (click)=\"onActionClicked('Action 1')\"\n >\n Edit\n </button>\n </sky-dropdown-item>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Action 2 for ' +\n (item.title ?? item.accessibilityLabel)\n \"\n (click)=\"onActionClicked('Action 2')\"\n >\n Mark as complete\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n </sky-repeater-item>\n }\n </sky-repeater>\n </sky-tile-content-section>\n </sky-tile-content>\n</sky-tile>\n", styles: [":host{display:block}\n"] }]
|
|
11661
11665
|
}] });
|
|
11662
11666
|
|
|
11663
11667
|
class TileUpdatesComponent {
|
|
@@ -11721,11 +11725,12 @@ class HomePageContentComponent {
|
|
|
11721
11725
|
}
|
|
11722
11726
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: HomePageContentComponent, decorators: [{
|
|
11723
11727
|
type: Component,
|
|
11724
|
-
args: [{ selector: 'app-home-page-content', imports: [
|
|
11728
|
+
args: [{ selector: 'app-home-page-content', imports: [SkyTilesModule], template: "<sky-tile-dashboard [(config)]=\"dashboardConfig\" />\n" }]
|
|
11725
11729
|
}] });
|
|
11726
11730
|
|
|
11727
11731
|
/**
|
|
11728
11732
|
* @title Home page with blocks layout, using tile dashboard and recently accessed links
|
|
11733
|
+
* @docsDemoHidden
|
|
11729
11734
|
*/
|
|
11730
11735
|
class PagesPageHomePageBlocksLayoutExampleComponent {
|
|
11731
11736
|
constructor() {
|
|
@@ -11743,11 +11748,11 @@ class PagesPageHomePageBlocksLayoutExampleComponent {
|
|
|
11743
11748
|
];
|
|
11744
11749
|
}
|
|
11745
11750
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PagesPageHomePageBlocksLayoutExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11746
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: PagesPageHomePageBlocksLayoutExampleComponent, isStandalone: true, selector: "app-pages-page-home-page-blocks-layout-example", ngImport: i0, template: "<sky-page layout=\"blocks\">\n <sky-page-header pageTitle=\"Home\">\n <sky-page-header-actions>\n <button type=\"button\" class=\"sky-btn sky-btn-default\">\n <sky-icon
|
|
11751
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: PagesPageHomePageBlocksLayoutExampleComponent, isStandalone: true, selector: "app-pages-page-home-page-blocks-layout-example", ngImport: i0, template: "<sky-page layout=\"blocks\">\n <sky-page-header pageTitle=\"Home\">\n <sky-page-header-actions>\n <button type=\"button\" class=\"sky-btn sky-btn-default\">\n <sky-icon iconName=\"add\" /> New\n </button>\n </sky-page-header-actions>\n </sky-page-header>\n <sky-page-content>\n <app-home-page-content />\n </sky-page-content>\n\n <sky-page-links>\n <sky-link-list-recently-accessed [recentLinks]=\"recentLinks\" />\n <sky-link-list headingText=\"Resources\">\n <sky-link-list-item>\n <a href=\"#\">Help</a>\n </sky-link-list-item>\n <sky-link-list-item>\n <a href=\"#\">Support</a>\n </sky-link-list-item>\n <sky-link-list-item>\n <a href=\"#\">Training</a>\n </sky-link-list-item>\n </sky-link-list>\n </sky-page-links>\n</sky-page>\n", dependencies: [{ kind: "component", type: HomePageContentComponent, selector: "app-home-page-content" }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyPageModule$1 }, { kind: "component", type: i1$8.λ13, selector: "sky-link-list", inputs: ["headingText", "links"] }, { kind: "component", type: i1$8.λ14, selector: "sky-link-list-item" }, { kind: "component", type: i1$8.λ15, selector: "sky-link-list-recently-accessed", inputs: ["recentLinks"] }, { kind: "component", type: i1$8.λ6, selector: "sky-page", inputs: ["layout", "helpKey"] }, { kind: "component", type: i1$8.λ9, selector: "sky-page-header-actions" }, { kind: "component", type: i1$8.λ4, selector: "sky-page-header", inputs: ["parentLink", "pageTitle"] }, { kind: "component", type: i1$8.λ7, selector: "sky-page-content" }, { kind: "component", type: i1$8.λ12, selector: "sky-page-links" }] }); }
|
|
11747
11752
|
}
|
|
11748
11753
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PagesPageHomePageBlocksLayoutExampleComponent, decorators: [{
|
|
11749
11754
|
type: Component,
|
|
11750
|
-
args: [{ selector: 'app-pages-page-home-page-blocks-layout-example', imports: [HomePageContentComponent, SkyIconModule, SkyPageModule$1], template: "<sky-page layout=\"blocks\">\n <sky-page-header pageTitle=\"Home\">\n <sky-page-header-actions>\n <button type=\"button\" class=\"sky-btn sky-btn-default\">\n <sky-icon
|
|
11755
|
+
args: [{ selector: 'app-pages-page-home-page-blocks-layout-example', imports: [HomePageContentComponent, SkyIconModule, SkyPageModule$1], template: "<sky-page layout=\"blocks\">\n <sky-page-header pageTitle=\"Home\">\n <sky-page-header-actions>\n <button type=\"button\" class=\"sky-btn sky-btn-default\">\n <sky-icon iconName=\"add\" /> New\n </button>\n </sky-page-header-actions>\n </sky-page-header>\n <sky-page-content>\n <app-home-page-content />\n </sky-page-content>\n\n <sky-page-links>\n <sky-link-list-recently-accessed [recentLinks]=\"recentLinks\" />\n <sky-link-list headingText=\"Resources\">\n <sky-link-list-item>\n <a href=\"#\">Help</a>\n </sky-link-list-item>\n <sky-link-list-item>\n <a href=\"#\">Support</a>\n </sky-link-list-item>\n <sky-link-list-item>\n <a href=\"#\">Training</a>\n </sky-link-list-item>\n </sky-link-list>\n </sky-page-links>\n</sky-page>\n" }]
|
|
11751
11756
|
}] });
|
|
11752
11757
|
|
|
11753
11758
|
class ContactContextMenuComponent {
|
|
@@ -11845,7 +11850,7 @@ class ListPageContactsGridComponent {
|
|
|
11845
11850
|
this.#dataManagerService.initDataView(this.#viewConfig);
|
|
11846
11851
|
}
|
|
11847
11852
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListPageContactsGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11848
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ListPageContactsGridComponent, isStandalone: true, selector: "app-list-page-contacts-grid", inputs: { contacts: "contacts" }, providers: [SkyDataManagerService], ngImport: i0, template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New contact\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon icon=\"add\" />\n New\n </button>\n </sky-data-manager-toolbar-primary-item>\n </sky-data-manager-toolbar>\n </div>\n <div class=\"sky-margin-stacked-sm\">\n <sky-key-info layout=\"horizontal\" class=\"sky-padding-horizontal-sm\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ contacts.length }}\n </sky-key-info-value>\n <sky-key-info-label> Contacts </sky-key-info-label>\n </sky-key-info>\n </div>\n <sky-data-view skyAgGridDataManagerAdapter viewId=\"gridView\">\n <sky-ag-grid-wrapper>\n <ag-grid-angular [gridOptions]=\"gridOptions\" [rowData]=\"contacts\" />\n </sky-ag-grid-wrapper>\n </sky-data-view>\n</sky-data-manager>\n", dependencies: [{ kind: "ngmodule", type: AgGridModule }, { kind: "component", type: i1$b.AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "components", "editType", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableCellSpan", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "treeDataChildrenField", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "pinnedTopRowData", "pinnedBottomRowData", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "rowNumbers", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "themeCssLayer", "themeStyleContainer", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "advancedFilterBuilderVisibleChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }, { kind: "ngmodule", type: SkyAgGridModule }, { kind: "directive", type: i2$6.λ14, selector: "[skyAgGridDataManagerAdapter]", inputs: ["viewId"] }, { kind: "component", type: i2$6.λ12, selector: "sky-ag-grid-wrapper", inputs: ["compact", "minHeight"] }, { kind: "ngmodule", type: SkyDataManagerModule }, { kind: "component", type: i3$4.λ2, selector: "sky-data-manager" }, { kind: "component", type: i3$4.λ7, selector: "sky-data-manager-toolbar" }, { kind: "component", type: i3$4.λ4, selector: "sky-data-manager-toolbar-primary-item" }, { kind: "component", type: i3$4.λ8, selector: "sky-data-view", inputs: ["viewId"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }] }); }
|
|
11853
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ListPageContactsGridComponent, isStandalone: true, selector: "app-list-page-contacts-grid", inputs: { contacts: "contacts" }, providers: [SkyDataManagerService], ngImport: i0, template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New contact\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon iconName=\"add\" />\n New\n </button>\n </sky-data-manager-toolbar-primary-item>\n </sky-data-manager-toolbar>\n </div>\n <div class=\"sky-margin-stacked-sm\">\n <sky-key-info layout=\"horizontal\" class=\"sky-padding-horizontal-sm\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ contacts.length }}\n </sky-key-info-value>\n <sky-key-info-label> Contacts </sky-key-info-label>\n </sky-key-info>\n </div>\n <sky-data-view skyAgGridDataManagerAdapter viewId=\"gridView\">\n <sky-ag-grid-wrapper>\n <ag-grid-angular [gridOptions]=\"gridOptions\" [rowData]=\"contacts\" />\n </sky-ag-grid-wrapper>\n </sky-data-view>\n</sky-data-manager>\n", dependencies: [{ kind: "ngmodule", type: AgGridModule }, { kind: "component", type: i1$b.AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "components", "editType", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableCellSpan", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "treeDataChildrenField", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "pinnedTopRowData", "pinnedBottomRowData", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "rowNumbers", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "themeCssLayer", "themeStyleContainer", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "advancedFilterBuilderVisibleChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }, { kind: "ngmodule", type: SkyAgGridModule }, { kind: "directive", type: i2$6.λ14, selector: "[skyAgGridDataManagerAdapter]", inputs: ["viewId"] }, { kind: "component", type: i2$6.λ12, selector: "sky-ag-grid-wrapper", inputs: ["compact", "minHeight"] }, { kind: "ngmodule", type: SkyDataManagerModule }, { kind: "component", type: i3$4.λ2, selector: "sky-data-manager" }, { kind: "component", type: i3$4.λ7, selector: "sky-data-manager-toolbar" }, { kind: "component", type: i3$4.λ4, selector: "sky-data-manager-toolbar-primary-item" }, { kind: "component", type: i3$4.λ8, selector: "sky-data-view", inputs: ["viewId"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }] }); }
|
|
11849
11854
|
}
|
|
11850
11855
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListPageContactsGridComponent, decorators: [{
|
|
11851
11856
|
type: Component,
|
|
@@ -11855,7 +11860,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
11855
11860
|
SkyDataManagerModule,
|
|
11856
11861
|
SkyIconModule,
|
|
11857
11862
|
SkyKeyInfoModule,
|
|
11858
|
-
], template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New contact\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon
|
|
11863
|
+
], template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New contact\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon iconName=\"add\" />\n New\n </button>\n </sky-data-manager-toolbar-primary-item>\n </sky-data-manager-toolbar>\n </div>\n <div class=\"sky-margin-stacked-sm\">\n <sky-key-info layout=\"horizontal\" class=\"sky-padding-horizontal-sm\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ contacts.length }}\n </sky-key-info-value>\n <sky-key-info-label> Contacts </sky-key-info-label>\n </sky-key-info>\n </div>\n <sky-data-view skyAgGridDataManagerAdapter viewId=\"gridView\">\n <sky-ag-grid-wrapper>\n <ag-grid-angular [gridOptions]=\"gridOptions\" [rowData]=\"contacts\" />\n </sky-ag-grid-wrapper>\n </sky-data-view>\n</sky-data-manager>\n" }]
|
|
11859
11864
|
}], ctorParameters: () => [], propDecorators: { contacts: [{
|
|
11860
11865
|
type: Input
|
|
11861
11866
|
}] } });
|
|
@@ -11934,6 +11939,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
11934
11939
|
|
|
11935
11940
|
/**
|
|
11936
11941
|
* @title List page with tabs layout using data manager
|
|
11942
|
+
* @docsDemoHidden
|
|
11937
11943
|
*/
|
|
11938
11944
|
class PagesPageListPageTabsLayoutExampleComponent {
|
|
11939
11945
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PagesPageListPageTabsLayoutExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
@@ -12063,7 +12069,7 @@ class ListPageContentComponent {
|
|
|
12063
12069
|
this.#dataManagerService.initDataView(this.#viewConfig);
|
|
12064
12070
|
}
|
|
12065
12071
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListPageContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12066
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ListPageContentComponent, isStandalone: true, selector: "app-list-page-content", providers: [SkyDataManagerService], ngImport: i0, template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New dashboard\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon icon=\"add\" />\n New\n </button>\n </sky-data-manager-toolbar-primary-item>\n </sky-data-manager-toolbar>\n </div>\n <div class=\"sky-margin-stacked-sm\">\n <sky-key-info class=\"sky-padding-horizontal-sm\" layout=\"horizontal\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ items.length }}\n </sky-key-info-value>\n <sky-key-info-label> Dashboards </sky-key-info-label>\n </sky-key-info>\n </div>\n <sky-data-view skyAgGridDataManagerAdapter viewId=\"gridView\">\n <sky-ag-grid-wrapper>\n <ag-grid-angular [gridOptions]=\"gridOptions\" [rowData]=\"items\" />\n </sky-ag-grid-wrapper>\n </sky-data-view>\n</sky-data-manager>\n", dependencies: [{ kind: "ngmodule", type: AgGridModule }, { kind: "component", type: i1$b.AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "components", "editType", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableCellSpan", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "treeDataChildrenField", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "pinnedTopRowData", "pinnedBottomRowData", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "rowNumbers", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "themeCssLayer", "themeStyleContainer", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "advancedFilterBuilderVisibleChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }, { kind: "ngmodule", type: SkyAgGridModule }, { kind: "directive", type: i2$6.λ14, selector: "[skyAgGridDataManagerAdapter]", inputs: ["viewId"] }, { kind: "component", type: i2$6.λ12, selector: "sky-ag-grid-wrapper", inputs: ["compact", "minHeight"] }, { kind: "ngmodule", type: SkyDataManagerModule }, { kind: "component", type: i3$4.λ2, selector: "sky-data-manager" }, { kind: "component", type: i3$4.λ7, selector: "sky-data-manager-toolbar" }, { kind: "component", type: i3$4.λ4, selector: "sky-data-manager-toolbar-primary-item" }, { kind: "component", type: i3$4.λ8, selector: "sky-data-view", inputs: ["viewId"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }] }); }
|
|
12072
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ListPageContentComponent, isStandalone: true, selector: "app-list-page-content", providers: [SkyDataManagerService], ngImport: i0, template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New dashboard\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon iconName=\"add\" />\n New\n </button>\n </sky-data-manager-toolbar-primary-item>\n </sky-data-manager-toolbar>\n </div>\n <div class=\"sky-margin-stacked-sm\">\n <sky-key-info class=\"sky-padding-horizontal-sm\" layout=\"horizontal\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ items.length }}\n </sky-key-info-value>\n <sky-key-info-label> Dashboards </sky-key-info-label>\n </sky-key-info>\n </div>\n <sky-data-view skyAgGridDataManagerAdapter viewId=\"gridView\">\n <sky-ag-grid-wrapper>\n <ag-grid-angular [gridOptions]=\"gridOptions\" [rowData]=\"items\" />\n </sky-ag-grid-wrapper>\n </sky-data-view>\n</sky-data-manager>\n", dependencies: [{ kind: "ngmodule", type: AgGridModule }, { kind: "component", type: i1$b.AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "components", "editType", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableCellSpan", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "treeDataChildrenField", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "pinnedTopRowData", "pinnedBottomRowData", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "rowNumbers", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "themeCssLayer", "themeStyleContainer", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "advancedFilterBuilderVisibleChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }, { kind: "ngmodule", type: SkyAgGridModule }, { kind: "directive", type: i2$6.λ14, selector: "[skyAgGridDataManagerAdapter]", inputs: ["viewId"] }, { kind: "component", type: i2$6.λ12, selector: "sky-ag-grid-wrapper", inputs: ["compact", "minHeight"] }, { kind: "ngmodule", type: SkyDataManagerModule }, { kind: "component", type: i3$4.λ2, selector: "sky-data-manager" }, { kind: "component", type: i3$4.λ7, selector: "sky-data-manager-toolbar" }, { kind: "component", type: i3$4.λ4, selector: "sky-data-manager-toolbar-primary-item" }, { kind: "component", type: i3$4.λ8, selector: "sky-data-view", inputs: ["viewId"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }] }); }
|
|
12067
12073
|
}
|
|
12068
12074
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ListPageContentComponent, decorators: [{
|
|
12069
12075
|
type: Component,
|
|
@@ -12073,11 +12079,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
12073
12079
|
SkyDataManagerModule,
|
|
12074
12080
|
SkyIconModule,
|
|
12075
12081
|
SkyKeyInfoModule,
|
|
12076
|
-
], template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New dashboard\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon
|
|
12082
|
+
], template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New dashboard\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon iconName=\"add\" />\n New\n </button>\n </sky-data-manager-toolbar-primary-item>\n </sky-data-manager-toolbar>\n </div>\n <div class=\"sky-margin-stacked-sm\">\n <sky-key-info class=\"sky-padding-horizontal-sm\" layout=\"horizontal\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ items.length }}\n </sky-key-info-value>\n <sky-key-info-label> Dashboards </sky-key-info-label>\n </sky-key-info>\n </div>\n <sky-data-view skyAgGridDataManagerAdapter viewId=\"gridView\">\n <sky-ag-grid-wrapper>\n <ag-grid-angular [gridOptions]=\"gridOptions\" [rowData]=\"items\" />\n </sky-ag-grid-wrapper>\n </sky-data-view>\n</sky-data-manager>\n" }]
|
|
12077
12083
|
}], ctorParameters: () => [] });
|
|
12078
12084
|
|
|
12079
12085
|
/**
|
|
12080
12086
|
* @title List page with list layout using data manager
|
|
12087
|
+
* @docsDemoHidden
|
|
12081
12088
|
*/
|
|
12082
12089
|
class PagesPageListPageListLayoutExampleComponent {
|
|
12083
12090
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PagesPageListPageListLayoutExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
@@ -12160,7 +12167,7 @@ let RecordPageContentComponent$1 = class RecordPageContentComponent {
|
|
|
12160
12167
|
];
|
|
12161
12168
|
}
|
|
12162
12169
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RecordPageContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12163
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: RecordPageContentComponent, isStandalone: true, selector: "app-record-page-content", ngImport: i0, template: "<sky-fluid-grid gutterSize=\"medium\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenMedium]=\"4\" [screenSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Details\">\n <sky-box-controls>\n <button\n aria-label=\"Edit button for details\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n >\n <sky-icon
|
|
12170
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: RecordPageContentComponent, isStandalone: true, selector: "app-record-page-content", ngImport: i0, template: "<sky-fluid-grid gutterSize=\"medium\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenMedium]=\"4\" [screenSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Details\">\n <sky-box-controls>\n <button\n aria-label=\"Edit button for details\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </sky-box-controls>\n <sky-box-content>\n <sky-description-list mode=\"vertical\">\n @for (recordDetail of recordDetails; track recordDetail) {\n <sky-description-list-content>\n <sky-description-list-term>\n {{ recordDetail.detail }}\n </sky-description-list-term>\n <sky-description-list-description>\n {{ recordDetail.info }}\n </sky-description-list-description>\n </sky-description-list-content>\n }\n </sky-description-list>\n </sky-box-content>\n </sky-box>\n </sky-column>\n <sky-column [screenMedium]=\"4\" [screenSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Payments\">\n <sky-box-content>\n <div class=\"box-2-content\">\n <div class=\"box-2-actuals\">\n <h3 class=\"sky-font-heading-4\">Actuals</h3>\n @for (actual of actualPayments; track actual; let i = $index) {\n <sky-key-info\n [ngClass]=\"{\n 'sky-margin-stacked-lg': i < actualPayments.length - 1\n }\"\n >\n <sky-key-info-value class=\"sky-font-display-3\">\n {{ actual.value }}\n </sky-key-info-value>\n <sky-key-info-label>{{ actual.category }}</sky-key-info-label>\n </sky-key-info>\n }\n </div>\n <div class=\"box-2-projected\">\n <h3 class=\"sky-font-heading-4\">Projected</h3>\n @for (\n projected of projectedPayments;\n track projected;\n let i = $index\n ) {\n <sky-key-info\n [ngClass]=\"{\n 'sky-margin-stacked-lg': i < projectedPayments.length - 1\n }\"\n >\n <sky-key-info-value class=\"sky-font-display-3\">\n {{ projected.value }}\n </sky-key-info-value>\n <sky-key-info-label>\n {{ projected.category }}\n </sky-key-info-label>\n </sky-key-info>\n }\n </div>\n </div>\n </sky-box-content>\n </sky-box>\n </sky-column>\n <sky-column [screenMedium]=\"4\" [screenSmall]=\"12\">\n <sky-box headingText=\"Recent activity\">\n <sky-box-content>\n <sky-repeater>\n @for (activity of recentActivity; track activity) {\n <sky-repeater-item>\n <sky-repeater-item-content>\n <div class=\"sky-margin-stacked-xs\">\n {{ activity.activity }}\n </div>\n <div class=\"sky-font-deemphasized\">{{ activity.date }}</div>\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n </sky-repeater>\n </sky-box-content>\n </sky-box>\n </sky-column>\n </sky-row>\n</sky-fluid-grid>\n", styles: [".box-2-content{display:flex}.box-2-content div{display:flex;flex-direction:column;flex-grow:1}.box-2-content .box-2-actuals{margin-right:60px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$c.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SkyBoxModule }, { kind: "component", type: i1$5.λ41, selector: "sky-box", inputs: ["headingText", "headingHidden", "headingLevel", "headingStyle", "helpPopoverContent", "helpPopoverTitle", "helpKey", "ariaLabel", "ariaLabelledBy", "ariaRole"] }, { kind: "component", type: i1$5.λ43, selector: "sky-box-content" }, { kind: "component", type: i1$5.λ44, selector: "sky-box-controls" }, { kind: "ngmodule", type: SkyDescriptionListModule }, { kind: "component", type: i1$5.λ18, selector: "sky-description-list", inputs: ["defaultDescription", "listItemWidth", "mode"] }, { kind: "component", type: i1$5.λ21, selector: "sky-description-list-content", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle"] }, { kind: "component", type: i1$5.λ19, selector: "sky-description-list-term" }, { kind: "component", type: i1$5.λ20, selector: "sky-description-list-description" }, { 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: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }] }); }
|
|
12164
12171
|
};
|
|
12165
12172
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RecordPageContentComponent$1, decorators: [{
|
|
12166
12173
|
type: Component,
|
|
@@ -12172,11 +12179,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
12172
12179
|
SkyIconModule,
|
|
12173
12180
|
SkyKeyInfoModule,
|
|
12174
12181
|
SkyRepeaterModule,
|
|
12175
|
-
], template: "<sky-fluid-grid gutterSize=\"medium\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenMedium]=\"4\" [screenSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Details\">\n <sky-box-controls>\n <button\n aria-label=\"Edit button for details\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n >\n <sky-icon
|
|
12182
|
+
], template: "<sky-fluid-grid gutterSize=\"medium\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenMedium]=\"4\" [screenSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Details\">\n <sky-box-controls>\n <button\n aria-label=\"Edit button for details\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </sky-box-controls>\n <sky-box-content>\n <sky-description-list mode=\"vertical\">\n @for (recordDetail of recordDetails; track recordDetail) {\n <sky-description-list-content>\n <sky-description-list-term>\n {{ recordDetail.detail }}\n </sky-description-list-term>\n <sky-description-list-description>\n {{ recordDetail.info }}\n </sky-description-list-description>\n </sky-description-list-content>\n }\n </sky-description-list>\n </sky-box-content>\n </sky-box>\n </sky-column>\n <sky-column [screenMedium]=\"4\" [screenSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Payments\">\n <sky-box-content>\n <div class=\"box-2-content\">\n <div class=\"box-2-actuals\">\n <h3 class=\"sky-font-heading-4\">Actuals</h3>\n @for (actual of actualPayments; track actual; let i = $index) {\n <sky-key-info\n [ngClass]=\"{\n 'sky-margin-stacked-lg': i < actualPayments.length - 1\n }\"\n >\n <sky-key-info-value class=\"sky-font-display-3\">\n {{ actual.value }}\n </sky-key-info-value>\n <sky-key-info-label>{{ actual.category }}</sky-key-info-label>\n </sky-key-info>\n }\n </div>\n <div class=\"box-2-projected\">\n <h3 class=\"sky-font-heading-4\">Projected</h3>\n @for (\n projected of projectedPayments;\n track projected;\n let i = $index\n ) {\n <sky-key-info\n [ngClass]=\"{\n 'sky-margin-stacked-lg': i < projectedPayments.length - 1\n }\"\n >\n <sky-key-info-value class=\"sky-font-display-3\">\n {{ projected.value }}\n </sky-key-info-value>\n <sky-key-info-label>\n {{ projected.category }}\n </sky-key-info-label>\n </sky-key-info>\n }\n </div>\n </div>\n </sky-box-content>\n </sky-box>\n </sky-column>\n <sky-column [screenMedium]=\"4\" [screenSmall]=\"12\">\n <sky-box headingText=\"Recent activity\">\n <sky-box-content>\n <sky-repeater>\n @for (activity of recentActivity; track activity) {\n <sky-repeater-item>\n <sky-repeater-item-content>\n <div class=\"sky-margin-stacked-xs\">\n {{ activity.activity }}\n </div>\n <div class=\"sky-font-deemphasized\">{{ activity.date }}</div>\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n </sky-repeater>\n </sky-box-content>\n </sky-box>\n </sky-column>\n </sky-row>\n</sky-fluid-grid>\n", styles: [".box-2-content{display:flex}.box-2-content div{display:flex;flex-direction:column;flex-grow:1}.box-2-content .box-2-actuals{margin-right:60px}\n"] }]
|
|
12176
12183
|
}] });
|
|
12177
12184
|
|
|
12178
12185
|
/**
|
|
12179
12186
|
* @title Record page with blocks layout using box components
|
|
12187
|
+
* @docsDemoHidden
|
|
12180
12188
|
*/
|
|
12181
12189
|
class PagesPageRecordPageBlocksLayoutExampleComponent {
|
|
12182
12190
|
constructor() {
|
|
@@ -12308,7 +12316,7 @@ class RecordPageAttachmentsTabComponent {
|
|
|
12308
12316
|
this.#dataManagerService.initDataView(this.#viewConfig);
|
|
12309
12317
|
}
|
|
12310
12318
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RecordPageAttachmentsTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12311
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: RecordPageAttachmentsTabComponent, isStandalone: true, selector: "app-record-page-attachments-tab", providers: [SkyDataManagerService], ngImport: i0, template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New attachment\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon icon=\"add\" />\n New\n </button>\n </sky-data-manager-toolbar-primary-item>\n </sky-data-manager-toolbar>\n </div>\n <div class=\"sky-margin-stacked-sm\">\n <sky-key-info layout=\"horizontal\" class=\"sky-padding-horizontal-sm\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ items.length }}\n </sky-key-info-value>\n <sky-key-info-label> Attachments </sky-key-info-label>\n </sky-key-info>\n </div>\n <sky-data-view skyAgGridDataManagerAdapter viewId=\"gridView\">\n <sky-ag-grid-wrapper>\n <ag-grid-angular [gridOptions]=\"gridOptions\" [rowData]=\"items\" />\n </sky-ag-grid-wrapper>\n </sky-data-view>\n</sky-data-manager>\n", dependencies: [{ kind: "ngmodule", type: AgGridModule }, { kind: "component", type: i1$b.AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "components", "editType", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableCellSpan", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "treeDataChildrenField", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "pinnedTopRowData", "pinnedBottomRowData", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "rowNumbers", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "themeCssLayer", "themeStyleContainer", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "advancedFilterBuilderVisibleChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }, { kind: "ngmodule", type: SkyAgGridModule }, { kind: "directive", type: i2$6.λ14, selector: "[skyAgGridDataManagerAdapter]", inputs: ["viewId"] }, { kind: "component", type: i2$6.λ12, selector: "sky-ag-grid-wrapper", inputs: ["compact", "minHeight"] }, { kind: "ngmodule", type: SkyDataManagerModule }, { kind: "component", type: i3$4.λ2, selector: "sky-data-manager" }, { kind: "component", type: i3$4.λ7, selector: "sky-data-manager-toolbar" }, { kind: "component", type: i3$4.λ4, selector: "sky-data-manager-toolbar-primary-item" }, { kind: "component", type: i3$4.λ8, selector: "sky-data-view", inputs: ["viewId"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }] }); }
|
|
12319
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: RecordPageAttachmentsTabComponent, isStandalone: true, selector: "app-record-page-attachments-tab", providers: [SkyDataManagerService], ngImport: i0, template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New attachment\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon iconName=\"add\" />\n New\n </button>\n </sky-data-manager-toolbar-primary-item>\n </sky-data-manager-toolbar>\n </div>\n <div class=\"sky-margin-stacked-sm\">\n <sky-key-info layout=\"horizontal\" class=\"sky-padding-horizontal-sm\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ items.length }}\n </sky-key-info-value>\n <sky-key-info-label> Attachments </sky-key-info-label>\n </sky-key-info>\n </div>\n <sky-data-view skyAgGridDataManagerAdapter viewId=\"gridView\">\n <sky-ag-grid-wrapper>\n <ag-grid-angular [gridOptions]=\"gridOptions\" [rowData]=\"items\" />\n </sky-ag-grid-wrapper>\n </sky-data-view>\n</sky-data-manager>\n", dependencies: [{ kind: "ngmodule", type: AgGridModule }, { kind: "component", type: i1$b.AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "components", "editType", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableCellSpan", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "treeDataChildrenField", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "pinnedTopRowData", "pinnedBottomRowData", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "rowNumbers", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "themeCssLayer", "themeStyleContainer", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "advancedFilterBuilderVisibleChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }, { kind: "ngmodule", type: SkyAgGridModule }, { kind: "directive", type: i2$6.λ14, selector: "[skyAgGridDataManagerAdapter]", inputs: ["viewId"] }, { kind: "component", type: i2$6.λ12, selector: "sky-ag-grid-wrapper", inputs: ["compact", "minHeight"] }, { kind: "ngmodule", type: SkyDataManagerModule }, { kind: "component", type: i3$4.λ2, selector: "sky-data-manager" }, { kind: "component", type: i3$4.λ7, selector: "sky-data-manager-toolbar" }, { kind: "component", type: i3$4.λ4, selector: "sky-data-manager-toolbar-primary-item" }, { kind: "component", type: i3$4.λ8, selector: "sky-data-view", inputs: ["viewId"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }] }); }
|
|
12312
12320
|
}
|
|
12313
12321
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RecordPageAttachmentsTabComponent, decorators: [{
|
|
12314
12322
|
type: Component,
|
|
@@ -12318,7 +12326,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
12318
12326
|
SkyDataManagerModule,
|
|
12319
12327
|
SkyKeyInfoModule,
|
|
12320
12328
|
SkyIconModule,
|
|
12321
|
-
], template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New attachment\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon
|
|
12329
|
+
], template: "<sky-data-manager>\n <div class=\"sky-margin-stacked-xs\">\n <sky-data-manager-toolbar>\n <sky-data-manager-toolbar-primary-item>\n <button\n aria-label=\"New attachment\"\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n >\n <sky-icon iconName=\"add\" />\n New\n </button>\n </sky-data-manager-toolbar-primary-item>\n </sky-data-manager-toolbar>\n </div>\n <div class=\"sky-margin-stacked-sm\">\n <sky-key-info layout=\"horizontal\" class=\"sky-padding-horizontal-sm\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ items.length }}\n </sky-key-info-value>\n <sky-key-info-label> Attachments </sky-key-info-label>\n </sky-key-info>\n </div>\n <sky-data-view skyAgGridDataManagerAdapter viewId=\"gridView\">\n <sky-ag-grid-wrapper>\n <ag-grid-angular [gridOptions]=\"gridOptions\" [rowData]=\"items\" />\n </sky-ag-grid-wrapper>\n </sky-data-view>\n</sky-data-manager>\n" }]
|
|
12322
12330
|
}], ctorParameters: () => [] });
|
|
12323
12331
|
|
|
12324
12332
|
class RecordPageNotesTabComponent {
|
|
@@ -12337,7 +12345,7 @@ class RecordPageNotesTabComponent {
|
|
|
12337
12345
|
];
|
|
12338
12346
|
}
|
|
12339
12347
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RecordPageNotesTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12340
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: RecordPageNotesTabComponent, isStandalone: true, selector: "app-record-page-notes-tab", ngImport: i0, template: "<div class=\"sky-margin-stacked-xs\">\n <sky-toolbar>\n <sky-toolbar-item>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n aria-label=\"New note\"\n >\n <sky-icon
|
|
12348
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: RecordPageNotesTabComponent, isStandalone: true, selector: "app-record-page-notes-tab", ngImport: i0, template: "<div class=\"sky-margin-stacked-xs\">\n <sky-toolbar>\n <sky-toolbar-item>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n aria-label=\"New note\"\n >\n <sky-icon iconName=\"add\" />\n New\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item>\n <sky-sort [showButtonText]=\"true\">\n <sky-sort-item>\n <span aria-label=\"Sort notes by date created (newest first)\">\n Date created (newest first)\n </span>\n </sky-sort-item>\n <sky-sort-item>\n <span aria-label=\"Sort notes by date created (oldest first)\">\n Date created (oldest first)\n </span>\n </sky-sort-item>\n </sky-sort>\n </sky-toolbar-item>\n <sky-toolbar-item>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n aria-label=\"Export notes\"\n >\n <sky-icon iconName=\"document-xls\" />\n Export\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item>\n <sky-search placeholderText=\"Find in notes\" />\n </sky-toolbar-item>\n </sky-toolbar>\n</div>\n<div class=\"sky-margin-stacked-sm\">\n <sky-key-info layout=\"horizontal\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ notes.length }}\n </sky-key-info-value>\n <sky-key-info-label> Notes </sky-key-info-label>\n </sky-key-info>\n</div>\n<sky-repeater>\n @for (note of notes; track note) {\n <sky-repeater-item>\n <sky-repeater-item-context-menu>\n <sky-dropdown\n buttonType=\"context-menu\"\n [label]=\"\n 'Context menu for note ' + note.noteNumber + ' from ' + note.date\n \"\n >\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Edit note ' + note.noteNumber + ' from ' + note.date\n \"\n >\n Edit\n </button>\n </sky-dropdown-item>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Delete note ' + note.noteNumber + ' from ' + note.date\n \"\n >\n Delete\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n <sky-repeater-item-content>\n <div class=\"sky-margin-stacked-xs\">\n {{ note.content }}\n </div>\n <div class=\"sky-font-deemphasized\">{{ note.date }}</div>\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n", dependencies: [{ kind: "ngmodule", type: SkyDropdownModule }, { kind: "component", type: i1$7.λ3, selector: "sky-dropdown", inputs: ["buttonStyle", "buttonType", "disabled", "label", "horizontalAlignment", "messageStream", "title", "trigger"] }, { kind: "component", type: i1$7.λ1, selector: "sky-dropdown-item", inputs: ["ariaRole"] }, { kind: "component", type: i1$7.λ4, selector: "sky-dropdown-menu", inputs: ["ariaLabelledBy", "ariaRole", "useNativeFocus"], outputs: ["menuChanges"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }, { kind: "component", type: i2$7.λ9, selector: "sky-repeater-item-context-menu" }, { kind: "ngmodule", type: SkySearchModule }, { kind: "component", type: i3$3.SkySearchComponent, selector: "sky-search", inputs: ["ariaLabel", "ariaLabelledBy", "searchText", "expandMode", "debounceTime", "disabled", "placeholderText"], outputs: ["searchApply", "searchChange", "searchClear"] }, { kind: "ngmodule", type: SkySortModule }, { kind: "component", type: i2$7.λ14, selector: "sky-sort", inputs: ["ariaLabel", "showButtonText"] }, { kind: "component", type: i2$7.λ13, selector: "sky-sort-item", inputs: ["active"], outputs: ["itemSelect"] }, { 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" }] }); }
|
|
12341
12349
|
}
|
|
12342
12350
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RecordPageNotesTabComponent, decorators: [{
|
|
12343
12351
|
type: Component,
|
|
@@ -12349,7 +12357,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
12349
12357
|
SkySearchModule,
|
|
12350
12358
|
SkySortModule,
|
|
12351
12359
|
SkyToolbarModule,
|
|
12352
|
-
], template: "<div class=\"sky-margin-stacked-xs\">\n <sky-toolbar>\n <sky-toolbar-item>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n aria-label=\"New note\"\n >\n <sky-icon
|
|
12360
|
+
], template: "<div class=\"sky-margin-stacked-xs\">\n <sky-toolbar>\n <sky-toolbar-item>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n aria-label=\"New note\"\n >\n <sky-icon iconName=\"add\" />\n New\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item>\n <sky-sort [showButtonText]=\"true\">\n <sky-sort-item>\n <span aria-label=\"Sort notes by date created (newest first)\">\n Date created (newest first)\n </span>\n </sky-sort-item>\n <sky-sort-item>\n <span aria-label=\"Sort notes by date created (oldest first)\">\n Date created (oldest first)\n </span>\n </sky-sort-item>\n </sky-sort>\n </sky-toolbar-item>\n <sky-toolbar-item>\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n aria-label=\"Export notes\"\n >\n <sky-icon iconName=\"document-xls\" />\n Export\n </button>\n </sky-toolbar-item>\n <sky-toolbar-item>\n <sky-search placeholderText=\"Find in notes\" />\n </sky-toolbar-item>\n </sky-toolbar>\n</div>\n<div class=\"sky-margin-stacked-sm\">\n <sky-key-info layout=\"horizontal\">\n <sky-key-info-value class=\"sky-font-display-4\">\n {{ notes.length }}\n </sky-key-info-value>\n <sky-key-info-label> Notes </sky-key-info-label>\n </sky-key-info>\n</div>\n<sky-repeater>\n @for (note of notes; track note) {\n <sky-repeater-item>\n <sky-repeater-item-context-menu>\n <sky-dropdown\n buttonType=\"context-menu\"\n [label]=\"\n 'Context menu for note ' + note.noteNumber + ' from ' + note.date\n \"\n >\n <sky-dropdown-menu>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Edit note ' + note.noteNumber + ' from ' + note.date\n \"\n >\n Edit\n </button>\n </sky-dropdown-item>\n <sky-dropdown-item>\n <button\n type=\"button\"\n [attr.aria-label]=\"\n 'Delete note ' + note.noteNumber + ' from ' + note.date\n \"\n >\n Delete\n </button>\n </sky-dropdown-item>\n </sky-dropdown-menu>\n </sky-dropdown>\n </sky-repeater-item-context-menu>\n <sky-repeater-item-content>\n <div class=\"sky-margin-stacked-xs\">\n {{ note.content }}\n </div>\n <div class=\"sky-font-deemphasized\">{{ note.date }}</div>\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n</sky-repeater>\n" }]
|
|
12353
12361
|
}] });
|
|
12354
12362
|
|
|
12355
12363
|
class RecordPageOverviewTabComponent {
|
|
@@ -12424,7 +12432,7 @@ class RecordPageOverviewTabComponent {
|
|
|
12424
12432
|
];
|
|
12425
12433
|
}
|
|
12426
12434
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RecordPageOverviewTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12427
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: RecordPageOverviewTabComponent, isStandalone: true, selector: "app-record-page-overview-tab", ngImport: i0, template: "<sky-fluid-grid gutterSize=\"medium\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"4\" [screenXSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Details\">\n <sky-box-controls>\n <button\n aria-label=\"Edit button for details\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n >\n <sky-icon
|
|
12435
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: RecordPageOverviewTabComponent, isStandalone: true, selector: "app-record-page-overview-tab", ngImport: i0, template: "<sky-fluid-grid gutterSize=\"medium\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"4\" [screenXSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Details\">\n <sky-box-controls>\n <button\n aria-label=\"Edit button for details\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </sky-box-controls>\n <sky-box-content>\n <sky-description-list mode=\"vertical\">\n @for (recordDetail of recordDetails; track recordDetail) {\n <sky-description-list-content>\n <sky-description-list-term>\n {{ recordDetail.detail }}\n </sky-description-list-term>\n <sky-description-list-description>\n {{ recordDetail.info }}\n </sky-description-list-description>\n </sky-description-list-content>\n }\n </sky-description-list>\n </sky-box-content>\n </sky-box>\n </sky-column>\n <sky-column [screenSmall]=\"4\" [screenXSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Payments\">\n <sky-box-content>\n <div class=\"box-2-content\">\n <div class=\"box-2-actuals\">\n <h3 class=\"sky-font-heading-4\">Actuals</h3>\n @for (actual of actualPayments; track actual; let i = $index) {\n <sky-key-info\n [ngClass]=\"{\n 'sky-margin-stacked-lg': i < actualPayments.length - 1\n }\"\n >\n <sky-key-info-value class=\"sky-font-display-3\">\n {{ actual.value }}\n </sky-key-info-value>\n <sky-key-info-label>{{ actual.category }}</sky-key-info-label>\n </sky-key-info>\n }\n </div>\n <div class=\"box-2-projected\">\n <h3 class=\"sky-font-heading-4\">Projected</h3>\n @for (\n projected of projectedPayments;\n track projected;\n let i = $index\n ) {\n <sky-key-info\n [ngClass]=\"{\n 'sky-margin-stacked-lg': i < projectedPayments.length - 1\n }\"\n >\n <sky-key-info-value class=\"sky-font-display-3\">\n {{ projected.value }}\n </sky-key-info-value>\n <sky-key-info-label>\n {{ projected.category }}\n </sky-key-info-label>\n </sky-key-info>\n }\n </div>\n </div>\n </sky-box-content>\n </sky-box>\n </sky-column>\n <sky-column [screenSmall]=\"4\" [screenXSmall]=\"12\">\n <sky-box headingText=\"Recent activity\">\n <sky-box-content>\n <sky-repeater>\n @for (activity of recentActivity; track activity) {\n <sky-repeater-item>\n <sky-repeater-item-content>\n <div class=\"sky-margin-stacked-xs\">\n {{ activity.activity }}\n </div>\n <div class=\"sky-font-deemphasized\">{{ activity.date }}</div>\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n </sky-repeater>\n </sky-box-content>\n </sky-box>\n </sky-column>\n </sky-row>\n</sky-fluid-grid>\n", styles: [".box-2-content{display:flex}.box-2-content div{display:flex;flex-direction:column;flex-grow:1}.box-2-content .box-2-actuals{margin-right:60px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$c.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: SkyBoxModule }, { kind: "component", type: i1$5.λ41, selector: "sky-box", inputs: ["headingText", "headingHidden", "headingLevel", "headingStyle", "helpPopoverContent", "helpPopoverTitle", "helpKey", "ariaLabel", "ariaLabelledBy", "ariaRole"] }, { kind: "component", type: i1$5.λ43, selector: "sky-box-content" }, { kind: "component", type: i1$5.λ44, selector: "sky-box-controls" }, { kind: "ngmodule", type: SkyDescriptionListModule }, { kind: "component", type: i1$5.λ18, selector: "sky-description-list", inputs: ["defaultDescription", "listItemWidth", "mode"] }, { kind: "component", type: i1$5.λ21, selector: "sky-description-list-content", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle"] }, { kind: "component", type: i1$5.λ19, selector: "sky-description-list-term" }, { kind: "component", type: i1$5.λ20, selector: "sky-description-list-description" }, { 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: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyKeyInfoModule }, { kind: "component", type: i1$2.λ8, selector: "sky-key-info", inputs: ["helpKey", "helpPopoverContent", "helpPopoverTitle", "layout"] }, { kind: "component", type: i1$2.λ6, selector: "sky-key-info-label" }, { kind: "component", type: i1$2.λ7, selector: "sky-key-info-value" }, { kind: "ngmodule", type: SkyRepeaterModule }, { kind: "component", type: i2$7.λ11, selector: "sky-repeater", inputs: ["activeIndex", "ariaLabel", "reorderable", "expandMode"], outputs: ["activeIndexChange", "orderChange"] }, { kind: "component", type: i2$7.λ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$7.λ8, selector: "sky-repeater-item-content" }] }); }
|
|
12428
12436
|
}
|
|
12429
12437
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RecordPageOverviewTabComponent, decorators: [{
|
|
12430
12438
|
type: Component,
|
|
@@ -12436,7 +12444,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
12436
12444
|
SkyIconModule,
|
|
12437
12445
|
SkyKeyInfoModule,
|
|
12438
12446
|
SkyRepeaterModule,
|
|
12439
|
-
], template: "<sky-fluid-grid gutterSize=\"medium\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"4\" [screenXSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Details\">\n <sky-box-controls>\n <button\n aria-label=\"Edit button for details\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n >\n <sky-icon
|
|
12447
|
+
], template: "<sky-fluid-grid gutterSize=\"medium\" [disableMargin]=\"true\">\n <sky-row>\n <sky-column [screenSmall]=\"4\" [screenXSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Details\">\n <sky-box-controls>\n <button\n aria-label=\"Edit button for details\"\n class=\"sky-btn sky-btn-icon-borderless\"\n type=\"button\"\n >\n <sky-icon iconName=\"edit\" />\n </button>\n </sky-box-controls>\n <sky-box-content>\n <sky-description-list mode=\"vertical\">\n @for (recordDetail of recordDetails; track recordDetail) {\n <sky-description-list-content>\n <sky-description-list-term>\n {{ recordDetail.detail }}\n </sky-description-list-term>\n <sky-description-list-description>\n {{ recordDetail.info }}\n </sky-description-list-description>\n </sky-description-list-content>\n }\n </sky-description-list>\n </sky-box-content>\n </sky-box>\n </sky-column>\n <sky-column [screenSmall]=\"4\" [screenXSmall]=\"12\">\n <sky-box class=\"sky-margin-stacked-xl\" headingText=\"Payments\">\n <sky-box-content>\n <div class=\"box-2-content\">\n <div class=\"box-2-actuals\">\n <h3 class=\"sky-font-heading-4\">Actuals</h3>\n @for (actual of actualPayments; track actual; let i = $index) {\n <sky-key-info\n [ngClass]=\"{\n 'sky-margin-stacked-lg': i < actualPayments.length - 1\n }\"\n >\n <sky-key-info-value class=\"sky-font-display-3\">\n {{ actual.value }}\n </sky-key-info-value>\n <sky-key-info-label>{{ actual.category }}</sky-key-info-label>\n </sky-key-info>\n }\n </div>\n <div class=\"box-2-projected\">\n <h3 class=\"sky-font-heading-4\">Projected</h3>\n @for (\n projected of projectedPayments;\n track projected;\n let i = $index\n ) {\n <sky-key-info\n [ngClass]=\"{\n 'sky-margin-stacked-lg': i < projectedPayments.length - 1\n }\"\n >\n <sky-key-info-value class=\"sky-font-display-3\">\n {{ projected.value }}\n </sky-key-info-value>\n <sky-key-info-label>\n {{ projected.category }}\n </sky-key-info-label>\n </sky-key-info>\n }\n </div>\n </div>\n </sky-box-content>\n </sky-box>\n </sky-column>\n <sky-column [screenSmall]=\"4\" [screenXSmall]=\"12\">\n <sky-box headingText=\"Recent activity\">\n <sky-box-content>\n <sky-repeater>\n @for (activity of recentActivity; track activity) {\n <sky-repeater-item>\n <sky-repeater-item-content>\n <div class=\"sky-margin-stacked-xs\">\n {{ activity.activity }}\n </div>\n <div class=\"sky-font-deemphasized\">{{ activity.date }}</div>\n </sky-repeater-item-content>\n </sky-repeater-item>\n }\n </sky-repeater>\n </sky-box-content>\n </sky-box>\n </sky-column>\n </sky-row>\n</sky-fluid-grid>\n", styles: [".box-2-content{display:flex}.box-2-content div{display:flex;flex-direction:column;flex-grow:1}.box-2-content .box-2-actuals{margin-right:60px}\n"] }]
|
|
12440
12448
|
}] });
|
|
12441
12449
|
|
|
12442
12450
|
class RecordPageContentComponent {
|
|
@@ -12458,6 +12466,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
12458
12466
|
|
|
12459
12467
|
/**
|
|
12460
12468
|
* @title Record page with tabs layout using data manager
|
|
12469
|
+
* @docsDemoHidden
|
|
12461
12470
|
*/
|
|
12462
12471
|
class PagesPageRecordPageTabsLayoutExampleComponent {
|
|
12463
12472
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PagesPageRecordPageTabsLayoutExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
@@ -12656,6 +12665,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
12656
12665
|
|
|
12657
12666
|
/**
|
|
12658
12667
|
* @title Split view page with fit layout
|
|
12668
|
+
* @docsDemoHidden
|
|
12659
12669
|
*/
|
|
12660
12670
|
class PagesPageSplitViewPageFitLayoutExampleComponent {
|
|
12661
12671
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PagesPageSplitViewPageFitLayoutExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
@@ -13383,7 +13393,7 @@ let ModalComponent$1 = class ModalComponent {
|
|
|
13383
13393
|
this.sectionedFormComponent?.showTabs();
|
|
13384
13394
|
}
|
|
13385
13395
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
13386
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ModalComponent, isStandalone: true, selector: "app-modal", viewQueries: [{ propertyName: "sectionedFormComponent", first: true, predicate: SkySectionedFormComponent, descendants: true }], ngImport: i0, template: "<sky-modal [headingText]=\"'Sectioned form \u2014 Index: ' + activeIndexDisplay\">\n <sky-modal-content>\n <sky-sectioned-form (indexChanged)=\"onIndexChanged($event)\">\n <sky-sectioned-form-section heading=\"Basic information\">\n <app-information-form />\n </sky-sectioned-form-section>\n <sky-sectioned-form-section\n heading=\"Addresses\"\n [itemCount]=\"2\"\n [active]=\"activeTab\"\n >\n <app-address-form />\n </sky-sectioned-form-section>\n <sky-sectioned-form-section heading=\"Phone numbers\" [itemCount]=\"3\">\n <app-phone-form />\n </sky-sectioned-form-section>\n </sky-sectioned-form>\n </sky-modal-content>\n <sky-modal-footer>\n @if (tabsHidden()) {\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"showTabs()\"\n >\n <sky-icon
|
|
13396
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ModalComponent, isStandalone: true, selector: "app-modal", viewQueries: [{ propertyName: "sectionedFormComponent", first: true, predicate: SkySectionedFormComponent, descendants: true }], ngImport: i0, template: "<sky-modal [headingText]=\"'Sectioned form \u2014 Index: ' + activeIndexDisplay\">\n <sky-modal-content>\n <sky-sectioned-form (indexChanged)=\"onIndexChanged($event)\">\n <sky-sectioned-form-section heading=\"Basic information\">\n <app-information-form />\n </sky-sectioned-form-section>\n <sky-sectioned-form-section\n heading=\"Addresses\"\n [itemCount]=\"2\"\n [active]=\"activeTab\"\n >\n <app-address-form />\n </sky-sectioned-form-section>\n <sky-sectioned-form-section heading=\"Phone numbers\" [itemCount]=\"3\">\n <app-phone-form />\n </sky-sectioned-form-section>\n </sky-sectioned-form>\n </sky-modal-content>\n <sky-modal-footer>\n @if (tabsHidden()) {\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"showTabs()\"\n >\n <sky-icon iconName=\"chevron-left\" />\n Show sections\n </button>\n }\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"modalInstance.save()\"\n >\n Save\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"modalInstance.cancel()\"\n >\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n", dependencies: [{ kind: "component", type: AddressFormComponent, selector: "app-address-form" }, { kind: "component", type: InformationFormComponent, selector: "app-information-form" }, { kind: "component", type: PhoneFormComponent, selector: "app-phone-form" }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i1$4.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyModalModule }, { kind: "component", type: i3$2.λ5, selector: "sky-modal", inputs: ["formErrors", "headingText", "helpKey", "helpPopoverContent", "helpPopoverTitle", "ariaRole", "tiledBody", "ariaDescribedBy", "ariaLabelledBy", "layout"] }, { kind: "component", type: i3$2.λ2, selector: "sky-modal-content" }, { kind: "component", type: i3$2.λ3, selector: "sky-modal-footer" }, { kind: "ngmodule", type: SkySectionedFormModule }, { kind: "component", type: i1$9.SkySectionedFormComponent, selector: "sky-sectioned-form", inputs: ["maintainSectionContent", "messageStream"], outputs: ["indexChanged", "tabsVisibleChanged"] }, { kind: "component", type: i1$9.λ5, selector: "sky-sectioned-form-section", inputs: ["heading", "itemCount", "active"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
13387
13397
|
};
|
|
13388
13398
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ModalComponent$1, decorators: [{
|
|
13389
13399
|
type: Component,
|
|
@@ -13394,7 +13404,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
13394
13404
|
SkyIconModule,
|
|
13395
13405
|
SkyModalModule,
|
|
13396
13406
|
SkySectionedFormModule,
|
|
13397
|
-
], template: "<sky-modal [headingText]=\"'Sectioned form \u2014 Index: ' + activeIndexDisplay\">\n <sky-modal-content>\n <sky-sectioned-form (indexChanged)=\"onIndexChanged($event)\">\n <sky-sectioned-form-section heading=\"Basic information\">\n <app-information-form />\n </sky-sectioned-form-section>\n <sky-sectioned-form-section\n heading=\"Addresses\"\n [itemCount]=\"2\"\n [active]=\"activeTab\"\n >\n <app-address-form />\n </sky-sectioned-form-section>\n <sky-sectioned-form-section heading=\"Phone numbers\" [itemCount]=\"3\">\n <app-phone-form />\n </sky-sectioned-form-section>\n </sky-sectioned-form>\n </sky-modal-content>\n <sky-modal-footer>\n @if (tabsHidden()) {\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"showTabs()\"\n >\n <sky-icon
|
|
13407
|
+
], template: "<sky-modal [headingText]=\"'Sectioned form \u2014 Index: ' + activeIndexDisplay\">\n <sky-modal-content>\n <sky-sectioned-form (indexChanged)=\"onIndexChanged($event)\">\n <sky-sectioned-form-section heading=\"Basic information\">\n <app-information-form />\n </sky-sectioned-form-section>\n <sky-sectioned-form-section\n heading=\"Addresses\"\n [itemCount]=\"2\"\n [active]=\"activeTab\"\n >\n <app-address-form />\n </sky-sectioned-form-section>\n <sky-sectioned-form-section heading=\"Phone numbers\" [itemCount]=\"3\">\n <app-phone-form />\n </sky-sectioned-form-section>\n </sky-sectioned-form>\n </sky-modal-content>\n <sky-modal-footer>\n @if (tabsHidden()) {\n <button\n class=\"sky-btn sky-btn-default\"\n type=\"button\"\n (click)=\"showTabs()\"\n >\n <sky-icon iconName=\"chevron-left\" />\n Show sections\n </button>\n }\n <button\n class=\"sky-btn sky-btn-primary\"\n type=\"button\"\n (click)=\"modalInstance.save()\"\n >\n Save\n </button>\n <button\n class=\"sky-btn sky-btn-link\"\n type=\"button\"\n (click)=\"modalInstance.cancel()\"\n >\n Cancel\n </button>\n </sky-modal-footer>\n</sky-modal>\n" }]
|
|
13398
13408
|
}], propDecorators: { sectionedFormComponent: [{
|
|
13399
13409
|
type: ViewChild,
|
|
13400
13410
|
args: [SkySectionedFormComponent]
|
|
@@ -13529,11 +13539,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
13529
13539
|
*/
|
|
13530
13540
|
class TabsVerticalTabsBasicExampleComponent {
|
|
13531
13541
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsVerticalTabsBasicExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
13532
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: TabsVerticalTabsBasicExampleComponent, isStandalone: true, selector: "app-tabs-vertical-tabs-basic-example", ngImport: i0, template: "<sky-vertical-tabset>\n <sky-vertical-tab tabHeading=\"Tab 1\"> Tab 1 content </sky-vertical-tab>\n <sky-vertical-tab tabHeading=\"Tab 2\" [active]=\"true\">\n Tab 2 content\n </sky-vertical-tab>\n <sky-vertical-tab tabHeading=\"Tab 3\"
|
|
13542
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: TabsVerticalTabsBasicExampleComponent, isStandalone: true, selector: "app-tabs-vertical-tabs-basic-example", ngImport: i0, template: "<sky-vertical-tabset data-sky-id=\"vertical-tabs-basic\">\n <sky-vertical-tab tabHeading=\"Tab 1\"> Tab 1 content </sky-vertical-tab>\n <sky-vertical-tab tabHeading=\"Tab 2\" [active]=\"true\">\n Tab 2 content\n </sky-vertical-tab>\n <sky-vertical-tab tabHeading=\"Tab 3\" [disabled]=\"true\">\n Tab 3 content\n </sky-vertical-tab>\n</sky-vertical-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyVerticalTabsetModule }, { kind: "component", type: i1$9.λ6, selector: "sky-vertical-tabset", inputs: ["showTabsText", "ariaLabel", "ariaLabelledBy", "ariaRole", "maintainTabContent"], outputs: ["activeChange"] }, { kind: "component", type: i1$9.λ4, selector: "sky-vertical-tab", inputs: ["active", "ariaControls", "ariaRole", "disabled", "errorIndicator", "requiredIndicator", "tabHeaderCount", "tabHeading", "showTabRightArrow", "tabId"] }] }); }
|
|
13533
13543
|
}
|
|
13534
13544
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsVerticalTabsBasicExampleComponent, decorators: [{
|
|
13535
13545
|
type: Component,
|
|
13536
|
-
args: [{ selector: 'app-tabs-vertical-tabs-basic-example', imports: [SkyVerticalTabsetModule], template: "<sky-vertical-tabset>\n <sky-vertical-tab tabHeading=\"Tab 1\"> Tab 1 content </sky-vertical-tab>\n <sky-vertical-tab tabHeading=\"Tab 2\" [active]=\"true\">\n Tab 2 content\n </sky-vertical-tab>\n <sky-vertical-tab tabHeading=\"Tab 3\"
|
|
13546
|
+
args: [{ selector: 'app-tabs-vertical-tabs-basic-example', imports: [SkyVerticalTabsetModule], template: "<sky-vertical-tabset data-sky-id=\"vertical-tabs-basic\">\n <sky-vertical-tab tabHeading=\"Tab 1\"> Tab 1 content </sky-vertical-tab>\n <sky-vertical-tab tabHeading=\"Tab 2\" [active]=\"true\">\n Tab 2 content\n </sky-vertical-tab>\n <sky-vertical-tab tabHeading=\"Tab 3\" [disabled]=\"true\">\n Tab 3 content\n </sky-vertical-tab>\n</sky-vertical-tabset>\n" }]
|
|
13537
13547
|
}] });
|
|
13538
13548
|
|
|
13539
13549
|
class ModalComponent {
|
|
@@ -13652,11 +13662,11 @@ class TabsVerticalTabsGroupedExampleComponent {
|
|
|
13652
13662
|
];
|
|
13653
13663
|
}
|
|
13654
13664
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsVerticalTabsGroupedExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
13655
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TabsVerticalTabsGroupedExampleComponent, isStandalone: true, selector: "app-tabs-vertical-tabs-grouped-example", ngImport: i0, template: "<sky-vertical-tabset showTabsText=\"Tab list\">\n @for (group of groups; track group) {\n <sky-vertical-tabset-group\n [groupHeading]=\"group.heading\"\n [open]=\"group.isOpen\"\n [disabled]=\"group.isDisabled\"\n >\n @for (tab of group.subTabs; track tab) {\n <sky-vertical-tab\n [active]=\"tab.active\"\n [tabHeading]=\"tab.tabHeading\"\n [tabHeaderCount]=\"tab.tabHeaderCount\"\n [disabled]=\"tab.disabled\"\n >\n {{ tab.content }}\n </sky-vertical-tab>\n }\n </sky-vertical-tabset-group>\n }\n</sky-vertical-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyVerticalTabsetModule }, { kind: "component", type: i1$9.λ6, selector: "sky-vertical-tabset", inputs: ["showTabsText", "ariaLabel", "ariaLabelledBy", "ariaRole", "maintainTabContent"], outputs: ["activeChange"] }, { kind: "component", type: i1$9.λ7, selector: "sky-vertical-tabset-group", inputs: ["disabled", "groupHeading", "open"] }, { kind: "component", type: i1$9.λ4, selector: "sky-vertical-tab", inputs: ["active", "ariaControls", "ariaRole", "disabled", "errorIndicator", "requiredIndicator", "tabHeaderCount", "tabHeading", "showTabRightArrow", "tabId"] }] }); }
|
|
13665
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TabsVerticalTabsGroupedExampleComponent, isStandalone: true, selector: "app-tabs-vertical-tabs-grouped-example", ngImport: i0, template: "<sky-vertical-tabset data-sky-id=\"vertical-tabs-group\" showTabsText=\"Tab list\">\n @for (group of groups; track group) {\n <sky-vertical-tabset-group\n [groupHeading]=\"group.heading\"\n [open]=\"group.isOpen\"\n [disabled]=\"group.isDisabled\"\n >\n @for (tab of group.subTabs; track tab) {\n <sky-vertical-tab\n [active]=\"tab.active\"\n [tabHeading]=\"tab.tabHeading\"\n [tabHeaderCount]=\"tab.tabHeaderCount\"\n [disabled]=\"tab.disabled\"\n >\n {{ tab.content }}\n </sky-vertical-tab>\n }\n </sky-vertical-tabset-group>\n }\n</sky-vertical-tabset>\n", dependencies: [{ kind: "ngmodule", type: SkyVerticalTabsetModule }, { kind: "component", type: i1$9.λ6, selector: "sky-vertical-tabset", inputs: ["showTabsText", "ariaLabel", "ariaLabelledBy", "ariaRole", "maintainTabContent"], outputs: ["activeChange"] }, { kind: "component", type: i1$9.λ7, selector: "sky-vertical-tabset-group", inputs: ["disabled", "groupHeading", "open"] }, { kind: "component", type: i1$9.λ4, selector: "sky-vertical-tab", inputs: ["active", "ariaControls", "ariaRole", "disabled", "errorIndicator", "requiredIndicator", "tabHeaderCount", "tabHeading", "showTabRightArrow", "tabId"] }] }); }
|
|
13656
13666
|
}
|
|
13657
13667
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TabsVerticalTabsGroupedExampleComponent, decorators: [{
|
|
13658
13668
|
type: Component,
|
|
13659
|
-
args: [{ selector: 'app-tabs-vertical-tabs-grouped-example', imports: [SkyVerticalTabsetModule], template: "<sky-vertical-tabset showTabsText=\"Tab list\">\n @for (group of groups; track group) {\n <sky-vertical-tabset-group\n [groupHeading]=\"group.heading\"\n [open]=\"group.isOpen\"\n [disabled]=\"group.isDisabled\"\n >\n @for (tab of group.subTabs; track tab) {\n <sky-vertical-tab\n [active]=\"tab.active\"\n [tabHeading]=\"tab.tabHeading\"\n [tabHeaderCount]=\"tab.tabHeaderCount\"\n [disabled]=\"tab.disabled\"\n >\n {{ tab.content }}\n </sky-vertical-tab>\n }\n </sky-vertical-tabset-group>\n }\n</sky-vertical-tabset>\n" }]
|
|
13669
|
+
args: [{ selector: 'app-tabs-vertical-tabs-grouped-example', imports: [SkyVerticalTabsetModule], template: "<sky-vertical-tabset data-sky-id=\"vertical-tabs-group\" showTabsText=\"Tab list\">\n @for (group of groups; track group) {\n <sky-vertical-tabset-group\n [groupHeading]=\"group.heading\"\n [open]=\"group.isOpen\"\n [disabled]=\"group.isDisabled\"\n >\n @for (tab of group.subTabs; track tab) {\n <sky-vertical-tab\n [active]=\"tab.active\"\n [tabHeading]=\"tab.tabHeading\"\n [tabHeaderCount]=\"tab.tabHeaderCount\"\n [disabled]=\"tab.disabled\"\n >\n {{ tab.content }}\n </sky-vertical-tab>\n }\n </sky-vertical-tabset-group>\n }\n</sky-vertical-tabset>\n" }]
|
|
13660
13670
|
}] });
|
|
13661
13671
|
|
|
13662
13672
|
class Tile1Component {
|