@emuanalytics/flow-rdf-ui 0.0.6 → 0.0.7

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 (6) hide show
  1. package/dist/custom-elements.json +879 -872
  2. package/dist/flow-rdf-ui.d.ts +1 -1
  3. package/dist/flow-rdf-ui.js +19 -3
  4. package/dist/flow-rdf-ui.umd.cjs +19 -3
  5. package/dist/vscode.html-custom-data.json +80 -80
  6. package/package.json +1 -1
package/dist/custom-elements.json CHANGED
@@ -674,99 +674,167 @@
674
674
  },
675
675
  {
676
676
  "kind": "javascript-module",
677
- "path": "components/breadcrumb/breadcrumb.js",
677
+ "path": "components/avatar/avatar.js",
678
678
  "declarations": [
679
679
  {
680
680
  "kind": "class",
681
681
  "description": "",
682
- "name": "FlowBreadcrumb",
682
+ "name": "FlowAvatar",
683
+ "cssProperties": [
684
+ {
685
+ "description": "The size of the avatar.",
686
+ "name": "--size"
687
+ }
688
+ ],
683
689
  "cssParts": [
684
690
  {
685
691
  "description": "The component's base wrapper.",
686
692
  "name": "base"
693
+ },
694
+ {
695
+ "description": "The container that wraps the avatar's icon.",
696
+ "name": "icon"
697
+ },
698
+ {
699
+ "description": "The container that wraps the avatar's initials.",
700
+ "name": "initials"
701
+ },
702
+ {
703
+ "description": "The avatar image. Only shown when the `image` attribute is set.",
704
+ "name": "image"
687
705
  }
688
706
  ],
689
707
  "slots": [
690
708
  {
691
- "description": "One or more breadcrumb items to display.",
692
- "name": ""
693
- },
694
- {
695
- "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
696
- "name": "separator"
709
+ "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
710
+ "name": "icon"
697
711
  }
698
712
  ],
699
713
  "members": [
700
714
  {
701
715
  "kind": "field",
702
- "name": "localize",
716
+ "name": "hasError",
717
+ "type": {
718
+ "text": "boolean"
719
+ },
703
720
  "privacy": "private",
704
- "readonly": true,
705
- "default": "new LocalizeController(this)"
721
+ "default": "false"
706
722
  },
707
723
  {
708
724
  "kind": "field",
709
- "name": "separatorDir",
710
- "privacy": "private"
725
+ "name": "image",
726
+ "type": {
727
+ "text": "string"
728
+ },
729
+ "default": "''",
730
+ "description": "The image source to use for the avatar.",
731
+ "attribute": "image"
711
732
  },
712
733
  {
713
734
  "kind": "field",
714
- "name": "defaultSlot",
735
+ "name": "label",
715
736
  "type": {
716
- "text": "HTMLSlotElement"
717
- }
737
+ "text": "string"
738
+ },
739
+ "default": "''",
740
+ "description": "A label to use to describe the avatar to assistive devices.",
741
+ "attribute": "label"
718
742
  },
719
743
  {
720
744
  "kind": "field",
721
- "name": "separatorSlot",
745
+ "name": "initials",
722
746
  "type": {
723
- "text": "HTMLSlotElement"
724
- }
747
+ "text": "string"
748
+ },
749
+ "default": "''",
750
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
751
+ "attribute": "initials"
725
752
  },
726
753
  {
727
754
  "kind": "field",
728
- "name": "label",
755
+ "name": "loading",
729
756
  "type": {
730
- "text": "string"
757
+ "text": "'eager' | 'lazy'"
731
758
  },
732
- "default": "''",
733
- "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
734
- "attribute": "label"
759
+ "default": "'eager'",
760
+ "description": "Indicates how the browser should load the image.",
761
+ "attribute": "loading"
735
762
  },
736
763
  {
737
- "kind": "method",
738
- "name": "getSeparator",
739
- "privacy": "private"
764
+ "kind": "field",
765
+ "name": "shape",
766
+ "type": {
767
+ "text": "'circle' | 'square' | 'rounded'"
768
+ },
769
+ "default": "'circle'",
770
+ "description": "The shape of the avatar.",
771
+ "attribute": "shape",
772
+ "reflects": true
740
773
  },
741
774
  {
742
775
  "kind": "method",
743
- "name": "handleSlotChange",
744
- "privacy": "private"
776
+ "name": "handleImageChange"
745
777
  }
746
778
  ],
747
779
  "attributes": [
780
+ {
781
+ "name": "image",
782
+ "type": {
783
+ "text": "string"
784
+ },
785
+ "default": "''",
786
+ "description": "The image source to use for the avatar.",
787
+ "fieldName": "image"
788
+ },
748
789
  {
749
790
  "name": "label",
750
791
  "type": {
751
792
  "text": "string"
752
793
  },
753
794
  "default": "''",
754
- "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
795
+ "description": "A label to use to describe the avatar to assistive devices.",
755
796
  "fieldName": "label"
797
+ },
798
+ {
799
+ "name": "initials",
800
+ "type": {
801
+ "text": "string"
802
+ },
803
+ "default": "''",
804
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
805
+ "fieldName": "initials"
806
+ },
807
+ {
808
+ "name": "loading",
809
+ "type": {
810
+ "text": "'eager' | 'lazy'"
811
+ },
812
+ "default": "'eager'",
813
+ "description": "Indicates how the browser should load the image.",
814
+ "fieldName": "loading"
815
+ },
816
+ {
817
+ "name": "shape",
818
+ "type": {
819
+ "text": "'circle' | 'square' | 'rounded'"
820
+ },
821
+ "default": "'circle'",
822
+ "description": "The shape of the avatar.",
823
+ "fieldName": "shape"
756
824
  }
757
825
  ],
758
826
  "superclass": {
759
827
  "name": "FlowRdfElement",
760
828
  "module": "/src/internal/flow-ui-rdf-element"
761
829
  },
762
- "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
763
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb",
830
+ "summary": "Avatars are used to represent a person or object.",
831
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/avatar",
764
832
  "status": "stable",
765
833
  "since": "2.0",
766
834
  "dependencies": [
767
835
  "flow-ui-icon"
768
836
  ],
769
- "tagName": "flow-ui-breadcrumb",
837
+ "tagName": "flow-ui-avatar",
770
838
  "customElement": true
771
839
  }
772
840
  ],
@@ -775,16 +843,16 @@
775
843
  "kind": "js",
776
844
  "name": "default",
777
845
  "declaration": {
778
- "name": "FlowBreadcrumb",
779
- "module": "components/breadcrumb/breadcrumb.js"
846
+ "name": "FlowAvatar",
847
+ "module": "components/avatar/avatar.js"
780
848
  }
781
849
  },
782
850
  {
783
851
  "kind": "custom-element-definition",
784
- "name": "flow-ui-breadcrumb",
852
+ "name": "flow-ui-avatar",
785
853
  "declaration": {
786
- "name": "FlowBreadcrumb",
787
- "module": "components/breadcrumb/breadcrumb.js"
854
+ "name": "FlowAvatar",
855
+ "module": "components/avatar/avatar.js"
788
856
  }
789
857
  }
790
858
  ]
@@ -934,303 +1002,135 @@
934
1002
  },
