@emuanalytics/flow-rdf-ui 0.0.18-alpha.19 → 0.0.18-alpha.20

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 +1131 -1131
  2. package/dist/flow-rdf-ui.js +9 -1
  3. package/dist/flow-rdf-ui.umd.cjs +9 -1
  4. package/dist/vscode.html-custom-data.json +109 -109
  5. package/package.json +1 -1
package/dist/custom-elements.json CHANGED
@@ -255,191 +255,6 @@
255
255
  }
256
256
  ]
257
257
  },
258
- {
259
- "kind": "javascript-module",
260
- "path": "components/avatar/avatar.js",
261
- "declarations": [
262
- {
263
- "kind": "class",
264
- "description": "",
265
- "name": "FlowAvatar",
266
- "cssProperties": [
267
- {
268
- "description": "The size of the avatar.",
269
- "name": "--size"
270
- }
271
- ],
272
- "cssParts": [
273
- {
274
- "description": "The component's base wrapper.",
275
- "name": "base"
276
- },
277
- {
278
- "description": "The container that wraps the avatar's icon.",
279
- "name": "icon"
280
- },
281
- {
282
- "description": "The container that wraps the avatar's initials.",
283
- "name": "initials"
284
- },
285
- {
286
- "description": "The avatar image. Only shown when the `image` attribute is set.",
287
- "name": "image"
288
- }
289
- ],
290
- "slots": [
291
- {
292
- "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
293
- "name": "icon"
294
- }
295
- ],
296
- "members": [
297
- {
298
- "kind": "field",
299
- "name": "hasError",
300
- "type": {
301
- "text": "boolean"
302
- },
303
- "privacy": "private",
304
- "default": "false"
305
- },
306
- {
307
- "kind": "field",
308
- "name": "image",
309
- "type": {
310
- "text": "string"
311
- },
312
- "default": "''",
313
- "description": "The image source to use for the avatar.",
314
- "attribute": "image"
315
- },
316
- {
317
- "kind": "field",
318
- "name": "label",
319
- "type": {
320
- "text": "string"
321
- },
322
- "default": "''",
323
- "description": "A label to use to describe the avatar to assistive devices.",
324
- "attribute": "label"
325
- },
326
- {
327
- "kind": "field",
328
- "name": "initials",
329
- "type": {
330
- "text": "string"
331
- },
332
- "default": "''",
333
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
334
- "attribute": "initials"
335
- },
336
- {
337
- "kind": "field",
338
- "name": "loading",
339
- "type": {
340
- "text": "'eager' | 'lazy'"
341
- },
342
- "default": "'eager'",
343
- "description": "Indicates how the browser should load the image.",
344
- "attribute": "loading"
345
- },
346
- {
347
- "kind": "field",
348
- "name": "shape",
349
- "type": {
350
- "text": "'circle' | 'square' | 'rounded'"
351
- },
352
- "default": "'circle'",
353
- "description": "The shape of the avatar.",
354
- "attribute": "shape",
355
- "reflects": true
356
- },
357
- {
358
- "kind": "method",
359
- "name": "handleImageChange"
360
- }
361
- ],
362
- "attributes": [
363
- {
364
- "name": "image",
365
- "type": {
366
- "text": "string"
367
- },
368
- "default": "''",
369
- "description": "The image source to use for the avatar.",
370
- "fieldName": "image"
371
- },
372
- {
373
- "name": "label",
374
- "type": {
375
- "text": "string"
376
- },
377
- "default": "''",
378
- "description": "A label to use to describe the avatar to assistive devices.",
379
- "fieldName": "label"
380
- },
381
- {
382
- "name": "initials",
383
- "type": {
384
- "text": "string"
385
- },
386
- "default": "''",
387
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
388
- "fieldName": "initials"
389
- },
390
- {
391
- "name": "loading",
392
- "type": {
393
- "text": "'eager' | 'lazy'"
394
- },
395
- "default": "'eager'",
396
- "description": "Indicates how the browser should load the image.",
397
- "fieldName": "loading"
398
- },
399
- {
400
- "name": "shape",
401
- "type": {
402
- "text": "'circle' | 'square' | 'rounded'"
403
- },
404
- "default": "'circle'",
405
- "description": "The shape of the avatar.",
406
- "fieldName": "shape"
407
- }
408
- ],
409
- "superclass": {
410
- "name": "FlowRdfElement",
411
- "module": "/src/internal/flow-ui-rdf-element"
412
- },
413
- "summary": "Avatars are used to represent a person or object.",
414
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/avatar",
415
- "status": "stable",
416
- "since": "2.0",
417
- "dependencies": [
418
- "flow-ui-icon"
419
- ],
420
- "tagName": "flow-ui-avatar",
421
- "customElement": true
422
- }
423
- ],
424
- "exports": [
425
- {
426
- "kind": "js",
427
- "name": "default",
428
- "declaration": {
429
- "name": "FlowAvatar",
430
- "module": "components/avatar/avatar.js"
431
- }
432
- },
433
- {
434
- "kind": "custom-element-definition",
435
- "name": "flow-ui-avatar",
436
- "declaration": {
437
- "name": "FlowAvatar",
438
- "module": "components/avatar/avatar.js"
439
- }
440
- }
441
- ]
442
- },
443
258
  {
444
259
  "kind": "javascript-module",
445
260
  "path": "components/animation/animation.js",
@@ -859,99 +674,125 @@
859
674
  },
860
675
  {
861
676
  "kind": "javascript-module",
862
- "path": "components/breadcrumb/breadcrumb.js",
677
+ "path": "components/breadcrumb-item/breadcrumb-item.js",
863
678
  "declarations": [
864
679
  {
865
680
  "kind": "class",
866
681
  "description": "",
867
- "name": "FlowBreadcrumb",
682
+ "name": "FlowBreadcrumbItem",
868
683
  "cssParts": [
869
684
  {
870
685
  "description": "The component's base wrapper.",
871
686
  "name": "base"
687
+ },
688
+ {
689
+ "description": "The breadcrumb item's label.",
690
+ "name": "label"
691
+ },
692
+ {
693
+ "description": "The container that wraps the prefix.",
694
+ "name": "prefix"
695
+ },
696
+ {
697
+ "description": "The container that wraps the suffix.",
698
+ "name": "suffix"
699
+ },
700
+ {
701
+ "description": "The container that wraps the separator.",
702
+ "name": "separator"
872
703
  }
873
704
  ],
874
705
  "slots": [
875
706
  {
876
- "description": "One or more breadcrumb items to display.",
707
+ "description": "The breadcrumb item's label.",
877
708
  "name": ""
878
709
  },
879
710
  {
880
- "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
711
+ "description": "An optional prefix, usually an icon or icon button.",
712
+ "name": "prefix"
713
+ },
714
+ {
715
+ "description": "An optional suffix, usually an icon or icon button.",
716
+ "name": "suffix"
717
+ },
718
+ {
719
+ "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.",
881
720
  "name": "separator"
882
721
  }
883
722
  ],
884
723
  "members": [
885
724
  {
886
725
  "kind": "field",
887
- "name": "localize",
726
+ "name": "hasSlotController",
888
727
  "privacy": "private",
889
728
  "readonly": true,
890
- "default": "new LocalizeController(this)"
891
- },
892
- {
893
- "kind": "field",
894
- "name": "separatorDir",
895
- "privacy": "private"
729
+ "default": "new HasSlotController(this, 'prefix', 'suffix')"
896
730
  },
897
731
  {
898
732
  "kind": "field",
899
- "name": "defaultSlot",
733
+ "name": "href",
900
734
  "type": {
901
- "text": "HTMLSlotElement"
902
- }
735
+ "text": "string | undefined"
736
+ },
737
+ "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.",
738
+ "attribute": "href"
903
739
  },
904
740
  {
905
741
  "kind": "field",
906
- "name": "separatorSlot",
742
+ "name": "target",
907
743
  "type": {
908
- "text": "HTMLSlotElement"
909
- }
744
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
745
+ },
746
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
747
+ "attribute": "target"
910
748
  },
911
749
  {
912
750
  "kind": "field",
913
- "name": "label",
751
+ "name": "rel",
914
752
  "type": {
915
753
  "text": "string"
916
754
  },
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"
920
- },
755
+ "default": "'noreferrer noopener'",
756
+ "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
757
+ "attribute": "rel"
758
+ }
759
+ ],
760
+ "attributes": [
921
761
  {
922
- "kind": "method",
923
- "name": "getSeparator",
924
- "privacy": "private"
762
+ "name": "href",
763
+ "type": {
764
+ "text": "string | undefined"
765
+ },
766
+ "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.",
767
+ "fieldName": "href"
925
768
  },
926
769
  {
927
- "kind": "method",
928
- "name": "handleSlotChange",
929
- "privacy": "private"
930
- }
931
- ],
932
- "attributes": [
770
+ "name": "target",
771
+ "type": {
772
+ "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
773
+ },
774
+ "description": "Tells the browser where to open the link. Only used when `href` is set.",
775
+ "fieldName": "target"
776
+ },
933
777
  {
934
- "name": "label",
778
+ "name": "rel",
935
779
  "type": {
936
780
  "text": "string"
937
781
  },
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"
782
+ "default": "'noreferrer noopener'",
783
+ "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
784
+ "fieldName": "rel"
941
785
  }
942
786
  ],
943
787
  "superclass": {
944
788
  "name": "FlowRdfElement",
945
789
  "module": "/src/internal/flow-ui-rdf-element"
946
790
  },
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",
791
+ "summary": "Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.",
792
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb-item",
949
793
  "status": "stable",
950
794
  "since": "2.0",
951
- "dependencies": [
952
- "flow-ui-icon"
953
- ],
954
- "tagName": "flow-ui-breadcrumb",
795
+ "tagName": "flow-ui-breadcrumb-item",
955
796
  "customElement": true
956
797
  }
957
798
  ],
@@ -960,141 +801,115 @@
960
801
  "kind": "js",
961
802
  "name": "default",
962
803
  "declaration": {
963
- "name": "FlowBreadcrumb",
964
- "module": "components/breadcrumb/breadcrumb.js"
804
+ "name": "FlowBreadcrumbItem",
805
+ "module": "components/breadcrumb-item/breadcrumb-item.js"
965
806
  }
966
807
  },
967
808
  {
968
809
  "kind": "custom-element-definition",
969
- "name": "flow-ui-breadcrumb",
810
+ "name": "flow-ui-breadcrumb-item",
970
811
  "declaration": {
971
- "name": "FlowBreadcrumb",
972
- "module": "components/breadcrumb/breadcrumb.js"
812
+ "name": "FlowBreadcrumbItem",
813
+ "module": "components/breadcrumb-item/breadcrumb-item.js"
973
814
  }
974
815
  }
975
816
  ]
976
817
  },
