@genesislcap/foundation-zero 14.20.1 → 14.20.2-alpha-a84fed585.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/custom-elements.json +1639 -1639
  2. package/package.json +6 -6
package/dist/custom-elements.json CHANGED
@@ -581,176 +581,6 @@
581
581
  }
582
582
  ]
583
583
  },
584
- {
585
- "kind": "javascript-module",
586
- "path": "src/_common/colors.hex.ts",
587
- "declarations": [],
588
- "exports": []
589
- },
590
- {
591
- "kind": "javascript-module",
592
- "path": "src/_common/colors.ts",
593
- "declarations": [
594
- {
595
- "kind": "variable",
596
- "name": "defaultRapidTextColor"
597
- },
598
- {
599
- "kind": "variable",
600
- "name": "defaultRapidBGColor"
601
- },
602
- {
603
- "kind": "variable",
604
- "name": "defaultRapidLabelColor"
605
- },
606
- {
607
- "kind": "variable",
608
- "name": "defaultRapidActiveBGColor"
609
- },
610
- {
611
- "kind": "variable",
612
- "name": "defaultRapidBorderUnfocusedColor"
613
- },
614
- {
615
- "kind": "variable",
616
- "name": "FastAppearanceValues",
617
- "type": {
618
- "text": "array"
619
- },
620
- "default": "['accent', 'lightweight', 'neutral', 'outline', 'stealth']"
621
- },
622
- {
623
- "kind": "variable",
624
- "name": "ZeroAppearanceValues"
625
- }
626
- ],
627
- "exports": [
628
- {
629
- "kind": "js",
630
- "name": "defaultRapidTextColor",
631
- "declaration": {
632
- "name": "defaultRapidTextColor",
633
- "module": "src/_common/colors.ts"
634
- }
635
- },
636
- {
637
- "kind": "js",
638
- "name": "defaultRapidBGColor",
639
- "declaration": {
640
- "name": "defaultRapidBGColor",
641
- "module": "src/_common/colors.ts"
642
- }
643
- },
644
- {
645
- "kind": "js",
646
- "name": "defaultRapidLabelColor",
647
- "declaration": {
648
- "name": "defaultRapidLabelColor",
649
- "module": "src/_common/colors.ts"
650
- }
651
- },
652
- {
653
- "kind": "js",
654
- "name": "defaultRapidActiveBGColor",
655
- "declaration": {
656
- "name": "defaultRapidActiveBGColor",
657
- "module": "src/_common/colors.ts"
658
- }
659
- },
660
- {
661
- "kind": "js",
662
- "name": "defaultRapidBorderUnfocusedColor",
663
- "declaration": {
664
- "name": "defaultRapidBorderUnfocusedColor",
665
- "module": "src/_common/colors.ts"
666
- }
667
- },
668
- {
669
- "kind": "js",
670
- "name": "FastAppearanceValues",
671
- "declaration": {
672
- "name": "FastAppearanceValues",
673
- "module": "src/_common/colors.ts"
674
- }
675
- },
676
- {
677
- "kind": "js",
678
- "name": "ZeroAppearanceValues",
679
- "declaration": {
680
- "name": "ZeroAppearanceValues",
681
- "module": "src/_common/colors.ts"
682
- }
683
- }
684
- ]
685
- },
686
- {
687
- "kind": "javascript-module",
688
- "path": "src/_common/colors.util.ts",
689
- "declarations": [],
690
- "exports": []
691
- },
692
- {
693
- "kind": "javascript-module",
694
- "path": "src/_common/index.ts",
695
- "declarations": [],
696
- "exports": [
697
- {
698
- "kind": "js",
699
- "name": "*",
700
- "declaration": {
701
- "name": "*",
702
- "package": "./colors"
703
- }
704
- },
705
- {
706
- "kind": "js",
707
- "name": "*",
708
- "declaration": {
709
- "name": "*",
710
- "package": "./colors.hex"
711
- }
712
- },
713
- {
714
- "kind": "js",
715
- "name": "*",
716
- "declaration": {
717
- "name": "*",
718
- "package": "./colors.util"
719
- }
720
- }
721
- ]
722
- },
723
- {
724
- "kind": "javascript-module",
725
- "path": "src/_config/index.ts",
726
- "declarations": [],
727
- "exports": [
728
- {
729
- "kind": "js",
730
- "name": "*",
731
- "declaration": {
732
- "name": "*",
733
- "package": "./styles"
734
- }
735
- },
736
- {
737
- "kind": "js",
738
- "name": "*",
739
- "declaration": {
740
- "name": "*",
741
- "package": "./tokens"
742
- }
743
- },
744
- {
745
- "kind": "js",
746
- "name": "*",
747
- "declaration": {
748
- "name": "*",
749
- "package": "./values"
750
- }
751
- }
752
- ]
753
- },
754
584
  {
755
585
  "kind": "javascript-module",
756
586
  "path": "src/anchor/anchor.stories.ts",
@@ -941,83 +771,222 @@
941
771
  },
