@skyux/tiles 5.0.1 → 5.5.0-alpha.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.
Files changed (104) hide show
  1. package/README.md +6 -4
  2. package/bundles/skyux-tiles.umd.js +77 -55
  3. package/documentation.json +392 -253
  4. package/esm2015/index.js +24 -0
  5. package/esm2015/index.js.map +1 -0
  6. package/esm2015/lib/modules/shared/sky-tiles-resources.module.js +60 -0
  7. package/esm2015/lib/modules/shared/sky-tiles-resources.module.js.map +1 -0
  8. package/esm2015/lib/modules/tiles/tile/tile-summary.component.js +19 -0
  9. package/esm2015/lib/modules/tiles/tile/tile-summary.component.js.map +1 -0
  10. package/esm2015/lib/modules/tiles/tile/tile-title.component.js +19 -0
  11. package/esm2015/lib/modules/tiles/tile/tile-title.component.js.map +1 -0
  12. package/esm2015/lib/modules/tiles/tile/tile.component.js +165 -0
  13. package/esm2015/lib/modules/tiles/tile/tile.component.js.map +1 -0
  14. package/esm2015/lib/modules/tiles/tile/tile.module.js +53 -0
  15. package/esm2015/lib/modules/tiles/tile/tile.module.js.map +1 -0
  16. package/esm2015/lib/modules/tiles/tile-content/tile-content-section.component.js +19 -0
  17. package/esm2015/lib/modules/tiles/tile-content/tile-content-section.component.js.map +1 -0
  18. package/esm2015/lib/modules/tiles/tile-content/tile-content.component.js +18 -0
  19. package/esm2015/lib/modules/tiles/tile-content/tile-content.component.js.map +1 -0
  20. package/esm2015/lib/modules/tiles/tile-content/tile-content.module.js +20 -0
  21. package/esm2015/lib/modules/tiles/tile-content/tile-content.module.js.map +1 -0
  22. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard-message-type.js +15 -0
  23. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard-message-type.js.map +1 -0
  24. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard-message.js +2 -0
  25. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard-message.js.map +1 -0
  26. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard.component.js +133 -0
  27. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard.component.js.map +1 -0
  28. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard.module.js +32 -0
  29. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard.module.js.map +1 -0
  30. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard.service.js +523 -0
  31. package/esm2015/lib/modules/tiles/tile-dashboard/tile-dashboard.service.js.map +1 -0
  32. package/esm2015/{modules → lib/modules}/tiles/tile-dashboard-column/tile-dashboard-column.component.js +6 -5
  33. package/esm2015/lib/modules/tiles/tile-dashboard-column/tile-dashboard-column.component.js.map +1 -0
  34. package/esm2015/lib/modules/tiles/tile-dashboard-column/tile-dashboard-column.module.js +19 -0
  35. package/esm2015/lib/modules/tiles/tile-dashboard-column/tile-dashboard-column.module.js.map +1 -0
  36. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-layout-column.js +2 -0
  37. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-layout-column.js.map +1 -0
  38. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-layout-tile.js +2 -0
  39. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-layout-tile.js.map +1 -0
  40. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-layout.js +2 -0
  41. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-layout.js.map +1 -0
  42. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-reorder-data.js +2 -0
  43. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-reorder-data.js.map +1 -0
  44. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-tile.js +2 -0
  45. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-tile.js.map +1 -0
  46. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config.js +2 -0
  47. package/esm2015/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config.js.map +1 -0
  48. package/esm2015/lib/modules/tiles/tiles.module.js +31 -0
  49. package/esm2015/lib/modules/tiles/tiles.module.js.map +1 -0
  50. package/esm2015/skyux-tiles.js +2 -2
  51. package/esm2015/skyux-tiles.js.map +1 -0
  52. package/fesm2015/skyux-tiles.js +77 -55
  53. package/fesm2015/skyux-tiles.js.map +1 -1
  54. package/index.d.ts +21 -0
  55. package/{modules → lib/modules}/shared/sky-tiles-resources.module.d.ts +0 -0
  56. package/{modules → lib/modules}/tiles/tile/tile-summary.component.d.ts +0 -0
  57. package/{modules → lib/modules}/tiles/tile/tile-title.component.d.ts +0 -0
  58. package/{modules → lib/modules}/tiles/tile/tile.component.d.ts +5 -1
  59. package/{modules → lib/modules}/tiles/tile/tile.module.d.ts +5 -4
  60. package/{modules → lib/modules}/tiles/tile-content/tile-content-section.component.d.ts +0 -0
  61. package/{modules → lib/modules}/tiles/tile-content/tile-content.component.d.ts +0 -0
  62. package/{modules → lib/modules}/tiles/tile-content/tile-content.module.d.ts +0 -0
  63. package/{modules → lib/modules}/tiles/tile-dashboard/tile-dashboard-message-type.d.ts +0 -0
  64. package/{modules → lib/modules}/tiles/tile-dashboard/tile-dashboard-message.d.ts +0 -0
  65. package/{modules → lib/modules}/tiles/tile-dashboard/tile-dashboard.component.d.ts +1 -0
  66. package/{modules → lib/modules}/tiles/tile-dashboard/tile-dashboard.module.d.ts +2 -1
  67. package/{modules → lib/modules}/tiles/tile-dashboard/tile-dashboard.service.d.ts +0 -0
  68. package/{modules → lib/modules}/tiles/tile-dashboard-column/tile-dashboard-column.component.d.ts +0 -0
  69. package/{modules → lib/modules}/tiles/tile-dashboard-column/tile-dashboard-column.module.d.ts +0 -0
  70. package/{modules → lib/modules}/tiles/tile-dashboard-config/tile-dashboard-config-layout-column.d.ts +0 -0
  71. package/{modules → lib/modules}/tiles/tile-dashboard-config/tile-dashboard-config-layout-tile.d.ts +0 -0
  72. package/{modules → lib/modules}/tiles/tile-dashboard-config/tile-dashboard-config-layout.d.ts +0 -0
  73. package/{modules → lib/modules}/tiles/tile-dashboard-config/tile-dashboard-config-reorder-data.d.ts +0 -0
  74. package/lib/modules/tiles/tile-dashboard-config/tile-dashboard-config-tile.d.ts +14 -0
  75. package/{modules → lib/modules}/tiles/tile-dashboard-config/tile-dashboard-config.d.ts +0 -0
  76. package/{modules → lib/modules}/tiles/tiles.module.d.ts +0 -0
  77. package/package.json +7 -7
  78. package/skyux-tiles.d.ts +1 -1
  79. package/LICENSE +0 -21
  80. package/bundles/skyux-tiles.umd.js.map +0 -1
  81. package/esm2015/modules/shared/sky-tiles-resources.module.js +0 -54
  82. package/esm2015/modules/tiles/tile/tile-summary.component.js +0 -19
  83. package/esm2015/modules/tiles/tile/tile-title.component.js +0 -19
  84. package/esm2015/modules/tiles/tile/tile.component.js +0 -161
  85. package/esm2015/modules/tiles/tile/tile.module.js +0 -49
  86. package/esm2015/modules/tiles/tile-content/tile-content-section.component.js +0 -19
  87. package/esm2015/modules/tiles/tile-content/tile-content.component.js +0 -18
  88. package/esm2015/modules/tiles/tile-content/tile-content.module.js +0 -20
  89. package/esm2015/modules/tiles/tile-dashboard/tile-dashboard-message-type.js +0 -15
  90. package/esm2015/modules/tiles/tile-dashboard/tile-dashboard-message.js +0 -2
  91. package/esm2015/modules/tiles/tile-dashboard/tile-dashboard.component.js +0 -131
  92. package/esm2015/modules/tiles/tile-dashboard/tile-dashboard.module.js +0 -21
  93. package/esm2015/modules/tiles/tile-dashboard/tile-dashboard.service.js +0 -522
  94. package/esm2015/modules/tiles/tile-dashboard-column/tile-dashboard-column.module.js +0 -19
  95. package/esm2015/modules/tiles/tile-dashboard-config/tile-dashboard-config-layout-column.js +0 -2
  96. package/esm2015/modules/tiles/tile-dashboard-config/tile-dashboard-config-layout-tile.js +0 -2
  97. package/esm2015/modules/tiles/tile-dashboard-config/tile-dashboard-config-layout.js +0 -2
  98. package/esm2015/modules/tiles/tile-dashboard-config/tile-dashboard-config-reorder-data.js +0 -2
  99. package/esm2015/modules/tiles/tile-dashboard-config/tile-dashboard-config-tile.js +0 -2
  100. package/esm2015/modules/tiles/tile-dashboard-config/tile-dashboard-config.js +0 -2
  101. package/esm2015/modules/tiles/tiles.module.js +0 -31
  102. package/esm2015/public-api.js +0 -24
  103. package/modules/tiles/tile-dashboard-config/tile-dashboard-config-tile.d.ts +0 -18
  104. package/public-api.d.ts +0 -21
