@genesislcap/foundation-ui 14.154.1-alpha-8d19918.0 → 14.154.1-alpha-2fdebc5.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.
@@ -826,6 +826,37 @@
826
826
  }
827
827
  ]
828
828
  },
829
+ {
830
+ "kind": "javascript-module",
831
+ "path": "src/_config/index.ts",
832
+ "declarations": [],
833
+ "exports": [
834
+ {
835
+ "kind": "js",
836
+ "name": "*",
837
+ "declaration": {
838
+ "name": "*",
839
+ "package": "./styles"
840
+ }
841
+ },
842
+ {
843
+ "kind": "js",
844
+ "name": "*",
845
+ "declaration": {
846
+ "name": "*",
847
+ "package": "./tokens"
848
+ }
849
+ },
850
+ {
851
+ "kind": "js",
852
+ "name": "*",
853
+ "declaration": {
854
+ "name": "*",
855
+ "package": "./values"
856
+ }
857
+ }
858
+ ]
859
+ },
829
860
  {
830
861
  "kind": "javascript-module",
831
862
  "path": "src/accordion/accordion.styles.ts",
@@ -1008,37 +1039,6 @@
1008
1039
  }
1009
1040
  ]
1010
1041
  },
1011
- {
1012
- "kind": "javascript-module",
1013
- "path": "src/_config/index.ts",
1014
- "declarations": [],
1015
- "exports": [
1016
- {
1017
- "kind": "js",
1018
- "name": "*",
1019
- "declaration": {
1020
- "name": "*",
1021
- "package": "./styles"
1022
- }
1023
- },
1024
- {
1025
- "kind": "js",
1026
- "name": "*",
1027
- "declaration": {
1028
- "name": "*",
1029
- "package": "./tokens"
1030
- }
1031
- },
1032
- {
1033
- "kind": "js",
1034
- "name": "*",
1035
- "declaration": {
1036
- "name": "*",
1037
- "package": "./values"
1038
- }
1039
- }
1040
- ]
1041
- },
1042
1042
  {
1043
1043
  "kind": "javascript-module",
1044
1044
  "path": "src/accordion-item/accordion-item.styles.ts",
@@ -17574,137 +17574,193 @@
17574
17574
  },
