@emuanalytics/flow-rdf-ui 0.0.20 → 0.0.21

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 (5) hide show
  1. package/dist/custom-elements.json +279 -279
  2. package/dist/flow-rdf-ui.js +4 -1
  3. package/dist/flow-rdf-ui.umd.cjs +4 -1
  4. package/dist/vscode.html-custom-data.json +48 -48
  5. package/package.json +1 -1
package/dist/custom-elements.json CHANGED
@@ -674,97 +674,167 @@
674
674
  },
675
675
  {
676
676
  "kind": "javascript-module",
677
- "path": "components/badge/badge.js",
677
+ "path": "components/avatar/avatar.js",
678
678
  "declarations": [
679
679
  {
680
680
  "kind": "class",
681
681
  "description": "",
682
- "name": "FlowBadge",
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": "The badge's content.",
692
- "name": ""
709
+ "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
710
+ "name": "icon"
693
711
  }
694
712
  ],
695
713
  "members": [
696
714
  {
697
715
  "kind": "field",
698
- "name": "variant",
716
+ "name": "hasError",
699
717
  "type": {
700
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
718
+ "text": "boolean"
701
719
  },
702
- "default": "'primary'",
703
- "description": "The badge's theme variant.",
704
- "attribute": "variant",
705
- "reflects": true
720
+ "privacy": "private",
721
+ "default": "false"
706
722
  },
707
723
  {
708
724
  "kind": "field",
709
- "name": "pill",
725
+ "name": "image",
710
726
  "type": {
711
- "text": "boolean"
727
+ "text": "string"
712
728
  },
713
- "default": "false",
714
- "description": "Draws a pill-style badge with rounded edges.",
715
- "attribute": "pill",
716
- "reflects": true
729
+ "default": "''",
730
+ "description": "The image source to use for the avatar.",
731
+ "attribute": "image"
717
732
  },
718
733
  {
719
734
  "kind": "field",
720
- "name": "pulse",
735
+ "name": "label",
721
736
  "type": {
722
- "text": "boolean"
737
+ "text": "string"
723
738
  },
724
- "default": "false",
725
- "description": "Makes the badge pulsate to draw attention.",
726
- "attribute": "pulse",
739
+ "default": "''",
740
+ "description": "A label to use to describe the avatar to assistive devices.",
741
+ "attribute": "label"
742
+ },
743
+ {
744
+ "kind": "field",
745
+ "name": "initials",
746
+ "type": {
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"
752
+ },
753
+ {
754
+ "kind": "field",
755
+ "name": "loading",
756
+ "type": {
757
+ "text": "'eager' | 'lazy'"
758
+ },
759
+ "default": "'eager'",
760
+ "description": "Indicates how the browser should load the image.",
761
+ "attribute": "loading"
762
+ },
763
+ {
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",
727
772
  "reflects": true
773
+ },
774
+ {
775
+ "kind": "method",
776
+ "name": "handleImageChange"
728
777
  }
729
778
  ],
730
779
  "attributes": [
731
780
  {
732
- "name": "variant",
781
+ "name": "image",
733
782
  "type": {
734
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
783
+ "text": "string"
735
784
  },
736
- "default": "'primary'",
737
- "description": "The badge's theme variant.",
738
- "fieldName": "variant"
785
+ "default": "''",
786
+ "description": "The image source to use for the avatar.",
787
+ "fieldName": "image"
739
788
  },
740
789
  {
741
- "name": "pill",
790
+ "name": "label",
742
791
  "type": {
743
- "text": "boolean"
792
+ "text": "string"
744
793
  },
745
- "default": "false",
746
- "description": "Draws a pill-style badge with rounded edges.",
747
- "fieldName": "pill"
794
+ "default": "''",
795
+ "description": "A label to use to describe the avatar to assistive devices.",
796
+ "fieldName": "label"
748
797
  },
749
798
  {
750
- "name": "pulse",
799
+ "name": "initials",
751
800
  "type": {
752
- "text": "boolean"
801
+ "text": "string"
753
802
  },
754
- "default": "false",
755
- "description": "Makes the badge pulsate to draw attention.",
756
- "fieldName": "pulse"
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"
757
824
  }
758
825
  ],
759
826
  "superclass": {
760
827
  "name": "FlowRdfElement",
761
828
  "module": "/src/internal/flow-ui-rdf-element"
762
829
  },
763
- "summary": "Badges are used to draw attention and display statuses or counts.",
764
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/badge",
830
+ "summary": "Avatars are used to represent a person or object.",
831
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/avatar",
765
832
  "status": "stable",
766
833
  "since": "2.0",
767
- "tagName": "flow-ui-badge",
834
+ "dependencies": [
835
+ "flow-ui-icon"
836
+ ],
837
+ "tagName": "flow-ui-avatar",
768
838
  "customElement": true
769
839
  }
770
840
  ],