977
818
  {
978
819
  "kind": "javascript-module",
979
- "path": "components/breadcrumb-item/breadcrumb-item.js",
820
+ "path": "components/breadcrumb/breadcrumb.js",
980
821
  "declarations": [
981
822
  {
982
823
  "kind": "class",
983
824
  "description": "",
984
- "name": "FlowBreadcrumbItem",
825
+ "name": "FlowBreadcrumb",
985
826
  "cssParts": [
986
827
  {
987
828
  "description": "The component's base wrapper.",
988
829
  "name": "base"
989
- },
990
- {
991
- "description": "The breadcrumb item's label.",
992
- "name": "label"
993
- },
994
- {
995
- "description": "The container that wraps the prefix.",
996
- "name": "prefix"
997
- },
998
- {
999
- "description": "The container that wraps the suffix.",
1000
- "name": "suffix"
1001
- },
1002
- {
1003
- "description": "The container that wraps the separator.",
1004
- "name": "separator"
1005
830
  }
1006
831
  ],
1007
832
  "slots": [
1008
833
  {
1009
- "description": "The breadcrumb item's label.",
834
+ "description": "One or more breadcrumb items to display.",
1010
835
  "name": ""
1011
836
  },
1012
837
  {
1013
- "description": "An optional prefix, usually an icon or icon button.",
1014
- "name": "prefix"
1015
- },
1016
- {
1017
- "description": "An optional suffix, usually an icon or icon button.",
1018
- "name": "suffix"
1019
- },
1020
- {
1021
- "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.",
838
+ "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
1022
839
  "name": "separator"
1023
840
  }
1024
841
  ],
1025
842
  "members": [
1026
843
  {
1027
844
  "kind": "field",
1028
- "name": "hasSlotController",
845
+ "name": "localize",
1029
846
  "privacy": "private",
1030
847
  "readonly": true,
1031
- "default": "new HasSlotController(this, 'prefix', 'suffix')"
848
+ "default": "new LocalizeController(this)"
1032
849
  },
1033
850
  {
1034
851
  "kind": "field",
1035
- "name": "href",
1036
- "type": {
1037
- "text": "string | undefined"
1038
- },
1039
- "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.",
1040
- "attribute": "href"
852
+ "name": "separatorDir",
853
+ "privacy": "private"
1041
854
  },
1042
855
  {
1043
856
  "kind": "field",
1044
- "name": "target",
857
+ "name": "defaultSlot",
1045
858
  "type": {
1046
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
1047
- },
1048
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
1049
- "attribute": "target"
859
+ "text": "HTMLSlotElement"
860
+ }
1050
861
  },
1051
862
  {
1052
863
  "kind": "field",
1053
- "name": "rel",
864
+ "name": "separatorSlot",
1054
865
  "type": {
1055
- "text": "string"
1056
- },
1057
- "default": "'noreferrer noopener'",
1058
- "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
1059
- "attribute": "rel"
1060
- }
1061
- ],
1062
- "attributes": [
866
+ "text": "HTMLSlotElement"
867
+ }
868
+ },
1063
869
  {
1064
- "name": "href",
870
+ "kind": "field",
871
+ "name": "label",
1065
872
  "type": {
1066
- "text": "string | undefined"
873
+ "text": "string"
1067
874
  },
1068
- "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.",
1069
- "fieldName": "href"
875
+ "default": "''",
876
+ "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.",
877
+ "attribute": "label"
1070
878
  },
1071
879
  {
1072
- "name": "target",
1073
- "type": {
1074
- "text": "'_blank' | '_parent' | '_self' | '_top' | undefined"
1075
- },
1076
- "description": "Tells the browser where to open the link. Only used when `href` is set.",
1077
- "fieldName": "target"
880
+ "kind": "method",
881
+ "name": "getSeparator",
882
+ "privacy": "private"
1078
883
  },
1079
884
  {
1080
- "name": "rel",
885
+ "kind": "method",
886
+ "name": "handleSlotChange",
887
+ "privacy": "private"
888
+ }
889
+ ],
890
+ "attributes": [
891
+ {
892
+ "name": "label",
1081
893
  "type": {
1082
894
  "text": "string"
1083
895
  },
1084
- "default": "'noreferrer noopener'",
1085
- "description": "The `rel` attribute to use on the link. Only used when `href` is set.",
1086
- "fieldName": "rel"
896
+ "default": "''",
897
+ "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.",
898
+ "fieldName": "label"
1087
899
  }
1088
900
  ],
1089
901
  "superclass": {
1090
902
  "name": "FlowRdfElement",
1091
903
  "module": "/src/internal/flow-ui-rdf-element"
1092
904
  },
1093
- "summary": "Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.",
1094
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb-item",
905
+ "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
906
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb",
1095
907
  "status": "stable",
1096
908
  "since": "2.0",
1097
- "tagName": "flow-ui-breadcrumb-item",
909
+ "dependencies": [
910
+ "flow-ui-icon"
911
+ ],
912
+ "tagName": "flow-ui-breadcrumb",
1098
913
  "customElement": true
1099
914
  }
1100
915
  ],
@@ -1103,16 +918,16 @@
1103
918
  "kind": "js",
1104
919
  "name": "default",
1105
920
  "declaration": {
1106
- "name": "FlowBreadcrumbItem",
1107
- "module": "components/breadcrumb-item/breadcrumb-item.js"
921
+ "name": "FlowBreadcrumb",
922
+ "module": "components/breadcrumb/breadcrumb.js"
1108
923
  }
1109
924
  },
1110
925
  {
1111
926
  "kind": "custom-element-definition",
1112
- "name": "flow-ui-breadcrumb-item",
927
+ "name": "flow-ui-breadcrumb",
1113
928
  "declaration": {
1114
- "name": "FlowBreadcrumbItem",
1115
- "module": "components/breadcrumb-item/breadcrumb-item.js"
929
+ "name": "FlowBreadcrumb",
930
+ "module": "components/breadcrumb/breadcrumb.js"
1116
931
  }
1117
932
  }
1118
933
  ]
@@ -1796,12 +1611,12 @@
1796
1611
  },