935
1003
  {
936
1004
  "kind": "javascript-module",
937
- "path": "components/button-group/button-group.js",
1005
+ "path": "components/button/button.js",
938
1006
  "declarations": [
939
1007
  {
940
1008
  "kind": "class",
941
1009
  "description": "",
942
- "name": "FlowButtonGroup",
1010
+ "name": "FlowButton",
943
1011
  "cssParts": [
944
1012
  {
945
1013
  "description": "The component's base wrapper.",
946
1014
  "name": "base"
1015
+ },
1016
+ {
1017
+ "description": "The container that wraps the prefix.",
1018
+ "name": "prefix"
1019
+ },
1020
+ {
1021
+ "description": "The button's label.",
1022
+ "name": "label"
1023
+ },
1024
+ {
1025
+ "description": "The container that wraps the suffix.",
1026
+ "name": "suffix"
1027
+ },
1028
+ {
1029
+ "description": "The button's caret icon, an `<flow-ui-icon>` element.",
1030
+ "name": "caret"
947
1031
  }
948
1032
  ],
949
1033
  "slots": [
950
1034
  {
951
- "description": "One or more `<flow-ui-button>` elements to display in the button group.",
1035
+ "description": "The button's label.",
952
1036
  "name": ""
1037
+ },
1038
+ {
1039
+ "description": "A presentational prefix icon or similar element.",
1040
+ "name": "prefix"
1041
+ },
1042
+ {
1043
+ "description": "A presentational suffix icon or similar element.",
1044
+ "name": "suffix"
953
1045
  }
954
1046
  ],
955
1047
  "members": [
956
1048
  {
957
1049
  "kind": "field",
958
- "name": "defaultSlot",
1050
+ "name": "formControlController",
1051
+ "privacy": "private",
1052
+ "readonly": true,
1053
+ "default": "new FormControlController(this, {\n form: input => {\n // Buttons support a form attribute that points to an arbitrary form, so if this attribute is set we need to query\n // the form from the same root using its id\n if (input.hasAttribute('form')) {\n const doc = input.getRootNode() as Document | ShadowRoot;\n const formId = input.getAttribute('form')!;\n return doc.getElementById(formId) as HTMLFormElement;\n }\n\n // Fall back to the closest containing form\n return input.closest('form');\n },\n assumeInteractionOn: ['click']\n })"
1054
+ },
1055
+ {
1056
+ "kind": "field",
1057
+ "name": "hasSlotController",
1058
+ "privacy": "private",
1059
+ "readonly": true,
1060
+ "default": "new HasSlotController(this, '[default]', 'prefix', 'suffix')"
1061
+ },
1062
+ {
1063
+ "kind": "field",
1064
+ "name": "localize",
1065
+ "privacy": "private",
1066
+ "readonly": true,
1067
+ "default": "new LocalizeController(this)"
1068
+ },
1069
+ {
1070
+ "kind": "field",
1071
+ "name": "button",
959
1072
  "type": {
960
- "text": "HTMLSlotElement"
1073
+ "text": "HTMLButtonElement | HTMLLinkElement"
961
1074
  }
962
1075
  },
963
1076
  {
964
1077
  "kind": "field",
965
- "name": "disableRole",
1078
+ "name": "hasFocus",
966
1079
  "type": {
967
1080
  "text": "boolean"
968
1081
  },
1082
+ "privacy": "private",
969
1083
  "default": "false"
970
1084
  },
971
1085
  {
972
1086
  "kind": "field",
973
- "name": "label",
1087
+ "name": "invalid",
1088
+ "type": {
1089
+ "text": "boolean"
1090
+ },
1091
+ "default": "false"
1092
+ },
1093
+ {
1094
+ "kind": "field",
1095
+ "name": "title",
974
1096
  "type": {
975
1097
  "text": "string"
976
1098
  },
977
1099
  "default": "''",
978
- "attribute": "label"
1100
+ "attribute": "title"
979
1101
  },
980
1102
  {
981
1103
  "kind": "field",
982
- "name": "vertical",
1104
+ "name": "variant",
983
1105
  "type": {
984
- "text": "boolean"
1106
+ "text": "'default' | 'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text'"
985
1107
  },
986
- "default": "false",
987
- "description": "Use vertical layout for the button group.",
988
- "attribute": "vertical",
1108
+ "default": "'default'",
1109
+ "description": "The button's theme variant.",
1110
+ "attribute": "variant",
989
1111
  "reflects": true
990
1112
  },
991
1113
  {
992
- "kind": "method",
993
- "name": "handleVerticalChange"
1114
+ "kind": "field",
1115
+ "name": "size",
1116
+ "type": {
1117
+ "text": "'small' | 'medium' | 'large'"
1118
+ },
1119
+ "default": "'medium'",
1120
+ "description": "The button's size.",
1121
+ "attribute": "size",
1122
+ "reflects": true
994
1123
  },
995
1124
  {
996
- "kind": "method",
997
- "name": "handleFocus",
998
- "privacy": "private",
999
- "parameters": [
1000
- {
1001
- "name": "event",
1002
- "type": {
1003
- "text": "Event"
1004
- }
1005
- }
1006
- ]
1007
- },
1008
- {
1009
- "kind": "method",
1010
- "name": "handleBlur",
1011
- "privacy": "private",
1012
- "parameters": [
1013
- {
1014
- "name": "event",
1015
- "type": {
1016
- "text": "Event"
1017
- }
1018
- }
1019
- ]
1020
- },
1021
- {
1022
- "kind": "method",
1023
- "name": "handleMouseOver",
1024
- "privacy": "private",
1025
- "parameters": [
1026
- {
1027
- "name": "event",
1028
- "type": {
1029
- "text": "Event"
1030
- }
1031
- }
1032
- ]
1033
- },
1034
- {
1035
- "kind": "method",
1036
- "name": "handleMouseOut",
1037
- "privacy": "private",
1038
- "parameters": [
1039
- {
1040
- "name": "event",
1041
- "type": {
1042
- "text": "Event"
1043
- }
1044
- }
1045
- ]
1046
- },
1047
- {
1048
- "kind": "method",
1049
- "name": "handleSlotChange",
1050
- "privacy": "private"
1051
- }
1052
- ],
1053
- "attributes": [
1054
- {
1055
- "name": "label",
1056
- "type": {
1057
- "text": "string"
1058
- },
1059
- "default": "''",
1060
- "fieldName": "label"
1061
- },
1062
- {
1063
- "name": "vertical",
1064
- "type": {
1065
- "text": "boolean"
1066
- },
1067
- "default": "false",
1068
- "description": "Use vertical layout for the button group.",
1069
- "fieldName": "vertical"
1070
- }
1071
- ],
1072
- "superclass": {
1073
- "name": "FlowRdfElement",
1074
- "module": "/src/internal/flow-ui-rdf-element"
1075
- },
1076
- "summary": "Button groups can be used to group related buttons into sections.",
1077
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/button-group",
1078
- "status": "stable",
1079
- "since": "2.0",
1080
- "tagName": "flow-ui-button-group",
1081
- "customElement": true
1082
- }
1083
- ],
1084
- "exports": [
1085
- {
1086
- "kind": "js",
1087
- "name": "default",
1088
- "declaration": {
1089
- "name": "FlowButtonGroup",
1090
- "module": "components/button-group/button-group.js"
1091
- }
1092
- },
1093
- {
1094
- "kind": "custom-element-definition",
1095
- "name": "flow-ui-button-group",
1096
- "declaration": {
1097
- "name": "FlowButtonGroup",
1098
- "module": "components/button-group/button-group.js"
1099
- }
1100
- }
1101
- ]
1102
- },
1103
- {
1104
- "kind": "javascript-module",
1105
- "path": "components/button/button.js",
1106
- "declarations": [
1107
- {
1108
- "kind": "class",
1109
- "description": "",
1110
- "name": "FlowButton",
1111
- "cssParts": [
1112
- {
1113
- "description": "The component's base wrapper.",
1114
- "name": "base"
1115
- },
1116
- {
1117
- "description": "The container that wraps the prefix.",
1118
- "name": "prefix"
1119
- },
1120
- {
1121
- "description": "The button's label.",
1122
- "name": "label"
1123
- },
1124
- {
1125
- "description": "The container that wraps the suffix.",
1126
- "name": "suffix"
1127
- },
1128
- {
1129
- "description": "The button's caret icon, an `<flow-ui-icon>` element.",
1130
- "name": "caret"
1131
- }
1132
- ],
1133
- "slots": [
1134
- {
1135
- "description": "The button's label.",
1136
- "name": ""
1137
- },
1138
- {
1139
- "description": "A presentational prefix icon or similar element.",
1140
- "name": "prefix"
1141
- },
1142
- {
1143
- "description": "A presentational suffix icon or similar element.",
1144
- "name": "suffix"
1145
- }
1146
- ],
1147
- "members": [
1148
- {
1149
- "kind": "field",
1150
- "name": "formControlController",
1151
- "privacy": "private",
1152
- "readonly": true,
1153
- "default": "new FormControlController(this, {\n form: input => {\n // Buttons support a form attribute that points to an arbitrary form, so if this attribute is set we need to query\n // the form from the same root using its id\n if (input.hasAttribute('form')) {\n const doc = input.getRootNode() as Document | ShadowRoot;\n const formId = input.getAttribute('form')!;\n return doc.getElementById(formId) as HTMLFormElement;\n }\n\n // Fall back to the closest containing form\n return input.closest('form');\n },\n assumeInteractionOn: ['click']\n })"
1154
- },
1155
- {
1156
- "kind": "field",
1157
- "name": "hasSlotController",
1158
- "privacy": "private",
1159
- "readonly": true,
1160
- "default": "new HasSlotController(this, '[default]', 'prefix', 'suffix')"
1161
- },
1162
- {
1163
- "kind": "field",
1164
- "name": "localize",
1165
- "privacy": "private",
1166
- "readonly": true,
1167
- "default": "new LocalizeController(this)"
1168
- },
1169
- {
1170
- "kind": "field",
1171
- "name": "button",
1172
- "type": {
1173
- "text": "HTMLButtonElement | HTMLLinkElement"
1174
- }
1175
- },
1176
- {
1177
- "kind": "field",
1178
- "name": "hasFocus",
1179
- "type": {
1180
- "text": "boolean"
1181
- },
1182
- "privacy": "private",
1183
- "default": "false"
1184
- },
1185
- {
1186
- "kind": "field",
1187
- "name": "invalid",
1188
- "type": {
1189
- "text": "boolean"
1190
- },
1191
- "default": "false"
1192
- },
1193
- {
1194
- "kind": "field",
1195
- "name": "title",
1196
- "type": {
1197
- "text": "string"
1198
- },
1199
- "default": "''",
1200
- "attribute": "title"
1201
- },
1202
- {
1203
- "kind": "field",
1204
- "name": "variant",
1205
- "type": {
1206
- "text": "'default' | 'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text'"
1207
- },
1208
- "default": "'default'",
1209
- "description": "The button's theme variant.",
1210
- "attribute": "variant",
1211
- "reflects": true
1212
- },
1213
- {
1214
- "kind": "field",
1215
- "name": "size",
1216
- "type": {
1217
- "text": "'small' | 'medium' | 'large'"
1218
- },
1219
- "default": "'medium'",
1220
- "description": "The button's size.",
1221
- "attribute": "size",
1222
- "reflects": true
1223
- },
1224
- {
1225
- "kind": "field",
1226
- "name": "caret",
1227
- "type": {
1228
- "text": "boolean"
1229
- },
1230
- "default": "false",
1231
- "description": "Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior.",
1232
- "attribute": "caret",
1233
- "reflects": true
1125
+ "kind": "field",
1126
+ "name": "caret",
1127
+ "type": {
1128
+ "text": "boolean"
1129
+ },
1130
+ "default": "false",
1131
+ "description": "Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior.",
1132
+ "attribute": "caret",
1133
+ "reflects": true
1234
1134
  },
1235
1135
  {
1236
1136
  "kind": "field",
@@ -1779,12 +1679,12 @@
1779
1679
  },
1780
1680
  {
1781
1681
  "kind": "javascript-module",
1782
- "path": "components/badge/badge.js",
1682
+ "path": "components/breadcrumb/breadcrumb.js",
1783
1683
  "declarations": [
1784
1684
  {
1785
1685
  "kind": "class",
1786
1686
  "description": "",
1787
- "name": "FlowBadge",
1687
+ "name": "FlowBreadcrumb",
1788
1688
  "cssParts": [
1789
1689
  {
1790
1690
  "description": "The component's base wrapper.",
@@ -1793,83 +1693,85 @@
1793
1693
  ],
1794
1694
  "slots": [
1795
1695
  {
1796
- "description": "The badge's content.",
1696
+ "description": "One or more breadcrumb items to display.",
1797
1697
  "name": ""
1698
+ },
1699
+ {
1700
+ "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
1701
+ "name": "separator"
1798
1702
  }
1799
1703
  ],
1800
1704
  "members": [
1801
1705
  {
1802
1706
  "kind": "field",
1803
- "name": "variant",
1804
- "type": {
1805
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
1806
- },
1807
- "default": "'primary'",
1808
- "description": "The badge's theme variant.",
1809
- "attribute": "variant",
1810
- "reflects": true
1707
+ "name": "localize",
1708
+ "privacy": "private",
1709
+ "readonly": true,
1710
+ "default": "new LocalizeController(this)"
1811
1711
  },
1812
1712
  {
1813
1713
  "kind": "field",
1814
- "name": "pill",
1714
+ "name": "separatorDir",
1715
+ "privacy": "private"
1716
+ },
1717
+ {
1718
+ "kind": "field",
1719
+ "name": "defaultSlot",
1815
1720
  "type": {
1816
- "text": "boolean"
1817
- },
1818
- "default": "false",
1819
- "description": "Draws a pill-style badge with rounded edges.",
1820
- "attribute": "pill",
1821
- "reflects": true
1721
+ "text": "HTMLSlotElement"
1722
+ }
1822
1723
  },
1823
1724
  {
1824
1725
  "kind": "field",
1825
- "name": "pulse",
1726
+ "name": "separatorSlot",
1826
1727
  "type": {
1827
- "text": "boolean"
1828
- },
1829
- "default": "false",
1830
- "description": "Makes the badge pulsate to draw attention.",
1831
- "attribute": "pulse",
1832
- "reflects": true
1833
- }
1834
- ],
1835
- "attributes": [
1728
+ "text": "HTMLSlotElement"
1729
+ }
1730
+ },
1836
1731
  {
1837
- "name": "variant",
1732
+ "kind": "field",
1733
+ "name": "label",
1838
1734
  "type": {
1839
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
1735
+ "text": "string"
1840
1736
  },
1841
- "default": "'primary'",
1842
- "description": "The badge's theme variant.",
1843
- "fieldName": "variant"
1737
+ "default": "''",
1738
+ "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
1739
+ "attribute": "label"
1844
1740
  },
1845
1741
  {
1846
- "name": "pill",
1847
- "type": {
1848
- "text": "boolean"
1849
- },
1850
- "default": "false",
1851
- "description": "Draws a pill-style badge with rounded edges.",
1852
- "fieldName": "pill"
1742
+ "kind": "method",
1743
+ "name": "getSeparator",
1744
+ "privacy": "private"
1853
1745
  },
1854
1746
  {
1855
- "name": "pulse",
1747
+ "kind": "method",
1748
+ "name": "handleSlotChange",
1749
+ "privacy": "private"
1750
+ }
1751
+ ],
1752
+ "attributes": [
1753
+ {
1754
+ "name": "label",
1856
1755
  "type": {
1857
- "text": "boolean"
1756
+ "text": "string"
1858
1757
  },
1859
- "default": "false",
1860
- "description": "Makes the badge pulsate to draw attention.",
1861
- "fieldName": "pulse"
1758
+ "default": "''",
1759
+ "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
1760
+ "fieldName": "label"
1862
1761
  }
1863
1762
  ],
1864
1763
  "superclass": {
1865
1764
  "name": "FlowRdfElement",
1866
1765
  "module": "/src/internal/flow-ui-rdf-element"
1867
1766
  },
1868
- "summary": "Badges are used to draw attention and display statuses or counts.",
1869
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/badge",
1767
+ "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
1768
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb",
1870
1769
  "status": "stable",
1871
1770
  "since": "2.0",
1872
- "tagName": "flow-ui-badge",
1771
+ "dependencies": [
1772
+ "flow-ui-icon"
1773
+ ],
1774
+ "tagName": "flow-ui-breadcrumb",
1873
1775
  "customElement": true
1874
1776
  }
1875
1777
  ],
@@ -1878,77 +1780,55 @@
1878
1780
  "kind": "js",
1879
1781
  "name": "default",
1880
1782
  "declaration": {
1881
- "name": "FlowBadge",
1882
- "module": "components/badge/badge.js"
1783
+ "name": "FlowBreadcrumb",
1784
+ "module": "components/breadcrumb/breadcrumb.js"
1883
1785
  }
1884
1786
  },
1885
1787
  {
1886
1788
  "kind": "custom-element-definition",
1887
- "name": "flow-ui-badge",
1789
+ "name": "flow-ui-breadcrumb",
1888
1790
  "declaration": {
1889
- "name": "FlowBadge",
1890
- "module": "components/badge/badge.js"
1791
+ "name": "FlowBreadcrumb",
1792
+ "module": "components/breadcrumb/breadcrumb.js"
1891
1793
  }
1892
1794
  }
1893
1795
  ]
1894
1796
  },