@@ -773,141 +843,115 @@
773
843
  "kind": "js",
774
844
  "name": "default",
775
845
  "declaration": {
776
- "name": "FlowBadge",
777
- "module": "components/badge/badge.js"
846
+ "name": "FlowAvatar",
847
+ "module": "components/avatar/avatar.js"
778
848
  }
779
849
  },
780
850
  {
781
851
  "kind": "custom-element-definition",
782
- "name": "flow-ui-badge",
852
+ "name": "flow-ui-avatar",
783
853
  "declaration": {
784
- "name": "FlowBadge",
785
- "module": "components/badge/badge.js"
854
+ "name": "FlowAvatar",
855
+ "module": "components/avatar/avatar.js"
786
856
  }
787
857
  }
788
858
  ]
789
859
  },
790
860
  {
791
861
  "kind": "javascript-module",
792
- "path": "components/breadcrumb-item/breadcrumb-item.js",
862
+ "path": "components/breadcrumb/breadcrumb.js",
793
863
  "declarations": [
794
864
  {
795
865
  "kind": "class",
796
866
  "description": "",
797
- "name": "FlowBreadcrumbItem",
867
+ "name": "FlowBreadcrumb",
798
868
  "cssParts": [
799
869
  {
800
870
  "description": "The component's base wrapper.",
801
871
  "name": "base"
802
- },
803
- {
804
- "description": "The breadcrumb item's label.",
805
- "name": "label"
806
- },
807
- {
808
- "description": "The container that wraps the prefix.",
809
- "name": "prefix"
810
- },
811
- {
812
- "description": "The container that wraps the suffix.",
813
- "name": "suffix"
814
- },
815
- {
816
- "description": "The container that wraps the separator.",
817
- "name": "separator"
818
872
  }
819
873
  ],
820
874
  "slots": [
821
875
  {
822
- "description": "The breadcrumb item's label.",
876
+ "description": "One or more breadcrumb items to display.",
823
877
  "name": ""
824
878
  },
825
879
  {
826
- "description": "An optional prefix, usually an icon or icon button.",
827
- "name": "prefix"
828
- },
829
- {
830
- "description": "An optional suffix, usually an icon or icon button.",
831
- "name": "suffix"
832
- },
833
- {
834
- "description": "The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to change it for all items in the group, set the separator on `<flow-ui-breadcrumb>` instead.",
880
+ "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
835
881
  "name": "separator"
836
882
  }
837
883
  ],
838
884
  "members": [
839
885
  {
840
886
  "kind": "field",
841
- "name": "hasSlotController",
887
+ "name": "localize",
842
888
  "privacy": "private",
843
889
  "readonly": true,
844
- "default": "new HasSlotController(this, 'prefix', 'suffix')"
890
+ "default": "new LocalizeController(this)"
845
891
  },
846
892
  {
847
893
  "kind": "field",
848
- "name": "href",
849
- "type": {
850
- "text": "string | undefined"
851
- },
852
- "description": "Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered\ninternally. When unset, a button will be rendered instead.",
853
- "attribute": "href"
894
+ "name": "separatorDir",
895
+ "privacy": "private"
854
896
  },
855
897
  {
856
898
  "kind": "field",
857
- "name": "target",
899
+ "name": "defaultSlot",
858
900
  "type": {
859
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
860
- },
861
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
862
- "attribute": "target"
901
+ "text": "HTMLSlotElement"
902
+ }
863
903
  },
864
904
  {
865
905
  "kind": "field",
866
- "name": "rel",
906
+ "name": "separatorSlot",
867
907
  "type": {
868
- "text": "string"
869
- },
870
- "default": "'noreferrer noopener'",
871
- "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
872
- "attribute": "rel"
873
- }
874
- ],
875
- "attributes": [
908
+ "text": "HTMLSlotElement"
909
+ }
910
+ },
876
911
  {
877
- "name": "href",
912
+ "kind": "field",
913
+ "name": "label",
878
914
  "type": {
879
- "text": "string | undefined"
915
+ "text": "string"
880
916
  },
881
- "description": "Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered\ninternally. When unset, a button will be rendered instead.",
882
- "fieldName": "href"
917
+ "default": "''",
918
+ "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.",
919
+ "attribute": "label"
883
920
  },
884
921
  {
885
- "name": "target",
886
- "type": {
887
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
888
- },
889
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
890
- "fieldName": "target"
922
+ "kind": "method",
923
+ "name": "getSeparator",
924
+ "privacy": "private"
891
925
  },
892
926
  {
893
- "name": "rel",
927
+ "kind": "method",
928
+ "name": "handleSlotChange",
929
+ "privacy": "private"
930
+ }
931
+ ],
932
+ "attributes": [
933
+ {
934
+ "name": "label",
894
935
  "type": {
895
936
  "text": "string"
896
937
  },
897
- "default": "'noreferrer noopener'",
898
- "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
899
- "fieldName": "rel"
938
+ "default": "''",
939
+ "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.",
940
+ "fieldName": "label"
900
941
  }
901
942
  ],
