@genesislcap/foundation-ui 14.214.0 → 14.214.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -819,87 +819,11 @@
819
819
  },
820
820
  {
821
821
  "kind": "javascript-module",
822
- "path": "src/_common/icons.ts",
823
- "declarations": [
824
- {
825
- "kind": "function",
826
- "name": "closeIcon",
827
- "parameters": [
828
- {
829
- "name": "slot",
830
- "default": "'start'"
831
- },
832
- {
833
- "name": "fill",
834
- "default": "'#879ba6'"
835
- }
836
- ]
837
- }
838
- ],
839
- "exports": [
840
- {
841
- "kind": "js",
842
- "name": "closeIcon",
843
- "declaration": {
844
- "name": "closeIcon",
845
- "module": "src/_common/icons.ts"
846
- }
847
- }
848
- ]
849
- },
850
- {
851
- "kind": "javascript-module",
852
- "path": "src/_common/index.ts",
853
- "declarations": [],
854
- "exports": [
855
- {
856
- "kind": "js",
857
- "name": "*",
858
- "declaration": {
859
- "name": "*",
860
- "package": "./icons"
861
- }
862
- }
863
- ]
864
- },
865
- {
866
- "kind": "javascript-module",
867
- "path": "src/_config/index.ts",
868
- "declarations": [],
869
- "exports": [
870
- {
871
- "kind": "js",
872
- "name": "*",
873
- "declaration": {
874
- "name": "*",
875
- "package": "./styles"
876
- }
877
- },
878
- {
879
- "kind": "js",
880
- "name": "*",
881
- "declaration": {
882
- "name": "*",
883
- "package": "./tokens"
884
- }
885
- },
886
- {
887
- "kind": "js",
888
- "name": "*",
889
- "declaration": {
890
- "name": "*",
891
- "package": "./values"
892
- }
893
- }
894
- ]
895
- },
896
- {
897
- "kind": "javascript-module",
898
- "path": "src/accordion/accordion.styles.ts",
822
+ "path": "src/accordion-item/accordion-item.styles.ts",
899
823
  "declarations": [
900
824
  {
901
825
  "kind": "function",
902
- "name": "foundationAccordionStyles",
826
+ "name": "foundationAccordionItemStyles",
903
827
  "return": {
904
828
  "type": {
905
829
  "text": "ElementStyles"
@@ -924,24 +848,24 @@
924
848
  "exports": [
925
849
  {
926
850
  "kind": "js",
927
- "name": "foundationAccordionStyles",
851
+ "name": "foundationAccordionItemStyles",
928
852
  "declaration": {
929
- "name": "foundationAccordionStyles",
930
- "module": "src/accordion/accordion.styles.ts"
853
+ "name": "foundationAccordionItemStyles",
854
+ "module": "src/accordion-item/accordion-item.styles.ts"
931
855
  }
932
856
  }
933
857
  ]
934
858
  },
935
859
  {
936
860
  "kind": "javascript-module",
937
- "path": "src/accordion/accordion.template.ts",
861
+ "path": "src/accordion-item/accordion-item.template.ts",
938
862
  "declarations": [
939
863
  {
940
864
  "kind": "function",
941
- "name": "foundationAccordionTemplate",
865
+ "name": "foundationAccordionItemTemplate",
942
866
  "return": {
943
867
  "type": {
944
- "text": "ViewTemplate<Accordion>"
868
+ "text": "ViewTemplate<AccordionItem>"
945
869
  }
946
870
  },
947
871
  "parameters": [
@@ -963,246 +887,64 @@
963
887
  "exports": [
964
888
  {
965
889
  "kind": "js",
966
- "name": "foundationAccordionTemplate",
890
+ "name": "foundationAccordionItemTemplate",
967
891
  "declaration": {
968
- "name": "foundationAccordionTemplate",
969
- "module": "src/accordion/accordion.template.ts"
892
+ "name": "foundationAccordionItemTemplate",
893
+ "module": "src/accordion-item/accordion-item.template.ts"
970
894
  }
971
895
  }
972
896
  ]
973
897
  },
974
898
  {
975
899
  "kind": "javascript-module",
976
- "path": "src/accordion/accordion.ts",
900
+ "path": "src/accordion-item/accordion-item.ts",
977
901
  "declarations": [
978
902
  {
979
903
  "kind": "class",
980
904
  "description": "",
981
- "name": "Accordion",
905
+ "name": "AccordionItem",
982
906
  "superclass": {
983
- "name": "FASTAccordion",
984
- "package": "@microsoft/fast-foundation"
985
- },
986
- "tagName": "%%prefix%%-accordion",
987
- "customElement": true
988
- },
989
- {
990
- "kind": "variable",
991
- "name": "foundationAccordionShadowOptions",
992
- "type": {
993
- "text": "ShadowRootInit"
994
- },
995
- "default": "{\n delegatesFocus: true,\n mode: 'open',\n}"
996
- },
997
- {
998
- "kind": "variable",
999
- "name": "defaultAccordionConfig",
1000
- "type": {
1001
- "text": "object"
1002
- },
1003
- "default": "{}"
1004
- },
1005
- {
1006
- "kind": "variable",
1007
- "name": "foundationAccordion",
1008
- "description": "The Foundation Accordion",
1009
- "privacy": "public"
1010
- }
1011
- ],
1012
- "exports": [
1013
- {
1014
- "kind": "js",
1015
- "name": "Accordion",
1016
- "declaration": {
1017
- "name": "Accordion",
1018
- "module": "src/accordion/accordion.ts"
1019
- }
1020
- },
1021
- {
1022
- "kind": "js",
1023
- "name": "foundationAccordionShadowOptions",
1024
- "declaration": {
1025
- "name": "foundationAccordionShadowOptions",
1026
- "module": "src/accordion/accordion.ts"
1027
- }
1028
- },
1029
- {
1030
- "kind": "js",
1031
- "name": "defaultAccordionConfig",
1032
- "declaration": {
1033
- "name": "defaultAccordionConfig",
1034
- "module": "src/accordion/accordion.ts"
1035
- }
1036
- },
1037
- {
1038
- "kind": "js",
1039
- "name": "foundationAccordion",
1040
- "declaration": {
1041
- "name": "foundationAccordion",
1042
- "module": "src/accordion/accordion.ts"
1043
- }
1044
- }
1045
- ]
1046
- },
1047
- {
1048
- "kind": "javascript-module",
1049
- "path": "src/accordion/index.ts",
1050
- "declarations": [],
1051
- "exports": [
1052
- {
1053
- "kind": "js",
1054
- "name": "*",
1055
- "declaration": {
1056
- "name": "*",
1057
- "package": "./accordion.template"
1058
- }
1059
- },
1060
- {
1061
- "kind": "js",
1062
- "name": "*",
1063
- "declaration": {
1064
- "name": "*",
1065
- "package": "./accordion.styles"
1066
- }
1067
- },
1068
- {
1069
- "kind": "js",
1070
- "name": "*",
1071
- "declaration": {
1072
- "name": "*",
1073
- "package": "./accordion"
1074
- }
1075
- }
1076
- ]
1077
- },
1078
- {
1079
- "kind": "javascript-module",
1080
- "path": "src/accordion-item/accordion-item.styles.ts",
1081
- "declarations": [
1082
- {
1083
- "kind": "function",
1084
- "name": "foundationAccordionItemStyles",
1085
- "return": {
1086
- "type": {
1087
- "text": "ElementStyles"
1088
- }
907
+ "name": "FASTAccordionItem",
908
+ "package": "@microsoft/fast-components"
1089
909
  },
1090
- "parameters": [
910
+ "tagName": "%%prefix%%-accordion-item",
911
+ "customElement": true,
912
+ "attributes": [
1091
913
  {
1092
- "name": "context",
914
+ "name": "heading-level",
1093
915
  "type": {
1094
- "text": "ElementDefinitionContext"
916
+ "text": "1 | 2 | 3 | 4 | 5 | 6"
917
+ },
918
+ "default": "2",
919
+ "description": "Configures the https://www.w3.org/TR/wai-aria-1.1/#aria-level | level of the\nheading element.",
920
+ "fieldName": "headinglevel",
921
+ "inheritedFrom": {
922
+ "name": "AccordionItem",
923
+ "module": "src/accordion-item/accordion-item.ts"
1095
924
  }
1096
925
  },
1097
926
  {
1098
- "name": "definition",
1099
927
  "type": {
1100
- "text": "FoundationElementDefinition"
1101
- }
1102
- }
1103
- ]
1104
- }
1105
- ],
1106
- "exports": [
1107
- {
1108
- "kind": "js",
1109
- "name": "foundationAccordionItemStyles",
1110
- "declaration": {
1111
- "name": "foundationAccordionItemStyles",
1112
- "module": "src/accordion-item/accordion-item.styles.ts"
1113
- }
1114
- }
1115
- ]
1116
- },
1117
- {
1118
- "kind": "javascript-module",
1119
- "path": "src/accordion-item/accordion-item.template.ts",
1120
- "declarations": [
1121
- {
1122
- "kind": "function",
1123
- "name": "foundationAccordionItemTemplate",
1124
- "return": {
1125
- "type": {
1126
- "text": "ViewTemplate<AccordionItem>"
1127
- }
1128
- },
1129
- "parameters": [
1130
- {
1131
- "name": "context",
1132
- "type": {
1133
- "text": "ElementDefinitionContext"
1134
- }
1135
- },
1136
- {
1137
- "name": "definition",
1138
- "type": {
1139
- "text": "FoundationElementDefinition"
1140
- }
1141
- }
1142
- ]
1143
- }
1144
- ],
1145
- "exports": [
1146
- {
1147
- "kind": "js",
1148
- "name": "foundationAccordionItemTemplate",
1149
- "declaration": {
1150
- "name": "foundationAccordionItemTemplate",
1151
- "module": "src/accordion-item/accordion-item.template.ts"
1152
- }
1153
- }
1154
- ]
1155
- },
1156
- {
1157
- "kind": "javascript-module",
1158
- "path": "src/accordion-item/accordion-item.ts",
1159
- "declarations": [
1160
- {
1161
- "kind": "class",
1162
- "description": "",
1163
- "name": "AccordionItem",
1164
- "superclass": {
1165
- "name": "FASTAccordionItem",
1166
- "package": "@microsoft/fast-components"
1167
- },
1168
- "tagName": "%%prefix%%-accordion-item",
1169
- "customElement": true,
1170
- "attributes": [
1171
- {
1172
- "name": "heading-level",
1173
- "type": {
1174
- "text": "1 | 2 | 3 | 4 | 5 | 6"
1175
- },
1176
- "default": "2",
1177
- "description": "Configures the https://www.w3.org/TR/wai-aria-1.1/#aria-level | level of the\nheading element.",
1178
- "fieldName": "headinglevel",
1179
- "inheritedFrom": {
1180
- "name": "AccordionItem",
1181
- "module": "src/accordion-item/accordion-item.ts"
1182
- }
1183
- },
1184
- {
1185
- "type": {
1186
- "text": "boolean"
1187
- },
1188
- "default": "false",
1189
- "description": "Expands or collapses the item.",
1190
- "fieldName": "expanded",
1191
- "inheritedFrom": {
1192
- "name": "AccordionItem",
1193
- "module": "src/accordion-item/accordion-item.ts"
1194
- }
1195
- },
1196
- {
1197
- "name": "id",
1198
- "type": {
1199
- "text": "string"
1200
- },
1201
- "description": "The item ID",
1202
- "fieldName": "id",
1203
- "inheritedFrom": {
1204
- "name": "AccordionItem",
1205
- "module": "src/accordion-item/accordion-item.ts"
928
+ "text": "boolean"
929
+ },
930
+ "default": "false",
931
+ "description": "Expands or collapses the item.",
932
+ "fieldName": "expanded",
933
+ "inheritedFrom": {
934
+ "name": "AccordionItem",
935
+ "module": "src/accordion-item/accordion-item.ts"
936
+ }
937
+ },
938
+ {
939
+ "name": "id",
940
+ "type": {
941
+ "text": "string"
942
+ },
943
+ "description": "The item ID",
944
+ "fieldName": "id",
945
+ "inheritedFrom": {
946
+ "name": "AccordionItem",
947
+ "module": "src/accordion-item/accordion-item.ts"
1206
948
  }
1207
949
  }
1208
950
  ],
@@ -1471,11 +1213,11 @@
1471
1213
  },
1472
1214
  {
1473
1215
  "kind": "javascript-module",
1474
- "path": "src/actions-menu/actions-menu.styles.ts",
1216
+ "path": "src/accordion/accordion.styles.ts",
1475
1217
  "declarations": [
1476
1218
  {
1477
1219
  "kind": "function",
1478
- "name": "actionsMenuBaseStyles",
1220
+ "name": "foundationAccordionStyles",
1479
1221
  "return": {
1480
1222
  "type": {
1481
1223
  "text": "ElementStyles"
@@ -1495,13 +1237,29 @@
1495
1237
  }
1496
1238
  }
1497
1239
  ]
1498
- },
1240
+ }
1241
+ ],
1242
+ "exports": [
1243
+ {
1244
+ "kind": "js",
1245
+ "name": "foundationAccordionStyles",
1246
+ "declaration": {
1247
+ "name": "foundationAccordionStyles",
1248
+ "module": "src/accordion/accordion.styles.ts"
1249
+ }
1250
+ }
1251
+ ]
1252
+ },
1253
+ {
1254
+ "kind": "javascript-module",
1255
+ "path": "src/accordion/accordion.template.ts",
1256
+ "declarations": [
1499
1257
  {
1500
1258
  "kind": "function",
1501
- "name": "foundationActionsMenuStyles",
1259
+ "name": "foundationAccordionTemplate",
1502
1260
  "return": {
1503
1261
  "type": {
1504
- "text": "ElementStyles"
1262
+ "text": "ViewTemplate<Accordion>"
1505
1263
  }
1506
1264
  },
1507
1265
  "parameters": [
@@ -1523,101 +1281,343 @@
1523
1281
  "exports": [
1524
1282
  {
1525
1283
  "kind": "js",
1526
- "name": "actionsMenuBaseStyles",
1527
- "declaration": {
1528
- "name": "actionsMenuBaseStyles",
1529
- "module": "src/actions-menu/actions-menu.styles.ts"
1530
- }
1531
- },
1532
- {
1533
- "kind": "js",
1534
- "name": "foundationActionsMenuStyles",
1284
+ "name": "foundationAccordionTemplate",
1535
1285
  "declaration": {
1536
- "name": "foundationActionsMenuStyles",
1537
- "module": "src/actions-menu/actions-menu.styles.ts"
1286
+ "name": "foundationAccordionTemplate",
1287
+ "module": "src/accordion/accordion.template.ts"
1538
1288
  }
1539
1289
  }
1540
1290
  ]
1541
1291
  },
1542
1292
  {
1543
1293
  "kind": "javascript-module",
1544
- "path": "src/actions-menu/actions-menu.template.ts",
1294
+ "path": "src/accordion/accordion.ts",
1545
1295
  "declarations": [
1546
1296
  {
1547
- "kind": "function",
1548
- "name": "menuTemplate",
1549
- "parameters": [
1550
- {
1551
- "name": "prefix",
1552
- "type": {
1553
- "text": "string"
1554
- }
1555
- }
1556
- ]
1297
+ "kind": "class",
1298
+ "description": "",
1299
+ "name": "Accordion",
1300
+ "superclass": {
1301
+ "name": "FASTAccordion",
1302
+ "package": "@microsoft/fast-foundation"
1303
+ },
1304
+ "tagName": "%%prefix%%-accordion",
1305
+ "customElement": true
1557
1306
  },
1558
1307
  {
1559
- "kind": "function",
1560
- "name": "singleOptionTemplate",
1561
- "parameters": [
1562
- {
1563
- "name": "prefix",
1564
- "type": {
1565
- "text": "string"
1566
- }
1567
- }
1568
- ]
1308
+ "kind": "variable",
1309
+ "name": "foundationAccordionShadowOptions",
1310
+ "type": {
1311
+ "text": "ShadowRootInit"
1312
+ },
1313
+ "default": "{\n delegatesFocus: true,\n mode: 'open',\n}"
1569
1314
  },
1570
1315
  {
1571
1316
  "kind": "variable",
1572
- "name": "foundationActionsMenuTemplate",
1317
+ "name": "defaultAccordionConfig",
1573
1318
  "type": {
1574
- "text": "ViewTemplate<ActionsMenu>"
1319
+ "text": "object"
1575
1320
  },
1576
- "default": "html`\n <div\n class=\"actions-container${(x) => (x.isVertical ? ' actions-vertical' : '')}\"\n part=\"actions-container\"\n >\n ${(x) => x.getTemplate(getPrefix(x))}\n </div>\n`"
1321
+ "default": "{}"
1322
+ },
1323
+ {
1324
+ "kind": "variable",
1325
+ "name": "foundationAccordion",
1326
+ "description": "The Foundation Accordion",
1327
+ "privacy": "public"
1577
1328
  }
1578
1329
  ],
1579
1330
  "exports": [
1580
1331
  {
1581
1332
  "kind": "js",
1582
- "name": "menuTemplate",
1333
+ "name": "Accordion",
1583
1334
  "declaration": {
1584
- "name": "menuTemplate",
1585
- "module": "src/actions-menu/actions-menu.template.ts"
1335
+ "name": "Accordion",
1336
+ "module": "src/accordion/accordion.ts"
1586
1337
  }
1587
1338
  },
1588
1339
  {
1589
1340
  "kind": "js",
1590
- "name": "singleOptionTemplate",
1341
+ "name": "foundationAccordionShadowOptions",
1591
1342
  "declaration": {
1592
- "name": "singleOptionTemplate",
1593
- "module": "src/actions-menu/actions-menu.template.ts"
1343
+ "name": "foundationAccordionShadowOptions",
1344
+ "module": "src/accordion/accordion.ts"
1594
1345
  }
1595
1346
  },
1596
1347
  {
1597
1348
  "kind": "js",
1598
- "name": "foundationActionsMenuTemplate",
1349
+ "name": "defaultAccordionConfig",
1599
1350
  "declaration": {
1600
- "name": "foundationActionsMenuTemplate",
1601
- "module": "src/actions-menu/actions-menu.template.ts"
1351
+ "name": "defaultAccordionConfig",
1352
+ "module": "src/accordion/accordion.ts"
1353
+ }
1354
+ },
1355
+ {
1356
+ "kind": "js",
1357
+ "name": "foundationAccordion",
1358
+ "declaration": {
1359
+ "name": "foundationAccordion",
1360
+ "module": "src/accordion/accordion.ts"
1602
1361
  }
1603
1362
  }
1604
1363
  ]
1605
1364
  },
1606
1365
  {
1607
1366
  "kind": "javascript-module",
1608
- "path": "src/actions-menu/actions-menu.ts",
1367
+ "path": "src/accordion/index.ts",
1368
+ "declarations": [],
1369
+ "exports": [
1370
+ {
1371
+ "kind": "js",
1372
+ "name": "*",
1373
+ "declaration": {
1374
+ "name": "*",
1375
+ "package": "./accordion.template"
1376
+ }
1377
+ },
1378
+ {
1379
+ "kind": "js",
1380
+ "name": "*",
1381
+ "declaration": {
1382
+ "name": "*",
1383
+ "package": "./accordion.styles"
1384
+ }
1385
+ },
1386
+ {
1387
+ "kind": "js",
1388
+ "name": "*",
1389
+ "declaration": {
1390
+ "name": "*",
1391
+ "package": "./accordion"
1392
+ }
1393
+ }
1394
+ ]
1395
+ },
1396
+ {
1397
+ "kind": "javascript-module",
1398
+ "path": "src/_common/icons.ts",
1609
1399
  "declarations": [
1610
1400
  {
1611
- "kind": "class",
1612
- "description": "",
1613
- "name": "ActionsMenu",
1614
- "members": [
1401
+ "kind": "function",
1402
+ "name": "closeIcon",
1403
+ "parameters": [
1615
1404
  {
1616
- "kind": "field",
1617
- "name": "actions",
1618
- "type": {
1619
- "text": "ActionMenuItem[]"
1620
- }
1405
+ "name": "slot",
1406
+ "default": "'start'"
1407
+ },
1408
+ {
1409
+ "name": "fill",
1410
+ "default": "'#879ba6'"
1411
+ }
1412
+ ]
1413
+ }
1414
+ ],
1415
+ "exports": [
1416
+ {
1417
+ "kind": "js",
1418
+ "name": "closeIcon",
1419
+ "declaration": {
1420
+ "name": "closeIcon",
1421
+ "module": "src/_common/icons.ts"
1422
+ }
1423
+ }
1424
+ ]
1425
+ },
1426
+ {
1427
+ "kind": "javascript-module",
1428
+ "path": "src/_common/index.ts",
1429
+ "declarations": [],
1430
+ "exports": [
1431
+ {
1432
+ "kind": "js",
1433
+ "name": "*",
1434
+ "declaration": {
1435
+ "name": "*",
1436
+ "package": "./icons"
1437
+ }
1438
+ }
1439
+ ]
1440
+ },
1441
+ {
1442
+ "kind": "javascript-module",
1443
+ "path": "src/_config/index.ts",
1444
+ "declarations": [],
1445
+ "exports": [
1446
+ {
1447
+ "kind": "js",
1448
+ "name": "*",
1449
+ "declaration": {
1450
+ "name": "*",
1451
+ "package": "./styles"
1452
+ }
1453
+ },
1454
+ {
1455
+ "kind": "js",
1456
+ "name": "*",
1457
+ "declaration": {
1458
+ "name": "*",
1459
+ "package": "./tokens"
1460
+ }
1461
+ },
1462
+ {
1463
+ "kind": "js",
1464
+ "name": "*",
1465
+ "declaration": {
1466
+ "name": "*",
1467
+ "package": "./values"
1468
+ }
1469
+ }
1470
+ ]
1471
+ },
1472
+ {
1473
+ "kind": "javascript-module",
1474
+ "path": "src/actions-menu/actions-menu.styles.ts",
1475
+ "declarations": [
1476
+ {
1477
+ "kind": "function",
1478
+ "name": "actionsMenuBaseStyles",
1479
+ "return": {
1480
+ "type": {
1481
+ "text": "ElementStyles"
1482
+ }
1483
+ },
1484
+ "parameters": [
1485
+ {
1486
+ "name": "context",
1487
+ "type": {
1488
+ "text": "ElementDefinitionContext"
1489
+ }
1490
+ },
1491
+ {
1492
+ "name": "definition",
1493
+ "type": {
1494
+ "text": "FoundationElementDefinition"
1495
+ }
1496
+ }
1497
+ ]
1498
+ },
1499
+ {
1500
+ "kind": "function",
1501
+ "name": "foundationActionsMenuStyles",
1502
+ "return": {
1503
+ "type": {
1504
+ "text": "ElementStyles"
1505
+ }
1506
+ },
1507
+ "parameters": [
1508
+ {
1509
+ "name": "context",
1510
+ "type": {
1511
+ "text": "ElementDefinitionContext"
1512
+ }
1513
+ },
1514
+ {
1515
+ "name": "definition",
1516
+ "type": {
1517
+ "text": "FoundationElementDefinition"
1518
+ }
1519
+ }
1520
+ ]
1521
+ }
1522
+ ],
1523
+ "exports": [
1524
+ {
1525
+ "kind": "js",
1526
+ "name": "actionsMenuBaseStyles",
1527
+ "declaration": {
1528
+ "name": "actionsMenuBaseStyles",
1529
+ "module": "src/actions-menu/actions-menu.styles.ts"
1530
+ }
1531
+ },
1532
+ {
1533
+ "kind": "js",
1534
+ "name": "foundationActionsMenuStyles",
1535
+ "declaration": {
1536
+ "name": "foundationActionsMenuStyles",
1537
+ "module": "src/actions-menu/actions-menu.styles.ts"
1538
+ }
1539
+ }
1540
+ ]
1541
+ },
1542
+ {
1543
+ "kind": "javascript-module",
1544
+ "path": "src/actions-menu/actions-menu.template.ts",
1545
+ "declarations": [
1546
+ {
1547
+ "kind": "function",
1548
+ "name": "menuTemplate",
1549
+ "parameters": [
1550
+ {
1551
+ "name": "prefix",
1552
+ "type": {
1553
+ "text": "string"
1554
+ }
1555
+ }
1556
+ ]
1557
+ },
1558
+ {
1559
+ "kind": "function",
1560
+ "name": "singleOptionTemplate",
1561
+ "parameters": [
1562
+ {
1563
+ "name": "prefix",
1564
+ "type": {
1565
+ "text": "string"
1566
+ }
1567
+ }
1568
+ ]
1569
+ },
1570
+ {
1571
+ "kind": "variable",
1572
+ "name": "foundationActionsMenuTemplate",
1573
+ "type": {
1574
+ "text": "ViewTemplate<ActionsMenu>"
1575
+ },
1576
+ "default": "html`\n <div\n class=\"actions-container${(x) => (x.isVertical ? ' actions-vertical' : '')}\"\n part=\"actions-container\"\n >\n ${(x) => x.getTemplate(getPrefix(x))}\n </div>\n`"
1577
+ }
1578
+ ],
1579
+ "exports": [
1580
+ {
1581
+ "kind": "js",
1582
+ "name": "menuTemplate",
1583
+ "declaration": {
1584
+ "name": "menuTemplate",
1585
+ "module": "src/actions-menu/actions-menu.template.ts"
1586
+ }
1587
+ },
1588
+ {
1589
+ "kind": "js",
1590
+ "name": "singleOptionTemplate",
1591
+ "declaration": {
1592
+ "name": "singleOptionTemplate",
1593
+ "module": "src/actions-menu/actions-menu.template.ts"
1594
+ }
1595
+ },
1596
+ {
1597
+ "kind": "js",
1598
+ "name": "foundationActionsMenuTemplate",
1599
+ "declaration": {
1600
+ "name": "foundationActionsMenuTemplate",
1601
+ "module": "src/actions-menu/actions-menu.template.ts"
1602
+ }
1603
+ }
1604
+ ]
1605
+ },
1606
+ {
1607
+ "kind": "javascript-module",
1608
+ "path": "src/actions-menu/actions-menu.ts",
1609
+ "declarations": [
1610
+ {
1611
+ "kind": "class",
1612
+ "description": "",
1613
+ "name": "ActionsMenu",
1614
+ "members": [
1615
+ {
1616
+ "kind": "field",
1617
+ "name": "actions",
1618
+ "type": {
1619
+ "text": "ActionMenuItem[]"
1620
+ }
1621
1621
  },
1622
1622
  {
1623
1623
  "kind": "field",
@@ -18776,205 +18776,149 @@
18776
18776
  },
18777
18777
  {
18778
18778
  "kind": "javascript-module",
18779
- "path": "src/grid-layout/grid-layout.styles.ts",
18779
+ "path": "src/flyout/flyout.styles.ts",
18780
18780
  "declarations": [
18781
18781
  {
18782
18782
  "kind": "variable",
18783
- "name": "foundationGridLayoutStyles",
18783
+ "name": "flyoutAnimationTime",
18784
+ "type": {
18785
+ "text": "number"
18786
+ },
18787
+ "default": "225"
18788
+ },
18789
+ {
18790
+ "kind": "variable",
18791
+ "name": "foundationFlyoutStyles",
18784
18792
  "type": {
18785
18793
  "text": "ElementStyles"
18786
18794
  },
18787
- "default": "css`\n slot {\n width: 100%;\n height: 100%;\n display: grid;\n }\n\n ${gridLayoutRWDStyles()}\n ${gridLayoutRWDStyles('lg')}\n ${gridLayoutRWDStyles('md')}\n ${gridLayoutRWDStyles('sm')}\n`"
18795
+ "default": "css`\n /* Host */\n :host {\n display: inline-block;\n height: 100vh;\n position: absolute;\n width: 100vw;\n }\n\n :host([closed]) {\n display: none;\n }\n\n div.container {\n height: 100%;\n width: 100%;\n }\n\n /* flyout */\n div.flyout {\n background-color: white;\n color: black;\n height: 100%;\n position: absolute;\n /* stylelint-disable-next-line function-name-case */\n transition: transform ${flyoutAnimationTime.toString()}ms ease-in;\n width: 20%;\n z-index: 2001;\n }\n\n :host([position='left']) div.flyout {\n left: 0;\n transform: translateX(0%);\n }\n\n :host([position='right']) div.flyout {\n right: 0;\n transform: translateX(0%);\n }\n\n :host([visuallyhidden][position='left']) div.flyout {\n left: 0;\n transform: translateX(-100%);\n }\n\n :host([visuallyhidden][position='right']) div.flyout {\n right: 0;\n transform: translateX(100%);\n }\n\n div.header {\n align-items: center;\n display: flex;\n padding: calc(var(--design-unit) * 3px) calc(var(--design-unit) * 2px);\n }\n\n div.title {\n flex-grow: 1;\n }\n\n div.footer {\n bottom: 0;\n position: absolute;\n width: 100%;\n }\n\n /* Background */\n div.background {\n background-color: black;\n height: 100%;\n opacity: 50%;\n position: absolute;\n /* stylelint-disable-next-line function-name-case */\n transition: opacity ${flyoutAnimationTime.toString()}ms linear;\n width: 100%;\n z-index: 2000;\n }\n\n :host([visuallyhidden]) div.background {\n opacity: 0%;\n }\n`"
18788
18796
  }
18789
18797
  ],
18790
18798
  "exports": [
18791
18799
  {
18792
18800
  "kind": "js",
18793
- "name": "foundationGridLayoutStyles",
18801
+ "name": "flyoutAnimationTime",
18794
18802
  "declaration": {
18795
- "name": "foundationGridLayoutStyles",
18796
- "module": "src/grid-layout/grid-layout.styles.ts"
18803
+ "name": "flyoutAnimationTime",
18804
+ "module": "src/flyout/flyout.styles.ts"
18805
+ }
18806
+ },
18807
+ {
18808
+ "kind": "js",
18809
+ "name": "foundationFlyoutStyles",
18810
+ "declaration": {
18811
+ "name": "foundationFlyoutStyles",
18812
+ "module": "src/flyout/flyout.styles.ts"
18797
18813
  }
18798
18814
  }
18799
18815
  ]
18800
18816
  },
18801
18817
  {
18802
18818
  "kind": "javascript-module",
18803
- "path": "src/grid-layout/grid-layout.template.ts",
18819
+ "path": "src/flyout/flyout.template.ts",
18804
18820
  "declarations": [
18805
18821
  {
18806
- "kind": "variable",
18807
- "name": "foundationGridLayoutTemplate",
18808
- "type": {
18809
- "text": "ViewTemplate<GridLayout>"
18810
- },
18811
- "default": "html`\n <template>\n <slot></slot>\n </template>\n`"
18812
- }
18813
- ],
18814
- "exports": [
18815
- {
18822
+ "kind": "function",
18823
+ "name": "getPrefixedFlyout",
18824
+ "parameters": [
18825
+ {
18826
+ "name": "prefix",
18827
+ "type": {
18828
+ "text": "string"
18829
+ }
18830
+ }
18831
+ ]
18832
+ },
18833
+ {
18834
+ "kind": "variable",
18835
+ "name": "foundationFlyoutTemplate",
18836
+ "default": "html<Flyout>`\n ${(x) => getPrefixedFlyout(getPrefix(x))}\n`"
18837
+ }
18838
+ ],
18839
+ "exports": [
18840
+ {
18816
18841
  "kind": "js",
18817
- "name": "foundationGridLayoutTemplate",
18842
+ "name": "getPrefixedFlyout",
18818
18843
  "declaration": {
18819
- "name": "foundationGridLayoutTemplate",
18820
- "module": "src/grid-layout/grid-layout.template.ts"
18844
+ "name": "getPrefixedFlyout",
18845
+ "module": "src/flyout/flyout.template.ts"
18846
+ }
18847
+ },
18848
+ {
18849
+ "kind": "js",
18850
+ "name": "foundationFlyoutTemplate",
18851
+ "declaration": {
18852
+ "name": "foundationFlyoutTemplate",
18853
+ "module": "src/flyout/flyout.template.ts"
18821
18854
  }
18822
18855
  }
18823
18856
  ]
18824
18857
  },
18825
18858
  {
18826
18859
  "kind": "javascript-module",
18827
- "path": "src/grid-layout/grid-layout.ts",
18860
+ "path": "src/flyout/flyout.ts",
18828
18861
  "declarations": [
18829
- {
18830
- "kind": "variable",
18831
- "name": "foundationGridLayoutShadowOptions",
18832
- "type": {
18833
- "text": "ShadowRootInit"
18834
- },
18835
- "default": "undefined"
18836
- },
18837
- {
18838
- "kind": "variable",
18839
- "name": "defaultGridLayoutConfig",
18840
- "type": {
18841
- "text": "object"
18842
- },
18843
- "default": "{}"
18844
- },
18845
18862
  {
18846
18863
  "kind": "class",
18847
18864
  "description": "",
18848
- "name": "GridLayout",
18865
+ "name": "Flyout",
18849
18866
  "members": [
18850
18867
  {
18851
18868
  "kind": "field",
18852
- "name": "['col-count']",
18853
- "type": {
18854
- "text": "string"
18855
- }
18856
- },
18857
- {
18858
- "kind": "field",
18859
- "name": "['col-width']",
18860
- "type": {
18861
- "text": "string"
18862
- }
18863
- },
18864
- {
18865
- "kind": "field",
18866
- "name": "['col-lg-count']",
18867
- "type": {
18868
- "text": "string"
18869
- }
18870
- },
18871
- {
18872
- "kind": "field",
18873
- "name": "['col-lg-width']",
18874
- "type": {
18875
- "text": "string"
18876
- }
18877
- },
18878
- {
18879
- "kind": "field",
18880
- "name": "['col-md-count']",
18881
- "type": {
18882
- "text": "string"
18883
- }
18884
- },
18885
- {
18886
- "kind": "field",
18887
- "name": "['col-md-width']",
18888
- "type": {
18889
- "text": "string"
18890
- }
18891
- },
18892
- {
18893
- "kind": "field",
18894
- "name": "['col-sm-count']",
18895
- "type": {
18896
- "text": "string"
18897
- }
18898
- },
18899
- {
18900
- "kind": "field",
18901
- "name": "['col-sm-width']",
18902
- "type": {
18903
- "text": "string"
18904
- }
18905
- },
18906
- {
18907
- "kind": "field",
18908
- "name": "['row-count']",
18909
- "type": {
18910
- "text": "string"
18911
- }
18912
- },
18913
- {
18914
- "kind": "field",
18915
- "name": "['row-height']",
18869
+ "name": "exit",
18916
18870
  "type": {
18917
- "text": "string"
18918
- }
18871
+ "text": "HTMLDivElement"
18872
+ },
18873
+ "privacy": "public"
18919
18874
  },
18920
18875
  {
18921
18876
  "kind": "field",
18922
- "name": "['row-lg-count']",
18877
+ "name": "position",
18923
18878
  "type": {
18924
18879
  "text": "string"
18925
- }
18880
+ },
18881
+ "default": "'right'"
18926
18882
  },
18927
18883
  {
18928
18884
  "kind": "field",
18929
- "name": "['row-lg-height']",
18885
+ "name": "displayHeader",
18930
18886
  "type": {
18931
- "text": "string"
18932
- }
18887
+ "text": "boolean"
18888
+ },
18889
+ "default": "true"
18933
18890
  },
18934
18891
  {
18935
18892
  "kind": "field",
18936
- "name": "['row-md-count']",
18893
+ "name": "closed",
18937
18894
  "type": {
18938
- "text": "string"
18939
- }
18895
+ "text": "boolean"
18896
+ },
18897
+ "default": "true"
18940
18898
  },
18941
18899
  {
18942
- "kind": "field",
18943
- "name": "['row-md-height']",
18944
- "type": {
18945
- "text": "string"
18946
- }
18900
+ "kind": "method",
18901
+ "name": "closedChanged"
18947
18902
  },
18948
18903
  {
18949
18904
  "kind": "field",
18950
- "name": "['row-sm-count']",
18905
+ "name": "visuallyhidden",
18951
18906
  "type": {
18952
- "text": "string"
18953
- }
18907
+ "text": "boolean"
18908
+ },
18909
+ "default": "true"
18954
18910
  },
18955
18911
  {
18956
- "kind": "field",
18957
- "name": "['row-sm-height']",
18958
- "type": {
18959
- "text": "string"
18960
- }
18912
+ "kind": "method",
18913
+ "name": "closeFlyout"
18961
18914
  },
18962
18915
  {
18963
- "kind": "field",
18964
- "name": "behaviors",
18965
- "type": {
18966
- "text": "Behavior[]"
18967
- },
18968
- "privacy": "private",
18969
- "default": "[]"
18916
+ "kind": "method",
18917
+ "name": "closingFinished"
18970
18918
  },
18971
18919
  {
18972
- "kind": "field",
18973
- "name": "baseStyles",
18974
- "type": {
18975
- "text": "ElementStyles"
18976
- },
18977
- "privacy": "private"
18920
+ "kind": "method",
18921
+ "name": "focusExit"
18978
18922
  },
18979
18923
  {
18980
18924
  "kind": "field",
@@ -19090,176 +19034,103 @@
19090
19034
  ],
19091
19035
  "attributes": [
19092
19036
  {
19093
- "name": "['col-count']",
19094
- "type": {
19095
- "text": "string"
19096
- },
19097
- "fieldName": "['col-count']"
19098
- },
19099
- {
19100
- "name": "['col-width']",
19101
- "type": {
19102
- "text": "string"
19103
- },
19104
- "fieldName": "['col-width']"
19105
- },
19106
- {
19107
- "name": "['col-lg-count']",
19108
- "type": {
19109
- "text": "string"
19110
- },
19111
- "fieldName": "['col-lg-count']"
19112
- },
19113
- {
19114
- "name": "['col-lg-width']",
19115
- "type": {
19116
- "text": "string"
19117
- },
19118
- "fieldName": "['col-lg-width']"
19119
- },
19120
- {
19121
- "name": "['col-md-count']",
19122
- "type": {
19123
- "text": "string"
19124
- },
19125
- "fieldName": "['col-md-count']"
19126
- },
19127
- {
19128
- "name": "['col-md-width']",
19129
- "type": {
19130
- "text": "string"
19131
- },
19132
- "fieldName": "['col-md-width']"
19133
- },
19134
- {
19135
- "name": "['col-sm-count']",
19136
- "type": {
19137
- "text": "string"
19138
- },
19139
- "fieldName": "['col-sm-count']"
19140
- },
19141
- {
19142
- "name": "['col-sm-width']",
19143
- "type": {
19144
- "text": "string"
19145
- },
19146
- "fieldName": "['col-sm-width']"
19147
- },
19148
- {
19149
- "name": "['row-count']",
19037
+ "name": "position",
19150
19038
  "type": {
19151
19039
  "text": "string"
19152
19040
  },
19153
- "fieldName": "['row-count']"
19041
+ "default": "'right'",
19042
+ "fieldName": "position"
19154
19043
  },
19155
19044
  {
19156
- "name": "['row-height']",
19157
19045
  "type": {
19158
- "text": "string"
19046
+ "text": "boolean"
19159
19047
  },
19160
- "fieldName": "['row-height']"
19048
+ "default": "true",
19049
+ "fieldName": "displayHeader"
19161
19050
  },
19162
19051
  {
19163
- "name": "['row-lg-count']",
19164
19052
  "type": {
19165
- "text": "string"
19053
+ "text": "boolean"
19166
19054
  },
19167
- "fieldName": "['row-lg-count']"
19055
+ "default": "true",
19056
+ "fieldName": "closed"
19168
19057
  },
19169
19058
  {
19170
- "name": "['row-lg-height']",
19171
19059
  "type": {
19172
- "text": "string"
19060
+ "text": "boolean"
19173
19061
  },
19174
- "fieldName": "['row-lg-height']"
19175
- },
19176
- {
19177
- "name": "['row-md-count']",
19178
- "type": {
19179
- "text": "string"
19180
- },
19181
- "fieldName": "['row-md-count']"
19182
- },
19183
- {
19184
- "name": "['row-md-height']",
19185
- "type": {
19186
- "text": "string"
19187
- },
19188
- "fieldName": "['row-md-height']"
19189
- },
19190
- {
19191
- "name": "['row-sm-count']",
19192
- "type": {
19193
- "text": "string"
19194
- },
19195
- "fieldName": "['row-sm-count']"
19196
- },
19197
- {
19198
- "name": "['row-sm-height']",
19199
- "type": {
19200
- "text": "string"
19201
- },
19202
- "fieldName": "['row-sm-height']"
19062
+ "default": "true",
19063
+ "fieldName": "visuallyhidden"
19203
19064
  }
19204
19065
  ],
19205
19066
  "superclass": {
19206
19067
  "name": "FoundationElement",
19207
19068
  "package": "@microsoft/fast-foundation"
19208
19069
  },
19209
- "tagName": "%%prefix%%-grid-layout",
19070
+ "tagName": "%%prefix%%-flyout",
19210
19071
  "customElement": true
19211
19072
  },
19212
19073
  {
19213
19074
  "kind": "variable",
19214
- "name": "foundationGridLayout",
19215
- "description": "The Foundation Grid Layout",
19075
+ "name": "foundationFlyoutShadowOptions",
19076
+ "type": {
19077
+ "text": "ShadowRootInit"
19078
+ },
19079
+ "default": "undefined"
19080
+ },
19081
+ {
19082
+ "kind": "variable",
19083
+ "name": "defaultFlyoutConfig",
19084
+ "type": {
19085
+ "text": "object"
19086
+ },
19087
+ "default": "{}"
19088
+ },
19089
+ {
19090
+ "kind": "variable",
19091
+ "name": "foundationFlyout",
19092
+ "description": "The Foundation Flyout",
19216
19093
  "privacy": "public"
19217
19094
  }
19218
19095
  ],
19219
19096
  "exports": [
19220
19097
  {
19221
19098
  "kind": "js",
19222
- "name": "foundationGridLayoutShadowOptions",
19099
+ "name": "Flyout",
19223
19100
  "declaration": {
19224
- "name": "foundationGridLayoutShadowOptions",
19225
- "module": "src/grid-layout/grid-layout.ts"
19101
+ "name": "Flyout",
19102
+ "module": "src/flyout/flyout.ts"
19226
19103
  }
19227
19104
  },
19228
19105
  {
19229
19106
  "kind": "js",
19230
- "name": "defaultGridLayoutConfig",
19107
+ "name": "foundationFlyoutShadowOptions",
19231
19108
  "declaration": {
19232
- "name": "defaultGridLayoutConfig",
19233
- "module": "src/grid-layout/grid-layout.ts"
19109
+ "name": "foundationFlyoutShadowOptions",
19110
+ "module": "src/flyout/flyout.ts"
19234
19111
  }
19235
19112
  },
19236
19113
  {
19237
19114
  "kind": "js",
19238
- "name": "GridLayout",
19115
+ "name": "defaultFlyoutConfig",
19239
19116
  "declaration": {
19240
- "name": "GridLayout",
19241
- "module": "src/grid-layout/grid-layout.ts"
19117
+ "name": "defaultFlyoutConfig",
19118
+ "module": "src/flyout/flyout.ts"
19242
19119
  }
19243
19120
  },
19244
19121
  {
19245
19122
  "kind": "js",
19246
- "name": "foundationGridLayout",
19123
+ "name": "foundationFlyout",
19247
19124
  "declaration": {
19248
- "name": "foundationGridLayout",
19249
- "module": "src/grid-layout/grid-layout.ts"
19125
+ "name": "foundationFlyout",
19126
+ "module": "src/flyout/flyout.ts"
19250
19127
  }
19251
19128
  }
19252
19129
  ]
19253
19130
  },
19254
19131
  {
19255
19132
  "kind": "javascript-module",
19256
- "path": "src/grid-layout/grid-layout.types.ts",
19257
- "declarations": [],
19258
- "exports": []
19259
- },
19260
- {
19261
- "kind": "javascript-module",
19262
- "path": "src/grid-layout/index.ts",
19133
+ "path": "src/flyout/index.ts",
19263
19134
  "declarations": [],
19264
19135
  "exports": [
19265
19136
  {
@@ -19267,7 +19138,7 @@
19267
19138
  "name": "*",
19268
19139
  "declaration": {
19269
19140
  "name": "*",
19270
- "package": "./grid-layout.template"
19141
+ "package": "./flyout"
19271
19142
  }
19272
19143
  },
19273
19144
  {
@@ -19275,7 +19146,7 @@
19275
19146
  "name": "*",
19276
19147
  "declaration": {
19277
19148
  "name": "*",
19278
- "package": "./grid-layout.styles"
19149
+ "package": "./flyout.template"
19279
19150
  }
19280
19151
  },
19281
19152
  {
@@ -19283,50 +19154,66 @@
19283
19154
  "name": "*",
19284
19155
  "declaration": {
19285
19156
  "name": "*",
19286
- "package": "./grid-layout"
19157
+ "package": "./flyout.styles"
19287
19158
  }
19288
- },
19159
+ }
19160
+ ]
19161
+ },
19162
+ {
19163
+ "kind": "javascript-module",
19164
+ "path": "src/grid-layout/grid-layout.styles.ts",
19165
+ "declarations": [
19166
+ {
19167
+ "kind": "variable",
19168
+ "name": "foundationGridLayoutStyles",
19169
+ "type": {
19170
+ "text": "ElementStyles"
19171
+ },
19172
+ "default": "css`\n slot {\n width: 100%;\n height: 100%;\n display: grid;\n }\n\n ${gridLayoutRWDStyles()}\n ${gridLayoutRWDStyles('lg')}\n ${gridLayoutRWDStyles('md')}\n ${gridLayoutRWDStyles('sm')}\n`"
19173
+ }
19174
+ ],
19175
+ "exports": [
19289
19176
  {
19290
19177
  "kind": "js",
19291
- "name": "*",
19178
+ "name": "foundationGridLayoutStyles",
19292
19179
  "declaration": {
19293
- "name": "*",
19294
- "package": "./grid-layout.types"
19180
+ "name": "foundationGridLayoutStyles",
19181
+ "module": "src/grid-layout/grid-layout.styles.ts"
19295
19182
  }
19296
19183
  }
19297
19184
  ]
19298
19185
  },
19299
19186
  {
19300
19187
  "kind": "javascript-module",
19301
- "path": "src/grid-layout-item/grid-layout-item.template.ts",
19188
+ "path": "src/grid-layout/grid-layout.template.ts",
19302
19189
  "declarations": [
19303
19190
  {
19304
19191
  "kind": "variable",
19305
- "name": "foundationGridLayoutItemTemplate",
19192
+ "name": "foundationGridLayoutTemplate",
19306
19193
  "type": {
19307
- "text": "ViewTemplate<GridLayoutItem>"
19194
+ "text": "ViewTemplate<GridLayout>"
19308
19195
  },
19309
- "default": "html`\n <template>\n <style>\n :host {\n width: 100%;\n height: 100%;\n ${(x) => x.setGridItemProperties(x.colNumber, x.rowNumber, x.width, x.height)}\n }\n\n @media only screen and (min-width: 1025px) {\n :host {\n ${(x) => x.setGridItemProperties(x.colLgNumber, x.rowLgNumber, x.widthLg, x.heightLg)}\n }\n }\n\n @media only screen and (min-width: 641px) and (max-width: 1024px) {\n :host {\n ${(x) => x.setGridItemProperties(x.colMdNumber, x.rowMdNumber, x.widthSm, x.heightMd)}\n }\n }\n\n @media only screen and (max-width: 640px) {\n :host {\n ${(x) => x.setGridItemProperties(x.colSmNumber, x.rowSmNumber, x.widthSm, x.heightSm)}\n }\n }\n </style>\n <slot></slot>\n </template>\n`"
19196
+ "default": "html`\n <template>\n <slot></slot>\n </template>\n`"
19310
19197
  }
19311
19198
  ],
19312
19199
  "exports": [
19313
19200
  {
19314
19201
  "kind": "js",
19315
- "name": "foundationGridLayoutItemTemplate",
19202
+ "name": "foundationGridLayoutTemplate",
19316
19203
  "declaration": {
19317
- "name": "foundationGridLayoutItemTemplate",
19318
- "module": "src/grid-layout-item/grid-layout-item.template.ts"
19204
+ "name": "foundationGridLayoutTemplate",
19205
+ "module": "src/grid-layout/grid-layout.template.ts"
19319
19206
  }
19320
19207
  }
19321
19208
  ]
19322
19209
  },
19323
19210
  {
19324
19211
  "kind": "javascript-module",
19325
- "path": "src/grid-layout-item/grid-layout-item.ts",
19212
+ "path": "src/grid-layout/grid-layout.ts",
19326
19213
  "declarations": [
19327
19214
  {
19328
19215
  "kind": "variable",
19329
- "name": "foundationGridLayoutItemShadowOptions",
19216
+ "name": "foundationGridLayoutShadowOptions",
19330
19217
  "type": {
19331
19218
  "text": "ShadowRootInit"
19332
19219
  },
@@ -19334,7 +19221,7 @@
19334
19221
  },
19335
19222
  {
19336
19223
  "kind": "variable",
19337
- "name": "defaultGridLayoutItemConfig",
19224
+ "name": "defaultGridLayoutConfig",
19338
19225
  "type": {
19339
19226
  "text": "object"
19340
19227
  },
@@ -19343,137 +19230,136 @@
19343
19230
  {
19344
19231
  "kind": "class",
19345
19232
  "description": "",
19346
- "name": "GridLayoutItem",
19233
+ "name": "GridLayout",
19347
19234
  "members": [
19348
19235
  {
19349
19236
  "kind": "field",
19350
- "name": "colNumber",
19237
+ "name": "['col-count']",
19351
19238
  "type": {
19352
- "text": "number"
19239
+ "text": "string"
19353
19240
  }
19354
19241
  },
19355
19242
  {
19356
19243
  "kind": "field",
19357
- "name": "colSmNumber",
19244
+ "name": "['col-width']",
19358
19245
  "type": {
19359
- "text": "number"
19246
+ "text": "string"
19360
19247
  }
19361
19248
  },
19362
19249
  {
19363
19250
  "kind": "field",
19364
- "name": "colMdNumber",
19251
+ "name": "['col-lg-count']",
19365
19252
  "type": {
19366
- "text": "number"
19253
+ "text": "string"
19367
19254
  }
19368
19255
  },
19369
19256
  {
19370
19257
  "kind": "field",
19371
- "name": "colLgNumber",
19258
+ "name": "['col-lg-width']",
19372
19259
  "type": {
19373
- "text": "number"
19260
+ "text": "string"
19374
19261
  }
19375
19262
  },
19376
19263
  {
19377
19264
  "kind": "field",
19378
- "name": "rowNumber",
19265
+ "name": "['col-md-count']",
19379
19266
  "type": {
19380
- "text": "number"
19267
+ "text": "string"
19381
19268
  }
19382
19269
  },
19383
19270
  {
19384
19271
  "kind": "field",
19385
- "name": "rowSmNumber",
19272
+ "name": "['col-md-width']",
19386
19273
  "type": {
19387
- "text": "number"
19274
+ "text": "string"
19388
19275
  }
19389
19276
  },
19390
19277
  {
19391
19278
  "kind": "field",
19392
- "name": "rowMdNumber",
19279
+ "name": "['col-sm-count']",
19393
19280
  "type": {
19394
- "text": "number"
19281
+ "text": "string"
19395
19282
  }
19396
19283
  },
19397
19284
  {
19398
19285
  "kind": "field",
19399
- "name": "rowLgNumber",
19286
+ "name": "['col-sm-width']",
19400
19287
  "type": {
19401
- "text": "number"
19288
+ "text": "string"
19402
19289
  }
19403
19290
  },
19404
19291
  {
19405
19292
  "kind": "field",
19406
- "name": "width",
19293
+ "name": "['row-count']",
19407
19294
  "type": {
19408
- "text": "number"
19295
+ "text": "string"
19409
19296
  }
19410
19297
  },
19411
19298
  {
19412
19299
  "kind": "field",
19413
- "name": "widthSm",
19300
+ "name": "['row-height']",
19414
19301
  "type": {
19415
- "text": "number"
19302
+ "text": "string"
19416
19303
  }
19417
19304
  },
19418
19305
  {
19419
19306
  "kind": "field",
19420
- "name": "widthMd",
19307
+ "name": "['row-lg-count']",
19421
19308
  "type": {
19422
- "text": "number"
19309
+ "text": "string"
19423
19310
  }
19424
19311
  },
19425
19312
  {
19426
19313
  "kind": "field",
19427
- "name": "widthLg",
19314
+ "name": "['row-lg-height']",
19428
19315
  "type": {
19429
- "text": "number"
19316
+ "text": "string"
19430
19317
  }
19431
19318
  },
19432
19319
  {
19433
19320
  "kind": "field",
19434
- "name": "height",
19321
+ "name": "['row-md-count']",
19435
19322
  "type": {
19436
- "text": "number"
19323
+ "text": "string"
19437
19324
  }
19438
19325
  },
19439
19326
  {
19440
19327
  "kind": "field",
19441
- "name": "heightSm",
19328
+ "name": "['row-md-height']",
19442
19329
  "type": {
19443
- "text": "number"
19330
+ "text": "string"
19444
19331
  }
19445
19332
  },
19446
19333
  {
19447
19334
  "kind": "field",
19448
- "name": "heightMd",
19335
+ "name": "['row-sm-count']",
19449
19336
  "type": {
19450
- "text": "number"
19337
+ "text": "string"
19451
19338
  }
19452
19339
  },
19453
19340
  {
19454
19341
  "kind": "field",
19455
- "name": "heightLg",
19342
+ "name": "['row-sm-height']",
19456
19343
  "type": {
19457
- "text": "number"
19344
+ "text": "string"
19458
19345
  }
19459
19346
  },
19460
19347
  {
19461
- "kind": "method",
19462
- "name": "setGridItemProperties",
19463
- "parameters": [
19464
- {
19465
- "name": "column"
19466
- },
19467
- {
19468
- "name": "row"
19469
- },
19470
- {
19471
- "name": "width"
19472
- },
19473
- {
19474
- "name": "height"
19475
- }
19476
- ]
19348
+ "kind": "field",
19349
+ "name": "behaviors",
19350
+ "type": {
19351
+ "text": "Behavior[]"
19352
+ },
19353
+ "privacy": "private",
19354
+ "default": "[]"
19355
+ },
19356
+ {
19357
+ "kind": "field",
19358
+ "name": "baseStyles",
19359
+ "type": {
19360
+ "text": "ElementStyles"
19361
+ },
19362
+ "privacy": "private"
19477
19363
  },
19478
19364
  {
19479
19365
  "kind": "field",
@@ -19589,170 +19475,176 @@
19589
19475
  ],
19590
19476
  "attributes": [
19591
19477
  {
19592
- "name": "col-number",
19478
+ "name": "['col-count']",
19593
19479
  "type": {
19594
- "text": "number"
19480
+ "text": "string"
19595
19481
  },
19596
- "fieldName": "colNumber"
19482
+ "fieldName": "['col-count']"
19597
19483
  },
19598
19484
  {
19599
- "name": "col-sm-number",
19485
+ "name": "['col-width']",
19600
19486
  "type": {
19601
- "text": "number"
19487
+ "text": "string"
19602
19488
  },
19603
- "fieldName": "colSmNumber"
19489
+ "fieldName": "['col-width']"
19604
19490
  },
19605
19491
  {
19606
- "name": "col-md-number",
19492
+ "name": "['col-lg-count']",
19607
19493
  "type": {
19608
- "text": "number"
19494
+ "text": "string"
19609
19495
  },
19610
- "fieldName": "colMdNumber"
19496
+ "fieldName": "['col-lg-count']"
19611
19497
  },
19612
19498
  {
19613
- "name": "col-lg-number",
19499
+ "name": "['col-lg-width']",
19614
19500
  "type": {
19615
- "text": "number"
19501
+ "text": "string"
19616
19502
  },
19617
- "fieldName": "colLgNumber"
19503
+ "fieldName": "['col-lg-width']"
19618
19504
  },
19619
19505
  {
19620
- "name": "row-number",
19506
+ "name": "['col-md-count']",
19621
19507
  "type": {
19622
- "text": "number"
19508
+ "text": "string"
19623
19509
  },
19624
- "fieldName": "rowNumber"
19510
+ "fieldName": "['col-md-count']"
19625
19511
  },
19626
19512
  {
19627
- "name": "row-sm-number",
19513
+ "name": "['col-md-width']",
19628
19514
  "type": {
19629
- "text": "number"
19515
+ "text": "string"
19630
19516
  },
19631
- "fieldName": "rowSmNumber"
19517
+ "fieldName": "['col-md-width']"
19632
19518
  },
19633
19519
  {
19634
- "name": "row-md-number",
19520
+ "name": "['col-sm-count']",
19635
19521
  "type": {
19636
- "text": "number"
19522
+ "text": "string"
19637
19523
  },
19638
- "fieldName": "rowMdNumber"
19524
+ "fieldName": "['col-sm-count']"
19639
19525
  },
19640
19526
  {
19641
- "name": "row-lg-number",
19527
+ "name": "['col-sm-width']",
19642
19528
  "type": {
19643
- "text": "number"
19529
+ "text": "string"
19644
19530
  },
19645
- "fieldName": "rowLgNumber"
19531
+ "fieldName": "['col-sm-width']"
19646
19532
  },
19647
19533
  {
19648
- "name": "width",
19534
+ "name": "['row-count']",
19649
19535
  "type": {
19650
- "text": "number"
19536
+ "text": "string"
19651
19537
  },
19652
- "fieldName": "width"
19538
+ "fieldName": "['row-count']"
19653
19539
  },
19654
19540
  {
19655
- "name": "width-sm",
19541
+ "name": "['row-height']",
19656
19542
  "type": {
19657
- "text": "number"
19543
+ "text": "string"
19658
19544
  },
19659
- "fieldName": "widthSm"
19545
+ "fieldName": "['row-height']"
19660
19546
  },
19661
19547
  {
19662
- "name": "width-md",
19548
+ "name": "['row-lg-count']",
19663
19549
  "type": {
19664
- "text": "number"
19550
+ "text": "string"
19665
19551
  },
19666
- "fieldName": "widthMd"
19552
+ "fieldName": "['row-lg-count']"
19667
19553
  },
19668
19554
  {
19669
- "name": "width-lg",
19555
+ "name": "['row-lg-height']",
19670
19556
  "type": {
19671
- "text": "number"
19557
+ "text": "string"
19672
19558
  },
19673
- "fieldName": "widthLg"
19559
+ "fieldName": "['row-lg-height']"
19674
19560
  },
19675
19561
  {
19676
- "name": "height",
19562
+ "name": "['row-md-count']",
19677
19563
  "type": {
19678
- "text": "number"
19564
+ "text": "string"
19679
19565
  },
19680
- "fieldName": "height"
19566
+ "fieldName": "['row-md-count']"
19681
19567
  },
19682
19568
  {
19683
- "name": "height-sm",
19569
+ "name": "['row-md-height']",
19684
19570
  "type": {
19685
- "text": "number"
19571
+ "text": "string"
19686
19572
  },
19687
- "fieldName": "heightSm"
19573
+ "fieldName": "['row-md-height']"
19688
19574
  },
19689
19575
  {
19690
- "name": "height-md",
19576
+ "name": "['row-sm-count']",
19691
19577
  "type": {
19692
- "text": "number"
19578
+ "text": "string"
19693
19579
  },
19694
- "fieldName": "heightMd"
19580
+ "fieldName": "['row-sm-count']"
19695
19581
  },
19696
19582
  {
19697
- "name": "height-lg",
19583
+ "name": "['row-sm-height']",
19698
19584
  "type": {
19699
- "text": "number"
19585
+ "text": "string"
19700
19586
  },
19701
- "fieldName": "heightLg"
19587
+ "fieldName": "['row-sm-height']"
19702
19588
  }
19703
19589
  ],
19704
19590
  "superclass": {
19705
19591
  "name": "FoundationElement",
19706
19592
  "package": "@microsoft/fast-foundation"
19707
19593
  },
19708
- "tagName": "%%prefix%%-grid-layout-item",
19594
+ "tagName": "%%prefix%%-grid-layout",
19709
19595
  "customElement": true
19710
19596
  },
19711
19597
  {
19712
19598
  "kind": "variable",
19713
- "name": "foundationGridLayoutItem",
19714
- "description": "The Foundation Grid Layout Item",
19599
+ "name": "foundationGridLayout",
19600
+ "description": "The Foundation Grid Layout",
19715
19601
  "privacy": "public"
19716
19602
  }
19717
19603
  ],
19718
19604
  "exports": [
19719
19605
  {
19720
19606
  "kind": "js",
19721
- "name": "foundationGridLayoutItemShadowOptions",
19607
+ "name": "foundationGridLayoutShadowOptions",
19722
19608
  "declaration": {
19723
- "name": "foundationGridLayoutItemShadowOptions",
19724
- "module": "src/grid-layout-item/grid-layout-item.ts"
19609
+ "name": "foundationGridLayoutShadowOptions",
19610
+ "module": "src/grid-layout/grid-layout.ts"
19725
19611
  }
19726
19612
  },
19727
19613
  {
19728
19614
  "kind": "js",
19729
- "name": "defaultGridLayoutItemConfig",
19615
+ "name": "defaultGridLayoutConfig",
19730
19616
  "declaration": {
19731
- "name": "defaultGridLayoutItemConfig",
19732
- "module": "src/grid-layout-item/grid-layout-item.ts"
19617
+ "name": "defaultGridLayoutConfig",
19618
+ "module": "src/grid-layout/grid-layout.ts"
19733
19619
  }
19734
19620
  },
19735
19621
  {
19736
19622
  "kind": "js",
19737
- "name": "GridLayoutItem",
19623
+ "name": "GridLayout",
19738
19624
  "declaration": {
19739
- "name": "GridLayoutItem",
19740
- "module": "src/grid-layout-item/grid-layout-item.ts"
19625
+ "name": "GridLayout",
19626
+ "module": "src/grid-layout/grid-layout.ts"
19741
19627
  }
19742
19628
  },
19743
19629
  {
19744
19630
  "kind": "js",
19745
- "name": "foundationGridLayoutItem",
19631
+ "name": "foundationGridLayout",
19746
19632
  "declaration": {
19747
- "name": "foundationGridLayoutItem",
19748
- "module": "src/grid-layout-item/grid-layout-item.ts"
19633
+ "name": "foundationGridLayout",
19634
+ "module": "src/grid-layout/grid-layout.ts"
19749
19635
  }
19750
19636
  }
19751
19637
  ]
19752
19638
  },
19753
19639
  {
19754
19640
  "kind": "javascript-module",
19755
- "path": "src/grid-layout-item/index.ts",
19641
+ "path": "src/grid-layout/grid-layout.types.ts",
19642
+ "declarations": [],
19643
+ "exports": []
19644
+ },
19645
+ {
19646
+ "kind": "javascript-module",
19647
+ "path": "src/grid-layout/index.ts",
19756
19648
  "declarations": [],
19757
19649
  "exports": [
19758
19650
  {
@@ -19760,7 +19652,7 @@
19760
19652
  "name": "*",
19761
19653
  "declaration": {
19762
19654
  "name": "*",
19763
- "package": "./grid-layout-item.template"
19655
+ "package": "./grid-layout.template"
19764
19656
  }
19765
19657
  },
19766
19658
  {
@@ -19768,546 +19660,257 @@
19768
19660
  "name": "*",
19769
19661
  "declaration": {
19770
19662
  "name": "*",
19771
- "package": "./grid-layout-item"
19663
+ "package": "./grid-layout.styles"
19772
19664
  }
19773
- }
19774
- ]
19775
- },
19776
- {
19777
- "kind": "javascript-module",
19778
- "path": "src/horizontal-scroll/horizontal-scroll.styles.ts",
19779
- "declarations": [
19665
+ },
19780
19666
  {
19781
- "kind": "function",
19782
- "name": "foundationHorizontalScrollStyles",
19783
- "return": {
19784
- "type": {
19785
- "text": "ElementStyles"
19786
- }
19787
- },
19788
- "parameters": [
19789
- {
19790
- "name": "context",
19791
- "type": {
19792
- "text": "ElementDefinitionContext"
19793
- }
19794
- },
19795
- {
19796
- "name": "definition",
19797
- "type": {
19798
- "text": "FoundationElementDefinition"
19799
- }
19800
- }
19801
- ]
19802
- }
19803
- ],
19804
- "exports": [
19667
+ "kind": "js",
19668
+ "name": "*",
19669
+ "declaration": {
19670
+ "name": "*",
19671
+ "package": "./grid-layout"
19672
+ }
19673
+ },
19805
19674
  {
19806
19675
  "kind": "js",
19807
- "name": "foundationHorizontalScrollStyles",
19676
+ "name": "*",
19808
19677
  "declaration": {
19809
- "name": "foundationHorizontalScrollStyles",
19810
- "module": "src/horizontal-scroll/horizontal-scroll.styles.ts"
19678
+ "name": "*",
19679
+ "package": "./grid-layout.types"
19811
19680
  }
19812
19681
  }
19813
19682
  ]
19814
19683
  },
19815
19684
  {
19816
19685
  "kind": "javascript-module",
19817
- "path": "src/horizontal-scroll/horizontal-scroll.template.ts",
19686
+ "path": "src/grid-layout-item/grid-layout-item.template.ts",
19818
19687
  "declarations": [
19819
19688
  {
19820
- "kind": "function",
19821
- "name": "foundationHorizontalScrollTemplate",
19822
- "return": {
19823
- "type": {
19824
- "text": "ViewTemplate<HorizontalScroll>"
19825
- }
19689
+ "kind": "variable",
19690
+ "name": "foundationGridLayoutItemTemplate",
19691
+ "type": {
19692
+ "text": "ViewTemplate<GridLayoutItem>"
19826
19693
  },
19827
- "parameters": [
19828
- {
19829
- "name": "context",
19830
- "type": {
19831
- "text": "ElementDefinitionContext"
19832
- }
19833
- },
19834
- {
19835
- "name": "definition",
19836
- "type": {
19837
- "text": "FoundationElementDefinition"
19838
- }
19839
- }
19840
- ]
19694
+ "default": "html`\n <template>\n <style>\n :host {\n width: 100%;\n height: 100%;\n ${(x) => x.setGridItemProperties(x.colNumber, x.rowNumber, x.width, x.height)}\n }\n\n @media only screen and (min-width: 1025px) {\n :host {\n ${(x) => x.setGridItemProperties(x.colLgNumber, x.rowLgNumber, x.widthLg, x.heightLg)}\n }\n }\n\n @media only screen and (min-width: 641px) and (max-width: 1024px) {\n :host {\n ${(x) => x.setGridItemProperties(x.colMdNumber, x.rowMdNumber, x.widthSm, x.heightMd)}\n }\n }\n\n @media only screen and (max-width: 640px) {\n :host {\n ${(x) => x.setGridItemProperties(x.colSmNumber, x.rowSmNumber, x.widthSm, x.heightSm)}\n }\n }\n </style>\n <slot></slot>\n </template>\n`"
19841
19695
  }
19842
19696
  ],
19843
19697
  "exports": [
19844
19698
  {
19845
19699
  "kind": "js",
19846
- "name": "foundationHorizontalScrollTemplate",
19700
+ "name": "foundationGridLayoutItemTemplate",
19847
19701
  "declaration": {
19848
- "name": "foundationHorizontalScrollTemplate",
19849
- "module": "src/horizontal-scroll/horizontal-scroll.template.ts"
19702
+ "name": "foundationGridLayoutItemTemplate",
19703
+ "module": "src/grid-layout-item/grid-layout-item.template.ts"
19850
19704
  }
19851
19705
  }
19852
19706
  ]
19853
19707
  },
19854
19708
  {
19855
19709
  "kind": "javascript-module",
19856
- "path": "src/horizontal-scroll/horizontal-scroll.ts",
19710
+ "path": "src/grid-layout-item/grid-layout-item.ts",
19857
19711
  "declarations": [
19712
+ {
19713
+ "kind": "variable",
19714
+ "name": "foundationGridLayoutItemShadowOptions",
19715
+ "type": {
19716
+ "text": "ShadowRootInit"
19717
+ },
19718
+ "default": "undefined"
19719
+ },
19720
+ {
19721
+ "kind": "variable",
19722
+ "name": "defaultGridLayoutItemConfig",
19723
+ "type": {
19724
+ "text": "object"
19725
+ },
19726
+ "default": "{}"
19727
+ },
19858
19728
  {
19859
19729
  "kind": "class",
19860
19730
  "description": "",
19861
- "name": "HorizontalScroll",
19862
- "superclass": {
19863
- "name": "FASTHorizontalScroll",
19864
- "package": "@microsoft/fast-components"
19865
- },
19866
- "tagName": "%%prefix%%-horizontal-scroll",
19867
- "customElement": true,
19868
- "attributes": [
19731
+ "name": "GridLayoutItem",
19732
+ "members": [
19869
19733
  {
19734
+ "kind": "field",
19735
+ "name": "colNumber",
19870
19736
  "type": {
19871
19737
  "text": "number"
19872
- },
19873
- "default": "600",
19874
- "description": "Speed of scroll in pixels per second",
19875
- "fieldName": "speed",
19876
- "inheritedFrom": {
19877
- "name": "HorizontalScroll",
19878
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19879
19738
  }
19880
19739
  },
19881
19740
  {
19882
- "name": "duration",
19741
+ "kind": "field",
19742
+ "name": "colSmNumber",
19883
19743
  "type": {
19884
- "text": "string"
19885
- },
19886
- "description": "The CSS time value for the scroll transition duration. Overrides the `speed` attribute.",
19887
- "fieldName": "duration",
19888
- "inheritedFrom": {
19889
- "name": "HorizontalScroll",
19890
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19744
+ "text": "number"
19891
19745
  }
19892
19746
  },
19893
19747
  {
19894
- "name": "easing",
19748
+ "kind": "field",
19749
+ "name": "colMdNumber",
19895
19750
  "type": {
19896
- "text": "ScrollEasing"
19897
- },
19898
- "default": "\"ease-in-out\"",
19899
- "description": "Attribute used for easing, defaults to ease-in-out",
19900
- "fieldName": "easing",
19901
- "inheritedFrom": {
19902
- "name": "HorizontalScroll",
19903
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19751
+ "text": "number"
19904
19752
  }
19905
19753
  },
19906
19754
  {
19907
- "name": "flippers-hidden-from-at",
19755
+ "kind": "field",
19756
+ "name": "colLgNumber",
19908
19757
  "type": {
19909
- "text": "boolean"
19910
- },
19911
- "default": "false",
19912
- "description": "Attribute to hide flippers from assistive technology",
19913
- "fieldName": "flippersHiddenFromAT",
19914
- "inheritedFrom": {
19915
- "name": "HorizontalScroll",
19916
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19758
+ "text": "number"
19917
19759
  }
19918
19760
  },
19919
19761
  {
19920
- "name": "view",
19762
+ "kind": "field",
19763
+ "name": "rowNumber",
19921
19764
  "type": {
19922
- "text": "HorizontalScrollView"
19923
- },
19924
- "description": "View: default | mobile",
19925
- "fieldName": "view",
19926
- "inheritedFrom": {
19927
- "name": "HorizontalScroll",
19928
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19765
+ "text": "number"
19929
19766
  }
19930
- }
19931
- ],
19932
- "members": [
19767
+ },
19933
19768
  {
19934
19769
  "kind": "field",
19935
- "name": "scrollContainer",
19770
+ "name": "rowSmNumber",
19936
19771
  "type": {
19937
- "text": "HTMLDivElement"
19938
- },
19939
- "privacy": "public",
19940
- "description": "Reference to DOM element that scrolls the content",
19941
- "inheritedFrom": {
19942
- "name": "HorizontalScroll",
19943
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19772
+ "text": "number"
19944
19773
  }
19945
19774
  },
19946
19775
  {
19947
19776
  "kind": "field",
19948
- "name": "content",
19777
+ "name": "rowMdNumber",
19949
19778
  "type": {
19950
- "text": "HTMLDivElement"
19951
- },
19952
- "privacy": "public",
19953
- "description": "Reference to DOM element that holds the slotted content",
19954
- "inheritedFrom": {
19955
- "name": "HorizontalScroll",
19956
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19779
+ "text": "number"
19957
19780
  }
19958
19781
  },
19959
19782
  {
19960
19783
  "kind": "field",
19961
- "name": "previousFlipperContainer",
19784
+ "name": "rowLgNumber",
19962
19785
  "type": {
19963
- "text": "HTMLDivElement"
19964
- },
19965
- "privacy": "public",
19966
- "description": "Reference to flipper to scroll to previous content",
19967
- "inheritedFrom": {
19968
- "name": "HorizontalScroll",
19969
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19786
+ "text": "number"
19970
19787
  }
19971
19788
  },
19972
19789
  {
19973
19790
  "kind": "field",
19974
- "name": "nextFlipperContainer",
19791
+ "name": "width",
19975
19792
  "type": {
19976
- "text": "HTMLDivElement"
19977
- },
19978
- "privacy": "public",
19979
- "description": "Reference to flipper to scroll to the next content",
19980
- "inheritedFrom": {
19981
- "name": "HorizontalScroll",
19982
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19793
+ "text": "number"
19983
19794
  }
19984
19795
  },
19985
19796
  {
19986
19797
  "kind": "field",
19987
- "name": "speed",
19798
+ "name": "widthSm",
19988
19799
  "type": {
19989
19800
  "text": "number"
19990
- },
19991
- "privacy": "public",
19992
- "default": "600",
19993
- "description": "Speed of scroll in pixels per second",
19994
- "inheritedFrom": {
19995
- "name": "HorizontalScroll",
19996
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19997
19801
  }
19998
19802
  },
19999
19803
  {
20000
19804
  "kind": "field",
20001
- "name": "duration",
19805
+ "name": "widthMd",
20002
19806
  "type": {
20003
- "text": "string"
20004
- },
20005
- "privacy": "public",
20006
- "description": "The CSS time value for the scroll transition duration. Overrides the `speed` attribute.",
20007
- "inheritedFrom": {
20008
- "name": "HorizontalScroll",
20009
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19807
+ "text": "number"
20010
19808
  }
20011
19809
  },
20012
19810
  {
20013
19811
  "kind": "field",
20014
- "name": "easing",
19812
+ "name": "widthLg",
20015
19813
  "type": {
20016
- "text": "ScrollEasing"
20017
- },
20018
- "privacy": "public",
20019
- "default": "\"ease-in-out\"",
20020
- "description": "Attribute used for easing, defaults to ease-in-out",
20021
- "inheritedFrom": {
20022
- "name": "HorizontalScroll",
20023
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19814
+ "text": "number"
20024
19815
  }
20025
19816
  },
20026
19817
  {
20027
19818
  "kind": "field",
20028
- "name": "flippersHiddenFromAT",
19819
+ "name": "height",
20029
19820
  "type": {
20030
- "text": "boolean"
20031
- },
20032
- "privacy": "public",
20033
- "default": "false",
20034
- "description": "Attribute to hide flippers from assistive technology",
20035
- "inheritedFrom": {
20036
- "name": "HorizontalScroll",
20037
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19821
+ "text": "number"
20038
19822
  }
20039
19823
  },
20040
19824
  {
20041
19825
  "kind": "field",
20042
- "name": "scrollItems",
19826
+ "name": "heightSm",
20043
19827
  "type": {
20044
- "text": "HTMLElement[]"
20045
- },
20046
- "privacy": "public",
20047
- "description": "The default slotted items placed in the scrolling container.",
20048
- "inheritedFrom": {
20049
- "name": "HorizontalScroll",
20050
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19828
+ "text": "number"
20051
19829
  }
20052
19830
  },
20053
19831
  {
20054
19832
  "kind": "field",
20055
- "name": "view",
19833
+ "name": "heightMd",
20056
19834
  "type": {
20057
- "text": "HorizontalScrollView"
20058
- },
20059
- "privacy": "public",
20060
- "description": "View: default | mobile",
20061
- "inheritedFrom": {
20062
- "name": "HorizontalScroll",
20063
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19835
+ "text": "number"
19836
+ }
19837
+ },
19838
+ {
19839
+ "kind": "field",
19840
+ "name": "heightLg",
19841
+ "type": {
19842
+ "text": "number"
20064
19843
  }
20065
19844
  },
20066
19845
  {
20067
19846
  "kind": "method",
20068
- "name": "scrollItemsChanged",
20069
- "privacy": "public",
19847
+ "name": "setGridItemProperties",
20070
19848
  "parameters": [
20071
19849
  {
20072
- "name": "previous",
20073
- "type": {
20074
- "text": "HTMLElement[]"
20075
- },
20076
- "description": "current scroll items"
19850
+ "name": "column"
20077
19851
  },
20078
19852
  {
20079
- "name": "next",
20080
- "type": {
20081
- "text": "HTMLElement[]"
20082
- },
20083
- "description": "new updated scroll items"
19853
+ "name": "row"
19854
+ },
19855
+ {
19856
+ "name": "width"
19857
+ },
19858
+ {
19859
+ "name": "height"
20084
19860
  }
20085
- ],
20086
- "description": "Updates scroll stops and flippers when scroll items change",
20087
- "inheritedFrom": {
20088
- "name": "HorizontalScroll",
20089
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20090
- }
19861
+ ]
20091
19862
  },
20092
19863
  {
20093
- "kind": "method",
20094
- "name": "fixScrollMisalign",
19864
+ "kind": "field",
19865
+ "name": "_presentation",
19866
+ "type": {
19867
+ "text": "ComponentPresentation | null | undefined"
19868
+ },
20095
19869
  "privacy": "private",
20096
- "parameters": [
20097
- {
20098
- "name": "stops",
20099
- "type": {
20100
- "text": "number[]"
20101
- }
20102
- }
20103
- ],
19870
+ "default": "void 0",
20104
19871
  "inheritedFrom": {
20105
- "name": "HorizontalScroll",
20106
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19872
+ "name": "FoundationElement",
19873
+ "module": "src/foundation-element/foundation-element.ts"
20107
19874
  }
20108
19875
  },
20109
19876
  {
20110
- "kind": "method",
20111
- "name": "scrollInView",
20112
- "privacy": "public",
20113
- "return": {
20114
- "type": {
20115
- "text": "void"
20116
- }
19877
+ "kind": "field",
19878
+ "name": "$presentation",
19879
+ "type": {
19880
+ "text": "ComponentPresentation | null"
20117
19881
  },
20118
- "parameters": [
20119
- {
20120
- "name": "item",
20121
- "type": {
20122
- "text": "HTMLElement | number"
20123
- },
20124
- "description": "An item index, a scroll item or a child of one of the scroll items"
20125
- },
20126
- {
20127
- "name": "padding",
20128
- "default": "0",
20129
- "type": {
20130
- "text": "number"
20131
- },
20132
- "description": "Padding of the viewport where the active item shouldn't be"
20133
- },
20134
- {
20135
- "name": "rightPadding",
20136
- "optional": true,
20137
- "type": {
20138
- "text": "number"
20139
- },
20140
- "description": "Optional right padding. Uses the padding if not defined"
20141
- }
20142
- ],
20143
- "description": "Function that can scroll an item into view.",
19882
+ "privacy": "public",
19883
+ "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
20144
19884
  "inheritedFrom": {
20145
- "name": "HorizontalScroll",
20146
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19885
+ "name": "FoundationElement",
19886
+ "module": "src/foundation-element/foundation-element.ts"
20147
19887
  }
20148
19888
  },
20149
19889
  {
20150
- "kind": "method",
20151
- "name": "keyupHandler",
19890
+ "kind": "field",
19891
+ "name": "template",
19892
+ "type": {
19893
+ "text": "ElementViewTemplate | void | null"
19894
+ },
20152
19895
  "privacy": "public",
20153
- "parameters": [
20154
- {
20155
- "name": "e",
20156
- "type": {
20157
- "text": "Event & KeyboardEvent"
20158
- },
20159
- "description": "Keyboard event"
20160
- }
20161
- ],
20162
- "description": "Lets the user arrow left and right through the horizontal scroll",
19896
+ "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
20163
19897
  "inheritedFrom": {
20164
- "name": "HorizontalScroll",
20165
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
19898
+ "name": "FoundationElement",
19899
+ "module": "src/foundation-element/foundation-element.ts"
20166
19900
  }
20167
19901
  },
20168
19902
  {
20169
19903
  "kind": "method",
20170
- "name": "scrollToPrevious",
20171
- "privacy": "public",
19904
+ "name": "templateChanged",
19905
+ "privacy": "protected",
20172
19906
  "return": {
20173
19907
  "type": {
20174
19908
  "text": "void"
20175
19909
  }
20176
19910
  },
20177
- "description": "Scrolls items to the left",
20178
19911
  "inheritedFrom": {
20179
- "name": "HorizontalScroll",
20180
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20181
- }
20182
- },
20183
- {
20184
- "kind": "method",
20185
- "name": "scrollToNext",
20186
- "privacy": "public",
20187
- "return": {
20188
- "type": {
20189
- "text": "void"
20190
- }
20191
- },
20192
- "description": "Scrolls items to the right",
20193
- "inheritedFrom": {
20194
- "name": "HorizontalScroll",
20195
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20196
- }
20197
- },
20198
- {
20199
- "kind": "method",
20200
- "name": "scrollToPosition",
20201
- "privacy": "public",
20202
- "return": {
20203
- "type": {
20204
- "text": "void"
20205
- }
20206
- },
20207
- "parameters": [
20208
- {
20209
- "name": "newPosition",
20210
- "type": {
20211
- "text": "number"
20212
- },
20213
- "description": "position to scroll to"
20214
- },
20215
- {
20216
- "name": "position",
20217
- "default": "this.scrollContainer.scrollLeft",
20218
- "type": {
20219
- "text": "number"
20220
- },
20221
- "description": "starting position"
20222
- }
20223
- ],
20224
- "description": "Handles scrolling with easing",
20225
- "inheritedFrom": {
20226
- "name": "HorizontalScroll",
20227
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20228
- }
20229
- },
20230
- {
20231
- "kind": "method",
20232
- "name": "resized",
20233
- "privacy": "public",
20234
- "return": {
20235
- "type": {
20236
- "text": "void"
20237
- }
20238
- },
20239
- "description": "Monitors resize event on the horizontal-scroll element",
20240
- "inheritedFrom": {
20241
- "name": "HorizontalScroll",
20242
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20243
- }
20244
- },
20245
- {
20246
- "kind": "method",
20247
- "name": "scrolled",
20248
- "privacy": "public",
20249
- "return": {
20250
- "type": {
20251
- "text": "void"
20252
- }
20253
- },
20254
- "description": "Monitors scrolled event on the content container",
20255
- "inheritedFrom": {
20256
- "name": "HorizontalScroll",
20257
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20258
- }
20259
- },
20260
- {
20261
- "kind": "field",
20262
- "name": "_presentation",
20263
- "type": {
20264
- "text": "ComponentPresentation | null | undefined"
20265
- },
20266
- "privacy": "private",
20267
- "default": "void 0",
20268
- "inheritedFrom": {
20269
- "name": "FoundationElement",
20270
- "module": "src/foundation-element/foundation-element.ts"
20271
- }
20272
- },
20273
- {
20274
- "kind": "field",
20275
- "name": "$presentation",
20276
- "type": {
20277
- "text": "ComponentPresentation | null"
20278
- },
20279
- "privacy": "public",
20280
- "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
20281
- "inheritedFrom": {
20282
- "name": "FoundationElement",
20283
- "module": "src/foundation-element/foundation-element.ts"
20284
- }
20285
- },
20286
- {
20287
- "kind": "field",
20288
- "name": "template",
20289
- "type": {
20290
- "text": "ElementViewTemplate | void | null"
20291
- },
20292
- "privacy": "public",
20293
- "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
20294
- "inheritedFrom": {
20295
- "name": "FoundationElement",
20296
- "module": "src/foundation-element/foundation-element.ts"
20297
- }
20298
- },
20299
- {
20300
- "kind": "method",
20301
- "name": "templateChanged",
20302
- "privacy": "protected",
20303
- "return": {
20304
- "type": {
20305
- "text": "void"
20306
- }
20307
- },
20308
- "inheritedFrom": {
20309
- "name": "FoundationElement",
20310
- "module": "src/foundation-element/foundation-element.ts"
19912
+ "name": "FoundationElement",
19913
+ "module": "src/foundation-element/foundation-element.ts"
20311
19914
  }
20312
19915
  },
20313
19916
  {
@@ -20369,86 +19972,172 @@
20369
19972
  }
20370
19973
  }
20371
19974
  ],
20372
- "events": [
19975
+ "attributes": [
20373
19976
  {
20374
- "description": "Fires a custom 'scrollstart' event when scrolling",
20375
- "name": "scrollstart",
20376
- "inheritedFrom": {
20377
- "name": "HorizontalScroll",
20378
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20379
- }
19977
+ "name": "col-number",
19978
+ "type": {
19979
+ "text": "number"
19980
+ },
19981
+ "fieldName": "colNumber"
20380
19982
  },
20381
19983
  {
20382
- "description": "Fires a custom 'scrollend' event when scrolling stops",
20383
- "name": "scrollend",
20384
- "inheritedFrom": {
20385
- "name": "HorizontalScroll",
20386
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20387
- }
19984
+ "name": "col-sm-number",
19985
+ "type": {
19986
+ "text": "number"
19987
+ },
19988
+ "fieldName": "colSmNumber"
19989
+ },
19990
+ {
19991
+ "name": "col-md-number",
19992
+ "type": {
19993
+ "text": "number"
19994
+ },
19995
+ "fieldName": "colMdNumber"
19996
+ },
19997
+ {
19998
+ "name": "col-lg-number",
19999
+ "type": {
20000
+ "text": "number"
20001
+ },
20002
+ "fieldName": "colLgNumber"
20003
+ },
20004
+ {
20005
+ "name": "row-number",
20006
+ "type": {
20007
+ "text": "number"
20008
+ },
20009
+ "fieldName": "rowNumber"
20010
+ },
20011
+ {
20012
+ "name": "row-sm-number",
20013
+ "type": {
20014
+ "text": "number"
20015
+ },
20016
+ "fieldName": "rowSmNumber"
20017
+ },
20018
+ {
20019
+ "name": "row-md-number",
20020
+ "type": {
20021
+ "text": "number"
20022
+ },
20023
+ "fieldName": "rowMdNumber"
20024
+ },
20025
+ {
20026
+ "name": "row-lg-number",
20027
+ "type": {
20028
+ "text": "number"
20029
+ },
20030
+ "fieldName": "rowLgNumber"
20031
+ },
20032
+ {
20033
+ "name": "width",
20034
+ "type": {
20035
+ "text": "number"
20036
+ },
20037
+ "fieldName": "width"
20038
+ },
20039
+ {
20040
+ "name": "width-sm",
20041
+ "type": {
20042
+ "text": "number"
20043
+ },
20044
+ "fieldName": "widthSm"
20045
+ },
20046
+ {
20047
+ "name": "width-md",
20048
+ "type": {
20049
+ "text": "number"
20050
+ },
20051
+ "fieldName": "widthMd"
20052
+ },
20053
+ {
20054
+ "name": "width-lg",
20055
+ "type": {
20056
+ "text": "number"
20057
+ },
20058
+ "fieldName": "widthLg"
20059
+ },
20060
+ {
20061
+ "name": "height",
20062
+ "type": {
20063
+ "text": "number"
20064
+ },
20065
+ "fieldName": "height"
20066
+ },
20067
+ {
20068
+ "name": "height-sm",
20069
+ "type": {
20070
+ "text": "number"
20071
+ },
20072
+ "fieldName": "heightSm"
20073
+ },
20074
+ {
20075
+ "name": "height-md",
20076
+ "type": {
20077
+ "text": "number"
20078
+ },
20079
+ "fieldName": "heightMd"
20080
+ },
20081
+ {
20082
+ "name": "height-lg",
20083
+ "type": {
20084
+ "text": "number"
20085
+ },
20086
+ "fieldName": "heightLg"
20388
20087
  }
20389
- ]
20390
- },
20391
- {
20392
- "kind": "variable",
20393
- "name": "foundationHorizontalScrollShadowOptions",
20394
- "type": {
20395
- "text": "ShadowRootInit"
20396
- },
20397
- "default": "{\n delegatesFocus: true,\n mode: 'open',\n}"
20398
- },
20399
- {
20400
- "kind": "variable",
20401
- "name": "defaultHorizontalScrollConfig",
20402
- "type": {
20403
- "text": "object"
20088
+ ],
20089
+ "superclass": {
20090
+ "name": "FoundationElement",
20091
+ "package": "@microsoft/fast-foundation"
20404
20092
  },
20405
- "default": "{\n nextFlipper: html`\n <foundation-flipper\n @click=\"${(x) => x.scrollToNext()}\"\n aria-hidden=\"${(x) => x.flippersHiddenFromAT}\"\n ></foundation-flipper>\n `,\n previousFlipper: html`\n <foundation-flipper\n @click=\"${(x) => x.scrollToPrevious()}\"\n direction=\"previous\"\n aria-hidden=\"${(x) => x.flippersHiddenFromAT}\"\n ></foundation-flipper>\n `,\n}"
20093
+ "tagName": "%%prefix%%-grid-layout-item",
20094
+ "customElement": true
20406
20095
  },
20407
20096
  {
20408
20097
  "kind": "variable",
20409
- "name": "foundationHorizontalScroll",
20410
- "description": "The Foundation HorizontalScroll",
20098
+ "name": "foundationGridLayoutItem",
20099
+ "description": "The Foundation Grid Layout Item",
20411
20100
  "privacy": "public"
20412
20101
  }
20413
20102
  ],
20414
20103
  "exports": [
20415
20104
  {
20416
20105
  "kind": "js",
20417
- "name": "HorizontalScroll",
20106
+ "name": "foundationGridLayoutItemShadowOptions",
20418
20107
  "declaration": {
20419
- "name": "HorizontalScroll",
20420
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20108
+ "name": "foundationGridLayoutItemShadowOptions",
20109
+ "module": "src/grid-layout-item/grid-layout-item.ts"
20421
20110
  }
20422
20111
  },
20423
20112
  {
20424
20113
  "kind": "js",
20425
- "name": "foundationHorizontalScrollShadowOptions",
20114
+ "name": "defaultGridLayoutItemConfig",
20426
20115
  "declaration": {
20427
- "name": "foundationHorizontalScrollShadowOptions",
20428
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20116
+ "name": "defaultGridLayoutItemConfig",
20117
+ "module": "src/grid-layout-item/grid-layout-item.ts"
20429
20118
  }
20430
20119
  },
20431
20120
  {
20432
20121
  "kind": "js",
20433
- "name": "defaultHorizontalScrollConfig",
20122
+ "name": "GridLayoutItem",
20434
20123
  "declaration": {
20435
- "name": "defaultHorizontalScrollConfig",
20436
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20124
+ "name": "GridLayoutItem",
20125
+ "module": "src/grid-layout-item/grid-layout-item.ts"
20437
20126
  }
20438
20127
  },
20439
20128
  {
20440
20129
  "kind": "js",
20441
- "name": "foundationHorizontalScroll",
20130
+ "name": "foundationGridLayoutItem",
20442
20131
  "declaration": {
20443
- "name": "foundationHorizontalScroll",
20444
- "module": "src/horizontal-scroll/horizontal-scroll.ts"
20132
+ "name": "foundationGridLayoutItem",
20133
+ "module": "src/grid-layout-item/grid-layout-item.ts"
20445
20134
  }
20446
20135
  }
20447
20136
  ]
20448
20137
  },
20449
20138
  {
20450
20139
  "kind": "javascript-module",
20451
- "path": "src/horizontal-scroll/index.ts",
20140
+ "path": "src/grid-layout-item/index.ts",
20452
20141
  "declarations": [],
20453
20142
  "exports": [
20454
20143
  {
@@ -20456,15 +20145,7 @@
20456
20145
  "name": "*",
20457
20146
  "declaration": {
20458
20147
  "name": "*",
20459
- "package": "./horizontal-scroll.template"
20460
- }
20461
- },
20462
- {
20463
- "kind": "js",
20464
- "name": "*",
20465
- "declaration": {
20466
- "name": "*",
20467
- "package": "./horizontal-scroll.styles"
20148
+ "package": "./grid-layout-item.template"
20468
20149
  }
20469
20150
  },
20470
20151
  {
@@ -20472,156 +20153,494 @@
20472
20153
  "name": "*",
20473
20154
  "declaration": {
20474
20155
  "name": "*",
20475
- "package": "./horizontal-scroll"
20156
+ "package": "./grid-layout-item"
20476
20157
  }
20477
20158
  }
20478
20159
  ]
20479
20160
  },
20480
20161
  {
20481
20162
  "kind": "javascript-module",
20482
- "path": "src/flyout/flyout.styles.ts",
20163
+ "path": "src/horizontal-scroll/horizontal-scroll.styles.ts",
20483
20164
  "declarations": [
20484
20165
  {
20485
- "kind": "variable",
20486
- "name": "flyoutAnimationTime",
20487
- "type": {
20488
- "text": "number"
20489
- },
20490
- "default": "225"
20491
- },
20492
- {
20493
- "kind": "variable",
20494
- "name": "foundationFlyoutStyles",
20495
- "type": {
20496
- "text": "ElementStyles"
20166
+ "kind": "function",
20167
+ "name": "foundationHorizontalScrollStyles",
20168
+ "return": {
20169
+ "type": {
20170
+ "text": "ElementStyles"
20171
+ }
20497
20172
  },
20498
- "default": "css`\n /* Host */\n :host {\n display: inline-block;\n height: 100vh;\n position: absolute;\n width: 100vw;\n }\n\n :host([closed]) {\n display: none;\n }\n\n div.container {\n height: 100%;\n width: 100%;\n }\n\n /* flyout */\n div.flyout {\n background-color: white;\n color: black;\n height: 100%;\n position: absolute;\n /* stylelint-disable-next-line function-name-case */\n transition: transform ${flyoutAnimationTime.toString()}ms ease-in;\n width: 20%;\n z-index: 2001;\n }\n\n :host([position='left']) div.flyout {\n left: 0;\n transform: translateX(0%);\n }\n\n :host([position='right']) div.flyout {\n right: 0;\n transform: translateX(0%);\n }\n\n :host([visuallyhidden][position='left']) div.flyout {\n left: 0;\n transform: translateX(-100%);\n }\n\n :host([visuallyhidden][position='right']) div.flyout {\n right: 0;\n transform: translateX(100%);\n }\n\n div.header {\n align-items: center;\n display: flex;\n padding: calc(var(--design-unit) * 3px) calc(var(--design-unit) * 2px);\n }\n\n div.title {\n flex-grow: 1;\n }\n\n div.footer {\n bottom: 0;\n position: absolute;\n width: 100%;\n }\n\n /* Background */\n div.background {\n background-color: black;\n height: 100%;\n opacity: 50%;\n position: absolute;\n /* stylelint-disable-next-line function-name-case */\n transition: opacity ${flyoutAnimationTime.toString()}ms linear;\n width: 100%;\n z-index: 2000;\n }\n\n :host([visuallyhidden]) div.background {\n opacity: 0%;\n }\n`"
20173
+ "parameters": [
20174
+ {
20175
+ "name": "context",
20176
+ "type": {
20177
+ "text": "ElementDefinitionContext"
20178
+ }
20179
+ },
20180
+ {
20181
+ "name": "definition",
20182
+ "type": {
20183
+ "text": "FoundationElementDefinition"
20184
+ }
20185
+ }
20186
+ ]
20499
20187
  }
20500
20188
  ],
20501
20189
  "exports": [
20502
20190
  {
20503
20191
  "kind": "js",
20504
- "name": "flyoutAnimationTime",
20505
- "declaration": {
20506
- "name": "flyoutAnimationTime",
20507
- "module": "src/flyout/flyout.styles.ts"
20508
- }
20509
- },
20510
- {
20511
- "kind": "js",
20512
- "name": "foundationFlyoutStyles",
20192
+ "name": "foundationHorizontalScrollStyles",
20513
20193
  "declaration": {
20514
- "name": "foundationFlyoutStyles",
20515
- "module": "src/flyout/flyout.styles.ts"
20194
+ "name": "foundationHorizontalScrollStyles",
20195
+ "module": "src/horizontal-scroll/horizontal-scroll.styles.ts"
20516
20196
  }
20517
20197
  }
20518
20198
  ]
20519
20199
  },
20520
20200
  {
20521
20201
  "kind": "javascript-module",
20522
- "path": "src/flyout/flyout.template.ts",
20202
+ "path": "src/horizontal-scroll/horizontal-scroll.template.ts",
20523
20203
  "declarations": [
20524
20204
  {
20525
20205
  "kind": "function",
20526
- "name": "getPrefixedFlyout",
20206
+ "name": "foundationHorizontalScrollTemplate",
20207
+ "return": {
20208
+ "type": {
20209
+ "text": "ViewTemplate<HorizontalScroll>"
20210
+ }
20211
+ },
20527
20212
  "parameters": [
20528
20213
  {
20529
- "name": "prefix",
20214
+ "name": "context",
20530
20215
  "type": {
20531
- "text": "string"
20216
+ "text": "ElementDefinitionContext"
20217
+ }
20218
+ },
20219
+ {
20220
+ "name": "definition",
20221
+ "type": {
20222
+ "text": "FoundationElementDefinition"
20532
20223
  }
20533
20224
  }
20534
20225
  ]
20535
- },
20536
- {
20537
- "kind": "variable",
20538
- "name": "foundationFlyoutTemplate",
20539
- "default": "html<Flyout>`\n ${(x) => getPrefixedFlyout(getPrefix(x))}\n`"
20540
20226
  }
20541
20227
  ],
20542
20228
  "exports": [
20543
20229
  {
20544
20230
  "kind": "js",
20545
- "name": "getPrefixedFlyout",
20546
- "declaration": {
20547
- "name": "getPrefixedFlyout",
20548
- "module": "src/flyout/flyout.template.ts"
20549
- }
20550
- },
20551
- {
20552
- "kind": "js",
20553
- "name": "foundationFlyoutTemplate",
20231
+ "name": "foundationHorizontalScrollTemplate",
20554
20232
  "declaration": {
20555
- "name": "foundationFlyoutTemplate",
20556
- "module": "src/flyout/flyout.template.ts"
20233
+ "name": "foundationHorizontalScrollTemplate",
20234
+ "module": "src/horizontal-scroll/horizontal-scroll.template.ts"
20557
20235
  }
20558
20236
  }
20559
20237
  ]
20560
20238
  },
20561
20239
  {
20562
20240
  "kind": "javascript-module",
20563
- "path": "src/flyout/flyout.ts",
20241
+ "path": "src/horizontal-scroll/horizontal-scroll.ts",
20564
20242
  "declarations": [
20565
20243
  {
20566
20244
  "kind": "class",
20567
20245
  "description": "",
20568
- "name": "Flyout",
20246
+ "name": "HorizontalScroll",
20247
+ "superclass": {
20248
+ "name": "FASTHorizontalScroll",
20249
+ "package": "@microsoft/fast-components"
20250
+ },
20251
+ "tagName": "%%prefix%%-horizontal-scroll",
20252
+ "customElement": true,
20253
+ "attributes": [
20254
+ {
20255
+ "type": {
20256
+ "text": "number"
20257
+ },
20258
+ "default": "600",
20259
+ "description": "Speed of scroll in pixels per second",
20260
+ "fieldName": "speed",
20261
+ "inheritedFrom": {
20262
+ "name": "HorizontalScroll",
20263
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20264
+ }
20265
+ },
20266
+ {
20267
+ "name": "duration",
20268
+ "type": {
20269
+ "text": "string"
20270
+ },
20271
+ "description": "The CSS time value for the scroll transition duration. Overrides the `speed` attribute.",
20272
+ "fieldName": "duration",
20273
+ "inheritedFrom": {
20274
+ "name": "HorizontalScroll",
20275
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20276
+ }
20277
+ },
20278
+ {
20279
+ "name": "easing",
20280
+ "type": {
20281
+ "text": "ScrollEasing"
20282
+ },
20283
+ "default": "\"ease-in-out\"",
20284
+ "description": "Attribute used for easing, defaults to ease-in-out",
20285
+ "fieldName": "easing",
20286
+ "inheritedFrom": {
20287
+ "name": "HorizontalScroll",
20288
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20289
+ }
20290
+ },
20291
+ {
20292
+ "name": "flippers-hidden-from-at",
20293
+ "type": {
20294
+ "text": "boolean"
20295
+ },
20296
+ "default": "false",
20297
+ "description": "Attribute to hide flippers from assistive technology",
20298
+ "fieldName": "flippersHiddenFromAT",
20299
+ "inheritedFrom": {
20300
+ "name": "HorizontalScroll",
20301
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20302
+ }
20303
+ },
20304
+ {
20305
+ "name": "view",
20306
+ "type": {
20307
+ "text": "HorizontalScrollView"
20308
+ },
20309
+ "description": "View: default | mobile",
20310
+ "fieldName": "view",
20311
+ "inheritedFrom": {
20312
+ "name": "HorizontalScroll",
20313
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20314
+ }
20315
+ }
20316
+ ],
20569
20317
  "members": [
20570
20318
  {
20571
20319
  "kind": "field",
20572
- "name": "exit",
20320
+ "name": "scrollContainer",
20573
20321
  "type": {
20574
20322
  "text": "HTMLDivElement"
20575
20323
  },
20576
- "privacy": "public"
20324
+ "privacy": "public",
20325
+ "description": "Reference to DOM element that scrolls the content",
20326
+ "inheritedFrom": {
20327
+ "name": "HorizontalScroll",
20328
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20329
+ }
20330
+ },
20331
+ {
20332
+ "kind": "field",
20333
+ "name": "content",
20334
+ "type": {
20335
+ "text": "HTMLDivElement"
20336
+ },
20337
+ "privacy": "public",
20338
+ "description": "Reference to DOM element that holds the slotted content",
20339
+ "inheritedFrom": {
20340
+ "name": "HorizontalScroll",
20341
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20342
+ }
20343
+ },
20344
+ {
20345
+ "kind": "field",
20346
+ "name": "previousFlipperContainer",
20347
+ "type": {
20348
+ "text": "HTMLDivElement"
20349
+ },
20350
+ "privacy": "public",
20351
+ "description": "Reference to flipper to scroll to previous content",
20352
+ "inheritedFrom": {
20353
+ "name": "HorizontalScroll",
20354
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20355
+ }
20356
+ },
20357
+ {
20358
+ "kind": "field",
20359
+ "name": "nextFlipperContainer",
20360
+ "type": {
20361
+ "text": "HTMLDivElement"
20362
+ },
20363
+ "privacy": "public",
20364
+ "description": "Reference to flipper to scroll to the next content",
20365
+ "inheritedFrom": {
20366
+ "name": "HorizontalScroll",
20367
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20368
+ }
20369
+ },
20370
+ {
20371
+ "kind": "field",
20372
+ "name": "speed",
20373
+ "type": {
20374
+ "text": "number"
20375
+ },
20376
+ "privacy": "public",
20377
+ "default": "600",
20378
+ "description": "Speed of scroll in pixels per second",
20379
+ "inheritedFrom": {
20380
+ "name": "HorizontalScroll",
20381
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20382
+ }
20383
+ },
20384
+ {
20385
+ "kind": "field",
20386
+ "name": "duration",
20387
+ "type": {
20388
+ "text": "string"
20389
+ },
20390
+ "privacy": "public",
20391
+ "description": "The CSS time value for the scroll transition duration. Overrides the `speed` attribute.",
20392
+ "inheritedFrom": {
20393
+ "name": "HorizontalScroll",
20394
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20395
+ }
20396
+ },
20397
+ {
20398
+ "kind": "field",
20399
+ "name": "easing",
20400
+ "type": {
20401
+ "text": "ScrollEasing"
20402
+ },
20403
+ "privacy": "public",
20404
+ "default": "\"ease-in-out\"",
20405
+ "description": "Attribute used for easing, defaults to ease-in-out",
20406
+ "inheritedFrom": {
20407
+ "name": "HorizontalScroll",
20408
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20409
+ }
20410
+ },
20411
+ {
20412
+ "kind": "field",
20413
+ "name": "flippersHiddenFromAT",
20414
+ "type": {
20415
+ "text": "boolean"
20416
+ },
20417
+ "privacy": "public",
20418
+ "default": "false",
20419
+ "description": "Attribute to hide flippers from assistive technology",
20420
+ "inheritedFrom": {
20421
+ "name": "HorizontalScroll",
20422
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20423
+ }
20424
+ },
20425
+ {
20426
+ "kind": "field",
20427
+ "name": "scrollItems",
20428
+ "type": {
20429
+ "text": "HTMLElement[]"
20430
+ },
20431
+ "privacy": "public",
20432
+ "description": "The default slotted items placed in the scrolling container.",
20433
+ "inheritedFrom": {
20434
+ "name": "HorizontalScroll",
20435
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20436
+ }
20437
+ },
20438
+ {
20439
+ "kind": "field",
20440
+ "name": "view",
20441
+ "type": {
20442
+ "text": "HorizontalScrollView"
20443
+ },
20444
+ "privacy": "public",
20445
+ "description": "View: default | mobile",
20446
+ "inheritedFrom": {
20447
+ "name": "HorizontalScroll",
20448
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20449
+ }
20450
+ },
20451
+ {
20452
+ "kind": "method",
20453
+ "name": "scrollItemsChanged",
20454
+ "privacy": "public",
20455
+ "parameters": [
20456
+ {
20457
+ "name": "previous",
20458
+ "type": {
20459
+ "text": "HTMLElement[]"
20460
+ },
20461
+ "description": "current scroll items"
20462
+ },
20463
+ {
20464
+ "name": "next",
20465
+ "type": {
20466
+ "text": "HTMLElement[]"
20467
+ },
20468
+ "description": "new updated scroll items"
20469
+ }
20470
+ ],
20471
+ "description": "Updates scroll stops and flippers when scroll items change",
20472
+ "inheritedFrom": {
20473
+ "name": "HorizontalScroll",
20474
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20475
+ }
20476
+ },
20477
+ {
20478
+ "kind": "method",
20479
+ "name": "fixScrollMisalign",
20480
+ "privacy": "private",
20481
+ "parameters": [
20482
+ {
20483
+ "name": "stops",
20484
+ "type": {
20485
+ "text": "number[]"
20486
+ }
20487
+ }
20488
+ ],
20489
+ "inheritedFrom": {
20490
+ "name": "HorizontalScroll",
20491
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20492
+ }
20577
20493
  },
20578
20494
  {
20579
- "kind": "field",
20580
- "name": "position",
20581
- "type": {
20582
- "text": "string"
20495
+ "kind": "method",
20496
+ "name": "scrollInView",
20497
+ "privacy": "public",
20498
+ "return": {
20499
+ "type": {
20500
+ "text": "void"
20501
+ }
20583
20502
  },
20584
- "default": "'right'"
20503
+ "parameters": [
20504
+ {
20505
+ "name": "item",
20506
+ "type": {
20507
+ "text": "HTMLElement | number"
20508
+ },
20509
+ "description": "An item index, a scroll item or a child of one of the scroll items"
20510
+ },
20511
+ {
20512
+ "name": "padding",
20513
+ "default": "0",
20514
+ "type": {
20515
+ "text": "number"
20516
+ },
20517
+ "description": "Padding of the viewport where the active item shouldn't be"
20518
+ },
20519
+ {
20520
+ "name": "rightPadding",
20521
+ "optional": true,
20522
+ "type": {
20523
+ "text": "number"
20524
+ },
20525
+ "description": "Optional right padding. Uses the padding if not defined"
20526
+ }
20527
+ ],
20528
+ "description": "Function that can scroll an item into view.",
20529
+ "inheritedFrom": {
20530
+ "name": "HorizontalScroll",
20531
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20532
+ }
20585
20533
  },
20586
20534
  {
20587
- "kind": "field",
20588
- "name": "displayHeader",
20589
- "type": {
20590
- "text": "boolean"
20591
- },
20592
- "default": "true"
20535
+ "kind": "method",
20536
+ "name": "keyupHandler",
20537
+ "privacy": "public",
20538
+ "parameters": [
20539
+ {
20540
+ "name": "e",
20541
+ "type": {
20542
+ "text": "Event & KeyboardEvent"
20543
+ },
20544
+ "description": "Keyboard event"
20545
+ }
20546
+ ],
20547
+ "description": "Lets the user arrow left and right through the horizontal scroll",
20548
+ "inheritedFrom": {
20549
+ "name": "HorizontalScroll",
20550
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20551
+ }
20593
20552
  },
20594
20553
  {
20595
- "kind": "field",
20596
- "name": "closed",
20597
- "type": {
20598
- "text": "boolean"
20554
+ "kind": "method",
20555
+ "name": "scrollToPrevious",
20556
+ "privacy": "public",
20557
+ "return": {
20558
+ "type": {
20559
+ "text": "void"
20560
+ }
20599
20561
  },
20600
- "default": "true"
20562
+ "description": "Scrolls items to the left",
20563
+ "inheritedFrom": {
20564
+ "name": "HorizontalScroll",
20565
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20566
+ }
20601
20567
  },
20602
20568
  {
20603
20569
  "kind": "method",
20604
- "name": "closedChanged"
20605
- },
20606
- {
20607
- "kind": "field",
20608
- "name": "visuallyhidden",
20609
- "type": {
20610
- "text": "boolean"
20570
+ "name": "scrollToNext",
20571
+ "privacy": "public",
20572
+ "return": {
20573
+ "type": {
20574
+ "text": "void"
20575
+ }
20611
20576
  },
20612
- "default": "true"
20577
+ "description": "Scrolls items to the right",
20578
+ "inheritedFrom": {
20579
+ "name": "HorizontalScroll",
20580
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20581
+ }
20613
20582
  },
20614
20583
  {
20615
20584
  "kind": "method",
20616
- "name": "closeFlyout"
20585
+ "name": "scrollToPosition",
20586
+ "privacy": "public",
20587
+ "return": {
20588
+ "type": {
20589
+ "text": "void"
20590
+ }
20591
+ },
20592
+ "parameters": [
20593
+ {
20594
+ "name": "newPosition",
20595
+ "type": {
20596
+ "text": "number"
20597
+ },
20598
+ "description": "position to scroll to"
20599
+ },
20600
+ {
20601
+ "name": "position",
20602
+ "default": "this.scrollContainer.scrollLeft",
20603
+ "type": {
20604
+ "text": "number"
20605
+ },
20606
+ "description": "starting position"
20607
+ }
20608
+ ],
20609
+ "description": "Handles scrolling with easing",
20610
+ "inheritedFrom": {
20611
+ "name": "HorizontalScroll",
20612
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20613
+ }
20617
20614
  },
20618
20615
  {
20619
20616
  "kind": "method",
20620
- "name": "closingFinished"
20617
+ "name": "resized",
20618
+ "privacy": "public",
20619
+ "return": {
20620
+ "type": {
20621
+ "text": "void"
20622
+ }
20623
+ },
20624
+ "description": "Monitors resize event on the horizontal-scroll element",
20625
+ "inheritedFrom": {
20626
+ "name": "HorizontalScroll",
20627
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20628
+ }
20621
20629
  },
20622
20630
  {
20623
20631
  "kind": "method",
20624
- "name": "focusExit"
20632
+ "name": "scrolled",
20633
+ "privacy": "public",
20634
+ "return": {
20635
+ "type": {
20636
+ "text": "void"
20637
+ }
20638
+ },
20639
+ "description": "Monitors scrolled event on the content container",
20640
+ "inheritedFrom": {
20641
+ "name": "HorizontalScroll",
20642
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20643
+ }
20625
20644
  },
20626
20645
  {
20627
20646
  "kind": "field",
@@ -20735,105 +20754,86 @@
20735
20754
  }
20736
20755
  }
20737
20756
  ],
20738
- "attributes": [
20739
- {
20740
- "name": "position",
20741
- "type": {
20742
- "text": "string"
20743
- },
20744
- "default": "'right'",
20745
- "fieldName": "position"
20746
- },
20747
- {
20748
- "type": {
20749
- "text": "boolean"
20750
- },
20751
- "default": "true",
20752
- "fieldName": "displayHeader"
20753
- },
20757
+ "events": [
20754
20758
  {
20755
- "type": {
20756
- "text": "boolean"
20757
- },
20758
- "default": "true",
20759
- "fieldName": "closed"
20759
+ "description": "Fires a custom 'scrollstart' event when scrolling",
20760
+ "name": "scrollstart",
20761
+ "inheritedFrom": {
20762
+ "name": "HorizontalScroll",
20763
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20764
+ }
20760
20765
  },
20761
20766
  {
20762
- "type": {
20763
- "text": "boolean"
20764
- },
20765
- "default": "true",
20766
- "fieldName": "visuallyhidden"
20767
+ "description": "Fires a custom 'scrollend' event when scrolling stops",
20768
+ "name": "scrollend",
20769
+ "inheritedFrom": {
20770
+ "name": "HorizontalScroll",
20771
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20772
+ }
20767
20773
  }
20768
- ],
20769
- "superclass": {
20770
- "name": "FoundationElement",
20771
- "package": "@microsoft/fast-foundation"
20772
- },
20773
- "tagName": "%%prefix%%-flyout",
20774
- "customElement": true
20774
+ ]
20775
20775
  },
20776
20776
  {
20777
20777
  "kind": "variable",
20778
- "name": "foundationFlyoutShadowOptions",
20778
+ "name": "foundationHorizontalScrollShadowOptions",
20779
20779
  "type": {
20780
20780
  "text": "ShadowRootInit"
20781
20781
  },
20782
- "default": "undefined"
20782
+ "default": "{\n delegatesFocus: true,\n mode: 'open',\n}"
20783
20783
  },
20784
20784
  {
20785
20785
  "kind": "variable",
20786
- "name": "defaultFlyoutConfig",
20786
+ "name": "defaultHorizontalScrollConfig",
20787
20787
  "type": {
20788
20788
  "text": "object"
20789
20789
  },
20790
- "default": "{}"
20790
+ "default": "{\n nextFlipper: html`\n <foundation-flipper\n @click=\"${(x) => x.scrollToNext()}\"\n aria-hidden=\"${(x) => x.flippersHiddenFromAT}\"\n ></foundation-flipper>\n `,\n previousFlipper: html`\n <foundation-flipper\n @click=\"${(x) => x.scrollToPrevious()}\"\n direction=\"previous\"\n aria-hidden=\"${(x) => x.flippersHiddenFromAT}\"\n ></foundation-flipper>\n `,\n}"
20791
20791
  },
20792
20792
  {
20793
20793
  "kind": "variable",
20794
- "name": "foundationFlyout",
20795
- "description": "The Foundation Flyout",
20794
+ "name": "foundationHorizontalScroll",
20795
+ "description": "The Foundation HorizontalScroll",
20796
20796
  "privacy": "public"
20797
20797
  }
20798
20798
  ],
20799
20799
  "exports": [
20800
20800
  {
20801
20801
  "kind": "js",
20802
- "name": "Flyout",
20802
+ "name": "HorizontalScroll",
20803
20803
  "declaration": {
20804
- "name": "Flyout",
20805
- "module": "src/flyout/flyout.ts"
20804
+ "name": "HorizontalScroll",
20805
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20806
20806
  }
20807
20807
  },
20808
20808
  {
20809
20809
  "kind": "js",
20810
- "name": "foundationFlyoutShadowOptions",
20810
+ "name": "foundationHorizontalScrollShadowOptions",
20811
20811
  "declaration": {
20812
- "name": "foundationFlyoutShadowOptions",
20813
- "module": "src/flyout/flyout.ts"
20812
+ "name": "foundationHorizontalScrollShadowOptions",
20813
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20814
20814
  }
20815
20815
  },
20816
20816
  {
20817
20817
  "kind": "js",
20818
- "name": "defaultFlyoutConfig",
20818
+ "name": "defaultHorizontalScrollConfig",
20819
20819
  "declaration": {
20820
- "name": "defaultFlyoutConfig",
20821
- "module": "src/flyout/flyout.ts"
20820
+ "name": "defaultHorizontalScrollConfig",
20821
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20822
20822
  }
20823
20823
  },
20824
20824
  {
20825
20825
  "kind": "js",
20826
- "name": "foundationFlyout",
20826
+ "name": "foundationHorizontalScroll",
20827
20827
  "declaration": {
20828
- "name": "foundationFlyout",
20829
- "module": "src/flyout/flyout.ts"
20828
+ "name": "foundationHorizontalScroll",
20829
+ "module": "src/horizontal-scroll/horizontal-scroll.ts"
20830
20830
  }
20831
20831
  }
20832
20832
  ]
20833
20833
  },
20834
20834
  {
20835
20835
  "kind": "javascript-module",
20836
- "path": "src/flyout/index.ts",
20836
+ "path": "src/horizontal-scroll/index.ts",
20837
20837
  "declarations": [],
20838
20838
  "exports": [
20839
20839
  {
@@ -20841,7 +20841,7 @@
20841
20841
  "name": "*",
20842
20842
  "declaration": {
20843
20843
  "name": "*",
20844
- "package": "./flyout"
20844
+ "package": "./horizontal-scroll.template"
20845
20845
  }
20846
20846
  },
20847
20847
  {
@@ -20849,7 +20849,7 @@
20849
20849
  "name": "*",
20850
20850
  "declaration": {
20851
20851
  "name": "*",
20852
- "package": "./flyout.template"
20852
+ "package": "./horizontal-scroll.styles"
20853
20853
  }
20854
20854
  },
20855
20855
  {
@@ -20857,7 +20857,7 @@
20857
20857
  "name": "*",
20858
20858
  "declaration": {
20859
20859
  "name": "*",
20860
- "package": "./flyout.styles"
20860
+ "package": "./horizontal-scroll"
20861
20861
  }
20862
20862
  }
20863
20863
  ]
@@ -21103,7 +21103,7 @@
21103
21103
  },
21104
21104
  {
21105
21105
  "kind": "method",
21106
- "name": "getDefualtTooltipConfig"
21106
+ "name": "getDefaultTooltipConfig"
21107
21107
  },
21108
21108
  {
21109
21109
  "kind": "method",