942
772
  {
943
773
  "kind": "javascript-module",
944
- "path": "src/actions-menu/actions-menu.stories.ts",
774
+ "path": "src/_common/colors.hex.ts",
775
+ "declarations": [],
776
+ "exports": []
777
+ },
778
+ {
779
+ "kind": "javascript-module",
780
+ "path": "src/_common/colors.ts",
945
781
  "declarations": [
946
782
  {
947
783
  "kind": "variable",
948
- "name": "meta",
949
- "type": {
950
- "text": "Meta"
951
- },
952
- "default": "{\n title: 'Actions Menu',\n component: 'zero-actions-menu',\n}"
784
+ "name": "defaultRapidTextColor"
953
785
  },
954
786
  {
955
787
  "kind": "variable",
956
- "name": "Horizontal",
957
- "type": {
958
- "text": "StoryObj"
959
- },
960
- "default": "{\n args: {\n actions: zeroActions,\n actionsOpenerText: 'Horizontal Actions',\n },\n render: (args) =>\n html`\n <div style=\"${horizontalStyle}\">\n <zero-actions-menu\n name=\"${args.actionsOpenerText}\"\n .actions=${args.actions}\n ></zero-actions-menu>\n </div>\n `,\n}"
788
+ "name": "defaultRapidBGColor"
961
789
  },
962
790
  {
963
791
  "kind": "variable",
964
- "name": "Vertical",
792
+ "name": "defaultRapidLabelColor"
793
+ },
794
+ {
795
+ "kind": "variable",
796
+ "name": "defaultRapidActiveBGColor"
797
+ },
798
+ {
799
+ "kind": "variable",
800
+ "name": "defaultRapidBorderUnfocusedColor"
801
+ },
802
+ {
803
+ "kind": "variable",
804
+ "name": "FastAppearanceValues",
965
805
  "type": {
966
- "text": "StoryObj"
806
+ "text": "array"
967
807
  },
968
- "default": "{\n args: {\n actions: zeroActions,\n actionsOpenerText: 'Vertical Actions',\n },\n render: ({ actionsOpenerText, actions }) =>\n html`\n <div style=\"${verticalStyle}\">\n <zero-actions-menu\n name=\"${actionsOpenerText}\"\n .actions=${actions}\n is-vertical\n ></zero-actions-menu>\n </div>\n `,\n}"
808
+ "default": "['accent', 'lightweight', 'neutral', 'outline', 'stealth']"
809
+ },
810
+ {
811
+ "kind": "variable",
812
+ "name": "ZeroAppearanceValues"
969
813
  }
970
814
  ],
971
815
  "exports": [
972
816
  {
973
817
  "kind": "js",
974
- "name": "default",
818
+ "name": "defaultRapidTextColor",
975
819
  "declaration": {
976
- "name": "meta",
977
- "module": "src/actions-menu/actions-menu.stories.ts"
820
+ "name": "defaultRapidTextColor",
821
+ "module": "src/_common/colors.ts"
978
822
  }
979
823
  },
980
824
  {
981
825
  "kind": "js",
982
- "name": "Horizontal",
826
+ "name": "defaultRapidBGColor",
983
827
  "declaration": {
984
- "name": "Horizontal",
985
- "module": "src/actions-menu/actions-menu.stories.ts"
828
+ "name": "defaultRapidBGColor",
829
+ "module": "src/_common/colors.ts"
986
830
  }
987
831
  },
988
832
  {
989
833
  "kind": "js",
990
- "name": "Vertical",
834
+ "name": "defaultRapidLabelColor",
991
835
  "declaration": {
992
- "name": "Vertical",
993
- "module": "src/actions-menu/actions-menu.stories.ts"
836
+ "name": "defaultRapidLabelColor",
837
+ "module": "src/_common/colors.ts"
994
838
  }
995
- }
996
- ]
997
- },
998
- {
999
- "kind": "javascript-module",
1000
- "path": "src/actions-menu/actions-menu.styles.ts",
1001
- "declarations": [
839
+ },
1002
840
  {
1003
- "kind": "function",
1004
- "name": "zeroActionsMenuStyles",
1005
- "return": {
1006
- "type": {
1007
- "text": "ElementStyles"
1008
- }
1009
- },
1010
- "parameters": [
1011
- {
1012
- "name": "context",
1013
- "type": {
1014
- "text": "ElementDefinitionContext"
1015
- }
1016
- },
1017
- {
1018
- "name": "definition",
1019
- "type": {
1020
- "text": "FoundationElementDefinition"
841
+ "kind": "js",
842
+ "name": "defaultRapidActiveBGColor",
843
+ "declaration": {
844
+ "name": "defaultRapidActiveBGColor",
845
+ "module": "src/_common/colors.ts"
846
+ }
847
+ },
848
+ {
849
+ "kind": "js",
850
+ "name": "defaultRapidBorderUnfocusedColor",
851
+ "declaration": {
852
+ "name": "defaultRapidBorderUnfocusedColor",
853
+ "module": "src/_common/colors.ts"
854
+ }
855
+ },
856
+ {
857
+ "kind": "js",
858
+ "name": "FastAppearanceValues",
859
+ "declaration": {
860
+ "name": "FastAppearanceValues",
861
+ "module": "src/_common/colors.ts"
862
+ }
863
+ },
864
+ {
865
+ "kind": "js",
866
+ "name": "ZeroAppearanceValues",
867
+ "declaration": {
868
+ "name": "ZeroAppearanceValues",
869
+ "module": "src/_common/colors.ts"
870
+ }
871
+ }
872
+ ]
873
+ },
874
+ {
875
+ "kind": "javascript-module",
876
+ "path": "src/_common/colors.util.ts",
877
+ "declarations": [],
878
+ "exports": []
879
+ },
880
+ {
881
+ "kind": "javascript-module",
882
+ "path": "src/_common/index.ts",
883
+ "declarations": [],
884
+ "exports": [
885
+ {
886
+ "kind": "js",
887
+ "name": "*",
888
+ "declaration": {
889
+ "name": "*",
890
+ "package": "./colors"
891
+ }
892
+ },
893
+ {
894
+ "kind": "js",
895
+ "name": "*",
896
+ "declaration": {
897
+ "name": "*",
898
+ "package": "./colors.hex"
899
+ }
900
+ },
901
+ {
902
+ "kind": "js",
903
+ "name": "*",
904
+ "declaration": {
905
+ "name": "*",
906
+ "package": "./colors.util"
907
+ }
908
+ }
909
+ ]
910
+ },
911
+ {
912
+ "kind": "javascript-module",
913
+ "path": "src/actions-menu/actions-menu.stories.ts",
914
+ "declarations": [
915
+ {
916
+ "kind": "variable",
917
+ "name": "meta",
918
+ "type": {
919
+ "text": "Meta"
920
+ },
921
+ "default": "{\n title: 'Actions Menu',\n component: 'zero-actions-menu',\n}"
922
+ },
923
+ {
924
+ "kind": "variable",
925
+ "name": "Horizontal",
926
+ "type": {
927
+ "text": "StoryObj"
928
+ },
929
+ "default": "{\n args: {\n actions: zeroActions,\n actionsOpenerText: 'Horizontal Actions',\n },\n render: (args) =>\n html`\n <div style=\"${horizontalStyle}\">\n <zero-actions-menu\n name=\"${args.actionsOpenerText}\"\n .actions=${args.actions}\n ></zero-actions-menu>\n </div>\n `,\n}"
930
+ },
931
+ {
932
+ "kind": "variable",
933
+ "name": "Vertical",
934
+ "type": {
935
+ "text": "StoryObj"
936
+ },
937
+ "default": "{\n args: {\n actions: zeroActions,\n actionsOpenerText: 'Vertical Actions',\n },\n render: ({ actionsOpenerText, actions }) =>\n html`\n <div style=\"${verticalStyle}\">\n <zero-actions-menu\n name=\"${actionsOpenerText}\"\n .actions=${actions}\n is-vertical\n ></zero-actions-menu>\n </div>\n `,\n}"
938
+ }
939
+ ],
940
+ "exports": [
941
+ {
942
+ "kind": "js",
943
+ "name": "default",
944
+ "declaration": {
945
+ "name": "meta",
946
+ "module": "src/actions-menu/actions-menu.stories.ts"
947
+ }
948
+ },
949
+ {
950
+ "kind": "js",
951
+ "name": "Horizontal",
952
+ "declaration": {
953
+ "name": "Horizontal",
954
+ "module": "src/actions-menu/actions-menu.stories.ts"
955
+ }
956
+ },
957
+ {
958
+ "kind": "js",
959
+ "name": "Vertical",
960
+ "declaration": {
961
+ "name": "Vertical",
962
+ "module": "src/actions-menu/actions-menu.stories.ts"
963
+ }
964
+ }
965
+ ]
966
+ },
967
+ {
968
+ "kind": "javascript-module",
969
+ "path": "src/actions-menu/actions-menu.styles.ts",
970
+ "declarations": [
971
+ {
972
+ "kind": "function",
973
+ "name": "zeroActionsMenuStyles",
974
+ "return": {
975
+ "type": {
976
+ "text": "ElementStyles"
977
+ }
978
+ },
979
+ "parameters": [
980
+ {
981
+ "name": "context",
982
+ "type": {
983
+ "text": "ElementDefinitionContext"
984
+ }
985
+ },
986
+ {
987
+ "name": "definition",
988
+ "type": {
989
+ "text": "FoundationElementDefinition"
1021
990
  }
1022
991
  }
1023
992
  ]
@@ -1213,7 +1182,38 @@
1213
1182
  },
1214
1183
  {
1215
1184
  "kind": "javascript-module",
1216
- "path": "src/breadcrumb/breadcrumb.stories.ts",
1185
+ "path": "src/_config/index.ts",
1186
+ "declarations": [],
1187
+ "exports": [
1188
+ {
1189
+ "kind": "js",
1190
+ "name": "*",
1191
+ "declaration": {
1192
+ "name": "*",
1193
+ "package": "./styles"
1194
+ }
1195
+ },
1196
+ {
1197
+ "kind": "js",
1198
+ "name": "*",
1199
+ "declaration": {
1200
+ "name": "*",
1201
+ "package": "./tokens"
1202
+ }
1203
+ },
1204
+ {
1205
+ "kind": "js",
1206
+ "name": "*",
1207
+ "declaration": {
1208
+ "name": "*",
1209
+ "package": "./values"
1210
+ }
1211
+ }
1212
+ ]
1213
+ },
1214
+ {
1215
+ "kind": "javascript-module",
1216
+ "path": "src/badge/badge.stories.ts",
1217
1217
  "declarations": [
1218
1218
  {
1219
1219
  "kind": "variable",
@@ -1221,15 +1221,15 @@
1221
1221
  "type": {
1222
1222
  "text": "Meta"
1223
1223
  },
1224
- "default": "{\n title: 'Breadcrumb',\n component: 'zero-breadcrumb',\n}"
1224
+ "default": "{\n title: 'Badge',\n component: 'zero-badge',\n}"
1225
1225
  },
1226
1226
  {
1227
1227
  "kind": "variable",
1228
- "name": "Primary",
1228
+ "name": "All",
1229
1229
  "type": {
1230
1230
  "text": "StoryObj"
1231
1231
  },
1232
- "default": "{\n args: {\n breadcrumbItemsText: 'Breadcrumb Item',\n breadcrumbCurrentItemText: 'Current Page',\n },\n render: ({ breadcrumbItemsText, breadcrumbCurrentItemText }) =>\n html`\n <zero-breadcrumb>\n <zero-breadcrumb-item href=\"#\">${breadcrumbItemsText} 1</zero-breadcrumb-item>\n <zero-breadcrumb-item href=\"#\">${breadcrumbItemsText} 2</zero-breadcrumb-item>\n <zero-breadcrumb-item>${breadcrumbCurrentItemText}</zero-breadcrumb-item>\n </zero-breadcrumb>\n `,\n}"
1232
+ "default": "{\n args: {\n fillColors,\n fontColors,\n badgeText: 'Rapid Badge',\n },\n ...StylesMapperTemplate,\n}"
1233
1233
  }
1234
1234
  ],
1235
1235
  "exports": [
@@ -1238,26 +1238,26 @@
1238
1238
  "name": "default",
1239
1239
  "declaration": {
1240
1240
  "name": "meta",
1241
- "module": "src/breadcrumb/breadcrumb.stories.ts"
1241
+ "module": "src/badge/badge.stories.ts"
1242
1242
  }
1243
1243
  },
1244
1244
  {
1245
1245
  "kind": "js",
1246
- "name": "Primary",
1246
+ "name": "All",
1247
1247
  "declaration": {
1248
- "name": "Primary",
1249
- "module": "src/breadcrumb/breadcrumb.stories.ts"
1248
+ "name": "All",
1249
+ "module": "src/badge/badge.stories.ts"
1250
1250
  }
1251
1251
  }
1252
1252
  ]
1253
1253
  },
1254
1254
  {
1255
1255
  "kind": "javascript-module",
1256
- "path": "src/breadcrumb/breadcrumb.styles.ts",
1256
+ "path": "src/badge/badge.styles.ts",
1257
1257
  "declarations": [
1258
1258
  {
1259
1259
  "kind": "function",
1260
- "name": "zeroBreadcrumbStyles",
1260
+ "name": "zeroBadgeStyles",
1261
1261
  "return": {
1262
1262
  "type": {
1263
1263
  "text": "ElementStyles"
@@ -1282,24 +1282,24 @@
1282
1282
  "exports": [
1283
1283
  {
1284
1284
  "kind": "js",
1285
- "name": "zeroBreadcrumbStyles",
1285
+ "name": "zeroBadgeStyles",
1286
1286
  "declaration": {
1287
- "name": "zeroBreadcrumbStyles",
1288
- "module": "src/breadcrumb/breadcrumb.styles.ts"
1287
+ "name": "zeroBadgeStyles",
1288
+ "module": "src/badge/badge.styles.ts"
1289
1289
  }
1290
1290
  }
1291
1291
  ]
1292
1292
  },
1293
1293
  {
1294
1294
  "kind": "javascript-module",
1295
- "path": "src/breadcrumb/breadcrumb.template.ts",
1295
+ "path": "src/badge/badge.template.ts",
1296
1296
  "declarations": [
1297
1297
  {
1298
1298
  "kind": "function",
1299
- "name": "zeroBreadcrumbTemplate",
1299
+ "name": "zeroBadgeTemplate",
1300
1300
  "return": {
1301
1301
  "type": {
1302
- "text": "ViewTemplate<Breadcrumb>"
1302
+ "text": "ViewTemplate<Badge>"
1303
1303
  }
1304
1304
  },
1305
1305
  "parameters": [
@@ -1321,90 +1321,56 @@
1321
1321
  "exports": [
1322
1322
  {
1323
1323
  "kind": "js",
1324
- "name": "zeroBreadcrumbTemplate",
1324
+ "name": "zeroBadgeTemplate",
1325
1325
  "declaration": {
1326
- "name": "zeroBreadcrumbTemplate",
1327
- "module": "src/breadcrumb/breadcrumb.template.ts"
1326
+ "name": "zeroBadgeTemplate",
1327
+ "module": "src/badge/badge.template.ts"
1328
1328
  }
1329
1329
  }
1330
1330
  ]
1331
1331
  },
1332
1332
  {
1333
1333
  "kind": "javascript-module",
1334
- "path": "src/breadcrumb/breadcrumb.ts",
1334
+ "path": "src/badge/badge.ts",
1335
1335
  "declarations": [
1336
1336
  {
1337
1337
  "kind": "class",
1338
1338
  "description": "",
1339
- "name": "Breadcrumb",
1339
+ "name": "Badge",
1340
1340
  "superclass": {
1341
- "name": "FoundationBreadcrumb",
1341
+ "name": "FoundationBadge",
1342
1342
  "package": "@genesislcap/foundation-ui"
1343
1343
  },
1344
- "tagName": "%%prefix%%-breadcrumb",
1344
+ "tagName": "%%prefix%%-badge",
1345
1345
  "customElement": true
1346
1346
  },
1347
1347
  {
1348
1348
  "kind": "variable",
1349
- "name": "zeroBreadcrumbShadowOptions",
1350
- "type": {
1351
- "text": "ShadowRootInit"
1352
- },
1353
- "default": "undefined"
1354
- },
1355
- {
1356
- "kind": "variable",
1357
- "name": "defaultBreadcrumbConfig",
1358
- "type": {
1359
- "text": "object"
1360
- },
1361
- "default": "{}"
1362
- },
1363
- {
1364
- "kind": "variable",
1365
- "name": "zeroBreadcrumb",
1366
- "description": "The zero Breadcrumb",
1367
- "privacy": "public"
1349
+ "name": "zeroBadge"
1368
1350
  }
1369
1351
  ],
1370
1352
  "exports": [
1371
1353
  {
1372
1354
  "kind": "js",
1373
- "name": "Breadcrumb",
1355
+ "name": "Badge",
1374
1356
  "declaration": {
1375
- "name": "Breadcrumb",
1376
- "module": "src/breadcrumb/breadcrumb.ts"
1357
+ "name": "Badge",
1358
+ "module": "src/badge/badge.ts"
1377
1359
  }
1378
1360
  },
1379
1361
  {
1380
1362
  "kind": "js",
1381
- "name": "zeroBreadcrumbShadowOptions",
1363
+ "name": "zeroBadge",
1382
1364
  "declaration": {
1383
- "name": "zeroBreadcrumbShadowOptions",
1384
- "module": "src/breadcrumb/breadcrumb.ts"
1385
- }
1386
- },
1387
- {
1388
- "kind": "js",
1389
- "name": "defaultBreadcrumbConfig",
1390
- "declaration": {
1391
- "name": "defaultBreadcrumbConfig",
1392
- "module": "src/breadcrumb/breadcrumb.ts"
1393
- }
1394
- },
1395
- {
1396
- "kind": "js",
1397
- "name": "zeroBreadcrumb",
1398
- "declaration": {
1399
- "name": "zeroBreadcrumb",
1400
- "module": "src/breadcrumb/breadcrumb.ts"
1365
+ "name": "zeroBadge",
1366
+ "module": "src/badge/badge.ts"
1401
1367
  }
1402
1368
  }
1403
1369
  ]
1404
1370
  },
1405
1371
  {
1406
1372
  "kind": "javascript-module",
1407
- "path": "src/breadcrumb/index.ts",
1373
+ "path": "src/badge/index.ts",
1408
1374
  "declarations": [],
1409
1375
  "exports": [
1410
1376
  {
@@ -1412,7 +1378,7 @@
1412
1378
  "name": "*",
1413
1379
  "declaration": {
1414
1380
  "name": "*",
1415
- "package": "./breadcrumb.template"
1381
+ "package": "./badge"
1416
1382
  }
1417
1383
  },
1418
1384
  {
@@ -1420,7 +1386,7 @@
1420
1386
  "name": "*",
1421
1387
  "declaration": {
1422
1388
  "name": "*",
1423
- "package": "./breadcrumb.styles"
1389
+ "package": "./badge.styles"
1424
1390
  }
1425
1391
  },
1426
1392
  {
@@ -1428,7 +1394,7 @@
1428
1394
  "name": "*",
1429
1395
  "declaration": {
1430
1396
  "name": "*",
1431
- "package": "./breadcrumb"
1397
+ "package": "./badge.template"
1432
1398
  }
1433
1399
  }
1434
1400
  ]
@@ -1694,7 +1660,7 @@
1694
1660
  },
1695
1661
  {
1696
1662
  "kind": "javascript-module",
1697
- "path": "src/badge/badge.stories.ts",
1663
+ "path": "src/breadcrumb/breadcrumb.stories.ts",
1698
1664
  "declarations": [
1699
1665
  {
1700
1666
  "kind": "variable",
@@ -1702,15 +1668,15 @@
1702
1668
  "type": {
1703
1669
  "text": "Meta"
1704
1670
  },
1705
- "default": "{\n title: 'Badge',\n component: 'zero-badge',\n}"
1671
+ "default": "{\n title: 'Breadcrumb',\n component: 'zero-breadcrumb',\n}"
1706
1672
  },
1707
1673
  {
1708
1674
  "kind": "variable",
1709
- "name": "All",
1675
+ "name": "Primary",
1710
1676
  "type": {
1711
1677
  "text": "StoryObj"
1712
1678
  },
1713
- "default": "{\n args: {\n fillColors,\n fontColors,\n badgeText: 'Rapid Badge',\n },\n ...StylesMapperTemplate,\n}"
1679
+ "default": "{\n args: {\n breadcrumbItemsText: 'Breadcrumb Item',\n breadcrumbCurrentItemText: 'Current Page',\n },\n render: ({ breadcrumbItemsText, breadcrumbCurrentItemText }) =>\n html`\n <zero-breadcrumb>\n <zero-breadcrumb-item href=\"#\">${breadcrumbItemsText} 1</zero-breadcrumb-item>\n <zero-breadcrumb-item href=\"#\">${breadcrumbItemsText} 2</zero-breadcrumb-item>\n <zero-breadcrumb-item>${breadcrumbCurrentItemText}</zero-breadcrumb-item>\n </zero-breadcrumb>\n `,\n}"
1714
1680
  }
1715
1681
  ],
1716
1682
  "exports": [
@@ -1719,26 +1685,26 @@
1719
1685
  "name": "default",
1720
1686
  "declaration": {
1721
1687
  "name": "meta",
1722
- "module": "src/badge/badge.stories.ts"
1688
+ "module": "src/breadcrumb/breadcrumb.stories.ts"
1723
1689
  }
1724
1690
  },
1725
1691
  {
1726
1692
  "kind": "js",
1727
- "name": "All",
1693
+ "name": "Primary",
1728
1694
  "declaration": {
1729
- "name": "All",
1730
- "module": "src/badge/badge.stories.ts"
1695
+ "name": "Primary",
1696
+ "module": "src/breadcrumb/breadcrumb.stories.ts"
1731
1697
  }
1732
1698
  }
1733
1699
  ]
1734
1700
  },
1735
1701
  {
1736
1702
  "kind": "javascript-module",
1737
- "path": "src/badge/badge.styles.ts",
1703
+ "path": "src/breadcrumb/breadcrumb.styles.ts",
1738
1704
  "declarations": [
1739
1705
  {
1740
1706
  "kind": "function",
1741
- "name": "zeroBadgeStyles",
1707
+ "name": "zeroBreadcrumbStyles",
1742
1708
  "return": {
1743
1709
  "type": {
1744
1710
  "text": "ElementStyles"
@@ -1763,24 +1729,24 @@
1763
1729
  "exports": [
1764
1730
  {
1765
1731
  "kind": "js",
1766
- "name": "zeroBadgeStyles",
1732
+ "name": "zeroBreadcrumbStyles",
1767
1733
  "declaration": {
1768
- "name": "zeroBadgeStyles",
1769
- "module": "src/badge/badge.styles.ts"
1734
+ "name": "zeroBreadcrumbStyles",
1735
+ "module": "src/breadcrumb/breadcrumb.styles.ts"
1770
1736
  }
1771
1737
  }
1772
1738
  ]
1773
1739
  },
1774
1740
  {
1775
1741
  "kind": "javascript-module",
1776
- "path": "src/badge/badge.template.ts",
1742
+ "path": "src/breadcrumb/breadcrumb.template.ts",
1777
1743
  "declarations": [
1778
1744
  {
1779
1745
  "kind": "function",
1780
- "name": "zeroBadgeTemplate",
1746
+ "name": "zeroBreadcrumbTemplate",
1781
1747
  "return": {
1782
1748
  "type": {
1783
- "text": "ViewTemplate<Badge>"
1749
+ "text": "ViewTemplate<Breadcrumb>"
1784
1750
  }
1785
1751
  },
1786
1752
  "parameters": [
@@ -1802,147 +1768,125 @@
1802
1768
  "exports": [
1803
1769
  {
1804
1770
  "kind": "js",
1805
- "name": "zeroBadgeTemplate",
1771
+ "name": "zeroBreadcrumbTemplate",
1806
1772
  "declaration": {
1807
- "name": "zeroBadgeTemplate",
1808
- "module": "src/badge/badge.template.ts"
1773
+ "name": "zeroBreadcrumbTemplate",
1774
+ "module": "src/breadcrumb/breadcrumb.template.ts"
1809
1775
  }
1810
1776
  }
1811
1777
  ]
1812
1778
  },
1813
1779
  {
1814
1780
  "kind": "javascript-module",
1815
- "path": "src/badge/badge.ts",
1781
+ "path": "src/breadcrumb/breadcrumb.ts",
1816
1782
  "declarations": [
1817
1783
  {
1818
1784
  "kind": "class",
1819
1785
  "description": "",
1820
- "name": "Badge",
1786
+ "name": "Breadcrumb",
1821
1787
  "superclass": {
1822
- "name": "FoundationBadge",
1788
+ "name": "FoundationBreadcrumb",
1823
1789
  "package": "@genesislcap/foundation-ui"
1824
1790
  },
1825
- "tagName": "%%prefix%%-badge",
1791
+ "tagName": "%%prefix%%-breadcrumb",
1826
1792
  "customElement": true
1827
1793
  },
1828
1794
  {
1829
1795
  "kind": "variable",
1830
- "name": "zeroBadge"
1796
+ "name": "zeroBreadcrumbShadowOptions",
1797
+ "type": {
1798
+ "text": "ShadowRootInit"
1799
+ },
1800
+ "default": "undefined"
1801
+ },
1802
+ {
1803
+ "kind": "variable",
1804
+ "name": "defaultBreadcrumbConfig",
1805
+ "type": {
1806
+ "text": "object"
1807
+ },
1808
+ "default": "{}"
1809
+ },
1810
+ {
1811
+ "kind": "variable",
1812
+ "name": "zeroBreadcrumb",
1813
+ "description": "The zero Breadcrumb",
1814
+ "privacy": "public"
1831
1815
  }
1832
1816
  ],
1833
1817
  "exports": [
1834
1818
  {
1835
1819
  "kind": "js",
1836
- "name": "Badge",
1820
+ "name": "Breadcrumb",
1837
1821
  "declaration": {
1838
- "name": "Badge",
1839
- "module": "src/badge/badge.ts"
1822
+ "name": "Breadcrumb",
1823
+ "module": "src/breadcrumb/breadcrumb.ts"
1840
1824
  }
1841
1825
  },
1842
1826
  {
1843
1827
  "kind": "js",
1844
- "name": "zeroBadge",
1845
- "declaration": {
1846
- "name": "zeroBadge",
1847
- "module": "src/badge/badge.ts"
1848
- }
1849
- }
1850
- ]
1851
- },
1852
- {
1853
- "kind": "javascript-module",
1854
- "path": "src/badge/index.ts",
1855
- "declarations": [],
1856
- "exports": [
1857
- {
1858
- "kind": "js",
1859
- "name": "*",
1828
+ "name": "zeroBreadcrumbShadowOptions",
1860
1829
  "declaration": {
1861
- "name": "*",
1862
- "package": "./badge"
1830
+ "name": "zeroBreadcrumbShadowOptions",
1831
+ "module": "src/breadcrumb/breadcrumb.ts"
1863
1832
  }
1864
1833
  },
1865
1834
  {
1866
1835
  "kind": "js",
1867
- "name": "*",
1836
+ "name": "defaultBreadcrumbConfig",
1868
1837
  "declaration": {
1869
- "name": "*",
1870
- "package": "./badge.styles"
1838
+ "name": "defaultBreadcrumbConfig",
1839
+ "module": "src/breadcrumb/breadcrumb.ts"
1871
1840
  }
1872
1841
  },
1873
1842
  {
1874
1843
  "kind": "js",
1875
- "name": "*",
1844
+ "name": "zeroBreadcrumb",
1876
1845
  "declaration": {
1877
- "name": "*",
1878
- "package": "./badge.template"
1846
+ "name": "zeroBreadcrumb",
1847
+ "module": "src/breadcrumb/breadcrumb.ts"
1879
1848
  }
1880
1849
  }
1881
1850
  ]
1882
1851
  },
1883
1852
  {
1884
1853
  "kind": "javascript-module",
1885
- "path": "src/button/button.stories.ts",
1886
- "declarations": [
1887
- {
1888
- "kind": "variable",
1889
- "name": "meta",
1890
- "type": {
1891
- "text": "Meta"
1892
- },
1893
- "default": "{\n title: 'Button',\n component: 'zero-button',\n}"
1894
- },
1895
- {
1896
- "kind": "variable",
1897
- "name": "All",
1898
- "type": {
1899
- "text": "StoryObj"
1900
- },
1901
- "default": "{\n args: {\n appearances: ZeroAppearanceValues,\n buttonText: 'Zero Button',\n },\n ...StylesMapperTemplate,\n}"
1902
- },
1903
- {
1904
- "kind": "variable",
1905
- "name": "Single",
1906
- "type": {
1907
- "text": "StoryObj"
1908
- },
1909
- "default": "{\n args: {\n appearance: 'neutral',\n buttonText: 'Zero Button',\n },\n argTypes: {\n appearance: {\n control: 'select',\n options: [...FastAppearanceValues, ...ZeroAppearanceValues],\n },\n },\n render: ({ appearance, buttonText }) =>\n html`\n <zero-button appearance=\"${appearance}\">${buttonText} (${appearance})</zero-button>\n `,\n}"
1910
- }
1911
- ],
1854
+ "path": "src/breadcrumb/index.ts",
1855
+ "declarations": [],
1912
1856
  "exports": [
1913
1857
  {
1914
1858
  "kind": "js",
1915
- "name": "default",
1859
+ "name": "*",
1916
1860
  "declaration": {
1917
- "name": "meta",
1918
- "module": "src/button/button.stories.ts"
1861
+ "name": "*",
1862
+ "package": "./breadcrumb.template"
1919
1863
  }
1920
1864
  },
1921
1865
  {
1922
1866
  "kind": "js",
1923
- "name": "All",
1867
+ "name": "*",
1924
1868
  "declaration": {
1925
- "name": "All",
1926
- "module": "src/button/button.stories.ts"
1869
+ "name": "*",
1870
+ "package": "./breadcrumb.styles"
1927
1871
  }
1928
1872
  },
1929
1873
  {
1930
1874
  "kind": "js",
1931
- "name": "Single",
1875
+ "name": "*",
1932
1876
  "declaration": {
1933
- "name": "Single",
1934
- "module": "src/button/button.stories.ts"
1877
+ "name": "*",
1878
+ "package": "./breadcrumb"
1935
1879
  }
1936
1880
  }
1937
1881
  ]
1938
1882
  },
1939
1883
  {
1940
1884
  "kind": "javascript-module",
1941
- "path": "src/button/button.styles.ts",
1885
+ "path": "src/breadcrumb-item/breadcrumb-item.styles.ts",
1942
1886
  "declarations": [
1943
1887
  {
1944
1888
  "kind": "function",
1945
- "name": "zeroButtonStyles",
1889
+ "name": "zeroBreadcrumbItemStyles",
1946
1890
  "return": {
1947
1891
  "type": {
1948
1892
  "text": "ElementStyles"
@@ -1967,24 +1911,24 @@
1967
1911
  "exports": [
1968
1912
  {
1969
1913
  "kind": "js",
1970
- "name": "zeroButtonStyles",
1914
+ "name": "zeroBreadcrumbItemStyles",
1971
1915
  "declaration": {
1972
- "name": "zeroButtonStyles",
1973
- "module": "src/button/button.styles.ts"
1916
+ "name": "zeroBreadcrumbItemStyles",
1917
+ "module": "src/breadcrumb-item/breadcrumb-item.styles.ts"
1974
1918
  }
1975
1919
  }
1976
1920
  ]
1977
1921
  },
1978
1922
  {
1979
1923
  "kind": "javascript-module",
1980
- "path": "src/button/button.template.ts",
1924
+ "path": "src/breadcrumb-item/breadcrumb-item.template.ts",
1981
1925
  "declarations": [
1982
1926
  {
1983
1927
  "kind": "function",
1984
- "name": "zeroButtonTemplate",
1928
+ "name": "zeroBreadcrumbItemTemplate",
1985
1929
  "return": {
1986
1930
  "type": {
1987
- "text": "ViewTemplate<Button>"
1931
+ "text": "ViewTemplate<BreadcrumbItem>"
1988
1932
  }
1989
1933
  },
1990
1934
  "parameters": [
@@ -2006,56 +1950,56 @@
2006
1950
  "exports": [
2007
1951
  {
2008
1952
  "kind": "js",
2009
- "name": "zeroButtonTemplate",
1953
+ "name": "zeroBreadcrumbItemTemplate",
2010
1954
  "declaration": {
2011
- "name": "zeroButtonTemplate",
2012
- "module": "src/button/button.template.ts"
1955
+ "name": "zeroBreadcrumbItemTemplate",
1956
+ "module": "src/breadcrumb-item/breadcrumb-item.template.ts"
2013
1957
  }
2014
1958
  }
2015
1959
  ]
2016
1960
  },
2017
1961
  {
2018
1962
  "kind": "javascript-module",
2019
- "path": "src/button/button.ts",
1963
+ "path": "src/breadcrumb-item/breadcrumb-item.ts",
2020
1964
  "declarations": [
2021
1965
  {
2022
1966
  "kind": "class",
2023
1967
  "description": "",
2024
- "name": "Button",
1968
+ "name": "BreadcrumbItem",
2025
1969
  "superclass": {
2026
- "name": "FoundationButton",
1970
+ "name": "FoundationBreadcrumbItem",
2027
1971
  "package": "@genesislcap/foundation-ui"
2028
- },
2029
- "tagName": "%%prefix%%-button",
2030
- "customElement": true
1972
+ }
2031
1973
  },
2032
1974
  {
2033
1975
  "kind": "variable",
2034
- "name": "zeroButton"
1976
+ "name": "zeroBreadcrumbItem",
1977
+ "description": "The zero Breadcrumb Item",
1978
+ "privacy": "public"
2035
1979
  }
2036
1980
  ],
2037
1981
  "exports": [
2038
1982
  {
2039
1983
  "kind": "js",
2040
- "name": "Button",
1984
+ "name": "BreadcrumbItem",
2041
1985
  "declaration": {
2042
- "name": "Button",
2043
- "module": "src/button/button.ts"
1986
+ "name": "BreadcrumbItem",
1987
+ "module": "src/breadcrumb-item/breadcrumb-item.ts"
2044
1988
  }
2045
1989
  },
2046
1990
  {
2047
1991
  "kind": "js",
2048
- "name": "zeroButton",
1992
+ "name": "zeroBreadcrumbItem",
2049
1993
  "declaration": {
2050
- "name": "zeroButton",
2051
- "module": "src/button/button.ts"
1994
+ "name": "zeroBreadcrumbItem",
1995
+ "module": "src/breadcrumb-item/breadcrumb-item.ts"
2052
1996
  }
2053
1997
  }
2054
1998
  ]
2055
1999
  },
2056
2000
  {
2057
2001
  "kind": "javascript-module",
2058
- "path": "src/button/index.ts",
2002
+ "path": "src/breadcrumb-item/index.ts",
2059
2003
  "declarations": [],
2060
2004
  "exports": [
2061
2005
  {
@@ -2063,7 +2007,7 @@
2063
2007
  "name": "*",
2064
2008
  "declaration": {
2065
2009
  "name": "*",
2066
- "package": "./button"
2010
+ "package": "./breadcrumb-item.template"
2067
2011
  }
2068
2012
  },
2069
2013
  {
@@ -2071,7 +2015,7 @@
2071
2015
  "name": "*",
2072
2016
  "declaration": {
2073
2017
  "name": "*",
2074
- "package": "./button.styles"
2018
+ "package": "./breadcrumb-item.styles"
2075
2019
  }
2076
2020
  },
2077
2021
  {
@@ -2079,33 +2023,89 @@
2079
2023
  "name": "*",
2080
2024
  "declaration": {
2081
2025
  "name": "*",
2082
- "package": "./button.template"
2026
+ "package": "./breadcrumb-item"
2083
2027
  }
2084
2028
  }
2085
2029
  ]
2086
2030
  },
2087
2031
  {
2088
2032
  "kind": "javascript-module",
2089
- "path": "src/breadcrumb-item/breadcrumb-item.styles.ts",
2033
+ "path": "src/button/button.stories.ts",
2090
2034
  "declarations": [
2091
2035
  {
2092
- "kind": "function",
2093
- "name": "zeroBreadcrumbItemStyles",
2094
- "return": {
2095
- "type": {
2096
- "text": "ElementStyles"
2097
- }
2036
+ "kind": "variable",
2037
+ "name": "meta",
2038
+ "type": {
2039
+ "text": "Meta"
2098
2040
  },
2099
- "parameters": [
2100
- {
2101
- "name": "context",
2102
- "type": {
2103
- "text": "ElementDefinitionContext"
2104
- }
2105
- },
2106
- {
2107
- "name": "definition",
2108
- "type": {
2041
+ "default": "{\n title: 'Button',\n component: 'zero-button',\n}"
2042
+ },
2043
+ {
2044
+ "kind": "variable",
2045
+ "name": "All",
2046
+ "type": {
2047
+ "text": "StoryObj"
2048
+ },
2049
+ "default": "{\n args: {\n appearances: ZeroAppearanceValues,\n buttonText: 'Zero Button',\n },\n ...StylesMapperTemplate,\n}"
2050
+ },
2051
+ {
2052
+ "kind": "variable",
2053
+ "name": "Single",
2054
+ "type": {
2055
+ "text": "StoryObj"
2056
+ },
2057
+ "default": "{\n args: {\n appearance: 'neutral',\n buttonText: 'Zero Button',\n },\n argTypes: {\n appearance: {\n control: 'select',\n options: [...FastAppearanceValues, ...ZeroAppearanceValues],\n },\n },\n render: ({ appearance, buttonText }) =>\n html`\n <zero-button appearance=\"${appearance}\">${buttonText} (${appearance})</zero-button>\n `,\n}"
2058
+ }
2059
+ ],
2060
+ "exports": [
2061
+ {
2062
+ "kind": "js",
2063
+ "name": "default",
2064
+ "declaration": {
2065
+ "name": "meta",
2066
+ "module": "src/button/button.stories.ts"
2067
+ }
2068
+ },
2069
+ {
2070
+ "kind": "js",
2071
+ "name": "All",
2072
+ "declaration": {
2073
+ "name": "All",
2074
+ "module": "src/button/button.stories.ts"
2075
+ }
2076
+ },
2077
+ {
2078
+ "kind": "js",
2079
+ "name": "Single",
2080
+ "declaration": {
2081
+ "name": "Single",
2082
+ "module": "src/button/button.stories.ts"
2083
+ }
2084
+ }
2085
+ ]
2086
+ },
2087
+ {
2088
+ "kind": "javascript-module",
2089
+ "path": "src/button/button.styles.ts",
2090
+ "declarations": [
2091
+ {
2092
+ "kind": "function",
2093
+ "name": "zeroButtonStyles",
2094
+ "return": {
2095
+ "type": {
2096
+ "text": "ElementStyles"
2097
+ }
2098
+ },
2099
+ "parameters": [
2100
+ {
2101
+ "name": "context",
2102
+ "type": {
2103
+ "text": "ElementDefinitionContext"
2104
+ }
2105
+ },
2106
+ {
2107
+ "name": "definition",
2108
+ "type": {
2109
2109
  "text": "FoundationElementDefinition"
2110
2110
  }
2111
2111
  }
@@ -2115,24 +2115,24 @@
2115
2115
  "exports": [
2116
2116
  {
2117
2117
  "kind": "js",
2118
- "name": "zeroBreadcrumbItemStyles",
2118
+ "name": "zeroButtonStyles",
2119
2119
  "declaration": {
2120
- "name": "zeroBreadcrumbItemStyles",
2121
- "module": "src/breadcrumb-item/breadcrumb-item.styles.ts"
2120
+ "name": "zeroButtonStyles",
2121
+ "module": "src/button/button.styles.ts"
2122
2122
  }
2123
2123
  }
2124
2124
  ]
2125
2125
  },
2126
2126
  {
2127
2127
  "kind": "javascript-module",
2128
- "path": "src/breadcrumb-item/breadcrumb-item.template.ts",
2128
+ "path": "src/button/button.template.ts",
2129
2129
  "declarations": [
2130
2130
  {
2131
2131
  "kind": "function",
2132
- "name": "zeroBreadcrumbItemTemplate",
2132
+ "name": "zeroButtonTemplate",
2133
2133
  "return": {
2134
2134
  "type": {
2135
- "text": "ViewTemplate<BreadcrumbItem>"
2135
+ "text": "ViewTemplate<Button>"
2136
2136
  }
2137
2137
  },
2138
2138
  "parameters": [
@@ -2154,56 +2154,56 @@
2154
2154
  "exports": [
2155
2155
  {
2156
2156
  "kind": "js",
2157
- "name": "zeroBreadcrumbItemTemplate",
2157
+ "name": "zeroButtonTemplate",
2158
2158
  "declaration": {
2159
- "name": "zeroBreadcrumbItemTemplate",
2160
- "module": "src/breadcrumb-item/breadcrumb-item.template.ts"
2159
+ "name": "zeroButtonTemplate",
2160
+ "module": "src/button/button.template.ts"
2161
2161
  }
2162
2162
  }
2163
2163
  ]
2164
2164
  },
2165
2165
  {
2166
2166
  "kind": "javascript-module",
2167
- "path": "src/breadcrumb-item/breadcrumb-item.ts",
2167
+ "path": "src/button/button.ts",
2168
2168
  "declarations": [
2169
2169
  {
2170
2170
  "kind": "class",
2171
2171
  "description": "",
2172
- "name": "BreadcrumbItem",
2172
+ "name": "Button",
2173
2173
  "superclass": {
2174
- "name": "FoundationBreadcrumbItem",
2174
+ "name": "FoundationButton",
2175
2175
  "package": "@genesislcap/foundation-ui"
2176
- }
2176
+ },
2177
+ "tagName": "%%prefix%%-button",
2178
+ "customElement": true
2177
2179
  },
2178
2180
  {
2179
2181
  "kind": "variable",
2180
- "name": "zeroBreadcrumbItem",
2181
- "description": "The zero Breadcrumb Item",
2182
- "privacy": "public"
2182
+ "name": "zeroButton"
2183
2183
  }
2184
2184
  ],
2185
2185
  "exports": [
2186
2186
  {
2187
2187
  "kind": "js",
2188
- "name": "BreadcrumbItem",
2188
+ "name": "Button",
2189
2189
  "declaration": {
2190
- "name": "BreadcrumbItem",
2191
- "module": "src/breadcrumb-item/breadcrumb-item.ts"
2190
+ "name": "Button",
2191
+ "module": "src/button/button.ts"
2192
2192
  }
2193
2193
  },
2194
2194
  {
2195
2195
  "kind": "js",
2196
- "name": "zeroBreadcrumbItem",
2196
+ "name": "zeroButton",
2197
2197
  "declaration": {
2198
- "name": "zeroBreadcrumbItem",
2199
- "module": "src/breadcrumb-item/breadcrumb-item.ts"
2198
+ "name": "zeroButton",
2199
+ "module": "src/button/button.ts"
2200
2200
  }
2201
2201
  }
2202
2202
  ]
2203
2203
  },
2204
2204
  {
2205
2205
  "kind": "javascript-module",
2206
- "path": "src/breadcrumb-item/index.ts",
2206
+ "path": "src/button/index.ts",
2207
2207
  "declarations": [],
2208
2208
  "exports": [
2209
2209
  {
@@ -2211,7 +2211,7 @@
2211
2211
  "name": "*",
2212
2212
  "declaration": {
2213
2213
  "name": "*",
2214
- "package": "./breadcrumb-item.template"
2214
+ "package": "./button"
2215
2215
  }
2216
2216
  },
2217
2217
  {
@@ -2219,7 +2219,7 @@
2219
2219
  "name": "*",
2220
2220
  "declaration": {
2221
2221
  "name": "*",
2222
- "package": "./breadcrumb-item.styles"
2222
+ "package": "./button.styles"
2223
2223
  }
2224
2224
  },
2225
2225
  {
@@ -2227,7 +2227,7 @@
2227
2227
  "name": "*",
2228
2228
  "declaration": {
2229
2229
  "name": "*",
2230
- "package": "./breadcrumb-item"
2230
+ "package": "./button.template"
2231
2231
  }
2232
2232
  }
2233
2233
  ]
@@ -3784,7 +3784,7 @@
3784
3784
  },
3785
3785
  {
3786
3786
  "kind": "javascript-module",
3787
- "path": "src/divider/divider.stories.ts",
3787
+ "path": "src/dialog/dialog.stories.ts",
3788
3788
  "declarations": [
3789
3789
  {
3790
3790
  "kind": "variable",
@@ -3792,7 +3792,7 @@
3792
3792
  "type": {
3793
3793
  "text": "Meta"
3794
3794
  },
3795
- "default": "{\n title: 'Divider',\n component: 'zero-divider',\n}"
3795
+ "default": "{\n title: 'Dialog',\n component: 'zero-dialog',\n}"
3796
3796
  },
3797
3797
  {
3798
3798
  "kind": "variable",
@@ -3800,7 +3800,7 @@
3800
3800
  "type": {
3801
3801
  "text": "StoryObj"
3802
3802
  },
3803
- "default": "{\n argTypes: {\n orientation: {\n control: 'select',\n options: ['horizontal', 'vertical'],\n },\n role: {\n control: 'select',\n options: ['separator', 'presentation'],\n },\n },\n args: {\n orientation: 'horizontal',\n role: 'separator',\n },\n render: ({ orientation, role }) =>\n html`\n <div\n style=\"display: flex; justify-content:center; width: 100%; ${orientation === 'vertical'\n ? 'flex-direction: row;'\n : 'flex-direction: column;'}\"\n >\n <zero-button style=\"flex: 1;\"></zero-button>\n <zero-divider orientation=\"${orientation}\" role=\"${role}\"></zero-divider>\n <zero-button style=\"flex: 1;\"></zero-button>\n </div>\n `,\n}"
3803
+ "default": "{\n args: {\n dialogMaxWidth: '557px',\n dialogTitle: 'Dialog title',\n dialogInitialText: 'Some text in a Zero Dialog',\n dialogMainText: `Lorem ipsum dolor sit amet consectetur adipisicing elit. Quis similique iste ab sed\n voluptatem ut suscipit tenetur distinctio? Quo est debitis pariatur qui quisquam repudiandae\n at atque et quibusdam rerum, reprehenderit sed laborum officiis distinctio dolorum\n temporibus aperiam dolor consequatur perferendis aspernatur fugit repellendus asperiores,\n voluptas illo? Voluptatum, atque quidem?`,\n dialogCloseButtonText: 'Close this dialog',\n },\n render: ({\n dialogMaxWidth,\n dialogTitle,\n dialogInitialText,\n dialogMainText,\n dialogCloseButtonText,\n }) => html`\n <zero-button @click=\"${showDialog}\">Show Zero Dialog</zero-button>\n <zero-dialog style=\"--dialog-max-width: ${dialogMaxWidth};\">\n <h5 slot=\"top\">${dialogTitle}</h5>\n <p>${dialogInitialText}</p>\n <p>${dialogMainText}</p>\n <zero-divider slot=\"bottom\"></zero-divider>\n <zero-button appearance=\"primary-gradient\" slot=\"bottom\" @click=\"${closeDialog}\">\n ${dialogCloseButtonText}\n </zero-button>\n </zero-dialog>\n `,\n}"
3804
3804
  }
3805
3805
  ],
3806
3806
  "exports": [
@@ -3809,7 +3809,7 @@
3809
3809
  "name": "default",
3810
3810
  "declaration": {
3811
3811
  "name": "meta",
3812
- "module": "src/divider/divider.stories.ts"
3812
+ "module": "src/dialog/dialog.stories.ts"
3813
3813
  }
3814
3814
  },
3815
3815
  {
@@ -3817,131 +3817,357 @@
3817
3817
  "name": "Primary",
3818
3818
  "declaration": {
3819
3819
  "name": "Primary",
3820
- "module": "src/divider/divider.stories.ts"
3820
+ "module": "src/dialog/dialog.stories.ts"
3821
3821
  }
3822
3822
  }
3823
3823
  ]
3824
3824
  },
3825
3825
  {
3826
3826
  "kind": "javascript-module",
3827
- "path": "src/divider/divider.styles.ts",
3827
+ "path": "src/dialog/dialog.styles.ts",
3828
3828
  "declarations": [
3829
3829
  {
3830
- "kind": "function",
3831
- "name": "zeroDividerStyles",
3832
- "return": {
3833
- "type": {
3834
- "text": "ElementStyles"
3835
- }
3836
- },
3837
- "parameters": [
3838
- {
3839
- "name": "context",
3840
- "type": {
3841
- "text": "ElementDefinitionContext"
3842
- }
3843
- },
3844
- {
3845
- "name": "definition",
3846
- "type": {
3847
- "text": "FoundationElementDefinition"
3848
- }
3849
- }
3850
- ]
3830
+ "kind": "variable",
3831
+ "name": "zeroDialogStyles",
3832
+ "default": "css`\n ${foundationDialogStyles}\n :host {\n --dialog-background: ${neutralLayer2};\n }\n\n dialog {\n position: fixed;\n top: 0;\n bottom: 0;\n color: rgb(255 255 255 / 30%);\n border-radius: calc(var(--control-corner-radius) * 1px);\n border: 1px solid ${ColorHEX.lightGrey};\n text-align: left;\n line-height: normal;\n box-shadow: 0 2px 15px 0 rgb(0 0 0 / 35%);\n }\n\n .top {\n display: flex;\n align-items: center;\n justify-content: space-between;\n color: ${ColorHEX.almostWhite};\n margin-bottom: calc(var(--design-unit) * 2px);\n }\n\n .bottom {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-end;\n color: ${ColorHEX.almostWhite};\n }\n\n :host slot:first-of-type {\n color: ${neutralForegroundRest};\n }\n\n ::slotted(zero-button) {\n margin-top: calc(var(--design-unit) * 4px - 1px);\n }\n\n .content-wrapper {\n min-width: var(--dialog-min-width);\n min-height: var(--dialog-min-height);\n height: fit-content;\n width: fit-content;\n max-width: var(--dialog-max-width);\n max-height: var(--dialog-max-height);\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: stretch;\n }\n\n .close-icon:hover svg {\n background-color: ${whiteWebRGBA(0.05)};\n }\n\n .close-icon:hover svg g path {\n fill: ${whiteWebRGBA(1)};\n }\n\n .close-icon:active svg {\n background-color: ${defaultDialogActiveBGColor};\n }\n\n .close-icon:active svg g path {\n fill: ${whiteWebRGBA(0.33)};\n }\n`"
3851
3833
  }
3852
3834
  ],
3853
3835
  "exports": [
3854
3836
  {
3855
3837
  "kind": "js",
3856
- "name": "zeroDividerStyles",
3838
+ "name": "zeroDialogStyles",
3857
3839
  "declaration": {
3858
- "name": "zeroDividerStyles",
3859
- "module": "src/divider/divider.styles.ts"
3840
+ "name": "zeroDialogStyles",
3841
+ "module": "src/dialog/dialog.styles.ts"
3860
3842
  }
3861
3843
  }
3862
3844
  ]
3863
3845
  },
3864
3846
  {
3865
3847
  "kind": "javascript-module",
3866
- "path": "src/divider/divider.template.ts",
3848
+ "path": "src/dialog/dialog.ts",
3867
3849
  "declarations": [
3868
3850
  {
3869
- "kind": "function",
3870
- "name": "zeroDividerTemplate",
3871
- "return": {
3872
- "type": {
3873
- "text": "ViewTemplate<Divider>"
3874
- }
3851
+ "kind": "variable",
3852
+ "name": "defaultDialogConfig",
3853
+ "default": "foundationConfig"
3854
+ },
3855
+ {
3856
+ "kind": "variable",
3857
+ "name": "zeroDialogTemplate",
3858
+ "default": "foundationDialogTemplate"
3859
+ },
3860
+ {
3861
+ "kind": "variable",
3862
+ "name": "zeroDialogShadowOptions",
3863
+ "default": "foundationDialogShadowOptions"
3864
+ },
3865
+ {
3866
+ "kind": "class",
3867
+ "description": "",
3868
+ "name": "Dialog",
3869
+ "superclass": {
3870
+ "name": "FoundationDialog",
3871
+ "package": "@genesislcap/foundation-ui"
3875
3872
  },
3876
- "parameters": [
3873
+ "tagName": "%%prefix%%-dialog",
3874
+ "customElement": true,
3875
+ "attributes": [
3877
3876
  {
3878
- "name": "context",
3877
+ "name": "position",
3879
3878
  "type": {
3880
- "text": "ElementDefinitionContext"
3879
+ "text": "'centre' | 'left' | 'right'"
3880
+ },
3881
+ "default": "'centre'",
3882
+ "fieldName": "position",
3883
+ "inheritedFrom": {
3884
+ "name": "DialogElement",
3885
+ "module": "src/dialog/dialog.ts"
3881
3886
  }
3882
3887
  },
3883
3888
  {
3884
- "name": "definition",
3889
+ "name": "show-close-icon",
3885
3890
  "type": {
3886
- "text": "FoundationElementDefinition"
3891
+ "text": "boolean"
3892
+ },
3893
+ "default": "true",
3894
+ "description": "Whether or not to show the close icon",
3895
+ "fieldName": "showCloseIcon",
3896
+ "inheritedFrom": {
3897
+ "name": "DialogElement",
3898
+ "module": "src/dialog/dialog.ts"
3887
3899
  }
3888
3900
  }
3889
- ]
3890
- }
3891
- ],
3892
- "exports": [
3893
- {
3894
- "kind": "js",
3895
- "name": "zeroDividerTemplate",
3896
- "declaration": {
3897
- "name": "zeroDividerTemplate",
3898
- "module": "src/divider/divider.template.ts"
3899
- }
3900
- }
3901
- ]
3902
- },
3903
- {
3904
- "kind": "javascript-module",
3905
- "path": "src/divider/divider.ts",
3906
- "declarations": [
3907
- {
3908
- "kind": "class",
3909
- "description": "",
3910
- "name": "Divider",
3911
- "superclass": {
3912
- "name": "FoundationDivider",
3913
- "package": "@genesislcap/foundation-ui"
3914
- },
3915
- "tagName": "%%prefix%%-divider",
3916
- "customElement": true
3917
- },
3918
- {
3919
- "kind": "variable",
3920
- "name": "zeroDivider"
3921
- }
3922
- ],
3923
- "exports": [
3924
- {
3925
- "kind": "js",
3926
- "name": "Divider",
3927
- "declaration": {
3928
- "name": "Divider",
3929
- "module": "src/divider/divider.ts"
3901
+ ],
3902
+ "members": [
3903
+ {
3904
+ "kind": "field",
3905
+ "name": "mainElement",
3906
+ "type": {
3907
+ "text": "HTMLDialogElement"
3908
+ },
3909
+ "description": "A reference to the dialog element\nin the component Shadow DOM.",
3910
+ "inheritedFrom": {
3911
+ "name": "DialogElement",
3912
+ "module": "src/dialog/dialog.ts"
3913
+ }
3914
+ },
3915
+ {
3916
+ "kind": "field",
3917
+ "name": "position",
3918
+ "type": {
3919
+ "text": "'centre' | 'left' | 'right'"
3920
+ },
3921
+ "default": "'centre'",
3922
+ "inheritedFrom": {
3923
+ "name": "DialogElement",
3924
+ "module": "src/dialog/dialog.ts"
3925
+ }
3926
+ },
3927
+ {
3928
+ "kind": "field",
3929
+ "name": "showCloseIcon",
3930
+ "type": {
3931
+ "text": "boolean"
3932
+ },
3933
+ "default": "true",
3934
+ "description": "Whether or not to show the close icon",
3935
+ "inheritedFrom": {
3936
+ "name": "DialogElement",
3937
+ "module": "src/dialog/dialog.ts"
3938
+ }
3939
+ },
3940
+ {
3941
+ "kind": "field",
3942
+ "name": "onShowCallback",
3943
+ "type": {
3944
+ "text": "() => void"
3945
+ },
3946
+ "description": "Callback to run *before* HTMLDialogElement is shown",
3947
+ "inheritedFrom": {
3948
+ "name": "DialogElement",
3949
+ "module": "src/dialog/dialog.ts"
3950
+ }
3951
+ },
3952
+ {
3953
+ "kind": "field",
3954
+ "name": "onCloseCallback",
3955
+ "type": {
3956
+ "text": "() => void"
3957
+ },
3958
+ "description": "Callback to run *after* HTMLDialogElement is closed",
3959
+ "inheritedFrom": {
3960
+ "name": "DialogElement",
3961
+ "module": "src/dialog/dialog.ts"
3962
+ }
3963
+ },
3964
+ {
3965
+ "kind": "field",
3966
+ "name": "open",
3967
+ "type": {
3968
+ "text": "boolean"
3969
+ },
3970
+ "description": "Determine if the dialog is showing or closed.",
3971
+ "readonly": true,
3972
+ "inheritedFrom": {
3973
+ "name": "DialogElement",
3974
+ "module": "src/dialog/dialog.ts"
3975
+ }
3976
+ },
3977
+ {
3978
+ "kind": "method",
3979
+ "name": "show",
3980
+ "return": {
3981
+ "type": {
3982
+ "text": "void"
3983
+ }
3984
+ },
3985
+ "description": "Show the HTMLDialogElement and its contents",
3986
+ "inheritedFrom": {
3987
+ "name": "DialogElement",
3988
+ "module": "src/dialog/dialog.ts"
3989
+ }
3990
+ },
3991
+ {
3992
+ "kind": "method",
3993
+ "name": "close",
3994
+ "return": {
3995
+ "type": {
3996
+ "text": "void"
3997
+ }
3998
+ },
3999
+ "description": "Remove the HTMLDialogElement from display",
4000
+ "inheritedFrom": {
4001
+ "name": "DialogElement",
4002
+ "module": "src/dialog/dialog.ts"
4003
+ }
4004
+ },
4005
+ {
4006
+ "kind": "field",
4007
+ "name": "_presentation",
4008
+ "type": {
4009
+ "text": "ComponentPresentation | null | undefined"
4010
+ },
4011
+ "privacy": "private",
4012
+ "default": "void 0",
4013
+ "inheritedFrom": {
4014
+ "name": "FoundationElement",
4015
+ "module": "src/foundation-element/foundation-element.ts"
4016
+ }
4017
+ },
4018
+ {
4019
+ "kind": "field",
4020
+ "name": "$presentation",
4021
+ "type": {
4022
+ "text": "ComponentPresentation | null"
4023
+ },
4024
+ "privacy": "public",
4025
+ "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
4026
+ "inheritedFrom": {
4027
+ "name": "FoundationElement",
4028
+ "module": "src/foundation-element/foundation-element.ts"
4029
+ }
4030
+ },
4031
+ {
4032
+ "kind": "field",
4033
+ "name": "template",
4034
+ "type": {
4035
+ "text": "ElementViewTemplate | void | null"
4036
+ },
4037
+ "privacy": "public",
4038
+ "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.",
4039
+ "inheritedFrom": {
4040
+ "name": "FoundationElement",
4041
+ "module": "src/foundation-element/foundation-element.ts"
4042
+ }
4043
+ },
4044
+ {
4045
+ "kind": "method",
4046
+ "name": "templateChanged",
4047
+ "privacy": "protected",
4048
+ "return": {
4049
+ "type": {
4050
+ "text": "void"
4051
+ }
4052
+ },
4053
+ "inheritedFrom": {
4054
+ "name": "FoundationElement",
4055
+ "module": "src/foundation-element/foundation-element.ts"
4056
+ }
4057
+ },
4058
+ {
4059
+ "kind": "field",
4060
+ "name": "styles",
4061
+ "type": {
4062
+ "text": "ElementStyles | void | null"
4063
+ },
4064
+ "privacy": "public",
4065
+ "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
4066
+ "inheritedFrom": {
4067
+ "name": "FoundationElement",
4068
+ "module": "src/foundation-element/foundation-element.ts"
4069
+ }
4070
+ },
4071
+ {
4072
+ "kind": "method",
4073
+ "name": "stylesChanged",
4074
+ "privacy": "protected",
4075
+ "return": {
4076
+ "type": {
4077
+ "text": "void"
4078
+ }
4079
+ },
4080
+ "inheritedFrom": {
4081
+ "name": "FoundationElement",
4082
+ "module": "src/foundation-element/foundation-element.ts"
4083
+ }
4084
+ },
4085
+ {
4086
+ "kind": "method",
4087
+ "name": "compose",
4088
+ "privacy": "public",
4089
+ "static": true,
4090
+ "return": {
4091
+ "type": {
4092
+ "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
4093
+ }
4094
+ },
4095
+ "parameters": [
4096
+ {
4097
+ "name": "this",
4098
+ "type": {
4099
+ "text": "K"
4100
+ }
4101
+ },
4102
+ {
4103
+ "name": "elementDefinition",
4104
+ "type": {
4105
+ "text": "T"
4106
+ },
4107
+ "description": "The definition of the element to create the registry\nfunction for."
4108
+ }
4109
+ ],
4110
+ "description": "Defines an element registry function with a set of element definition defaults.",
4111
+ "inheritedFrom": {
4112
+ "name": "FoundationElement",
4113
+ "module": "src/foundation-element/foundation-element.ts"
4114
+ }
4115
+ }
4116
+ ]
4117
+ },
4118
+ {
4119
+ "kind": "variable",
4120
+ "name": "zeroDialog",
4121
+ "description": "The Zero Dialog",
4122
+ "privacy": "public"
4123
+ }
4124
+ ],
4125
+ "exports": [
4126
+ {
4127
+ "kind": "js",
4128
+ "name": "defaultDialogConfig",
4129
+ "declaration": {
4130
+ "name": "defaultDialogConfig",
4131
+ "module": "src/dialog/dialog.ts"
3930
4132
  }
3931
4133
  },
3932
4134
  {
3933
4135
  "kind": "js",
3934
- "name": "zeroDivider",
4136
+ "name": "zeroDialogTemplate",
3935
4137
  "declaration": {
3936
- "name": "zeroDivider",
3937
- "module": "src/divider/divider.ts"
4138
+ "name": "zeroDialogTemplate",
4139
+ "module": "src/dialog/dialog.ts"
4140
+ }
4141
+ },
4142
+ {
4143
+ "kind": "js",
4144
+ "name": "zeroDialogShadowOptions",
4145
+ "declaration": {
4146
+ "name": "zeroDialogShadowOptions",
4147
+ "module": "src/dialog/dialog.ts"
4148
+ }
4149
+ },
4150
+ {
4151
+ "kind": "js",
4152
+ "name": "Dialog",
4153
+ "declaration": {
4154
+ "name": "Dialog",
4155
+ "module": "src/dialog/dialog.ts"
4156
+ }
4157
+ },
4158
+ {
4159
+ "kind": "js",
4160
+ "name": "zeroDialog",
4161
+ "declaration": {
4162
+ "name": "zeroDialog",
4163
+ "module": "src/dialog/dialog.ts"
3938
4164
  }
3939
4165
  }
3940
4166
  ]
3941
4167
  },
3942
4168
  {
3943
4169
  "kind": "javascript-module",
3944
- "path": "src/divider/index.ts",
4170
+ "path": "src/dialog/index.ts",
3945
4171
  "declarations": [],
3946
4172
  "exports": [
3947
4173
  {
@@ -3949,7 +4175,7 @@
3949
4175
  "name": "*",
3950
4176
  "declaration": {
3951
4177
  "name": "*",
3952
- "package": "./divider"
4178
+ "package": "./dialog"
3953
4179
  }
3954
4180
  },
3955
4181
  {
@@ -3957,15 +4183,15 @@
3957
4183
  "name": "*",
3958
4184
  "declaration": {
3959
4185
  "name": "*",
3960
- "package": "./divider.styles"
4186
+ "package": "./dialog.styles"
3961
4187
  }
3962
4188
  },
3963
4189
  {
3964
4190
  "kind": "js",
3965
- "name": "*",
4191
+ "name": "zeroDialogTemplate",
3966
4192
  "declaration": {
3967
- "name": "*",
3968
- "package": "./divider.template"
4193
+ "name": "foundationDialogTemplate",
4194
+ "package": "@genesislcap/foundation-ui"
3969
4195
  }
3970
4196
  }
3971
4197
  ]
@@ -4043,22 +4269,210 @@
4043
4269
  "kind": "js",
4044
4270
  "name": "zeroDisclosureStyles",
4045
4271
  "declaration": {
4046
- "name": "zeroDisclosureStyles",
4047
- "module": "src/disclosure/disclosure.styles.ts"
4272
+ "name": "zeroDisclosureStyles",
4273
+ "module": "src/disclosure/disclosure.styles.ts"
4274
+ }
4275
+ }
4276
+ ]
4277
+ },
4278
+ {
4279
+ "kind": "javascript-module",
4280
+ "path": "src/disclosure/disclosure.template.ts",
4281
+ "declarations": [
4282
+ {
4283
+ "kind": "function",
4284
+ "name": "zeroDisclosureTemplate",
4285
+ "return": {
4286
+ "type": {
4287
+ "text": "ViewTemplate<Disclosure>"
4288
+ }
4289
+ },
4290
+ "parameters": [
4291
+ {
4292
+ "name": "context",
4293
+ "type": {
4294
+ "text": "ElementDefinitionContext"
4295
+ }
4296
+ },
4297
+ {
4298
+ "name": "definition",
4299
+ "type": {
4300
+ "text": "FoundationElementDefinition"
4301
+ }
4302
+ }
4303
+ ]
4304
+ }
4305
+ ],
4306
+ "exports": [
4307
+ {
4308
+ "kind": "js",
4309
+ "name": "zeroDisclosureTemplate",
4310
+ "declaration": {
4311
+ "name": "zeroDisclosureTemplate",
4312
+ "module": "src/disclosure/disclosure.template.ts"
4313
+ }
4314
+ }
4315
+ ]
4316
+ },
4317
+ {
4318
+ "kind": "javascript-module",
4319
+ "path": "src/disclosure/disclosure.ts",
4320
+ "declarations": [
4321
+ {
4322
+ "kind": "class",
4323
+ "description": "",
4324
+ "name": "Disclosure",
4325
+ "superclass": {
4326
+ "name": "FoundationDisclosure",
4327
+ "package": "@genesislcap/foundation-ui"
4328
+ },
4329
+ "tagName": "%%prefix%%-disclosure",
4330
+ "customElement": true
4331
+ },
4332
+ {
4333
+ "kind": "variable",
4334
+ "name": "zeroDisclosure"
4335
+ }
4336
+ ],
4337
+ "exports": [
4338
+ {
4339
+ "kind": "js",
4340
+ "name": "Disclosure",
4341
+ "declaration": {
4342
+ "name": "Disclosure",
4343
+ "module": "src/disclosure/disclosure.ts"
4344
+ }
4345
+ },
4346
+ {
4347
+ "kind": "js",
4348
+ "name": "zeroDisclosure",
4349
+ "declaration": {
4350
+ "name": "zeroDisclosure",
4351
+ "module": "src/disclosure/disclosure.ts"
4352
+ }
4353
+ }
4354
+ ]
4355
+ },
4356
+ {
4357
+ "kind": "javascript-module",
4358
+ "path": "src/disclosure/index.ts",
4359
+ "declarations": [],
4360
+ "exports": [
4361
+ {
4362
+ "kind": "js",
4363
+ "name": "*",
4364
+ "declaration": {
4365
+ "name": "*",
4366
+ "package": "./disclosure"
4367
+ }
4368
+ },
4369
+ {
4370
+ "kind": "js",
4371
+ "name": "*",
4372
+ "declaration": {
4373
+ "name": "*",
4374
+ "package": "./disclosure.styles"
4375
+ }
4376
+ },
4377
+ {
4378
+ "kind": "js",
4379
+ "name": "*",
4380
+ "declaration": {
4381
+ "name": "*",
4382
+ "package": "./disclosure.template"
4383
+ }
4384
+ }
4385
+ ]
4386
+ },
4387
+ {
4388
+ "kind": "javascript-module",
4389
+ "path": "src/divider/divider.stories.ts",
4390
+ "declarations": [
4391
+ {
4392
+ "kind": "variable",
4393
+ "name": "meta",
4394
+ "type": {
4395
+ "text": "Meta"
4396
+ },
4397
+ "default": "{\n title: 'Divider',\n component: 'zero-divider',\n}"
4398
+ },
4399
+ {
4400
+ "kind": "variable",
4401
+ "name": "Primary",
4402
+ "type": {
4403
+ "text": "StoryObj"
4404
+ },
4405
+ "default": "{\n argTypes: {\n orientation: {\n control: 'select',\n options: ['horizontal', 'vertical'],\n },\n role: {\n control: 'select',\n options: ['separator', 'presentation'],\n },\n },\n args: {\n orientation: 'horizontal',\n role: 'separator',\n },\n render: ({ orientation, role }) =>\n html`\n <div\n style=\"display: flex; justify-content:center; width: 100%; ${orientation === 'vertical'\n ? 'flex-direction: row;'\n : 'flex-direction: column;'}\"\n >\n <zero-button style=\"flex: 1;\"></zero-button>\n <zero-divider orientation=\"${orientation}\" role=\"${role}\"></zero-divider>\n <zero-button style=\"flex: 1;\"></zero-button>\n </div>\n `,\n}"
4406
+ }
4407
+ ],
4408
+ "exports": [
4409
+ {
4410
+ "kind": "js",
4411
+ "name": "default",
4412
+ "declaration": {
4413
+ "name": "meta",
4414
+ "module": "src/divider/divider.stories.ts"
4415
+ }
4416
+ },
4417
+ {
4418
+ "kind": "js",
4419
+ "name": "Primary",
4420
+ "declaration": {
4421
+ "name": "Primary",
4422
+ "module": "src/divider/divider.stories.ts"
4423
+ }
4424
+ }
4425
+ ]
4426
+ },
4427
+ {
4428
+ "kind": "javascript-module",
4429
+ "path": "src/divider/divider.styles.ts",
4430
+ "declarations": [
4431
+ {
4432
+ "kind": "function",
4433
+ "name": "zeroDividerStyles",
4434
+ "return": {
4435
+ "type": {
4436
+ "text": "ElementStyles"
4437
+ }
4438
+ },
4439
+ "parameters": [
4440
+ {
4441
+ "name": "context",
4442
+ "type": {
4443
+ "text": "ElementDefinitionContext"
4444
+ }
4445
+ },
4446
+ {
4447
+ "name": "definition",
4448
+ "type": {
4449
+ "text": "FoundationElementDefinition"
4450
+ }
4451
+ }
4452
+ ]
4453
+ }
4454
+ ],
4455
+ "exports": [
4456
+ {
4457
+ "kind": "js",
4458
+ "name": "zeroDividerStyles",
4459
+ "declaration": {
4460
+ "name": "zeroDividerStyles",
4461
+ "module": "src/divider/divider.styles.ts"
4048
4462
  }
4049
4463
  }
4050
4464
  ]
4051
4465
  },
4052
4466
  {
4053
4467
  "kind": "javascript-module",
4054
- "path": "src/disclosure/disclosure.template.ts",
4468
+ "path": "src/divider/divider.template.ts",
4055
4469
  "declarations": [
4056
4470
  {
4057
4471
  "kind": "function",
4058
- "name": "zeroDisclosureTemplate",
4472
+ "name": "zeroDividerTemplate",
4059
4473
  "return": {
4060
4474
  "type": {
4061
- "text": "ViewTemplate<Disclosure>"
4475
+ "text": "ViewTemplate<Divider>"
4062
4476
  }
4063
4477
  },
4064
4478
  "parameters": [
@@ -4080,56 +4494,56 @@
4080
4494
  "exports": [
4081
4495
  {
4082
4496
  "kind": "js",
4083
- "name": "zeroDisclosureTemplate",
4497
+ "name": "zeroDividerTemplate",
4084
4498
  "declaration": {
4085
- "name": "zeroDisclosureTemplate",
4086
- "module": "src/disclosure/disclosure.template.ts"
4499
+ "name": "zeroDividerTemplate",
4500
+ "module": "src/divider/divider.template.ts"
4087
4501
  }
4088
4502
  }
4089
4503
  ]
4090
4504
  },
4091
4505
  {
4092
4506
  "kind": "javascript-module",
4093
- "path": "src/disclosure/disclosure.ts",
4507
+ "path": "src/divider/divider.ts",
4094
4508
  "declarations": [
4095
4509
  {
4096
4510
  "kind": "class",
4097
4511
  "description": "",
4098
- "name": "Disclosure",
4512
+ "name": "Divider",
4099
4513
  "superclass": {
4100
- "name": "FoundationDisclosure",
4514
+ "name": "FoundationDivider",
4101
4515
  "package": "@genesislcap/foundation-ui"
4102
4516
  },
4103
- "tagName": "%%prefix%%-disclosure",
4517
+ "tagName": "%%prefix%%-divider",
4104
4518
  "customElement": true
4105
4519
  },
4106
4520
  {
4107
4521
  "kind": "variable",
4108
- "name": "zeroDisclosure"
4522
+ "name": "zeroDivider"
4109
4523
  }
4110
4524
  ],
4111
4525
  "exports": [
4112
4526
  {
4113
4527
  "kind": "js",
4114
- "name": "Disclosure",
4528
+ "name": "Divider",
4115
4529
  "declaration": {
4116
- "name": "Disclosure",
4117
- "module": "src/disclosure/disclosure.ts"
4530
+ "name": "Divider",
4531
+ "module": "src/divider/divider.ts"
4118
4532
  }
4119
4533
  },
4120
4534
  {
4121
4535
  "kind": "js",
4122
- "name": "zeroDisclosure",
4536
+ "name": "zeroDivider",
4123
4537
  "declaration": {
4124
- "name": "zeroDisclosure",
4125
- "module": "src/disclosure/disclosure.ts"
4538
+ "name": "zeroDivider",
4539
+ "module": "src/divider/divider.ts"
4126
4540
  }
4127
4541
  }
4128
4542
  ]
4129
4543
  },
4130
4544
  {
4131
4545
  "kind": "javascript-module",
4132
- "path": "src/disclosure/index.ts",
4546
+ "path": "src/divider/index.ts",
4133
4547
  "declarations": [],
4134
4548
  "exports": [
4135
4549
  {
@@ -4137,7 +4551,7 @@
4137
4551
  "name": "*",
4138
4552
  "declaration": {
4139
4553
  "name": "*",
4140
- "package": "./disclosure"
4554
+ "package": "./divider"
4141
4555
  }
4142
4556
  },
4143
4557
  {
@@ -4145,7 +4559,7 @@
4145
4559
  "name": "*",
4146
4560
  "declaration": {
4147
4561
  "name": "*",
4148
- "package": "./disclosure.styles"
4562
+ "package": "./divider.styles"
4149
4563
  }
4150
4564
  },
4151
4565
  {
@@ -4153,14 +4567,14 @@
4153
4567
  "name": "*",
4154
4568
  "declaration": {
4155
4569
  "name": "*",
4156
- "package": "./disclosure.template"
4570
+ "package": "./divider.template"
4157
4571
  }
4158
4572
  }
4159
4573
  ]
4160
4574
  },
4161
4575
  {
4162
4576
  "kind": "javascript-module",
4163
- "path": "src/error-banner/error-banner.stories.ts",
4577
+ "path": "src/dropdown-menu/dropdown-menu.stories.ts",
4164
4578
  "declarations": [
4165
4579
  {
4166
4580
  "kind": "variable",
@@ -4168,7 +4582,7 @@
4168
4582
  "type": {
4169
4583
  "text": "Meta"
4170
4584
  },
4171
- "default": "{\n title: 'Error Banner',\n component: 'zero-error-banner',\n}"
4585
+ "default": "{\n title: 'Dropdown Menu',\n component: 'zero-dropdown-menu',\n}"
4172
4586
  },
4173
4587
  {
4174
4588
  "kind": "variable",
@@ -4176,7 +4590,7 @@
4176
4590
  "type": {
4177
4591
  "text": "StoryObj"
4178
4592
  },
4179
- "default": "{\n args: {\n errorText: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',\n },\n render: ({ errorText }) =>\n html`\n <div id=\"zero-banner\" style=\"width: 100%;\">\n <zero-button @click=\"${() => showError(errorText)}\">Show Zero Error Banner</zero-button>\n </div>\n `,\n}"
4593
+ "default": "{\n args: {\n items: zeroItems,\n dropdownOpenerText: 'Dropdown menu',\n },\n render: ({ dropdownOpenerText, items }) =>\n html`\n <div>\n <zero-dropdown-menu name=\"${dropdownOpenerText}\" .items=${items}></zero-dropdown-menu>\n </div>\n `,\n}"
4180
4594
  }
4181
4595
  ],
4182
4596
  "exports": [
@@ -4185,7 +4599,7 @@
4185
4599
  "name": "default",
4186
4600
  "declaration": {
4187
4601
  "name": "meta",
4188
- "module": "src/error-banner/error-banner.stories.ts"
4602
+ "module": "src/dropdown-menu/dropdown-menu.stories.ts"
4189
4603
  }
4190
4604
  },
4191
4605
  {
@@ -4193,53 +4607,63 @@
4193
4607
  "name": "Primary",
4194
4608
  "declaration": {
4195
4609
  "name": "Primary",
4196
- "module": "src/error-banner/error-banner.stories.ts"
4610
+ "module": "src/dropdown-menu/dropdown-menu.stories.ts"
4197
4611
  }
4198
4612
  }
4199
4613
  ]
4200
4614
  },
4201
4615
  {
4202
4616
  "kind": "javascript-module",
4203
- "path": "src/error-banner/error-banner.template.ts",
4617
+ "path": "src/dropdown-menu/dropdown-menu.styles.ts",
4204
4618
  "declarations": [
4205
4619
  {
4206
- "kind": "variable",
4207
- "name": "zeroErrorBannerTemplate",
4208
- "type": {
4209
- "text": "ViewTemplate<ErrorBanner>"
4620
+ "kind": "function",
4621
+ "name": "zeroDropdownMenuStyles",
4622
+ "return": {
4623
+ "type": {
4624
+ "text": "ElementStyles"
4625
+ }
4210
4626
  },
4211
- "default": "html`\n <zero-banner ${ref('banner')}>\n <div slot=\"content\">\n <div>${(x) => x.error?.errorDetails || 'Place holder for error message'}</div>\n </div>\n\n <zero-button slot=\"action\" appearance=\"lightweight\" @click=${(x) => x.dismiss()}>\n ${(x) => x.error?.config?.banner?.dismissingAction?.label || 'Ignore'}\n </zero-button>\n\n ${repeat(\n (x) => x.error?.config?.banner.confirmingActions,\n html`\n <zero-button\n slot=\"action\"\n appearance=\"lightweight\"\n @click=${(x, c) => {\n x?.action();\n c.parent.dismiss();\n }}\n >\n ${(x) => x.label}\n </zero-button>\n `\n )}\n </zero-banner>\n`"
4627
+ "parameters": [
4628
+ {
4629
+ "name": "context",
4630
+ "type": {
4631
+ "text": "ElementDefinitionContext"
4632
+ }
4633
+ },
4634
+ {
4635
+ "name": "definition",
4636
+ "type": {
4637
+ "text": "FoundationElementDefinition"
4638
+ }
4639
+ }
4640
+ ]
4212
4641
  }
4213
4642
  ],
4214
4643
  "exports": [
4215
4644
  {
4216
4645
  "kind": "js",
4217
- "name": "zeroErrorBannerTemplate",
4646
+ "name": "zeroDropdownMenuStyles",
4218
4647
  "declaration": {
4219
- "name": "zeroErrorBannerTemplate",
4220
- "module": "src/error-banner/error-banner.template.ts"
4648
+ "name": "zeroDropdownMenuStyles",
4649
+ "module": "src/dropdown-menu/dropdown-menu.styles.ts"
4221
4650
  }
4222
4651
  }
4223
4652
  ]
4224
4653
  },
4225
4654
  {
4226
4655
  "kind": "javascript-module",
4227
- "path": "src/error-banner/error-banner.ts",
4656
+ "path": "src/dropdown-menu/dropdown-menu.ts",
4228
4657
  "declarations": [
4229
- {
4230
- "kind": "variable",
4231
- "name": "zeroErrorBannerShadowOptions",
4232
- "default": "foundationErrorBannerShadowOptions"
4233
- },
4234
4658
  {
4235
4659
  "kind": "class",
4236
4660
  "description": "",
4237
- "name": "ErrorBanner",
4661
+ "name": "DropdownMenu",
4238
4662
  "superclass": {
4239
- "name": "FoundationErrorBanner",
4663
+ "name": "FoundationDropdownMenu",
4240
4664
  "package": "@genesislcap/foundation-ui"
4241
4665
  },
4242
- "tagName": "%%prefix%%-error-banner",
4666
+ "tagName": "%%prefix%%-dropdown-menu",
4243
4667
  "customElement": true,
4244
4668
  "members": [
4245
4669
  {
@@ -4357,41 +4781,33 @@
4357
4781
  },
4358
4782
  {
4359
4783
  "kind": "variable",
4360
- "name": "zeroErrorBanner",
4361
- "description": "The Zero Banner",
4784
+ "name": "zeroDropdownMenu",
4785
+ "description": "The Zero Dropdown Menu",
4362
4786
  "privacy": "public"
4363
4787
  }
4364
4788
  ],
4365
4789
  "exports": [
4366
4790
  {
4367
4791
  "kind": "js",
4368
- "name": "zeroErrorBannerShadowOptions",
4369
- "declaration": {
4370
- "name": "zeroErrorBannerShadowOptions",
4371
- "module": "src/error-banner/error-banner.ts"
4372
- }
4373
- },
4374
- {
4375
- "kind": "js",
4376
- "name": "ErrorBanner",
4792
+ "name": "DropdownMenu",
4377
4793
  "declaration": {
4378
- "name": "ErrorBanner",
4379
- "module": "src/error-banner/error-banner.ts"
4794
+ "name": "DropdownMenu",
4795
+ "module": "src/dropdown-menu/dropdown-menu.ts"
4380
4796
  }
4381
4797
  },
4382
4798
  {
4383
4799
  "kind": "js",
4384
- "name": "zeroErrorBanner",
4800
+ "name": "zeroDropdownMenu",
4385
4801
  "declaration": {
4386
- "name": "zeroErrorBanner",
4387
- "module": "src/error-banner/error-banner.ts"
4802
+ "name": "zeroDropdownMenu",
4803
+ "module": "src/dropdown-menu/dropdown-menu.ts"
4388
4804
  }
4389
4805
  }
4390
4806
  ]
4391
4807
  },
4392
4808
  {
4393
4809
  "kind": "javascript-module",
4394
- "path": "src/error-banner/index.ts",
4810
+ "path": "src/dropdown-menu/index.ts",
4395
4811
  "declarations": [],
4396
4812
  "exports": [
4397
4813
  {
@@ -4399,7 +4815,7 @@
4399
4815
  "name": "*",
4400
4816
  "declaration": {
4401
4817
  "name": "*",
4402
- "package": "./error-banner.template"
4818
+ "package": "./dropdown-menu"
4403
4819
  }
4404
4820
  },
4405
4821
  {
@@ -4407,32 +4823,125 @@
4407
4823
  "name": "*",
4408
4824
  "declaration": {
4409
4825
  "name": "*",
4410
- "package": "./error-banner"
4826
+ "package": "./dropdown-menu.styles"
4827
+ }
4828
+ },
4829
+ {
4830
+ "kind": "js",
4831
+ "name": "zeroDropdownMenuTemplate",
4832
+ "declaration": {
4833
+ "name": "foundationDropdownMenuTemplate",
4834
+ "package": "@genesislcap/foundation-ui"
4835
+ }
4836
+ },
4837
+ {
4838
+ "kind": "js",
4839
+ "name": "getDropdownMenuTemplate",
4840
+ "declaration": {
4841
+ "name": "getDropdownMenuTemplate",
4842
+ "package": "@genesislcap/foundation-ui"
4843
+ }
4844
+ },
4845
+ {
4846
+ "kind": "js",
4847
+ "name": "extractMenuItems",
4848
+ "declaration": {
4849
+ "name": "extractMenuItems",
4850
+ "package": "@genesislcap/foundation-ui"
4851
+ }
4852
+ },
4853
+ {
4854
+ "kind": "js",
4855
+ "name": "dropdownMenuBaseStyles",
4856
+ "declaration": {
4857
+ "name": "dropdownMenuBaseStyles",
4858
+ "package": "@genesislcap/foundation-ui"
4411
4859
  }
4412
4860
  }
4413
4861
  ]
4414
4862
  },
4415
4863
  {
4416
4864
  "kind": "javascript-module",
4417
- "path": "src/error-boundary/error-boundary.ts",
4865
+ "path": "src/error-banner/error-banner.stories.ts",
4418
4866
  "declarations": [
4419
4867
  {
4420
4868
  "kind": "variable",
4421
- "name": "zeroErrorBoundaryShadowOptions",
4869
+ "name": "meta",
4422
4870
  "type": {
4423
- "text": "ShadowRootInit"
4871
+ "text": "Meta"
4424
4872
  },
4425
- "default": "{\n mode: 'open',\n delegatesFocus: true,\n}"
4873
+ "default": "{\n title: 'Error Banner',\n component: 'zero-error-banner',\n}"
4874
+ },
4875
+ {
4876
+ "kind": "variable",
4877
+ "name": "Primary",
4878
+ "type": {
4879
+ "text": "StoryObj"
4880
+ },
4881
+ "default": "{\n args: {\n errorText: 'Lorem ipsum dolor sit amet consectetur adipisicing elit.',\n },\n render: ({ errorText }) =>\n html`\n <div id=\"zero-banner\" style=\"width: 100%;\">\n <zero-button @click=\"${() => showError(errorText)}\">Show Zero Error Banner</zero-button>\n </div>\n `,\n}"
4882
+ }
4883
+ ],
4884
+ "exports": [
4885
+ {
4886
+ "kind": "js",
4887
+ "name": "default",
4888
+ "declaration": {
4889
+ "name": "meta",
4890
+ "module": "src/error-banner/error-banner.stories.ts"
4891
+ }
4892
+ },
4893
+ {
4894
+ "kind": "js",
4895
+ "name": "Primary",
4896
+ "declaration": {
4897
+ "name": "Primary",
4898
+ "module": "src/error-banner/error-banner.stories.ts"
4899
+ }
4900
+ }
4901
+ ]
4902
+ },
4903
+ {
4904
+ "kind": "javascript-module",
4905
+ "path": "src/error-banner/error-banner.template.ts",
4906
+ "declarations": [
4907
+ {
4908
+ "kind": "variable",
4909
+ "name": "zeroErrorBannerTemplate",
4910
+ "type": {
4911
+ "text": "ViewTemplate<ErrorBanner>"
4912
+ },
4913
+ "default": "html`\n <zero-banner ${ref('banner')}>\n <div slot=\"content\">\n <div>${(x) => x.error?.errorDetails || 'Place holder for error message'}</div>\n </div>\n\n <zero-button slot=\"action\" appearance=\"lightweight\" @click=${(x) => x.dismiss()}>\n ${(x) => x.error?.config?.banner?.dismissingAction?.label || 'Ignore'}\n </zero-button>\n\n ${repeat(\n (x) => x.error?.config?.banner.confirmingActions,\n html`\n <zero-button\n slot=\"action\"\n appearance=\"lightweight\"\n @click=${(x, c) => {\n x?.action();\n c.parent.dismiss();\n }}\n >\n ${(x) => x.label}\n </zero-button>\n `\n )}\n </zero-banner>\n`"
4914
+ }
4915
+ ],
4916
+ "exports": [
4917
+ {
4918
+ "kind": "js",
4919
+ "name": "zeroErrorBannerTemplate",
4920
+ "declaration": {
4921
+ "name": "zeroErrorBannerTemplate",
4922
+ "module": "src/error-banner/error-banner.template.ts"
4923
+ }
4924
+ }
4925
+ ]
4926
+ },
4927
+ {
4928
+ "kind": "javascript-module",
4929
+ "path": "src/error-banner/error-banner.ts",
4930
+ "declarations": [
4931
+ {
4932
+ "kind": "variable",
4933
+ "name": "zeroErrorBannerShadowOptions",
4934
+ "default": "foundationErrorBannerShadowOptions"
4426
4935
  },
4427
4936
  {
4428
4937
  "kind": "class",
4429
4938
  "description": "",
4430
- "name": "ErrorBoundary",
4939
+ "name": "ErrorBanner",
4431
4940
  "superclass": {
4432
- "name": "FoundationErrorBoundary",
4941
+ "name": "FoundationErrorBanner",
4433
4942
  "package": "@genesislcap/foundation-ui"
4434
4943
  },
4435
- "tagName": "%%prefix%%-error-boundary",
4944
+ "tagName": "%%prefix%%-error-banner",
4436
4945
  "customElement": true,
4437
4946
  "members": [
4438
4947
  {
@@ -4550,39 +5059,41 @@
4550
5059
  },
4551
5060
  {
4552
5061
  "kind": "variable",
4553
- "name": "zeroErrorBoundary"
5062
+ "name": "zeroErrorBanner",
5063
+ "description": "The Zero Banner",
5064
+ "privacy": "public"
4554
5065
  }
4555
5066
  ],
4556
5067
  "exports": [
4557
5068
  {
4558
5069
  "kind": "js",
4559
- "name": "zeroErrorBoundaryShadowOptions",
5070
+ "name": "zeroErrorBannerShadowOptions",
4560
5071
  "declaration": {
4561
- "name": "zeroErrorBoundaryShadowOptions",
4562
- "module": "src/error-boundary/error-boundary.ts"
5072
+ "name": "zeroErrorBannerShadowOptions",
5073
+ "module": "src/error-banner/error-banner.ts"
4563
5074
  }
4564
5075
  },
4565
5076
  {
4566
5077
  "kind": "js",
4567
- "name": "ErrorBoundary",
5078
+ "name": "ErrorBanner",
4568
5079
  "declaration": {
4569
- "name": "ErrorBoundary",
4570
- "module": "src/error-boundary/error-boundary.ts"
5080
+ "name": "ErrorBanner",
5081
+ "module": "src/error-banner/error-banner.ts"
4571
5082
  }
4572
5083
  },
4573
5084
  {
4574
5085
  "kind": "js",
4575
- "name": "zeroErrorBoundary",
5086
+ "name": "zeroErrorBanner",
4576
5087
  "declaration": {
4577
- "name": "zeroErrorBoundary",
4578
- "module": "src/error-boundary/error-boundary.ts"
5088
+ "name": "zeroErrorBanner",
5089
+ "module": "src/error-banner/error-banner.ts"
4579
5090
  }
4580
5091
  }
4581
5092
  ]
4582
5093
  },
4583
5094
  {
4584
5095
  "kind": "javascript-module",
4585
- "path": "src/error-boundary/index.ts",
5096
+ "path": "src/error-banner/index.ts",
4586
5097
  "declarations": [],
4587
5098
  "exports": [
4588
5099
  {
@@ -4590,64 +5101,40 @@
4590
5101
  "name": "*",
4591
5102
  "declaration": {
4592
5103
  "name": "*",
4593
- "package": "./error-boundary"
4594
- }
4595
- }
4596
- ]
4597
- },
4598
- {
4599
- "kind": "javascript-module",
4600
- "path": "src/error-dialog/error-dialog.stories.ts",
4601
- "declarations": [
4602
- {
4603
- "kind": "variable",
4604
- "name": "meta",
4605
- "type": {
4606
- "text": "Meta"
4607
- },
4608
- "default": "{\n title: 'Error Dialog',\n component: 'zero-error-dialog',\n}"
4609
- },
4610
- {
4611
- "kind": "variable",
4612
- "name": "Primary",
4613
- "type": {
4614
- "text": "StoryObj"
4615
- },
4616
- "default": "{\n args: {\n errorText:\n 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Lorem ipsum dolor sit amet',\n },\n render: ({ errorText }) => html`\n <zero-button @click=\"${() => showDialog(errorText)}\">Show Zero Dialog</zero-button>\n <div id=\"error-dialog-container\"></div>\n `,\n}"
4617
- }
4618
- ],
4619
- "exports": [
4620
- {
4621
- "kind": "js",
4622
- "name": "default",
4623
- "declaration": {
4624
- "name": "meta",
4625
- "module": "src/error-dialog/error-dialog.stories.ts"
5104
+ "package": "./error-banner.template"
4626
5105
  }
4627
5106
  },
4628
5107
  {
4629
5108
  "kind": "js",
4630
- "name": "Primary",
5109
+ "name": "*",
4631
5110
  "declaration": {
4632
- "name": "Primary",
4633
- "module": "src/error-dialog/error-dialog.stories.ts"
5111
+ "name": "*",
5112
+ "package": "./error-banner"
4634
5113
  }
4635
5114
  }
4636
5115
  ]
4637
5116
  },
4638
5117
  {
4639
5118
  "kind": "javascript-module",
4640
- "path": "src/error-dialog/error-dialog.ts",
5119
+ "path": "src/error-boundary/error-boundary.ts",
4641
5120
  "declarations": [
5121
+ {
5122
+ "kind": "variable",
5123
+ "name": "zeroErrorBoundaryShadowOptions",
5124
+ "type": {
5125
+ "text": "ShadowRootInit"
5126
+ },
5127
+ "default": "{\n mode: 'open',\n delegatesFocus: true,\n}"
5128
+ },
4642
5129
  {
4643
5130
  "kind": "class",
4644
5131
  "description": "",
4645
- "name": "ErrorDialog",
5132
+ "name": "ErrorBoundary",
4646
5133
  "superclass": {
4647
- "name": "FoundationErrorDialog",
5134
+ "name": "FoundationErrorBoundary",
4648
5135
  "package": "@genesislcap/foundation-ui"
4649
5136
  },
4650
- "tagName": "%%prefix%%-error-dialog",
5137
+ "tagName": "%%prefix%%-error-boundary",
4651
5138
  "customElement": true,
4652
5139
  "members": [
4653
5140
  {
@@ -4765,33 +5252,39 @@
4765
5252
  },
4766
5253
  {
4767
5254
  "kind": "variable",
4768
- "name": "zeroErrorDialog",
4769
- "description": "The zero ErrorDialog",
4770
- "privacy": "public"
5255
+ "name": "zeroErrorBoundary"
4771
5256
  }
4772
5257
  ],
4773
5258
  "exports": [
4774
5259
  {
4775
5260
  "kind": "js",
4776
- "name": "ErrorDialog",
5261
+ "name": "zeroErrorBoundaryShadowOptions",
4777
5262
  "declaration": {
4778
- "name": "ErrorDialog",
4779
- "module": "src/error-dialog/error-dialog.ts"
5263
+ "name": "zeroErrorBoundaryShadowOptions",
5264
+ "module": "src/error-boundary/error-boundary.ts"
4780
5265
  }
4781
5266
  },
4782
5267
  {
4783
5268
  "kind": "js",
4784
- "name": "zeroErrorDialog",
5269
+ "name": "ErrorBoundary",
4785
5270
  "declaration": {
4786
- "name": "zeroErrorDialog",
4787
- "module": "src/error-dialog/error-dialog.ts"
5271
+ "name": "ErrorBoundary",
5272
+ "module": "src/error-boundary/error-boundary.ts"
5273
+ }
5274
+ },
5275
+ {
5276
+ "kind": "js",
5277
+ "name": "zeroErrorBoundary",
5278
+ "declaration": {
5279
+ "name": "zeroErrorBoundary",
5280
+ "module": "src/error-boundary/error-boundary.ts"
4788
5281
  }
4789
5282
  }
4790
5283
  ]
4791
5284
  },
4792
5285
  {
4793
5286
  "kind": "javascript-module",
4794
- "path": "src/error-dialog/index.ts",
5287
+ "path": "src/error-boundary/index.ts",
4795
5288
  "declarations": [],
4796
5289
  "exports": [
4797
5290
  {
@@ -4799,14 +5292,14 @@
4799
5292
  "name": "*",
4800
5293
  "declaration": {
4801
5294
  "name": "*",
4802
- "package": "./error-dialog"
5295
+ "package": "./error-boundary"
4803
5296
  }
4804
5297
  }
4805
5298
  ]
4806
5299
  },
4807
5300
  {
4808
5301
  "kind": "javascript-module",
4809
- "path": "src/dropdown-menu/dropdown-menu.stories.ts",
5302
+ "path": "src/error-dialog/error-dialog.stories.ts",
4810
5303
  "declarations": [
4811
5304
  {
4812
5305
  "kind": "variable",
@@ -4814,7 +5307,7 @@
4814
5307
  "type": {
4815
5308
  "text": "Meta"
4816
5309
  },
4817
- "default": "{\n title: 'Dropdown Menu',\n component: 'zero-dropdown-menu',\n}"
5310
+ "default": "{\n title: 'Error Dialog',\n component: 'zero-error-dialog',\n}"
4818
5311
  },
4819
5312
  {
4820
5313
  "kind": "variable",
@@ -4822,7 +5315,7 @@
4822
5315
  "type": {
4823
5316
  "text": "StoryObj"
4824
5317
  },
4825
- "default": "{\n args: {\n items: zeroItems,\n dropdownOpenerText: 'Dropdown menu',\n },\n render: ({ dropdownOpenerText, items }) =>\n html`\n <div>\n <zero-dropdown-menu name=\"${dropdownOpenerText}\" .items=${items}></zero-dropdown-menu>\n </div>\n `,\n}"
5318
+ "default": "{\n args: {\n errorText:\n 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Lorem ipsum dolor sit amet',\n },\n render: ({ errorText }) => html`\n <zero-button @click=\"${() => showDialog(errorText)}\">Show Zero Dialog</zero-button>\n <div id=\"error-dialog-container\"></div>\n `,\n}"
4826
5319
  }
4827
5320
  ],
4828
5321
  "exports": [
@@ -4831,7 +5324,7 @@
4831
5324
  "name": "default",
4832
5325
  "declaration": {
4833
5326
  "name": "meta",
4834
- "module": "src/dropdown-menu/dropdown-menu.stories.ts"
5327
+ "module": "src/error-dialog/error-dialog.stories.ts"
4835
5328
  }
4836
5329
  },
4837
5330
  {
@@ -4839,63 +5332,24 @@
4839
5332
  "name": "Primary",
4840
5333
  "declaration": {
4841
5334
  "name": "Primary",
4842
- "module": "src/dropdown-menu/dropdown-menu.stories.ts"
4843
- }
4844
- }
4845
- ]
4846
- },
4847
- {
4848
- "kind": "javascript-module",
4849
- "path": "src/dropdown-menu/dropdown-menu.styles.ts",
4850
- "declarations": [
4851
- {
4852
- "kind": "function",
4853
- "name": "zeroDropdownMenuStyles",
4854
- "return": {
4855
- "type": {
4856
- "text": "ElementStyles"
4857
- }
4858
- },
4859
- "parameters": [
4860
- {
4861
- "name": "context",
4862
- "type": {
4863
- "text": "ElementDefinitionContext"
4864
- }
4865
- },
4866
- {
4867
- "name": "definition",
4868
- "type": {
4869
- "text": "FoundationElementDefinition"
4870
- }
4871
- }
4872
- ]
4873
- }
4874
- ],
4875
- "exports": [
4876
- {
4877
- "kind": "js",
4878
- "name": "zeroDropdownMenuStyles",
4879
- "declaration": {
4880
- "name": "zeroDropdownMenuStyles",
4881
- "module": "src/dropdown-menu/dropdown-menu.styles.ts"
5335
+ "module": "src/error-dialog/error-dialog.stories.ts"
4882
5336
  }
4883
5337
  }
4884
5338
  ]
4885
5339
  },
4886
5340
  {
4887
5341
  "kind": "javascript-module",
4888
- "path": "src/dropdown-menu/dropdown-menu.ts",
5342
+ "path": "src/error-dialog/error-dialog.ts",
4889
5343
  "declarations": [
4890
5344
  {
4891
5345
  "kind": "class",
4892
5346
  "description": "",
4893
- "name": "DropdownMenu",
5347
+ "name": "ErrorDialog",
4894
5348
  "superclass": {
4895
- "name": "FoundationDropdownMenu",
5349
+ "name": "FoundationErrorDialog",
4896
5350
  "package": "@genesislcap/foundation-ui"
4897
5351
  },
4898
- "tagName": "%%prefix%%-dropdown-menu",
5352
+ "tagName": "%%prefix%%-error-dialog",
4899
5353
  "customElement": true,
4900
5354
  "members": [
4901
5355
  {
@@ -5013,33 +5467,33 @@
5013
5467
  },
5014
5468
  {
5015
5469
  "kind": "variable",
5016
- "name": "zeroDropdownMenu",
5017
- "description": "The Zero Dropdown Menu",
5470
+ "name": "zeroErrorDialog",
5471
+ "description": "The zero ErrorDialog",
5018
5472
  "privacy": "public"
5019
5473
  }
5020
5474
  ],
5021
5475
  "exports": [
5022
5476
  {
5023
5477
  "kind": "js",
5024
- "name": "DropdownMenu",
5478
+ "name": "ErrorDialog",
5025
5479
  "declaration": {
5026
- "name": "DropdownMenu",
5027
- "module": "src/dropdown-menu/dropdown-menu.ts"
5480
+ "name": "ErrorDialog",
5481
+ "module": "src/error-dialog/error-dialog.ts"
5028
5482
  }
5029
5483
  },
5030
5484
  {
5031
5485
  "kind": "js",
5032
- "name": "zeroDropdownMenu",
5486
+ "name": "zeroErrorDialog",
5033
5487
  "declaration": {
5034
- "name": "zeroDropdownMenu",
5035
- "module": "src/dropdown-menu/dropdown-menu.ts"
5488
+ "name": "zeroErrorDialog",
5489
+ "module": "src/error-dialog/error-dialog.ts"
5036
5490
  }
5037
5491
  }
5038
5492
  ]
5039
5493
  },
5040
5494
  {
5041
5495
  "kind": "javascript-module",
5042
- "path": "src/dropdown-menu/index.ts",
5496
+ "path": "src/error-dialog/index.ts",
5043
5497
  "declarations": [],
5044
5498
  "exports": [
5045
5499
  {
@@ -5047,54 +5501,14 @@
5047
5501
  "name": "*",
5048
5502
  "declaration": {
5049
5503
  "name": "*",
5050
- "package": "./dropdown-menu"
5051
- }
5052
- },
5053
- {
5054
- "kind": "js",
5055
- "name": "*",
5056
- "declaration": {
5057
- "name": "*",
5058
- "package": "./dropdown-menu.styles"
5059
- }
5060
- },
5061
- {
5062
- "kind": "js",
5063
- "name": "zeroDropdownMenuTemplate",
5064
- "declaration": {
5065
- "name": "foundationDropdownMenuTemplate",
5066
- "package": "@genesislcap/foundation-ui"
5067
- }
5068
- },
5069
- {
5070
- "kind": "js",
5071
- "name": "getDropdownMenuTemplate",
5072
- "declaration": {
5073
- "name": "getDropdownMenuTemplate",
5074
- "package": "@genesislcap/foundation-ui"
5075
- }
5076
- },
5077
- {
5078
- "kind": "js",
5079
- "name": "extractMenuItems",
5080
- "declaration": {
5081
- "name": "extractMenuItems",
5082
- "package": "@genesislcap/foundation-ui"
5083
- }
5084
- },
5085
- {
5086
- "kind": "js",
5087
- "name": "dropdownMenuBaseStyles",
5088
- "declaration": {
5089
- "name": "dropdownMenuBaseStyles",
5090
- "package": "@genesislcap/foundation-ui"
5504
+ "package": "./error-dialog"
5091
5505
  }
5092
5506
  }
5093
5507
  ]
5094
5508
  },
5095
5509
  {
5096
5510
  "kind": "javascript-module",
5097
- "path": "src/dialog/dialog.stories.ts",
5511
+ "path": "src/file-upload/file-upload.stories.ts",
5098
5512
  "declarations": [
5099
5513
  {
5100
5514
  "kind": "variable",
@@ -5102,7 +5516,7 @@
5102
5516
  "type": {
5103
5517
  "text": "Meta"
5104
5518
  },
5105
- "default": "{\n title: 'Dialog',\n component: 'zero-dialog',\n}"
5519
+ "default": "{\n title: 'File Upload',\n component: 'zero-file-upload',\n}"
5106
5520
  },
5107
5521
  {
5108
5522
  "kind": "variable",
@@ -5110,7 +5524,7 @@
5110
5524
  "type": {
5111
5525
  "text": "StoryObj"
5112
5526
  },
5113
- "default": "{\n args: {\n dialogMaxWidth: '557px',\n dialogTitle: 'Dialog title',\n dialogInitialText: 'Some text in a Zero Dialog',\n dialogMainText: `Lorem ipsum dolor sit amet consectetur adipisicing elit. Quis similique iste ab sed\n voluptatem ut suscipit tenetur distinctio? Quo est debitis pariatur qui quisquam repudiandae\n at atque et quibusdam rerum, reprehenderit sed laborum officiis distinctio dolorum\n temporibus aperiam dolor consequatur perferendis aspernatur fugit repellendus asperiores,\n voluptas illo? Voluptatum, atque quidem?`,\n dialogCloseButtonText: 'Close this dialog',\n },\n render: ({\n dialogMaxWidth,\n dialogTitle,\n dialogInitialText,\n dialogMainText,\n dialogCloseButtonText,\n }) => html`\n <zero-button @click=\"${showDialog}\">Show Zero Dialog</zero-button>\n <zero-dialog style=\"--dialog-max-width: ${dialogMaxWidth};\">\n <h5 slot=\"top\">${dialogTitle}</h5>\n <p>${dialogInitialText}</p>\n <p>${dialogMainText}</p>\n <zero-divider slot=\"bottom\"></zero-divider>\n <zero-button appearance=\"primary-gradient\" slot=\"bottom\" @click=\"${closeDialog}\">\n ${dialogCloseButtonText}\n </zero-button>\n </zero-dialog>\n `,\n}"
5527
+ "default": "{\n render: () => html`\n <div style=\"min-height: 300px;\">\n <zero-file-upload label=\"Select Files\"></zero-file-upload>\n </div>\n `,\n}"
5114
5528
  }
5115
5529
  ],
5116
5530
  "exports": [
@@ -5119,7 +5533,7 @@
5119
5533
  "name": "default",
5120
5534
  "declaration": {
5121
5535
  "name": "meta",
5122
- "module": "src/dialog/dialog.stories.ts"
5536
+ "module": "src/file-upload/file-upload.stories.ts"
5123
5537
  }
5124
5538
  },
5125
5539
  {
@@ -5127,191 +5541,78 @@
5127
5541
  "name": "Primary",
5128
5542
  "declaration": {
5129
5543
  "name": "Primary",
5130
- "module": "src/dialog/dialog.stories.ts"
5544
+ "module": "src/file-upload/file-upload.stories.ts"
5131
5545
  }
5132
5546
  }
5133
5547
  ]
5134
5548
  },
5135
5549
  {
5136
5550
  "kind": "javascript-module",
5137
- "path": "src/dialog/dialog.styles.ts",
5551
+ "path": "src/file-upload/file-upload.styles.ts",
5138
5552
  "declarations": [
5139
5553
  {
5140
5554
  "kind": "variable",
5141
- "name": "zeroDialogStyles",
5142
- "default": "css`\n ${foundationDialogStyles}\n :host {\n --dialog-background: ${neutralLayer2};\n }\n\n dialog {\n position: fixed;\n top: 0;\n bottom: 0;\n color: rgb(255 255 255 / 30%);\n border-radius: calc(var(--control-corner-radius) * 1px);\n border: 1px solid ${ColorHEX.lightGrey};\n text-align: left;\n line-height: normal;\n box-shadow: 0 2px 15px 0 rgb(0 0 0 / 35%);\n }\n\n .top {\n display: flex;\n align-items: center;\n justify-content: space-between;\n color: ${ColorHEX.almostWhite};\n margin-bottom: calc(var(--design-unit) * 2px);\n }\n\n .bottom {\n display: flex;\n flex-wrap: wrap;\n justify-content: flex-end;\n color: ${ColorHEX.almostWhite};\n }\n\n :host slot:first-of-type {\n color: ${neutralForegroundRest};\n }\n\n ::slotted(zero-button) {\n margin-top: calc(var(--design-unit) * 4px - 1px);\n }\n\n .content-wrapper {\n min-width: var(--dialog-min-width);\n min-height: var(--dialog-min-height);\n height: fit-content;\n width: fit-content;\n max-width: var(--dialog-max-width);\n max-height: var(--dialog-max-height);\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: stretch;\n }\n\n .close-icon:hover svg {\n background-color: ${whiteWebRGBA(0.05)};\n }\n\n .close-icon:hover svg g path {\n fill: ${whiteWebRGBA(1)};\n }\n\n .close-icon:active svg {\n background-color: ${defaultDialogActiveBGColor};\n }\n\n .close-icon:active svg g path {\n fill: ${whiteWebRGBA(0.33)};\n }\n`"
5555
+ "name": "zeroFileUploadStyles",
5556
+ "default": "css`\n ${foundationFileUploadStyles}\n ::-webkit-scrollbar {\n width: 12px;\n }\n\n ::-webkit-scrollbar-track {\n background: rgb(31 33 38);\n }\n\n ::-webkit-scrollbar-thumb {\n width: 8px;\n border-radius: 10px;\n box-shadow: inset 0 0 6px rgba(0 0 0 / 30%);\n background-color: var(--neutral-color);\n border: 3px solid rgb(31 33 38);\n }\n`"
5143
5557
  }
5144
5558
  ],
5145
5559
  "exports": [
5146
5560
  {
5147
5561
  "kind": "js",
5148
- "name": "zeroDialogStyles",
5562
+ "name": "zeroFileUploadStyles",
5149
5563
  "declaration": {
5150
- "name": "zeroDialogStyles",
5151
- "module": "src/dialog/dialog.styles.ts"
5564
+ "name": "zeroFileUploadStyles",
5565
+ "module": "src/file-upload/file-upload.styles.ts"
5152
5566
  }
5153
5567
  }
5154
5568
  ]
5155
5569
  },
5156
5570
  {
5157
5571
  "kind": "javascript-module",
5158
- "path": "src/dialog/dialog.ts",
5572
+ "path": "src/file-upload/file-upload.template.ts",
5159
5573
  "declarations": [
5160
5574
  {
5161
5575
  "kind": "variable",
5162
- "name": "defaultDialogConfig",
5163
- "default": "foundationConfig"
5164
- },
5576
+ "name": "fileUploadTemplate",
5577
+ "default": "html<FileUpload>`\n ${getPrefixedFileUpload('zero')}\n`"
5578
+ }
5579
+ ],
5580
+ "exports": [
5581
+ {
5582
+ "kind": "js",
5583
+ "name": "fileUploadTemplate",
5584
+ "declaration": {
5585
+ "name": "fileUploadTemplate",
5586
+ "module": "src/file-upload/file-upload.template.ts"
5587
+ }
5588
+ }
5589
+ ]
5590
+ },
5591
+ {
5592
+ "kind": "javascript-module",
5593
+ "path": "src/file-upload/file-upload.ts",
5594
+ "declarations": [
5165
5595
  {
5166
5596
  "kind": "variable",
5167
- "name": "zeroDialogTemplate",
5168
- "default": "foundationDialogTemplate"
5597
+ "name": "defaultFileUploadConfig",
5598
+ "default": "foundationConfig"
5169
5599
  },
5170
5600
  {
5171
5601
  "kind": "variable",
5172
- "name": "zeroDialogShadowOptions",
5173
- "default": "foundationDialogShadowOptions"
5602
+ "name": "zeroFileUploadShadowOptions",
5603
+ "default": "foundationFileUploadShadowOptions"
5174
5604
  },
5175
5605
  {
5176
5606
  "kind": "class",
5177
5607
  "description": "",
5178
- "name": "Dialog",
5608
+ "name": "FileUpload",
5179
5609
  "superclass": {
5180
- "name": "FoundationDialog",
5610
+ "name": "FoundationFileUpload",
5181
5611
  "package": "@genesislcap/foundation-ui"
5182
5612
  },
5183
- "tagName": "%%prefix%%-dialog",
5613
+ "tagName": "%%prefix%%-file-upload",
5184
5614
  "customElement": true,
5185
- "attributes": [
5186
- {
5187
- "name": "position",
5188
- "type": {
5189
- "text": "'centre' | 'left' | 'right'"
5190
- },
5191
- "default": "'centre'",
5192
- "fieldName": "position",
5193
- "inheritedFrom": {
5194
- "name": "DialogElement",
5195
- "module": "src/dialog/dialog.ts"
5196
- }
5197
- },
5198
- {
5199
- "name": "show-close-icon",
5200
- "type": {
5201
- "text": "boolean"
5202
- },
5203
- "default": "true",
5204
- "description": "Whether or not to show the close icon",
5205
- "fieldName": "showCloseIcon",
5206
- "inheritedFrom": {
5207
- "name": "DialogElement",
5208
- "module": "src/dialog/dialog.ts"
5209
- }
5210
- }
5211
- ],
5212
5615
  "members": [
5213
- {
5214
- "kind": "field",
5215
- "name": "mainElement",
5216
- "type": {
5217
- "text": "HTMLDialogElement"
5218
- },
5219
- "description": "A reference to the dialog element\nin the component Shadow DOM.",
5220
- "inheritedFrom": {
5221
- "name": "DialogElement",
5222
- "module": "src/dialog/dialog.ts"
5223
- }
5224
- },
5225
- {
5226
- "kind": "field",
5227
- "name": "position",
5228
- "type": {
5229
- "text": "'centre' | 'left' | 'right'"
5230
- },
5231
- "default": "'centre'",
5232
- "inheritedFrom": {
5233
- "name": "DialogElement",
5234
- "module": "src/dialog/dialog.ts"
5235
- }
5236
- },
5237
- {
5238
- "kind": "field",
5239
- "name": "showCloseIcon",
5240
- "type": {
5241
- "text": "boolean"
5242
- },
5243
- "default": "true",
5244
- "description": "Whether or not to show the close icon",
5245
- "inheritedFrom": {
5246
- "name": "DialogElement",
5247
- "module": "src/dialog/dialog.ts"
5248
- }
5249
- },
5250
- {
5251
- "kind": "field",
5252
- "name": "onShowCallback",
5253
- "type": {
5254
- "text": "() => void"
5255
- },
5256
- "description": "Callback to run *before* HTMLDialogElement is shown",
5257
- "inheritedFrom": {
5258
- "name": "DialogElement",
5259
- "module": "src/dialog/dialog.ts"
5260
- }
5261
- },
5262
- {
5263
- "kind": "field",
5264
- "name": "onCloseCallback",
5265
- "type": {
5266
- "text": "() => void"
5267
- },
5268
- "description": "Callback to run *after* HTMLDialogElement is closed",
5269
- "inheritedFrom": {
5270
- "name": "DialogElement",
5271
- "module": "src/dialog/dialog.ts"
5272
- }
5273
- },
5274
- {
5275
- "kind": "field",
5276
- "name": "open",
5277
- "type": {
5278
- "text": "boolean"
5279
- },
5280
- "description": "Determine if the dialog is showing or closed.",
5281
- "readonly": true,
5282
- "inheritedFrom": {
5283
- "name": "DialogElement",
5284
- "module": "src/dialog/dialog.ts"
5285
- }
5286
- },
5287
- {
5288
- "kind": "method",
5289
- "name": "show",
5290
- "return": {
5291
- "type": {
5292
- "text": "void"
5293
- }
5294
- },
5295
- "description": "Show the HTMLDialogElement and its contents",
5296
- "inheritedFrom": {
5297
- "name": "DialogElement",
5298
- "module": "src/dialog/dialog.ts"
5299
- }
5300
- },
5301
- {
5302
- "kind": "method",
5303
- "name": "close",
5304
- "return": {
5305
- "type": {
5306
- "text": "void"
5307
- }
5308
- },
5309
- "description": "Remove the HTMLDialogElement from display",
5310
- "inheritedFrom": {
5311
- "name": "DialogElement",
5312
- "module": "src/dialog/dialog.ts"
5313
- }
5314
- },
5315
5616
  {
5316
5617
  "kind": "field",
5317
5618
  "name": "_presentation",
@@ -5427,57 +5728,49 @@
5427
5728
  },
5428
5729
  {
5429
5730
  "kind": "variable",
5430
- "name": "zeroDialog",
5431
- "description": "The Zero Dialog",
5731
+ "name": "zeroFileUpload",
5732
+ "description": "The Zero FileUpload",
5432
5733
  "privacy": "public"
5433
5734
  }
5434
5735
  ],
5435
5736
  "exports": [
5436
5737
  {
5437
5738
  "kind": "js",
5438
- "name": "defaultDialogConfig",
5439
- "declaration": {
5440
- "name": "defaultDialogConfig",
5441
- "module": "src/dialog/dialog.ts"
5442
- }
5443
- },
5444
- {
5445
- "kind": "js",
5446
- "name": "zeroDialogTemplate",
5739
+ "name": "defaultFileUploadConfig",
5447
5740
  "declaration": {
5448
- "name": "zeroDialogTemplate",
5449
- "module": "src/dialog/dialog.ts"
5741
+ "name": "defaultFileUploadConfig",
5742
+ "module": "src/file-upload/file-upload.ts"
5450
5743
  }
5451
5744
  },
5452
5745
  {
5453
5746
  "kind": "js",
5454
- "name": "zeroDialogShadowOptions",
5747
+ "name": "zeroFileUploadShadowOptions",
5455
5748
  "declaration": {
5456
- "name": "zeroDialogShadowOptions",
5457
- "module": "src/dialog/dialog.ts"
5749
+ "name": "zeroFileUploadShadowOptions",
5750
+ "module": "src/file-upload/file-upload.ts"
5458
5751
  }
5459
5752
  },
5460
5753
  {
5461
5754
  "kind": "js",
5462
- "name": "Dialog",
5755
+ "name": "FileUpload",
5463
5756
  "declaration": {
5464
- "name": "Dialog",
5465
- "module": "src/dialog/dialog.ts"
5757
+ "name": "FileUpload",
5758
+ "module": "src/file-upload/file-upload.ts"
5466
5759
  }
5467
5760
  },
5468
5761
  {
5469
5762
  "kind": "js",
5470
- "name": "zeroDialog",
5763
+ "name": "zeroFileUpload",
5471
5764
  "declaration": {
5472
- "name": "zeroDialog",
5473
- "module": "src/dialog/dialog.ts"
5765
+ "name": "zeroFileUpload",
5766
+ "module": "src/file-upload/file-upload.ts"
5474
5767
  }
5475
5768
  }
5476
5769
  ]
5477
5770
  },
5478
5771
  {
5479
5772
  "kind": "javascript-module",
5480
- "path": "src/dialog/index.ts",
5773
+ "path": "src/file-upload/index.ts",
5481
5774
  "declarations": [],
5482
5775
  "exports": [
5483
5776
  {
@@ -5485,7 +5778,7 @@
5485
5778
  "name": "*",
5486
5779
  "declaration": {
5487
5780
  "name": "*",
5488
- "package": "./dialog"
5781
+ "package": "./file-upload"
5489
5782
  }
5490
5783
  },
5491
5784
  {
@@ -5493,14 +5786,14 @@
5493
5786
  "name": "*",
5494
5787
  "declaration": {
5495
5788
  "name": "*",
5496
- "package": "./dialog.styles"
5789
+ "package": "./file-upload.styles"
5497
5790
  }
5498
5791
  },
5499
5792
  {
5500
5793
  "kind": "js",
5501
- "name": "zeroDialogTemplate",
5794
+ "name": "zeroFileUploadTemplate",
5502
5795
  "declaration": {
5503
- "name": "foundationDialogTemplate",
5796
+ "name": "foundationFileUploadTemplate",
5504
5797
  "package": "@genesislcap/foundation-ui"
5505
5798
  }
5506
5799
  }
@@ -5508,7 +5801,7 @@
5508
5801
  },
5509
5802
  {
5510
5803
  "kind": "javascript-module",
5511
- "path": "src/file-upload/file-upload.stories.ts",
5804
+ "path": "src/filter/filter.stories.ts",
5512
5805
  "declarations": [
5513
5806
  {
5514
5807
  "kind": "variable",
@@ -5516,7 +5809,7 @@
5516
5809
  "type": {
5517
5810
  "text": "Meta"
5518
5811
  },
5519
- "default": "{\n title: 'File Upload',\n component: 'zero-file-upload',\n}"
5812
+ "default": "{\n title: 'Filter',\n component: 'zero-filter',\n}"
5520
5813
  },
5521
5814
  {
5522
5815
  "kind": "variable",
@@ -5524,7 +5817,7 @@
5524
5817
  "type": {
5525
5818
  "text": "StoryObj"
5526
5819
  },
5527
- "default": "{\n render: () => html`\n <div style=\"min-height: 300px;\">\n <zero-file-upload label=\"Select Files\"></zero-file-upload>\n </div>\n `,\n}"
5820
+ "default": "{\n render: () =>\n html`\n <zero-filter type=\"text\" fieldName=\"SOME_TEXT_FIELD\"></zero-filter>\n <zero-filter type=\"boolean\" fieldName=\"SOME_BOOLEAN_FIELD\"></zero-filter>\n <zero-filter type=\"date\" fieldName=\"SOME_DATE_FIELD\"></zero-filter>\n <zero-filter type=\"number\" fieldName=\"SOME_NUMERIC_FIELD\"></zero-filter>\n `,\n}"
5528
5821
  }
5529
5822
  ],
5530
5823
  "exports": [
@@ -5533,7 +5826,7 @@
5533
5826
  "name": "default",
5534
5827
  "declaration": {
5535
5828
  "name": "meta",
5536
- "module": "src/file-upload/file-upload.stories.ts"
5829
+ "module": "src/filter/filter.stories.ts"
5537
5830
  }
5538
5831
  },
5539
5832
  {
@@ -5541,78 +5834,117 @@
5541
5834
  "name": "Primary",
5542
5835
  "declaration": {
5543
5836
  "name": "Primary",
5544
- "module": "src/file-upload/file-upload.stories.ts"
5545
- }
5546
- }
5547
- ]
5548
- },
5549
- {
5550
- "kind": "javascript-module",
5551
- "path": "src/file-upload/file-upload.styles.ts",
5552
- "declarations": [
5553
- {
5554
- "kind": "variable",
5555
- "name": "zeroFileUploadStyles",
5556
- "default": "css`\n ${foundationFileUploadStyles}\n ::-webkit-scrollbar {\n width: 12px;\n }\n\n ::-webkit-scrollbar-track {\n background: rgb(31 33 38);\n }\n\n ::-webkit-scrollbar-thumb {\n width: 8px;\n border-radius: 10px;\n box-shadow: inset 0 0 6px rgba(0 0 0 / 30%);\n background-color: var(--neutral-color);\n border: 3px solid rgb(31 33 38);\n }\n`"
5557
- }
5558
- ],
5559
- "exports": [
5560
- {
5561
- "kind": "js",
5562
- "name": "zeroFileUploadStyles",
5563
- "declaration": {
5564
- "name": "zeroFileUploadStyles",
5565
- "module": "src/file-upload/file-upload.styles.ts"
5837
+ "module": "src/filter/filter.stories.ts"
5566
5838
  }
5567
5839
  }
5568
5840
  ]
5569
5841
  },
5570
5842
  {
5571
5843
  "kind": "javascript-module",
5572
- "path": "src/file-upload/file-upload.template.ts",
5844
+ "path": "src/filter/filter.template.ts",
5573
5845
  "declarations": [
5574
5846
  {
5575
5847
  "kind": "variable",
5576
- "name": "fileUploadTemplate",
5577
- "default": "html<FileUpload>`\n ${getPrefixedFileUpload('zero')}\n`"
5848
+ "name": "zeroFilterTemplate",
5849
+ "type": {
5850
+ "text": "ViewTemplate<Filter>"
5851
+ },
5852
+ "default": "html`\n <div class=\"filter-wrapper\">${(x) => selectTemplate(x)}</div>\n`"
5578
5853
  }
5579
5854
  ],
5580
5855
  "exports": [
5581
5856
  {
5582
5857
  "kind": "js",
5583
- "name": "fileUploadTemplate",
5858
+ "name": "zeroFilterTemplate",
5584
5859
  "declaration": {
5585
- "name": "fileUploadTemplate",
5586
- "module": "src/file-upload/file-upload.template.ts"
5860
+ "name": "zeroFilterTemplate",
5861
+ "module": "src/filter/filter.template.ts"
5587
5862
  }
5588
5863
  }
5589
5864
  ]
5590
5865
  },
5591
5866
  {
5592
5867
  "kind": "javascript-module",
5593
- "path": "src/file-upload/file-upload.ts",
5594
- "declarations": [
5595
- {
5596
- "kind": "variable",
5597
- "name": "defaultFileUploadConfig",
5598
- "default": "foundationConfig"
5599
- },
5600
- {
5601
- "kind": "variable",
5602
- "name": "zeroFileUploadShadowOptions",
5603
- "default": "foundationFileUploadShadowOptions"
5604
- },
5605
- {
5606
- "kind": "class",
5607
- "description": "",
5608
- "name": "FileUpload",
5609
- "superclass": {
5610
- "name": "FoundationFileUpload",
5611
- "package": "@genesislcap/foundation-ui"
5612
- },
5613
- "tagName": "%%prefix%%-file-upload",
5614
- "customElement": true,
5868
+ "path": "src/filter/filter.ts",
5869
+ "declarations": [
5870
+ {
5871
+ "kind": "class",
5872
+ "description": "",
5873
+ "name": "Filter",
5615
5874
  "members": [
5875
+ {
5876
+ "kind": "field",
5877
+ "name": "textFilterField",
5878
+ "type": {
5879
+ "text": "TextField"
5880
+ },
5881
+ "privacy": "public"
5882
+ },
5883
+ {
5884
+ "kind": "field",
5885
+ "name": "numFilterFieldMin",
5886
+ "type": {
5887
+ "text": "TextField"
5888
+ },
5889
+ "privacy": "public"
5890
+ },
5891
+ {
5892
+ "kind": "field",
5893
+ "name": "numFilterFieldMax",
5894
+ "type": {
5895
+ "text": "TextField"
5896
+ },
5897
+ "privacy": "public"
5898
+ },
5899
+ {
5900
+ "kind": "field",
5901
+ "name": "dateFilterFieldMin",
5902
+ "type": {
5903
+ "text": "TextField"
5904
+ },
5905
+ "privacy": "public"
5906
+ },
5907
+ {
5908
+ "kind": "field",
5909
+ "name": "dateFilterFieldMax",
5910
+ "type": {
5911
+ "text": "TextField"
5912
+ },
5913
+ "privacy": "public"
5914
+ },
5915
+ {
5916
+ "kind": "field",
5917
+ "name": "fieldName",
5918
+ "type": {
5919
+ "text": "string"
5920
+ }
5921
+ },
5922
+ {
5923
+ "kind": "field",
5924
+ "name": "label",
5925
+ "type": {
5926
+ "text": "string"
5927
+ }
5928
+ },
5929
+ {
5930
+ "kind": "field",
5931
+ "name": "type"
5932
+ },
5933
+ {
5934
+ "kind": "field",
5935
+ "name": "target",
5936
+ "type": {
5937
+ "text": "string"
5938
+ },
5939
+ "description": "Will be included in event emmissions.\nUsually set to the id of the target datasource.\nUsefull when we have multiple grids in the same page."
5940
+ },
5941
+ {
5942
+ "kind": "field",
5943
+ "name": "enumFilterOptions",
5944
+ "type": {
5945
+ "text": "any[]"
5946
+ }
5947
+ },
5616
5948
  {
5617
5949
  "kind": "field",
5618
5950
  "name": "_presentation",
@@ -5724,53 +6056,69 @@
5724
6056
  "module": "src/foundation-element/foundation-element.ts"
5725
6057
  }
5726
6058
  }
5727
- ]
6059
+ ],
6060
+ "attributes": [
6061
+ {
6062
+ "name": "fieldName",
6063
+ "type": {
6064
+ "text": "string"
6065
+ },
6066
+ "fieldName": "fieldName"
6067
+ },
6068
+ {
6069
+ "name": "label",
6070
+ "type": {
6071
+ "text": "string"
6072
+ },
6073
+ "fieldName": "label"
6074
+ },
6075
+ {
6076
+ "name": "type",
6077
+ "fieldName": "type"
6078
+ },
6079
+ {
6080
+ "name": "target",
6081
+ "type": {
6082
+ "text": "string"
6083
+ },
6084
+ "description": "Will be included in event emmissions.\nUsually set to the id of the target datasource.\nUsefull when we have multiple grids in the same page.",
6085
+ "fieldName": "target"
6086
+ }
6087
+ ],
6088
+ "superclass": {
6089
+ "name": "FoundationFilter",
6090
+ "package": "@genesislcap/foundation-ui"
6091
+ },
6092
+ "tagName": "%%prefix%%-filter",
6093
+ "customElement": true
5728
6094
  },
5729
6095
  {
5730
6096
  "kind": "variable",
5731
- "name": "zeroFileUpload",
5732
- "description": "The Zero FileUpload",
5733
- "privacy": "public"
6097
+ "name": "zeroFilter"
5734
6098
  }
5735
6099
  ],
5736
6100
  "exports": [
5737
6101
  {
5738
6102
  "kind": "js",
5739
- "name": "defaultFileUploadConfig",
5740
- "declaration": {
5741
- "name": "defaultFileUploadConfig",
5742
- "module": "src/file-upload/file-upload.ts"
5743
- }
5744
- },
5745
- {
5746
- "kind": "js",
5747
- "name": "zeroFileUploadShadowOptions",
5748
- "declaration": {
5749
- "name": "zeroFileUploadShadowOptions",
5750
- "module": "src/file-upload/file-upload.ts"
5751
- }
5752
- },
5753
- {
5754
- "kind": "js",
5755
- "name": "FileUpload",
6103
+ "name": "Filter",
5756
6104
  "declaration": {
5757
- "name": "FileUpload",
5758
- "module": "src/file-upload/file-upload.ts"
6105
+ "name": "Filter",
6106
+ "module": "src/filter/filter.ts"
5759
6107
  }
5760
6108
  },
5761
6109
  {
5762
6110
  "kind": "js",
5763
- "name": "zeroFileUpload",
6111
+ "name": "zeroFilter",
5764
6112
  "declaration": {
5765
- "name": "zeroFileUpload",
5766
- "module": "src/file-upload/file-upload.ts"
6113
+ "name": "zeroFilter",
6114
+ "module": "src/filter/filter.ts"
5767
6115
  }
5768
6116
  }
5769
6117
  ]
5770
6118
  },
5771
6119
  {
5772
6120
  "kind": "javascript-module",
5773
- "path": "src/file-upload/index.ts",
6121
+ "path": "src/filter/index.ts",
5774
6122
  "declarations": [],
5775
6123
  "exports": [
5776
6124
  {
@@ -5778,7 +6126,7 @@
5778
6126
  "name": "*",
5779
6127
  "declaration": {
5780
6128
  "name": "*",
5781
- "package": "./file-upload"
6129
+ "package": "./filter"
5782
6130
  }
5783
6131
  },
5784
6132
  {
@@ -5786,14 +6134,14 @@
5786
6134
  "name": "*",
5787
6135
  "declaration": {
5788
6136
  "name": "*",
5789
- "package": "./file-upload.styles"
6137
+ "package": "./filter.template"
5790
6138
  }
5791
6139
  },
5792
6140
  {
5793
6141
  "kind": "js",
5794
- "name": "zeroFileUploadTemplate",
6142
+ "name": "zeroFilterStyles",
5795
6143
  "declaration": {
5796
- "name": "foundationFileUploadTemplate",
6144
+ "name": "foundationFilterStyles",
5797
6145
  "package": "@genesislcap/foundation-ui"
5798
6146
  }
5799
6147
  }
@@ -5801,7 +6149,7 @@
5801
6149
  },
5802
6150
  {
5803
6151
  "kind": "javascript-module",
5804
- "path": "src/filter/filter.stories.ts",
6152
+ "path": "src/filter-bar/filter-bar.stories.ts",
5805
6153
  "declarations": [
5806
6154
  {
5807
6155
  "kind": "variable",
@@ -5809,7 +6157,7 @@
5809
6157
  "type": {
5810
6158
  "text": "Meta"
5811
6159
  },
5812
- "default": "{\n title: 'Filter',\n component: 'zero-filter',\n}"
6160
+ "default": "{\n title: 'Filter Bar',\n component: 'zero-filter-bar',\n}"
5813
6161
  },
5814
6162
  {
5815
6163
  "kind": "variable",
@@ -5817,7 +6165,7 @@
5817
6165
  "type": {
5818
6166
  "text": "StoryObj"
5819
6167
  },
5820
- "default": "{\n render: () =>\n html`\n <zero-filter type=\"text\" fieldName=\"SOME_TEXT_FIELD\"></zero-filter>\n <zero-filter type=\"boolean\" fieldName=\"SOME_BOOLEAN_FIELD\"></zero-filter>\n <zero-filter type=\"date\" fieldName=\"SOME_DATE_FIELD\"></zero-filter>\n <zero-filter type=\"number\" fieldName=\"SOME_NUMERIC_FIELD\"></zero-filter>\n `,\n}"
6168
+ "default": "{\n render: () =>\n html`\n <zero-filter-bar\n resource=\"ALL_PROCESSES_STATUS\"\n only=\"PROCESS_PORT, START_TIME, PROCESS_NAME, DATADUMP\"\n ></zero-filter-bar>\n `,\n}"
5821
6169
  }
5822
6170
  ],
5823
6171
  "exports": [
@@ -5826,7 +6174,7 @@
5826
6174
  "name": "default",
5827
6175
  "declaration": {
5828
6176
  "name": "meta",
5829
- "module": "src/filter/filter.stories.ts"
6177
+ "module": "src/filter-bar/filter-bar.stories.ts"
5830
6178
  }
5831
6179
  },
5832
6180
  {
@@ -5834,116 +6182,143 @@
5834
6182
  "name": "Primary",
5835
6183
  "declaration": {
5836
6184
  "name": "Primary",
5837
- "module": "src/filter/filter.stories.ts"
6185
+ "module": "src/filter-bar/filter-bar.stories.ts"
5838
6186
  }
5839
6187
  }
5840
6188
  ]
5841
6189
  },
5842
6190
  {
5843
6191
  "kind": "javascript-module",
5844
- "path": "src/filter/filter.template.ts",
6192
+ "path": "src/filter-bar/filter-bar.styles.ts",
6193
+ "declarations": [
6194
+ {
6195
+ "kind": "function",
6196
+ "name": "zeroFilterBarStyles",
6197
+ "return": {
6198
+ "type": {
6199
+ "text": "ElementStyles"
6200
+ }
6201
+ },
6202
+ "parameters": [
6203
+ {
6204
+ "name": "context",
6205
+ "type": {
6206
+ "text": "ElementDefinitionContext"
6207
+ }
6208
+ },
6209
+ {
6210
+ "name": "definition",
6211
+ "type": {
6212
+ "text": "FoundationElementDefinition"
6213
+ }
6214
+ }
6215
+ ]
6216
+ }
6217
+ ],
6218
+ "exports": [
6219
+ {
6220
+ "kind": "js",
6221
+ "name": "zeroFilterBarStyles",
6222
+ "declaration": {
6223
+ "name": "zeroFilterBarStyles",
6224
+ "module": "src/filter-bar/filter-bar.styles.ts"
6225
+ }
6226
+ }
6227
+ ]
6228
+ },
6229
+ {
6230
+ "kind": "javascript-module",
6231
+ "path": "src/filter-bar/filter-bar.template.ts",
5845
6232
  "declarations": [
5846
6233
  {
5847
6234
  "kind": "variable",
5848
- "name": "zeroFilterTemplate",
6235
+ "name": "zeroFilterBarTemplate",
5849
6236
  "type": {
5850
- "text": "ViewTemplate<Filter>"
6237
+ "text": "ViewTemplate<FilterBar>"
5851
6238
  },
5852
- "default": "html`\n <div class=\"filter-wrapper\">${(x) => selectTemplate(x)}</div>\n`"
6239
+ "default": "html`\n ${filterBarTemplate}\n`"
5853
6240
  }
5854
6241
  ],
5855
6242
  "exports": [
5856
6243
  {
5857
6244
  "kind": "js",
5858
- "name": "zeroFilterTemplate",
6245
+ "name": "zeroFilterBarTemplate",
5859
6246
  "declaration": {
5860
- "name": "zeroFilterTemplate",
5861
- "module": "src/filter/filter.template.ts"
6247
+ "name": "zeroFilterBarTemplate",
6248
+ "module": "src/filter-bar/filter-bar.template.ts"
5862
6249
  }
5863
6250
  }
5864
6251
  ]
5865
6252
  },
5866
6253
  {
5867
6254
  "kind": "javascript-module",
5868
- "path": "src/filter/filter.ts",
6255
+ "path": "src/filter-bar/filter-bar.ts",
5869
6256
  "declarations": [
5870
6257
  {
5871
6258
  "kind": "class",
5872
6259
  "description": "",
5873
- "name": "Filter",
6260
+ "name": "FilterBar",
5874
6261
  "members": [
5875
6262
  {
5876
6263
  "kind": "field",
5877
- "name": "textFilterField",
5878
- "type": {
5879
- "text": "TextField"
5880
- },
5881
- "privacy": "public"
5882
- },
5883
- {
5884
- "kind": "field",
5885
- "name": "numFilterFieldMin",
5886
- "type": {
5887
- "text": "TextField"
5888
- },
5889
- "privacy": "public"
5890
- },
5891
- {
5892
- "kind": "field",
5893
- "name": "numFilterFieldMax",
6264
+ "name": "resource",
5894
6265
  "type": {
5895
- "text": "TextField"
5896
- },
5897
- "privacy": "public"
6266
+ "text": "string"
6267
+ }
5898
6268
  },
5899
6269
  {
5900
6270
  "kind": "field",
5901
- "name": "dateFilterFieldMin",
6271
+ "name": "only",
5902
6272
  "type": {
5903
- "text": "TextField"
6273
+ "text": "string"
5904
6274
  },
5905
- "privacy": "public"
6275
+ "description": "Only generate filters for the specified fields, provided as a comma separated list.\nDefault behavior (if \"only\" is not set) is to generate filters for all fields based on metadata."
5906
6276
  },
5907
6277
  {
5908
6278
  "kind": "field",
5909
- "name": "dateFilterFieldMax",
6279
+ "name": "labels",
5910
6280
  "type": {
5911
- "text": "TextField"
6281
+ "text": "string"
5912
6282
  },
5913
- "privacy": "public"
6283
+ "description": "Labels for the specified fields, to be used alongside \"only\" prop."
5914
6284
  },
5915
6285
  {
5916
6286
  "kind": "field",
5917
- "name": "fieldName",
6287
+ "name": "target",
5918
6288
  "type": {
5919
6289
  "text": "string"
5920
- }
6290
+ },
6291
+ "description": "Will be included in event emmissions.\nUsually set to the id of the target datasource.\nUsefull when we have multiple grids in the same page."
5921
6292
  },
5922
6293
  {
5923
6294
  "kind": "field",
5924
- "name": "label",
6295
+ "name": "ready",
5925
6296
  "type": {
5926
- "text": "string"
6297
+ "text": "boolean"
5927
6298
  }
5928
6299
  },
5929
6300
  {
5930
6301
  "kind": "field",
5931
- "name": "type"
6302
+ "name": "fields",
6303
+ "type": {
6304
+ "text": "MetadataDetail[]"
6305
+ }
5932
6306
  },
5933
6307
  {
5934
6308
  "kind": "field",
5935
- "name": "target",
6309
+ "name": "filterGrid",
5936
6310
  "type": {
5937
- "text": "string"
6311
+ "text": "HTMLDivElement"
5938
6312
  },
5939
- "description": "Will be included in event emmissions.\nUsually set to the id of the target datasource.\nUsefull when we have multiple grids in the same page."
6313
+ "privacy": "public"
5940
6314
  },
5941
6315
  {
5942
6316
  "kind": "field",
5943
- "name": "enumFilterOptions",
6317
+ "name": "collapsed",
5944
6318
  "type": {
5945
- "text": "any[]"
5946
- }
6319
+ "text": "boolean"
6320
+ },
6321
+ "default": "true"
5947
6322
  },
5948
6323
  {
5949
6324
  "kind": "field",
@@ -6059,22 +6434,27 @@
6059
6434
  ],
6060
6435
  "attributes": [
6061
6436
  {
6062
- "name": "fieldName",
6437
+ "name": "resource",
6063
6438
  "type": {
6064
6439
  "text": "string"
6065
6440
  },
6066
- "fieldName": "fieldName"
6441
+ "fieldName": "resource"
6067
6442
  },
6068
6443
  {
6069
- "name": "label",
6444
+ "name": "only",
6070
6445
  "type": {
6071
6446
  "text": "string"
6072
6447
  },
6073
- "fieldName": "label"
6448
+ "description": "Only generate filters for the specified fields, provided as a comma separated list.\nDefault behavior (if \"only\" is not set) is to generate filters for all fields based on metadata.",
6449
+ "fieldName": "only"
6074
6450
  },
6075
6451
  {
6076
- "name": "type",
6077
- "fieldName": "type"
6452
+ "name": "labels",
6453
+ "type": {
6454
+ "text": "string"
6455
+ },
6456
+ "description": "Labels for the specified fields, to be used alongside \"only\" prop.",
6457
+ "fieldName": "labels"
6078
6458
  },
6079
6459
  {
6080
6460
  "name": "target",
@@ -6086,39 +6466,41 @@
6086
6466
  }
6087
6467
  ],
6088
6468
  "superclass": {
6089
- "name": "FoundationFilter",
6469
+ "name": "FoundationFilterBar",
6090
6470
  "package": "@genesislcap/foundation-ui"
6091
6471
  },
6092
- "tagName": "%%prefix%%-filter",
6472
+ "tagName": "%%prefix%%-filter-bar",
6093
6473
  "customElement": true
6094
6474
  },
6095
6475
  {
6096
6476
  "kind": "variable",
6097
- "name": "zeroFilter"
6477
+ "name": "zeroFilterBar",
6478
+ "description": "The Zero Filter",
6479
+ "privacy": "public"
6098
6480
  }
6099
6481
  ],
6100
6482
  "exports": [
6101
6483
  {
6102
6484
  "kind": "js",
6103
- "name": "Filter",
6485
+ "name": "FilterBar",
6104
6486
  "declaration": {
6105
- "name": "Filter",
6106
- "module": "src/filter/filter.ts"
6487
+ "name": "FilterBar",
6488
+ "module": "src/filter-bar/filter-bar.ts"
6107
6489
  }
6108
6490
  },
6109
6491
  {
6110
6492
  "kind": "js",
6111
- "name": "zeroFilter",
6493
+ "name": "zeroFilterBar",
6112
6494
  "declaration": {
6113
- "name": "zeroFilter",
6114
- "module": "src/filter/filter.ts"
6495
+ "name": "zeroFilterBar",
6496
+ "module": "src/filter-bar/filter-bar.ts"
6115
6497
  }
6116
6498
  }
6117
6499
  ]
6118
6500
  },
6119
6501
  {
6120
6502
  "kind": "javascript-module",
6121
- "path": "src/filter/index.ts",
6503
+ "path": "src/filter-bar/index.ts",
6122
6504
  "declarations": [],
6123
6505
  "exports": [
6124
6506
  {
@@ -6126,7 +6508,7 @@
6126
6508
  "name": "*",
6127
6509
  "declaration": {
6128
6510
  "name": "*",
6129
- "package": "./filter"
6511
+ "package": "./filter-bar.styles"
6130
6512
  }
6131
6513
  },
6132
6514
  {
@@ -6134,15 +6516,15 @@
6134
6516
  "name": "*",
6135
6517
  "declaration": {
6136
6518
  "name": "*",
6137
- "package": "./filter.template"
6519
+ "package": "./filter-bar.template"
6138
6520
  }
6139
6521
  },
6140
6522
  {
6141
6523
  "kind": "js",
6142
- "name": "zeroFilterStyles",
6524
+ "name": "*",
6143
6525
  "declaration": {
6144
- "name": "foundationFilterStyles",
6145
- "package": "@genesislcap/foundation-ui"
6526
+ "name": "*",
6527
+ "package": "./filter-bar"
6146
6528
  }
6147
6529
  }
6148
6530
  ]
@@ -6529,199 +6911,22 @@
6529
6911
  "name": "*",
6530
6912
  "declaration": {
6531
6913
  "name": "*",
6532
- "package": "./flipper.styles"
6533
- }
6534
- },
6535
- {
6536
- "kind": "js",
6537
- "name": "*",
6538
- "declaration": {
6539
- "name": "*",
6540
- "package": "./flipper.template"
6541
- }
6542
- }
6543
- ]
6544
- },
6545
- {
6546
- "kind": "javascript-module",
6547
- "path": "src/grid-layout-item/grid-layout-item.ts",
6548
- "declarations": [
6549
- {
6550
- "kind": "class",
6551
- "description": "",
6552
- "name": "GridLayoutItem",
6553
- "superclass": {
6554
- "name": "FoundationGridLayoutItem",
6555
- "package": "@genesislcap/foundation-ui"
6556
- },
6557
- "tagName": "%%prefix%%-grid-layout-item",
6558
- "customElement": true,
6559
- "members": [
6560
- {
6561
- "kind": "field",
6562
- "name": "_presentation",
6563
- "type": {
6564
- "text": "ComponentPresentation | null | undefined"
6565
- },
6566
- "privacy": "private",
6567
- "default": "void 0",
6568
- "inheritedFrom": {
6569
- "name": "FoundationElement",
6570
- "module": "src/foundation-element/foundation-element.ts"
6571
- }
6572
- },
6573
- {
6574
- "kind": "field",
6575
- "name": "$presentation",
6576
- "type": {
6577
- "text": "ComponentPresentation | null"
6578
- },
6579
- "privacy": "public",
6580
- "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
6581
- "inheritedFrom": {
6582
- "name": "FoundationElement",
6583
- "module": "src/foundation-element/foundation-element.ts"
6584
- }
6585
- },
6586
- {
6587
- "kind": "field",
6588
- "name": "template",
6589
- "type": {
6590
- "text": "ElementViewTemplate | void | null"
6591
- },
6592
- "privacy": "public",
6593
- "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.",
6594
- "inheritedFrom": {
6595
- "name": "FoundationElement",
6596
- "module": "src/foundation-element/foundation-element.ts"
6597
- }
6598
- },
6599
- {
6600
- "kind": "method",
6601
- "name": "templateChanged",
6602
- "privacy": "protected",
6603
- "return": {
6604
- "type": {
6605
- "text": "void"
6606
- }
6607
- },
6608
- "inheritedFrom": {
6609
- "name": "FoundationElement",
6610
- "module": "src/foundation-element/foundation-element.ts"
6611
- }
6612
- },
6613
- {
6614
- "kind": "field",
6615
- "name": "styles",
6616
- "type": {
6617
- "text": "ElementStyles | void | null"
6618
- },
6619
- "privacy": "public",
6620
- "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
6621
- "inheritedFrom": {
6622
- "name": "FoundationElement",
6623
- "module": "src/foundation-element/foundation-element.ts"
6624
- }
6625
- },
6626
- {
6627
- "kind": "method",
6628
- "name": "stylesChanged",
6629
- "privacy": "protected",
6630
- "return": {
6631
- "type": {
6632
- "text": "void"
6633
- }
6634
- },
6635
- "inheritedFrom": {
6636
- "name": "FoundationElement",
6637
- "module": "src/foundation-element/foundation-element.ts"
6638
- }
6639
- },
6640
- {
6641
- "kind": "method",
6642
- "name": "compose",
6643
- "privacy": "public",
6644
- "static": true,
6645
- "return": {
6646
- "type": {
6647
- "text": "(\n overrideDefinition?: OverrideFoundationElementDefinition<T>\n ) => FoundationElementRegistry<T, K>"
6648
- }
6649
- },
6650
- "parameters": [
6651
- {
6652
- "name": "this",
6653
- "type": {
6654
- "text": "K"
6655
- }
6656
- },
6657
- {
6658
- "name": "elementDefinition",
6659
- "type": {
6660
- "text": "T"
6661
- },
6662
- "description": "The definition of the element to create the registry\nfunction for."
6663
- }
6664
- ],
6665
- "description": "Defines an element registry function with a set of element definition defaults.",
6666
- "inheritedFrom": {
6667
- "name": "FoundationElement",
6668
- "module": "src/foundation-element/foundation-element.ts"
6669
- }
6670
- }
6671
- ]
6672
- },
6673
- {
6674
- "kind": "variable",
6675
- "name": "zeroGridLayoutItem",
6676
- "description": "The Zero Grid Layout Item",
6677
- "privacy": "public"
6678
- }
6679
- ],
6680
- "exports": [
6681
- {
6682
- "kind": "js",
6683
- "name": "GridLayoutItem",
6684
- "declaration": {
6685
- "name": "GridLayoutItem",
6686
- "module": "src/grid-layout-item/grid-layout-item.ts"
6687
- }
6688
- },
6689
- {
6690
- "kind": "js",
6691
- "name": "zeroGridLayoutItem",
6692
- "declaration": {
6693
- "name": "zeroGridLayoutItem",
6694
- "module": "src/grid-layout-item/grid-layout-item.ts"
6695
- }
6696
- }
6697
- ]
6698
- },
6699
- {
6700
- "kind": "javascript-module",
6701
- "path": "src/grid-layout-item/index.ts",
6702
- "declarations": [],
6703
- "exports": [
6704
- {
6705
- "kind": "js",
6706
- "name": "*",
6707
- "declaration": {
6708
- "name": "*",
6709
- "package": "./grid-layout-item"
6914
+ "package": "./flipper.styles"
6710
6915
  }
6711
6916
  },
6712
6917
  {
6713
6918
  "kind": "js",
6714
- "name": "zeroGridLayoutItemTemplate",
6919
+ "name": "*",
6715
6920
  "declaration": {
6716
- "name": "foundationGridLayoutItemTemplate",
6717
- "package": "@genesislcap/foundation-ui"
6921
+ "name": "*",
6922
+ "package": "./flipper.template"
6718
6923
  }
6719
6924
  }
6720
6925
  ]
6721
6926
  },
6722
6927
  {
6723
6928
  "kind": "javascript-module",
6724
- "path": "src/grid-layout/grid-layout.stories.ts",
6929
+ "path": "src/flyout/flyout.stories.ts",
6725
6930
  "declarations": [
6726
6931
  {
6727
6932
  "kind": "variable",
@@ -6729,7 +6934,7 @@
6729
6934
  "type": {
6730
6935
  "text": "Meta"
6731
6936
  },
6732
- "default": "{\n title: 'Grid Layout',\n component: 'zero-grid-layout',\n}"
6937
+ "default": "{\n title: 'Flyout',\n component: 'zero-flyout',\n}"
6733
6938
  },
6734
6939
  {
6735
6940
  "kind": "variable",
@@ -6737,7 +6942,7 @@
6737
6942
  "type": {
6738
6943
  "text": "StoryObj"
6739
6944
  },
6740
- "default": "{\n render: () => html`\n <div style=\"${wrapperStyle}\">\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout\n class=\"spacing-2x\"\n col-count=\"2\"\n row-count=\"2\"\n col-lg-count=\"4\"\n row-lg-count=\"1\"\n col-sm-count=\"1\"\n row-sm-count=\"2\"\n >\n <zero-grid-layout-item\n style=\"height: 100%; background-color: green;\"\n col-lg-number=\"1\"\n row-lg-number=\"1\"\n width-lg=\"1\"\n height-lg=\"1\"\n col-md-number=\"1\"\n row-md-number=\"1\"\n width-md=\"1\"\n height-md=\"1\"\n col-sm-number=\"1\"\n row-sm-number=\"1\"\n width-sm=\"1\"\n height-sm=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"height: 100%; background-color: red;\"\n col-lg-number=\"3\"\n row-lg-number=\"1\"\n width-lg=\"2\"\n height-lg=\"1\"\n col-md-number=\"2\"\n row-md-number=\"2\"\n width-md=\"1\"\n height-md=\"1\"\n col-sm-number=\"1\"\n row-sm-number=\"2\"\n width-sm=\"1\"\n height-sm=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"2\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"3\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"2\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"2\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"4\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"3\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"4\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"1\"\n row-number=\"3\"\n width=\"3\"\n height=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"4\"\n row-number=\"3\"\n width=\"1\"\n height=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"4\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"4\"\n height=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"1\"\n row-number=\"2\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"2\"\n width=\"3\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"1\"\n row-number=\"4\"\n width=\"4\"\n height=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"2\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"3\"\n row-number=\"1\"\n width=\"4\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"3\"\n row-number=\"4\"\n width=\"2\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"5\"\n row-number=\"4\"\n width=\"1\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"6\"\n row-number=\"4\"\n width=\"1\"\n height=\"3\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"5\"\n height=\"4\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"5\"\n width=\"5\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"5\"\n height=\"4\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"5\"\n width=\"5\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n </div>\n `,\n}"
6945
+ "default": "{\n argTypes: {\n position: {\n control: 'select',\n options: ['left', 'right'],\n },\n },\n args: {\n position: 'right',\n height: '500px',\n flyoutWidth: '20%',\n },\n render: ({ position, height, flyoutWidth }) =>\n html`\n <div style=\"display: flex; height: ${height};\">\n <zero-button @click=\"${openFlyout}\">Open Flyout</zero-button>\n\n <style>\n zero-flyout::part(flyout) {\n width: ${flyoutWidth};\n }\n </style>\n <zero-flyout position=\"${position}\" style=\"height: ${height};\">\n <p slot=\"title\">Zero flyout</p>\n <div slot=\"header\">\n <p>Header</p>\n </div>\n <div class=\"container\">\n <p>Flyout options</p>\n <ul>\n <li>0</li>\n <li>1</li>\n <li>2</li>\n <li>3</li>\n <li>4</li>\n <li>5</li>\n </ul>\n </div>\n <div slot=\"footer\">\n <p>Footer</p>\n <zero-button @click=\"${closeFlyout}\">Close Flyout</zero-button>\n </div>\n </zero-flyout>\n </div>\n `,\n}"
6741
6946
  }
6742
6947
  ],
6743
6948
  "exports": [
@@ -6746,7 +6951,7 @@
6746
6951
  "name": "default",
6747
6952
  "declaration": {
6748
6953
  "name": "meta",
6749
- "module": "src/grid-layout/grid-layout.stories.ts"
6954
+ "module": "src/flyout/flyout.stories.ts"
6750
6955
  }
6751
6956
  },
6752
6957
  {
@@ -6754,24 +6959,55 @@
6754
6959
  "name": "Primary",
6755
6960
  "declaration": {
6756
6961
  "name": "Primary",
6757
- "module": "src/grid-layout/grid-layout.stories.ts"
6962
+ "module": "src/flyout/flyout.stories.ts"
6758
6963
  }
6759
6964
  }
6760
6965
  ]
6761
6966
  },
6762
6967
  {
6763
6968
  "kind": "javascript-module",
6764
- "path": "src/grid-layout/grid-layout.ts",
6969
+ "path": "src/flyout/flyout.styles.ts",
6970
+ "declarations": [
6971
+ {
6972
+ "kind": "variable",
6973
+ "name": "zeroFlyoutStyles",
6974
+ "default": "css`\n ${foundationFlyoutStyles}\n div.flyout {\n background-color: ${neutralLayer2};\n border-color: ${neutralFillHover};\n color: ${neutralForegroundRest};\n }\n\n :host([position='left']) div.flyout {\n border-right-style: solid;\n border-right-width: 1px;\n }\n\n :host([position='right']) div.flyout {\n border-left-style: solid;\n border-left-width: 1px;\n }\n\n div.exit {\n cursor: pointer;\n padding: 5px 8px;\n }\n\n div.exit:hover {\n background-color: ${neutralFillHover};\n border-radius: 3px;\n }\n`"
6975
+ }
6976
+ ],
6977
+ "exports": [
6978
+ {
6979
+ "kind": "js",
6980
+ "name": "zeroFlyoutStyles",
6981
+ "declaration": {
6982
+ "name": "zeroFlyoutStyles",
6983
+ "module": "src/flyout/flyout.styles.ts"
6984
+ }
6985
+ }
6986
+ ]
6987
+ },
6988
+ {
6989
+ "kind": "javascript-module",
6990
+ "path": "src/flyout/flyout.ts",
6765
6991
  "declarations": [
6992
+ {
6993
+ "kind": "variable",
6994
+ "name": "defaultFlyoutConfig",
6995
+ "default": "foundationConfig"
6996
+ },
6997
+ {
6998
+ "kind": "variable",
6999
+ "name": "zeroFlyoutShadowOptions",
7000
+ "default": "foundationFlyoutShadowOptions"
7001
+ },
6766
7002
  {
6767
7003
  "kind": "class",
6768
7004
  "description": "",
6769
- "name": "GridLayout",
7005
+ "name": "Flyout",
6770
7006
  "superclass": {
6771
- "name": "FoundationGridLayout",
7007
+ "name": "FoundationFlyout",
6772
7008
  "package": "@genesislcap/foundation-ui"
6773
7009
  },
6774
- "tagName": "%%prefix%%-grid-layout",
7010
+ "tagName": "%%prefix%%-flyout",
6775
7011
  "customElement": true,
6776
7012
  "members": [
6777
7013
  {
@@ -6889,218 +7125,132 @@
6889
7125
  },
6890
7126
  {
6891
7127
  "kind": "variable",
6892
- "name": "zeroGridLayout",
6893
- "description": "The Zero Grid Layout",
7128
+ "name": "zeroFlyout",
7129
+ "description": "The Zero Flyout",
6894
7130
  "privacy": "public"
6895
7131
  }
6896
7132
  ],
6897
7133
  "exports": [
6898
7134
  {
6899
7135
  "kind": "js",
6900
- "name": "GridLayout",
7136
+ "name": "defaultFlyoutConfig",
6901
7137
  "declaration": {
6902
- "name": "GridLayout",
6903
- "module": "src/grid-layout/grid-layout.ts"
7138
+ "name": "defaultFlyoutConfig",
7139
+ "module": "src/flyout/flyout.ts"
6904
7140
  }
6905
7141
  },
6906
7142
  {
6907
7143
  "kind": "js",
6908
- "name": "zeroGridLayout",
6909
- "declaration": {
6910
- "name": "zeroGridLayout",
6911
- "module": "src/grid-layout/grid-layout.ts"
6912
- }
6913
- }
6914
- ]
6915
- },
6916
- {
6917
- "kind": "javascript-module",
6918
- "path": "src/grid-layout/index.ts",
6919
- "declarations": [],
6920
- "exports": [
6921
- {
6922
- "kind": "js",
6923
- "name": "*",
7144
+ "name": "zeroFlyoutShadowOptions",
6924
7145
  "declaration": {
6925
- "name": "*",
6926
- "package": "./grid-layout"
7146
+ "name": "zeroFlyoutShadowOptions",
7147
+ "module": "src/flyout/flyout.ts"
6927
7148
  }
6928
- }
6929
- ]
6930
- },
6931
- {
6932
- "kind": "javascript-module",
6933
- "path": "src/filter-bar/filter-bar.stories.ts",
6934
- "declarations": [
6935
- {
6936
- "kind": "variable",
6937
- "name": "meta",
6938
- "type": {
6939
- "text": "Meta"
6940
- },
6941
- "default": "{\n title: 'Filter Bar',\n component: 'zero-filter-bar',\n}"
6942
7149
  },
6943
- {
6944
- "kind": "variable",
6945
- "name": "Primary",
6946
- "type": {
6947
- "text": "StoryObj"
6948
- },
6949
- "default": "{\n render: () =>\n html`\n <zero-filter-bar\n resource=\"ALL_PROCESSES_STATUS\"\n only=\"PROCESS_PORT, START_TIME, PROCESS_NAME, DATADUMP\"\n ></zero-filter-bar>\n `,\n}"
6950
- }
6951
- ],
6952
- "exports": [
6953
7150
  {
6954
7151
  "kind": "js",
6955
- "name": "default",
7152
+ "name": "Flyout",
6956
7153
  "declaration": {
6957
- "name": "meta",
6958
- "module": "src/filter-bar/filter-bar.stories.ts"
7154
+ "name": "Flyout",
7155
+ "module": "src/flyout/flyout.ts"
6959
7156
  }
6960
7157
  },
6961
7158
  {
6962
7159
  "kind": "js",
6963
- "name": "Primary",
7160
+ "name": "zeroFlyout",
6964
7161
  "declaration": {
6965
- "name": "Primary",
6966
- "module": "src/filter-bar/filter-bar.stories.ts"
7162
+ "name": "zeroFlyout",
7163
+ "module": "src/flyout/flyout.ts"
6967
7164
  }
6968
7165
  }
6969
7166
  ]
6970
7167
  },
6971
7168
  {
6972
7169
  "kind": "javascript-module",
6973
- "path": "src/filter-bar/filter-bar.styles.ts",
6974
- "declarations": [
6975
- {
6976
- "kind": "function",
6977
- "name": "zeroFilterBarStyles",
6978
- "return": {
6979
- "type": {
6980
- "text": "ElementStyles"
6981
- }
6982
- },
6983
- "parameters": [
6984
- {
6985
- "name": "context",
6986
- "type": {
6987
- "text": "ElementDefinitionContext"
6988
- }
6989
- },
6990
- {
6991
- "name": "definition",
6992
- "type": {
6993
- "text": "FoundationElementDefinition"
6994
- }
6995
- }
6996
- ]
6997
- }
6998
- ],
7170
+ "path": "src/flyout/index.ts",
7171
+ "declarations": [],
6999
7172
  "exports": [
7000
7173
  {
7001
7174
  "kind": "js",
7002
- "name": "zeroFilterBarStyles",
7175
+ "name": "*",
7003
7176
  "declaration": {
7004
- "name": "zeroFilterBarStyles",
7005
- "module": "src/filter-bar/filter-bar.styles.ts"
7177
+ "name": "*",
7178
+ "package": "./flyout"
7006
7179
  }
7007
- }
7008
- ]
7009
- },
7010
- {
7011
- "kind": "javascript-module",
7012
- "path": "src/filter-bar/filter-bar.template.ts",
7013
- "declarations": [
7180
+ },
7014
7181
  {
7015
- "kind": "variable",
7016
- "name": "zeroFilterBarTemplate",
7017
- "type": {
7018
- "text": "ViewTemplate<FilterBar>"
7019
- },
7020
- "default": "html`\n ${filterBarTemplate}\n`"
7021
- }
7022
- ],
7023
- "exports": [
7182
+ "kind": "js",
7183
+ "name": "*",
7184
+ "declaration": {
7185
+ "name": "*",
7186
+ "package": "./flyout.styles"
7187
+ }
7188
+ },
7024
7189
  {
7025
7190
  "kind": "js",
7026
- "name": "zeroFilterBarTemplate",
7191
+ "name": "zeroFlyoutTemplate",
7027
7192
  "declaration": {
7028
- "name": "zeroFilterBarTemplate",
7029
- "module": "src/filter-bar/filter-bar.template.ts"
7193
+ "name": "foundationFlyoutTemplate",
7194
+ "package": "@genesislcap/foundation-ui"
7030
7195
  }
7031
7196
  }
7032
7197
  ]
7033
7198
  },
7034
7199
  {
7035
7200
  "kind": "javascript-module",
7036
- "path": "src/filter-bar/filter-bar.ts",
7037
- "declarations": [
7038
- {
7039
- "kind": "class",
7040
- "description": "",
7041
- "name": "FilterBar",
7042
- "members": [
7043
- {
7044
- "kind": "field",
7045
- "name": "resource",
7046
- "type": {
7047
- "text": "string"
7048
- }
7049
- },
7050
- {
7051
- "kind": "field",
7052
- "name": "only",
7053
- "type": {
7054
- "text": "string"
7055
- },
7056
- "description": "Only generate filters for the specified fields, provided as a comma separated list.\nDefault behavior (if \"only\" is not set) is to generate filters for all fields based on metadata."
7057
- },
7058
- {
7059
- "kind": "field",
7060
- "name": "labels",
7061
- "type": {
7062
- "text": "string"
7063
- },
7064
- "description": "Labels for the specified fields, to be used alongside \"only\" prop."
7065
- },
7066
- {
7067
- "kind": "field",
7068
- "name": "target",
7069
- "type": {
7070
- "text": "string"
7071
- },
7072
- "description": "Will be included in event emmissions.\nUsually set to the id of the target datasource.\nUsefull when we have multiple grids in the same page."
7073
- },
7074
- {
7075
- "kind": "field",
7076
- "name": "ready",
7077
- "type": {
7078
- "text": "boolean"
7079
- }
7080
- },
7081
- {
7082
- "kind": "field",
7083
- "name": "fields",
7084
- "type": {
7085
- "text": "MetadataDetail[]"
7086
- }
7087
- },
7088
- {
7089
- "kind": "field",
7090
- "name": "filterGrid",
7091
- "type": {
7092
- "text": "HTMLDivElement"
7093
- },
7094
- "privacy": "public"
7095
- },
7096
- {
7097
- "kind": "field",
7098
- "name": "collapsed",
7099
- "type": {
7100
- "text": "boolean"
7101
- },
7102
- "default": "true"
7103
- },
7201
+ "path": "src/grid-layout/grid-layout.stories.ts",
7202
+ "declarations": [
7203
+ {
7204
+ "kind": "variable",
7205
+ "name": "meta",
7206
+ "type": {
7207
+ "text": "Meta"
7208
+ },
7209
+ "default": "{\n title: 'Grid Layout',\n component: 'zero-grid-layout',\n}"
7210
+ },
7211
+ {
7212
+ "kind": "variable",
7213
+ "name": "Primary",
7214
+ "type": {
7215
+ "text": "StoryObj"
7216
+ },
7217
+ "default": "{\n render: () => html`\n <div style=\"${wrapperStyle}\">\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout\n class=\"spacing-2x\"\n col-count=\"2\"\n row-count=\"2\"\n col-lg-count=\"4\"\n row-lg-count=\"1\"\n col-sm-count=\"1\"\n row-sm-count=\"2\"\n >\n <zero-grid-layout-item\n style=\"height: 100%; background-color: green;\"\n col-lg-number=\"1\"\n row-lg-number=\"1\"\n width-lg=\"1\"\n height-lg=\"1\"\n col-md-number=\"1\"\n row-md-number=\"1\"\n width-md=\"1\"\n height-md=\"1\"\n col-sm-number=\"1\"\n row-sm-number=\"1\"\n width-sm=\"1\"\n height-sm=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"height: 100%; background-color: red;\"\n col-lg-number=\"3\"\n row-lg-number=\"1\"\n width-lg=\"2\"\n height-lg=\"1\"\n col-md-number=\"2\"\n row-md-number=\"2\"\n width-md=\"1\"\n height-md=\"1\"\n col-sm-number=\"1\"\n row-sm-number=\"2\"\n width-sm=\"1\"\n height-sm=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"2\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"3\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"2\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"2\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"4\"\n row-number=\"1\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"3\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"4\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"1\"\n row-number=\"3\"\n width=\"3\"\n height=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"4\"\n row-number=\"3\"\n width=\"1\"\n height=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"4\" col-count=\"4\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"4\"\n height=\"1\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"1\"\n row-number=\"2\"\n width=\"1\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"2\"\n width=\"3\"\n height=\"2\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"1\"\n row-number=\"4\"\n width=\"4\"\n height=\"1\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"2\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"3\"\n row-number=\"1\"\n width=\"4\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"3\"\n row-number=\"4\"\n width=\"2\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"5\"\n row-number=\"4\"\n width=\"1\"\n height=\"3\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: green;\"\n col-number=\"6\"\n row-number=\"4\"\n width=\"1\"\n height=\"3\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"5\"\n height=\"4\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"5\"\n width=\"5\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n\n <zero-card style=\"height: 200px; width: 100%;\">\n <zero-grid-layout row-count=\"6\" col-count=\"6\" class=\"spacing-2x\">\n <zero-grid-layout-item\n style=\"background-color: blue;\"\n col-number=\"1\"\n row-number=\"1\"\n width=\"1\"\n height=\"6\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: red;\"\n col-number=\"2\"\n row-number=\"1\"\n width=\"5\"\n height=\"4\"\n ></zero-grid-layout-item>\n <zero-grid-layout-item\n style=\"background-color: yellow;\"\n col-number=\"2\"\n row-number=\"5\"\n width=\"5\"\n height=\"2\"\n ></zero-grid-layout-item>\n </zero-grid-layout>\n </zero-card>\n </div>\n `,\n}"
7218
+ }
7219
+ ],
7220
+ "exports": [
7221
+ {
7222
+ "kind": "js",
7223
+ "name": "default",
7224
+ "declaration": {
7225
+ "name": "meta",
7226
+ "module": "src/grid-layout/grid-layout.stories.ts"
7227
+ }
7228
+ },
7229
+ {
7230
+ "kind": "js",
7231
+ "name": "Primary",
7232
+ "declaration": {
7233
+ "name": "Primary",
7234
+ "module": "src/grid-layout/grid-layout.stories.ts"
7235
+ }
7236
+ }
7237
+ ]
7238
+ },
7239
+ {
7240
+ "kind": "javascript-module",
7241
+ "path": "src/grid-layout/grid-layout.ts",
7242
+ "declarations": [
7243
+ {
7244
+ "kind": "class",
7245
+ "description": "",
7246
+ "name": "GridLayout",
7247
+ "superclass": {
7248
+ "name": "FoundationGridLayout",
7249
+ "package": "@genesislcap/foundation-ui"
7250
+ },
7251
+ "tagName": "%%prefix%%-grid-layout",
7252
+ "customElement": true,
7253
+ "members": [
7104
7254
  {
7105
7255
  "kind": "field",
7106
7256
  "name": "_presentation",
@@ -7212,76 +7362,37 @@
7212
7362
  "module": "src/foundation-element/foundation-element.ts"
7213
7363
  }
7214
7364
  }
7215
- ],
7216
- "attributes": [
7217
- {
7218
- "name": "resource",
7219
- "type": {
7220
- "text": "string"
7221
- },
7222
- "fieldName": "resource"
7223
- },
7224
- {
7225
- "name": "only",
7226
- "type": {
7227
- "text": "string"
7228
- },
7229
- "description": "Only generate filters for the specified fields, provided as a comma separated list.\nDefault behavior (if \"only\" is not set) is to generate filters for all fields based on metadata.",
7230
- "fieldName": "only"
7231
- },
7232
- {
7233
- "name": "labels",
7234
- "type": {
7235
- "text": "string"
7236
- },
7237
- "description": "Labels for the specified fields, to be used alongside \"only\" prop.",
7238
- "fieldName": "labels"
7239
- },
7240
- {
7241
- "name": "target",
7242
- "type": {
7243
- "text": "string"
7244
- },
7245
- "description": "Will be included in event emmissions.\nUsually set to the id of the target datasource.\nUsefull when we have multiple grids in the same page.",
7246
- "fieldName": "target"
7247
- }
7248
- ],
7249
- "superclass": {
7250
- "name": "FoundationFilterBar",
7251
- "package": "@genesislcap/foundation-ui"
7252
- },
7253
- "tagName": "%%prefix%%-filter-bar",
7254
- "customElement": true
7365
+ ]
7255
7366
  },
7256
7367
  {
7257
7368
  "kind": "variable",
7258
- "name": "zeroFilterBar",
7259
- "description": "The Zero Filter",
7369
+ "name": "zeroGridLayout",
7370
+ "description": "The Zero Grid Layout",
7260
7371
  "privacy": "public"
7261
7372
  }
7262
7373
  ],
7263
7374
  "exports": [
7264
7375
  {
7265
7376
  "kind": "js",
7266
- "name": "FilterBar",
7377
+ "name": "GridLayout",
7267
7378
  "declaration": {
7268
- "name": "FilterBar",
7269
- "module": "src/filter-bar/filter-bar.ts"
7379
+ "name": "GridLayout",
7380
+ "module": "src/grid-layout/grid-layout.ts"
7270
7381
  }
7271
7382
  },
7272
7383
  {
7273
7384
  "kind": "js",
7274
- "name": "zeroFilterBar",
7385
+ "name": "zeroGridLayout",
7275
7386
  "declaration": {
7276
- "name": "zeroFilterBar",
7277
- "module": "src/filter-bar/filter-bar.ts"
7387
+ "name": "zeroGridLayout",
7388
+ "module": "src/grid-layout/grid-layout.ts"
7278
7389
  }
7279
7390
  }
7280
7391
  ]
7281
7392
  },
7282
7393
  {
7283
7394
  "kind": "javascript-module",
7284
- "path": "src/filter-bar/index.ts",
7395
+ "path": "src/grid-layout/index.ts",
7285
7396
  "declarations": [],
7286
7397
  "exports": [
7287
7398
  {
@@ -7289,111 +7400,24 @@
7289
7400
  "name": "*",
7290
7401
  "declaration": {
7291
7402
  "name": "*",
7292
- "package": "./filter-bar.styles"
7293
- }
7294
- },
7295
- {
7296
- "kind": "js",
7297
- "name": "*",
7298
- "declaration": {
7299
- "name": "*",
7300
- "package": "./filter-bar.template"
7301
- }
7302
- },
7303
- {
7304
- "kind": "js",
7305
- "name": "*",
7306
- "declaration": {
7307
- "name": "*",
7308
- "package": "./filter-bar"
7309
- }
7310
- }
7311
- ]
7312
- },
7313
- {
7314
- "kind": "javascript-module",
7315
- "path": "src/flyout/flyout.stories.ts",
7316
- "declarations": [
7317
- {
7318
- "kind": "variable",
7319
- "name": "meta",
7320
- "type": {
7321
- "text": "Meta"
7322
- },
7323
- "default": "{\n title: 'Flyout',\n component: 'zero-flyout',\n}"
7324
- },
7325
- {
7326
- "kind": "variable",
7327
- "name": "Primary",
7328
- "type": {
7329
- "text": "StoryObj"
7330
- },
7331
- "default": "{\n argTypes: {\n position: {\n control: 'select',\n options: ['left', 'right'],\n },\n },\n args: {\n position: 'right',\n height: '500px',\n flyoutWidth: '20%',\n },\n render: ({ position, height, flyoutWidth }) =>\n html`\n <div style=\"display: flex; height: ${height};\">\n <zero-button @click=\"${openFlyout}\">Open Flyout</zero-button>\n\n <style>\n zero-flyout::part(flyout) {\n width: ${flyoutWidth};\n }\n </style>\n <zero-flyout position=\"${position}\" style=\"height: ${height};\">\n <p slot=\"title\">Zero flyout</p>\n <div slot=\"header\">\n <p>Header</p>\n </div>\n <div class=\"container\">\n <p>Flyout options</p>\n <ul>\n <li>0</li>\n <li>1</li>\n <li>2</li>\n <li>3</li>\n <li>4</li>\n <li>5</li>\n </ul>\n </div>\n <div slot=\"footer\">\n <p>Footer</p>\n <zero-button @click=\"${closeFlyout}\">Close Flyout</zero-button>\n </div>\n </zero-flyout>\n </div>\n `,\n}"
7332
- }
7333
- ],
7334
- "exports": [
7335
- {
7336
- "kind": "js",
7337
- "name": "default",
7338
- "declaration": {
7339
- "name": "meta",
7340
- "module": "src/flyout/flyout.stories.ts"
7341
- }
7342
- },
7343
- {
7344
- "kind": "js",
7345
- "name": "Primary",
7346
- "declaration": {
7347
- "name": "Primary",
7348
- "module": "src/flyout/flyout.stories.ts"
7349
- }
7350
- }
7351
- ]
7352
- },
7353
- {
7354
- "kind": "javascript-module",
7355
- "path": "src/flyout/flyout.styles.ts",
7356
- "declarations": [
7357
- {
7358
- "kind": "variable",
7359
- "name": "zeroFlyoutStyles",
7360
- "default": "css`\n ${foundationFlyoutStyles}\n div.flyout {\n background-color: ${neutralLayer2};\n border-color: ${neutralFillHover};\n color: ${neutralForegroundRest};\n }\n\n :host([position='left']) div.flyout {\n border-right-style: solid;\n border-right-width: 1px;\n }\n\n :host([position='right']) div.flyout {\n border-left-style: solid;\n border-left-width: 1px;\n }\n\n div.exit {\n cursor: pointer;\n padding: 5px 8px;\n }\n\n div.exit:hover {\n background-color: ${neutralFillHover};\n border-radius: 3px;\n }\n`"
7361
- }
7362
- ],
7363
- "exports": [
7364
- {
7365
- "kind": "js",
7366
- "name": "zeroFlyoutStyles",
7367
- "declaration": {
7368
- "name": "zeroFlyoutStyles",
7369
- "module": "src/flyout/flyout.styles.ts"
7403
+ "package": "./grid-layout"
7370
7404
  }
7371
7405
  }
7372
7406
  ]
7373
7407
  },
7374
7408
  {
7375
7409
  "kind": "javascript-module",
7376
- "path": "src/flyout/flyout.ts",
7410
+ "path": "src/grid-layout-item/grid-layout-item.ts",
7377
7411
  "declarations": [
7378
- {
7379
- "kind": "variable",
7380
- "name": "defaultFlyoutConfig",
7381
- "default": "foundationConfig"
7382
- },
7383
- {
7384
- "kind": "variable",
7385
- "name": "zeroFlyoutShadowOptions",
7386
- "default": "foundationFlyoutShadowOptions"
7387
- },
7388
7412
  {
7389
7413
  "kind": "class",
7390
7414
  "description": "",
7391
- "name": "Flyout",
7415
+ "name": "GridLayoutItem",
7392
7416
  "superclass": {
7393
- "name": "FoundationFlyout",
7417
+ "name": "FoundationGridLayoutItem",
7394
7418
  "package": "@genesislcap/foundation-ui"
7395
7419
  },
7396
- "tagName": "%%prefix%%-flyout",
7420
+ "tagName": "%%prefix%%-grid-layout-item",
7397
7421
  "customElement": true,
7398
7422
  "members": [
7399
7423
  {
@@ -7511,49 +7535,33 @@
7511
7535
  },
7512
7536
  {
7513
7537
  "kind": "variable",
7514
- "name": "zeroFlyout",
7515
- "description": "The Zero Flyout",
7538
+ "name": "zeroGridLayoutItem",
7539
+ "description": "The Zero Grid Layout Item",
7516
7540
  "privacy": "public"
7517
7541
  }
7518
7542
  ],
7519
7543
  "exports": [
7520
7544
  {
7521
7545
  "kind": "js",
7522
- "name": "defaultFlyoutConfig",
7523
- "declaration": {
7524
- "name": "defaultFlyoutConfig",
7525
- "module": "src/flyout/flyout.ts"
7526
- }
7527
- },
7528
- {
7529
- "kind": "js",
7530
- "name": "zeroFlyoutShadowOptions",
7531
- "declaration": {
7532
- "name": "zeroFlyoutShadowOptions",
7533
- "module": "src/flyout/flyout.ts"
7534
- }
7535
- },
7536
- {
7537
- "kind": "js",
7538
- "name": "Flyout",
7546
+ "name": "GridLayoutItem",
7539
7547
  "declaration": {
7540
- "name": "Flyout",
7541
- "module": "src/flyout/flyout.ts"
7548
+ "name": "GridLayoutItem",
7549
+ "module": "src/grid-layout-item/grid-layout-item.ts"
7542
7550
  }
7543
7551
  },
7544
7552
  {
7545
7553
  "kind": "js",
7546
- "name": "zeroFlyout",
7554
+ "name": "zeroGridLayoutItem",
7547
7555
  "declaration": {
7548
- "name": "zeroFlyout",
7549
- "module": "src/flyout/flyout.ts"
7556
+ "name": "zeroGridLayoutItem",
7557
+ "module": "src/grid-layout-item/grid-layout-item.ts"
7550
7558
  }
7551
7559
  }
7552
7560
  ]
7553
7561
  },
7554
7562
  {
7555
7563
  "kind": "javascript-module",
7556
- "path": "src/flyout/index.ts",
7564
+ "path": "src/grid-layout-item/index.ts",
7557
7565
  "declarations": [],
7558
7566
  "exports": [
7559
7567
  {
@@ -7561,22 +7569,14 @@
7561
7569
  "name": "*",
7562
7570
  "declaration": {
7563
7571
  "name": "*",
7564
- "package": "./flyout"
7565
- }
7566
- },
7567
- {
7568
- "kind": "js",
7569
- "name": "*",
7570
- "declaration": {
7571
- "name": "*",
7572
- "package": "./flyout.styles"
7572
+ "package": "./grid-layout-item"
7573
7573
  }
7574
7574
  },
7575
7575
  {
7576
7576
  "kind": "js",
7577
- "name": "zeroFlyoutTemplate",
7577
+ "name": "zeroGridLayoutItemTemplate",
7578
7578
  "declaration": {
7579
- "name": "foundationFlyoutTemplate",
7579
+ "name": "foundationGridLayoutItemTemplate",
7580
7580
  "package": "@genesislcap/foundation-ui"
7581
7581
  }
7582
7582
  }