902
943
  "superclass": {
903
944
  "name": "FlowRdfElement",
904
945
  "module": "/src/internal/flow-ui-rdf-element"
905
946
  },
906
- "summary": "Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.",
907
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb-item",
947
+ "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
948
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb",
908
949
  "status": "stable",
909
950
  "since": "2.0",
910
- "tagName": "flow-ui-breadcrumb-item",
951
+ "dependencies": [
952
+ "flow-ui-icon"
953
+ ],
954
+ "tagName": "flow-ui-breadcrumb",
911
955
  "customElement": true
912
956
  }
913
957
  ],
@@ -916,183 +960,113 @@
916
960
  "kind": "js",
917
961
  "name": "default",
918
962
  "declaration": {
919
- "name": "FlowBreadcrumbItem",
920
- "module": "components/breadcrumb-item/breadcrumb-item.js"
963
+ "name": "FlowBreadcrumb",
964
+ "module": "components/breadcrumb/breadcrumb.js"
921
965
  }
922
966
  },
923
967
  {
924
968
  "kind": "custom-element-definition",
925
- "name": "flow-ui-breadcrumb-item",
969
+ "name": "flow-ui-breadcrumb",
926
970
  "declaration": {
927
- "name": "FlowBreadcrumbItem",
928
- "module": "components/breadcrumb-item/breadcrumb-item.js"
971
+ "name": "FlowBreadcrumb",
972
+ "module": "components/breadcrumb/breadcrumb.js"
929
973
  }
930
974
  }
931
975
  ]
932
976
  },