1895
1797
  {
1896
1798
  "kind": "javascript-module",
1897
- "path": "components/avatar/avatar.js",
1799
+ "path": "components/button-group/button-group.js",
1898
1800
  "declarations": [
1899
1801
  {
1900
1802
  "kind": "class",
1901
1803
  "description": "",
1902
- "name": "FlowAvatar",
1903
- "cssProperties": [
1904
- {
1905
- "description": "The size of the avatar.",
1906
- "name": "--size"
1907
- }
1908
- ],
1804
+ "name": "FlowButtonGroup",
1909
1805
  "cssParts": [
1910
1806
  {
1911
1807
  "description": "The component's base wrapper.",
1912
1808
  "name": "base"
1913
- },
1914
- {
1915
- "description": "The container that wraps the avatar's icon.",
1916
- "name": "icon"
1917
- },
1918
- {
1919
- "description": "The container that wraps the avatar's initials.",
1920
- "name": "initials"
1921
- },
1922
- {
1923
- "description": "The avatar image. Only shown when the `image` attribute is set.",
1924
- "name": "image"
1925
1809
  }
1926
1810
  ],
1927
1811
  "slots": [
1928
1812
  {
1929
- "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
1930
- "name": "icon"
1813
+ "description": "One or more `<flow-ui-button>` elements to display in the button group.",
1814
+ "name": ""
1931
1815
  }
1932
1816
  ],
1933
1817
  "members": [
1934
1818
  {
1935
1819
  "kind": "field",
1936
- "name": "hasError",
1820
+ "name": "defaultSlot",
1937
1821
  "type": {
1938
- "text": "boolean"
1939
- },
1940
- "privacy": "private",
1941
- "default": "false"
1822
+ "text": "HTMLSlotElement"
1823
+ }
1942
1824
  },
1943
1825
  {
1944
1826
  "kind": "field",
1945
- "name": "image",
1827
+ "name": "disableRole",
1946
1828
  "type": {
1947
- "text": "string"
1829
+ "text": "boolean"
1948
1830
  },
1949
- "default": "''",
1950
- "description": "The image source to use for the avatar.",
1951
- "attribute": "image"
1831
+ "default": "false"
1952
1832
  },
1953
1833
  {
1954
1834
  "kind": "field",
@@ -1957,104 +1837,109 @@
1957
1837
  "text": "string"
1958
1838
  },
1959
1839
  "default": "''",
1960
- "description": "A label to use to describe the avatar to assistive devices.",
1961
1840
  "attribute": "label"
1962
1841
  },
1963
1842
  {
1964
1843
  "kind": "field",
1965
- "name": "initials",
1844
+ "name": "vertical",
1966
1845
  "type": {
1967
- "text": "string"
1846
+ "text": "boolean"
1968
1847
  },
1969
- "default": "''",
1970
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
1971
- "attribute": "initials"
1848
+ "default": "false",
1849
+ "description": "Use vertical layout for the button group.",
1850
+ "attribute": "vertical",
1851
+ "reflects": true
1972
1852
  },
1973
1853
  {
1974
- "kind": "field",
1975
- "name": "loading",
1976
- "type": {
1977
- "text": "'eager' | 'lazy'"
1978
- },
1979
- "default": "'eager'",
1980
- "description": "Indicates how the browser should load the image.",
1981
- "attribute": "loading"
1854
+ "kind": "method",
1855
+ "name": "handleVerticalChange"
1982
1856
  },
1983
1857
  {
1984
- "kind": "field",
1985
- "name": "shape",
1986
- "type": {
1987
- "text": "'circle' | 'square' | 'rounded'"
1988
- },
1989
- "default": "'circle'",
1990
- "description": "The shape of the avatar.",
1991
- "attribute": "shape",
1992
- "reflects": true
1858
+ "kind": "method",
1859
+ "name": "handleFocus",
1860
+ "privacy": "private",
1861
+ "parameters": [
1862
+ {
1863
+ "name": "event",
1864
+ "type": {
1865
+ "text": "Event"
1866
+ }
1867
+ }
1868
+ ]
1993
1869
  },
1994
1870
  {
1995
1871
  "kind": "method",
1996
- "name": "handleImageChange"
1872
+ "name": "handleBlur",
1873
+ "privacy": "private",
1874
+ "parameters": [
1875
+ {
1876
+ "name": "event",
1877
+ "type": {
1878
+ "text": "Event"
1879
+ }
1880
+ }
1881
+ ]
1882
+ },
1883
+ {
1884
+ "kind": "method",
1885
+ "name": "handleMouseOver",
1886
+ "privacy": "private",
1887
+ "parameters": [
1888
+ {
1889
+ "name": "event",
1890
+ "type": {
1891
+ "text": "Event"
1892
+ }
1893
+ }
1894
+ ]
1895
+ },
1896
+ {
1897
+ "kind": "method",
1898
+ "name": "handleMouseOut",
1899
+ "privacy": "private",
1900
+ "parameters": [
1901
+ {
1902
+ "name": "event",
1903
+ "type": {
1904
+ "text": "Event"
1905
+ }
1906
+ }
1907
+ ]
1908
+ },
1909
+ {
1910
+ "kind": "method",
1911
+ "name": "handleSlotChange",
1912
+ "privacy": "private"
1997
1913
  }
1998
1914
  ],
1999
1915
  "attributes": [
2000
- {
2001
- "name": "image",
2002
- "type": {
2003
- "text": "string"
2004
- },
2005
- "default": "''",
2006
- "description": "The image source to use for the avatar.",
2007
- "fieldName": "image"
2008
- },
2009
1916
  {
2010
1917
  "name": "label",
2011
1918
  "type": {
2012
1919
  "text": "string"
2013
1920
  },
2014
1921
  "default": "''",
2015
- "description": "A label to use to describe the avatar to assistive devices.",
2016
1922
  "fieldName": "label"
2017
1923
  },
2018
1924
  {
2019
- "name": "initials",
2020
- "type": {
2021
- "text": "string"
2022
- },
2023
- "default": "''",
2024
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
2025
- "fieldName": "initials"
2026
- },
2027
- {
2028
- "name": "loading",
2029
- "type": {
2030
- "text": "'eager' | 'lazy'"
2031
- },
2032
- "default": "'eager'",
2033
- "description": "Indicates how the browser should load the image.",
2034
- "fieldName": "loading"
2035
- },
2036
- {
2037
- "name": "shape",
1925
+ "name": "vertical",
2038
1926
  "type": {
2039
- "text": "'circle' | 'square' | 'rounded'"
1927
+ "text": "boolean"
2040
1928
  },
2041
- "default": "'circle'",
2042
- "description": "The shape of the avatar.",
2043
- "fieldName": "shape"
1929
+ "default": "false",
1930
+ "description": "Use vertical layout for the button group.",
1931
+ "fieldName": "vertical"
2044
1932
  }
2045
1933
  ],
2046
1934
  "superclass": {
2047
1935
  "name": "FlowRdfElement",
2048
1936
  "module": "/src/internal/flow-ui-rdf-element"
2049
1937
  },
2050
- "summary": "Avatars are used to represent a person or object.",
2051
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/avatar",
1938
+ "summary": "Button groups can be used to group related buttons into sections.",
1939
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/button-group",
2052
1940
  "status": "stable",
2053
1941
  "since": "2.0",
2054
- "dependencies": [
2055
- "flow-ui-icon"
2056
- ],
2057
- "tagName": "flow-ui-avatar",
1942
+ "tagName": "flow-ui-button-group",
2058
1943
  "customElement": true
2059
1944
  }