package/README.md CHANGED
@@ -1,5 +1,7 @@
1
- # @skyux/tiles
1
+ # tiles
2
2
 
3
- [![npm](https://img.shields.io/npm/v/@skyux/tiles.svg)](https://www.npmjs.com/package/@skyux/tiles)
4
- ![SKY UX CI](https://github.com/blackbaud/skyux-tiles/workflows/SKY%20UX%20CI/badge.svg)
5
- [![coverage](https://codecov.io/gh/blackbaud/skyux-tiles/branch/master/graphs/badge.svg?branch=master)](https://codecov.io/gh/blackbaud/skyux-tiles/branch/master)
3
+ This library was generated with [Nx](https://nx.dev).
4
+
5
+ ## Running unit tests
6
+
7
+ Run `nx test tiles` to execute the unit tests.
@@ -38,10 +38,16 @@
38
38
  */
39
39
  var RESOURCES = {
40
40
  'EN-US': {
41
- skyux_tile_help: { message: 'Help' },
42
- skyux_tile_settings: { message: 'Settings' },
43
- skyux_tile_grab_handle: {
44
- message: 'Use arrow keys to reorder. Press up and down arrow keys to change position in column. Press left and right arrow keys to change position to another column.',
41
+ skyux_tile_expand: { message: 'Expand or collapse {0}' },
42
+ skyux_tile_expand_default: { message: 'Expand or collapse' },
43
+ skyux_tile_help: { message: '{0} help' },
44
+ skyux_tile_help_default: { message: 'Help' },
45
+ skyux_tile_settings: { message: '{0} settings' },
46
+ skyux_tile_settings_default: { message: 'Settings' },
47
+ skyux_tile_move: { message: 'Move {0}' },
48
+ skyux_tile_move_default: { message: 'Move' },
49
+ skyux_tile_move_instructions: {
50
+ message: "When focus is placed on a tile's move button, use the arrow keys to move it. The up and down keys change its position within a column. The left and right keys move it between columns.",
45
51
  },
46
52
  skyux_tile_moved_assistive_text: {
47
53
  message: '{0} moved. Current column: {1} of {2}. Current position in column: {3} of {4}',
@@ -64,16 +70,16 @@
64
70
  }
65
71
  return SkyTilesResourcesModule;
66
72
  }());
67
- SkyTilesResourcesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTilesResourcesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
68
- SkyTilesResourcesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTilesResourcesModule, exports: [i3.SkyI18nModule] });
69
- SkyTilesResourcesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTilesResourcesModule, providers: [
73
+ SkyTilesResourcesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTilesResourcesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
74
+ SkyTilesResourcesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTilesResourcesModule, exports: [i3.SkyI18nModule] });
75
+ SkyTilesResourcesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTilesResourcesModule, providers: [
70
76
  {
71
77
  provide: i3.SKY_LIB_RESOURCES_PROVIDERS,
72
78
  useClass: SkyTilesResourcesProvider,
73
79
  multi: true,
74
80
  },
75
81
  ], imports: [i3.SkyI18nModule] });
76
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTilesResourcesModule, decorators: [{
82
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTilesResourcesModule, decorators: [{
77
83
  type: i0.NgModule,
78
84
  args: [{
79
85
  exports: [i3.SkyI18nModule],
@@ -1066,9 +1072,9 @@
1066
1072
  };
1067
1073
  return SkyTileDashboardService;
1068
1074
  }());
1069
- SkyTileDashboardService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardService, deps: [{ token: i1__namespace.DragulaService }, { token: i2__namespace.SkyMediaQueryService }, { token: i2__namespace.SkyUIConfigService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
1070
- SkyTileDashboardService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardService });
1071
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardService, decorators: [{
1075
+ SkyTileDashboardService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardService, deps: [{ token: i1__namespace.DragulaService }, { token: i2__namespace.SkyMediaQueryService }, { token: i2__namespace.SkyUIConfigService }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
1076
+ SkyTileDashboardService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardService });
1077
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardService, decorators: [{
1072
1078
  type: i0.Injectable
1073
1079
  }], ctorParameters: function () { return [{ type: i1__namespace.DragulaService }, { type: i2__namespace.SkyMediaQueryService }, { type: i2__namespace.SkyUIConfigService }]; }, propDecorators: { dashboardInitialized: [{
1074
1080
  type: i0.Output
@@ -1201,14 +1207,14 @@
1201
1207
  };
1202
1208
  return SkyTileComponent;
1203
1209
  }());
1204
- SkyTileComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: SkyTileDashboardService, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
1205
- SkyTileComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyTileComponent, selector: "sky-tile", inputs: { showSettings: "showSettings", showHelp: "showHelp", isCollapsed: "isCollapsed" }, outputs: { settingsClick: "settingsClick", isCollapsedChange: "isCollapsedChange", helpClick: "helpClick" }, viewQueries: [{ propertyName: "grabHandle", first: true, predicate: ["grabHandle"], descendants: true, read: i0.ElementRef }, { propertyName: "title", first: true, predicate: ["titleContainer"], descendants: true, read: i0.ElementRef }], ngImport: i0__namespace, template: "<section\n class=\"sky-tile\"\n [ngClass]=\"{\n 'sky-tile-collapsed': isCollapsed\n }\"\n [skyThemeClass]=\"{\n 'sky-box sky-elevation-1-bordered sky-padding-even-xl': 'modern'\n }\"\n>\n <header class=\"sky-tile-header\">\n <div class=\"sky-tile-header-content\" (click)=\"titleClick()\">\n <div class=\"sky-tile-header-title\" #titleContainer>\n <ng-content select=\"sky-tile-title\"></ng-content>\n </div>\n <div\n class=\"sky-tile-summary\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern',\n 'sky-headline': 'default'\n }\"\n >\n <ng-content select=\"sky-tile-summary\"></ng-content>\n </div>\n </div>\n <div class=\"sky-tile-header-column-tools\">\n <div class=\"sky-tile-tools\">\n <ng-container *skyThemeIf=\"'default'\">\n <button\n *ngIf=\"hasHelp\"\n class=\"sky-btn sky-tile-tools-control sky-tile-help\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tile_help' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"helpButtonClicked()\"\n >\n <sky-icon icon=\"question-circle\"></sky-icon>\n </button>\n </ng-container>\n <sky-chevron\n [direction]=\"isCollapsed ? 'down' : 'up'\"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-margin-inline-default': 'modern'\n }\"\n (directionChange)=\"chevronDirectionChange($event)\"\n >\n </sky-chevron>\n <button\n *ngIf=\"hasSettings\"\n class=\"sky-btn sky-tile-settings\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tile_settings' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-btn-icon-borderless sky-margin-inline-default': 'modern'\n }\"\n (click)=\"settingsButtonClicked()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"cog\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"cog-line\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n <button\n *ngIf=\"isInDashboardColumn\"\n class=\"sky-btn sky-tile-grab-handle\"\n [attr.aria-label]=\"'skyux_tile_grab_handle' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"$event.stopPropagation()\"\n (keydown)=\"moveTile($event)\"\n #grabHandle\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"th\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"tile-drag\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n </div>\n </div>\n </header>\n <div\n class=\"sky-tile-content\"\n [@skyAnimationSlide]=\"isCollapsed ? 'up' : 'down'\"\n >\n <ng-content select=\"sky-tile-content\"></ng-content>\n </div>\n</section>\n", styles: [".sky-tile{background-color:#fff;margin-bottom:20px}.sky-tile-header{border-color:#cdcfd2;border-style:solid solid none;border-width:4px 0 0;display:flex}.sky-tile-header-content{display:flex;flex:1;align-items:baseline;cursor:pointer}.sky-tile-header-title{display:inline-flex}.sky-tile-summary{color:#0974a1;opacity:0;padding-right:15px;transition:opacity .25s;max-height:30px;overflow:hidden}.sky-tile-collapsed .sky-tile-summary{opacity:1}.sky-tile-header-column-tools{display:flex;align-items:center;flex:0 0 auto}.sky-tile-tools{display:flex;padding-right:15px}.sky-tile-tools-control{color:#cdcfd2;cursor:pointer;border:0;width:24px;height:24px;padding:0;display:block;margin:0 0 0 9px}.sky-tile-tools-control:hover{color:#979ba2;transition:color .15s}.sky-tile-grab-handle{cursor:move;cursor:-moz-grab;font-size:15px}.sky-tile-content{border-color:#e2e3e4;border-image:none;border-style:solid solid none;border-width:1px 0}:host-context(.sky-theme-modern) .sky-tile-header,:host-context(.sky-theme-modern) .sky-tile-content{border:none}:host-context(.sky-theme-modern) .sky-tile-header-column-tools{align-items:flex-start}:host-context(.sky-theme-modern) .sky-tile-tools{padding:0}:host-context(.sky-theme-modern) .sky-tile-tools-control{font-size:18px;color:#686c73}:host-context(.sky-theme-modern) .sky-tile-grab-handle{font-size:16px}:host-context(.sky-theme-modern) .sky-tile-content ::ng-deep .sky-tile-content-section{border-bottom:1px dotted #c0c2c5}:host-context(.sky-theme-modern) .sky-tile-content ::ng-deep sky-tile-content-section:first-child .sky-tile-content-section{margin-top:15px}:host-context(.sky-theme-modern) .sky-tile-content ::ng-deep sky-tile-content-section:last-child .sky-tile-content-section{padding-bottom:0;border-bottom:none}:host-context(.sky-theme-modern) :host .sky-tile{border-radius:0}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-xs) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:0}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-tile{border-radius:6px}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:6px}.sky-theme-modern .sky-tile-header,.sky-theme-modern .sky-tile-content{border:none}.sky-theme-modern .sky-tile-header-column-tools{align-items:flex-start}.sky-theme-modern .sky-tile-tools{padding:0}.sky-theme-modern .sky-tile-tools-control{font-size:18px;color:#686c73}.sky-theme-modern .sky-tile-grab-handle{font-size:16px}.sky-theme-modern .sky-tile-content ::ng-deep .sky-tile-content-section{border-bottom:1px dotted #c0c2c5}.sky-theme-modern .sky-tile-content ::ng-deep sky-tile-content-section:first-child .sky-tile-content-section{margin-top:15px}.sky-theme-modern .sky-tile-content ::ng-deep sky-tile-content-section:last-child .sky-tile-content-section{padding-bottom:0;border-bottom:none}.sky-theme-modern :host .sky-tile{border-radius:0}.sky-theme-modern :host-context(.sky-responsive-container-xs) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:0}@media (min-width: 768px){.sky-theme-modern :host .sky-tile{border-radius:6px}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:6px}\n"], components: [{ type: i2__namespace$1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { type: i2__namespace$1.λ2, selector: "sky-chevron", inputs: ["direction", "disabled"], outputs: ["directionChange"] }], directives: [{ type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { type: i4__namespace.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "skyLibResources": i3__namespace$1.SkyLibResourcesPipe }, animations: [animations.skyAnimationSlide] });
1206
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileComponent, decorators: [{
1210
+ SkyTileComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: SkyTileDashboardService, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
1211
+ SkyTileComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyTileComponent, selector: "sky-tile", inputs: { showSettings: "showSettings", showHelp: "showHelp", tileName: "tileName", isCollapsed: "isCollapsed" }, outputs: { settingsClick: "settingsClick", isCollapsedChange: "isCollapsedChange", helpClick: "helpClick" }, viewQueries: [{ propertyName: "grabHandle", first: true, predicate: ["grabHandle"], descendants: true, read: i0.ElementRef }, { propertyName: "title", first: true, predicate: ["titleContainer"], descendants: true, read: i0.ElementRef }], ngImport: i0__namespace, template: "<section\n class=\"sky-tile\"\n [ngClass]=\"{\n 'sky-tile-collapsed': isCollapsed\n }\"\n [skyThemeClass]=\"{\n 'sky-box sky-elevation-1-bordered sky-padding-even-xl': 'modern'\n }\"\n>\n <header class=\"sky-tile-header\">\n <div class=\"sky-tile-header-content\" (click)=\"titleClick()\">\n <div class=\"sky-tile-header-title\" #titleContainer>\n <ng-content select=\"sky-tile-title\"></ng-content>\n </div>\n <div\n class=\"sky-tile-summary\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern',\n 'sky-headline': 'default'\n }\"\n >\n <ng-content select=\"sky-tile-summary\"></ng-content>\n </div>\n </div>\n <div class=\"sky-tile-header-column-tools\">\n <div class=\"sky-tile-tools\">\n <ng-container *skyThemeIf=\"'default'\">\n <button\n *ngIf=\"hasHelp\"\n class=\"sky-btn sky-tile-tools-control sky-tile-help\"\n type=\"button\"\n [attr.aria-label]=\"\n tileName\n ? ('skyux_tile_help' | skyLibResources: tileName)\n : ('skyux_tile_help_default' | skyLibResources)\n \"\n [skyThemeClass]=\"{\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"helpButtonClicked()\"\n >\n <sky-icon icon=\"question-circle\"></sky-icon>\n </button>\n </ng-container>\n <sky-chevron\n [ariaControls]=\"tileContent.id\"\n [ariaLabel]=\"\n tileName\n ? ('skyux_tile_expand' | skyLibResources: tileName)\n : ('skyux_tile_expand_default' | skyLibResources)\n \"\n [direction]=\"isCollapsed ? 'down' : 'up'\"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-margin-inline-default': 'modern'\n }\"\n (directionChange)=\"chevronDirectionChange($event)\"\n >\n </sky-chevron>\n <button\n *ngIf=\"hasSettings\"\n class=\"sky-btn sky-tile-settings\"\n type=\"button\"\n [attr.aria-label]=\"\n tileName\n ? ('skyux_tile_settings' | skyLibResources: tileName)\n : ('skyux_tile_settings_default' | skyLibResources)\n \"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-btn-icon-borderless sky-margin-inline-default': 'modern'\n }\"\n (click)=\"settingsButtonClicked()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"cog\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"cog-line\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n <button\n *ngIf=\"isInDashboardColumn\"\n class=\"sky-btn sky-tile-grab-handle\"\n [attr.aria-label]=\"\n tileName\n ? ('skyux_tile_move' | skyLibResources: tileName)\n : ('skyux_tile_move_default' | skyLibResources)\n \"\n [attr.aria-describedby]=\"\n dashboardService?.bagId + '-move-instructions'\n \"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"$event.stopPropagation()\"\n (keydown)=\"moveTile($event)\"\n #grabHandle\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"th\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"tile-drag\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n </div>\n </div>\n </header>\n <div\n class=\"sky-tile-content\"\n role=\"region\"\n skyId\n [attr.aria-label]=\"tileName\"\n [@skyAnimationSlide]=\"isCollapsed ? 'up' : 'down'\"\n #tileContent=\"skyId\"\n >\n <ng-content select=\"sky-tile-content\"></ng-content>\n </div>\n</section>\n", styles: [".sky-tile{background-color:#fff;margin-bottom:20px}.sky-tile-header{border-color:#cdcfd2;border-style:solid solid none;border-width:4px 0 0;display:flex}.sky-tile-header-content{display:flex;flex:1;align-items:baseline;cursor:pointer}.sky-tile-header-title{display:inline-flex}.sky-tile-summary{color:#0974a1;opacity:0;padding-right:15px;transition:opacity .25s;max-height:30px;overflow:hidden}.sky-tile-collapsed .sky-tile-summary{opacity:1}.sky-tile-header-column-tools{display:flex;align-items:center;flex:0 0 auto}.sky-tile-tools{display:flex;padding-right:15px}.sky-tile-tools-control{color:#cdcfd2;cursor:pointer;border:0;width:24px;height:24px;padding:0;display:block;margin:0 0 0 9px}.sky-tile-tools-control:hover{color:#979ba2;transition:color .15s}.sky-tile-grab-handle{cursor:move;cursor:-moz-grab;font-size:15px}.sky-tile-content{border-color:#e2e3e4;border-image:none;border-style:solid solid none;border-width:1px 0}:host-context(.sky-theme-modern) .sky-tile-header,:host-context(.sky-theme-modern) .sky-tile-content{border:none}:host-context(.sky-theme-modern) .sky-tile-header-column-tools{align-items:flex-start}:host-context(.sky-theme-modern) .sky-tile-tools{padding:0}:host-context(.sky-theme-modern) .sky-tile-tools-control{font-size:18px;color:#686c73}:host-context(.sky-theme-modern) .sky-tile-grab-handle{font-size:16px}:host-context(.sky-theme-modern) .sky-tile-content ::ng-deep .sky-tile-content-section{border-bottom:1px dotted #c0c2c5}:host-context(.sky-theme-modern) .sky-tile-content ::ng-deep sky-tile-content-section:first-child .sky-tile-content-section{margin-top:15px}:host-context(.sky-theme-modern) .sky-tile-content ::ng-deep sky-tile-content-section:last-child .sky-tile-content-section{padding-bottom:0;border-bottom:none}:host-context(.sky-theme-modern) :host .sky-tile{border-radius:0}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-xs) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:0}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-tile{border-radius:6px}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:6px}.sky-theme-modern .sky-tile-header,.sky-theme-modern .sky-tile-content{border:none}.sky-theme-modern .sky-tile-header-column-tools{align-items:flex-start}.sky-theme-modern .sky-tile-tools{padding:0}.sky-theme-modern .sky-tile-tools-control{font-size:18px;color:#686c73}.sky-theme-modern .sky-tile-grab-handle{font-size:16px}.sky-theme-modern .sky-tile-content ::ng-deep .sky-tile-content-section{border-bottom:1px dotted #c0c2c5}.sky-theme-modern .sky-tile-content ::ng-deep sky-tile-content-section:first-child .sky-tile-content-section{margin-top:15px}.sky-theme-modern .sky-tile-content ::ng-deep sky-tile-content-section:last-child .sky-tile-content-section{padding-bottom:0;border-bottom:none}.sky-theme-modern :host .sky-tile{border-radius:0}.sky-theme-modern :host-context(.sky-responsive-container-xs) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:0}@media (min-width: 768px){.sky-theme-modern :host .sky-tile{border-radius:6px}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:6px}\n"], components: [{ type: i2__namespace$1.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { type: i2__namespace$1.λ2, selector: "sky-chevron", inputs: ["ariaControls", "ariaLabel", "direction", "disabled"], outputs: ["directionChange"] }], directives: [{ type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { type: i4__namespace.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.λ2, selector: "[skyId]", exportAs: ["skyId"] }], pipes: { "skyLibResources": i3__namespace$1.SkyLibResourcesPipe }, animations: [animations.skyAnimationSlide] });
1212
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileComponent, decorators: [{
1207
1213
  type: i0.Component,
1208
1214
  args: [{
1209
1215
  selector: 'sky-tile',
1210
1216
  styles: [".sky-tile{background-color:#fff;margin-bottom:20px}.sky-tile-header{border-color:#cdcfd2;border-style:solid solid none;border-width:4px 0 0;display:flex}.sky-tile-header-content{display:flex;flex:1;align-items:baseline;cursor:pointer}.sky-tile-header-title{display:inline-flex}.sky-tile-summary{color:#0974a1;opacity:0;padding-right:15px;transition:opacity .25s;max-height:30px;overflow:hidden}.sky-tile-collapsed .sky-tile-summary{opacity:1}.sky-tile-header-column-tools{display:flex;align-items:center;flex:0 0 auto}.sky-tile-tools{display:flex;padding-right:15px}.sky-tile-tools-control{color:#cdcfd2;cursor:pointer;border:0;width:24px;height:24px;padding:0;display:block;margin:0 0 0 9px}.sky-tile-tools-control:hover{color:#979ba2;transition:color .15s}.sky-tile-grab-handle{cursor:move;cursor:-moz-grab;font-size:15px}.sky-tile-content{border-color:#e2e3e4;border-image:none;border-style:solid solid none;border-width:1px 0}:host-context(.sky-theme-modern) .sky-tile-header,:host-context(.sky-theme-modern) .sky-tile-content{border:none}:host-context(.sky-theme-modern) .sky-tile-header-column-tools{align-items:flex-start}:host-context(.sky-theme-modern) .sky-tile-tools{padding:0}:host-context(.sky-theme-modern) .sky-tile-tools-control{font-size:18px;color:#686c73}:host-context(.sky-theme-modern) .sky-tile-grab-handle{font-size:16px}:host-context(.sky-theme-modern) .sky-tile-content ::ng-deep .sky-tile-content-section{border-bottom:1px dotted #c0c2c5}:host-context(.sky-theme-modern) .sky-tile-content ::ng-deep sky-tile-content-section:first-child .sky-tile-content-section{margin-top:15px}:host-context(.sky-theme-modern) .sky-tile-content ::ng-deep sky-tile-content-section:last-child .sky-tile-content-section{padding-bottom:0;border-bottom:none}:host-context(.sky-theme-modern) :host .sky-tile{border-radius:0}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-xs) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:0}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-tile{border-radius:6px}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:6px}.sky-theme-modern .sky-tile-header,.sky-theme-modern .sky-tile-content{border:none}.sky-theme-modern .sky-tile-header-column-tools{align-items:flex-start}.sky-theme-modern .sky-tile-tools{padding:0}.sky-theme-modern .sky-tile-tools-control{font-size:18px;color:#686c73}.sky-theme-modern .sky-tile-grab-handle{font-size:16px}.sky-theme-modern .sky-tile-content ::ng-deep .sky-tile-content-section{border-bottom:1px dotted #c0c2c5}.sky-theme-modern .sky-tile-content ::ng-deep sky-tile-content-section:first-child .sky-tile-content-section{margin-top:15px}.sky-theme-modern .sky-tile-content ::ng-deep sky-tile-content-section:last-child .sky-tile-content-section{padding-bottom:0;border-bottom:none}.sky-theme-modern :host .sky-tile{border-radius:0}.sky-theme-modern :host-context(.sky-responsive-container-xs) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:0}@media (min-width: 768px){.sky-theme-modern :host .sky-tile{border-radius:6px}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile{border-radius:6px}\n"],
1211
- template: "<section\n class=\"sky-tile\"\n [ngClass]=\"{\n 'sky-tile-collapsed': isCollapsed\n }\"\n [skyThemeClass]=\"{\n 'sky-box sky-elevation-1-bordered sky-padding-even-xl': 'modern'\n }\"\n>\n <header class=\"sky-tile-header\">\n <div class=\"sky-tile-header-content\" (click)=\"titleClick()\">\n <div class=\"sky-tile-header-title\" #titleContainer>\n <ng-content select=\"sky-tile-title\"></ng-content>\n </div>\n <div\n class=\"sky-tile-summary\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern',\n 'sky-headline': 'default'\n }\"\n >\n <ng-content select=\"sky-tile-summary\"></ng-content>\n </div>\n </div>\n <div class=\"sky-tile-header-column-tools\">\n <div class=\"sky-tile-tools\">\n <ng-container *skyThemeIf=\"'default'\">\n <button\n *ngIf=\"hasHelp\"\n class=\"sky-btn sky-tile-tools-control sky-tile-help\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tile_help' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"helpButtonClicked()\"\n >\n <sky-icon icon=\"question-circle\"></sky-icon>\n </button>\n </ng-container>\n <sky-chevron\n [direction]=\"isCollapsed ? 'down' : 'up'\"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-margin-inline-default': 'modern'\n }\"\n (directionChange)=\"chevronDirectionChange($event)\"\n >\n </sky-chevron>\n <button\n *ngIf=\"hasSettings\"\n class=\"sky-btn sky-tile-settings\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_tile_settings' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-btn-icon-borderless sky-margin-inline-default': 'modern'\n }\"\n (click)=\"settingsButtonClicked()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"cog\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"cog-line\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n <button\n *ngIf=\"isInDashboardColumn\"\n class=\"sky-btn sky-tile-grab-handle\"\n [attr.aria-label]=\"'skyux_tile_grab_handle' | skyLibResources\"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"$event.stopPropagation()\"\n (keydown)=\"moveTile($event)\"\n #grabHandle\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"th\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"tile-drag\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n </div>\n </div>\n </header>\n <div\n class=\"sky-tile-content\"\n [@skyAnimationSlide]=\"isCollapsed ? 'up' : 'down'\"\n >\n <ng-content select=\"sky-tile-content\"></ng-content>\n </div>\n</section>\n",
1217
+ template: "<section\n class=\"sky-tile\"\n [ngClass]=\"{\n 'sky-tile-collapsed': isCollapsed\n }\"\n [skyThemeClass]=\"{\n 'sky-box sky-elevation-1-bordered sky-padding-even-xl': 'modern'\n }\"\n>\n <header class=\"sky-tile-header\">\n <div class=\"sky-tile-header-content\" (click)=\"titleClick()\">\n <div class=\"sky-tile-header-title\" #titleContainer>\n <ng-content select=\"sky-tile-title\"></ng-content>\n </div>\n <div\n class=\"sky-tile-summary\"\n [skyThemeClass]=\"{\n 'sky-font-display-3': 'modern',\n 'sky-headline': 'default'\n }\"\n >\n <ng-content select=\"sky-tile-summary\"></ng-content>\n </div>\n </div>\n <div class=\"sky-tile-header-column-tools\">\n <div class=\"sky-tile-tools\">\n <ng-container *skyThemeIf=\"'default'\">\n <button\n *ngIf=\"hasHelp\"\n class=\"sky-btn sky-tile-tools-control sky-tile-help\"\n type=\"button\"\n [attr.aria-label]=\"\n tileName\n ? ('skyux_tile_help' | skyLibResources: tileName)\n : ('skyux_tile_help_default' | skyLibResources)\n \"\n [skyThemeClass]=\"{\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"helpButtonClicked()\"\n >\n <sky-icon icon=\"question-circle\"></sky-icon>\n </button>\n </ng-container>\n <sky-chevron\n [ariaControls]=\"tileContent.id\"\n [ariaLabel]=\"\n tileName\n ? ('skyux_tile_expand' | skyLibResources: tileName)\n : ('skyux_tile_expand_default' | skyLibResources)\n \"\n [direction]=\"isCollapsed ? 'down' : 'up'\"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-margin-inline-default': 'modern'\n }\"\n (directionChange)=\"chevronDirectionChange($event)\"\n >\n </sky-chevron>\n <button\n *ngIf=\"hasSettings\"\n class=\"sky-btn sky-tile-settings\"\n type=\"button\"\n [attr.aria-label]=\"\n tileName\n ? ('skyux_tile_settings' | skyLibResources: tileName)\n : ('skyux_tile_settings_default' | skyLibResources)\n \"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-btn-icon-borderless sky-margin-inline-default': 'modern'\n }\"\n (click)=\"settingsButtonClicked()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"cog\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"cog-line\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n <button\n *ngIf=\"isInDashboardColumn\"\n class=\"sky-btn sky-tile-grab-handle\"\n [attr.aria-label]=\"\n tileName\n ? ('skyux_tile_move' | skyLibResources: tileName)\n : ('skyux_tile_move_default' | skyLibResources)\n \"\n [attr.aria-describedby]=\"\n dashboardService?.bagId + '-move-instructions'\n \"\n [skyThemeClass]=\"{\n 'sky-tile-tools-control': 'default',\n 'sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"$event.stopPropagation()\"\n (keydown)=\"moveTile($event)\"\n #grabHandle\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"th\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"tile-drag\"\n iconType=\"skyux\"\n ></sky-icon>\n </button>\n </div>\n </div>\n </header>\n <div\n class=\"sky-tile-content\"\n role=\"region\"\n skyId\n [attr.aria-label]=\"tileName\"\n [@skyAnimationSlide]=\"isCollapsed ? 'up' : 'down'\"\n #tileContent=\"skyId\"\n >\n <ng-content select=\"sky-tile-content\"></ng-content>\n </div>\n</section>\n",
1212
1218
  animations: [animations.skyAnimationSlide],
1213
1219
  }]
1214
1220
  }], ctorParameters: function () {
@@ -1219,6 +1225,8 @@
1219
1225
  type: i0.Input
1220
1226
  }], showHelp: [{
1221
1227
  type: i0.Input
1228
+ }], tileName: [{
1229
+ type: i0.Input
1222
1230
  }], settingsClick: [{
1223
1231
  type: i0.Output
1224
1232
  }], isCollapsedChange: [{
@@ -1251,9 +1259,9 @@
1251
1259
  }
1252
1260
  return SkyTileSummaryComponent;
1253
1261
  }());
1254
- SkyTileSummaryComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileSummaryComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1255
- SkyTileSummaryComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyTileSummaryComponent, selector: "sky-tile-summary", ngImport: i0__namespace, template: "<ng-content></ng-content>\n" });
1256
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileSummaryComponent, decorators: [{
1262
+ SkyTileSummaryComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileSummaryComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1263
+ SkyTileSummaryComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyTileSummaryComponent, selector: "sky-tile-summary", ngImport: i0__namespace, template: "<ng-content></ng-content>\n" });
1264
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileSummaryComponent, decorators: [{
1257
1265
  type: i0.Component,
1258
1266
  args: [{
1259
1267
  selector: 'sky-tile-summary',
@@ -1269,9 +1277,9 @@
1269
1277
  }
1270
1278
  return SkyTileTitleComponent;
1271
1279
  }());
1272
- SkyTileTitleComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileTitleComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1273
- SkyTileTitleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyTileTitleComponent, selector: "sky-tile-title", ngImport: i0__namespace, template: "<h2\n class=\"sky-tile-title\"\n [skyThemeClass]=\"{\n 'sky-font-heading-2': 'modern',\n 'sky-section-heading': 'default'\n }\"\n>\n <ng-content></ng-content>\n</h2>\n", styles: [".sky-tile-title{margin:0;padding:10px 15px}:host-context(.sky-theme-modern) .sky-tile-title{margin:0 30px 0 0;padding:0}.sky-theme-modern .sky-tile-title{margin:0 30px 0 0;padding:0}\n"], directives: [{ type: i4__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }] });
1274
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileTitleComponent, decorators: [{
1280
+ SkyTileTitleComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileTitleComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1281
+ SkyTileTitleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyTileTitleComponent, selector: "sky-tile-title", ngImport: i0__namespace, template: "<h2\n class=\"sky-tile-title\"\n [skyThemeClass]=\"{\n 'sky-font-heading-2': 'modern',\n 'sky-section-heading': 'default'\n }\"\n>\n <ng-content></ng-content>\n</h2>\n", styles: [".sky-tile-title{margin:0;padding:10px 15px}:host-context(.sky-theme-modern) .sky-tile-title{margin:0 30px 0 0;padding:0}.sky-theme-modern .sky-tile-title{margin:0 30px 0 0;padding:0}\n"], directives: [{ type: i4__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }] });
1282
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileTitleComponent, decorators: [{
1275
1283
  type: i0.Component,
1276
1284
  args: [{
1277
1285
  selector: 'sky-tile-title',
@@ -1285,24 +1293,26 @@
1285
1293
  }
1286
1294
  return SkyTileModule;
1287
1295
  }());
1288
- SkyTileModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1289
- SkyTileModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileModule, declarations: [SkyTileComponent,
1296
+ SkyTileModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1297
+ SkyTileModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileModule, declarations: [SkyTileComponent,
1290
1298
  SkyTileSummaryComponent,
1291
1299
  SkyTileTitleComponent], imports: [i3$1.CommonModule,
1292
1300
  i2$1.SkyChevronModule,
1301
+ i2.SkyIdModule,
1293
1302
  i3.SkyI18nModule,
1294
1303
  i2$1.SkyIconModule,
1295
1304
  i4.SkyThemeModule,
1296
1305
  SkyTilesResourcesModule], exports: [SkyTileComponent, SkyTileSummaryComponent, SkyTileTitleComponent] });
1297
- SkyTileModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileModule, imports: [[
1306
+ SkyTileModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileModule, imports: [[
1298
1307
  i3$1.CommonModule,
1299
1308
  i2$1.SkyChevronModule,
1309
+ i2.SkyIdModule,
1300
1310
  i3.SkyI18nModule,
1301
1311
  i2$1.SkyIconModule,
1302
1312
  i4.SkyThemeModule,
1303
1313
  SkyTilesResourcesModule,
1304
1314
  ]] });
1305
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileModule, decorators: [{
1315
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileModule, decorators: [{
1306
1316
  type: i0.NgModule,
1307
1317
  args: [{
1308
1318
  declarations: [
@@ -1313,6 +1323,7 @@
1313
1323
  imports: [
1314
1324
  i3$1.CommonModule,
1315
1325
  i2$1.SkyChevronModule,
1326
+ i2.SkyIdModule,
1316
1327
  i3.SkyI18nModule,
1317
1328
  i2$1.SkyIconModule,
1318
1329
  i4.SkyThemeModule,
@@ -1330,9 +1341,9 @@
1330
1341
  }
1331
1342
  return SkyTileContentSectionComponent;
1332
1343
  }());
1333
- SkyTileContentSectionComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileContentSectionComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1334
- SkyTileContentSectionComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyTileContentSectionComponent, selector: "sky-tile-content-section", ngImport: i0__namespace, template: "<div\n class=\"sky-tile-content-section\"\n [skyThemeClass]=\"{\n 'sky-padding-even-large': 'default'\n }\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [":host-context(.sky-theme-modern) .sky-tile-content-section{padding:15px 0}.sky-theme-modern .sky-tile-content-section{padding:15px 0}\n"], directives: [{ type: i4__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }] });
1335
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileContentSectionComponent, decorators: [{
1344
+ SkyTileContentSectionComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileContentSectionComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1345
+ SkyTileContentSectionComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyTileContentSectionComponent, selector: "sky-tile-content-section", ngImport: i0__namespace, template: "<div\n class=\"sky-tile-content-section\"\n [skyThemeClass]=\"{\n 'sky-padding-even-large': 'default'\n }\"\n>\n <ng-content></ng-content>\n</div>\n", styles: [":host-context(.sky-theme-modern) .sky-tile-content-section{padding:15px 0}.sky-theme-modern .sky-tile-content-section{padding:15px 0}\n"], directives: [{ type: i4__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }] });
1346
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileContentSectionComponent, decorators: [{
1336
1347
  type: i0.Component,
1337
1348
  args: [{
1338
1349
  selector: 'sky-tile-content-section',
@@ -1349,9 +1360,9 @@
1349
1360
  }
1350
1361
  return SkyTileContentComponent;
1351
1362
  }());
1352
- SkyTileContentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileContentComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1353
- SkyTileContentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyTileContentComponent, selector: "sky-tile-content", ngImport: i0__namespace, template: "<ng-content></ng-content>\n", styles: [":host ::ng-deep sky-tile-content-section:not(:last-child) .sky-tile-content-section{border-bottom:1px solid #e2e3e4}\n"] });
1354
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileContentComponent, decorators: [{
1363
+ SkyTileContentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileContentComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1364
+ SkyTileContentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyTileContentComponent, selector: "sky-tile-content", ngImport: i0__namespace, template: "<ng-content></ng-content>\n", styles: [":host ::ng-deep sky-tile-content-section:not(:last-child) .sky-tile-content-section{border-bottom:1px solid #e2e3e4}\n"] });
1365
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileContentComponent, decorators: [{
1355
1366
  type: i0.Component,
1356
1367
  args: [{
1357
1368
  selector: 'sky-tile-content',
@@ -1365,10 +1376,10 @@
1365
1376
  }
1366
1377
  return SkyTileContentModule;
1367
1378
  }());
1368
- SkyTileContentModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileContentModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1369
- SkyTileContentModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileContentModule, declarations: [SkyTileContentComponent, SkyTileContentSectionComponent], imports: [i3$1.CommonModule, i4.SkyThemeModule], exports: [SkyTileContentComponent, SkyTileContentSectionComponent] });
1370
- SkyTileContentModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileContentModule, imports: [[i3$1.CommonModule, i4.SkyThemeModule]] });
1371
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileContentModule, decorators: [{
1379
+ SkyTileContentModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileContentModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1380
+ SkyTileContentModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileContentModule, declarations: [SkyTileContentComponent, SkyTileContentSectionComponent], imports: [i3$1.CommonModule, i4.SkyThemeModule], exports: [SkyTileContentComponent, SkyTileContentSectionComponent] });
1381
+ SkyTileContentModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileContentModule, imports: [[i3$1.CommonModule, i4.SkyThemeModule]] });
1382
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileContentModule, decorators: [{
1372
1383
  type: i0.NgModule,
1373
1384
  args: [{
1374
1385
  declarations: [SkyTileContentComponent, SkyTileContentSectionComponent],
@@ -1407,9 +1418,9 @@
1407
1418
  }
1408
1419
  return SkyTileDashboardColumnComponent;
1409
1420
  }());
1410
- SkyTileDashboardColumnComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardColumnComponent, deps: [{ token: i0__namespace.ComponentFactoryResolver }, { token: i0__namespace.Injector }, { token: SkyTileDashboardService }], target: i0__namespace.ɵɵFactoryTarget.Component });
1411
- SkyTileDashboardColumnComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyTileDashboardColumnComponent, selector: "sky-tile-dashboard-column", viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, read: i0.ViewContainerRef }], ngImport: i0__namespace, template: "<div class=\"sky-tile-dashboard-column\" [dragula]=\"bagId\">\n <div #content></div>\n</div>\n", styles: [":host{display:flex;flex-grow:1;overflow:hidden}:host{padding:0}:host-context(.sky-responsive-container-xs),:host-context(.sky-responsive-container-sm),:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){padding:0}@media (min-width: 768px){:host{padding:0 10px}}:host-context(.sky-responsive-container-sm),:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){padding:0 10px}.sky-tile-dashboard-column{min-height:100px;width:100%}@media (min-width: 768px){:host-context(.sky-theme-modern) :host{padding:0 15px}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm),:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md),:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg){padding:0 15px}@media (min-width: 768px){.sky-theme-modern :host{padding:0 15px}}.sky-theme-modern :host-context(.sky-responsive-container-sm),.sky-theme-modern :host-context(.sky-responsive-container-md),.sky-theme-modern :host-context(.sky-responsive-container-lg){padding:0 15px}\n"], directives: [{ type: i1__namespace.DragulaDirective, selector: "[dragula]", inputs: ["dragula", "dragulaModel", "dragulaOptions"] }] });
1412
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardColumnComponent, decorators: [{
1421
+ SkyTileDashboardColumnComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardColumnComponent, deps: [{ token: i0__namespace.ComponentFactoryResolver }, { token: i0__namespace.Injector }, { token: SkyTileDashboardService }], target: i0__namespace.ɵɵFactoryTarget.Component });
1422
+ SkyTileDashboardColumnComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyTileDashboardColumnComponent, selector: "sky-tile-dashboard-column", viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, read: i0.ViewContainerRef }], ngImport: i0__namespace, template: "<div class=\"sky-tile-dashboard-column\" [dragula]=\"bagId\">\n <div #content></div>\n</div>\n", styles: [":host{display:flex;flex-grow:1;overflow:hidden}:host{padding:0}:host-context(.sky-responsive-container-xs),:host-context(.sky-responsive-container-sm),:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){padding:0}@media (min-width: 768px){:host{padding:0 10px}}:host-context(.sky-responsive-container-sm),:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){padding:0 10px}.sky-tile-dashboard-column{min-height:100px;width:100%}@media (min-width: 768px){:host-context(.sky-theme-modern) :host{padding:0 15px}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm),:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md),:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg){padding:0 15px}@media (min-width: 768px){.sky-theme-modern :host{padding:0 15px}}.sky-theme-modern :host-context(.sky-responsive-container-sm),.sky-theme-modern :host-context(.sky-responsive-container-md),.sky-theme-modern :host-context(.sky-responsive-container-lg){padding:0 15px}\n"], directives: [{ type: i1__namespace.DragulaDirective, selector: "[dragula]", inputs: ["dragula", "dragulaModel", "dragulaOptions"] }] });
1423
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardColumnComponent, decorators: [{
1413
1424
  type: i0.Component,
1414
1425
  args: [{
1415
1426
  selector: 'sky-tile-dashboard-column',
@@ -1444,6 +1455,7 @@
1444
1455
  * tiles to rearrange them.
1445
1456
  */
1446
1457
  this.configChange = new i0.EventEmitter();
1458
+ this.moveInstructionsId = this.dashboardService.bagId + '-move-instructions';
1447
1459
  this.configSet = false;
1448
1460
  this.ngUnsubscribe = new rxjs.Subject();
1449
1461
  this.viewReady = false;
@@ -1519,14 +1531,14 @@
1519
1531
  };
1520
1532
  return SkyTileDashboardComponent;
1521
1533
  }());
1522
- SkyTileDashboardComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardComponent, deps: [{ token: SkyTileDashboardService }, { token: i2__namespace.SkyMediaQueryService }, { token: i3__namespace$1.SkyLibResourcesService, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
1523
- SkyTileDashboardComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyTileDashboardComponent, selector: "sky-tile-dashboard", inputs: { config: "config", messageStream: "messageStream", settingsKey: "settingsKey" }, outputs: { configChange: "configChange" }, providers: [SkyTileDashboardService], viewQueries: [{ propertyName: "singleColumn", first: true, predicate: ["singleColumn"], descendants: true, read: SkyTileDashboardColumnComponent }, { propertyName: "columns", predicate: SkyTileDashboardColumnComponent, descendants: true }], ngImport: i0__namespace, template: "<span aria-live=\"assertive\" class=\"sky-assistive-text\">\n {{ tileMovedReport }}\n</span>\n<sky-tile-dashboard-column\n *ngFor=\"let column of config?.layout?.multiColumn\"\n class=\"sky-tile-dashboard-layout-multi\"\n [ngStyle]=\"{\n 'flex-basis': 100 / config?.layout?.multiColumn.length + '%'\n }\"\n>\n</sky-tile-dashboard-column>\n<sky-tile-dashboard-column\n class=\"sky-tile-dashboard-layout-single\"\n #singleColumn\n>\n</sky-tile-dashboard-column>\n<ng-content></ng-content>\n", styles: [":host{display:block;padding:0}:host .sky-tile-dashboard-layout-multi{display:none}:host .sky-tile-dashboard-layout-single{display:block}:host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:0}:host-context(.sky-responsive-container-xs),:host-context(.sky-responsive-container-sm),:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){display:block;padding:0}:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi{display:none}:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single{display:block}:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:0}@media (min-width: 768px){:host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:20px}:host :host-context(.sky-theme-default){padding-top:20px}}:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:20px}:host-context(.sky-responsive-container-sm) :host-context(.sky-theme-default),:host-context(.sky-responsive-container-md) :host-context(.sky-theme-default),:host-context(.sky-responsive-container-lg) :host-context(.sky-theme-default){padding-top:20px}@media (min-width: 992px){:host{display:flex;padding:0 10px}:host .sky-tile-dashboard-layout-multi{display:block}:host .sky-tile-dashboard-layout-single{display:none}}:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){display:flex;padding:0 10px}:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi{display:block}:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single{display:none}@media screen{.sky-assistive-text{width:0;height:0;padding:0;opacity:0;position:absolute;margin:-1px;border:0;overflow:hidden;clip:rect(0,0,0,0);outline:none;white-space:nowrap}}:host-context(.sky-theme-default){background-color:#eeeeef}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}@media (min-width: 768px){.sky-theme-modern :host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}\n"], components: [{ type: SkyTileDashboardColumnComponent, selector: "sky-tile-dashboard-column" }], directives: [{ type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
1524
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardComponent, decorators: [{
1534
+ SkyTileDashboardComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardComponent, deps: [{ token: SkyTileDashboardService }, { token: i2__namespace.SkyMediaQueryService }, { token: i3__namespace$1.SkyLibResourcesService, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
1535
+ SkyTileDashboardComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SkyTileDashboardComponent, selector: "sky-tile-dashboard", inputs: { config: "config", messageStream: "messageStream", settingsKey: "settingsKey" }, outputs: { configChange: "configChange" }, providers: [SkyTileDashboardService], viewQueries: [{ propertyName: "singleColumn", first: true, predicate: ["singleColumn"], descendants: true, read: SkyTileDashboardColumnComponent }, { propertyName: "columns", predicate: SkyTileDashboardColumnComponent, descendants: true }], ngImport: i0__namespace, template: "<span aria-live=\"assertive\" class=\"sky-assistive-text\">\n {{ tileMovedReport }}\n</span>\n<sky-tile-dashboard-column\n *ngFor=\"let column of config?.layout?.multiColumn\"\n class=\"sky-tile-dashboard-layout-multi\"\n [ngStyle]=\"{\n 'flex-basis': 100 / config?.layout?.multiColumn.length + '%'\n }\"\n>\n</sky-tile-dashboard-column>\n<sky-tile-dashboard-column\n class=\"sky-tile-dashboard-layout-single\"\n #singleColumn\n>\n</sky-tile-dashboard-column>\n<span class=\"sky-screen-reader-only\" [id]=\"moveInstructionsId\">{{\n 'skyux_tile_move_instructions' | skyLibResources\n}}</span>\n<ng-content></ng-content>\n", styles: [":host{display:block;padding:0}:host .sky-tile-dashboard-layout-multi{display:none}:host .sky-tile-dashboard-layout-single{display:block}:host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:0}:host-context(.sky-responsive-container-xs),:host-context(.sky-responsive-container-sm),:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){display:block;padding:0}:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi{display:none}:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single{display:block}:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:0}@media (min-width: 768px){:host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:20px}:host :host-context(.sky-theme-default){padding-top:20px}}:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:20px}:host-context(.sky-responsive-container-sm) :host-context(.sky-theme-default),:host-context(.sky-responsive-container-md) :host-context(.sky-theme-default),:host-context(.sky-responsive-container-lg) :host-context(.sky-theme-default){padding-top:20px}@media (min-width: 992px){:host{display:flex;padding:0 10px}:host .sky-tile-dashboard-layout-multi{display:block}:host .sky-tile-dashboard-layout-single{display:none}}:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){display:flex;padding:0 10px}:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi{display:block}:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single{display:none}@media screen{.sky-assistive-text{width:0;height:0;padding:0;opacity:0;position:absolute;margin:-1px;border:0;overflow:hidden;clip:rect(0,0,0,0);outline:none;white-space:nowrap}}:host-context(.sky-theme-default){background-color:#eeeeef}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}@media (min-width: 768px){.sky-theme-modern :host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}\n"], components: [{ type: SkyTileDashboardColumnComponent, selector: "sky-tile-dashboard-column" }], directives: [{ type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "skyLibResources": i3__namespace$1.SkyLibResourcesPipe } });
1536
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardComponent, decorators: [{
1525
1537
  type: i0.Component,
1526
1538
  args: [{
1527
1539
  selector: 'sky-tile-dashboard',
1528
1540
  styles: [":host{display:block;padding:0}:host .sky-tile-dashboard-layout-multi{display:none}:host .sky-tile-dashboard-layout-single{display:block}:host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:0}:host-context(.sky-responsive-container-xs),:host-context(.sky-responsive-container-sm),:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){display:block;padding:0}:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi{display:none}:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single{display:block}:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-xs) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:0}@media (min-width: 768px){:host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:20px}:host :host-context(.sky-theme-default){padding-top:20px}}:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:20px}:host-context(.sky-responsive-container-sm) :host-context(.sky-theme-default),:host-context(.sky-responsive-container-md) :host-context(.sky-theme-default),:host-context(.sky-responsive-container-lg) :host-context(.sky-theme-default){padding-top:20px}@media (min-width: 992px){:host{display:flex;padding:0 10px}:host .sky-tile-dashboard-layout-multi{display:block}:host .sky-tile-dashboard-layout-single{display:none}}:host-context(.sky-responsive-container-md),:host-context(.sky-responsive-container-lg){display:flex;padding:0 10px}:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi{display:block}:host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single,:host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single{display:none}@media screen{.sky-assistive-text{width:0;height:0;padding:0;opacity:0;position:absolute;margin:-1px;border:0;overflow:hidden;clip:rect(0,0,0,0);outline:none;white-space:nowrap}}:host-context(.sky-theme-default){background-color:#eeeeef}@media (min-width: 768px){:host-context(.sky-theme-modern) :host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}}:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,:host-context(.sky-theme-modern) :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}@media (min-width: 768px){.sky-theme-modern :host .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}}.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-sm) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-md) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-single ::ng-deep .sky-tile,.sky-theme-modern :host-context(.sky-responsive-container-lg) .sky-tile-dashboard-layout-multi ::ng-deep .sky-tile{margin-bottom:30px}\n"],
1529
- template: "<span aria-live=\"assertive\" class=\"sky-assistive-text\">\n {{ tileMovedReport }}\n</span>\n<sky-tile-dashboard-column\n *ngFor=\"let column of config?.layout?.multiColumn\"\n class=\"sky-tile-dashboard-layout-multi\"\n [ngStyle]=\"{\n 'flex-basis': 100 / config?.layout?.multiColumn.length + '%'\n }\"\n>\n</sky-tile-dashboard-column>\n<sky-tile-dashboard-column\n class=\"sky-tile-dashboard-layout-single\"\n #singleColumn\n>\n</sky-tile-dashboard-column>\n<ng-content></ng-content>\n",
1541
+ template: "<span aria-live=\"assertive\" class=\"sky-assistive-text\">\n {{ tileMovedReport }}\n</span>\n<sky-tile-dashboard-column\n *ngFor=\"let column of config?.layout?.multiColumn\"\n class=\"sky-tile-dashboard-layout-multi\"\n [ngStyle]=\"{\n 'flex-basis': 100 / config?.layout?.multiColumn.length + '%'\n }\"\n>\n</sky-tile-dashboard-column>\n<sky-tile-dashboard-column\n class=\"sky-tile-dashboard-layout-single\"\n #singleColumn\n>\n</sky-tile-dashboard-column>\n<span class=\"sky-screen-reader-only\" [id]=\"moveInstructionsId\">{{\n 'skyux_tile_move_instructions' | skyLibResources\n}}</span>\n<ng-content></ng-content>\n",
1530
1542
  providers: [SkyTileDashboardService],
1531
1543
  }]
1532
1544
  }], ctorParameters: function () {
@@ -1557,10 +1569,10 @@
1557
1569
  }
1558
1570
  return SkyTileDashboardColumnModule;
1559
1571
  }());
1560
- SkyTileDashboardColumnModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardColumnModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1561
- SkyTileDashboardColumnModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardColumnModule, declarations: [SkyTileDashboardColumnComponent], imports: [i3$1.CommonModule, i1.DragulaModule], exports: [SkyTileDashboardColumnComponent] });
1562
- SkyTileDashboardColumnModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardColumnModule, imports: [[i3$1.CommonModule, i1.DragulaModule]] });
1563
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardColumnModule, decorators: [{
1572
+ SkyTileDashboardColumnModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardColumnModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1573
+ SkyTileDashboardColumnModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardColumnModule, declarations: [SkyTileDashboardColumnComponent], imports: [i3$1.CommonModule, i1.DragulaModule], exports: [SkyTileDashboardColumnComponent] });
1574
+ SkyTileDashboardColumnModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardColumnModule, imports: [[i3$1.CommonModule, i1.DragulaModule]] });
1575
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardColumnModule, decorators: [{
1564
1576
  type: i0.NgModule,
1565
1577
  args: [{
1566
1578
  declarations: [SkyTileDashboardColumnComponent],
@@ -1574,15 +1586,25 @@
1574
1586
  }
1575
1587
  return SkyTileDashboardModule;
1576
1588
  }());
1577
- SkyTileDashboardModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1578
- SkyTileDashboardModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardModule, declarations: [SkyTileDashboardComponent], imports: [i3$1.CommonModule, SkyTileDashboardColumnModule], exports: [SkyTileDashboardComponent] });
1579
- SkyTileDashboardModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardModule, providers: [i1.DragulaService], imports: [[i3$1.CommonModule, SkyTileDashboardColumnModule]] });
1580
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTileDashboardModule, decorators: [{
1589
+ SkyTileDashboardModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1590
+ SkyTileDashboardModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardModule, declarations: [SkyTileDashboardComponent], imports: [i3$1.CommonModule,
1591
+ SkyTileDashboardColumnModule,
1592
+ SkyTilesResourcesModule], exports: [SkyTileDashboardComponent] });
1593
+ SkyTileDashboardModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardModule, providers: [i1.DragulaService], imports: [[
1594
+ i3$1.CommonModule,
1595
+ SkyTileDashboardColumnModule,
1596
+ SkyTilesResourcesModule,
1597
+ ]] });
1598
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTileDashboardModule, decorators: [{
1581
1599
  type: i0.NgModule,
1582
1600
  args: [{
1583
1601
  declarations: [SkyTileDashboardComponent],
1584
1602
  providers: [i1.DragulaService],
1585
- imports: [i3$1.CommonModule, SkyTileDashboardColumnModule],
1603
+ imports: [
1604
+ i3$1.CommonModule,
1605
+ SkyTileDashboardColumnModule,
1606
+ SkyTilesResourcesModule,
1607
+ ],
1586
1608
  exports: [SkyTileDashboardComponent],
1587
1609
  }]
1588
1610
  }] });
@@ -1592,16 +1614,16 @@
1592
1614
  }
1593
1615
  return SkyTilesModule;
1594
1616
  }());
1595
- SkyTilesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTilesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1596
- SkyTilesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTilesModule, imports: [i3$1.CommonModule], exports: [SkyTileContentModule,
1617
+ SkyTilesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTilesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1618
+ SkyTilesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTilesModule, imports: [i3$1.CommonModule], exports: [SkyTileContentModule,
1597
1619
  SkyTileModule,
1598
1620
  SkyTileDashboardColumnModule,
1599
1621
  SkyTileDashboardModule] });
1600
- SkyTilesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTilesModule, imports: [[i3$1.CommonModule], SkyTileContentModule,
1622
+ SkyTilesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTilesModule, imports: [[i3$1.CommonModule], SkyTileContentModule,
1601
1623
  SkyTileModule,
1602
1624
  SkyTileDashboardColumnModule,
1603
1625
  SkyTileDashboardModule] });
1604
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyTilesModule, decorators: [{
1626
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: SkyTilesModule, decorators: [{
1605
1627
  type: i0.NgModule,
1606
1628
  args: [{
1607
1629
  imports: [i3$1.CommonModule],