933
977
  {
934
978
  "kind": "javascript-module",
935
- "path": "components/avatar/avatar.js",
979
+ "path": "components/badge/badge.js",
936
980
  "declarations": [
937
981
  {
938
982
  "kind": "class",
939
983
  "description": "",
940
- "name": "FlowAvatar",
941
- "cssProperties": [
942
- {
943
- "description": "The size of the avatar.",
944
- "name": "--size"
945
- }
946
- ],
984
+ "name": "FlowBadge",
947
985
  "cssParts": [
948
986
  {
949
- "description": "The component's base wrapper.",
950
- "name": "base"
951
- },
952
- {
953
- "description": "The container that wraps the avatar's icon.",
954
- "name": "icon"
955
- },
956
- {
957
- "description": "The container that wraps the avatar's initials.",
958
- "name": "initials"
959
- },
960
- {
961
- "description": "The avatar image. Only shown when the `image` attribute is set.",
962
- "name": "image"
987
+ "description": "The component's base wrapper.",
988
+ "name": "base"
963
989
  }
964
990
  ],
965
991
  "slots": [
966
992
  {
967
- "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
968
- "name": "icon"
993
+ "description": "The badge's content.",
994
+ "name": ""
969
995
  }
970
996
  ],
971
997
  "members": [
972
998
  {
973
999
  "kind": "field",
974
- "name": "hasError",
975
- "type": {
976
- "text": "boolean"
977
- },
978
- "privacy": "private",
979
- "default": "false"
980
- },
981
- {
982
- "kind": "field",
983
- "name": "image",
984
- "type": {
985
- "text": "string"
986
- },
987
- "default": "''",
988
- "description": "The image source to use for the avatar.",
989
- "attribute": "image"
990
- },
991
- {
992
- "kind": "field",
993
- "name": "label",
994
- "type": {
995
- "text": "string"
996
- },
997
- "default": "''",
998
- "description": "A label to use to describe the avatar to assistive devices.",
999
- "attribute": "label"
1000
- },
1001
- {
1002
- "kind": "field",
1003
- "name": "initials",
1000
+ "name": "variant",
1004
1001
  "type": {
1005
- "text": "string"
1002
+ "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
1006
1003
  },
1007
- "default": "''",
1008
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
1009
- "attribute": "initials"
1004
+ "default": "'primary'",
1005
+ "description": "The badge's theme variant.",
1006
+ "attribute": "variant",
1007
+ "reflects": true
1010
1008
  },
1011
1009
  {
1012
1010
  "kind": "field",
1013
- "name": "loading",
1011
+ "name": "pill",
1014
1012
  "type": {
1015
- "text": "'eager' | 'lazy'"
1013
+ "text": "boolean"
1016
1014
  },
1017
- "default": "'eager'",
1018
- "description": "Indicates how the browser should load the image.",
1019
- "attribute": "loading"
1015
+ "default": "false",
1016
+ "description": "Draws a pill-style badge with rounded edges.",
1017
+ "attribute": "pill",
1018
+ "reflects": true
1020
1019
  },
1021
1020
  {
1022
1021
  "kind": "field",
1023
- "name": "shape",
1022
+ "name": "pulse",
1024
1023
  "type": {
1025
- "text": "'circle' | 'square' | 'rounded'"
1024
+ "text": "boolean"
1026
1025
  },
1027
- "default": "'circle'",
1028
- "description": "The shape of the avatar.",
1029
- "attribute": "shape",
1026
+ "default": "false",
1027
+ "description": "Makes the badge pulsate to draw attention.",
1028
+ "attribute": "pulse",
1030
1029
  "reflects": true
1031
- },
1032
- {
1033
- "kind": "method",
1034
- "name": "handleImageChange"
1035
1030
  }
1036
1031
  ],
1037
1032
  "attributes": [
1038
1033
  {
1039
- "name": "image",
1040
- "type": {
1041
- "text": "string"
1042
- },
1043
- "default": "''",
1044
- "description": "The image source to use for the avatar.",
1045
- "fieldName": "image"
1046
- },
1047
- {
1048
- "name": "label",
1049
- "type": {
1050
- "text": "string"
1051
- },
1052
- "default": "''",
1053
- "description": "A label to use to describe the avatar to assistive devices.",
1054
- "fieldName": "label"
1055
- },
1056
- {
1057
- "name": "initials",
1034
+ "name": "variant",
1058
1035
  "type": {
1059
- "text": "string"
1036
+ "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
1060
1037
  },
1061
- "default": "''",
1062
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
1063
- "fieldName": "initials"
1038
+ "default": "'primary'",
1039
+ "description": "The badge's theme variant.",
1040
+ "fieldName": "variant"
1064
1041
  },
1065
1042
  {
1066
- "name": "loading",
1043
+ "name": "pill",
1067
1044
  "type": {
1068
- "text": "'eager' | 'lazy'"
1045
+ "text": "boolean"
1069
1046
  },
1070
- "default": "'eager'",
1071
- "description": "Indicates how the browser should load the image.",
1072
- "fieldName": "loading"
1047
+ "default": "false",
1048
+ "description": "Draws a pill-style badge with rounded edges.",
1049
+ "fieldName": "pill"
1073
1050
  },
1074
1051
  {
1075
- "name": "shape",
1052
+ "name": "pulse",
1076
1053
  "type": {
1077
- "text": "'circle' | 'square' | 'rounded'"
1054
+ "text": "boolean"
1078
1055
  },
1079
- "default": "'circle'",
1080
- "description": "The shape of the avatar.",
1081
- "fieldName": "shape"
1056
+ "default": "false",
1057
+ "description": "Makes the badge pulsate to draw attention.",
1058
+ "fieldName": "pulse"
1082
1059
  }
1083
1060
  ],
1084
1061
  "superclass": {
1085
1062
  "name": "FlowRdfElement",
1086
1063
  "module": "/src/internal/flow-ui-rdf-element"
1087
1064
  },
1088
- "summary": "Avatars are used to represent a person or object.",
1089
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/avatar",
1065
+ "summary": "Badges are used to draw attention and display statuses or counts.",
1066
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/badge",
1090
1067
  "status": "stable",
1091
1068
  "since": "2.0",
1092
- "dependencies": [
1093
- "flow-ui-icon"
1094
- ],
1095
- "tagName": "flow-ui-avatar",
1069
+ "tagName": "flow-ui-badge",
1096
1070
  "customElement": true
1097
1071
  }
1098
1072
  ],
@@ -1101,115 +1075,141 @@
1101
1075
  "kind": "js",
1102
1076
  "name": "default",
1103
1077
  "declaration": {
1104
- "name": "FlowAvatar",
1105
- "module": "components/avatar/avatar.js"
1078
+ "name": "FlowBadge",
1079
+ "module": "components/badge/badge.js"
1106
1080
  }
1107
1081
  },