2060
1945
  ],
@@ -2063,16 +1948,131 @@
2063
1948
  "kind": "js",
2064
1949
  "name": "default",
2065
1950
  "declaration": {
2066
- "name": "FlowAvatar",
2067
- "module": "components/avatar/avatar.js"
1951
+ "name": "FlowButtonGroup",
1952
+ "module": "components/button-group/button-group.js"
2068
1953
  }
2069
1954
  },
2070
1955
  {
2071
1956
  "kind": "custom-element-definition",
2072
- "name": "flow-ui-avatar",
1957
+ "name": "flow-ui-button-group",
2073
1958
  "declaration": {
2074
- "name": "FlowAvatar",
2075
- "module": "components/avatar/avatar.js"
1959
+ "name": "FlowButtonGroup",
1960
+ "module": "components/button-group/button-group.js"
1961
+ }
1962
+ }
1963
+ ]
1964
+ },
1965
+ {
1966
+ "kind": "javascript-module",
1967
+ "path": "components/badge/badge.js",
1968
+ "declarations": [
1969
+ {
1970
+ "kind": "class",
1971
+ "description": "",
1972
+ "name": "FlowBadge",
1973
+ "cssParts": [
1974
+ {
1975
+ "description": "The component's base wrapper.",
1976
+ "name": "base"
1977
+ }
1978
+ ],
1979
+ "slots": [
1980
+ {
1981
+ "description": "The badge's content.",
1982
+ "name": ""
1983
+ }
1984
+ ],
1985
+ "members": [
1986
+ {
1987
+ "kind": "field",
1988
+ "name": "variant",
1989
+ "type": {
1990
+ "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
1991
+ },
1992
+ "default": "'primary'",
1993
+ "description": "The badge's theme variant.",
1994
+ "attribute": "variant",
1995
+ "reflects": true
1996
+ },
1997
+ {
1998
+ "kind": "field",
1999
+ "name": "pill",
2000
+ "type": {
2001
+ "text": "boolean"
2002
+ },
2003
+ "default": "false",
2004
+ "description": "Draws a pill-style badge with rounded edges.",
2005
+ "attribute": "pill",
2006
+ "reflects": true
2007
+ },
2008
+ {
2009
+ "kind": "field",
2010
+ "name": "pulse",
2011
+ "type": {
2012
+ "text": "boolean"
2013
+ },
2014
+ "default": "false",
2015
+ "description": "Makes the badge pulsate to draw attention.",
2016
+ "attribute": "pulse",
2017
+ "reflects": true
2018
+ }
2019
+ ],
2020
+ "attributes": [
2021
+ {
2022
+ "name": "variant",
2023
+ "type": {
2024
+ "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
2025
+ },
2026
+ "default": "'primary'",
2027
+ "description": "The badge's theme variant.",
2028
+ "fieldName": "variant"
2029
+ },
2030
+ {
2031
+ "name": "pill",
2032
+ "type": {
2033
+ "text": "boolean"
2034
+ },
2035
+ "default": "false",
2036
+ "description": "Draws a pill-style badge with rounded edges.",
2037
+ "fieldName": "pill"
2038
+ },
2039
+ {
2040
+ "name": "pulse",
2041
+ "type": {
2042
+ "text": "boolean"
2043
+ },
2044
+ "default": "false",
2045
+ "description": "Makes the badge pulsate to draw attention.",
2046
+ "fieldName": "pulse"
2047
+ }
2048
+ ],
2049
+ "superclass": {
2050
+ "name": "FlowRdfElement",
2051
+ "module": "/src/internal/flow-ui-rdf-element"
2052
+ },
2053
+ "summary": "Badges are used to draw attention and display statuses or counts.",
2054
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/badge",
2055
+ "status": "stable",
2056
+ "since": "2.0",
2057
+ "tagName": "flow-ui-badge",
2058
+ "customElement": true
2059
+ }
2060
+ ],
2061
+ "exports": [
2062
+ {
2063
+ "kind": "js",
2064
+ "name": "default",
2065
+ "declaration": {
2066
+ "name": "FlowBadge",
2067
+ "module": "components/badge/badge.js"
2068
+ }
2069
+ },
2070
+ {
2071
+ "kind": "custom-element-definition",
2072
+ "name": "flow-ui-badge",
2073
+ "declaration": {
2074
+ "name": "FlowBadge",
2075
+ "module": "components/badge/badge.js"
2076
2076
  }
2077
2077
  }
2078
2078
  ]
@@ -14875,7 +14875,7 @@
14875
14875
  "kind": "field",
14876
14876
  "name": "activePanel",
14877
14877
  "type": {
14878
- "text": "FlowStepperPanel"
14878
+ "text": "FlowStepperPanel | undefined"
14879
14879
  },
14880
14880
  "privacy": "private"
14881
14881
  },
@@ -14944,6 +14944,13 @@
14944
14944
  "type": {
14945
14945
  "text": "FlowStepperPanel"
14946
14946
  }
14947
+ },
14948
+ {
14949
+ "name": "options",
14950
+ "optional": true,
14951
+ "type": {
14952
+ "text": "{ emitEvents?: boolean; scrollBehavior?: 'auto' | 'smooth' }"
14953
+ }
14947
14954
  }
14948
14955
  ]
14949
14956
  },
@@ -15929,272 +15936,401 @@
15929
15936
  },