17575
17575
  {
17576
17576
  "kind": "javascript-module",
17577
- "path": "src/flyout/flyout.styles.ts",
17577
+ "path": "src/flipper/flipper.styles.ts",
17578
17578
  "declarations": [
17579
17579
  {
17580
- "kind": "variable",
17581
- "name": "flyoutAnimationTime",
17582
- "type": {
17583
- "text": "number"
17584
- },
17585
- "default": "225"
17586
- },
17587
- {
17588
- "kind": "variable",
17589
- "name": "foundationFlyoutStyles",
17590
- "type": {
17591
- "text": "ElementStyles"
17580
+ "kind": "function",
17581
+ "name": "foundationFlipperStyles",
17582
+ "return": {
17583
+ "type": {
17584
+ "text": "ElementStyles"
17585
+ }
17592
17586
  },
17593
- "default": "css`\n /* Host */\n :host {\n display: inline-block;\n height: 100vh;\n position: absolute;\n width: 100vw;\n }\n\n :host([closed]) {\n display: none;\n }\n\n div.container {\n height: 100%;\n width: 100%;\n }\n\n /* flyout */\n div.flyout {\n background-color: white;\n color: black;\n height: 100%;\n position: absolute;\n /* stylelint-disable-next-line function-name-case */\n transition: transform ${flyoutAnimationTime.toString()}ms ease-in;\n width: 20%;\n z-index: 2001;\n }\n\n :host([position='left']) div.flyout {\n left: 0;\n transform: translateX(0%);\n }\n\n :host([position='right']) div.flyout {\n right: 0;\n transform: translateX(0%);\n }\n\n :host([visuallyhidden][position='left']) div.flyout {\n left: 0;\n transform: translateX(-100%);\n }\n\n :host([visuallyhidden][position='right']) div.flyout {\n right: 0;\n transform: translateX(100%);\n }\n\n div.header {\n align-items: center;\n display: flex;\n padding: calc(var(--design-unit) * 3px) calc(var(--design-unit) * 2px);\n }\n\n div.title {\n flex-grow: 1;\n }\n\n div.footer {\n bottom: 0;\n position: absolute;\n width: 100%;\n }\n\n /* Background */\n div.background {\n background-color: black;\n height: 100%;\n opacity: 50%;\n position: absolute;\n /* stylelint-disable-next-line function-name-case */\n transition: opacity ${flyoutAnimationTime.toString()}ms linear;\n width: 100%;\n z-index: 2000;\n }\n\n :host([visuallyhidden]) div.background {\n opacity: 0%;\n }\n`"
17587
+ "parameters": [
17588
+ {
17589
+ "name": "context",
17590
+ "type": {
17591
+ "text": "ElementDefinitionContext"
17592
+ }
17593
+ },
17594
+ {
17595
+ "name": "definition",
17596
+ "type": {
17597
+ "text": "FlipperOptions"
17598
+ }
17599
+ }
17600
+ ]
17594
17601
  }
17595
17602
  ],
17596
17603
  "exports": [
17597
17604
  {
17598
17605
  "kind": "js",
17599
- "name": "flyoutAnimationTime",
17600
- "declaration": {
17601
- "name": "flyoutAnimationTime",
17602
- "module": "src/flyout/flyout.styles.ts"
17603
- }
17604
- },
17605
- {
17606
- "kind": "js",
17607
- "name": "foundationFlyoutStyles",
17606
+ "name": "foundationFlipperStyles",
17608
17607
  "declaration": {
17609
- "name": "foundationFlyoutStyles",
17610
- "module": "src/flyout/flyout.styles.ts"
17608
+ "name": "foundationFlipperStyles",
17609
+ "module": "src/flipper/flipper.styles.ts"
17611
17610
  }
17612
17611
  }
17613
17612
  ]
17614
17613
  },
17615
17614
  {
17616
17615
  "kind": "javascript-module",
17617
- "path": "src/flyout/flyout.template.ts",
17616
+ "path": "src/flipper/flipper.template.ts",
17618
17617
  "declarations": [
17619
17618
  {
17620
17619
  "kind": "function",
17621
- "name": "getPrefixedFlyout",
17620
+ "name": "foundationFlipperTemplate",
17621
+ "return": {
17622
+ "type": {
17623
+ "text": "ViewTemplate<Flipper>"
17624
+ }
17625
+ },
17622
17626
  "parameters": [
17623
17627
  {
17624
- "name": "prefix",
17628
+ "name": "context",
17625
17629
  "type": {
17626
- "text": "string"
17630
+ "text": "ElementDefinitionContext"
17631
+ }
17632
+ },
17633
+ {
17634
+ "name": "definition",
17635
+ "type": {
17636
+ "text": "FlipperOptions"
17627
17637
  }
17628
17638
  }
17629
17639
  ]
17630
- },
17631
- {
17632
- "kind": "variable",
17633
- "name": "foundationFlyoutTemplate",
17634
- "default": "html<Flyout>`\n ${(x) => getPrefixedFlyout(getPrefix(x))}\n`"
17635
17640
  }
17636
17641
  ],
17637
17642
  "exports": [
17638
17643
  {
17639
17644
  "kind": "js",
17640
- "name": "getPrefixedFlyout",
17641
- "declaration": {
17642
- "name": "getPrefixedFlyout",
17643
- "module": "src/flyout/flyout.template.ts"
17644
- }
17645
- },
17646
- {
17647
- "kind": "js",
17648
- "name": "foundationFlyoutTemplate",
17645
+ "name": "foundationFlipperTemplate",
17649
17646
  "declaration": {
17650
- "name": "foundationFlyoutTemplate",
17651
- "module": "src/flyout/flyout.template.ts"
17647
+ "name": "foundationFlipperTemplate",
17648
+ "module": "src/flipper/flipper.template.ts"
17652
17649
  }
17653
17650
  }
17654
17651
  ]
17655
17652
  },
17656
17653
  {
17657
17654
  "kind": "javascript-module",
17658
- "path": "src/flyout/flyout.ts",
17655
+ "path": "src/flipper/flipper.ts",
17659
17656
  "declarations": [
17660
17657
  {
17661
17658
  "kind": "class",
17662
17659
  "description": "",
17663
- "name": "Flyout",
17664
- "members": [
17660
+ "name": "Flipper",
17661
+ "superclass": {
17662
+ "name": "FASTFlipper",
17663
+ "package": "@microsoft/fast-components"
17664
+ },
17665
+ "tagName": "%%prefix%%-flipper",
17666
+ "customElement": true,
17667
+ "attributes": [
17665
17668
  {
17666
- "kind": "field",
17667
- "name": "position",
17668
17669
  "type": {
17669
- "text": "string"
17670
+ "text": "boolean"
17670
17671
  },
17671
- "default": "'right'"
17672
+ "description": "The disabled state of the flipper.",
17673
+ "fieldName": "disabled",
17674
+ "inheritedFrom": {
17675
+ "name": "Flipper",
17676
+ "module": "src/flipper/flipper.ts"
17677
+ }
17672
17678
  },
17673
17679
  {
17674
- "kind": "field",
17675
- "name": "displayHeader",
17680
+ "name": "aria-hidden",
17676
17681
  "type": {
17677
17682
  "text": "boolean"
17678
17683
  },
17679
- "default": "true"
17684
+ "default": "true",
17685
+ "description": "Indicates the flipper should be hidden from assistive technology. Because flippers are often supplementary navigation, they are often hidden from assistive technology.",
17686
+ "fieldName": "hiddenFromAT",
17687
+ "inheritedFrom": {
17688
+ "name": "Flipper",
17689
+ "module": "src/flipper/flipper.ts"
17690
+ }
17680
17691
  },
17692
+ {
17693
+ "name": "direction",
17694
+ "type": {
17695
+ "text": "FlipperDirection"
17696
+ },
17697
+ "description": "The direction that the flipper implies navigating.",
17698
+ "fieldName": "direction",
17699
+ "inheritedFrom": {
17700
+ "name": "Flipper",
17701
+ "module": "src/flipper/flipper.ts"
17702
+ }
17703
+ }
17704
+ ],
17705
+ "members": [
17681
17706
  {
17682
17707
  "kind": "field",
17683
- "name": "closed",
17708
+ "name": "disabled",
17684
17709
  "type": {
17685
17710
  "text": "boolean"
17686
17711
  },
17687
- "default": "true"
17688
- },
17689
- {
17690
- "kind": "method",
17691
- "name": "closedChanged"
17712
+ "privacy": "public",
17713
+ "description": "The disabled state of the flipper.",
17714
+ "inheritedFrom": {
17715
+ "name": "Flipper",
17716
+ "module": "src/flipper/flipper.ts"
17717
+ }
17692
17718
  },
17693
17719
  {
17694
17720
  "kind": "field",
17695
- "name": "visuallyhidden",
17721
+ "name": "hiddenFromAT",
17696
17722
  "type": {
17697
17723
  "text": "boolean"
17698
17724
  },
17699
- "default": "true"
17725
+ "privacy": "public",
17726
+ "default": "true",
17727
+ "description": "Indicates the flipper should be hidden from assistive technology. Because flippers are often supplementary navigation, they are often hidden from assistive technology.",
17728
+ "inheritedFrom": {
17729
+ "name": "Flipper",
17730
+ "module": "src/flipper/flipper.ts"
17731
+ }
17700
17732
  },
17701
17733
  {
17702
- "kind": "method",
17703
- "name": "closeFlyout"
17734
+ "kind": "field",
17735
+ "name": "direction",
17736
+ "type": {
17737
+ "text": "FlipperDirection"
17738
+ },
17739
+ "privacy": "public",
17740
+ "description": "The direction that the flipper implies navigating.",
17741
+ "inheritedFrom": {
17742
+ "name": "Flipper",
17743
+ "module": "src/flipper/flipper.ts"
17744
+ }
17704
17745
  },
17705
17746
  {
17706
17747
  "kind": "method",
17707
- "name": "closingFinished"
17748
+ "name": "keyupHandler",
17749
+ "privacy": "public",
17750
+ "parameters": [
17751
+ {
17752
+ "name": "e",
17753
+ "type": {
17754
+ "text": "Event & KeyboardEvent"
17755
+ },
17756
+ "description": "Keyboard event"
17757
+ }
17758
+ ],
17759
+ "description": "Simulate a click event when the flipper has focus and the user hits enter or space keys\nBlur focus if the user hits escape key",
17760
+ "inheritedFrom": {
17761
+ "name": "Flipper",
17762
+ "module": "src/flipper/flipper.ts"
17763
+ }
17708
17764
  },
17709
17765
  {
17710
17766
  "kind": "field",
@@ -17818,47 +17874,20 @@
17818
17874
  }
17819
17875
  }
17820
17876
  ],
17821
- "attributes": [
17822
- {
17823
- "name": "position",
17824
- "type": {
17825
- "text": "string"
17826
- },
17827
- "default": "'right'",
17828
- "fieldName": "position"
17829
- },
17830
- {
17831
- "type": {
17832
- "text": "boolean"
17833
- },
17834
- "default": "true",
17835
- "fieldName": "displayHeader"
17836
- },
17837
- {
17838
- "type": {
17839
- "text": "boolean"
17840
- },
17841
- "default": "true",
17842
- "fieldName": "closed"
17843
- },
17877
+ "events": [
17844
17878
  {
17845
- "type": {
17846
- "text": "boolean"
17847
- },
17848
- "default": "true",
17849
- "fieldName": "visuallyhidden"
17879
+ "description": "Fires a custom 'click' event when Enter or Space is invoked via keyboard and the flipper is exposed to assistive technologies.",
17880
+ "name": "click",
17881
+ "inheritedFrom": {
17882
+ "name": "Flipper",
17883
+ "module": "src/flipper/flipper.ts"
17884
+ }
17850
17885
  }
17851
- ],
17852
- "superclass": {
17853
- "name": "FoundationElement",
17854
- "package": "@microsoft/fast-foundation"
17855
- },
17856
- "tagName": "%%prefix%%-flyout",
17857
- "customElement": true
17886
+ ]
17858
17887
  },
17859
17888
  {
17860
17889
  "kind": "variable",
17861
- "name": "foundationFlyoutShadowOptions",
17890
+ "name": "foundationFlipperShadowOptions",
17862
17891
  "type": {
17863
17892
  "text": "ShadowRootInit"
17864
17893
  },
@@ -17866,57 +17895,57 @@
17866
17895
  },
17867
17896
  {
17868
17897
  "kind": "variable",
17869
- "name": "defaultFlyoutConfig",
17898
+ "name": "defaultFlipperConfig",
17870
17899
  "type": {
17871
17900
  "text": "object"
17872
17901
  },
17873
- "default": "{}"
17902
+ "default": "{\n next: `\n <svg viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M4.023 15.273L11.29 8 4.023.727l.704-.704L12.71 8l-7.984 7.977-.704-.704z\"\n />\n </svg>\n `,\n previous: `\n <svg viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.273 15.977L3.29 8 11.273.023l.704.704L4.71 8l7.266 7.273-.704.704z\"\n />\n </svg>\n `,\n}"
17874
17903
  },
17875
17904
  {
17876
17905
  "kind": "variable",
17877
- "name": "foundationFlyout",
17878
- "description": "The Foundation Flyout",
17906
+ "name": "foundationFlipper",
17907
+ "description": "The Foundation Flipper",
17879
17908
  "privacy": "public"
17880
17909
  }
17881
17910
  ],
17882
17911
  "exports": [
17883
17912
  {
17884
17913
  "kind": "js",
17885
- "name": "Flyout",
17914
+ "name": "Flipper",
17886
17915
  "declaration": {
17887
- "name": "Flyout",
17888
- "module": "src/flyout/flyout.ts"
17916
+ "name": "Flipper",
17917
+ "module": "src/flipper/flipper.ts"
17889
17918
  }
17890
17919
  },
17891
17920
  {
17892
17921
  "kind": "js",
17893
- "name": "foundationFlyoutShadowOptions",
17922
+ "name": "foundationFlipperShadowOptions",
17894
17923
  "declaration": {
17895
- "name": "foundationFlyoutShadowOptions",
17896
- "module": "src/flyout/flyout.ts"
17924
+ "name": "foundationFlipperShadowOptions",
17925
+ "module": "src/flipper/flipper.ts"
17897
17926
  }
17898
17927
  },
17899
17928
  {
17900
17929
  "kind": "js",
17901
- "name": "defaultFlyoutConfig",
17930
+ "name": "defaultFlipperConfig",
17902
17931
  "declaration": {
17903
- "name": "defaultFlyoutConfig",
17904
- "module": "src/flyout/flyout.ts"
17932
+ "name": "defaultFlipperConfig",
17933
+ "module": "src/flipper/flipper.ts"
17905
17934
  }
17906
17935
  },
17907
17936
  {
17908
17937
  "kind": "js",
17909
- "name": "foundationFlyout",
17938
+ "name": "foundationFlipper",
17910
17939
  "declaration": {
17911
- "name": "foundationFlyout",
17912
- "module": "src/flyout/flyout.ts"
17940
+ "name": "foundationFlipper",
17941
+ "module": "src/flipper/flipper.ts"
17913
17942
  }
17914
17943
  }
17915
17944
  ]
17916
17945
  },
17917
17946
  {
17918
17947
  "kind": "javascript-module",
17919
- "path": "src/flyout/index.ts",
17948
+ "path": "src/flipper/index.ts",
17920
17949
  "declarations": [],
17921
17950
  "exports": [
17922
17951
  {
@@ -17924,7 +17953,7 @@
17924
17953
  "name": "*",
17925
17954
  "declaration": {
17926
17955
  "name": "*",
17927
- "package": "./flyout"
17956
+ "package": "./flipper.template"
17928
17957
  }
17929
17958
  },
17930
17959
  {
@@ -17932,7 +17961,7 @@
17932
17961
  "name": "*",
17933
17962
  "declaration": {
17934
17963
  "name": "*",
17935
- "package": "./flyout.template"
17964
+ "package": "./flipper.styles"
17936
17965
  }
17937
17966
  },
17938
17967
  {
@@ -17940,200 +17969,144 @@
17940
17969
  "name": "*",
17941
17970
  "declaration": {
17942
17971
  "name": "*",
17943
- "package": "./flyout.styles"
17972
+ "package": "./flipper"
17944
17973
  }
17945
17974
  }
17946
17975
  ]
17947
17976
  },
17948
17977
  {
17949
17978
  "kind": "javascript-module",
17950
- "path": "src/flipper/flipper.styles.ts",
17979
+ "path": "src/flyout/flyout.styles.ts",
17951
17980
  "declarations": [
17952
17981
  {
17953
- "kind": "function",
17954
- "name": "foundationFlipperStyles",
17955
- "return": {
17956
- "type": {
17957
- "text": "ElementStyles"
17958
- }
17982
+ "kind": "variable",
17983
+ "name": "flyoutAnimationTime",
17984
+ "type": {
17985
+ "text": "number"
17959
17986
  },
17960
- "parameters": [
17961
- {
17962
- "name": "context",
17963
- "type": {
17964
- "text": "ElementDefinitionContext"
17965
- }
17966
- },
17967
- {
17968
- "name": "definition",
17969
- "type": {
17970
- "text": "FlipperOptions"
17971
- }
17972
- }
17973
- ]
17987
+ "default": "225"
17988
+ },
17989
+ {
17990
+ "kind": "variable",
17991
+ "name": "foundationFlyoutStyles",
17992
+ "type": {
17993
+ "text": "ElementStyles"
17994
+ },
17995
+ "default": "css`\n /* Host */\n :host {\n display: inline-block;\n height: 100vh;\n position: absolute;\n width: 100vw;\n }\n\n :host([closed]) {\n display: none;\n }\n\n div.container {\n height: 100%;\n width: 100%;\n }\n\n /* flyout */\n div.flyout {\n background-color: white;\n color: black;\n height: 100%;\n position: absolute;\n /* stylelint-disable-next-line function-name-case */\n transition: transform ${flyoutAnimationTime.toString()}ms ease-in;\n width: 20%;\n z-index: 2001;\n }\n\n :host([position='left']) div.flyout {\n left: 0;\n transform: translateX(0%);\n }\n\n :host([position='right']) div.flyout {\n right: 0;\n transform: translateX(0%);\n }\n\n :host([visuallyhidden][position='left']) div.flyout {\n left: 0;\n transform: translateX(-100%);\n }\n\n :host([visuallyhidden][position='right']) div.flyout {\n right: 0;\n transform: translateX(100%);\n }\n\n div.header {\n align-items: center;\n display: flex;\n padding: calc(var(--design-unit) * 3px) calc(var(--design-unit) * 2px);\n }\n\n div.title {\n flex-grow: 1;\n }\n\n div.footer {\n bottom: 0;\n position: absolute;\n width: 100%;\n }\n\n /* Background */\n div.background {\n background-color: black;\n height: 100%;\n opacity: 50%;\n position: absolute;\n /* stylelint-disable-next-line function-name-case */\n transition: opacity ${flyoutAnimationTime.toString()}ms linear;\n width: 100%;\n z-index: 2000;\n }\n\n :host([visuallyhidden]) div.background {\n opacity: 0%;\n }\n`"
17974
17996
  }
17975
17997
  ],
17976
17998
  "exports": [
17977
17999
  {
17978
18000
  "kind": "js",
17979
- "name": "foundationFlipperStyles",
18001
+ "name": "flyoutAnimationTime",
17980
18002
  "declaration": {
17981
- "name": "foundationFlipperStyles",
17982
- "module": "src/flipper/flipper.styles.ts"
18003
+ "name": "flyoutAnimationTime",
18004
+ "module": "src/flyout/flyout.styles.ts"
18005
+ }
18006
+ },
18007
+ {
18008
+ "kind": "js",
18009
+ "name": "foundationFlyoutStyles",
18010
+ "declaration": {
18011
+ "name": "foundationFlyoutStyles",
18012
+ "module": "src/flyout/flyout.styles.ts"
17983
18013
  }
17984
18014
  }
17985
18015
  ]
17986
18016
  },
17987
18017
  {
17988
18018
  "kind": "javascript-module",
17989
- "path": "src/flipper/flipper.template.ts",
18019
+ "path": "src/flyout/flyout.template.ts",
17990
18020
  "declarations": [
17991
18021
  {
17992
18022
  "kind": "function",
17993
- "name": "foundationFlipperTemplate",
17994
- "return": {
17995
- "type": {
17996
- "text": "ViewTemplate<Flipper>"
17997
- }
17998
- },
18023
+ "name": "getPrefixedFlyout",
17999
18024
  "parameters": [
18000
18025
  {
18001
- "name": "context",
18002
- "type": {
18003
- "text": "ElementDefinitionContext"
18004
- }
18005
- },
18006
- {
18007
- "name": "definition",
18026
+ "name": "prefix",
18008
18027
  "type": {
18009
- "text": "FlipperOptions"
18028
+ "text": "string"
18010
18029
  }
18011
18030
  }
18012
18031
  ]
18032
+ },
18033
+ {
18034
+ "kind": "variable",
18035
+ "name": "foundationFlyoutTemplate",
18036
+ "default": "html<Flyout>`\n ${(x) => getPrefixedFlyout(getPrefix(x))}\n`"
18013
18037
  }
18014
18038
  ],
18015
18039
  "exports": [
18016
18040
  {
18017
18041
  "kind": "js",
18018
- "name": "foundationFlipperTemplate",
18042
+ "name": "getPrefixedFlyout",
18019
18043
  "declaration": {
18020
- "name": "foundationFlipperTemplate",
18021
- "module": "src/flipper/flipper.template.ts"
18044
+ "name": "getPrefixedFlyout",
18045
+ "module": "src/flyout/flyout.template.ts"
18046
+ }
18047
+ },
18048
+ {
18049
+ "kind": "js",
18050
+ "name": "foundationFlyoutTemplate",
18051
+ "declaration": {
18052
+ "name": "foundationFlyoutTemplate",
18053
+ "module": "src/flyout/flyout.template.ts"
18022
18054
  }
18023
18055
  }
18024
18056
  ]
18025
18057
  },
18026
18058
  {
18027
18059
  "kind": "javascript-module",
18028
- "path": "src/flipper/flipper.ts",
18060
+ "path": "src/flyout/flyout.ts",
18029
18061
  "declarations": [
18030
18062
  {
18031
18063
  "kind": "class",
18032
18064
  "description": "",
18033
- "name": "Flipper",
18034
- "superclass": {
18035
- "name": "FASTFlipper",
18036
- "package": "@microsoft/fast-components"
18037
- },
18038
- "tagName": "%%prefix%%-flipper",
18039
- "customElement": true,
18040
- "attributes": [
18065
+ "name": "Flyout",
18066
+ "members": [
18041
18067
  {
18068
+ "kind": "field",
18069
+ "name": "position",
18042
18070
  "type": {
18043
- "text": "boolean"
18071
+ "text": "string"
18044
18072
  },
18045
- "description": "The disabled state of the flipper.",
18046
- "fieldName": "disabled",
18047
- "inheritedFrom": {
18048
- "name": "Flipper",
18049
- "module": "src/flipper/flipper.ts"
18050
- }
18073
+ "default": "'right'"
18051
18074
  },
18052
18075
  {
18053
- "name": "aria-hidden",
18076
+ "kind": "field",
18077
+ "name": "displayHeader",
18054
18078
  "type": {
18055
18079
  "text": "boolean"
18056
18080
  },
18057
- "default": "true",
18058
- "description": "Indicates the flipper should be hidden from assistive technology. Because flippers are often supplementary navigation, they are often hidden from assistive technology.",
18059
- "fieldName": "hiddenFromAT",
18060
- "inheritedFrom": {
18061
- "name": "Flipper",
18062
- "module": "src/flipper/flipper.ts"
18063
- }
18081
+ "default": "true"
18064
18082
  },
18065
- {
18066
- "name": "direction",
18067
- "type": {
18068
- "text": "FlipperDirection"
18069
- },
18070
- "description": "The direction that the flipper implies navigating.",
18071
- "fieldName": "direction",
18072
- "inheritedFrom": {
18073
- "name": "Flipper",
18074
- "module": "src/flipper/flipper.ts"
18075
- }
18076
- }
18077
- ],
18078
- "members": [
18079
18083
  {
18080
18084
  "kind": "field",
18081
- "name": "disabled",
18085
+ "name": "closed",
18082
18086
  "type": {
18083
18087
  "text": "boolean"
18084
18088
  },
18085
- "privacy": "public",
18086
- "description": "The disabled state of the flipper.",
18087
- "inheritedFrom": {
18088
- "name": "Flipper",
18089
- "module": "src/flipper/flipper.ts"
18090
- }
18089
+ "default": "true"
18090
+ },
18091
+ {
18092
+ "kind": "method",
18093
+ "name": "closedChanged"
18091
18094
  },
18092
18095
  {
18093
18096
  "kind": "field",
18094
- "name": "hiddenFromAT",
18097
+ "name": "visuallyhidden",
18095
18098
  "type": {
18096
18099
  "text": "boolean"
18097
18100
  },
18098
- "privacy": "public",
18099
- "default": "true",
18100
- "description": "Indicates the flipper should be hidden from assistive technology. Because flippers are often supplementary navigation, they are often hidden from assistive technology.",
18101
- "inheritedFrom": {
18102
- "name": "Flipper",
18103
- "module": "src/flipper/flipper.ts"
18104
- }
18101
+ "default": "true"
18105
18102
  },
18106
18103
  {
18107
- "kind": "field",
18108
- "name": "direction",
18109
- "type": {
18110
- "text": "FlipperDirection"
18111
- },
18112
- "privacy": "public",
18113
- "description": "The direction that the flipper implies navigating.",
18114
- "inheritedFrom": {
18115
- "name": "Flipper",
18116
- "module": "src/flipper/flipper.ts"
18117
- }
18104
+ "kind": "method",
18105
+ "name": "closeFlyout"
18118
18106
  },
18119
18107
  {
18120
18108
  "kind": "method",
18121
- "name": "keyupHandler",
18122
- "privacy": "public",
18123
- "parameters": [
18124
- {
18125
- "name": "e",
18126
- "type": {
18127
- "text": "Event & KeyboardEvent"
18128
- },
18129
- "description": "Keyboard event"
18130
- }
18131
- ],
18132
- "description": "Simulate a click event when the flipper has focus and the user hits enter or space keys\nBlur focus if the user hits escape key",
18133
- "inheritedFrom": {
18134
- "name": "Flipper",
18135
- "module": "src/flipper/flipper.ts"
18136
- }
18109
+ "name": "closingFinished"
18137
18110
  },
18138
18111
  {
18139
18112
  "kind": "field",
@@ -18247,20 +18220,47 @@
18247
18220
  }
18248
18221
  }
18249
18222
  ],
18250
- "events": [
18223
+ "attributes": [
18251
18224
  {
18252
- "description": "Fires a custom 'click' event when Enter or Space is invoked via keyboard and the flipper is exposed to assistive technologies.",
18253
- "name": "click",
18254
- "inheritedFrom": {
18255
- "name": "Flipper",
18256
- "module": "src/flipper/flipper.ts"
18257
- }
18225
+ "name": "position",
18226
+ "type": {
18227
+ "text": "string"
18228
+ },
18229
+ "default": "'right'",
18230
+ "fieldName": "position"
18231
+ },
18232
+ {
18233
+ "type": {
18234
+ "text": "boolean"
18235
+ },
18236
+ "default": "true",
18237
+ "fieldName": "displayHeader"
18238
+ },
18239
+ {
18240
+ "type": {
18241
+ "text": "boolean"
18242
+ },
18243
+ "default": "true",
18244
+ "fieldName": "closed"
18245
+ },
18246
+ {
18247
+ "type": {
18248
+ "text": "boolean"
18249
+ },
18250
+ "default": "true",
18251
+ "fieldName": "visuallyhidden"
18258
18252
  }
18259
- ]
18253
+ ],
18254
+ "superclass": {
18255
+ "name": "FoundationElement",
18256
+ "package": "@microsoft/fast-foundation"
18257
+ },
18258
+ "tagName": "%%prefix%%-flyout",
18259
+ "customElement": true
18260
18260
  },
18261
18261
  {
18262
18262
  "kind": "variable",
18263
- "name": "foundationFlipperShadowOptions",
18263
+ "name": "foundationFlyoutShadowOptions",
18264
18264
  "type": {
18265
18265
  "text": "ShadowRootInit"
18266
18266
  },
@@ -18268,57 +18268,57 @@
18268
18268
  },
18269
18269
  {
18270
18270
  "kind": "variable",
18271
- "name": "defaultFlipperConfig",
18271
+ "name": "defaultFlyoutConfig",
18272
18272
  "type": {
18273
18273
  "text": "object"
18274
18274
  },
18275
- "default": "{\n next: `\n <svg viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M4.023 15.273L11.29 8 4.023.727l.704-.704L12.71 8l-7.984 7.977-.704-.704z\"\n />\n </svg>\n `,\n previous: `\n <svg viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M11.273 15.977L3.29 8 11.273.023l.704.704L4.71 8l7.266 7.273-.704.704z\"\n />\n </svg>\n `,\n}"
18275
+ "default": "{}"
18276
18276
  },
18277
18277
  {
18278
18278
  "kind": "variable",
18279
- "name": "foundationFlipper",
18280
- "description": "The Foundation Flipper",
18279
+ "name": "foundationFlyout",
18280
+ "description": "The Foundation Flyout",
18281
18281
  "privacy": "public"
18282
18282
  }
18283
18283
  ],
18284
18284
  "exports": [
18285
18285
  {
18286
18286
  "kind": "js",
18287
- "name": "Flipper",
18287
+ "name": "Flyout",
18288
18288
  "declaration": {
18289
- "name": "Flipper",
18290
- "module": "src/flipper/flipper.ts"
18289
+ "name": "Flyout",
18290
+ "module": "src/flyout/flyout.ts"
18291
18291
  }
18292
18292
  },
18293
18293
  {
18294
18294
  "kind": "js",
18295
- "name": "foundationFlipperShadowOptions",
18295
+ "name": "foundationFlyoutShadowOptions",
18296
18296
  "declaration": {
18297
- "name": "foundationFlipperShadowOptions",
18298
- "module": "src/flipper/flipper.ts"
18297
+ "name": "foundationFlyoutShadowOptions",
18298
+ "module": "src/flyout/flyout.ts"
18299
18299
  }
18300
18300
  },
18301
18301
  {
18302
18302
  "kind": "js",
18303
- "name": "defaultFlipperConfig",
18303
+ "name": "defaultFlyoutConfig",
18304
18304
  "declaration": {
18305
- "name": "defaultFlipperConfig",
18306
- "module": "src/flipper/flipper.ts"
18305
+ "name": "defaultFlyoutConfig",
18306
+ "module": "src/flyout/flyout.ts"
18307
18307
  }
18308
18308
  },
18309
18309
  {
18310
18310
  "kind": "js",
18311
- "name": "foundationFlipper",
18311
+ "name": "foundationFlyout",
18312
18312
  "declaration": {
18313
- "name": "foundationFlipper",
18314
- "module": "src/flipper/flipper.ts"
18313
+ "name": "foundationFlyout",
18314
+ "module": "src/flyout/flyout.ts"
18315
18315
  }
18316
18316
  }
18317
18317
  ]
18318
18318
  },
18319
18319
  {
18320
18320
  "kind": "javascript-module",
18321
- "path": "src/flipper/index.ts",
18321
+ "path": "src/flyout/index.ts",
18322
18322
  "declarations": [],
18323
18323
  "exports": [
18324
18324
  {
@@ -18326,7 +18326,7 @@
18326
18326
  "name": "*",
18327
18327
  "declaration": {
18328
18328
  "name": "*",
18329
- "package": "./flipper.template"
18329
+ "package": "./flyout"
18330
18330
  }
18331
18331
  },
18332
18332
  {
@@ -18334,7 +18334,7 @@
18334
18334
  "name": "*",
18335
18335
  "declaration": {
18336
18336
  "name": "*",
18337
- "package": "./flipper.styles"
18337
+ "package": "./flyout.template"
18338
18338
  }
18339
18339
  },
18340
18340
  {
@@ -18342,7 +18342,7 @@
18342
18342
  "name": "*",
18343
18343
  "declaration": {
18344
18344
  "name": "*",
18345
- "package": "./flipper"
18345
+ "package": "./flyout.styles"
18346
18346
  }
18347
18347
  }
18348
18348
  ]
@@ -33275,7 +33275,7 @@
33275
33275
  "type": {
33276
33276
  "text": "ElementStyles"
33277
33277
  },
33278
- "default": "css`\n :host {\n display: flex;\n height: 100%;\n width: 100%;\n }\n\n :host([orientation='horizontal']) {\n flex-direction: column;\n }\n\n .stepper-tab {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n max-width: 280px;\n border-radius: 0;\n }\n\n .action-buttons-container {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n }\n\n .stepper-panel-container {\n height: 100%;\n overflow: hidden;\n padding: 15px;\n }\n\n .stepper-tab-menu {\n display: flex;\n flex-direction: column;\n width: 100%;\n margin-bottom: 30px;\n }\n\n .stepper-tab-progress {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: start;\n flex: 1;\n }\n\n .stepper-tab-progress .progress-ring {\n --design-unit: 10;\n\n margin: 0;\n }\n\n .stepper-tab-panel {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n width: 100%;\n min-width: 370px;\n border-radius: 0;\n }\n\n label {\n padding: 0 10px;\n color: rgb(135 155 166);\n display: block;\n cursor: pointer;\n text-align: center;\n font-size: var(--type-ramp-base-font-size);\n line-height: var(--type-ramp-base-line-height);\n font-style: normal;\n margin: calc(var(--design-unit) * 2px) 0;\n }\n\n :host([orientation='horizontal']) .stepper-tab-menu {\n height: 100%;\n flex-direction: row;\n margin-bottom: 0;\n align-items: center;\n justify-content: center;\n }\n\n :host([orientation='horizontal']) .stepper-tab {\n max-width: 100%;\n max-height: 70px;\n }\n`"
33278
+ "default": "css`\n :host {\n display: flex;\n height: 100%;\n width: 100%;\n }\n\n :host([orientation='horizontal']) {\n flex-direction: column;\n }\n\n .stepper-tab {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n max-width: 280px;\n border-radius: 0;\n }\n\n .action-buttons-container {\n width: 100%;\n display: flex;\n justify-content: flex-end;\n }\n\n .stepper-panel-container {\n height: 100%;\n padding: 15px;\n }\n\n .stepper-tab-menu {\n display: flex;\n flex-direction: column;\n width: 100%;\n margin-bottom: 30px;\n }\n\n .stepper-tab-progress {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: start;\n flex: 1;\n }\n\n .stepper-tab-progress .progress-ring {\n --design-unit: 10;\n\n margin: 0;\n }\n\n .stepper-tab-panel {\n display: flex;\n flex-direction: column;\n width: 100%;\n min-width: 370px;\n border-radius: 0;\n }\n\n label {\n padding: 0 10px;\n color: rgb(135 155 166);\n display: block;\n cursor: pointer;\n text-align: center;\n font-size: var(--type-ramp-base-font-size);\n line-height: var(--type-ramp-base-line-height);\n font-style: normal;\n margin: calc(var(--design-unit) * 2px) 0;\n }\n\n :host([orientation='horizontal']) .stepper-tab-menu {\n height: 100%;\n flex-direction: row;\n margin-bottom: 0;\n align-items: center;\n justify-content: center;\n }\n\n :host([orientation='horizontal']) .stepper-tab {\n max-width: 100%;\n max-height: 70px;\n }\n`"
33279
33279
  }
33280
33280
  ],
33281
33281
  "exports": [
@@ -42414,6 +42414,55 @@
42414
42414
  }
42415
42415
  ]