1108
1082
  {
1109
1083
  "kind": "custom-element-definition",
1110
- "name": "flow-ui-avatar",
1084
+ "name": "flow-ui-badge",
1111
1085
  "declaration": {
1112
- "name": "FlowAvatar",
1113
- "module": "components/avatar/avatar.js"
1086
+ "name": "FlowBadge",
1087
+ "module": "components/badge/badge.js"
1114
1088
  }
1115
1089
  }
1116
1090
  ]
1117
1091
  },
1118
1092
  {
1119
1093
  "kind": "javascript-module",
1120
- "path": "components/breadcrumb/breadcrumb.js",
1094
+ "path": "components/breadcrumb-item/breadcrumb-item.js",
1121
1095
  "declarations": [
1122
1096
  {
1123
1097
  "kind": "class",
1124
1098
  "description": "",
1125
- "name": "FlowBreadcrumb",
1099
+ "name": "FlowBreadcrumbItem",
1126
1100
  "cssParts": [
1127
1101
  {
1128
1102
  "description": "The component's base wrapper.",
1129
1103
  "name": "base"
1104
+ },
1105
+ {
1106
+ "description": "The breadcrumb item's label.",
1107
+ "name": "label"
1108
+ },
1109
+ {
1110
+ "description": "The container that wraps the prefix.",
1111
+ "name": "prefix"
1112
+ },
1113
+ {
1114
+ "description": "The container that wraps the suffix.",
1115
+ "name": "suffix"
1116
+ },
1117
+ {
1118
+ "description": "The container that wraps the separator.",
1119
+ "name": "separator"
1130
1120
  }
1131
1121
  ],
1132
1122
  "slots": [
1133
1123
  {
1134
- "description": "One or more breadcrumb items to display.",
1124
+ "description": "The breadcrumb item's label.",
1135
1125
  "name": ""
1136
1126
  },
1137
1127
  {
1138
- "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
1128
+ "description": "An optional prefix, usually an icon or icon button.",
1129
+ "name": "prefix"
1130
+ },
1131
+ {
1132
+ "description": "An optional suffix, usually an icon or icon button.",
1133
+ "name": "suffix"
1134
+ },
1135
+ {
1136
+ "description": "The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to change it for all items in the group, set the separator on `<flow-ui-breadcrumb>` instead.",
1139
1137
  "name": "separator"
1140
1138
  }
1141
1139
  ],
1142
1140
  "members": [
1143
1141
  {
1144
1142
  "kind": "field",
1145
- "name": "localize",
1143
+ "name": "hasSlotController",
1146
1144
  "privacy": "private",
1147
1145
  "readonly": true,
1148
- "default": "new LocalizeController(this)"
1149
- },
1150
- {
1151
- "kind": "field",
1152
- "name": "separatorDir",
1153
- "privacy": "private"
1146
+ "default": "new HasSlotController(this, 'prefix', 'suffix')"
1154
1147
  },
1155
1148
  {
1156
1149
  "kind": "field",
1157
- "name": "defaultSlot",
1150
+ "name": "href",
1158
1151
  "type": {
1159
- "text": "HTMLSlotElement"
1160
- }
1152
+ "text": "string | undefined"
1153
+ },
1154
+ "description": "Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered\ninternally. When unset, a button will be rendered instead.",
1155
+ "attribute": "href"
1161
1156
  },
1162
1157
  {
1163
1158
  "kind": "field",
1164
- "name": "separatorSlot",
1159
+ "name": "target",
1165
1160
  "type": {
1166
- "text": "HTMLSlotElement"
1167
- }
1161
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
1162
+ },
1163
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
1164
+ "attribute": "target"
1168
1165
  },
1169
1166
  {
1170
1167
  "kind": "field",
1171
- "name": "label",
1168
+ "name": "rel",
1172
1169
  "type": {
1173
1170
  "text": "string"
1174
1171
  },
1175
- "default": "''",
1176
- "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.",
1177
- "attribute": "label"
1178
- },
1179
- {
1180
- "kind": "method",
1181
- "name": "getSeparator",
1182
- "privacy": "private"
1183
- },
1184
- {
1185
- "kind": "method",
1186
- "name": "handleSlotChange",
1187
- "privacy": "private"
1172
+ "default": "'noreferrer noopener'",
1173
+ "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
1174
+ "attribute": "rel"
1188
1175
  }
1189
1176
  ],
1190
1177
  "attributes": [
1191
1178
  {
1192
- "name": "label",
1179
+ "name": "href",
1180
+ "type": {
1181
+ "text": "string | undefined"
1182
+ },
1183
+ "description": "Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered\ninternally. When unset, a button will be rendered instead.",
1184
+ "fieldName": "href"
1185
+ },
1186
+ {
1187
+ "name": "target",
1188
+ "type": {
1189
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
1190
+ },
1191
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
1192
+ "fieldName": "target"
1193
+ },
1194
+ {
1195
+ "name": "rel",
1193
1196
  "type": {
1194
1197
  "text": "string"
1195
1198
  },
1196
- "default": "''",
1197
- "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.",
1198
- "fieldName": "label"
1199
+ "default": "'noreferrer noopener'",
1200
+ "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
1201
+ "fieldName": "rel"
1199
1202
  }
1200
1203
  ],
1201
1204
  "superclass": {
1202
1205
  "name": "FlowRdfElement",
1203
1206
  "module": "/src/internal/flow-ui-rdf-element"
1204
1207
  },
1205
- "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
1206
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb",
1208
+ "summary": "Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.",
1209
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb-item",
1207
1210
  "status": "stable",
1208
1211
  "since": "2.0",
1209
- "dependencies": [
1210
- "flow-ui-icon"
1211
- ],
1212
- "tagName": "flow-ui-breadcrumb",
1212
+ "tagName": "flow-ui-breadcrumb-item",
1213
1213
  "customElement": true
1214
1214
  }