15930
15937
  {
15931
15938
  "kind": "javascript-module",
15932
- "path": "components/tab-panel/tab-panel.js",
15939
+ "path": "components/tab-group/tab-group.js",
15933
15940
  "declarations": [
15934
15941
  {
15935
15942
  "kind": "class",
15936
15943
  "description": "",
15937
- "name": "FlowTabPanel",
15944
+ "name": "FlowTabGroup",
15938
15945
  "cssProperties": [
15939
15946
  {
15940
- "description": "The tab panel's padding.",
15941
- "name": "--padding"
15947
+ "description": "The color of the active tab indicator.",
15948
+ "name": "--indicator-color"
15949
+ },
15950
+ {
15951
+ "description": "The color of the indicator's track (the line that separates tabs from panels).",
15952
+ "name": "--track-color"
15953
+ },
15954
+ {
15955
+ "description": "The width of the indicator's track (the line that separates tabs from panels).",
15956
+ "name": "--track-width"
15942
15957
  }
15943
15958
  ],
15944
15959
  "cssParts": [
15945
15960
  {
15946
15961
  "description": "The component's base wrapper.",
15947
15962
  "name": "base"
15963
+ },
15964
+ {
15965
+ "description": "The tab group's navigation container where tabs are slotted in.",
15966
+ "name": "nav"
15967
+ },
15968
+ {
15969
+ "description": "The container that wraps the tabs.",
15970
+ "name": "tabs"
15971
+ },
15972
+ {
15973
+ "description": "The line that highlights the currently selected tab.",
15974
+ "name": "active-tab-indicator"
15975
+ },
15976
+ {
15977
+ "description": "The tab group's body where tab panels are slotted in.",
15978
+ "name": "body"
15979
+ },
15980
+ {
15981
+ "description": "The previous/next scroll buttons that show when tabs are scrollable, an `<flow-ui-icon-button>`.",
15982
+ "name": "scroll-button"
15983
+ },
15984
+ {
15985
+ "description": "The starting scroll button.",
15986
+ "name": "scroll-button--start"
15987
+ },
15988
+ {
15989
+ "description": "The ending scroll button.",
15990
+ "name": "scroll-button--end"
15991
+ },
15992
+ {
15993
+ "description": "The scroll button's exported `base` part.",
15994
+ "name": "scroll-button__base"
15948
15995
  }
15949
15996
  ],
15950
15997
  "slots": [
15951
15998
  {
15952
- "description": "The tab panel's content.",
15999
+ "description": "Used for grouping tab panels in the tab group. Must be `<flow-ui-tab-panel>` elements.",
15953
16000
  "name": ""
16001
+ },
16002
+ {
16003
+ "description": "Used for grouping tabs in the tab group. Must be `<flow-ui-tab>` elements.",
16004
+ "name": "nav"
15954
16005
  }
15955
16006
  ],
15956
16007
  "members": [
15957
16008
  {
15958
16009
  "kind": "field",
15959
- "name": "attrId",
15960
- "type": {
15961
- "text": "number"
15962
- },
16010
+ "name": "localize",
15963
16011
  "privacy": "private",
15964
16012
  "readonly": true,
15965
- "default": "++id"
16013
+ "default": "new LocalizeController(this)"
15966
16014
  },
15967
16015
  {
15968
16016
  "kind": "field",
15969
- "name": "componentId",
16017
+ "name": "hasSlotController",
15970
16018
  "privacy": "private",
15971
16019
  "readonly": true,
15972
- "default": "`flow-ui-tab-panel-${this.attrId}`"
16020
+ "default": "new HasSlotController(this, 'nav-accessories-start', 'nav-accessories-end')"
15973
16021
  },
15974
16022
  {
15975
16023
  "kind": "field",
15976
- "name": "name",
16024
+ "name": "activeTab",
15977
16025
  "type": {
15978
- "text": "string"
16026
+ "text": "FlowTab | undefined"
15979
16027
  },
15980
- "default": "''",
15981
- "description": "The tab panel's name.",
15982
- "attribute": "name",
15983
- "reflects": true
16028
+ "privacy": "private"
15984
16029
  },
15985
16030
  {
15986
16031
  "kind": "field",
15987
- "name": "active",
16032
+ "name": "mutationObserver",
15988
16033
  "type": {
15989
- "text": "boolean"
16034
+ "text": "MutationObserver"
15990
16035
  },
15991
- "default": "false",
15992
- "description": "When true, the tab panel will be shown.",
15993
- "attribute": "active",
15994
- "reflects": true
16036
+ "privacy": "private"
15995
16037
  },
15996
16038
  {
15997
- "kind": "method",
15998
- "name": "handleActiveChange"
15999
- }
16000
- ],
16001
- "attributes": [
16039
+ "kind": "field",
16040
+ "name": "resizeObserver",
16041
+ "type": {
16042
+ "text": "ResizeObserver"
16043
+ },
16044
+ "privacy": "private"
16045
+ },
16002
16046
  {
16003
- "name": "name",
16047
+ "kind": "field",
16048
+ "name": "tabs",
16004
16049
  "type": {
16005
- "text": "string"
16050
+ "text": "FlowTab[]"
16006
16051
  },
16007
- "default": "''",
16008
- "description": "The tab panel's name.",
16009
- "fieldName": "name"
16052
+ "privacy": "private",
16053
+ "default": "[]"
16010
16054
  },
16011
16055
  {
16012
- "name": "active",
16056
+ "kind": "field",
16057
+ "name": "panels",
16013
16058
  "type": {
16014
- "text": "boolean"
16059
+ "text": "FlowTabPanel[]"
16015
16060
  },
16016
- "default": "false",
16017
- "description": "When true, the tab panel will be shown.",
16018
- "fieldName": "active"
16019
- }
16020
- ],
16021
- "superclass": {
16022
- "name": "FlowRdfElement",
16023
- "module": "/src/internal/flow-ui-rdf-element"
16024
- },
16025
- "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
16026
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-panel",
16027
- "status": "stable",
16028
- "since": "2.0",
16029
- "tagName": "flow-ui-tab-panel",
16030
- "customElement": true
16031
- }
16032
- ],
16033
- "exports": [
16034
- {
16035
- "kind": "js",
16036
- "name": "default",
16037
- "declaration": {
16038
- "name": "FlowTabPanel",
16039
- "module": "components/tab-panel/tab-panel.js"
16040
- }
16041
- },
16042
- {
16043
- "kind": "custom-element-definition",
16044
- "name": "flow-ui-tab-panel",
16045
- "declaration": {
16046
- "name": "FlowTabPanel",
16047
- "module": "components/tab-panel/tab-panel.js"
16048
- }
16049
- }
16050
- ]
16051
- },
16052
- {
16053
- "kind": "javascript-module",
16054
- "path": "components/tag/tag.js",
16055
- "declarations": [
16056
- {
16057
- "kind": "class",
16058
- "description": "",
16059
- "name": "FlowTag",
16060
- "cssParts": [
16061
- {
16062
- "description": "The component's base wrapper.",
16063
- "name": "base"
16061
+ "privacy": "private",
16062
+ "default": "[]"
16064
16063
  },
16065
16064
  {
16066
- "description": "The tag's content.",
16067
- "name": "content"
16065
+ "kind": "field",
16066
+ "name": "tabGroup",
16067
+ "type": {
16068
+ "text": "HTMLElement"
16069
+ }
16068
16070
  },
16069
16071
  {
16070
- "description": "The tag's remove button, an `<flow-ui-icon-button>`.",
16071
- "name": "remove-button"
16072
+ "kind": "field",
16073
+ "name": "body",
16074
+ "type": {
16075
+ "text": "HTMLSlotElement"
16076
+ }
16072
16077
  },
16073
16078
  {
16074
- "description": "The remove button's exported `base` part.",
16075
- "name": "remove-button__base"
16076
- }
16077
- ],
16078
- "slots": [
16079
+ "kind": "field",
16080
+ "name": "nav",
16081
+ "type": {
16082
+ "text": "HTMLElement"
16083
+ }
16084
+ },
16079
16085
  {
16080
- "description": "The tag's content.",
16081
- "name": ""
16082
- }
16083
- ],
16084
- "members": [
16086
+ "kind": "field",
16087
+ "name": "indicator",
16088
+ "type": {
16089
+ "text": "HTMLElement"
16090
+ }
16091
+ },
16085
16092
  {
16086
16093
  "kind": "field",
16087
- "name": "localize",
16094
+ "name": "hasScrollControls",
16095
+ "type": {
16096
+ "text": "boolean"
16097
+ },
16088
16098
  "privacy": "private",
16089
- "readonly": true,
16090
- "default": "new LocalizeController(this)"
16099
+ "default": "false"
16091
16100
  },
16092
16101
  {
16093
16102
  "kind": "field",
16094
- "name": "variant",
16103
+ "name": "placement",
16095
16104
  "type": {
16096
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text'"
16105
+ "text": "'top' | 'bottom' | 'start' | 'end'"
16097
16106
  },
16098
- "default": "'neutral'",
16099
- "description": "The tag's theme variant.",
16100
- "attribute": "variant",
16101
- "reflects": true
16107
+ "default": "'top'",
16108
+ "description": "The placement of the tabs.",
16109
+ "attribute": "placement"
16102
16110
  },
16103
16111
  {
16104
16112
  "kind": "field",
16105
- "name": "size",
16113
+ "name": "activation",
16106
16114
  "type": {
16107
- "text": "'small' | 'medium' | 'large'"
16115
+ "text": "'auto' | 'manual'"
16108
16116
  },
16109
- "default": "'medium'",
16110
- "description": "The tag's size.",
16111
- "attribute": "size",
16112
- "reflects": true
16117
+ "default": "'auto'",
16118
+ "description": "When set to auto, navigating tabs with the arrow keys will instantly show the corresponding tab panel. When set to\nmanual, the tab will receive focus but will not show until the user presses spacebar or enter.",
16119
+ "attribute": "activation"
16113
16120
  },
16114
16121
  {
16115
16122
  "kind": "field",
16116
- "name": "pill",
16123
+ "name": "noScrollControls",
16117
16124
  "type": {
16118
16125
  "text": "boolean"
16119
16126
  },
16120
16127
  "default": "false",
16121
- "description": "Draws a pill-style tag with rounded edges.",
16122
- "attribute": "pill",
16123
- "reflects": true
16128
+ "description": "Disables the scroll arrows that appear when tabs overflow.",
16129
+ "attribute": "no-scroll-controls"
16124
16130
  },
16125
16131
  {
16126
16132
  "kind": "field",
16127
- "name": "removable",
16133
+ "name": "controlSplitPanel",
16128
16134
  "type": {
16129
16135
  "text": "boolean"
16130
16136
  },
16131
16137
  "default": "false",
16132
- "description": "Makes the tag removable and shows a remove button.",
16133
- "attribute": "removable"
16138
+ "attribute": "control-split-panel"
16134
16139
  },
16135
16140
  {
16136
16141
  "kind": "method",
16137
- "name": "handleRemoveClick",
16142
+ "name": "getAllTabs",
16143
+ "privacy": "private",
16144
+ "parameters": [
16145
+ {
16146
+ "name": "options",
16147
+ "default": "{ includeDisabled: true }",
16148
+ "type": {
16149
+ "text": "{ includeDisabled: boolean }"
16150
+ }
16151
+ }
16152
+ ]
16153
+ },
16154
+ {
16155
+ "kind": "method",
16156
+ "name": "getAllPanels",
16138
16157
  "privacy": "private"
16158
+ },
16159
+ {
16160
+ "kind": "method",
16161
+ "name": "getActiveTab",
16162
+ "privacy": "private"
16163
+ },
16164
+ {
16165
+ "kind": "method",
16166
+ "name": "handleClick",
16167
+ "privacy": "private",
16168
+ "parameters": [
16169
+ {
16170
+ "name": "event",
16171
+ "type": {
16172
+ "text": "MouseEvent"
16173
+ }
16174
+ }
16175
+ ]
16176
+ },
16177
+ {
16178
+ "kind": "method",
16179
+ "name": "handleKeyDown",
16180
+ "privacy": "private",
16181
+ "parameters": [
16182
+ {
16183
+ "name": "event",
16184
+ "type": {
16185
+ "text": "KeyboardEvent"
16186
+ }
16187
+ }
16188
+ ]
16189
+ },
16190
+ {
16191
+ "kind": "method",
16192
+ "name": "handleScrollToStart",
16193
+ "privacy": "private"
16194
+ },
16195
+ {
16196
+ "kind": "method",
16197
+ "name": "handleScrollToEnd",
16198
+ "privacy": "private"
16199
+ },
16200
+ {
16201
+ "kind": "method",
16202
+ "name": "isHorizontal",
16203
+ "privacy": "private"
16204
+ },
16205
+ {
16206
+ "kind": "method",
16207
+ "name": "setActiveTab",
16208
+ "privacy": "private",
16209
+ "parameters": [
16210
+ {
16211
+ "name": "tab",
16212
+ "type": {
16213
+ "text": "FlowTab"
16214
+ }
16215
+ },
16216
+ {
16217
+ "name": "options",
16218
+ "optional": true,
16219
+ "type": {
16220
+ "text": "{ emitEvents?: boolean; scrollBehavior?: 'auto' | 'smooth' }"
16221
+ }
16222
+ }
16223
+ ]
16224
+ },
16225
+ {
16226
+ "kind": "method",
16227
+ "name": "setAriaLabels",
16228
+ "privacy": "private"
16229
+ },
16230
+ {
16231
+ "kind": "method",
16232
+ "name": "repositionIndicator",
16233
+ "privacy": "private"
16234
+ },
16235
+ {
16236
+ "kind": "method",
16237
+ "name": "syncTabsAndPanels",
16238
+ "privacy": "private"
16239
+ },
16240
+ {
16241
+ "kind": "method",
16242
+ "name": "getParentSplitPanel",
16243
+ "privacy": "private"
16244
+ },
16245
+ {
16246
+ "kind": "method",
16247
+ "name": "updateScrollControls"
16248
+ },
16249
+ {
16250
+ "kind": "method",
16251
+ "name": "syncIndicator"
16252
+ },
16253
+ {
16254
+ "kind": "method",
16255
+ "name": "show",
16256
+ "parameters": [
16257
+ {
16258
+ "name": "panel",
16259
+ "type": {
16260
+ "text": "string"
16261
+ }
16262
+ }
16263
+ ],
16264
+ "description": "Shows the specified tab panel."
16139
16265
  }
16140
16266
  ],
16141
16267
  "events": [
16142
16268
  {
16143
- "description": "Emitted when the remove button is activated.",
16144
- "name": "flow-ui-remove",
16145
- "reactName": "onFlowUiRemove"
16269
+ "type": {
16270
+ "text": "{ name: String }"
16271
+ },
16272
+ "description": "Emitted when a tab is shown.",
16273
+ "name": "flow-ui-tab-show",
16274
+ "reactName": "onFlowUiTabShow"
16275
+ },
16276
+ {
16277
+ "type": {
16278
+ "text": "{ name: String }"
16279
+ },
16280
+ "description": "Emitted when a tab is hidden.",
16281
+ "name": "flow-ui-tab-hide",
16282
+ "reactName": "onFlowUiTabHide"
16146
16283
  }
16147
16284
  ],
16148
16285
  "attributes": [
16149
16286
  {
16150
- "name": "variant",
16287
+ "name": "placement",
16151
16288
  "type": {
16152
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text'"
16289
+ "text": "'top' | 'bottom' | 'start' | 'end'"
16153
16290
  },
16154
- "default": "'neutral'",
16155
- "description": "The tag's theme variant.",
16156
- "fieldName": "variant"
16291
+ "default": "'top'",
16292
+ "description": "The placement of the tabs.",
16293
+ "fieldName": "placement"
16157
16294
  },
16158
16295
  {
16159
- "name": "size",
16296
+ "name": "activation",
16160
16297
  "type": {
16161
- "text": "'small' | 'medium' | 'large'"
16298
+ "text": "'auto' | 'manual'"
16162
16299
  },
16163
- "default": "'medium'",
16164
- "description": "The tag's size.",
16165
- "fieldName": "size"
16300
+ "default": "'auto'",
16301
+ "description": "When set to auto, navigating tabs with the arrow keys will instantly show the corresponding tab panel. When set to\nmanual, the tab will receive focus but will not show until the user presses spacebar or enter.",
16302
+ "fieldName": "activation"
16166
16303
  },
16167
16304
  {
16168
- "name": "pill",
16305
+ "name": "no-scroll-controls",
16169
16306
  "type": {
16170
16307
  "text": "boolean"
16171
16308
  },
16172
16309
  "default": "false",
16173
- "description": "Draws a pill-style tag with rounded edges.",
16174
- "fieldName": "pill"
16310
+ "description": "Disables the scroll arrows that appear when tabs overflow.",
16311
+ "fieldName": "noScrollControls"
16175
16312
  },
16176
16313
  {
16177
- "name": "removable",
16314
+ "name": "control-split-panel",
16178
16315
  "type": {
16179
16316
  "text": "boolean"
16180
16317
  },
16181
16318
  "default": "false",
16182
- "description": "Makes the tag removable and shows a remove button.",
16183
- "fieldName": "removable"
16319
+ "fieldName": "controlSplitPanel"
16184
16320
  }
16185
16321
  ],
16186
16322
  "superclass": {
16187
16323
  "name": "FlowRdfElement",
16188
16324
  "module": "/src/internal/flow-ui-rdf-element"
16189
16325
  },
16190
- "summary": "Tags are used as labels to organize things or to indicate a selection.",
16191
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tag",
16326
+ "summary": "Tab groups organize content into a container that shows one section at a time.",
16327
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-group",
16192
16328
  "status": "stable",
16193
16329
  "since": "2.0",
16194
16330
  "dependencies": [
16195
16331
  "flow-ui-icon-button"
16196
16332
  ],
16197
- "tagName": "flow-ui-tag",
16333
+ "tagName": "flow-ui-tab-group",
16198
16334
  "customElement": true
16199
16335
  }