1797
1612
  {
1798
1613
  "kind": "javascript-module",
1799
- "path": "components/badge/badge.js",
1614
+ "path": "components/button-group/button-group.js",
1800
1615
  "declarations": [
1801
1616
  {
1802
1617
  "kind": "class",
1803
1618
  "description": "",
1804
- "name": "FlowBadge",
1619
+ "name": "FlowButtonGroup",
1805
1620
  "cssParts": [
1806
1621
  {
1807
1622
  "description": "The component's base wrapper.",
@@ -1810,160 +1625,45 @@
1810
1625
  ],
1811
1626
  "slots": [
1812
1627
  {
1813
- "description": "The badge's content.",
1628
+ "description": "One or more `<flow-ui-button>` elements to display in the button group.",
1814
1629
  "name": ""
1815
1630
  }
1816
1631
  ],
1817
1632
  "members": [
1818
1633
  {
1819
1634
  "kind": "field",
1820
- "name": "variant",
1635
+ "name": "defaultSlot",
1821
1636
  "type": {
1822
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
1823
- },
1824
- "default": "'primary'",
1825
- "description": "The badge's theme variant.",
1826
- "attribute": "variant",
1827
- "reflects": true
1637
+ "text": "HTMLSlotElement"
1638
+ }
1828
1639
  },
1829
1640
  {
1830
1641
  "kind": "field",
1831
- "name": "pill",
1642
+ "name": "disableRole",
1832
1643
  "type": {
1833
1644
  "text": "boolean"
1834
1645
  },
1835
- "default": "false",
1836
- "description": "Draws a pill-style badge with rounded edges.",
1837
- "attribute": "pill",
1838
- "reflects": true
1646
+ "default": "false"
1839
1647
  },
1840
1648
  {
1841
1649
  "kind": "field",
1842
- "name": "pulse",
1843
- "type": {
1844
- "text": "boolean"
1845
- },
1846
- "default": "false",
1847
- "description": "Makes the badge pulsate to draw attention.",
1848
- "attribute": "pulse",
1849
- "reflects": true
1850
- }
1851
- ],
1852
- "attributes": [
1853
- {
1854
- "name": "variant",
1650
+ "name": "label",
1855
1651
  "type": {
1856
- "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
1652
+ "text": "string"
1857
1653
  },
1858
- "default": "'primary'",
1859
- "description": "The badge's theme variant.",
1860
- "fieldName": "variant"
1654
+ "default": "''",
1655
+ "attribute": "label"
1861
1656
  },
1862
1657
  {
1863
- "name": "pill",
1658
+ "kind": "field",
1659
+ "name": "vertical",
1864
1660
  "type": {
1865
1661
  "text": "boolean"
1866
1662
  },
1867
1663
  "default": "false",
1868
- "description": "Draws a pill-style badge with rounded edges.",
1869
- "fieldName": "pill"
1870
- },
1871
- {
1872
- "name": "pulse",
1873
- "type": {
1874
- "text": "boolean"
1875
- },
1876
- "default": "false",
1877
- "description": "Makes the badge pulsate to draw attention.",
1878
- "fieldName": "pulse"
1879
- }
1880
- ],
1881
- "superclass": {
1882
- "name": "FlowRdfElement",
1883
- "module": "/src/internal/flow-ui-rdf-element"
1884
- },
1885
- "summary": "Badges are used to draw attention and display statuses or counts.",
1886
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/badge",
1887
- "status": "stable",
1888
- "since": "2.0",
1889
- "tagName": "flow-ui-badge",
1890
- "customElement": true
1891
- }
1892
- ],
1893
- "exports": [
1894
- {
1895
- "kind": "js",
1896
- "name": "default",
1897
- "declaration": {
1898
- "name": "FlowBadge",
1899
- "module": "components/badge/badge.js"
1900
- }
1901
- },
1902
- {
1903
- "kind": "custom-element-definition",
1904
- "name": "flow-ui-badge",
1905
- "declaration": {
1906
- "name": "FlowBadge",
1907
- "module": "components/badge/badge.js"
1908
- }
1909
- }
1910
- ]
1911
- },
1912
- {
1913
- "kind": "javascript-module",
1914
- "path": "components/button-group/button-group.js",
1915
- "declarations": [
1916
- {
1917
- "kind": "class",
1918
- "description": "",
1919
- "name": "FlowButtonGroup",
1920
- "cssParts": [
1921
- {
1922
- "description": "The component's base wrapper.",
1923
- "name": "base"
1924
- }
1925
- ],
1926
- "slots": [
1927
- {
1928
- "description": "One or more `<flow-ui-button>` elements to display in the button group.",
1929
- "name": ""
1930
- }
1931
- ],
1932
- "members": [
1933
- {
1934
- "kind": "field",
1935
- "name": "defaultSlot",
1936
- "type": {
1937
- "text": "HTMLSlotElement"
1938
- }
1939
- },
1940
- {
1941
- "kind": "field",
1942
- "name": "disableRole",
1943
- "type": {
1944
- "text": "boolean"
1945
- },
1946
- "default": "false"
1947
- },
1948
- {
1949
- "kind": "field",
1950
- "name": "label",
1951
- "type": {
1952
- "text": "string"
1953
- },
1954
- "default": "''",
1955
- "attribute": "label"
1956
- },
1957
- {
1958
- "kind": "field",
1959
- "name": "vertical",
1960
- "type": {
1961
- "text": "boolean"
1962
- },
1963
- "default": "false",
1964
- "description": "Use vertical layout for the button group.",
1965
- "attribute": "vertical",
1966
- "reflects": true
1664
+ "description": "Use vertical layout for the button group.",
1665
+ "attribute": "vertical",
1666
+ "reflects": true
1967
1667
  },
1968
1668
  {
1969
1669
  "kind": "method",
@@ -2079,104 +1779,98 @@
2079
1779
  },
2080
1780
  {
2081
1781
  "kind": "javascript-module",
2082
- "path": "components/calendar/calendar.component.js",
1782
+ "path": "components/badge/badge.js",
2083
1783
  "declarations": [
2084
1784
  {
2085
1785
  "kind": "class",
2086
1786
  "description": "",
2087
- "name": "FlowCalendar",
2088
- "members": [
1787
+ "name": "FlowBadge",
1788
+ "cssParts": [
2089
1789
  {
2090
- "kind": "field",
2091
- "name": "hasSlotController",
2092
- "privacy": "private",
2093
- "readonly": true,
2094
- "default": "new HasSlotController(this, 'info')"
2095
- },
1790
+ "description": "The component's base wrapper.",
1791
+ "name": "base"
1792
+ }
1793
+ ],
1794
+ "slots": [
2096
1795
  {
2097
- "kind": "field",
2098
- "name": "_displayDate",
2099
- "privacy": "private"
2100
- },
1796
+ "description": "The badge's content.",
1797
+ "name": ""
1798
+ }
1799
+ ],
1800
+ "members": [
2101
1801
  {
2102
1802
  "kind": "field",
2103
- "name": "_selectedDate",
2104
- "privacy": "private"
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
2105
1811
  },
2106
1812
  {
2107
1813
  "kind": "field",
2108
- "name": "value",
1814
+ "name": "pill",
2109
1815
  "type": {
2110
- "text": "string"
1816
+ "text": "boolean"
2111
1817
  },
2112
- "attribute": "value",
1818
+ "default": "false",
1819
+ "description": "Draws a pill-style badge with rounded edges.",
1820
+ "attribute": "pill",
2113
1821
  "reflects": true
2114
1822
  },
2115
1823
  {
2116
- "kind": "method",
2117
- "name": "handleValueChange"
2118
- },
2119
- {
2120
- "kind": "method",
2121
- "name": "dateClicked",
2122
- "privacy": "private",
2123
- "parameters": [
2124
- {
2125
- "name": "date",
2126
- "type": {
2127
- "text": "string"
2128
- }
2129
- }
2130
- ]
2131
- },
2132
- {
2133
- "kind": "method",
2134
- "name": "changeDisplayDate",
2135
- "privacy": "private",
2136
- "parameters": [
2137
- {
2138
- "name": "value",
2139
- "type": {
2140
- "text": "number"
2141
- }
2142
- },
2143
- {
2144
- "name": "unit",
2145
- "type": {
2146
- "text": "dayjs.OpUnitType"
2147
- }
2148
- }
2149
- ]
2150
- },
1824
+ "kind": "field",
1825
+ "name": "pulse",
1826
+ "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": [
2151
1836
  {
2152
- "kind": "method",
2153
- "name": "calendarHeaderTemplate",
2154
- "privacy": "private"
1837
+ "name": "variant",
1838
+ "type": {
1839
+ "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
1840
+ },
1841
+ "default": "'primary'",
1842
+ "description": "The badge's theme variant.",
1843
+ "fieldName": "variant"
2155
1844
  },
2156
1845
  {
2157
- "kind": "method",
2158
- "name": "dayOfWeekGridTemplate",
2159
- "privacy": "private"
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"
2160
1853
  },
2161
1854
  {
2162
- "kind": "method",
2163
- "name": "dayGridTemplate",
2164
- "privacy": "private"
2165
- }
2166
- ],
2167
- "attributes": [
2168
- {
2169
- "name": "value",
1855
+ "name": "pulse",
2170
1856
  "type": {
2171
- "text": "string"
1857
+ "text": "boolean"
2172
1858
  },
2173
- "fieldName": "value"
1859
+ "default": "false",
1860
+ "description": "Makes the badge pulsate to draw attention.",
1861
+ "fieldName": "pulse"
2174
1862
  }
2175
1863
  ],
2176
1864
  "superclass": {
2177
1865
  "name": "FlowRdfElement",
2178
1866
  "module": "/src/internal/flow-ui-rdf-element"
2179
- }
1867
+ },
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",
1870
+ "status": "stable",
1871
+ "since": "2.0",
1872
+ "tagName": "flow-ui-badge",
1873
+ "customElement": true
2180
1874
  }
2181
1875
  ],
2182
1876
  "exports": [
@@ -2184,59 +1878,32 @@
2184
1878
  "kind": "js",
2185
1879
  "name": "default",
2186
1880
  "declaration": {
2187
- "name": "FlowCalendar",
2188
- "module": "components/calendar/calendar.component.js"
2189
- }
2190
- }
2191
- ]
2192
- },
2193
- {
2194
- "kind": "javascript-module",
2195
- "path": "components/calendar/calendar.js",
2196
- "declarations": [],
2197
- "exports": [
2198
- {
2199
- "kind": "js",
2200
- "name": "*",
2201
- "declaration": {
2202
- "name": "*",
2203
- "package": "./calendar.component.js"
1881
+ "name": "FlowBadge",
1882
+ "module": "components/badge/badge.js"
2204
1883
  }
2205
1884
  },
2206
1885
  {
2207
- "kind": "js",
2208
- "name": "default",
1886
+ "kind": "custom-element-definition",
1887
+ "name": "flow-ui-badge",
2209
1888
  "declaration": {
2210
- "name": "FlowCalendar",
2211
- "module": "components/calendar/calendar.js"
1889
+ "name": "FlowBadge",
1890
+ "module": "components/badge/badge.js"
2212
1891
  }
2213
1892
  }
2214
1893
  ]
2215
1894
  },
2216
1895
  {
2217
1896
  "kind": "javascript-module",
2218
- "path": "components/card/card.js",
1897
+ "path": "components/avatar/avatar.js",
2219
1898
  "declarations": [
2220
1899
  {
2221
1900
  "kind": "class",
2222
1901
  "description": "",
2223
- "name": "FlowCard",
1902
+ "name": "FlowAvatar",
2224
1903
  "cssProperties": [
2225
1904
  {
2226
- "description": "The card's border color, including borders that occur inside the card.",
2227
- "name": "--border-color"
2228
- },
2229
- {
2230
- "description": "The border radius for the card's edges.",
2231
- "name": "--border-radius"
2232
- },
2233
- {
2234
- "description": "The width of the card's borders.",
2235
- "name": "--border-width"
2236
- },
2237
- {
2238
- "description": "The padding to use for the card's sections.",
2239
- "name": "--padding"
1905
+ "description": "The size of the avatar.",
1906
+ "name": "--size"
2240
1907
  }
2241
1908
  ],
2242
1909
  "cssParts": [
@@ -2245,58 +1912,149 @@
2245
1912
  "name": "base"
2246
1913
  },
2247
1914
  {
2248
- "description": "The container that wraps the card's image.",
2249
- "name": "image"
2250
- },
2251
- {
2252
- "description": "The container that wraps the card's header.",
2253
- "name": "header"
1915
+ "description": "The container that wraps the avatar's icon.",
1916
+ "name": "icon"
2254
1917
  },
2255
1918
  {
2256
- "description": "The container that wraps the card's main content.",
2257
- "name": "body"
1919
+ "description": "The container that wraps the avatar's initials.",
1920
+ "name": "initials"
2258
1921
  },
2259
1922
  {
2260
- "description": "The container that wraps the card's footer.",
2261
- "name": "footer"
1923
+ "description": "The avatar image. Only shown when the `image` attribute is set.",
1924
+ "name": "image"
2262
1925
  }
2263
1926
  ],
2264
1927
  "slots": [
2265
1928
  {
2266
- "description": "The card's main content.",
2267
- "name": ""
1929
+ "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
1930
+ "name": "icon"
1931
+ }
1932
+ ],
1933
+ "members": [
1934
+ {
1935
+ "kind": "field",
1936
+ "name": "hasError",
1937
+ "type": {
1938
+ "text": "boolean"
1939
+ },
1940
+ "privacy": "private",
1941
+ "default": "false"
2268
1942
  },
2269
1943
  {
2270
- "description": "An optional header for the card.",
2271
- "name": "header"
1944
+ "kind": "field",
1945
+ "name": "image",
1946
+ "type": {
1947
+ "text": "string"
1948
+ },
1949
+ "default": "''",
1950
+ "description": "The image source to use for the avatar.",
1951
+ "attribute": "image"
2272
1952
  },
2273
1953
  {
2274
- "description": "An optional footer for the card.",
2275
- "name": "footer"
1954
+ "kind": "field",
1955
+ "name": "label",
1956
+ "type": {
1957
+ "text": "string"
1958
+ },
1959
+ "default": "''",
1960
+ "description": "A label to use to describe the avatar to assistive devices.",
1961
+ "attribute": "label"
2276
1962
  },
2277
1963
  {
2278
- "description": "An optional image to render at the start of the card.",
2279
- "name": "image"
1964
+ "kind": "field",
1965
+ "name": "initials",
1966
+ "type": {
1967
+ "text": "string"
1968
+ },
1969
+ "default": "''",
1970
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
1971
+ "attribute": "initials"
1972
+ },
1973
+ {
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"
1982
+ },
1983
+ {
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
1993
+ },
1994
+ {
1995
+ "kind": "method",
1996
+ "name": "handleImageChange"
2280
1997
  }
2281
1998
  ],
2282
- "members": [
1999
+ "attributes": [
2283
2000
  {
2284
- "kind": "field",
2285
- "name": "hasSlotController",
2286
- "privacy": "private",
2287
- "readonly": true,
2288
- "default": "new HasSlotController(this, 'footer', 'header', 'image')"
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
+ {
2010
+ "name": "label",
2011
+ "type": {
2012
+ "text": "string"
2013
+ },
2014
+ "default": "''",
2015
+ "description": "A label to use to describe the avatar to assistive devices.",
2016
+ "fieldName": "label"
2017
+ },
2018
+ {
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",
2038
+ "type": {
2039
+ "text": "'circle' | 'square' | 'rounded'"
2040
+ },
2041
+ "default": "'circle'",
2042
+ "description": "The shape of the avatar.",
2043
+ "fieldName": "shape"
2289
2044
  }
2290
2045
  ],
2291
2046
  "superclass": {
2292
2047
  "name": "FlowRdfElement",
2293
2048
  "module": "/src/internal/flow-ui-rdf-element"
2294
2049
  },
2295
- "summary": "Cards can be used to group related subjects in a container.",
2296
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/card",
2050
+ "summary": "Avatars are used to represent a person or object.",
2051
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/avatar",
2297
2052
  "status": "stable",
2298
2053
  "since": "2.0",
2299
- "tagName": "flow-ui-card",
2054
+ "dependencies": [
2055
+ "flow-ui-icon"
2056
+ ],
2057
+ "tagName": "flow-ui-avatar",
2300
2058
  "customElement": true
2301
2059
  }
2302
2060
  ],
@@ -2305,133 +2063,375 @@
2305
2063
  "kind": "js",
2306
2064
  "name": "default",
2307
2065
  "declaration": {
2308
- "name": "FlowCard",
2309
- "module": "components/card/card.js"
2066
+ "name": "FlowAvatar",
2067
+ "module": "components/avatar/avatar.js"
2310
2068
  }
2311
2069
  },
2312
2070
  {
2313
2071
  "kind": "custom-element-definition",
2314
- "name": "flow-ui-card",
2072
+ "name": "flow-ui-avatar",
2315
2073
  "declaration": {
2316
- "name": "FlowCard",
2317
- "module": "components/card/card.js"
2074
+ "name": "FlowAvatar",
2075
+ "module": "components/avatar/avatar.js"
2318
2076
  }
2319
2077
  }
2320
2078
  ]
2321
2079
  },
2322
2080
  {
2323
2081
  "kind": "javascript-module",
2324
- "path": "components/carousel/autoplay-controller.js",
2082
+ "path": "components/calendar/calendar.component.js",
2325
2083
  "declarations": [
2326
2084
  {
2327
2085
  "kind": "class",
2328
- "description": "A controller that repeatedly calls the specified callback with the provided interval time.\nThe timer is automatically paused while the user is interacting with the component.",
2329
- "name": "AutoplayController",
2086
+ "description": "",
2087
+ "name": "FlowCalendar",
2330
2088
  "members": [
2331
2089
  {
2332
2090
  "kind": "field",
2333
- "name": "host",
2334
- "type": {
2335
- "text": "ReactiveElement"
2336
- },
2337
- "privacy": "private",
2338
- "default": "host"
2339
- },
2340
- {
2341
- "kind": "field",
2342
- "name": "timerId",
2343
- "type": {
2344
- "text": "number"
2345
- },
2346
- "privacy": "private",
2347
- "default": "0"
2348
- },
2349
- {
2350
- "kind": "field",
2351
- "name": "tickCallback",
2352
- "type": {
2353
- "text": "() => void"
2354
- },
2091
+ "name": "hasSlotController",
2355
2092
  "privacy": "private",
2356
- "default": "tickCallback"
2093
+ "readonly": true,
2094
+ "default": "new HasSlotController(this, 'info')"
2357
2095
  },
2358
2096
  {
2359
2097
  "kind": "field",
2360
- "name": "activeInteractions",
2361
- "type": {
2362
- "text": "number"
2363
- },
2364
- "privacy": "private",
2365
- "default": "0"
2098
+ "name": "_displayDate",
2099
+ "privacy": "private"
2366
2100
  },
2367
2101
  {
2368
2102
  "kind": "field",
2369
- "name": "paused",
2370
- "type": {
2371
- "text": "boolean"
2372
- },
2373
- "default": "false"
2103
+ "name": "_selectedDate",
2104
+ "privacy": "private"
2374
2105
  },
2375
2106
  {
2376
2107
  "kind": "field",
2377
- "name": "stopped",
2108
+ "name": "value",
2378
2109
  "type": {
2379
- "text": "boolean"
2110
+ "text": "string"
2380
2111
  },
2381
- "default": "true"
2112
+ "attribute": "value",
2113
+ "reflects": true
2382
2114
  },
2383
2115
  {
2384
2116
  "kind": "method",
2385
- "name": "hostConnected",
2386
- "return": {
2387
- "type": {
2388
- "text": "void"
2389
- }
2390
- }
2117
+ "name": "handleValueChange"
2391
2118
  },
2392
2119
  {
2393
2120
  "kind": "method",
2394
- "name": "hostDisconnected",
2395
- "return": {
2396
- "type": {
2397
- "text": "void"
2121
+ "name": "dateClicked",
2122
+ "privacy": "private",
2123
+ "parameters": [
2124
+ {
2125
+ "name": "date",
2126
+ "type": {
2127
+ "text": "string"
2128
+ }
2398
2129
  }
2399
- }
2130
+ ]
2400
2131
  },
2401
2132
  {
2402
2133
  "kind": "method",
2403
- "name": "start",
2134
+ "name": "changeDisplayDate",
2135
+ "privacy": "private",
2404
2136
  "parameters": [
2405
2137
  {
2406
- "name": "interval",
2138
+ "name": "value",
2407
2139
  "type": {
2408
2140
  "text": "number"
2409
2141
  }
2142
+ },
2143
+ {
2144
+ "name": "unit",
2145
+ "type": {
2146
+ "text": "dayjs.OpUnitType"
2147
+ }
2410
2148
  }
2411
2149
  ]
2412
2150
  },
2413
2151
  {
2414
2152
  "kind": "method",
2415
- "name": "stop"
2153
+ "name": "calendarHeaderTemplate",
2154
+ "privacy": "private"
2416
2155
  },
2417
2156
  {
2418
- "kind": "field",
2419
- "name": "pause"
2157
+ "kind": "method",
2158
+ "name": "dayOfWeekGridTemplate",
2159
+ "privacy": "private"
2420
2160
  },
2421
2161
  {
2422
- "kind": "field",
2423
- "name": "resume"
2162
+ "kind": "method",
2163
+ "name": "dayGridTemplate",
2164
+ "privacy": "private"
2424
2165
  }
2425
- ]
2166
+ ],
2167
+ "attributes": [
2168
+ {
2169
+ "name": "value",
2170
+ "type": {
2171
+ "text": "string"
2172
+ },
2173
+ "fieldName": "value"
2174
+ }
2175
+ ],
2176
+ "superclass": {
2177
+ "name": "FlowRdfElement",
2178
+ "module": "/src/internal/flow-ui-rdf-element"
2179
+ }
2426
2180
  }
2427
2181
  ],
2428
2182
  "exports": [
2429
2183
  {
2430
2184
  "kind": "js",
2431
- "name": "AutoplayController",
2185
+ "name": "default",
2432
2186
  "declaration": {
2433
- "name": "AutoplayController",
2434
- "module": "components/carousel/autoplay-controller.js"
2187
+ "name": "FlowCalendar",
2188
+ "module": "components/calendar/calendar.component.js"
2189
+ }
2190
+ }
2191
+ ]
2192
+ },
2193
+ {
2194
+ "kind": "javascript-module",
2195
+ "path": "components/calendar/calendar.js",
2196
+ "declarations": [],
2197
+ "exports": [
2198
+ {
2199
+ "kind": "js",
2200
+ "name": "*",
2201
+ "declaration": {
2202
+ "name": "*",
2203
+ "package": "./calendar.component.js"
2204
+ }
2205
+ },
2206
+ {
2207
+ "kind": "js",
2208
+ "name": "default",
2209
+ "declaration": {
2210
+ "name": "FlowCalendar",
2211
+ "module": "components/calendar/calendar.js"
2212
+ }
2213
+ }
2214
+ ]
2215
+ },
2216
+ {
2217
+ "kind": "javascript-module",
2218
+ "path": "components/card/card.js",
2219
+ "declarations": [
2220
+ {
2221
+ "kind": "class",
2222
+ "description": "",
2223
+ "name": "FlowCard",
2224
+ "cssProperties": [
2225
+ {
2226
+ "description": "The card's border color, including borders that occur inside the card.",
2227
+ "name": "--border-color"
2228
+ },
2229
+ {
2230
+ "description": "The border radius for the card's edges.",
2231
+ "name": "--border-radius"
2232
+ },
2233
+ {
2234
+ "description": "The width of the card's borders.",
2235
+ "name": "--border-width"
2236
+ },
2237
+ {
2238
+ "description": "The padding to use for the card's sections.",
2239
+ "name": "--padding"
2240
+ }
2241
+ ],
2242
+ "cssParts": [
2243
+ {
2244
+ "description": "The component's base wrapper.",
2245
+ "name": "base"
2246
+ },
2247
+ {
2248
+ "description": "The container that wraps the card's image.",
2249
+ "name": "image"
2250
+ },
2251
+ {
2252
+ "description": "The container that wraps the card's header.",
2253
+ "name": "header"
2254
+ },
2255
+ {
2256
+ "description": "The container that wraps the card's main content.",
2257
+ "name": "body"
2258
+ },
2259
+ {
2260
+ "description": "The container that wraps the card's footer.",
2261
+ "name": "footer"
2262
+ }
2263
+ ],
2264
+ "slots": [
2265
+ {
2266
+ "description": "The card's main content.",
2267
+ "name": ""
2268
+ },
2269
+ {
2270
+ "description": "An optional header for the card.",
2271
+ "name": "header"
2272
+ },
2273
+ {
2274
+ "description": "An optional footer for the card.",
2275
+ "name": "footer"
2276
+ },
2277
+ {
2278
+ "description": "An optional image to render at the start of the card.",
2279
+ "name": "image"
2280
+ }
2281
+ ],
2282
+ "members": [
2283
+ {
2284
+ "kind": "field",
2285
+ "name": "hasSlotController",
2286
+ "privacy": "private",
2287
+ "readonly": true,
2288
+ "default": "new HasSlotController(this, 'footer', 'header', 'image')"
2289
+ }
2290
+ ],
2291
+ "superclass": {
2292
+ "name": "FlowRdfElement",
2293
+ "module": "/src/internal/flow-ui-rdf-element"
2294
+ },
2295
+ "summary": "Cards can be used to group related subjects in a container.",
2296
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/card",
2297
+ "status": "stable",
2298
+ "since": "2.0",
2299
+ "tagName": "flow-ui-card",
2300
+ "customElement": true
2301
+ }
2302
+ ],
2303
+ "exports": [
2304
+ {
2305
+ "kind": "js",
2306
+ "name": "default",
2307
+ "declaration": {
2308
+ "name": "FlowCard",
2309
+ "module": "components/card/card.js"
2310
+ }
2311
+ },
2312
+ {
2313
+ "kind": "custom-element-definition",
2314
+ "name": "flow-ui-card",
2315
+ "declaration": {
2316
+ "name": "FlowCard",
2317
+ "module": "components/card/card.js"
2318
+ }
2319
+ }
2320
+ ]
2321
+ },
2322
+ {
2323
+ "kind": "javascript-module",
2324
+ "path": "components/carousel/autoplay-controller.js",
2325
+ "declarations": [
2326
+ {
2327
+ "kind": "class",
2328
+ "description": "A controller that repeatedly calls the specified callback with the provided interval time.\nThe timer is automatically paused while the user is interacting with the component.",
2329
+ "name": "AutoplayController",
2330
+ "members": [
2331
+ {
2332
+ "kind": "field",
2333
+ "name": "host",
2334
+ "type": {
2335
+ "text": "ReactiveElement"
2336
+ },
2337
+ "privacy": "private",
2338
+ "default": "host"
2339
+ },
2340
+ {
2341
+ "kind": "field",
2342
+ "name": "timerId",
2343
+ "type": {
2344
+ "text": "number"
2345
+ },
2346
+ "privacy": "private",
2347
+ "default": "0"
2348
+ },
2349
+ {
2350
+ "kind": "field",
2351
+ "name": "tickCallback",
2352
+ "type": {
2353
+ "text": "() => void"
2354
+ },
2355
+ "privacy": "private",
2356
+ "default": "tickCallback"
2357
+ },
2358
+ {
2359
+ "kind": "field",
2360
+ "name": "activeInteractions",
2361
+ "type": {
2362
+ "text": "number"
2363
+ },
2364
+ "privacy": "private",
2365
+ "default": "0"
2366
+ },
2367
+ {
2368
+ "kind": "field",
2369
+ "name": "paused",
2370
+ "type": {
2371
+ "text": "boolean"
2372
+ },
2373
+ "default": "false"
2374
+ },
2375
+ {
2376
+ "kind": "field",
2377
+ "name": "stopped",
2378
+ "type": {
2379
+ "text": "boolean"
2380
+ },
2381
+ "default": "true"
2382
+ },
2383
+ {
2384
+ "kind": "method",
2385
+ "name": "hostConnected",
2386
+ "return": {
2387
+ "type": {
2388
+ "text": "void"
2389
+ }
2390
+ }
2391
+ },
2392
+ {
2393
+ "kind": "method",
2394
+ "name": "hostDisconnected",
2395
+ "return": {
2396
+ "type": {
2397
+ "text": "void"
2398
+ }
2399
+ }
2400
+ },
2401
+ {
2402
+ "kind": "method",
2403
+ "name": "start",
2404
+ "parameters": [
2405
+ {
2406
+ "name": "interval",
2407
+ "type": {
2408
+ "text": "number"
2409
+ }
2410
+ }
2411
+ ]
2412
+ },
2413
+ {
2414
+ "kind": "method",
2415
+ "name": "stop"
2416
+ },
2417
+ {
2418
+ "kind": "field",
2419
+ "name": "pause"
2420
+ },
2421
+ {
2422
+ "kind": "field",
2423
+ "name": "resume"
2424
+ }
2425
+ ]
2426
+ }
2427
+ ],
2428
+ "exports": [
2429
+ {
2430
+ "kind": "js",
2431
+ "name": "AutoplayController",
2432
+ "declaration": {
2433
+ "name": "AutoplayController",
2434
+ "module": "components/carousel/autoplay-controller.js"
2435
2435
  }
2436
2436
  }
2437
2437
  ]
@@ -11117,77 +11117,188 @@
11117
11117
  },
11118
11118
  {
11119
11119
  "kind": "javascript-module",
11120
- "path": "components/radio/radio.js",
11120
+ "path": "components/range/range.js",
11121
11121
  "declarations": [
11122
11122
  {
11123
11123
  "kind": "class",
11124
- "description": "fdfd",
11125
- "name": "FlowRadio",
11126
- "cssParts": [
11124
+ "description": "",
11125
+ "name": "FlowRange",
11126
+ "cssProperties": [
11127
11127
  {
11128
- "description": "The component's base wrapper.",
11129
- "name": "base"
11128
+ "description": "The size of the thumb.",
11129
+ "name": "--thumb-size"
11130
11130
  },
11131
11131
  {
11132
- "description": "The circular container that wraps the radio's checked state.",
11133
- "name": "control"
11132
+ "description": "The vertical distance the tooltip is offset from the track.",
11133
+ "name": "--tooltip-offset"
11134
11134
  },
11135
11135
  {
11136
- "description": "The radio control when the radio is checked.",
11137
- "name": "control--checked"
11136
+ "description": "The color of the portion of the track that represents the current value.",
11137
+ "name": "--track-color-active"
11138
11138
  },
11139
11139
  {
11140
- "description": "The checked icon, an `<flow-ui-icon>` element.",
11141
- "name": "checked-icon"
11140
+ "description": "The of the portion of the track that represents the remaining value.",
11141
+ "name": "--track-color-inactive"
11142
11142
  },
11143
11143
  {
11144
- "description": "The container that wraps the radio's label.",
11145
- "name": "label"
11144
+ "description": "The height of the track.",
11145
+ "name": "--track-height"
11146
+ },
11147
+ {
11148
+ "description": "The point of origin of the active track.",
11149
+ "name": "--track-active-offset"
11150
+ }
11151
+ ],
11152
+ "cssParts": [
11153
+ {
11154
+ "description": "The form control that wraps the label, input, and help text.",
11155
+ "name": "form-control"
11156
+ },
11157
+ {
11158
+ "description": "The label's wrapper.",
11159
+ "name": "form-control-label"
11160
+ },
11161
+ {
11162
+ "description": "The range's wrapper.",
11163
+ "name": "form-control-input"
11164
+ },
11165
+ {
11166
+ "description": "The help text's wrapper.",
11167
+ "name": "form-control-help-text"
11168
+ },
11169
+ {
11170
+ "description": "The component's base wrapper.",
11171
+ "name": "base"
11172
+ },
11173
+ {
11174
+ "description": "The internal `<input>` element.",
11175
+ "name": "input"
11176
+ },
11177
+ {
11178
+ "description": "The range's tooltip.",
11179
+ "name": "tooltip"
11146
11180
  }
11147
11181
  ],
11148
11182
  "slots": [
11149
11183
  {
11150
- "description": "The radio's label.",
11151
- "name": ""
11184
+ "description": "The range's label. Alternatively, you can use the `label` attribute.",
11185
+ "name": "label"
11186
+ },
11187
+ {
11188
+ "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
11189
+ "name": "help-text"
11152
11190
  }
11153
11191
  ],
11154
11192
  "members": [
11155
11193
  {
11156
11194
  "kind": "field",
11157
- "name": "checked",
11195
+ "name": "formControlController",
11196
+ "privacy": "private",
11197
+ "readonly": true,
11198
+ "default": "new FormControlController(this)"
11199
+ },
11200
+ {
11201
+ "kind": "field",
11202
+ "name": "hasSlotController",
11203
+ "privacy": "private",
11204
+ "readonly": true,
11205
+ "default": "new HasSlotController(this, 'help-text', 'label')"
11206
+ },
11207
+ {
11208
+ "kind": "field",
11209
+ "name": "localize",
11210
+ "privacy": "private",
11211
+ "readonly": true,
11212
+ "default": "new LocalizeController(this)"
11213
+ },
11214
+ {
11215
+ "kind": "field",
11216
+ "name": "resizeObserver",
11217
+ "type": {
11218
+ "text": "ResizeObserver"
11219
+ },
11220
+ "privacy": "private"
11221
+ },
11222
+ {
11223
+ "kind": "field",
11224
+ "name": "input",
11225
+ "type": {
11226
+ "text": "HTMLInputElement"
11227
+ }
11228
+ },
11229
+ {
11230
+ "kind": "field",
11231
+ "name": "output",
11232
+ "type": {
11233
+ "text": "HTMLOutputElement | null"
11234
+ }
11235
+ },
11236
+ {
11237
+ "kind": "field",
11238
+ "name": "hasFocus",
11158
11239
  "type": {
11159
11240
  "text": "boolean"
11160
11241
  },
11242
+ "privacy": "private",
11161
11243
  "default": "false"
11162
11244
  },
11163
11245
  {
11164
11246
  "kind": "field",
11165
- "name": "hasFocus",
11247
+ "name": "hasTooltip",
11166
11248
  "type": {
11167
11249
  "text": "boolean"
11168
11250
  },
11169
- "privacy": "protected",
11251
+ "privacy": "private",
11170
11252
  "default": "false"
11171
11253
  },
11172
11254
  {
11173
11255
  "kind": "field",
11174
- "name": "value",
11256
+ "name": "title",
11175
11257
  "type": {
11176
11258
  "text": "string"
11177
11259
  },
11178
- "description": "The radio's value. When selected, the radio group will receive this value.",
11260
+ "default": "''",
11261
+ "attribute": "title"
11262
+ },
11263
+ {
11264
+ "kind": "field",
11265
+ "name": "name",
11266
+ "type": {
11267
+ "text": "string"
11268
+ },
11269
+ "default": "''",
11270
+ "description": "The name of the range, submitted as a name/value pair with form data.",
11271
+ "attribute": "name"
11272
+ },
11273
+ {
11274
+ "kind": "field",
11275
+ "name": "value",
11276
+ "type": {
11277
+ "text": "number"
11278
+ },
11279
+ "default": "0",
11280
+ "description": "The current value of the range, submitted as a name/value pair with form data.",
11179
11281
  "attribute": "value"
11180
11282
  },
11181
11283
  {
11182
11284
  "kind": "field",
11183
- "name": "size",
11285
+ "name": "label",
11184
11286
  "type": {
11185
- "text": "'small' | 'medium' | 'large'"
11287
+ "text": "string"
11186
11288
  },
11187
- "default": "'medium'",
11188
- "description": "The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this\nattribute can typically be omitted.",
11189
- "attribute": "size",
11190
- "reflects": true
11289
+ "default": "''",
11290
+ "description": "The range's label. If you need to display HTML, use the `label` slot instead.",
11291
+ "attribute": "label"
11292
+ },
11293
+ {
11294
+ "kind": "field",
11295
+ "name": "helpText",
11296
+ "type": {
11297
+ "text": "string"
11298
+ },
11299
+ "default": "''",
11300
+ "description": "The range's help text. If you need to display HTML, use the help-text slot instead.",
11301
+ "attribute": "help-text"
11191
11302
  },
11192
11303
  {
11193
11304
  "kind": "field",
@@ -11196,18 +11307,98 @@
11196
11307
  "text": "boolean"
11197
11308
  },
11198
11309
  "default": "false",
11199
- "description": "Disables the radio.",
11310
+ "description": "Disables the range.",
11200
11311
  "attribute": "disabled",
11201
11312
  "reflects": true
11202
11313
  },
11314
+ {
11315
+ "kind": "field",
11316
+ "name": "min",
11317
+ "type": {
11318
+ "text": "number"
11319
+ },
11320
+ "default": "0",
11321
+ "description": "The minimum acceptable value of the range.",
11322
+ "attribute": "min"
11323
+ },
11324
+ {
11325
+ "kind": "field",
11326
+ "name": "max",
11327
+ "type": {
11328
+ "text": "number"
11329
+ },
11330
+ "default": "100",
11331
+ "description": "The maximum acceptable value of the range.",
11332
+ "attribute": "max"
11333
+ },
11334
+ {
11335
+ "kind": "field",
11336
+ "name": "step",
11337
+ "type": {
11338
+ "text": "number"
11339
+ },
11340
+ "default": "1",
11341
+ "description": "The interval at which the range will increase and decrease.",
11342
+ "attribute": "step"
11343
+ },
11344
+ {
11345
+ "kind": "field",
11346
+ "name": "tooltip",
11347
+ "type": {
11348
+ "text": "'top' | 'bottom' | 'none'"
11349
+ },
11350
+ "default": "'top'",
11351
+ "description": "The preferred placement of the range's tooltip.",
11352
+ "attribute": "tooltip"
11353
+ },
11354
+ {
11355
+ "kind": "field",
11356
+ "name": "tooltipFormatter",
11357
+ "type": {
11358
+ "text": "(value: number) => string"
11359
+ },
11360
+ "description": "A function used to format the tooltip's value. The range's value is passed as the first and only argument. The\nfunction should return a string to display in the tooltip."
11361
+ },
11362
+ {
11363
+ "kind": "field",
11364
+ "name": "form",
11365
+ "type": {
11366
+ "text": "string"
11367
+ },
11368
+ "default": "''",
11369
+ "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
11370
+ "attribute": "form",
11371
+ "reflects": true
11372
+ },
11373
+ {
11374
+ "kind": "field",
11375
+ "name": "defaultValue",
11376
+ "type": {
11377
+ "text": "number"
11378
+ },
11379
+ "default": "0",
11380
+ "description": "The default value of the form control. Primarily used for resetting the form control."
11381
+ },
11382
+ {
11383
+ "kind": "field",
11384
+ "name": "validity",
11385
+ "description": "Gets the validity state object",
11386
+ "readonly": true
11387
+ },
11388
+ {
11389
+ "kind": "field",
11390
+ "name": "validationMessage",
11391
+ "description": "Gets the validation message",
11392
+ "readonly": true
11393
+ },
11203
11394
  {
11204
11395
  "kind": "method",
11205
- "name": "addEventListeners",
11396
+ "name": "handleChange",
11206
11397
  "privacy": "private"
11207
11398
  },
11208
11399
  {
11209
11400
  "kind": "method",
11210
- "name": "removeEventListeners",
11401
+ "name": "handleInput",
11211
11402
  "privacy": "private"
11212
11403
  },
11213
11404
  {
@@ -11217,26 +11408,131 @@
11217
11408
  },
11218
11409
  {
11219
11410
  "kind": "method",
11220
- "name": "handleClick",
11411
+ "name": "handleFocus",
11221
11412
  "privacy": "private"
11222
11413
  },
11223
11414
  {
11224
11415
  "kind": "method",
11225
- "name": "handleFocus",
11416
+ "name": "handleThumbDragStart",
11226
11417
  "privacy": "private"
11227
11418
  },
11228
11419
  {
11229
11420
  "kind": "method",
11230
- "name": "setInitialAttributes",
11421
+ "name": "handleThumbDragEnd",
11231
11422
  "privacy": "private"
11232
11423
  },
11233
11424
  {
11234
11425
  "kind": "method",
11235
- "name": "handleCheckedChange"
11426
+ "name": "syncProgress",
11427
+ "privacy": "private",
11428
+ "parameters": [
11429
+ {
11430
+ "name": "percent",
11431
+ "type": {
11432
+ "text": "number"
11433
+ }
11434
+ }
11435
+ ]
11436
+ },
11437
+ {
11438
+ "kind": "method",
11439
+ "name": "syncTooltip",
11440
+ "privacy": "private",
11441
+ "parameters": [
11442
+ {
11443
+ "name": "percent",
11444
+ "type": {
11445
+ "text": "number"
11446
+ }
11447
+ }
11448
+ ]
11449
+ },
11450
+ {
11451
+ "kind": "method",
11452
+ "name": "handleValueChange"
11236
11453
  },
11237
11454
  {
11238
11455
  "kind": "method",
11239
11456
  "name": "handleDisabledChange"
11457
+ },
11458
+ {
11459
+ "kind": "method",
11460
+ "name": "syncRange"
11461
+ },
11462
+ {
11463
+ "kind": "method",
11464
+ "name": "handleInvalid",
11465
+ "privacy": "private",
11466
+ "parameters": [
11467
+ {
11468
+ "name": "event",
11469
+ "type": {
11470
+ "text": "Event"
11471
+ }
11472
+ }
11473
+ ]
11474
+ },
11475
+ {
11476
+ "kind": "method",
11477
+ "name": "focus",
11478
+ "parameters": [
11479
+ {
11480
+ "name": "options",
11481
+ "optional": true,
11482
+ "type": {
11483
+ "text": "FocusOptions"
11484
+ }
11485
+ }
11486
+ ],
11487
+ "description": "Sets focus on the range."
11488
+ },
11489
+ {
11490
+ "kind": "method",
11491
+ "name": "blur",
11492
+ "description": "Removes focus from the range."
11493
+ },
11494
+ {
11495
+ "kind": "method",
11496
+ "name": "stepUp",
11497
+ "description": "Increments the value of the range by the value of the step attribute."
11498
+ },
11499
+ {
11500
+ "kind": "method",
11501
+ "name": "stepDown",
11502
+ "description": "Decrements the value of the range by the value of the step attribute."
11503
+ },
11504
+ {
11505
+ "kind": "method",
11506
+ "name": "checkValidity",
11507
+ "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
11508
+ },
11509
+ {
11510
+ "kind": "method",
11511
+ "name": "getForm",
11512
+ "return": {
11513
+ "type": {
11514
+ "text": "HTMLFormElement | null"
11515
+ }
11516
+ },
11517
+ "description": "Gets the associated form, if one exists."
11518
+ },
11519
+ {
11520
+ "kind": "method",
11521
+ "name": "reportValidity",
11522
+ "description": "Checks for validity and shows the browser's validation message if the control is invalid."
11523
+ },
11524
+ {
11525
+ "kind": "method",
11526
+ "name": "setCustomValidity",
11527
+ "parameters": [
11528
+ {
11529
+ "name": "message",
11530
+ "type": {
11531
+ "text": "string"
11532
+ }
11533
+ }
11534
+ ],
11535
+ "description": "Sets a custom validation message. Pass an empty string to restore validity."
11240
11536
  }
11241
11537
  ],
11242
11538
  "events": [
@@ -11245,29 +11541,71 @@
11245
11541
  "name": "flow-ui-blur",
11246
11542
  "reactName": "onFlowUiBlur"
11247
11543
  },
11544
+ {
11545
+ "description": "Emitted when an alteration to the control's value is committed by the user.",
11546
+ "name": "flow-ui-change",
11547
+ "reactName": "onFlowUiChange"
11548
+ },
11248
11549
  {
11249
11550
  "description": "Emitted when the control gains focus.",
11250
11551
  "name": "flow-ui-focus",
11251
11552
  "reactName": "onFlowUiFocus"
11553
+ },
11554
+ {
11555
+ "description": "Emitted when the control receives input.",
11556
+ "name": "flow-ui-input",
11557
+ "reactName": "onFlowUiInput"
11558
+ },
11559
+ {
11560
+ "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
11561
+ "name": "flow-ui-invalid",
11562
+ "reactName": "onFlowUiInvalid"
11252
11563
  }
11253
11564
  ],
11254
11565
  "attributes": [
11255
11566
  {
11256
- "name": "value",
11567
+ "name": "title",
11257
11568
  "type": {
11258
11569
  "text": "string"
11259
11570
  },
11260
- "description": "The radio's value. When selected, the radio group will receive this value.",
11571
+ "default": "''",
11572
+ "fieldName": "title"
11573
+ },
11574
+ {
11575
+ "name": "name",
11576
+ "type": {
11577
+ "text": "string"
11578
+ },
11579
+ "default": "''",
11580
+ "description": "The name of the range, submitted as a name/value pair with form data.",
11581
+ "fieldName": "name"
11582
+ },
11583
+ {
11584
+ "name": "value",
11585
+ "type": {
11586
+ "text": "number"
11587
+ },
11588
+ "default": "0",
11589
+ "description": "The current value of the range, submitted as a name/value pair with form data.",
11261
11590
  "fieldName": "value"
11262
11591
  },
11263
11592
  {
11264
- "name": "size",
11593
+ "name": "label",
11265
11594
  "type": {
11266
- "text": "'small' | 'medium' | 'large'"
11595
+ "text": "string"
11267
11596
  },
11268
- "default": "'medium'",
11269
- "description": "The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this\nattribute can typically be omitted.",
11270
- "fieldName": "size"
11597
+ "default": "''",
11598
+ "description": "The range's label. If you need to display HTML, use the `label` slot instead.",
11599
+ "fieldName": "label"
11600
+ },
11601
+ {
11602
+ "name": "help-text",
11603
+ "type": {
11604
+ "text": "string"
11605
+ },
11606
+ "default": "''",
11607
+ "description": "The range's help text. If you need to display HTML, use the help-text slot instead.",
11608
+ "fieldName": "helpText"
11271
11609
  },
11272
11610
  {
11273
11611
  "name": "disabled",
@@ -11275,22 +11613,64 @@
11275
11613
  "text": "boolean"
11276
11614
  },
11277
11615
  "default": "false",
11278
- "description": "Disables the radio.",
11616
+ "description": "Disables the range.",
11279
11617
  "fieldName": "disabled"
11618
+ },
11619
+ {
11620
+ "name": "min",
11621
+ "type": {
11622
+ "text": "number"
11623
+ },
11624
+ "default": "0",
11625
+ "description": "The minimum acceptable value of the range.",
11626
+ "fieldName": "min"
11627
+ },
11628
+ {
11629
+ "name": "max",
11630
+ "type": {
11631
+ "text": "number"
11632
+ },
11633
+ "default": "100",
11634
+ "description": "The maximum acceptable value of the range.",
11635
+ "fieldName": "max"
11636
+ },
11637
+ {
11638
+ "name": "step",
11639
+ "type": {
11640
+ "text": "number"
11641
+ },
11642
+ "default": "1",
11643
+ "description": "The interval at which the range will increase and decrease.",
11644
+ "fieldName": "step"
11645
+ },
11646
+ {
11647
+ "name": "tooltip",
11648
+ "type": {
11649
+ "text": "'top' | 'bottom' | 'none'"
11650
+ },
11651
+ "default": "'top'",
11652
+ "description": "The preferred placement of the range's tooltip.",
11653
+ "fieldName": "tooltip"
11654
+ },
11655
+ {
11656
+ "name": "form",
11657
+ "type": {
11658
+ "text": "string"
11659
+ },
11660
+ "default": "''",
11661
+ "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
11662
+ "fieldName": "form"
11280
11663
  }
11281
11664
  ],
11282
11665
  "superclass": {
11283
11666
  "name": "FlowRdfElement",
11284
11667
  "module": "/src/internal/flow-ui-rdf-element"
11285
11668
  },
11286
- "summary": "Radios allow the user to select a single option from a group.",
11287
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/radio",
11669
+ "summary": "Ranges allow the user to select a single value within a given range using a slider.",
11670
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/range",
11288
11671
  "status": "stable",
11289
- "since": "2.0",
11290
- "dependencies": [
11291
- "flow-ui-icon"
11292
- ],
11293
- "tagName": "flow-ui-radio",
11672
+ "since": "2.0",
11673
+ "tagName": "flow-ui-range",
11294
11674
  "customElement": true
11295
11675
  }
11296
11676
  ],