1215
1215
  ],
@@ -1218,16 +1218,16 @@
1218
1218
  "kind": "js",
1219
1219
  "name": "default",
1220
1220
  "declaration": {
1221
- "name": "FlowBreadcrumb",
1222
- "module": "components/breadcrumb/breadcrumb.js"
1221
+ "name": "FlowBreadcrumbItem",
1222
+ "module": "components/breadcrumb-item/breadcrumb-item.js"
1223
1223
  }
1224
1224
  },
1225
1225
  {
1226
1226
  "kind": "custom-element-definition",
1227
- "name": "flow-ui-breadcrumb",
1227
+ "name": "flow-ui-breadcrumb-item",
1228
1228
  "declaration": {
1229
- "name": "FlowBreadcrumb",
1230
- "module": "components/breadcrumb/breadcrumb.js"
1229
+ "name": "FlowBreadcrumbItem",
1230
+ "module": "components/breadcrumb-item/breadcrumb-item.js"
1231
1231
  }
1232
1232
  }
1233
1233
  ]
@@ -20287,6 +20287,6 @@
20287
20287
  ],
20288
20288
  "package": {
20289
20289
  "name": "@emuanalytics/flow-rdf-ui",
20290
- "version": "0.0.20"
20290
+ "version": "0.0.21"
20291
20291
  }