16200
16336
  ],
@@ -16203,417 +16339,288 @@
16203
16339
  "kind": "js",
16204
16340
  "name": "default",
16205
16341
  "declaration": {
16206
- "name": "FlowTag",
16207
- "module": "components/tag/tag.js"
16342
+ "name": "FlowTabGroup",
16343
+ "module": "components/tab-group/tab-group.js"
16208
16344
  }
16209
16345
  },
16210
16346
  {
16211
16347
  "kind": "custom-element-definition",
16212
- "name": "flow-ui-tag",
16348
+ "name": "flow-ui-tab-group",
16213
16349
  "declaration": {
16214
- "name": "FlowTag",
16215
- "module": "components/tag/tag.js"
16350
+ "name": "FlowTabGroup",
16351
+ "module": "components/tab-group/tab-group.js"
16216
16352
  }
16217
16353
  }
16218
16354
  ]
16219
16355
  },
16220
16356
  {
16221
16357
  "kind": "javascript-module",
16222
- "path": "components/tab-group/tab-group.js",
16358
+ "path": "components/tab-panel/tab-panel.js",
16223
16359
  "declarations": [
16224
16360
  {
16225
16361
  "kind": "class",
16226
16362
  "description": "",
16227
- "name": "FlowTabGroup",
16363
+ "name": "FlowTabPanel",
16228
16364
  "cssProperties": [
16229
16365
  {
16230
- "description": "The color of the active tab indicator.",
16231
- "name": "--indicator-color"
16232
- },
16233
- {
16234
- "description": "The color of the indicator's track (the line that separates tabs from panels).",
16235
- "name": "--track-color"
16236
- },
16237
- {
16238
- "description": "The width of the indicator's track (the line that separates tabs from panels).",
16239
- "name": "--track-width"
16366
+ "description": "The tab panel's padding.",
16367
+ "name": "--padding"
16240
16368
  }
16241
16369
  ],
16242
16370
  "cssParts": [
16243
16371
  {
16244
16372
  "description": "The component's base wrapper.",
16245
16373
  "name": "base"
16246
- },
16247
- {
16248
- "description": "The tab group's navigation container where tabs are slotted in.",
16249
- "name": "nav"
16250
- },
16251
- {
16252
- "description": "The container that wraps the tabs.",
16253
- "name": "tabs"
16254
- },
16255
- {
16256
- "description": "The line that highlights the currently selected tab.",
16257
- "name": "active-tab-indicator"
16258
- },
16259
- {
16260
- "description": "The tab group's body where tab panels are slotted in.",
16261
- "name": "body"
16262
- },
16263
- {
16264
- "description": "The previous/next scroll buttons that show when tabs are scrollable, an `<flow-ui-icon-button>`.",
16265
- "name": "scroll-button"
16266
- },
16267
- {
16268
- "description": "The starting scroll button.",
16269
- "name": "scroll-button--start"
16270
- },
16271
- {
16272
- "description": "The ending scroll button.",
16273
- "name": "scroll-button--end"
16274
- },
16275
- {
16276
- "description": "The scroll button's exported `base` part.",
16277
- "name": "scroll-button__base"
16278
16374
  }
16279
16375
  ],
16280
16376
  "slots": [
16281
16377
  {
16282
- "description": "Used for grouping tab panels in the tab group. Must be `<flow-ui-tab-panel>` elements.",
16378
+ "description": "The tab panel's content.",
16283
16379
  "name": ""
16284
- },
16285
- {
16286
- "description": "Used for grouping tabs in the tab group. Must be `<flow-ui-tab>` elements.",
16287
- "name": "nav"
16288
16380
  }
16289
16381
  ],
16290
16382
  "members": [
16291
16383
  {
16292
16384
  "kind": "field",
16293
- "name": "localize",
16385
+ "name": "attrId",
16386
+ "type": {
16387
+ "text": "number"
16388
+ },
16294
16389
  "privacy": "private",
16295
16390
  "readonly": true,
16296
- "default": "new LocalizeController(this)"
16391
+ "default": "++id"
16297
16392
  },
16298
16393
  {
16299
16394
  "kind": "field",
16300
- "name": "hasSlotController",
16395
+ "name": "componentId",
16301
16396
  "privacy": "private",
16302
16397
  "readonly": true,
16303
- "default": "new HasSlotController(this, 'nav-accessories-start', 'nav-accessories-end')"
16398
+ "default": "`flow-ui-tab-panel-${this.attrId}`"
16304
16399
  },
16305
16400
  {
16306
16401
  "kind": "field",
16307
- "name": "activeTab",
16402
+ "name": "name",
16308
16403
  "type": {
16309
- "text": "FlowTab | undefined"
16404
+ "text": "string"
16310
16405
  },
16311
- "privacy": "private"
16406
+ "default": "''",
16407
+ "description": "The tab panel's name.",
16408
+ "attribute": "name",
16409
+ "reflects": true
16312
16410
  },
16313
16411
  {
16314
16412
  "kind": "field",
16315
- "name": "mutationObserver",
16413
+ "name": "active",
16316
16414
  "type": {
16317
- "text": "MutationObserver"
16415
+ "text": "boolean"
16318
16416
  },
16319
- "privacy": "private"
16417
+ "default": "false",
16418
+ "description": "When true, the tab panel will be shown.",
16419
+ "attribute": "active",
16420
+ "reflects": true
16320
16421
  },
16321
16422
  {
16322
- "kind": "field",
16323
- "name": "resizeObserver",
16324
- "type": {
16325
- "text": "ResizeObserver"
16326
- },
16327
- "privacy": "private"
16328
- },
16423
+ "kind": "method",
16424
+ "name": "handleActiveChange"
16425
+ }
16426
+ ],
16427
+ "attributes": [
16329
16428
  {
16330
- "kind": "field",
16331
- "name": "tabs",
16429
+ "name": "name",
16332
16430
  "type": {
16333
- "text": "FlowTab[]"
16431
+ "text": "string"
16334
16432
  },
16335
- "privacy": "private",
16336
- "default": "[]"
16433
+ "default": "''",
16434
+ "description": "The tab panel's name.",
16435
+ "fieldName": "name"
16337
16436
  },
16338
16437
  {
16339
- "kind": "field",
16340
- "name": "panels",
16438
+ "name": "active",
16341
16439
  "type": {
16342
- "text": "FlowTabPanel[]"
16440
+ "text": "boolean"
16343
16441
  },
16344
- "privacy": "private",
16345
- "default": "[]"
16346
- },
16347
- {
16348
- "kind": "field",
16349
- "name": "tabGroup",
16350
- "type": {
16351
- "text": "HTMLElement"
16352
- }
16353
- },
16442
+ "default": "false",
16443
+ "description": "When true, the tab panel will be shown.",
16444
+ "fieldName": "active"
16445
+ }
16446
+ ],
16447
+ "superclass": {
16448
+ "name": "FlowRdfElement",
16449
+ "module": "/src/internal/flow-ui-rdf-element"
16450
+ },
16451
+ "summary": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.",
16452
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-panel",
16453
+ "status": "stable",
16454
+ "since": "2.0",
16455
+ "tagName": "flow-ui-tab-panel",
16456
+ "customElement": true
16457
+ }
16458
+ ],
16459
+ "exports": [
16460
+ {
16461
+ "kind": "js",
16462
+ "name": "default",
16463
+ "declaration": {
16464
+ "name": "FlowTabPanel",
16465
+ "module": "components/tab-panel/tab-panel.js"
16466
+ }
16467
+ },
16468
+ {
16469
+ "kind": "custom-element-definition",
16470
+ "name": "flow-ui-tab-panel",
16471
+ "declaration": {
16472
+ "name": "FlowTabPanel",
16473
+ "module": "components/tab-panel/tab-panel.js"
16474
+ }
16475
+ }
16476
+ ]
16477
+ },
16478
+ {
16479
+ "kind": "javascript-module",
16480
+ "path": "components/tag/tag.js",
16481
+ "declarations": [
16482
+ {
16483
+ "kind": "class",
16484
+ "description": "",
16485
+ "name": "FlowTag",
16486
+ "cssParts": [
16354
16487
  {
16355
- "kind": "field",
16356
- "name": "body",
16357
- "type": {
16358
- "text": "HTMLSlotElement"
16359
- }
16488
+ "description": "The component's base wrapper.",
16489
+ "name": "base"
16360
16490
  },
16361
16491
  {
16362
- "kind": "field",
16363
- "name": "nav",
16364
- "type": {
16365
- "text": "HTMLElement"
16366
- }
16492
+ "description": "The tag's content.",
16493
+ "name": "content"
16367
16494
  },
16368
16495
  {
16369
- "kind": "field",
16370
- "name": "indicator",
16371
- "type": {
16372
- "text": "HTMLElement"
16373
- }
16496
+ "description": "The tag's remove button, an `<flow-ui-icon-button>`.",
16497
+ "name": "remove-button"
16374
16498
  },
16499
+ {
16500
+ "description": "The remove button's exported `base` part.",
16501
+ "name": "remove-button__base"
16502
+ }
16503
+ ],
16504
+ "slots": [
16505
+ {
16506
+ "description": "The tag's content.",
16507
+ "name": ""
16508
+ }
16509
+ ],
16510
+ "members": [
16375
16511
  {
16376
16512
  "kind": "field",
16377
- "name": "hasScrollControls",
16378
- "type": {
16379
- "text": "boolean"
16380
- },
16513
+ "name": "localize",
16381
16514
  "privacy": "private",
16382
- "default": "false"
16515
+ "readonly": true,
16516
+ "default": "new LocalizeController(this)"
16383
16517
  },
16384
16518
  {
16385
16519
  "kind": "field",
16386
- "name": "placement",
16520
+ "name": "variant",
16387
16521
  "type": {
16388
- "text": "'top' | 'bottom' | 'start' | 'end'"
16522
+ "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text'"
16389
16523
  },
16390
- "default": "'top'",
16391
- "description": "The placement of the tabs.",
16392
- "attribute": "placement"
16524
+ "default": "'neutral'",
16525
+ "description": "The tag's theme variant.",
16526
+ "attribute": "variant",
16527
+ "reflects": true
16393
16528
  },
16394
16529
  {
16395
16530
  "kind": "field",
16396
- "name": "activation",
16531
+ "name": "size",
16397
16532
  "type": {
16398
- "text": "'auto' | 'manual'"
16533
+ "text": "'small' | 'medium' | 'large'"
16399
16534
  },
16400
- "default": "'auto'",
16401
- "description": "When set to auto, navigating tabs with the arrow keys will instantly show the corresponding tab panel. When set to\nmanual, the tab will receive focus but will not show until the user presses spacebar or enter.",
16402
- "attribute": "activation"
16535
+ "default": "'medium'",
16536
+ "description": "The tag's size.",
16537
+ "attribute": "size",
16538
+ "reflects": true
16403
16539
  },
16404
16540
  {
16405
16541
  "kind": "field",
16406
- "name": "noScrollControls",
16542
+ "name": "pill",
16407
16543
  "type": {
16408
16544
  "text": "boolean"
16409
16545
  },
16410
16546
  "default": "false",
16411
- "description": "Disables the scroll arrows that appear when tabs overflow.",
16412
- "attribute": "no-scroll-controls"
16547
+ "description": "Draws a pill-style tag with rounded edges.",
16548
+ "attribute": "pill",
16549
+ "reflects": true
16413
16550
  },
16414
16551
  {
16415
16552
  "kind": "field",
16416
- "name": "controlSplitPanel",
16553
+ "name": "removable",
16417
16554
  "type": {
16418
16555
  "text": "boolean"
16419
16556
  },
16420
16557
  "default": "false",
16421
- "attribute": "control-split-panel"
16422
- },
16423
- {
16424
- "kind": "method",
16425
- "name": "getAllTabs",
16426
- "privacy": "private",
16427
- "parameters": [
16428
- {
16429
- "name": "options",
16430
- "default": "{ includeDisabled: true }",
16431
- "type": {
16432
- "text": "{ includeDisabled: boolean }"
16433
- }
16434
- }
16435
- ]
16436
- },
16437
- {
16438
- "kind": "method",
16439
- "name": "getAllPanels",
16440
- "privacy": "private"
16441
- },
16442
- {
16443
- "kind": "method",
16444
- "name": "getActiveTab",
16445
- "privacy": "private"
16446
- },
16447
- {
16448
- "kind": "method",
16449
- "name": "handleClick",
16450
- "privacy": "private",
16451
- "parameters": [
16452
- {
16453
- "name": "event",
16454
- "type": {
16455
- "text": "MouseEvent"
16456
- }
16457
- }
16458
- ]
16459
- },
16460
- {
16461
- "kind": "method",
16462
- "name": "handleKeyDown",
16463
- "privacy": "private",
16464
- "parameters": [
16465
- {
16466
- "name": "event",
16467
- "type": {
16468
- "text": "KeyboardEvent"
16469
- }
16470
- }
16471
- ]
16472
- },
16473
- {
16474
- "kind": "method",
16475
- "name": "handleScrollToStart",
16476
- "privacy": "private"
16477
- },
16478
- {
16479
- "kind": "method",
16480
- "name": "handleScrollToEnd",
16481
- "privacy": "private"
16482
- },
16483
- {
16484
- "kind": "method",
16485
- "name": "isHorizontal",
16486
- "privacy": "private"
16487
- },
16488
- {
16489
- "kind": "method",
16490
- "name": "setActiveTab",
16491
- "privacy": "private",
16492
- "parameters": [
16493
- {
16494
- "name": "tab",
16495
- "type": {
16496
- "text": "FlowTab"
16497
- }
16498
- },
16499
- {
16500
- "name": "options",
16501
- "optional": true,
16502
- "type": {
16503
- "text": "{ emitEvents?: boolean; scrollBehavior?: 'auto' | 'smooth' }"
16504
- }
16505
- }
16506
- ]
16507
- },
16508
- {
16509
- "kind": "method",
16510
- "name": "setAriaLabels",
16511
- "privacy": "private"
16512
- },
16513
- {
16514
- "kind": "method",
16515
- "name": "repositionIndicator",
16516
- "privacy": "private"
16517
- },
16518
- {
16519
- "kind": "method",
16520
- "name": "syncTabsAndPanels",
16521
- "privacy": "private"
16558
+ "description": "Makes the tag removable and shows a remove button.",
16559
+ "attribute": "removable"
16522
16560
  },
16523
16561
  {
16524
16562
  "kind": "method",
16525
- "name": "getParentSplitPanel",
16563
+ "name": "handleRemoveClick",
16526
16564
  "privacy": "private"
16527
- },
16528
- {
16529
- "kind": "method",
16530
- "name": "updateScrollControls"
16531
- },
16532
- {
16533
- "kind": "method",
16534
- "name": "syncIndicator"
16535
- },
16536
- {
16537
- "kind": "method",
16538
- "name": "show",
16539
- "parameters": [
16540
- {
16541
- "name": "panel",
16542
- "type": {
16543
- "text": "string"
16544
- }
16545
- }
16546
- ],
16547
- "description": "Shows the specified tab panel."
16548
16565
  }
16549
16566
  ],
16550
16567
  "events": [
16551
16568
  {
16552
- "type": {
16553
- "text": "{ name: String }"
16554
- },
16555
- "description": "Emitted when a tab is shown.",
16556
- "name": "flow-ui-tab-show",
16557
- "reactName": "onFlowUiTabShow"
16558
- },
16559
- {
16560
- "type": {
16561
- "text": "{ name: String }"
16562
- },
16563
- "description": "Emitted when a tab is hidden.",
16564
- "name": "flow-ui-tab-hide",
16565
- "reactName": "onFlowUiTabHide"
16569
+ "description": "Emitted when the remove button is activated.",
16570
+ "name": "flow-ui-remove",
16571
+ "reactName": "onFlowUiRemove"
16566
16572
  }
16567
16573
  ],
16568
16574
  "attributes": [
16569
16575
  {
16570
- "name": "placement",
16576
+ "name": "variant",
16571
16577
  "type": {
16572
- "text": "'top' | 'bottom' | 'start' | 'end'"
16578
+ "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text'"
16573
16579
  },
16574
- "default": "'top'",
16575
- "description": "The placement of the tabs.",
16576
- "fieldName": "placement"
16580
+ "default": "'neutral'",
16581
+ "description": "The tag's theme variant.",
16582
+ "fieldName": "variant"
16577
16583
  },
16578
16584
  {
16579
- "name": "activation",
16585
+ "name": "size",
16580
16586
  "type": {
16581
- "text": "'auto' | 'manual'"
16587
+ "text": "'small' | 'medium' | 'large'"
16582
16588
  },
16583
- "default": "'auto'",
16584
- "description": "When set to auto, navigating tabs with the arrow keys will instantly show the corresponding tab panel. When set to\nmanual, the tab will receive focus but will not show until the user presses spacebar or enter.",
16585
- "fieldName": "activation"
16589
+ "default": "'medium'",
16590
+ "description": "The tag's size.",
16591
+ "fieldName": "size"
16586
16592
  },
16587
16593
  {
16588
- "name": "no-scroll-controls",
16594
+ "name": "pill",
16589
16595
  "type": {
16590
16596
  "text": "boolean"
16591
16597
  },
16592
16598
  "default": "false",
16593
- "description": "Disables the scroll arrows that appear when tabs overflow.",
16594
- "fieldName": "noScrollControls"
16599
+ "description": "Draws a pill-style tag with rounded edges.",
16600
+ "fieldName": "pill"
16595
16601
  },
16596
16602
  {
16597
- "name": "control-split-panel",
16603
+ "name": "removable",
16598
16604
  "type": {
16599
16605
  "text": "boolean"
16600
16606
  },
16601
16607
  "default": "false",
16602
- "fieldName": "controlSplitPanel"
16608
+ "description": "Makes the tag removable and shows a remove button.",
16609
+ "fieldName": "removable"
16603
16610
  }
16604
16611
  ],
16605
16612
  "superclass": {
16606
16613
  "name": "FlowRdfElement",
16607
16614
  "module": "/src/internal/flow-ui-rdf-element"
16608
16615
  },
16609
- "summary": "Tab groups organize content into a container that shows one section at a time.",
16610
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-group",
16616
+ "summary": "Tags are used as labels to organize things or to indicate a selection.",
16617
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tag",
16611
16618
  "status": "stable",
16612
16619
  "since": "2.0",
16613
16620
  "dependencies": [
16614
16621
  "flow-ui-icon-button"
16615
16622
  ],
16616
- "tagName": "flow-ui-tab-group",
16623
+ "tagName": "flow-ui-tag",
16617
16624
  "customElement": true
16618
16625
  }
16619
16626
  ],
@@ -16622,16 +16629,16 @@
16622
16629
  "kind": "js",
16623
16630
  "name": "default",
16624
16631
  "declaration": {
16625
- "name": "FlowTabGroup",
16626
- "module": "components/tab-group/tab-group.js"
16632
+ "name": "FlowTag",
16633
+ "module": "components/tag/tag.js"
16627
16634
  }
16628
16635
  },
16629
16636
  {
16630
16637
  "kind": "custom-element-definition",
16631
- "name": "flow-ui-tab-group",
16638
+ "name": "flow-ui-tag",
16632
16639
  "declaration": {
16633
- "name": "FlowTabGroup",
16634
- "module": "components/tab-group/tab-group.js"
16640
+ "name": "FlowTag",
16641
+ "module": "components/tag/tag.js"
16635
16642
  }
16636
16643
  }
16637
16644
  ]
@@ -19446,6 +19453,6 @@
19446
19453
  ],
19447
19454
  "package": {
19448
19455
  "name": "@emuanalytics/flow-rdf-ui",
19449
- "version": "0.0.6"
19456
+ "version": "0.0.7"
19450
19457
  }
19451
19458
  }