@skyux/flyout 5.5.0 → 5.6.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.
- package/bundles/skyux-flyout.umd.js +97 -96
- package/documentation.json +38 -38
- package/esm2015/lib/modules/flyout/flyout-adapter.service.js.map +1 -1
- package/esm2015/lib/modules/flyout/flyout-instance.js.map +1 -1
- package/esm2015/lib/modules/flyout/flyout-iterator.component.js.map +1 -1
- package/esm2015/lib/modules/flyout/flyout-media-query.service.js.map +1 -1
- package/esm2015/lib/modules/flyout/flyout.component.js +6 -5
- package/esm2015/lib/modules/flyout/flyout.component.js.map +1 -1
- package/esm2015/lib/modules/flyout/flyout.module.js +3 -3
- package/esm2015/lib/modules/flyout/flyout.module.js.map +1 -1
- package/esm2015/lib/modules/flyout/flyout.service.js +1 -1
- package/esm2015/lib/modules/flyout/flyout.service.js.map +1 -1
- package/esm2015/lib/modules/flyout/types/flyout-config.js.map +1 -1
- package/esm2015/lib/modules/shared/sky-flyout-resources.module.js +1 -1
- package/esm2015/lib/modules/shared/sky-flyout-resources.module.js.map +1 -1
- package/fesm2015/skyux-flyout.js +67 -66
- package/fesm2015/skyux-flyout.js.map +1 -1
- package/lib/modules/flyout/flyout-iterator.component.d.ts +1 -1
- package/lib/modules/flyout/flyout.component.d.ts +2 -2
- package/lib/modules/flyout/flyout.service.d.ts +1 -1
- package/package.json +6 -6
package/documentation.json
CHANGED
|
@@ -140,7 +140,7 @@
|
|
|
140
140
|
"sources": [
|
|
141
141
|
{
|
|
142
142
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
143
|
-
"line":
|
|
143
|
+
"line": 115,
|
|
144
144
|
"character": 2
|
|
145
145
|
}
|
|
146
146
|
],
|
|
@@ -189,7 +189,7 @@
|
|
|
189
189
|
"sources": [
|
|
190
190
|
{
|
|
191
191
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
192
|
-
"line":
|
|
192
|
+
"line": 26,
|
|
193
193
|
"character": 9
|
|
194
194
|
}
|
|
195
195
|
],
|
|
@@ -221,7 +221,7 @@
|
|
|
221
221
|
"sources": [
|
|
222
222
|
{
|
|
223
223
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
224
|
-
"line":
|
|
224
|
+
"line": 31,
|
|
225
225
|
"character": 9
|
|
226
226
|
}
|
|
227
227
|
],
|
|
@@ -251,7 +251,7 @@
|
|
|
251
251
|
"sources": [
|
|
252
252
|
{
|
|
253
253
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
254
|
-
"line":
|
|
254
|
+
"line": 45,
|
|
255
255
|
"character": 9
|
|
256
256
|
}
|
|
257
257
|
],
|
|
@@ -272,7 +272,7 @@
|
|
|
272
272
|
"sources": [
|
|
273
273
|
{
|
|
274
274
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
275
|
-
"line":
|
|
275
|
+
"line": 19,
|
|
276
276
|
"character": 13
|
|
277
277
|
}
|
|
278
278
|
],
|
|
@@ -313,7 +313,7 @@
|
|
|
313
313
|
"sources": [
|
|
314
314
|
{
|
|
315
315
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
316
|
-
"line":
|
|
316
|
+
"line": 50,
|
|
317
317
|
"character": 13
|
|
318
318
|
}
|
|
319
319
|
],
|
|
@@ -353,7 +353,7 @@
|
|
|
353
353
|
"sources": [
|
|
354
354
|
{
|
|
355
355
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
356
|
-
"line":
|
|
356
|
+
"line": 65,
|
|
357
357
|
"character": 13
|
|
358
358
|
}
|
|
359
359
|
],
|
|
@@ -426,7 +426,7 @@
|
|
|
426
426
|
"sources": [
|
|
427
427
|
{
|
|
428
428
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
429
|
-
"line":
|
|
429
|
+
"line": 57,
|
|
430
430
|
"character": 13
|
|
431
431
|
}
|
|
432
432
|
],
|
|
@@ -466,7 +466,7 @@
|
|
|
466
466
|
"sources": [
|
|
467
467
|
{
|
|
468
468
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
469
|
-
"line":
|
|
469
|
+
"line": 86,
|
|
470
470
|
"character": 13
|
|
471
471
|
}
|
|
472
472
|
],
|
|
@@ -539,7 +539,7 @@
|
|
|
539
539
|
"sources": [
|
|
540
540
|
{
|
|
541
541
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
542
|
-
"line":
|
|
542
|
+
"line": 125,
|
|
543
543
|
"character": 9
|
|
544
544
|
}
|
|
545
545
|
],
|
|
@@ -619,7 +619,7 @@
|
|
|
619
619
|
"sources": [
|
|
620
620
|
{
|
|
621
621
|
"fileName": "projects/flyout/src/modules/flyout/flyout-instance.ts",
|
|
622
|
-
"line":
|
|
622
|
+
"line": 13,
|
|
623
623
|
"character": 13
|
|
624
624
|
}
|
|
625
625
|
],
|
|
@@ -688,7 +688,7 @@
|
|
|
688
688
|
"sources": [
|
|
689
689
|
{
|
|
690
690
|
"fileName": "projects/flyout/src/modules/flyout/flyout.module.ts",
|
|
691
|
-
"line":
|
|
691
|
+
"line": 32,
|
|
692
692
|
"character": 13
|
|
693
693
|
}
|
|
694
694
|
]
|
|
@@ -726,7 +726,7 @@
|
|
|
726
726
|
"sources": [
|
|
727
727
|
{
|
|
728
728
|
"fileName": "projects/flyout/src/modules/flyout/flyout.service.ts",
|
|
729
|
-
"line":
|
|
729
|
+
"line": 40,
|
|
730
730
|
"character": 2
|
|
731
731
|
}
|
|
732
732
|
],
|
|
@@ -830,7 +830,7 @@
|
|
|
830
830
|
"sources": [
|
|
831
831
|
{
|
|
832
832
|
"fileName": "projects/flyout/src/modules/flyout/flyout.service.ts",
|
|
833
|
-
"line":
|
|
833
|
+
"line": 60,
|
|
834
834
|
"character": 9
|
|
835
835
|
}
|
|
836
836
|
],
|
|
@@ -881,7 +881,7 @@
|
|
|
881
881
|
"sources": [
|
|
882
882
|
{
|
|
883
883
|
"fileName": "projects/flyout/src/modules/flyout/flyout.service.ts",
|
|
884
|
-
"line":
|
|
884
|
+
"line": 49,
|
|
885
885
|
"character": 9
|
|
886
886
|
}
|
|
887
887
|
],
|
|
@@ -918,7 +918,7 @@
|
|
|
918
918
|
"sources": [
|
|
919
919
|
{
|
|
920
920
|
"fileName": "projects/flyout/src/modules/flyout/flyout.service.ts",
|
|
921
|
-
"line":
|
|
921
|
+
"line": 77,
|
|
922
922
|
"character": 9
|
|
923
923
|
}
|
|
924
924
|
],
|
|
@@ -1020,7 +1020,7 @@
|
|
|
1020
1020
|
"sources": [
|
|
1021
1021
|
{
|
|
1022
1022
|
"fileName": "projects/flyout/src/modules/flyout/flyout.service.ts",
|
|
1023
|
-
"line":
|
|
1023
|
+
"line": 34,
|
|
1024
1024
|
"character": 13
|
|
1025
1025
|
}
|
|
1026
1026
|
],
|
|
@@ -1219,7 +1219,7 @@
|
|
|
1219
1219
|
"sources": [
|
|
1220
1220
|
{
|
|
1221
1221
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1222
|
-
"line":
|
|
1222
|
+
"line": 15,
|
|
1223
1223
|
"character": 2
|
|
1224
1224
|
}
|
|
1225
1225
|
],
|
|
@@ -1242,7 +1242,7 @@
|
|
|
1242
1242
|
"sources": [
|
|
1243
1243
|
{
|
|
1244
1244
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1245
|
-
"line":
|
|
1245
|
+
"line": 22,
|
|
1246
1246
|
"character": 2
|
|
1247
1247
|
}
|
|
1248
1248
|
],
|
|
@@ -1265,7 +1265,7 @@
|
|
|
1265
1265
|
"sources": [
|
|
1266
1266
|
{
|
|
1267
1267
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1268
|
-
"line":
|
|
1268
|
+
"line": 30,
|
|
1269
1269
|
"character": 2
|
|
1270
1270
|
}
|
|
1271
1271
|
],
|
|
@@ -1298,7 +1298,7 @@
|
|
|
1298
1298
|
"sources": [
|
|
1299
1299
|
{
|
|
1300
1300
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1301
|
-
"line":
|
|
1301
|
+
"line": 42,
|
|
1302
1302
|
"character": 2
|
|
1303
1303
|
}
|
|
1304
1304
|
],
|
|
@@ -1321,7 +1321,7 @@
|
|
|
1321
1321
|
"sources": [
|
|
1322
1322
|
{
|
|
1323
1323
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1324
|
-
"line":
|
|
1324
|
+
"line": 48,
|
|
1325
1325
|
"character": 2
|
|
1326
1326
|
}
|
|
1327
1327
|
],
|
|
@@ -1350,7 +1350,7 @@
|
|
|
1350
1350
|
"sources": [
|
|
1351
1351
|
{
|
|
1352
1352
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1353
|
-
"line":
|
|
1353
|
+
"line": 97,
|
|
1354
1354
|
"character": 2
|
|
1355
1355
|
}
|
|
1356
1356
|
],
|
|
@@ -1379,7 +1379,7 @@
|
|
|
1379
1379
|
"sources": [
|
|
1380
1380
|
{
|
|
1381
1381
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1382
|
-
"line":
|
|
1382
|
+
"line": 90,
|
|
1383
1383
|
"character": 2
|
|
1384
1384
|
}
|
|
1385
1385
|
],
|
|
@@ -1408,7 +1408,7 @@
|
|
|
1408
1408
|
"sources": [
|
|
1409
1409
|
{
|
|
1410
1410
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1411
|
-
"line":
|
|
1411
|
+
"line": 60,
|
|
1412
1412
|
"character": 2
|
|
1413
1413
|
}
|
|
1414
1414
|
],
|
|
@@ -1437,7 +1437,7 @@
|
|
|
1437
1437
|
"sources": [
|
|
1438
1438
|
{
|
|
1439
1439
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1440
|
-
"line":
|
|
1440
|
+
"line": 54,
|
|
1441
1441
|
"character": 2
|
|
1442
1442
|
}
|
|
1443
1443
|
],
|
|
@@ -1460,7 +1460,7 @@
|
|
|
1460
1460
|
"sources": [
|
|
1461
1461
|
{
|
|
1462
1462
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1463
|
-
"line":
|
|
1463
|
+
"line": 66,
|
|
1464
1464
|
"character": 2
|
|
1465
1465
|
}
|
|
1466
1466
|
],
|
|
@@ -1484,7 +1484,7 @@
|
|
|
1484
1484
|
"sources": [
|
|
1485
1485
|
{
|
|
1486
1486
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1487
|
-
"line":
|
|
1487
|
+
"line": 71,
|
|
1488
1488
|
"character": 2
|
|
1489
1489
|
}
|
|
1490
1490
|
],
|
|
@@ -1508,7 +1508,7 @@
|
|
|
1508
1508
|
"sources": [
|
|
1509
1509
|
{
|
|
1510
1510
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1511
|
-
"line":
|
|
1511
|
+
"line": 76,
|
|
1512
1512
|
"character": 2
|
|
1513
1513
|
}
|
|
1514
1514
|
],
|
|
@@ -1534,7 +1534,7 @@
|
|
|
1534
1534
|
"sources": [
|
|
1535
1535
|
{
|
|
1536
1536
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1537
|
-
"line":
|
|
1537
|
+
"line": 105,
|
|
1538
1538
|
"character": 2
|
|
1539
1539
|
}
|
|
1540
1540
|
],
|
|
@@ -1563,7 +1563,7 @@
|
|
|
1563
1563
|
"sources": [
|
|
1564
1564
|
{
|
|
1565
1565
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1566
|
-
"line":
|
|
1566
|
+
"line": 83,
|
|
1567
1567
|
"character": 2
|
|
1568
1568
|
}
|
|
1569
1569
|
],
|
|
@@ -1598,7 +1598,7 @@
|
|
|
1598
1598
|
"sources": [
|
|
1599
1599
|
{
|
|
1600
1600
|
"fileName": "projects/flyout/src/modules/flyout/types/flyout-config.ts",
|
|
1601
|
-
"line":
|
|
1601
|
+
"line": 7,
|
|
1602
1602
|
"character": 17
|
|
1603
1603
|
}
|
|
1604
1604
|
]
|
|
@@ -1805,12 +1805,12 @@
|
|
|
1805
1805
|
{
|
|
1806
1806
|
"fileName": "flyout-demo.component.ts",
|
|
1807
1807
|
"filePath": "/projects/flyout/documentation/code-examples/flyout/basic/flyout-demo.component.ts",
|
|
1808
|
-
"rawContents": "import { Component } from '@angular/core';\
|
|
1808
|
+
"rawContents": "import { Component } from '@angular/core';\nimport {\n SkyFlyoutConfig,\n SkyFlyoutInstance,\n SkyFlyoutService,\n} from '@skyux/flyout';\n\nimport { FlyoutDemoFlyoutComponent } from './flyout-demo-flyout.component';\n\n@Component({\n selector: 'app-flyout-demo',\n templateUrl: './flyout-demo.component.html',\n})\nexport class FlyoutDemoComponent {\n public flyout: SkyFlyoutInstance<any>;\n\n constructor(private flyoutService: SkyFlyoutService) {}\n\n public closeAndRemoveFlyout(): void {\n if (this.flyout && this.flyout.isOpen) {\n this.flyoutService.close();\n }\n this.flyout = undefined;\n }\n\n public openFlyoutWithCutsomWidth(): void {\n const flyoutConfig: SkyFlyoutConfig = {\n ariaLabelledBy: 'flyout-title',\n ariaRole: 'dialog',\n defaultWidth: 350,\n maxWidth: 500,\n minWidth: 200,\n };\n this.flyout = this.flyoutService.open(\n FlyoutDemoFlyoutComponent,\n flyoutConfig\n );\n\n this.flyout.closed.subscribe(() => {\n this.flyout = undefined;\n });\n }\n\n public openSimpleFlyout(): void {\n const flyoutConfig: SkyFlyoutConfig = {\n ariaLabelledBy: 'flyout-title',\n ariaRole: 'dialog',\n };\n this.flyout = this.flyoutService.open(\n FlyoutDemoFlyoutComponent,\n flyoutConfig\n );\n\n this.flyout.closed.subscribe(() => {\n this.flyout = undefined;\n });\n }\n}\n"
|
|
1809
1809
|
},
|
|
1810
1810
|
{
|
|
1811
1811
|
"fileName": "flyout-demo.module.ts",
|
|
1812
1812
|
"filePath": "/projects/flyout/documentation/code-examples/flyout/basic/flyout-demo.module.ts",
|
|
1813
|
-
"rawContents": "import {
|
|
1813
|
+
"rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyFlyoutModule } from '@skyux/flyout';\n\nimport { FlyoutDemoFlyoutComponent } from './flyout-demo-flyout.component';\nimport { FlyoutDemoComponent } from './flyout-demo.component';\n\n@NgModule({\n imports: [CommonModule, SkyFlyoutModule],\n declarations: [FlyoutDemoComponent, FlyoutDemoFlyoutComponent],\n entryComponents: [FlyoutDemoFlyoutComponent],\n exports: [FlyoutDemoComponent],\n})\nexport class AutocompleteDemoModule {}\n"
|
|
1814
1814
|
},
|
|
1815
1815
|
{
|
|
1816
1816
|
"fileName": "flyout-demo-flyout.component.ts",
|
|
@@ -1825,12 +1825,12 @@
|
|
|
1825
1825
|
{
|
|
1826
1826
|
"fileName": "flyout-demo.component.ts",
|
|
1827
1827
|
"filePath": "/projects/flyout/documentation/code-examples/flyout/custom-headers/flyout-demo.component.ts",
|
|
1828
|
-
"rawContents": "import { Component } from '@angular/core';\
|
|
1828
|
+
"rawContents": "import { Component } from '@angular/core';\nimport {\n SkyFlyoutConfig,\n SkyFlyoutInstance,\n SkyFlyoutService,\n} from '@skyux/flyout';\n\nimport { FlyoutDemoFlyoutComponent } from './flyout-demo-flyout.component';\n\n@Component({\n selector: 'app-flyout-demo',\n templateUrl: './flyout-demo.component.html',\n})\nexport class FlyoutDemoComponent {\n public flyout: SkyFlyoutInstance<any>;\n\n constructor(private flyoutService: SkyFlyoutService) {}\n\n public openFlyoutWithIterators(): void {\n const flyoutConfig: SkyFlyoutConfig = {\n ariaLabelledBy: 'flyout-title',\n ariaRole: 'dialog',\n showIterator: true,\n };\n this.flyout = this.flyoutService.open(\n FlyoutDemoFlyoutComponent,\n flyoutConfig\n );\n\n this.flyout.iteratorNextButtonClick.subscribe(() => {\n alert('Next iterator button clicked!');\n });\n\n this.flyout.iteratorPreviousButtonClick.subscribe(() => {\n alert('Prvious iterator button clicked!');\n });\n\n this.flyout.closed.subscribe(() => {\n this.flyout = undefined;\n });\n }\n\n public openFlyoutWithRoutePermalink(): void {\n const flyoutConfig: SkyFlyoutConfig = {\n ariaLabelledBy: 'flyout-title',\n ariaRole: 'dialog',\n permalink: {\n label: 'Go to Components page',\n route: {\n commands: ['/components'],\n extras: {\n fragment: 'helloWorld',\n queryParams: {\n foo: 'bar',\n },\n },\n },\n },\n };\n this.flyout = this.flyoutService.open(\n FlyoutDemoFlyoutComponent,\n flyoutConfig\n );\n\n this.flyout.closed.subscribe(() => {\n this.flyout = undefined;\n });\n }\n\n public openFlyoutWithUrlPermalink(): void {\n const flyoutConfig: SkyFlyoutConfig = {\n ariaLabelledBy: 'flyout-title',\n ariaRole: 'dialog',\n permalink: {\n label: `Visit blackbaud.com`,\n url: 'http://www.blackbaud.com',\n },\n };\n this.flyout = this.flyoutService.open(\n FlyoutDemoFlyoutComponent,\n flyoutConfig\n );\n\n this.flyout.closed.subscribe(() => {\n this.flyout = undefined;\n });\n }\n}\n"
|
|
1829
1829
|
},
|
|
1830
1830
|
{
|
|
1831
1831
|
"fileName": "flyout-demo.module.ts",
|
|
1832
1832
|
"filePath": "/projects/flyout/documentation/code-examples/flyout/custom-headers/flyout-demo.module.ts",
|
|
1833
|
-
"rawContents": "import {
|
|
1833
|
+
"rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyFlyoutModule } from '@skyux/flyout';\n\nimport { FlyoutDemoFlyoutComponent } from './flyout-demo-flyout.component';\nimport { FlyoutDemoComponent } from './flyout-demo.component';\n\n@NgModule({\n imports: [CommonModule, SkyFlyoutModule],\n declarations: [FlyoutDemoComponent, FlyoutDemoFlyoutComponent],\n entryComponents: [FlyoutDemoFlyoutComponent],\n exports: [FlyoutDemoComponent],\n})\nexport class AutocompleteDemoModule {}\n"
|
|
1834
1834
|
},
|
|
1835
1835
|
{
|
|
1836
1836
|
"fileName": "flyout-demo-context.ts",
|
|
@@ -1855,12 +1855,12 @@
|
|
|
1855
1855
|
{
|
|
1856
1856
|
"fileName": "flyout-demo.component.ts",
|
|
1857
1857
|
"filePath": "/projects/flyout/documentation/code-examples/flyout/grid/flyout-demo.component.ts",
|
|
1858
|
-
"rawContents": "import { Component, ViewChild } from '@angular/core';\
|
|
1858
|
+
"rawContents": "import { Component, ViewChild } from '@angular/core';\nimport {\n SkyFlyoutConfig,\n SkyFlyoutInstance,\n SkyFlyoutService,\n} from '@skyux/flyout';\nimport { ListItemModel } from '@skyux/list-builder-common';\nimport { SkyListViewGridComponent } from '@skyux/list-builder-view-grids';\n\nimport { Subject, of } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\n\nimport { FlyoutDemoContext } from './flyout-demo-context';\nimport { FlyoutDemoFlyoutComponent } from './flyout-demo-flyout.component';\n\n@Component({\n selector: 'app-flyout-demo',\n templateUrl: './flyout-demo.component.html',\n})\nexport class FlyoutDemoComponent {\n public flyout: SkyFlyoutInstance<any>;\n\n public rowHighlightedId: string;\n\n public users = of([\n {\n id: '1',\n name: 'Troy Barnes',\n constituentCode: 'Alumnus',\n latestGift: 175,\n status: 'Paid',\n },\n {\n id: '2',\n name: 'Britta Perry',\n constituentCode: 'Friend',\n latestGift: 5,\n status: 'Past due',\n },\n {\n id: '3',\n name: 'Pierce Hawthorne',\n constituentCode: 'Board Member',\n latestGift: 1500,\n status: 'Paid',\n },\n {\n id: '4',\n name: 'Annie Edison',\n constituentCode: 'Alumnus',\n latestGift: 100,\n status: 'Paid',\n },\n {\n id: '5',\n name: 'Shirley Bennett',\n constituentCode: 'Board Member',\n latestGift: 250,\n status: 'Paid',\n },\n {\n id: '6',\n name: 'Jeff Winger',\n constituentCode: 'Friend',\n latestGift: 250,\n status: 'Paid',\n },\n {\n id: '7',\n name: 'Abed Nadir',\n constituentCode: 'Major Donor',\n latestGift: 100000,\n status: 'Paid',\n },\n ]);\n\n @ViewChild(SkyListViewGridComponent)\n public listViewGridComponent: SkyListViewGridComponent;\n\n private listState: ListItemModel[];\n\n private openFlyoutStream = new Subject<boolean>();\n\n constructor(private flyoutService: SkyFlyoutService) {}\n\n public onNameClick(record: FlyoutDemoContext): void {\n this.openRecord(record);\n }\n\n private openRecord(record: FlyoutDemoContext) {\n // Prevent highlight from being prematurely removed.\n this.openFlyoutStream.next(true);\n\n const flyoutConfig: SkyFlyoutConfig = {\n providers: [\n {\n provide: FlyoutDemoContext,\n useValue: record,\n },\n ],\n ariaLabelledBy: 'flyout-title',\n ariaRole: 'dialog',\n permalink: {\n route: {\n commands: ['/users', record.id],\n extras: {\n queryParams: {\n envid: '123456789',\n },\n },\n },\n },\n showIterator: true,\n };\n\n this.flyout = this.flyoutService.open(\n FlyoutDemoFlyoutComponent,\n flyoutConfig\n );\n\n this.flyout.closed.subscribe(() => {\n this.flyout = undefined;\n });\n\n this.initIterators(record, this.flyout);\n }\n\n private initIterators(record: any, flyout: SkyFlyoutInstance<any>) {\n this.rowHighlightedId = record.id;\n\n // Remove highlights when flyout is closed.\n flyout.closed.pipe(takeUntil(this.openFlyoutStream)).subscribe(() => {\n this.rowHighlightedId = undefined;\n });\n\n this.listViewGridComponent.items\n .pipe(takeUntil(this.openFlyoutStream))\n .subscribe((s: any) => {\n this.listState = s;\n\n flyout.iteratorPreviousButtonDisabled = this.isFirstElementInArray(\n this.rowHighlightedId,\n this.listState\n );\n flyout.iteratorNextButtonDisabled = this.isLastElementInArray(\n this.rowHighlightedId,\n this.listState\n );\n });\n\n flyout.iteratorPreviousButtonClick\n .pipe(takeUntil(this.openFlyoutStream))\n .subscribe(() => {\n const previous = this.stepToItemInArray(\n this.listState,\n this.rowHighlightedId,\n -1\n );\n this.openRecord(previous.data);\n });\n\n flyout.iteratorNextButtonClick\n .pipe(takeUntil(this.openFlyoutStream))\n .subscribe(() => {\n const next = this.stepToItemInArray(\n this.listState,\n this.rowHighlightedId,\n 1\n );\n this.openRecord(next.data);\n });\n\n flyout.iteratorPreviousButtonDisabled = this.isFirstElementInArray(\n this.rowHighlightedId,\n this.listState\n );\n flyout.iteratorNextButtonDisabled = this.isLastElementInArray(\n this.rowHighlightedId,\n this.listState\n );\n }\n\n private stepToItemInArray(\n array: Array<any>,\n currentId: string,\n step: number\n ) {\n for (let i = 0; i < array.length; i++) {\n if (array[i].id === currentId) {\n return array[i + step];\n }\n }\n }\n\n private isFirstElementInArray(id: any, array: any[]) {\n const element = array.find((x) => x.id === id);\n if (array[0] === element) {\n return true;\n }\n return false;\n }\n\n private isLastElementInArray(id: any, array: any[]) {\n const element = array.find((x) => x.id === id);\n if (array[array.length - 1] === element) {\n return true;\n }\n return false;\n }\n}\n"
|
|
1859
1859
|
},
|
|
1860
1860
|
{
|
|
1861
1861
|
"fileName": "flyout-demo.module.ts",
|
|
1862
1862
|
"filePath": "/projects/flyout/documentation/code-examples/flyout/grid/flyout-demo.module.ts",
|
|
1863
|
-
"rawContents": "import {
|
|
1863
|
+
"rawContents": "import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SkyAvatarModule } from '@skyux/avatar';\nimport { SkyFlyoutModule } from '@skyux/flyout';\nimport { SkyKeyInfoModule, SkyLabelModule } from '@skyux/indicators';\nimport { SkyPageSummaryModule } from '@skyux/layout';\nimport { SkyListModule } from '@skyux/list-builder';\nimport { SkyListViewGridModule } from '@skyux/list-builder-view-grids';\n\nimport { FlyoutDemoFlyoutComponent } from './flyout-demo-flyout.component';\nimport { FlyoutDemoComponent } from './flyout-demo.component';\n\n@NgModule({\n imports: [\n CommonModule,\n SkyAvatarModule,\n SkyFlyoutModule,\n SkyListModule,\n SkyKeyInfoModule,\n SkyLabelModule,\n SkyListViewGridModule,\n SkyPageSummaryModule,\n ],\n declarations: [FlyoutDemoComponent, FlyoutDemoFlyoutComponent],\n entryComponents: [FlyoutDemoFlyoutComponent],\n exports: [FlyoutDemoComponent],\n})\nexport class AutocompleteDemoModule {}\n"
|
|
1864
1864
|
}
|
|
1865
1865
|
]
|
|
1866
1866
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flyout-adapter.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-adapter.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,UAAU,EAEV,gBAAgB,GACjB,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"flyout-adapter.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-adapter.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,UAAU,EAEV,gBAAgB,GACjB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;;;AAEnE;;GAEG;AAEH,MAAM,OAAO,uBAAuB;IAGlC,YACU,eAAiC,EACjC,SAA0B;QAD1B,oBAAe,GAAf,eAAe,CAAkB;QACjC,cAAS,GAAT,SAAS,CAAiB;QAElC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAC5E,CAAC;IAEM,mBAAmB,CAAC,MAAkB;QAC3C,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC;QAC9C,MAAM,UAAU,GAAG,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC;QAExE,IAAI,UAAU,EAAE;YACd,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,EAAE,sBAAsB,CAAC,CAAC;SACtE;IACH,CAAC;IAEM,kBAAkB,CACvB,OAAmB,EACnB,UAA+B;QAE/B,MAAM,QAAQ,GAAgB,OAAO,CAAC,aAAa,CAAC;QAEpD,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,6BAA6B,CAAC,CAAC;QACnE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,6BAA6B,CAAC,CAAC;QACnE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,6BAA6B,CAAC,CAAC;QACnE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,6BAA6B,CAAC,CAAC;QAEnE,IAAI,QAAgB,CAAC;QAErB,QAAQ,UAAU,EAAE;YAClB,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,QAAQ,GAAG,6BAA6B,CAAC;gBACzC,MAAM;aACP;YACD,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,QAAQ,GAAG,6BAA6B,CAAC;gBACzC,MAAM;aACP;YACD,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,QAAQ,GAAG,6BAA6B,CAAC;gBACzC,MAAM;aACP;YACD,OAAO,CAAC,CAAC;gBACP,QAAQ,GAAG,6BAA6B,CAAC;gBACzC,MAAM;aACP;SACF;QAED,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAC7C,CAAC;IAEM,yBAAyB,CAAC,MAAe;QAC9C,yEAAyE;QACzE,sEAAsE;QACtE,oFAAoF;QACpF,sDAAsD;QACtD,MAAM,OAAO,GAAG,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;QACpD,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACvC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC;SACvD;IACH,CAAC;;qHA/DU,uBAAuB;yHAAvB,uBAAuB;4FAAvB,uBAAuB;kBADnC,UAAU","sourcesContent":["import {\n ElementRef,\n Injectable,\n Renderer2,\n RendererFactory2,\n} from '@angular/core';\nimport { SkyAppWindowRef, SkyMediaBreakpoints } from '@skyux/core';\n\n/**\n * @internal\n */\n@Injectable()\nexport class SkyFlyoutAdapterService {\n private renderer: Renderer2;\n\n constructor(\n private rendererFactory: RendererFactory2,\n private windowRef: SkyAppWindowRef\n ) {\n this.renderer = this.rendererFactory.createRenderer(undefined, undefined);\n }\n\n public adjustHeaderForHelp(header: ElementRef): void {\n const windowObj = this.windowRef.nativeWindow;\n const helpWidget = windowObj.document.getElementById('bb-help-invoker');\n\n if (helpWidget) {\n this.renderer.addClass(header.nativeElement, 'sky-flyout-help-shim');\n }\n }\n\n public setResponsiveClass(\n element: ElementRef,\n breakpoint: SkyMediaBreakpoints\n ): void {\n const nativeEl: HTMLElement = element.nativeElement;\n\n this.renderer.removeClass(nativeEl, 'sky-responsive-container-xs');\n this.renderer.removeClass(nativeEl, 'sky-responsive-container-sm');\n this.renderer.removeClass(nativeEl, 'sky-responsive-container-md');\n this.renderer.removeClass(nativeEl, 'sky-responsive-container-lg');\n\n let newClass: string;\n\n switch (breakpoint) {\n case SkyMediaBreakpoints.xs: {\n newClass = 'sky-responsive-container-xs';\n break;\n }\n case SkyMediaBreakpoints.sm: {\n newClass = 'sky-responsive-container-sm';\n break;\n }\n case SkyMediaBreakpoints.md: {\n newClass = 'sky-responsive-container-md';\n break;\n }\n default: {\n newClass = 'sky-responsive-container-lg';\n break;\n }\n }\n\n this.renderer.addClass(nativeEl, newClass);\n }\n\n public toggleIframePointerEvents(enable: boolean): void {\n // When iframes are present on the page, they may interfere with dragging\n // temporarily disable pointer events in iframes when dragging starts.\n // When re-enabling we set to the empty string as it will remove the element styling\n // and fall back to any css originally given to iframe\n const iframes = document.querySelectorAll('iframe');\n for (let i = 0; i < iframes.length; i++) {\n iframes[i].style.pointerEvents = enable ? '' : 'none';\n }\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flyout-instance.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-instance.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,OAAO,EAAc,OAAO,EAAE,MAAM,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"flyout-instance.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-instance.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,OAAO,EAAc,OAAO,EAAE,MAAM,MAAM,CAAC;AAK3C,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAEnE;;GAEG;AACH,MAAM,OAAO,iBAAiB;IAsG5B;QA5FA;;WAEG;QACI,WAAM,GAAG,IAAI,YAAY,EAAQ,CAAC;QAezC;;;WAGG;QACI,WAAM,GAAG,IAAI,CAAC;QA0Db,iBAAY,GAAG,IAAI,OAAO,EAA+B,CAAC;QAE1D,6BAAwB,GAAG,IAAI,YAAY,EAAQ,CAAC;QAEpD,iCAA4B,GAAG,IAAI,YAAY,EAAQ,CAAC;QAExD,gCAA2B,GAAG,KAAK,CAAC;QAEpC,oCAA+B,GAAG,KAAK,CAAC;QAExC,oBAAe,GAAG,IAAI,OAAO,EAAoB,CAAC;QAGxD,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,EAAE;YACzB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACtB,CAAC,CAAC,CAAC;IACL,CAAC;IAzGD;;;;OAIG;IACH,IAAW,WAAW;QACpB,OAAO,IAAI,CAAC,YAAY,CAAC;IAC3B,CAAC;IAYD;;;OAGG;IACH,IAAW,cAAc;QACvB,OAAO,IAAI,CAAC,eAAe,CAAC;IAC9B,CAAC;IAQD;;OAEG;IACH,IAAW,uBAAuB;QAChC,OAAO,IAAI,CAAC,wBAAwB,CAAC;IACvC,CAAC;IAED;;OAEG;IACH,IAAW,2BAA2B;QACpC,OAAO,IAAI,CAAC,4BAA4B,CAAC;IAC3C,CAAC;IAED;;;OAGG;IACH,IAAW,0BAA0B,CAAC,QAAiB;QACrD,IAAI,CAAC,2BAA2B,GAAG,QAAQ,CAAC;QAC5C,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;gBACvB,IAAI,EAAE,oBAAoB,CAAC,yBAAyB;aACrD,CAAC,CAAC;SACJ;aAAM;YACL,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;gBACvB,IAAI,EAAE,oBAAoB,CAAC,wBAAwB;aACpD,CAAC,CAAC;SACJ;IACH,CAAC;IAED,IAAW,0BAA0B;QACnC,OAAO,IAAI,CAAC,2BAA2B,CAAC;IAC1C,CAAC;IAED;;;OAGG;IACH,IAAW,8BAA8B,CAAC,QAAiB;QACzD,IAAI,CAAC,+BAA+B,GAAG,QAAQ,CAAC;QAChD,IAAI,QAAQ,EAAE;YACZ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;gBACvB,IAAI,EAAE,oBAAoB,CAAC,6BAA6B;aACzD,CAAC,CAAC;SACJ;aAAM;YACL,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;gBACvB,IAAI,EAAE,oBAAoB,CAAC,4BAA4B;aACxD,CAAC,CAAC;SACJ;IACH,CAAC;IAED,IAAW,8BAA8B;QACvC,OAAO,IAAI,CAAC,+BAA+B,CAAC;IAC9C,CAAC;IAoBD;;;OAGG;IACI,KAAK,CAAC,IAAyB;QACpC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;YACvB,IAAI,EAAE,oBAAoB,CAAC,KAAK;YAChC,IAAI,EAAE,EAAE,iBAAiB,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,KAAK,EAAE;SACnE,CAAC,CAAC;QAEH,IAAI,CAAC,4BAA4B,CAAC,QAAQ,EAAE,CAAC;QAC7C,IAAI,CAAC,wBAAwB,CAAC,QAAQ,EAAE,CAAC;QAEzC,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;IACjC,CAAC;CACF","sourcesContent":["import { EventEmitter } from '@angular/core';\n\nimport { Observable, Subject } from 'rxjs';\n\nimport { SkyFlyoutBeforeCloseHandler } from './types/flyout-before-close-handler';\nimport { SkyFlyoutCloseArgs } from './types/flyout-close-args';\nimport { SkyFlyoutMessage } from './types/flyout-message';\nimport { SkyFlyoutMessageType } from './types/flyout-message-type';\n\n/**\n * Represents a single displayed flyout.\n */\nexport class SkyFlyoutInstance<T> {\n /**\n * An event that the modal instance emits when it is about to close.\n * If a subscription exists for this event,\n * the modal does not close until the subscriber calls the handler's `closeModal` method.\n */\n public get beforeClose(): Observable<SkyFlyoutBeforeCloseHandler> {\n return this._beforeClose;\n }\n\n /**\n * An event that the flyout instance emits when it closes.\n */\n public closed = new EventEmitter<void>();\n\n /**\n * Specifies the instance of the component to display in the flyout.\n */\n public componentInstance: T;\n\n /**\n * Used to communicate with the host component.\n * @internal\n */\n public get hostController(): Subject<SkyFlyoutMessage> {\n return this._hostController;\n }\n\n /**\n * A `boolean` value that returns `true` if the flyout is open.\n * @default true\n */\n public isOpen = true;\n\n /**\n * An event that the flyout instance emits when users click the next iterator button.\n */\n public get iteratorNextButtonClick(): EventEmitter<void> {\n return this._iteratorNextButtonClick;\n }\n\n /**\n * An event that the flyout instance emits when users click the previous iterator button.\n */\n public get iteratorPreviousButtonClick(): EventEmitter<void> {\n return this._iteratorPreviousButtonClick;\n }\n\n /**\n * Disables the next iterator button.\n * @default false\n */\n public set iteratorNextButtonDisabled(newValue: boolean) {\n this._iteratorNextButtonDisabled = newValue;\n if (newValue) {\n this.hostController.next({\n type: SkyFlyoutMessageType.DisableIteratorNextButton,\n });\n } else {\n this.hostController.next({\n type: SkyFlyoutMessageType.EnableIteratorNextButton,\n });\n }\n }\n\n public get iteratorNextButtonDisabled(): boolean {\n return this._iteratorNextButtonDisabled;\n }\n\n /**\n * Disables the previous iterator button.\n * @default false\n */\n public set iteratorPreviousButtonDisabled(newValue: boolean) {\n this._iteratorPreviousButtonDisabled = newValue;\n if (newValue) {\n this.hostController.next({\n type: SkyFlyoutMessageType.DisableIteratorPreviousButton,\n });\n } else {\n this.hostController.next({\n type: SkyFlyoutMessageType.EnableIteratorPreviousButton,\n });\n }\n }\n\n public get iteratorPreviousButtonDisabled(): boolean {\n return this._iteratorPreviousButtonDisabled;\n }\n\n private _beforeClose = new Subject<SkyFlyoutBeforeCloseHandler>();\n\n private _iteratorNextButtonClick = new EventEmitter<void>();\n\n private _iteratorPreviousButtonClick = new EventEmitter<void>();\n\n private _iteratorNextButtonDisabled = false;\n\n private _iteratorPreviousButtonDisabled = false;\n\n private _hostController = new Subject<SkyFlyoutMessage>();\n\n constructor() {\n this.closed.subscribe(() => {\n this.isOpen = false;\n });\n }\n\n /**\n * Closes the flyout instance and emits its `closed` event.\n * @param args Arguments used when closing the flyout.\n */\n public close(args?: SkyFlyoutCloseArgs): void {\n this.hostController.next({\n type: SkyFlyoutMessageType.Close,\n data: { ignoreBeforeClose: args ? args.ignoreBeforeClose : false },\n });\n\n this._iteratorPreviousButtonClick.complete();\n this._iteratorNextButtonClick.complete();\n\n this.hostController.complete();\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flyout-iterator.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-iterator.component.ts","../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-iterator.component.html"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,
|
|
1
|
+
{"version":3,"file":"flyout-iterator.component.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-iterator.component.ts","../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-iterator.component.html"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,YAAY,EACZ,KAAK,EAEL,MAAM,GACP,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAC;;;;;AAE/B;;GAEG;AAMH,MAAM,OAAO,0BAA0B;IALvC;QAsBU,kBAAa,GAAG,IAAI,OAAO,EAAE,CAAC;QAE9B,qBAAgB,GAAG,IAAI,YAAY,EAAQ,CAAC;QAE5C,yBAAoB,GAAG,IAAI,YAAY,EAAQ,CAAC;KAsBzD;IApCC,IACW,mBAAmB;QAC5B,OAAO,IAAI,CAAC,oBAAoB,CAAC;IACnC,CAAC;IAED,IACW,eAAe;QACxB,OAAO,IAAI,CAAC,gBAAgB,CAAC;IAC/B,CAAC;IAQM,WAAW;QAChB,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;QAC1B,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE,CAAC;QAC9B,IAAI,CAAC,oBAAoB,CAAC,QAAQ,EAAE,CAAC;QACrC,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC;IACnC,CAAC;IAEM,uBAAuB;QAC5B,0BAA0B;QAC1B,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE;YAChC,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,CAAC;SAClC;IACH,CAAC;IAEM,mBAAmB;QACxB,0BAA0B;QAC1B,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;YAC5B,IAAI,CAAC,gBAAgB,CAAC,IAAI,EAAE,CAAC;SAC9B;IACH,CAAC;;wHA1CU,0BAA0B;4GAA1B,0BAA0B,gQClBvC,yvCA0CA;4FDxBa,0BAA0B;kBALtC,SAAS;mBAAC;oBACT,QAAQ,EAAE,qBAAqB;oBAC/B,WAAW,EAAE,kCAAkC;oBAC/C,SAAS,EAAE,CAAC,kCAAkC,CAAC;iBAChD;8BAGQ,kBAAkB;sBADxB,KAAK;gBAIC,sBAAsB;sBAD5B,KAAK;gBAIK,mBAAmB;sBAD7B,MAAM;gBAMI,eAAe;sBADzB,MAAM","sourcesContent":["import {\n Component,\n EventEmitter,\n Input,\n OnDestroy,\n Output,\n} from '@angular/core';\n\nimport { Subject } from 'rxjs';\n\n/**\n * @internal\n */\n@Component({\n selector: 'sky-flyout-iterator',\n templateUrl: './flyout-iterator.component.html',\n styleUrls: ['./flyout-iterator.component.scss'],\n})\nexport class SkyFlyoutIteratorComponent implements OnDestroy {\n @Input()\n public nextButtonDisabled: boolean;\n\n @Input()\n public previousButtonDisabled: boolean;\n\n @Output()\n public get previousButtonClick(): EventEmitter<void> {\n return this._previousButtonClick;\n }\n\n @Output()\n public get nextButtonClick(): EventEmitter<void> {\n return this._nextButtonClick;\n }\n\n private ngUnsubscribe = new Subject();\n\n private _nextButtonClick = new EventEmitter<void>();\n\n private _previousButtonClick = new EventEmitter<void>();\n\n public ngOnDestroy(): void {\n this.ngUnsubscribe.next();\n this.ngUnsubscribe.complete();\n this._previousButtonClick.complete();\n this._nextButtonClick.complete();\n }\n\n public onIteratorPreviousClick(): void {\n /* istanbul ignore else */\n if (!this.previousButtonDisabled) {\n this._previousButtonClick.emit();\n }\n }\n\n public onIteratorNextClick(): void {\n /* istanbul ignore else */\n if (!this.nextButtonDisabled) {\n this._nextButtonClick.emit();\n }\n }\n}\n","<div id=\"iterators\" class=\"sky-flyout-iterators\">\n <button\n class=\"sky-btn\"\n [attr.aria-label]=\"\n 'skyux_flyout_iterator_previous_button' | skyLibResources\n \"\n [disabled]=\"previousButtonDisabled\"\n [skyThemeClass]=\"{\n 'sky-btn-default sky-margin-inline-compact': 'default',\n 'sky-btn-icon-borderless sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onIteratorPreviousClick()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"chevron-up\"> </sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"chevron-up\"\n iconType=\"skyux\"\n size=\"lg\"\n >\n </sky-icon>\n </button>\n <button\n class=\"sky-btn\"\n [attr.aria-label]=\"'skyux_flyout_iterator_next_button' | skyLibResources\"\n [disabled]=\"nextButtonDisabled\"\n [skyThemeClass]=\"{\n 'sky-btn-default sky-margin-inline-compact': 'default',\n 'sky-btn-icon-borderless sky-margin-inline-sm': 'modern'\n }\"\n (click)=\"onIteratorNextClick()\"\n >\n <sky-icon *skyThemeIf=\"'default'\" icon=\"chevron-down\"> </sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"chevron-down\"\n iconType=\"skyux\"\n size=\"lg\"\n >\n </sky-icon>\n </button>\n</div>\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flyout-media-query.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-media-query.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"flyout-media-query.service.js","sourceRoot":"","sources":["../../../../../../../../libs/components/flyout/src/lib/modules/flyout/flyout-media-query.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,mBAAmB,EAAyB,MAAM,aAAa,CAAC;AAEzE,OAAO,EAAE,eAAe,EAAgB,MAAM,MAAM,CAAC;;AAErD;;GAEG;AAEH,MAAM,OAAO,0BAA0B;IAWrC;QANQ,mBAAc,GAAG,IAAI,eAAe,CAC1C,IAAI,CAAC,OAAO,CACb,CAAC;QAEM,aAAQ,GAAG,mBAAmB,CAAC,EAAE,CAAC;QAGxC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC1C,CAAC;IAZD,IAAW,OAAO;QAChB,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAYM,SAAS,CAAC,QAA+B;QAC9C,OAAO,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC;YACnC,IAAI,EAAE,CAAC,WAAgC,EAAE,EAAE;gBACzC,QAAQ,CAAC,WAAW,CAAC,CAAC;YACxB,CAAC;SACF,CAAC,CAAC;IACL,CAAC;IAEM,qBAAqB,CAAC,KAAa;QACxC,IAAI,UAA+B,CAAC;QAEpC,IAAI,IAAI,CAAC,uBAAuB,CAAC,KAAK,EAAE,mBAAmB,CAAC,EAAE,CAAC,EAAE;YAC/D,UAAU,GAAG,mBAAmB,CAAC,EAAE,CAAC;SACrC;aAAM,IAAI,IAAI,CAAC,uBAAuB,CAAC,KAAK,EAAE,mBAAmB,CAAC,EAAE,CAAC,EAAE;YACtE,UAAU,GAAG,mBAAmB,CAAC,EAAE,CAAC;SACrC;aAAM,IAAI,IAAI,CAAC,uBAAuB,CAAC,KAAK,EAAE,mBAAmB,CAAC,EAAE,CAAC,EAAE;YACtE,UAAU,GAAG,mBAAmB,CAAC,EAAE,CAAC;SACrC;aAAM;YACL,UAAU,GAAG,mBAAmB,CAAC,EAAE,CAAC;SACrC;QAED,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC;QAC3B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAC1C,CAAC;IAEM,uBAAuB,CAC5B,KAAa,EACb,UAA+B;QAE/B,MAAM,qBAAqB,GAAG,GAAG,CAAC;QAClC,MAAM,qBAAqB,GAAG,GAAG,CAAC;QAClC,MAAM,qBAAqB,GAAG,GAAG,CAAC;QAClC,MAAM,qBAAqB,GAAG,GAAG,CAAC;QAClC,MAAM,qBAAqB,GAAG,IAAI,CAAC;QACnC,MAAM,qBAAqB,GAAG,IAAI,CAAC;QAEnC,QAAQ,UAAU,EAAE;YAClB,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,OAAO,KAAK,IAAI,qBAAqB,CAAC;aACvC;YACD,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,OAAO,KAAK,IAAI,qBAAqB,IAAI,KAAK,IAAI,qBAAqB,CAAC;aACzE;YACD,KAAK,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC3B,OAAO,KAAK,IAAI,qBAAqB,IAAI,KAAK,IAAI,qBAAqB,CAAC;aACzE;YACD,OAAO,CAAC,CAAC;gBACP,OAAO,KAAK,IAAI,qBAAqB,CAAC;aACvC;SACF;IACH,CAAC;IAEM,OAAO;QACZ,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;IACjC,CAAC;;wHArEU,0BAA0B;4HAA1B,0BAA0B;4FAA1B,0BAA0B;kBADtC,UAAU","sourcesContent":["import { Injectable } from '@angular/core';\nimport { SkyMediaBreakpoints, SkyMediaQueryListener } from '@skyux/core';\n\nimport { BehaviorSubject, Subscription } from 'rxjs';\n\n/**\n * @internal\n */\n@Injectable()\nexport class SkyFlyoutMediaQueryService {\n public get current(): SkyMediaBreakpoints {\n return this._current;\n }\n\n private currentSubject = new BehaviorSubject<SkyMediaBreakpoints>(\n this.current\n );\n\n private _current = SkyMediaBreakpoints.xs;\n\n constructor() {\n this.currentSubject.next(this._current);\n }\n\n public subscribe(listener: SkyMediaQueryListener): Subscription {\n return this.currentSubject.subscribe({\n next: (breakpoints: SkyMediaBreakpoints) => {\n listener(breakpoints);\n },\n });\n }\n\n public setBreakpointForWidth(width: number): void {\n let breakpoint: SkyMediaBreakpoints;\n\n if (this.isWidthWithinBreakpiont(width, SkyMediaBreakpoints.xs)) {\n breakpoint = SkyMediaBreakpoints.xs;\n } else if (this.isWidthWithinBreakpiont(width, SkyMediaBreakpoints.sm)) {\n breakpoint = SkyMediaBreakpoints.sm;\n } else if (this.isWidthWithinBreakpiont(width, SkyMediaBreakpoints.md)) {\n breakpoint = SkyMediaBreakpoints.md;\n } else {\n breakpoint = SkyMediaBreakpoints.lg;\n }\n\n this._current = breakpoint;\n this.currentSubject.next(this._current);\n }\n\n public isWidthWithinBreakpiont(\n width: number,\n breakpoint: SkyMediaBreakpoints\n ): boolean {\n const xsBreakpointMaxPixels = 767;\n const smBreakpointMinPixels = 768;\n const smBreakpointMaxPixels = 991;\n const mdBreakpointMinPixels = 992;\n const mdBreakpointMaxPixels = 1199;\n const lgBreakpointMinPixels = 1200;\n\n switch (breakpoint) {\n case SkyMediaBreakpoints.xs: {\n return width <= xsBreakpointMaxPixels;\n }\n case SkyMediaBreakpoints.sm: {\n return width >= smBreakpointMinPixels && width <= smBreakpointMaxPixels;\n }\n case SkyMediaBreakpoints.md: {\n return width >= mdBreakpointMinPixels && width <= mdBreakpointMaxPixels;\n }\n default: {\n return width >= lgBreakpointMinPixels;\n }\n }\n }\n\n public destroy(): void {\n this.currentSubject.complete();\n }\n}\n"]}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { Component, ChangeDetectionStrategy, ChangeDetectorRef, ComponentFactoryResolver, ElementRef, HostListener, Injector, ViewChild, ViewContainerRef, NgZone, } from '@angular/core';
|
|
2
1
|
import { animate, state, style, transition, trigger, } from '@angular/animations';
|
|
3
|
-
import {
|
|
4
|
-
import { take, takeUntil, takeWhile } from 'rxjs/operators';
|
|
2
|
+
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ComponentFactoryResolver, ElementRef, HostListener, Injector, NgZone, ViewChild, ViewContainerRef, } from '@angular/core';
|
|
5
3
|
import { SkyMediaBreakpoints, SkyMediaQueryService, SkyUIConfigService, } from '@skyux/core';
|
|
6
4
|
import { SkyLibResourcesService } from '@skyux/i18n';
|
|
5
|
+
import { Subject, fromEvent } from 'rxjs';
|
|
6
|
+
import { take, takeUntil, takeWhile } from 'rxjs/operators';
|
|
7
7
|
import { SkyFlyoutAdapterService } from './flyout-adapter.service';
|
|
8
8
|
import { SkyFlyoutInstance } from './flyout-instance';
|
|
9
9
|
import { SkyFlyoutMediaQueryService } from './flyout-media-query.service';
|
|
10
|
-
import { SkyFlyoutMessageType } from './types/flyout-message-type';
|
|
11
10
|
import { SkyFlyoutBeforeCloseHandler } from './types/flyout-before-close-handler';
|
|
11
|
+
import { SkyFlyoutMessageType } from './types/flyout-message-type';
|
|
12
12
|
import * as i0 from "@angular/core";
|
|
13
13
|
import * as i1 from "./flyout-adapter.service";
|
|
14
14
|
import * as i2 from "@skyux/i18n";
|
|
@@ -79,7 +79,7 @@ export class SkyFlyoutComponent {
|
|
|
79
79
|
return this.getString('skyux_flyout_permalink_button');
|
|
80
80
|
}
|
|
81
81
|
get primaryAction() {
|
|
82
|
-
|
|
82
|
+
const primaryAction = this.config.primaryAction;
|
|
83
83
|
if (primaryAction) {
|
|
84
84
|
return primaryAction;
|
|
85
85
|
}
|
|
@@ -386,6 +386,7 @@ export class SkyFlyoutComponent {
|
|
|
386
386
|
if (this.resizeKeyControlActive) {
|
|
387
387
|
this.resizeKeyControlActive = false;
|
|
388
388
|
}
|
|
389
|
+
break;
|
|
389
390
|
case 'left':
|
|
390
391
|
if (this.resizeKeyControlActive) {
|
|
391
392
|
/* istanbul ignore else */
|