20292
20292
  }
package/dist/flow-rdf-ui.js CHANGED
@@ -31352,6 +31352,9 @@ class FlowToolButtonGroup extends FlowRdfElement {
31352
31352
  }
31353
31353
  handleButtonClick(event) {
31354
31354
  const target = event.target.closest("flow-ui-tool-button");
31355
+ if (!target) {
31356
+ return;
31357
+ }
31355
31358
  const toolButtons = this.getAllToolButtons();
31356
31359
  const oldValue = this.value;
31357
31360
  if (target.disabled) {
@@ -32024,7 +32027,7 @@ const translation = {
32024
32027
  toggleColorFormat: "Toggle color format"
32025
32028
  };
32026
32029
  registerTranslation(translation);
32027
- const version = "0.0.20";
32030
+ const version = "0.0.21";
32028
32031
  const CONSOLE_HIGHLIGHT_STYLE = `
32029
32032
  padding: 2px 4px;
32030
32033
  border-radius: 2px;
package/dist/flow-rdf-ui.umd.cjs CHANGED
@@ -31354,6 +31354,9 @@ body > .os-scrollbar {
31354
31354
  }
31355
31355
  handleButtonClick(event) {
31356
31356
  const target = event.target.closest("flow-ui-tool-button");
31357
+ if (!target) {
31358
+ return;
31359
+ }
31357
31360
  const toolButtons = this.getAllToolButtons();
31358
31361
  const oldValue = this.value;
31359
31362
  if (target.disabled) {
@@ -32026,7 +32029,7 @@ body > .os-scrollbar {
32026
32029
  toggleColorFormat: "Toggle color format"
32027
32030
  };
32028
32031
  registerTranslation(translation);
32029
- const version = "0.0.20";
32032
+ const version = "0.0.21";
32030
32033
  const CONSOLE_HIGHLIGHT_STYLE = `
32031
32034
  padding: 2px 4px;
32032
32035
  border-radius: 2px;
package/dist/vscode.html-custom-data.json CHANGED
@@ -96,6 +96,54 @@
96
96
  ],
97
97
  "references": []
98
98
  },