42416
42416
  },
42417
+ {
42418
+ "kind": "javascript-module",
42419
+ "path": "src/flex-layout/responsiveness/flex-layout-rwd.styles.ts",
42420
+ "declarations": [
42421
+ {
42422
+ "kind": "function",
42423
+ "name": "flexLayoutRWDStyles",
42424
+ "return": {
42425
+ "type": {
42426
+ "text": "ElementStyles"
42427
+ }
42428
+ },
42429
+ "parameters": [
42430
+ {
42431
+ "name": "breakPoint",
42432
+ "optional": true,
42433
+ "type": {
42434
+ "text": "FlexBreakPointType"
42435
+ }
42436
+ }
42437
+ ]
42438
+ }
42439
+ ],
42440
+ "exports": [
42441
+ {
42442
+ "kind": "js",
42443
+ "name": "flexLayoutRWDStyles",
42444
+ "declaration": {
42445
+ "name": "flexLayoutRWDStyles",
42446
+ "module": "src/flex-layout/responsiveness/flex-layout-rwd.styles.ts"
42447
+ }
42448
+ }
42449
+ ]
42450
+ },
42451
+ {
42452
+ "kind": "javascript-module",
42453
+ "path": "src/flex-layout/responsiveness/index.ts",
42454
+ "declarations": [],
42455
+ "exports": [
42456
+ {
42457
+ "kind": "js",
42458
+ "name": "*",
42459
+ "declaration": {
42460
+ "name": "*",
42461
+ "package": "./flex-layout-rwd.styles"
42462
+ }
42463
+ }
42464
+ ]
42465
+ },
42417
42466
  {
42418
42467
  "kind": "javascript-module",
42419
42468
  "path": "src/_config/values/color.ts",
@@ -42563,55 +42612,6 @@
42563
42612
  "declarations": [],
42564
42613
  "exports": []
42565
42614
  },
