@momentum-design/components 0.122.7 → 0.122.8
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.
- package/dist/custom-elements.json +411 -411
- package/dist/react/index.d.ts +3 -3
- package/dist/react/index.js +3 -3
- package/package.json +1 -1
|
@@ -513,6 +513,157 @@
|
|
|
513
513
|
}
|
|
514
514
|
]
|
|
515
515
|
},
|
|
516
|
+
{
|
|
517
|
+
"kind": "javascript-module",
|
|
518
|
+
"path": "components/accordiongroup/accordiongroup.component.js",
|
|
519
|
+
"declarations": [
|
|
520
|
+
{
|
|
521
|
+
"kind": "class",
|
|
522
|
+
"description": "An accordion group is a vertically stacked set of interactive headings that each contain a header and body content.\nEach heading of the accordion acts as a control that enable users to expand or hide their associated body sections of content.\nAccordions are commonly used to reduce the need to scroll when presenting multiple sections of content on a single page.\n\n- Default Slot: The accordion group component only accepts, `accordion` and `accordionbutton` components as the children, rest are ignored.\n\nThere are three types of variants:\n- Stacked - Each accordion will have a gap of 1.5rem (24px).\n- Borderless - Each accordion will not have any border and the group will also not have any border.\n- Contained - Each accordion will have no gap in between them and the border of the entire accordiongroup will be continuous.\n\nThere are two types of sizes:\n- Small: Small size has a padding of 1rem (16px) for both heading and body sections.\n- Large: Large size has a padding of 1.5rem (24px) for both heading and body sections.\n\nThe variant and size will be applied to all accordions inside this accordion group.\nTo show/expand more than one accordion at any given time, then set `allow-multiple` to `true`. By default, it's `false`.\n\nIf you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n\nIf the first accordion of the accordion group is expanded by default, then the screen reader might loose focus when toggling the visibilty of the first accordion.",
|
|
523
|
+
"name": "AccordionGroup",
|
|
524
|
+
"cssProperties": [
|
|
525
|
+
{
|
|
526
|
+
"description": "The border color of the entire accordiongroup",
|
|
527
|
+
"name": "--mdc-accordiongroup-border-color"
|
|
528
|
+
}
|
|
529
|
+
],
|
|
530
|
+
"slots": [
|
|
531
|
+
{
|
|
532
|
+
"description": "The default slot can contain the `accordion` or `accordionbutton` components.",
|
|
533
|
+
"name": "default"
|
|
534
|
+
}
|
|
535
|
+
],
|
|
536
|
+
"members": [
|
|
537
|
+
{
|
|
538
|
+
"kind": "field",
|
|
539
|
+
"name": "size",
|
|
540
|
+
"type": {
|
|
541
|
+
"text": "Size"
|
|
542
|
+
},
|
|
543
|
+
"description": "The size of the accordion item.",
|
|
544
|
+
"default": "'small'",
|
|
545
|
+
"attribute": "size",
|
|
546
|
+
"reflects": true
|
|
547
|
+
},
|
|
548
|
+
{
|
|
549
|
+
"kind": "field",
|
|
550
|
+
"name": "variant",
|
|
551
|
+
"type": {
|
|
552
|
+
"text": "Variant"
|
|
553
|
+
},
|
|
554
|
+
"description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
|
|
555
|
+
"default": "'stacked'",
|
|
556
|
+
"attribute": "variant",
|
|
557
|
+
"reflects": true
|
|
558
|
+
},
|
|
559
|
+
{
|
|
560
|
+
"kind": "field",
|
|
561
|
+
"name": "allowMultiple",
|
|
562
|
+
"type": {
|
|
563
|
+
"text": "boolean"
|
|
564
|
+
},
|
|
565
|
+
"default": "false",
|
|
566
|
+
"description": "If true, multiple accordion items can be visible at the same time.",
|
|
567
|
+
"attribute": "allow-multiple",
|
|
568
|
+
"reflects": true
|
|
569
|
+
},
|
|
570
|
+
{
|
|
571
|
+
"kind": "method",
|
|
572
|
+
"name": "handleAccordionExpanded",
|
|
573
|
+
"privacy": "private",
|
|
574
|
+
"return": {
|
|
575
|
+
"type": {
|
|
576
|
+
"text": "void"
|
|
577
|
+
}
|
|
578
|
+
},
|
|
579
|
+
"parameters": [
|
|
580
|
+
{
|
|
581
|
+
"name": "event",
|
|
582
|
+
"type": {
|
|
583
|
+
"text": "Event"
|
|
584
|
+
},
|
|
585
|
+
"description": "The event object from the 'shown' event."
|
|
586
|
+
}
|
|
587
|
+
],
|
|
588
|
+
"description": "Handles the 'shown' event for accordion items.\nIf `allowMultiple` is false, ensures that only one accordion item\nremains expanded by collapsing all other expanded items when a new item is expanded."
|
|
589
|
+
},
|
|
590
|
+
{
|
|
591
|
+
"kind": "method",
|
|
592
|
+
"name": "setChildrenAccordionAttributes",
|
|
593
|
+
"privacy": "private",
|
|
594
|
+
"return": {
|
|
595
|
+
"type": {
|
|
596
|
+
"text": "void"
|
|
597
|
+
}
|
|
598
|
+
},
|
|
599
|
+
"parameters": [
|
|
600
|
+
{
|
|
601
|
+
"name": "attributeName",
|
|
602
|
+
"type": {
|
|
603
|
+
"text": "string"
|
|
604
|
+
},
|
|
605
|
+
"description": "The name of the attribute to set."
|
|
606
|
+
},
|
|
607
|
+
{
|
|
608
|
+
"name": "attributeValue",
|
|
609
|
+
"type": {
|
|
610
|
+
"text": "string"
|
|
611
|
+
},
|
|
612
|
+
"description": "The value to set the attribute to."
|
|
613
|
+
}
|
|
614
|
+
],
|
|
615
|
+
"description": "Sets the given attribute on all child accordion or accordionbutton components."
|
|
616
|
+
}
|
|
617
|
+
],
|
|
618
|
+
"attributes": [
|
|
619
|
+
{
|
|
620
|
+
"name": "size",
|
|
621
|
+
"type": {
|
|
622
|
+
"text": "Size"
|
|
623
|
+
},
|
|
624
|
+
"description": "The size of the accordion item.",
|
|
625
|
+
"default": "'small'",
|
|
626
|
+
"fieldName": "size"
|
|
627
|
+
},
|
|
628
|
+
{
|
|
629
|
+
"name": "variant",
|
|
630
|
+
"type": {
|
|
631
|
+
"text": "Variant"
|
|
632
|
+
},
|
|
633
|
+
"description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
|
|
634
|
+
"default": "'stacked'",
|
|
635
|
+
"fieldName": "variant"
|
|
636
|
+
},
|
|
637
|
+
{
|
|
638
|
+
"name": "allow-multiple",
|
|
639
|
+
"type": {
|
|
640
|
+
"text": "boolean"
|
|
641
|
+
},
|
|
642
|
+
"default": "false",
|
|
643
|
+
"description": "If true, multiple accordion items can be visible at the same time.",
|
|
644
|
+
"fieldName": "allowMultiple"
|
|
645
|
+
}
|
|
646
|
+
],
|
|
647
|
+
"superclass": {
|
|
648
|
+
"name": "Component",
|
|
649
|
+
"module": "/src/models"
|
|
650
|
+
},
|
|
651
|
+
"tagName": "mdc-accordiongroup",
|
|
652
|
+
"jsDoc": "/**\n * An accordion group is a vertically stacked set of interactive headings that each contain a header and body content.\n * Each heading of the accordion acts as a control that enable users to expand or hide their associated body sections of content.\n * Accordions are commonly used to reduce the need to scroll when presenting multiple sections of content on a single page.\n *\n * - Default Slot: The accordion group component only accepts, `accordion` and `accordionbutton` components as the children, rest are ignored.\n *\n * There are three types of variants:\n * - Stacked - Each accordion will have a gap of 1.5rem (24px).\n * - Borderless - Each accordion will not have any border and the group will also not have any border.\n * - Contained - Each accordion will have no gap in between them and the border of the entire accordiongroup will be continuous.\n *\n * There are two types of sizes:\n * - Small: Small size has a padding of 1rem (16px) for both heading and body sections.\n * - Large: Large size has a padding of 1.5rem (24px) for both heading and body sections.\n *\n * The variant and size will be applied to all accordions inside this accordion group.\n * To show/expand more than one accordion at any given time, then set `allow-multiple` to `true`. By default, it's `false`.\n *\n * If you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n *\n * If the first accordion of the accordion group is expanded by default, then the screen reader might loose focus when toggling the visibilty of the first accordion.\n *\n * @tagname mdc-accordiongroup\n *\n * @slot default - The default slot can contain the `accordion` or `accordionbutton` components.\n *\n * @cssproperty --mdc-accordiongroup-border-color - The border color of the entire accordiongroup\n */",
|
|
653
|
+
"customElement": true
|
|
654
|
+
}
|
|
655
|
+
],
|
|
656
|
+
"exports": [
|
|
657
|
+
{
|
|
658
|
+
"kind": "js",
|
|
659
|
+
"name": "default",
|
|
660
|
+
"declaration": {
|
|
661
|
+
"name": "AccordionGroup",
|
|
662
|
+
"module": "components/accordiongroup/accordiongroup.component.js"
|
|
663
|
+
}
|
|
664
|
+
}
|
|
665
|
+
]
|
|
666
|
+
},
|
|
516
667
|
{
|
|
517
668
|
"kind": "javascript-module",
|
|
518
669
|
"path": "components/accordionbutton/accordionbutton.component.js",
|
|
@@ -853,157 +1004,6 @@
|
|
|
853
1004
|
}
|
|
854
1005
|
]
|
|
855
1006
|
},
|
|
856
|
-
{
|
|
857
|
-
"kind": "javascript-module",
|
|
858
|
-
"path": "components/accordiongroup/accordiongroup.component.js",
|
|
859
|
-
"declarations": [
|
|
860
|
-
{
|
|
861
|
-
"kind": "class",
|
|
862
|
-
"description": "An accordion group is a vertically stacked set of interactive headings that each contain a header and body content.\nEach heading of the accordion acts as a control that enable users to expand or hide their associated body sections of content.\nAccordions are commonly used to reduce the need to scroll when presenting multiple sections of content on a single page.\n\n- Default Slot: The accordion group component only accepts, `accordion` and `accordionbutton` components as the children, rest are ignored.\n\nThere are three types of variants:\n- Stacked - Each accordion will have a gap of 1.5rem (24px).\n- Borderless - Each accordion will not have any border and the group will also not have any border.\n- Contained - Each accordion will have no gap in between them and the border of the entire accordiongroup will be continuous.\n\nThere are two types of sizes:\n- Small: Small size has a padding of 1rem (16px) for both heading and body sections.\n- Large: Large size has a padding of 1.5rem (24px) for both heading and body sections.\n\nThe variant and size will be applied to all accordions inside this accordion group.\nTo show/expand more than one accordion at any given time, then set `allow-multiple` to `true`. By default, it's `false`.\n\nIf you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n\nIf the first accordion of the accordion group is expanded by default, then the screen reader might loose focus when toggling the visibilty of the first accordion.",
|
|
863
|
-
"name": "AccordionGroup",
|
|
864
|
-
"cssProperties": [
|
|
865
|
-
{
|
|
866
|
-
"description": "The border color of the entire accordiongroup",
|
|
867
|
-
"name": "--mdc-accordiongroup-border-color"
|
|
868
|
-
}
|
|
869
|
-
],
|
|
870
|
-
"slots": [
|
|
871
|
-
{
|
|
872
|
-
"description": "The default slot can contain the `accordion` or `accordionbutton` components.",
|
|
873
|
-
"name": "default"
|
|
874
|
-
}
|
|
875
|
-
],
|
|
876
|
-
"members": [
|
|
877
|
-
{
|
|
878
|
-
"kind": "field",
|
|
879
|
-
"name": "size",
|
|
880
|
-
"type": {
|
|
881
|
-
"text": "Size"
|
|
882
|
-
},
|
|
883
|
-
"description": "The size of the accordion item.",
|
|
884
|
-
"default": "'small'",
|
|
885
|
-
"attribute": "size",
|
|
886
|
-
"reflects": true
|
|
887
|
-
},
|
|
888
|
-
{
|
|
889
|
-
"kind": "field",
|
|
890
|
-
"name": "variant",
|
|
891
|
-
"type": {
|
|
892
|
-
"text": "Variant"
|
|
893
|
-
},
|
|
894
|
-
"description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
|
|
895
|
-
"default": "'stacked'",
|
|
896
|
-
"attribute": "variant",
|
|
897
|
-
"reflects": true
|
|
898
|
-
},
|
|
899
|
-
{
|
|
900
|
-
"kind": "field",
|
|
901
|
-
"name": "allowMultiple",
|
|
902
|
-
"type": {
|
|
903
|
-
"text": "boolean"
|
|
904
|
-
},
|
|
905
|
-
"default": "false",
|
|
906
|
-
"description": "If true, multiple accordion items can be visible at the same time.",
|
|
907
|
-
"attribute": "allow-multiple",
|
|
908
|
-
"reflects": true
|
|
909
|
-
},
|
|
910
|
-
{
|
|
911
|
-
"kind": "method",
|
|
912
|
-
"name": "handleAccordionExpanded",
|
|
913
|
-
"privacy": "private",
|
|
914
|
-
"return": {
|
|
915
|
-
"type": {
|
|
916
|
-
"text": "void"
|
|
917
|
-
}
|
|
918
|
-
},
|
|
919
|
-
"parameters": [
|
|
920
|
-
{
|
|
921
|
-
"name": "event",
|
|
922
|
-
"type": {
|
|
923
|
-
"text": "Event"
|
|
924
|
-
},
|
|
925
|
-
"description": "The event object from the 'shown' event."
|
|
926
|
-
}
|
|
927
|
-
],
|
|
928
|
-
"description": "Handles the 'shown' event for accordion items.\nIf `allowMultiple` is false, ensures that only one accordion item\nremains expanded by collapsing all other expanded items when a new item is expanded."
|
|
929
|
-
},
|
|
930
|
-
{
|
|
931
|
-
"kind": "method",
|
|
932
|
-
"name": "setChildrenAccordionAttributes",
|
|
933
|
-
"privacy": "private",
|
|
934
|
-
"return": {
|
|
935
|
-
"type": {
|
|
936
|
-
"text": "void"
|
|
937
|
-
}
|
|
938
|
-
},
|
|
939
|
-
"parameters": [
|
|
940
|
-
{
|
|
941
|
-
"name": "attributeName",
|
|
942
|
-
"type": {
|
|
943
|
-
"text": "string"
|
|
944
|
-
},
|
|
945
|
-
"description": "The name of the attribute to set."
|
|
946
|
-
},
|
|
947
|
-
{
|
|
948
|
-
"name": "attributeValue",
|
|
949
|
-
"type": {
|
|
950
|
-
"text": "string"
|
|
951
|
-
},
|
|
952
|
-
"description": "The value to set the attribute to."
|
|
953
|
-
}
|
|
954
|
-
],
|
|
955
|
-
"description": "Sets the given attribute on all child accordion or accordionbutton components."
|
|
956
|
-
}
|
|
957
|
-
],
|
|
958
|
-
"attributes": [
|
|
959
|
-
{
|
|
960
|
-
"name": "size",
|
|
961
|
-
"type": {
|
|
962
|
-
"text": "Size"
|
|
963
|
-
},
|
|
964
|
-
"description": "The size of the accordion item.",
|
|
965
|
-
"default": "'small'",
|
|
966
|
-
"fieldName": "size"
|
|
967
|
-
},
|
|
968
|
-
{
|
|
969
|
-
"name": "variant",
|
|
970
|
-
"type": {
|
|
971
|
-
"text": "Variant"
|
|
972
|
-
},
|
|
973
|
-
"description": "The variant of the accordion item. Based on the variant, the styling of the accordion gets changed.",
|
|
974
|
-
"default": "'stacked'",
|
|
975
|
-
"fieldName": "variant"
|
|
976
|
-
},
|
|
977
|
-
{
|
|
978
|
-
"name": "allow-multiple",
|
|
979
|
-
"type": {
|
|
980
|
-
"text": "boolean"
|
|
981
|
-
},
|
|
982
|
-
"default": "false",
|
|
983
|
-
"description": "If true, multiple accordion items can be visible at the same time.",
|
|
984
|
-
"fieldName": "allowMultiple"
|
|
985
|
-
}
|
|
986
|
-
],
|
|
987
|
-
"superclass": {
|
|
988
|
-
"name": "Component",
|
|
989
|
-
"module": "/src/models"
|
|
990
|
-
},
|
|
991
|
-
"tagName": "mdc-accordiongroup",
|
|
992
|
-
"jsDoc": "/**\n * An accordion group is a vertically stacked set of interactive headings that each contain a header and body content.\n * Each heading of the accordion acts as a control that enable users to expand or hide their associated body sections of content.\n * Accordions are commonly used to reduce the need to scroll when presenting multiple sections of content on a single page.\n *\n * - Default Slot: The accordion group component only accepts, `accordion` and `accordionbutton` components as the children, rest are ignored.\n *\n * There are three types of variants:\n * - Stacked - Each accordion will have a gap of 1.5rem (24px).\n * - Borderless - Each accordion will not have any border and the group will also not have any border.\n * - Contained - Each accordion will have no gap in between them and the border of the entire accordiongroup will be continuous.\n *\n * There are two types of sizes:\n * - Small: Small size has a padding of 1rem (16px) for both heading and body sections.\n * - Large: Large size has a padding of 1.5rem (24px) for both heading and body sections.\n *\n * The variant and size will be applied to all accordions inside this accordion group.\n * To show/expand more than one accordion at any given time, then set `allow-multiple` to `true`. By default, it's `false`.\n *\n * If you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n *\n * If the first accordion of the accordion group is expanded by default, then the screen reader might loose focus when toggling the visibilty of the first accordion.\n *\n * @tagname mdc-accordiongroup\n *\n * @slot default - The default slot can contain the `accordion` or `accordionbutton` components.\n *\n * @cssproperty --mdc-accordiongroup-border-color - The border color of the entire accordiongroup\n */",
|
|
993
|
-
"customElement": true
|
|
994
|
-
}
|
|
995
|
-
],
|
|
996
|
-
"exports": [
|
|
997
|
-
{
|
|
998
|
-
"kind": "js",
|
|
999
|
-
"name": "default",
|
|
1000
|
-
"declaration": {
|
|
1001
|
-
"name": "AccordionGroup",
|
|
1002
|
-
"module": "components/accordiongroup/accordiongroup.component.js"
|
|
1003
|
-
}
|
|
1004
|
-
}
|
|
1005
|
-
]
|
|
1006
|
-
},
|
|
1007
1007
|
{
|
|
1008
1008
|
"kind": "javascript-module",
|
|
1009
1009
|
"path": "components/alertchip/alertchip.component.js",
|
|
@@ -4798,6 +4798,182 @@
|
|
|
4798
4798
|
}
|
|
4799
4799
|
]
|
|
4800
4800
|
},
|
|
4801
|
+
{
|
|
4802
|
+
"kind": "javascript-module",
|
|
4803
|
+
"path": "components/brandvisual/brandvisual.component.js",
|
|
4804
|
+
"declarations": [
|
|
4805
|
+
{
|
|
4806
|
+
"kind": "class",
|
|
4807
|
+
"description": "The `mdc-brandvisual` component is responsible for rendering logos dynamically & ensures they are\ndisplayed correctly within applications.\n\nFeatures:\n- Dynamically loads brandvisuals based on the `name` attribute.\n- Emits a `load` event when the brandvisual is successfully fetched.\n- Emits an `error` event when the brandvisual import fails.\n- Supports accessibility best practices.\n- Used for brand representation within the design system.",
|
|
4808
|
+
"name": "Brandvisual",
|
|
4809
|
+
"members": [
|
|
4810
|
+
{
|
|
4811
|
+
"kind": "field",
|
|
4812
|
+
"name": "brandVisualData",
|
|
4813
|
+
"type": {
|
|
4814
|
+
"text": "Element | TemplateResult | undefined"
|
|
4815
|
+
},
|
|
4816
|
+
"privacy": "private"
|
|
4817
|
+
},
|
|
4818
|
+
{
|
|
4819
|
+
"kind": "field",
|
|
4820
|
+
"name": "name",
|
|
4821
|
+
"type": {
|
|
4822
|
+
"text": "BrandVisualNames | undefined"
|
|
4823
|
+
},
|
|
4824
|
+
"description": "Name of the brandVisual (= filename)",
|
|
4825
|
+
"attribute": "name",
|
|
4826
|
+
"reflects": true
|
|
4827
|
+
},
|
|
4828
|
+
{
|
|
4829
|
+
"kind": "field",
|
|
4830
|
+
"name": "altText",
|
|
4831
|
+
"type": {
|
|
4832
|
+
"text": "string | undefined"
|
|
4833
|
+
},
|
|
4834
|
+
"description": "Alt text for the brandvisual image for accessibility.\nThis will only be set if the brandvisual is an image (png).",
|
|
4835
|
+
"attribute": "altText",
|
|
4836
|
+
"reflects": true
|
|
4837
|
+
},
|
|
4838
|
+
{
|
|
4839
|
+
"kind": "method",
|
|
4840
|
+
"name": "getBrandVisualData",
|
|
4841
|
+
"privacy": "private"
|
|
4842
|
+
},
|
|
4843
|
+
{
|
|
4844
|
+
"kind": "method",
|
|
4845
|
+
"name": "injectTemplateAttributes",
|
|
4846
|
+
"privacy": "private",
|
|
4847
|
+
"return": {
|
|
4848
|
+
"type": {
|
|
4849
|
+
"text": "Element | TemplateResult"
|
|
4850
|
+
}
|
|
4851
|
+
},
|
|
4852
|
+
"parameters": [
|
|
4853
|
+
{
|
|
4854
|
+
"name": "litTemplate",
|
|
4855
|
+
"type": {
|
|
4856
|
+
"text": "TemplateResult"
|
|
4857
|
+
}
|
|
4858
|
+
},
|
|
4859
|
+
{
|
|
4860
|
+
"name": "tag",
|
|
4861
|
+
"type": {
|
|
4862
|
+
"text": "string"
|
|
4863
|
+
}
|
|
4864
|
+
},
|
|
4865
|
+
{
|
|
4866
|
+
"name": "props",
|
|
4867
|
+
"type": {
|
|
4868
|
+
"text": "any"
|
|
4869
|
+
}
|
|
4870
|
+
}
|
|
4871
|
+
]
|
|
4872
|
+
},
|
|
4873
|
+
{
|
|
4874
|
+
"kind": "method",
|
|
4875
|
+
"name": "injectHtmlAttributes",
|
|
4876
|
+
"privacy": "private",
|
|
4877
|
+
"return": {
|
|
4878
|
+
"type": {
|
|
4879
|
+
"text": "Element"
|
|
4880
|
+
}
|
|
4881
|
+
},
|
|
4882
|
+
"parameters": [
|
|
4883
|
+
{
|
|
4884
|
+
"name": "html",
|
|
4885
|
+
"type": {
|
|
4886
|
+
"text": "Element"
|
|
4887
|
+
}
|
|
4888
|
+
},
|
|
4889
|
+
{
|
|
4890
|
+
"name": "props",
|
|
4891
|
+
"type": {
|
|
4892
|
+
"text": "imageProps"
|
|
4893
|
+
}
|
|
4894
|
+
}
|
|
4895
|
+
]
|
|
4896
|
+
},
|
|
4897
|
+
{
|
|
4898
|
+
"kind": "method",
|
|
4899
|
+
"name": "handleBrandVisualLoadedSuccess",
|
|
4900
|
+
"privacy": "private",
|
|
4901
|
+
"parameters": [
|
|
4902
|
+
{
|
|
4903
|
+
"name": "brandVisualHtml",
|
|
4904
|
+
"type": {
|
|
4905
|
+
"text": "TemplateResult"
|
|
4906
|
+
},
|
|
4907
|
+
"description": "The brandvisual html element which has been fetched from the brandvisual provider."
|
|
4908
|
+
}
|
|
4909
|
+
],
|
|
4910
|
+
"description": "Sets the brandVisualData state to the fetched brandvisual.\nDispatches a 'load' event on the component once the brandvisual has been successfully loaded."
|
|
4911
|
+
},
|
|
4912
|
+
{
|
|
4913
|
+
"kind": "method",
|
|
4914
|
+
"name": "handleBrandVisualLoadedFailure",
|
|
4915
|
+
"privacy": "private",
|
|
4916
|
+
"parameters": [
|
|
4917
|
+
{
|
|
4918
|
+
"name": "error",
|
|
4919
|
+
"type": {
|
|
4920
|
+
"text": "unknown"
|
|
4921
|
+
}
|
|
4922
|
+
}
|
|
4923
|
+
],
|
|
4924
|
+
"description": "Dispatches an 'error' event on the component when the brandvisual import has failed.\nThis event bubbles and is cancelable.\nThe error detail is set to the error object."
|
|
4925
|
+
}
|
|
4926
|
+
],
|
|
4927
|
+
"events": [
|
|
4928
|
+
{
|
|
4929
|
+
"description": "(React: onLoad) This event is dispatched when the brandvisual has been successfully loaded.",
|
|
4930
|
+
"name": "load",
|
|
4931
|
+
"reactName": "onLoad"
|
|
4932
|
+
},
|
|
4933
|
+
{
|
|
4934
|
+
"description": "(React: onError) This event is dispatched when the brandvisual fetching has failed.",
|
|
4935
|
+
"name": "error",
|
|
4936
|
+
"reactName": "onError"
|
|
4937
|
+
}
|
|
4938
|
+
],
|
|
4939
|
+
"attributes": [
|
|
4940
|
+
{
|
|
4941
|
+
"name": "name",
|
|
4942
|
+
"type": {
|
|
4943
|
+
"text": "BrandVisualNames | undefined"
|
|
4944
|
+
},
|
|
4945
|
+
"description": "Name of the brandVisual (= filename)",
|
|
4946
|
+
"fieldName": "name"
|
|
4947
|
+
},
|
|
4948
|
+
{
|
|
4949
|
+
"name": "altText",
|
|
4950
|
+
"type": {
|
|
4951
|
+
"text": "string | undefined"
|
|
4952
|
+
},
|
|
4953
|
+
"description": "Alt text for the brandvisual image for accessibility.\nThis will only be set if the brandvisual is an image (png).",
|
|
4954
|
+
"fieldName": "altText"
|
|
4955
|
+
}
|
|
4956
|
+
],
|
|
4957
|
+
"superclass": {
|
|
4958
|
+
"name": "Component",
|
|
4959
|
+
"module": "/src/models"
|
|
4960
|
+
},
|
|
4961
|
+
"tagName": "mdc-brandvisual",
|
|
4962
|
+
"jsDoc": "/**\n * The `mdc-brandvisual` component is responsible for rendering logos dynamically & ensures they are\n * displayed correctly within applications.\n *\n * Features:\n * - Dynamically loads brandvisuals based on the `name` attribute.\n * - Emits a `load` event when the brandvisual is successfully fetched.\n * - Emits an `error` event when the brandvisual import fails.\n * - Supports accessibility best practices.\n * - Used for brand representation within the design system.\n *\n * @tagname mdc-brandvisual\n *\n * @event load - (React: onLoad) This event is dispatched when the brandvisual has been successfully loaded.\n * @event error - (React: onError) This event is dispatched when the brandvisual fetching has failed.\n *\n */",
|
|
4963
|
+
"customElement": true
|
|
4964
|
+
}
|
|
4965
|
+
],
|
|
4966
|
+
"exports": [
|
|
4967
|
+
{
|
|
4968
|
+
"kind": "js",
|
|
4969
|
+
"name": "default",
|
|
4970
|
+
"declaration": {
|
|
4971
|
+
"name": "Brandvisual",
|
|
4972
|
+
"module": "components/brandvisual/brandvisual.component.js"
|
|
4973
|
+
}
|
|
4974
|
+
}
|
|
4975
|
+
]
|
|
4976
|
+
},
|
|
4801
4977
|
{
|
|
4802
4978
|
"kind": "javascript-module",
|
|
4803
4979
|
"path": "components/bullet/bullet.component.js",
|
|
@@ -5822,182 +5998,6 @@
|
|
|
5822
5998
|
}
|
|
5823
5999
|
]
|
|
5824
6000
|
},
|
|
5825
|
-
{
|
|
5826
|
-
"kind": "javascript-module",
|
|
5827
|
-
"path": "components/brandvisual/brandvisual.component.js",
|
|
5828
|
-
"declarations": [
|
|
5829
|
-
{
|
|
5830
|
-
"kind": "class",
|
|
5831
|
-
"description": "The `mdc-brandvisual` component is responsible for rendering logos dynamically & ensures they are\ndisplayed correctly within applications.\n\nFeatures:\n- Dynamically loads brandvisuals based on the `name` attribute.\n- Emits a `load` event when the brandvisual is successfully fetched.\n- Emits an `error` event when the brandvisual import fails.\n- Supports accessibility best practices.\n- Used for brand representation within the design system.",
|
|
5832
|
-
"name": "Brandvisual",
|
|
5833
|
-
"members": [
|
|
5834
|
-
{
|
|
5835
|
-
"kind": "field",
|
|
5836
|
-
"name": "brandVisualData",
|
|
5837
|
-
"type": {
|
|
5838
|
-
"text": "Element | TemplateResult | undefined"
|
|
5839
|
-
},
|
|
5840
|
-
"privacy": "private"
|
|
5841
|
-
},
|
|
5842
|
-
{
|
|
5843
|
-
"kind": "field",
|
|
5844
|
-
"name": "name",
|
|
5845
|
-
"type": {
|
|
5846
|
-
"text": "BrandVisualNames | undefined"
|
|
5847
|
-
},
|
|
5848
|
-
"description": "Name of the brandVisual (= filename)",
|
|
5849
|
-
"attribute": "name",
|
|
5850
|
-
"reflects": true
|
|
5851
|
-
},
|
|
5852
|
-
{
|
|
5853
|
-
"kind": "field",
|
|
5854
|
-
"name": "altText",
|
|
5855
|
-
"type": {
|
|
5856
|
-
"text": "string | undefined"
|
|
5857
|
-
},
|
|
5858
|
-
"description": "Alt text for the brandvisual image for accessibility.\nThis will only be set if the brandvisual is an image (png).",
|
|
5859
|
-
"attribute": "altText",
|
|
5860
|
-
"reflects": true
|
|
5861
|
-
},
|
|
5862
|
-
{
|
|
5863
|
-
"kind": "method",
|
|
5864
|
-
"name": "getBrandVisualData",
|
|
5865
|
-
"privacy": "private"
|
|
5866
|
-
},
|
|
5867
|
-
{
|
|
5868
|
-
"kind": "method",
|
|
5869
|
-
"name": "injectTemplateAttributes",
|
|
5870
|
-
"privacy": "private",
|
|
5871
|
-
"return": {
|
|
5872
|
-
"type": {
|
|
5873
|
-
"text": "Element | TemplateResult"
|
|
5874
|
-
}
|
|
5875
|
-
},
|
|
5876
|
-
"parameters": [
|
|
5877
|
-
{
|
|
5878
|
-
"name": "litTemplate",
|
|
5879
|
-
"type": {
|
|
5880
|
-
"text": "TemplateResult"
|
|
5881
|
-
}
|
|
5882
|
-
},
|
|
5883
|
-
{
|
|
5884
|
-
"name": "tag",
|
|
5885
|
-
"type": {
|
|
5886
|
-
"text": "string"
|
|
5887
|
-
}
|
|
5888
|
-
},
|
|
5889
|
-
{
|
|
5890
|
-
"name": "props",
|
|
5891
|
-
"type": {
|
|
5892
|
-
"text": "any"
|
|
5893
|
-
}
|
|
5894
|
-
}
|
|
5895
|
-
]
|
|
5896
|
-
},
|
|
5897
|
-
{
|
|
5898
|
-
"kind": "method",
|
|
5899
|
-
"name": "injectHtmlAttributes",
|
|
5900
|
-
"privacy": "private",
|
|
5901
|
-
"return": {
|
|
5902
|
-
"type": {
|
|
5903
|
-
"text": "Element"
|
|
5904
|
-
}
|
|
5905
|
-
},
|
|
5906
|
-
"parameters": [
|
|
5907
|
-
{
|
|
5908
|
-
"name": "html",
|
|
5909
|
-
"type": {
|
|
5910
|
-
"text": "Element"
|
|
5911
|
-
}
|
|
5912
|
-
},
|
|
5913
|
-
{
|
|
5914
|
-
"name": "props",
|
|
5915
|
-
"type": {
|
|
5916
|
-
"text": "imageProps"
|
|
5917
|
-
}
|
|
5918
|
-
}
|
|
5919
|
-
]
|
|
5920
|
-
},
|
|
5921
|
-
{
|
|
5922
|
-
"kind": "method",
|
|
5923
|
-
"name": "handleBrandVisualLoadedSuccess",
|
|
5924
|
-
"privacy": "private",
|
|
5925
|
-
"parameters": [
|
|
5926
|
-
{
|
|
5927
|
-
"name": "brandVisualHtml",
|
|
5928
|
-
"type": {
|
|
5929
|
-
"text": "TemplateResult"
|
|
5930
|
-
},
|
|
5931
|
-
"description": "The brandvisual html element which has been fetched from the brandvisual provider."
|
|
5932
|
-
}
|
|
5933
|
-
],
|
|
5934
|
-
"description": "Sets the brandVisualData state to the fetched brandvisual.\nDispatches a 'load' event on the component once the brandvisual has been successfully loaded."
|
|
5935
|
-
},
|
|
5936
|
-
{
|
|
5937
|
-
"kind": "method",
|
|
5938
|
-
"name": "handleBrandVisualLoadedFailure",
|
|
5939
|
-
"privacy": "private",
|
|
5940
|
-
"parameters": [
|
|
5941
|
-
{
|
|
5942
|
-
"name": "error",
|
|
5943
|
-
"type": {
|
|
5944
|
-
"text": "unknown"
|
|
5945
|
-
}
|
|
5946
|
-
}
|
|
5947
|
-
],
|
|
5948
|
-
"description": "Dispatches an 'error' event on the component when the brandvisual import has failed.\nThis event bubbles and is cancelable.\nThe error detail is set to the error object."
|
|
5949
|
-
}
|
|
5950
|
-
],
|
|
5951
|
-
"events": [
|
|
5952
|
-
{
|
|
5953
|
-
"description": "(React: onLoad) This event is dispatched when the brandvisual has been successfully loaded.",
|
|
5954
|
-
"name": "load",
|
|
5955
|
-
"reactName": "onLoad"
|
|
5956
|
-
},
|
|
5957
|
-
{
|
|
5958
|
-
"description": "(React: onError) This event is dispatched when the brandvisual fetching has failed.",
|
|
5959
|
-
"name": "error",
|
|
5960
|
-
"reactName": "onError"
|
|
5961
|
-
}
|
|
5962
|
-
],
|
|
5963
|
-
"attributes": [
|
|
5964
|
-
{
|
|
5965
|
-
"name": "name",
|
|
5966
|
-
"type": {
|
|
5967
|
-
"text": "BrandVisualNames | undefined"
|
|
5968
|
-
},
|
|
5969
|
-
"description": "Name of the brandVisual (= filename)",
|
|
5970
|
-
"fieldName": "name"
|
|
5971
|
-
},
|
|
5972
|
-
{
|
|
5973
|
-
"name": "altText",
|
|
5974
|
-
"type": {
|
|
5975
|
-
"text": "string | undefined"
|
|
5976
|
-
},
|
|
5977
|
-
"description": "Alt text for the brandvisual image for accessibility.\nThis will only be set if the brandvisual is an image (png).",
|
|
5978
|
-
"fieldName": "altText"
|
|
5979
|
-
}
|
|
5980
|
-
],
|
|
5981
|
-
"superclass": {
|
|
5982
|
-
"name": "Component",
|
|
5983
|
-
"module": "/src/models"
|
|
5984
|
-
},
|
|
5985
|
-
"tagName": "mdc-brandvisual",
|
|
5986
|
-
"jsDoc": "/**\n * The `mdc-brandvisual` component is responsible for rendering logos dynamically & ensures they are\n * displayed correctly within applications.\n *\n * Features:\n * - Dynamically loads brandvisuals based on the `name` attribute.\n * - Emits a `load` event when the brandvisual is successfully fetched.\n * - Emits an `error` event when the brandvisual import fails.\n * - Supports accessibility best practices.\n * - Used for brand representation within the design system.\n *\n * @tagname mdc-brandvisual\n *\n * @event load - (React: onLoad) This event is dispatched when the brandvisual has been successfully loaded.\n * @event error - (React: onError) This event is dispatched when the brandvisual fetching has failed.\n *\n */",
|
|
5987
|
-
"customElement": true
|
|
5988
|
-
}
|
|
5989
|
-
],
|
|
5990
|
-
"exports": [
|
|
5991
|
-
{
|
|
5992
|
-
"kind": "js",
|
|
5993
|
-
"name": "default",
|
|
5994
|
-
"declaration": {
|
|
5995
|
-
"name": "Brandvisual",
|
|
5996
|
-
"module": "components/brandvisual/brandvisual.component.js"
|
|
5997
|
-
}
|
|
5998
|
-
}
|
|
5999
|
-
]
|
|
6000
|
-
},
|
|
6001
6001
|
{
|
|
6002
6002
|
"kind": "javascript-module",
|
|
6003
6003
|
"path": "components/buttonlink/buttonlink.component.js",
|
|
@@ -45930,6 +45930,90 @@
|
|
|
45930
45930
|
}
|
|
45931
45931
|
]
|
|
45932
45932
|
},
|
|
45933
|
+
{
|
|
45934
|
+
"kind": "javascript-module",
|
|
45935
|
+
"path": "components/text/text.component.js",
|
|
45936
|
+
"declarations": [
|
|
45937
|
+
{
|
|
45938
|
+
"kind": "class",
|
|
45939
|
+
"description": "Text component for creating styled text elements.\nIt has to be mounted within the ThemeProvider to access color and font tokens.\n\nThe `type` attribute allows changing the text style.\nThe `tagname` attribute allows changing the tag name of the text element.\nThe default tag name is `p`.\n\nThe `tagname` attribute should be a valid HTML tag name.\nIf the `tagname` attribute is not a valid HTML tag name, the default tag name will be used.\n\nThe styling is applied based on the `type` attribute.",
|
|
45940
|
+
"name": "Text",
|
|
45941
|
+
"cssParts": [
|
|
45942
|
+
{
|
|
45943
|
+
"description": "The text element",
|
|
45944
|
+
"name": "text"
|
|
45945
|
+
}
|
|
45946
|
+
],
|
|
45947
|
+
"slots": [
|
|
45948
|
+
{
|
|
45949
|
+
"description": "Default slot for text content",
|
|
45950
|
+
"name": ""
|
|
45951
|
+
}
|
|
45952
|
+
],
|
|
45953
|
+
"members": [
|
|
45954
|
+
{
|
|
45955
|
+
"kind": "field",
|
|
45956
|
+
"name": "type",
|
|
45957
|
+
"type": {
|
|
45958
|
+
"text": "TextType"
|
|
45959
|
+
},
|
|
45960
|
+
"privacy": "public",
|
|
45961
|
+
"description": "Specifies the text style to be applied.\n\nAcceptable values include:\n\n- 'body-small-regular'\n- 'body-small-medium'\n- 'body-small-bold'\n- 'body-midsize-regular'\n- 'body-midsize-medium'\n- 'body-midsize-bold'\n- 'body-large-regular'\n- 'body-large-medium'\n- 'body-large-bold'\n- 'body-small-regular-underline'\n- 'body-small-medium-underline'\n- 'body-midsize-regular-underline'\n- 'body-midsize-medium-underline'\n- 'body-large-regular-underline'\n- 'body-large-medium-underline'\n- 'heading-small-regular'\n- 'heading-small-medium'\n- 'heading-small-bold'\n- 'heading-midsize-regular'\n- 'heading-midsize-medium'\n- 'heading-midsize-bold'\n- 'heading-large-regular'\n- 'heading-large-medium'\n- 'heading-large-bold'\n- 'heading-xlarge-regular'\n- 'heading-xlarge-medium'\n- 'heading-xlarge-bold'\n- 'headline-small-light'\n- 'headline-small-regular'",
|
|
45962
|
+
"default": "body-midsize-medium",
|
|
45963
|
+
"attribute": "type",
|
|
45964
|
+
"reflects": true
|
|
45965
|
+
},
|
|
45966
|
+
{
|
|
45967
|
+
"kind": "field",
|
|
45968
|
+
"name": "tagname",
|
|
45969
|
+
"type": {
|
|
45970
|
+
"text": "TagName | undefined"
|
|
45971
|
+
},
|
|
45972
|
+
"privacy": "public",
|
|
45973
|
+
"description": "Specifies the HTML tag name for the text element. The default tag name is `p`.\nThis attribute is optional. When set, it changes the tag name of the text element.\n\nAcceptable values include:\n\n- 'h1'\n- 'h2'\n- 'h3'\n- 'h4'\n- 'h5'\n- 'h6'\n- 'p'\n- 'small'\n- 'span'\n- 'div'\n\nFor instance, setting this attribute to `h2` will render the text element as an `h2` element.\nNote that the styling is determined by the `type` attribute.",
|
|
45974
|
+
"attribute": "tagname",
|
|
45975
|
+
"reflects": true
|
|
45976
|
+
}
|
|
45977
|
+
],
|
|
45978
|
+
"attributes": [
|
|
45979
|
+
{
|
|
45980
|
+
"name": "type",
|
|
45981
|
+
"type": {
|
|
45982
|
+
"text": "TextType"
|
|
45983
|
+
},
|
|
45984
|
+
"description": "Specifies the text style to be applied.\n\nAcceptable values include:\n\n- 'body-small-regular'\n- 'body-small-medium'\n- 'body-small-bold'\n- 'body-midsize-regular'\n- 'body-midsize-medium'\n- 'body-midsize-bold'\n- 'body-large-regular'\n- 'body-large-medium'\n- 'body-large-bold'\n- 'body-small-regular-underline'\n- 'body-small-medium-underline'\n- 'body-midsize-regular-underline'\n- 'body-midsize-medium-underline'\n- 'body-large-regular-underline'\n- 'body-large-medium-underline'\n- 'heading-small-regular'\n- 'heading-small-medium'\n- 'heading-small-bold'\n- 'heading-midsize-regular'\n- 'heading-midsize-medium'\n- 'heading-midsize-bold'\n- 'heading-large-regular'\n- 'heading-large-medium'\n- 'heading-large-bold'\n- 'heading-xlarge-regular'\n- 'heading-xlarge-medium'\n- 'heading-xlarge-bold'\n- 'headline-small-light'\n- 'headline-small-regular'",
|
|
45985
|
+
"default": "body-midsize-medium",
|
|
45986
|
+
"fieldName": "type"
|
|
45987
|
+
},
|
|
45988
|
+
{
|
|
45989
|
+
"name": "tagname",
|
|
45990
|
+
"type": {
|
|
45991
|
+
"text": "TagName | undefined"
|
|
45992
|
+
},
|
|
45993
|
+
"description": "Specifies the HTML tag name for the text element. The default tag name is `p`.\nThis attribute is optional. When set, it changes the tag name of the text element.\n\nAcceptable values include:\n\n- 'h1'\n- 'h2'\n- 'h3'\n- 'h4'\n- 'h5'\n- 'h6'\n- 'p'\n- 'small'\n- 'span'\n- 'div'\n\nFor instance, setting this attribute to `h2` will render the text element as an `h2` element.\nNote that the styling is determined by the `type` attribute.",
|
|
45994
|
+
"fieldName": "tagname"
|
|
45995
|
+
}
|
|
45996
|
+
],
|
|
45997
|
+
"superclass": {
|
|
45998
|
+
"name": "Component",
|
|
45999
|
+
"module": "/src/models"
|
|
46000
|
+
},
|
|
46001
|
+
"tagName": "mdc-text",
|
|
46002
|
+
"jsDoc": "/**\n * Text component for creating styled text elements.\n * It has to be mounted within the ThemeProvider to access color and font tokens.\n *\n * The `type` attribute allows changing the text style.\n * The `tagname` attribute allows changing the tag name of the text element.\n * The default tag name is `p`.\n *\n * The `tagname` attribute should be a valid HTML tag name.\n * If the `tagname` attribute is not a valid HTML tag name, the default tag name will be used.\n *\n * The styling is applied based on the `type` attribute.\n *\n * @tagname mdc-text\n * @slot - Default slot for text content\n *\n * @csspart text - The text element\n */",
|
|
46003
|
+
"customElement": true
|
|
46004
|
+
}
|
|
46005
|
+
],
|
|
46006
|
+
"exports": [
|
|
46007
|
+
{
|
|
46008
|
+
"kind": "js",
|
|
46009
|
+
"name": "default",
|
|
46010
|
+
"declaration": {
|
|
46011
|
+
"name": "Text",
|
|
46012
|
+
"module": "components/text/text.component.js"
|
|
46013
|
+
}
|
|
46014
|
+
}
|
|
46015
|
+
]
|
|
46016
|
+
},
|
|
45933
46017
|
{
|
|
45934
46018
|
"kind": "javascript-module",
|
|
45935
46019
|
"path": "components/textarea/textarea.component.js",
|
|
@@ -47561,90 +47645,6 @@
|
|
|
47561
47645
|
}
|
|
47562
47646
|
]
|
|
47563
47647
|
},
|
|
47564
|
-
{
|
|
47565
|
-
"kind": "javascript-module",
|
|
47566
|
-
"path": "components/text/text.component.js",
|
|
47567
|
-
"declarations": [
|
|
47568
|
-
{
|
|
47569
|
-
"kind": "class",
|
|
47570
|
-
"description": "Text component for creating styled text elements.\nIt has to be mounted within the ThemeProvider to access color and font tokens.\n\nThe `type` attribute allows changing the text style.\nThe `tagname` attribute allows changing the tag name of the text element.\nThe default tag name is `p`.\n\nThe `tagname` attribute should be a valid HTML tag name.\nIf the `tagname` attribute is not a valid HTML tag name, the default tag name will be used.\n\nThe styling is applied based on the `type` attribute.",
|
|
47571
|
-
"name": "Text",
|
|
47572
|
-
"cssParts": [
|
|
47573
|
-
{
|
|
47574
|
-
"description": "The text element",
|
|
47575
|
-
"name": "text"
|
|
47576
|
-
}
|
|
47577
|
-
],
|
|
47578
|
-
"slots": [
|
|
47579
|
-
{
|
|
47580
|
-
"description": "Default slot for text content",
|
|
47581
|
-
"name": ""
|
|
47582
|
-
}
|
|
47583
|
-
],
|
|
47584
|
-
"members": [
|
|
47585
|
-
{
|
|
47586
|
-
"kind": "field",
|
|
47587
|
-
"name": "type",
|
|
47588
|
-
"type": {
|
|
47589
|
-
"text": "TextType"
|
|
47590
|
-
},
|
|
47591
|
-
"privacy": "public",
|
|
47592
|
-
"description": "Specifies the text style to be applied.\n\nAcceptable values include:\n\n- 'body-small-regular'\n- 'body-small-medium'\n- 'body-small-bold'\n- 'body-midsize-regular'\n- 'body-midsize-medium'\n- 'body-midsize-bold'\n- 'body-large-regular'\n- 'body-large-medium'\n- 'body-large-bold'\n- 'body-small-regular-underline'\n- 'body-small-medium-underline'\n- 'body-midsize-regular-underline'\n- 'body-midsize-medium-underline'\n- 'body-large-regular-underline'\n- 'body-large-medium-underline'\n- 'heading-small-regular'\n- 'heading-small-medium'\n- 'heading-small-bold'\n- 'heading-midsize-regular'\n- 'heading-midsize-medium'\n- 'heading-midsize-bold'\n- 'heading-large-regular'\n- 'heading-large-medium'\n- 'heading-large-bold'\n- 'heading-xlarge-regular'\n- 'heading-xlarge-medium'\n- 'heading-xlarge-bold'\n- 'headline-small-light'\n- 'headline-small-regular'",
|
|
47593
|
-
"default": "body-midsize-medium",
|
|
47594
|
-
"attribute": "type",
|
|
47595
|
-
"reflects": true
|
|
47596
|
-
},
|
|
47597
|
-
{
|
|
47598
|
-
"kind": "field",
|
|
47599
|
-
"name": "tagname",
|
|
47600
|
-
"type": {
|
|
47601
|
-
"text": "TagName | undefined"
|
|
47602
|
-
},
|
|
47603
|
-
"privacy": "public",
|
|
47604
|
-
"description": "Specifies the HTML tag name for the text element. The default tag name is `p`.\nThis attribute is optional. When set, it changes the tag name of the text element.\n\nAcceptable values include:\n\n- 'h1'\n- 'h2'\n- 'h3'\n- 'h4'\n- 'h5'\n- 'h6'\n- 'p'\n- 'small'\n- 'span'\n- 'div'\n\nFor instance, setting this attribute to `h2` will render the text element as an `h2` element.\nNote that the styling is determined by the `type` attribute.",
|
|
47605
|
-
"attribute": "tagname",
|
|
47606
|
-
"reflects": true
|
|
47607
|
-
}
|
|
47608
|
-
],
|
|
47609
|
-
"attributes": [
|
|
47610
|
-
{
|
|
47611
|
-
"name": "type",
|
|
47612
|
-
"type": {
|
|
47613
|
-
"text": "TextType"
|
|
47614
|
-
},
|
|
47615
|
-
"description": "Specifies the text style to be applied.\n\nAcceptable values include:\n\n- 'body-small-regular'\n- 'body-small-medium'\n- 'body-small-bold'\n- 'body-midsize-regular'\n- 'body-midsize-medium'\n- 'body-midsize-bold'\n- 'body-large-regular'\n- 'body-large-medium'\n- 'body-large-bold'\n- 'body-small-regular-underline'\n- 'body-small-medium-underline'\n- 'body-midsize-regular-underline'\n- 'body-midsize-medium-underline'\n- 'body-large-regular-underline'\n- 'body-large-medium-underline'\n- 'heading-small-regular'\n- 'heading-small-medium'\n- 'heading-small-bold'\n- 'heading-midsize-regular'\n- 'heading-midsize-medium'\n- 'heading-midsize-bold'\n- 'heading-large-regular'\n- 'heading-large-medium'\n- 'heading-large-bold'\n- 'heading-xlarge-regular'\n- 'heading-xlarge-medium'\n- 'heading-xlarge-bold'\n- 'headline-small-light'\n- 'headline-small-regular'",
|
|
47616
|
-
"default": "body-midsize-medium",
|
|
47617
|
-
"fieldName": "type"
|
|
47618
|
-
},
|
|
47619
|
-
{
|
|
47620
|
-
"name": "tagname",
|
|
47621
|
-
"type": {
|
|
47622
|
-
"text": "TagName | undefined"
|
|
47623
|
-
},
|
|
47624
|
-
"description": "Specifies the HTML tag name for the text element. The default tag name is `p`.\nThis attribute is optional. When set, it changes the tag name of the text element.\n\nAcceptable values include:\n\n- 'h1'\n- 'h2'\n- 'h3'\n- 'h4'\n- 'h5'\n- 'h6'\n- 'p'\n- 'small'\n- 'span'\n- 'div'\n\nFor instance, setting this attribute to `h2` will render the text element as an `h2` element.\nNote that the styling is determined by the `type` attribute.",
|
|
47625
|
-
"fieldName": "tagname"
|
|
47626
|
-
}
|
|
47627
|
-
],
|
|
47628
|
-
"superclass": {
|
|
47629
|
-
"name": "Component",
|
|
47630
|
-
"module": "/src/models"
|
|
47631
|
-
},
|
|
47632
|
-
"tagName": "mdc-text",
|
|
47633
|
-
"jsDoc": "/**\n * Text component for creating styled text elements.\n * It has to be mounted within the ThemeProvider to access color and font tokens.\n *\n * The `type` attribute allows changing the text style.\n * The `tagname` attribute allows changing the tag name of the text element.\n * The default tag name is `p`.\n *\n * The `tagname` attribute should be a valid HTML tag name.\n * If the `tagname` attribute is not a valid HTML tag name, the default tag name will be used.\n *\n * The styling is applied based on the `type` attribute.\n *\n * @tagname mdc-text\n * @slot - Default slot for text content\n *\n * @csspart text - The text element\n */",
|
|
47634
|
-
"customElement": true
|
|
47635
|
-
}
|
|
47636
|
-
],
|
|
47637
|
-
"exports": [
|
|
47638
|
-
{
|
|
47639
|
-
"kind": "js",
|
|
47640
|
-
"name": "default",
|
|
47641
|
-
"declaration": {
|
|
47642
|
-
"name": "Text",
|
|
47643
|
-
"module": "components/text/text.component.js"
|
|
47644
|
-
}
|
|
47645
|
-
}
|
|
47646
|
-
]
|
|
47647
|
-
},
|
|
47648
47648
|
{
|
|
47649
47649
|
"kind": "javascript-module",
|
|
47650
47650
|
"path": "components/toggle/toggle.component.js",
|
package/dist/react/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export { default as Accordion } from './accordion';
|
|
2
|
-
export { default as AccordionButton } from './accordionbutton';
|
|
3
2
|
export { default as AccordionGroup } from './accordiongroup';
|
|
3
|
+
export { default as AccordionButton } from './accordionbutton';
|
|
4
4
|
export { default as AlertChip } from './alertchip';
|
|
5
5
|
export { default as Animation } from './animation';
|
|
6
6
|
export { default as AnnouncementDialog } from './announcementdialog';
|
|
@@ -9,10 +9,10 @@ export { default as Avatar } from './avatar';
|
|
|
9
9
|
export { default as AvatarButton } from './avatarbutton';
|
|
10
10
|
export { default as Badge } from './badge';
|
|
11
11
|
export { default as Banner } from './banner';
|
|
12
|
+
export { default as Brandvisual } from './brandvisual';
|
|
12
13
|
export { default as Bullet } from './bullet';
|
|
13
14
|
export { default as Button } from './button';
|
|
14
15
|
export { default as ButtonGroup } from './buttongroup';
|
|
15
|
-
export { default as Brandvisual } from './brandvisual';
|
|
16
16
|
export { default as ButtonLink } from './buttonlink';
|
|
17
17
|
export { default as Buttonsimple } from './buttonsimple';
|
|
18
18
|
export { default as Card } from './card';
|
|
@@ -77,10 +77,10 @@ export { default as StepperConnector } from './stepperconnector';
|
|
|
77
77
|
export { default as StepperItem } from './stepperitem';
|
|
78
78
|
export { default as Tab } from './tab';
|
|
79
79
|
export { default as TabList } from './tablist';
|
|
80
|
+
export { default as Text } from './text';
|
|
80
81
|
export { default as Textarea } from './textarea';
|
|
81
82
|
export { default as ThemeProvider } from './themeprovider';
|
|
82
83
|
export { default as Toast } from './toast';
|
|
83
|
-
export { default as Text } from './text';
|
|
84
84
|
export { default as Toggle } from './toggle';
|
|
85
85
|
export { default as ToggleTip } from './toggletip';
|
|
86
86
|
export { default as Tooltip } from './tooltip';
|
package/dist/react/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export { default as Accordion } from './accordion';
|
|
2
|
-
export { default as AccordionButton } from './accordionbutton';
|
|
3
2
|
export { default as AccordionGroup } from './accordiongroup';
|
|
3
|
+
export { default as AccordionButton } from './accordionbutton';
|
|
4
4
|
export { default as AlertChip } from './alertchip';
|
|
5
5
|
export { default as Animation } from './animation';
|
|
6
6
|
export { default as AnnouncementDialog } from './announcementdialog';
|
|
@@ -9,10 +9,10 @@ export { default as Avatar } from './avatar';
|
|
|
9
9
|
export { default as AvatarButton } from './avatarbutton';
|
|
10
10
|
export { default as Badge } from './badge';
|
|
11
11
|
export { default as Banner } from './banner';
|
|
12
|
+
export { default as Brandvisual } from './brandvisual';
|
|
12
13
|
export { default as Bullet } from './bullet';
|
|
13
14
|
export { default as Button } from './button';
|
|
14
15
|
export { default as ButtonGroup } from './buttongroup';
|
|
15
|
-
export { default as Brandvisual } from './brandvisual';
|
|
16
16
|
export { default as ButtonLink } from './buttonlink';
|
|
17
17
|
export { default as Buttonsimple } from './buttonsimple';
|
|
18
18
|
export { default as Card } from './card';
|
|
@@ -77,10 +77,10 @@ export { default as StepperConnector } from './stepperconnector';
|
|
|
77
77
|
export { default as StepperItem } from './stepperitem';
|
|
78
78
|
export { default as Tab } from './tab';
|
|
79
79
|
export { default as TabList } from './tablist';
|
|
80
|
+
export { default as Text } from './text';
|
|
80
81
|
export { default as Textarea } from './textarea';
|
|
81
82
|
export { default as ThemeProvider } from './themeprovider';
|
|
82
83
|
export { default as Toast } from './toast';
|
|
83
|
-
export { default as Text } from './text';
|
|
84
84
|
export { default as Toggle } from './toggle';
|
|
85
85
|
export { default as ToggleTip } from './toggletip';
|
|
86
86
|
export { default as Tooltip } from './tooltip';
|