99
+ {
100
+ "name": "flow-ui-avatar",
101
+ "description": "Avatars are used to represent a person or object.\n\n\n---\n\n\n\n\n### **Slots:**\n - **icon** - The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.\n\n### **CSS Properties:**\n - **--size** - The size of the avatar. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon** - The container that wraps the avatar's icon.\n- **initials** - The container that wraps the avatar's initials.\n- **image** - The avatar image. Only shown when the `image` attribute is set.",
102
+ "attributes": [
103
+ {
104
+ "name": "image",
105
+ "description": "The image source to use for the avatar.",
106
+ "values": []
107
+ },
108
+ {
109
+ "name": "label",
110
+ "description": "A label to use to describe the avatar to assistive devices.",
111
+ "values": []
112
+ },
113
+ {
114
+ "name": "initials",
115
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
116
+ "values": []
117
+ },
118
+ {
119
+ "name": "loading",
120
+ "description": "Indicates how the browser should load the image.",
121
+ "values": [{ "name": "eager" }, { "name": "lazy" }]
122
+ },
123
+ {
124
+ "name": "shape",
125
+ "description": "The shape of the avatar.",
126
+ "values": [
127
+ { "name": "circle" },
128
+ { "name": "square" },
129
+ { "name": "rounded" }
130
+ ]
131
+ }
132
+ ],
133
+ "references": []
134
+ },
135
+ {
136
+ "name": "flow-ui-breadcrumb",
137
+ "description": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - One or more breadcrumb items to display.\n- **separator** - The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
138
+ "attributes": [
139
+ {
140
+ "name": "label",
141
+ "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.",
142
+ "values": []
143
+ }
144
+ ],
145
+ "references": []
146
+ },
99
147
  {
100
148
  "name": "flow-ui-badge",
101
149
  "description": "Badges are used to draw attention and display statuses or counts.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - The badge's content.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
@@ -151,54 +199,6 @@
151
199
  ],
152
200
  "references": []
153
201
  },
154
- {
155
- "name": "flow-ui-avatar",
156
- "description": "Avatars are used to represent a person or object.\n\n\n---\n\n\n\n\n### **Slots:**\n - **icon** - The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.\n\n### **CSS Properties:**\n - **--size** - The size of the avatar. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon** - The container that wraps the avatar's icon.\n- **initials** - The container that wraps the avatar's initials.\n- **image** - The avatar image. Only shown when the `image` attribute is set.",
157
- "attributes": [
158
- {
159
- "name": "image",
160
- "description": "The image source to use for the avatar.",
161
- "values": []
162
- },
163
- {
164
- "name": "label",
165
- "description": "A label to use to describe the avatar to assistive devices.",
166
- "values": []
167
- },
168
- {
169
- "name": "initials",
170
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
171
- "values": []
172
- },
173
- {
174
- "name": "loading",
175
- "description": "Indicates how the browser should load the image.",
176
- "values": [{ "name": "eager" }, { "name": "lazy" }]
177
- },
178
- {
179
- "name": "shape",
180
- "description": "The shape of the avatar.",
181
- "values": [
182
- { "name": "circle" },
183
- { "name": "square" },
184
- { "name": "rounded" }
185
- ]
186
- }
187
- ],
188
- "references": []
189
- },
190
- {
191
- "name": "flow-ui-breadcrumb",
192
- "description": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - One or more breadcrumb items to display.\n- **separator** - The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
193
- "attributes": [
194
- {
195
- "name": "label",
196
- "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.",
197
- "values": []
198
- }
199
- ],
200
- "references": []
201
- },
202
202
  {
203
203
  "name": "flow-ui-button",
204
204
  "description": "Buttons represent actions that are available to the user.\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-blur** - Emitted when the button loses focus.\n- **flow-ui-focus** - Emitted when the button gains focus.\n- **flow-ui-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **click()** - Simulates a click on the button.\n- **focus(options: _FocusOptions_)** - Sets focus on the button.\n- **blur()** - Removes focus from the button.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The button's label.\n- **prefix** - A presentational prefix icon or similar element.\n- **suffix** - A presentational suffix icon or similar element.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **prefix** - The container that wraps the prefix.\n- **label** - The button's label.\n- **suffix** - The container that wraps the suffix.\n- **caret** - The button's caret icon, an `<flow-ui-icon>` element.",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@emuanalytics/flow-rdf-ui",
3
- "version": "0.0.20",
3
+ "version": "0.0.21",
4
4
  "type": "module",
5
5
  "main": "dist/flow-rdf-ui.umd.cjs",
6
6
  "module": "dist/flow-rdf-ui.js",