42566
- {
42567
- "kind": "javascript-module",
42568
- "path": "src/flex-layout/responsiveness/flex-layout-rwd.styles.ts",
42569
- "declarations": [
42570
- {
42571
- "kind": "function",
42572
- "name": "flexLayoutRWDStyles",
42573
- "return": {
42574
- "type": {
42575
- "text": "ElementStyles"
42576
- }
42577
- },
42578
- "parameters": [
42579
- {
42580
- "name": "breakPoint",
42581
- "optional": true,
42582
- "type": {
42583
- "text": "FlexBreakPointType"
42584
- }
42585
- }
42586
- ]
42587
- }
42588
- ],
42589
- "exports": [
42590
- {
42591
- "kind": "js",
42592
- "name": "flexLayoutRWDStyles",
42593
- "declaration": {
42594
- "name": "flexLayoutRWDStyles",
42595
- "module": "src/flex-layout/responsiveness/flex-layout-rwd.styles.ts"
42596
- }
42597
- }
42598
- ]
42599
- },
42600
- {
42601
- "kind": "javascript-module",
42602
- "path": "src/flex-layout/responsiveness/index.ts",
42603
- "declarations": [],
42604
- "exports": [
42605
- {
42606
- "kind": "js",
42607
- "name": "*",
42608
- "declaration": {
42609
- "name": "*",
42610
- "package": "./flex-layout-rwd.styles"
42611
- }
42612
- }
42613
- ]
42614
- },
42615
42615
  {
42616
42616
  "kind": "javascript-module",
42617
42617
  "path": "src/grid-layout/responsiveness/grid-layout-rwd.styles.ts",
@@ -1 +1 @@
1
- {"version":3,"file":"stepper.styles.d.ts","sourceRoot":"","sources":["../../../src/stepper/stepper.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAE7D,eAAO,MAAM,uBAAuB,EAAE,aAsFrC,CAAC"}
1
+ {"version":3,"file":"stepper.styles.d.ts","sourceRoot":"","sources":["../../../src/stepper/stepper.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAE7D,eAAO,MAAM,uBAAuB,EAAE,aAoFrC,CAAC"}
@@ -27,7 +27,6 @@ export const foundationStepperStyles = css `
27
27
 
28
28
  .stepper-panel-container {
29
29
  height: 100%;
30
- overflow: hidden;
31
30
  padding: 15px;
32
31
  }
33
32
 
@@ -55,7 +54,6 @@ export const foundationStepperStyles = css `
55
54
  .stepper-tab-panel {
56
55
  display: flex;
57
56
  flex-direction: column;
58
- justify-content: space-between;
59
57
  width: 100%;
60
58
  min-width: 370px;
61
59
  border-radius: 0;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@genesislcap/foundation-ui",
3
3
  "description": "Genesis Foundation UI",
4
- "version": "14.154.1-alpha-8d19918.0",
4
+ "version": "14.154.1-alpha-2fdebc5.0",
5
5
  "sideEffects": false,
6
6
  "license": "SEE LICENSE IN license.txt",
7
7
  "main": "dist/esm/index.js",
@@ -74,13 +74,13 @@
74
74
  "test:debug": "genx test --debug"
75
75
  },
76
76
  "devDependencies": {
77
- "@genesislcap/foundation-testing": "14.154.1-alpha-8d19918.0",
78
- "@genesislcap/genx": "14.154.1-alpha-8d19918.0",
79
- "@genesislcap/rollup-builder": "14.154.1-alpha-8d19918.0",
80
- "@genesislcap/ts-builder": "14.154.1-alpha-8d19918.0",
81
- "@genesislcap/uvu-playwright-builder": "14.154.1-alpha-8d19918.0",
82
- "@genesislcap/vite-builder": "14.154.1-alpha-8d19918.0",
83
- "@genesislcap/webpack-builder": "14.154.1-alpha-8d19918.0",
77
+ "@genesislcap/foundation-testing": "14.154.1-alpha-2fdebc5.0",
78
+ "@genesislcap/genx": "14.154.1-alpha-2fdebc5.0",
79
+ "@genesislcap/rollup-builder": "14.154.1-alpha-2fdebc5.0",
80
+ "@genesislcap/ts-builder": "14.154.1-alpha-2fdebc5.0",
81
+ "@genesislcap/uvu-playwright-builder": "14.154.1-alpha-2fdebc5.0",
82
+ "@genesislcap/vite-builder": "14.154.1-alpha-2fdebc5.0",
83
+ "@genesislcap/webpack-builder": "14.154.1-alpha-2fdebc5.0",
84
84
  "copyfiles": "^2.4.1",
85
85
  "rimraf": "^3.0.2",
86
86
  "rxjs": "^7.5.4"
@@ -91,12 +91,12 @@
91
91
  "@fortawesome/free-regular-svg-icons": "^6.2.1",
92
92
  "@fortawesome/free-solid-svg-icons": "^6.2.1",
93
93
  "@genesiscommunitysuccess/analyzer-import-alias-plugin": "^4.0.0",
94
- "@genesislcap/foundation-comms": "14.154.1-alpha-8d19918.0",
95
- "@genesislcap/foundation-criteria": "14.154.1-alpha-8d19918.0",
96
- "@genesislcap/foundation-errors": "14.154.1-alpha-8d19918.0",
97
- "@genesislcap/foundation-logger": "14.154.1-alpha-8d19918.0",
98
- "@genesislcap/foundation-notifications": "14.154.1-alpha-8d19918.0",
99
- "@genesislcap/foundation-utils": "14.154.1-alpha-8d19918.0",
94
+ "@genesislcap/foundation-comms": "14.154.1-alpha-2fdebc5.0",
95
+ "@genesislcap/foundation-criteria": "14.154.1-alpha-2fdebc5.0",
96
+ "@genesislcap/foundation-errors": "14.154.1-alpha-2fdebc5.0",
97
+ "@genesislcap/foundation-logger": "14.154.1-alpha-2fdebc5.0",
98
+ "@genesislcap/foundation-notifications": "14.154.1-alpha-2fdebc5.0",
99
+ "@genesislcap/foundation-utils": "14.154.1-alpha-2fdebc5.0",
100
100
  "@microsoft/fast-colors": "^5.3.1",
101
101
  "@microsoft/fast-components": "^2.30.6",
102
102
  "@microsoft/fast-element": "^1.12.0",
@@ -118,5 +118,5 @@
118
118
  "access": "public"
119
119
  },
120
120
  "customElements": "dist/custom-elements.json",
121
- "gitHead": "546c73a201f2f16d8640935369e66c16f06afb13"
121
+ "gitHead": "8365a6f02cf5a69c3b77b741c793b7dd6ddf872e"
122
122
  }