@@ -11299,16 +11679,16 @@
11299
11679
  "kind": "js",
11300
11680
  "name": "default",
11301
11681
  "declaration": {
11302
- "name": "FlowRadio",
11303
- "module": "components/radio/radio.js"
11682
+ "name": "FlowRange",
11683
+ "module": "components/range/range.js"
11304
11684
  }
11305
11685
  },
11306
11686
  {
11307
11687
  "kind": "custom-element-definition",
11308
- "name": "flow-ui-radio",
11688
+ "name": "flow-ui-range",
11309
11689
  "declaration": {
11310
- "name": "FlowRadio",
11311
- "module": "components/radio/radio.js"
11690
+ "name": "FlowRange",
11691
+ "module": "components/range/range.js"
11312
11692
  }
11313
11693
  }
11314
11694
  ]
@@ -11748,288 +12128,97 @@
11748
12128
  },
11749
12129
  {
11750
12130
  "kind": "javascript-module",
11751
- "path": "components/range/range.js",
12131
+ "path": "components/radio/radio.js",
11752
12132
  "declarations": [
11753
12133
  {
11754
12134
  "kind": "class",
11755
- "description": "",
11756
- "name": "FlowRange",
11757
- "cssProperties": [
11758
- {
11759
- "description": "The size of the thumb.",
11760
- "name": "--thumb-size"
11761
- },
11762
- {
11763
- "description": "The vertical distance the tooltip is offset from the track.",
11764
- "name": "--tooltip-offset"
11765
- },
11766
- {
11767
- "description": "The color of the portion of the track that represents the current value.",
11768
- "name": "--track-color-active"
11769
- },
11770
- {
11771
- "description": "The of the portion of the track that represents the remaining value.",
11772
- "name": "--track-color-inactive"
11773
- },
11774
- {
11775
- "description": "The height of the track.",
11776
- "name": "--track-height"
11777
- },
11778
- {
11779
- "description": "The point of origin of the active track.",
11780
- "name": "--track-active-offset"
11781
- }
11782
- ],
12135
+ "description": "fdfd",
12136
+ "name": "FlowRadio",
11783
12137
  "cssParts": [
11784
12138
  {
11785
- "description": "The form control that wraps the label, input, and help text.",
11786
- "name": "form-control"
11787
- },
11788
- {
11789
- "description": "The label's wrapper.",
11790
- "name": "form-control-label"
11791
- },
11792
- {
11793
- "description": "The range's wrapper.",
11794
- "name": "form-control-input"
12139
+ "description": "The component's base wrapper.",
12140
+ "name": "base"
11795
12141
  },
11796
12142
  {
11797
- "description": "The help text's wrapper.",
11798
- "name": "form-control-help-text"
12143
+ "description": "The circular container that wraps the radio's checked state.",
12144
+ "name": "control"
11799
12145
  },
11800
12146
  {
11801
- "description": "The component's base wrapper.",
11802
- "name": "base"
12147
+ "description": "The radio control when the radio is checked.",
12148
+ "name": "control--checked"
11803
12149
  },
11804
12150
  {
11805
- "description": "The internal `<input>` element.",
11806
- "name": "input"
12151
+ "description": "The checked icon, an `<flow-ui-icon>` element.",
12152
+ "name": "checked-icon"
11807
12153
  },
11808
12154
  {
11809
- "description": "The range's tooltip.",
11810
- "name": "tooltip"
12155
+ "description": "The container that wraps the radio's label.",
12156
+ "name": "label"
11811
12157
  }
11812
12158
  ],
11813
12159
  "slots": [
11814
12160
  {
11815
- "description": "The range's label. Alternatively, you can use the `label` attribute.",
11816
- "name": "label"
11817
- },
11818
- {
11819
- "description": "Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.",
11820
- "name": "help-text"
12161
+ "description": "The radio's label.",
12162
+ "name": ""
11821
12163
  }
11822
12164
  ],
11823
12165
  "members": [
11824
12166
  {
11825
12167
  "kind": "field",
11826
- "name": "formControlController",
11827
- "privacy": "private",
11828
- "readonly": true,
11829
- "default": "new FormControlController(this)"
11830
- },
11831
- {
11832
- "kind": "field",
11833
- "name": "hasSlotController",
11834
- "privacy": "private",
11835
- "readonly": true,
11836
- "default": "new HasSlotController(this, 'help-text', 'label')"
11837
- },
11838
- {
11839
- "kind": "field",
11840
- "name": "localize",
11841
- "privacy": "private",
11842
- "readonly": true,
11843
- "default": "new LocalizeController(this)"
11844
- },
11845
- {
11846
- "kind": "field",
11847
- "name": "resizeObserver",
11848
- "type": {
11849
- "text": "ResizeObserver"
11850
- },
11851
- "privacy": "private"
11852
- },
11853
- {
11854
- "kind": "field",
11855
- "name": "input",
11856
- "type": {
11857
- "text": "HTMLInputElement"
11858
- }
11859
- },
11860
- {
11861
- "kind": "field",
11862
- "name": "output",
11863
- "type": {
11864
- "text": "HTMLOutputElement | null"
11865
- }
11866
- },
11867
- {
11868
- "kind": "field",
11869
- "name": "hasFocus",
12168
+ "name": "checked",
11870
12169
  "type": {
11871
12170
  "text": "boolean"
11872
12171
  },
11873
- "privacy": "private",
11874
12172
  "default": "false"
11875
12173
  },
11876
12174
  {
11877
12175
  "kind": "field",
11878
- "name": "hasTooltip",
12176
+ "name": "hasFocus",
11879
12177
  "type": {
11880
12178
  "text": "boolean"
11881
12179
  },
11882
- "privacy": "private",
12180
+ "privacy": "protected",
11883
12181
  "default": "false"
11884
12182
  },
11885
- {
11886
- "kind": "field",
11887
- "name": "title",
11888
- "type": {
11889
- "text": "string"
11890
- },
11891
- "default": "''",
11892
- "attribute": "title"
11893
- },
11894
- {
11895
- "kind": "field",
11896
- "name": "name",
11897
- "type": {
11898
- "text": "string"
11899
- },
11900
- "default": "''",
11901
- "description": "The name of the range, submitted as a name/value pair with form data.",
11902
- "attribute": "name"
11903
- },
11904
12183
  {
11905
12184
  "kind": "field",
11906
12185
  "name": "value",
11907
- "type": {
11908
- "text": "number"
11909
- },
11910
- "default": "0",
11911
- "description": "The current value of the range, submitted as a name/value pair with form data.",
11912
- "attribute": "value"
11913
- },
11914
- {
11915
- "kind": "field",
11916
- "name": "label",
11917
- "type": {
11918
- "text": "string"
11919
- },
11920
- "default": "''",
11921
- "description": "The range's label. If you need to display HTML, use the `label` slot instead.",
11922
- "attribute": "label"
11923
- },
11924
- {
11925
- "kind": "field",
11926
- "name": "helpText",
11927
- "type": {
11928
- "text": "string"
11929
- },
11930
- "default": "''",
11931
- "description": "The range's help text. If you need to display HTML, use the help-text slot instead.",
11932
- "attribute": "help-text"
11933
- },
11934
- {
11935
- "kind": "field",
11936
- "name": "disabled",
11937
- "type": {
11938
- "text": "boolean"
11939
- },
11940
- "default": "false",
11941
- "description": "Disables the range.",
11942
- "attribute": "disabled",
11943
- "reflects": true
11944
- },
11945
- {
11946
- "kind": "field",
11947
- "name": "min",
11948
- "type": {
11949
- "text": "number"
11950
- },
11951
- "default": "0",
11952
- "description": "The minimum acceptable value of the range.",
11953
- "attribute": "min"
11954
- },
11955
- {
11956
- "kind": "field",
11957
- "name": "max",
11958
- "type": {
11959
- "text": "number"
11960
- },
11961
- "default": "100",
11962
- "description": "The maximum acceptable value of the range.",
11963
- "attribute": "max"
11964
- },
11965
- {
11966
- "kind": "field",
11967
- "name": "step",
11968
- "type": {
11969
- "text": "number"
11970
- },
11971
- "default": "1",
11972
- "description": "The interval at which the range will increase and decrease.",
11973
- "attribute": "step"
11974
- },
11975
- {
11976
- "kind": "field",
11977
- "name": "tooltip",
11978
- "type": {
11979
- "text": "'top' | 'bottom' | 'none'"
11980
- },
11981
- "default": "'top'",
11982
- "description": "The preferred placement of the range's tooltip.",
11983
- "attribute": "tooltip"
11984
- },
11985
- {
11986
- "kind": "field",
11987
- "name": "tooltipFormatter",
11988
- "type": {
11989
- "text": "(value: number) => string"
11990
- },
11991
- "description": "A function used to format the tooltip's value. The range's value is passed as the first and only argument. The\nfunction should return a string to display in the tooltip."
11992
- },
11993
- {
11994
- "kind": "field",
11995
- "name": "form",
11996
12186
  "type": {
11997
12187
  "text": "string"
11998
12188
  },
11999
- "default": "''",
12000
- "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
12001
- "attribute": "form",
12002
- "reflects": true
12189
+ "description": "The radio's value. When selected, the radio group will receive this value.",
12190
+ "attribute": "value"
12003
12191
  },
12004
12192
  {
12005
12193
  "kind": "field",
12006
- "name": "defaultValue",
12194
+ "name": "size",
12007
12195
  "type": {
12008
- "text": "number"
12009
- },
12010
- "default": "0",
12011
- "description": "The default value of the form control. Primarily used for resetting the form control."
12012
- },
12013
- {
12014
- "kind": "field",
12015
- "name": "validity",
12016
- "description": "Gets the validity state object",
12017
- "readonly": true
12196
+ "text": "'small' | 'medium' | 'large'"
12197
+ },
12198
+ "default": "'medium'",
12199
+ "description": "The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this\nattribute can typically be omitted.",
12200
+ "attribute": "size",
12201
+ "reflects": true
12018
12202
  },
12019
12203
  {
12020
12204
  "kind": "field",
12021
- "name": "validationMessage",
12022
- "description": "Gets the validation message",
12023
- "readonly": true
12205
+ "name": "disabled",
12206
+ "type": {
12207
+ "text": "boolean"
12208
+ },
12209
+ "default": "false",
12210
+ "description": "Disables the radio.",
12211
+ "attribute": "disabled",
12212
+ "reflects": true
12024
12213
  },
12025
12214
  {
12026
12215
  "kind": "method",
12027
- "name": "handleChange",
12216
+ "name": "addEventListeners",
12028
12217
  "privacy": "private"
12029
12218
  },
12030
12219
  {
12031
12220
  "kind": "method",
12032
- "name": "handleInput",
12221
+ "name": "removeEventListeners",
12033
12222
  "privacy": "private"
12034
12223
  },
12035
12224
  {
@@ -12039,131 +12228,26 @@
12039
12228
  },
12040
12229
  {
12041
12230
  "kind": "method",
12042
- "name": "handleFocus",
12231
+ "name": "handleClick",
12043
12232
  "privacy": "private"
12044
12233
  },
12045
12234
  {
12046
12235
  "kind": "method",
12047
- "name": "handleThumbDragStart",
12236
+ "name": "handleFocus",
12048
12237
  "privacy": "private"
12049
12238
  },
12050
12239
  {
12051
12240
  "kind": "method",
12052
- "name": "handleThumbDragEnd",
12241
+ "name": "setInitialAttributes",
12053
12242
  "privacy": "private"
12054
12243
  },
12055
12244
  {
12056
12245
  "kind": "method",
12057
- "name": "syncProgress",
12058
- "privacy": "private",
12059
- "parameters": [
12060
- {
12061
- "name": "percent",
12062
- "type": {
12063
- "text": "number"
12064
- }
12065
- }
12066
- ]
12067
- },
12068
- {
12069
- "kind": "method",
12070
- "name": "syncTooltip",
12071
- "privacy": "private",
12072
- "parameters": [
12073
- {
12074
- "name": "percent",
12075
- "type": {
12076
- "text": "number"
12077
- }
12078
- }
12079
- ]
12080
- },
12081
- {
12082
- "kind": "method",
12083
- "name": "handleValueChange"
12246
+ "name": "handleCheckedChange"
12084
12247
  },
12085
12248
  {
12086
12249
  "kind": "method",
12087
12250
  "name": "handleDisabledChange"
12088
- },
12089
- {
12090
- "kind": "method",
12091
- "name": "syncRange"
12092
- },
12093
- {
12094
- "kind": "method",
12095
- "name": "handleInvalid",
12096
- "privacy": "private",
12097
- "parameters": [
12098
- {
12099
- "name": "event",
12100
- "type": {
12101
- "text": "Event"
12102
- }
12103
- }
12104
- ]
12105
- },
12106
- {
12107
- "kind": "method",
12108
- "name": "focus",
12109
- "parameters": [
12110
- {
12111
- "name": "options",
12112
- "optional": true,
12113
- "type": {
12114
- "text": "FocusOptions"
12115
- }
12116
- }
12117
- ],
12118
- "description": "Sets focus on the range."
12119
- },
12120
- {
12121
- "kind": "method",
12122
- "name": "blur",
12123
- "description": "Removes focus from the range."
12124
- },
12125
- {
12126
- "kind": "method",
12127
- "name": "stepUp",
12128
- "description": "Increments the value of the range by the value of the step attribute."
12129
- },
12130
- {
12131
- "kind": "method",
12132
- "name": "stepDown",
12133
- "description": "Decrements the value of the range by the value of the step attribute."
12134
- },
12135
- {
12136
- "kind": "method",
12137
- "name": "checkValidity",
12138
- "description": "Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid."
12139
- },
12140
- {
12141
- "kind": "method",
12142
- "name": "getForm",
12143
- "return": {
12144
- "type": {
12145
- "text": "HTMLFormElement | null"
12146
- }
12147
- },
12148
- "description": "Gets the associated form, if one exists."
12149
- },
12150
- {
12151
- "kind": "method",
12152
- "name": "reportValidity",
12153
- "description": "Checks for validity and shows the browser's validation message if the control is invalid."
12154
- },
12155
- {
12156
- "kind": "method",
12157
- "name": "setCustomValidity",
12158
- "parameters": [
12159
- {
12160
- "name": "message",
12161
- "type": {
12162
- "text": "string"
12163
- }
12164
- }
12165
- ],
12166
- "description": "Sets a custom validation message. Pass an empty string to restore validity."
12167
12251
  }
12168
12252
  ],
12169
12253
  "events": [
@@ -12172,71 +12256,29 @@
12172
12256
  "name": "flow-ui-blur",
12173
12257
  "reactName": "onFlowUiBlur"
12174
12258
  },
12175
- {
12176
- "description": "Emitted when an alteration to the control's value is committed by the user.",
12177
- "name": "flow-ui-change",
12178
- "reactName": "onFlowUiChange"
12179
- },
12180
12259
  {
12181
12260
  "description": "Emitted when the control gains focus.",
12182
12261
  "name": "flow-ui-focus",
12183
12262
  "reactName": "onFlowUiFocus"
12184
- },
12185
- {
12186
- "description": "Emitted when the control receives input.",
12187
- "name": "flow-ui-input",
12188
- "reactName": "onFlowUiInput"
12189
- },
12190
- {
12191
- "description": "Emitted when the form control has been checked for validity and its constraints aren't satisfied.",
12192
- "name": "flow-ui-invalid",
12193
- "reactName": "onFlowUiInvalid"
12194
12263
  }
12195
12264
  ],
12196
12265
  "attributes": [
12197
- {
12198
- "name": "title",
12199
- "type": {
12200
- "text": "string"
12201
- },
12202
- "default": "''",
12203
- "fieldName": "title"
12204
- },
12205
- {
12206
- "name": "name",
12207
- "type": {
12208
- "text": "string"
12209
- },
12210
- "default": "''",
12211
- "description": "The name of the range, submitted as a name/value pair with form data.",
12212
- "fieldName": "name"
12213
- },
12214
12266
  {
12215
12267
  "name": "value",
12216
- "type": {
12217
- "text": "number"
12218
- },
12219
- "default": "0",
12220
- "description": "The current value of the range, submitted as a name/value pair with form data.",
12221
- "fieldName": "value"
12222
- },
12223
- {
12224
- "name": "label",
12225
12268
  "type": {
12226
12269
  "text": "string"
12227
12270
  },
12228
- "default": "''",
12229
- "description": "The range's label. If you need to display HTML, use the `label` slot instead.",
12230
- "fieldName": "label"
12271
+ "description": "The radio's value. When selected, the radio group will receive this value.",
12272
+ "fieldName": "value"
12231
12273
  },
12232
12274
  {
12233
- "name": "help-text",
12275
+ "name": "size",
12234
12276
  "type": {
12235
- "text": "string"
12277
+ "text": "'small' | 'medium' | 'large'"
12236
12278
  },
12237
- "default": "''",
12238
- "description": "The range's help text. If you need to display HTML, use the help-text slot instead.",
12239
- "fieldName": "helpText"
12279
+ "default": "'medium'",
12280
+ "description": "The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this\nattribute can typically be omitted.",
12281
+ "fieldName": "size"
12240
12282
  },
12241
12283
  {
12242
12284
  "name": "disabled",
@@ -12244,64 +12286,22 @@
12244
12286
  "text": "boolean"
12245
12287
  },
12246
12288
  "default": "false",
12247
- "description": "Disables the range.",
12289
+ "description": "Disables the radio.",
12248
12290
  "fieldName": "disabled"
12249
- },
12250
- {
12251
- "name": "min",
12252
- "type": {
12253
- "text": "number"
12254
- },
12255
- "default": "0",
12256
- "description": "The minimum acceptable value of the range.",
12257
- "fieldName": "min"
12258
- },
12259
- {
12260
- "name": "max",
12261
- "type": {
12262
- "text": "number"
12263
- },
12264
- "default": "100",
12265
- "description": "The maximum acceptable value of the range.",
12266
- "fieldName": "max"
12267
- },
12268
- {
12269
- "name": "step",
12270
- "type": {
12271
- "text": "number"
12272
- },
12273
- "default": "1",
12274
- "description": "The interval at which the range will increase and decrease.",
12275
- "fieldName": "step"
12276
- },
12277
- {
12278
- "name": "tooltip",
12279
- "type": {
12280
- "text": "'top' | 'bottom' | 'none'"
12281
- },
12282
- "default": "'top'",
12283
- "description": "The preferred placement of the range's tooltip.",
12284
- "fieldName": "tooltip"
12285
- },
12286
- {
12287
- "name": "form",
12288
- "type": {
12289
- "text": "string"
12290
- },
12291
- "default": "''",
12292
- "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
12293
- "fieldName": "form"
12294
12291
  }
12295
12292
  ],
