@skyux/code-examples 12.0.0 → 12.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -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
|
|
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 <sky-icon data-sky-id=\"text-button-icon\" iconName=\"save\" />\n 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
|
|
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 <sky-icon data-sky-id=\"text-button-icon\" iconName=\"save\" />\n 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
|
/**
|
|
@@ -1866,7 +1866,7 @@ let ViewGridComponent$3 = class ViewGridComponent {
|
|
|
1866
1866
|
this.viewConfig = {
|
|
1867
1867
|
id: this.#viewId,
|
|
1868
1868
|
name: 'Data Grid View',
|
|
1869
|
-
|
|
1869
|
+
iconName: 'table',
|
|
1870
1870
|
searchEnabled: true,
|
|
1871
1871
|
multiselectToolbarEnabled: true,
|
|
1872
1872
|
columnPickerEnabled: true,
|
|
@@ -3760,7 +3760,7 @@ let ViewGridComponent$2 = class ViewGridComponent {
|
|
|
3760
3760
|
this.viewConfig = {
|
|
3761
3761
|
id: this.#viewId,
|
|
3762
3762
|
name: 'Data Grid View',
|
|
3763
|
-
|
|
3763
|
+
iconName: 'table',
|
|
3764
3764
|
searchEnabled: true,
|
|
3765
3765
|
columnPickerEnabled: true,
|
|
3766
3766
|
filterButtonEnabled: true,
|
|
@@ -4310,7 +4310,7 @@ let ViewGridComponent$1 = class ViewGridComponent {
|
|
|
4310
4310
|
this.viewConfig = {
|
|
4311
4311
|
id: this.#viewId,
|
|
4312
4312
|
name: 'Data Grid View',
|
|
4313
|
-
|
|
4313
|
+
iconName: 'table',
|
|
4314
4314
|
searchEnabled: true,
|
|
4315
4315
|
multiselectToolbarEnabled: true,
|
|
4316
4316
|
columnPickerEnabled: true,
|
|
@@ -6044,7 +6044,7 @@ class ViewGridComponent {
|
|
|
6044
6044
|
this.#viewConfig = {
|
|
6045
6045
|
id: this.viewId,
|
|
6046
6046
|
name: 'Grid View',
|
|
6047
|
-
|
|
6047
|
+
iconName: 'table',
|
|
6048
6048
|
searchEnabled: true,
|
|
6049
6049
|
multiselectToolbarEnabled: true,
|
|
6050
6050
|
columnPickerEnabled: true,
|
|
@@ -6204,7 +6204,7 @@ class ViewRepeaterComponent {
|
|
|
6204
6204
|
this.#viewConfig = {
|
|
6205
6205
|
id: this.viewId,
|
|
6206
6206
|
name: 'Repeater View',
|
|
6207
|
-
|
|
6207
|
+
iconName: 'text-bullet-list',
|
|
6208
6208
|
searchEnabled: true,
|
|
6209
6209
|
sortEnabled: true,
|
|
6210
6210
|
filterButtonEnabled: true,
|
|
@@ -8907,11 +8907,11 @@ class LayoutToolbarSectionedExampleComponent {
|
|
|
8907
8907
|
alert(buttonText + ' clicked!');
|
|
8908
8908
|
}
|
|
8909
8909
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutToolbarSectionedExampleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
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-
|
|
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-sort\" /> Sort\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\" /> 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" }] }); }
|
|
8911
8911
|
}
|
|
8912
8912
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutToolbarSectionedExampleComponent, decorators: [{
|
|
8913
8913
|
type: Component,
|
|
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-
|
|
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-sort\" /> Sort\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\" /> Filter\n </button>\n </sky-toolbar-item>\n </sky-toolbar-section>\n</sky-toolbar>\n" }]
|
|
8915
8915
|
}] });
|
|
8916
8916
|
|
|
8917
8917
|
/**
|
|
@@ -10808,11 +10808,11 @@ class AddItemModalComponent {
|
|
|
10808
10808
|
}
|
|
10809
10809
|
}
|
|
10810
10810
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AddItemModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10811
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AddItemModalComponent, isStandalone: true, selector: "app-add-item-modal", ngImport: i0, template: "<form novalidate [formGroup]=\"formGroup\" (ngSubmit)=\"save()\">\n <sky-modal headingText=\"Add Item\">\n <sky-modal-content>\n <sky-input-box labelText=\"Name\">\n <input\n type=\"text\"\n autocapitalize=\"words\"\n autocomplete=\"off\"\n formControlName=\"name\"\n class=\"sky-form-control\"\n />\n </sky-input-box>\n </sky-modal-content>\n <sky-modal-footer>\n <button class=\"sky-btn sky-btn-
|
|
10811
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AddItemModalComponent, isStandalone: true, selector: "app-add-item-modal", ngImport: i0, template: "<form novalidate [formGroup]=\"formGroup\" (ngSubmit)=\"save()\">\n <sky-modal headingText=\"Add Item\">\n <sky-modal-content>\n <sky-input-box labelText=\"Name\">\n <input\n type=\"text\"\n autocapitalize=\"words\"\n autocomplete=\"off\"\n formControlName=\"name\"\n class=\"sky-form-control\"\n />\n </sky-input-box>\n </sky-modal-content>\n <sky-modal-footer>\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Add</button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"close()\">\n Cancel\n </button>\n </sky-modal-footer>\n </sky-modal>\n</form>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.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: SkyInputBoxModule }, { kind: "component", type: i2.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { 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" }] }); }
|
|
10812
10812
|
}
|
|
10813
10813
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AddItemModalComponent, decorators: [{
|
|
10814
10814
|
type: Component,
|
|
10815
|
-
args: [{ selector: 'app-add-item-modal', imports: [ReactiveFormsModule, SkyInputBoxModule, SkyModalModule], template: "<form novalidate [formGroup]=\"formGroup\" (ngSubmit)=\"save()\">\n <sky-modal headingText=\"Add Item\">\n <sky-modal-content>\n <sky-input-box labelText=\"Name\">\n <input\n type=\"text\"\n autocapitalize=\"words\"\n autocomplete=\"off\"\n formControlName=\"name\"\n class=\"sky-form-control\"\n />\n </sky-input-box>\n </sky-modal-content>\n <sky-modal-footer>\n <button class=\"sky-btn sky-btn-
|
|
10815
|
+
args: [{ selector: 'app-add-item-modal', imports: [ReactiveFormsModule, SkyInputBoxModule, SkyModalModule], template: "<form novalidate [formGroup]=\"formGroup\" (ngSubmit)=\"save()\">\n <sky-modal headingText=\"Add Item\">\n <sky-modal-content>\n <sky-input-box labelText=\"Name\">\n <input\n type=\"text\"\n autocapitalize=\"words\"\n autocomplete=\"off\"\n formControlName=\"name\"\n class=\"sky-form-control\"\n />\n </sky-input-box>\n </sky-modal-content>\n <sky-modal-footer>\n <button class=\"sky-btn sky-btn-primary\" type=\"submit\">Add</button>\n <button class=\"sky-btn sky-btn-link\" type=\"button\" (click)=\"close()\">\n Cancel\n </button>\n </sky-modal-footer>\n </sky-modal>\n</form>\n" }]
|
|
10816
10816
|
}], ctorParameters: () => [] });
|
|
10817
10817
|
|
|
10818
10818
|
const people$1 = [
|