12296
12293
  "superclass": {
12297
12294
  "name": "FlowRdfElement",
12298
12295
  "module": "/src/internal/flow-ui-rdf-element"
12299
12296
  },
12300
- "summary": "Ranges allow the user to select a single value within a given range using a slider.",
12301
- "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/range",
12297
+ "summary": "Radios allow the user to select a single option from a group.",
12298
+ "documentation": "https://developer.emu-analytics.net/docs/flow-ui-rdf/components/radio",
12302
12299
  "status": "stable",
12303
12300
  "since": "2.0",
12304
- "tagName": "flow-ui-range",
12301
+ "dependencies": [
12302
+ "flow-ui-icon"
12303
+ ],
12304
+ "tagName": "flow-ui-radio",
12305
12305
  "customElement": true
12306
12306
  }
12307
12307
  ],
@@ -12310,16 +12310,16 @@
12310
12310
  "kind": "js",
12311
12311
  "name": "default",
12312
12312
  "declaration": {
12313
- "name": "FlowRange",
12314
- "module": "components/range/range.js"
12313
+ "name": "FlowRadio",
12314
+ "module": "components/radio/radio.js"
12315
12315
  }
12316
12316
  },
12317
12317
  {
12318
12318
  "kind": "custom-element-definition",
12319
- "name": "flow-ui-range",
12319
+ "name": "flow-ui-radio",
12320
12320
  "declaration": {
12321
- "name": "FlowRange",
12322
- "module": "components/range/range.js"
12321
+ "name": "FlowRadio",
12322
+ "module": "components/radio/radio.js"
12323
12323
  }
12324
12324
  }
12325
12325
  ]
@@ -20267,6 +20267,6 @@
20267
20267
  ],
20268
20268
  "package": {
20269
20269
  "name": "@emuanalytics/flow-rdf-ui",
20270
- "version": "0.0.18-alpha.18"
20270
+ "version": "0.0.18-alpha.20"
20271
20271
  }
20272
20272
  }