@momentum-design/components 0.62.3 → 0.62.4
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/browser/index.js +813 -545
- package/dist/browser/index.js.map +4 -4
- package/dist/components/card/card.component.d.ts +100 -0
- package/dist/components/card/card.component.js +197 -0
- package/dist/components/card/card.constants.d.ts +22 -0
- package/dist/components/card/card.constants.js +26 -0
- package/dist/components/card/card.styles.d.ts +2 -0
- package/dist/components/card/card.styles.js +79 -0
- package/dist/components/card/card.types.d.ts +5 -0
- package/dist/components/card/card.types.js +1 -0
- package/dist/components/card/index.d.ts +9 -0
- package/dist/components/card/index.js +6 -0
- package/dist/components/cardbutton/cardbutton.component.d.ts +37 -0
- package/dist/components/cardbutton/cardbutton.component.js +61 -0
- package/dist/components/cardbutton/cardbutton.constants.d.ts +2 -0
- package/dist/components/cardbutton/cardbutton.constants.js +3 -0
- package/dist/components/cardbutton/cardbutton.styles.d.ts +2 -0
- package/dist/components/cardbutton/cardbutton.styles.js +26 -0
- package/dist/components/cardbutton/cardbutton.types.d.ts +7 -0
- package/dist/components/cardbutton/cardbutton.types.js +1 -0
- package/dist/components/cardbutton/index.d.ts +9 -0
- package/dist/components/cardbutton/index.js +6 -0
- package/dist/components/cardcheckbox/cardcheckbox.component.d.ts +76 -0
- package/dist/components/cardcheckbox/cardcheckbox.component.js +159 -0
- package/dist/components/cardcheckbox/cardcheckbox.constants.d.ts +15 -0
- package/dist/components/cardcheckbox/cardcheckbox.constants.js +16 -0
- package/dist/components/cardcheckbox/cardcheckbox.styles.d.ts +2 -0
- package/dist/components/cardcheckbox/cardcheckbox.styles.js +57 -0
- package/dist/components/cardcheckbox/cardcheckbox.types.d.ts +11 -0
- package/dist/components/cardcheckbox/cardcheckbox.types.js +1 -0
- package/dist/components/cardcheckbox/index.d.ts +10 -0
- package/dist/components/cardcheckbox/index.js +7 -0
- package/dist/components/cardradio/cardradio.component.d.ts +76 -0
- package/dist/components/cardradio/cardradio.component.js +155 -0
- package/dist/components/cardradio/cardradio.constants.d.ts +2 -0
- package/dist/components/cardradio/cardradio.constants.js +3 -0
- package/dist/components/cardradio/cardradio.styles.d.ts +2 -0
- package/dist/components/cardradio/cardradio.styles.js +53 -0
- package/dist/components/cardradio/cardradio.types.d.ts +8 -0
- package/dist/components/cardradio/cardradio.types.js +1 -0
- package/dist/components/cardradio/index.d.ts +10 -0
- package/dist/components/cardradio/index.js +7 -0
- package/dist/components/radiogroup/radiogroup.component.js +2 -1
- package/dist/custom-elements.json +2751 -273
- package/dist/index.d.ts +11 -7
- package/dist/index.js +11 -7
- package/dist/react/card/index.d.ts +47 -0
- package/dist/react/card/index.js +56 -0
- package/dist/react/cardbutton/index.d.ts +32 -0
- package/dist/react/cardbutton/index.js +40 -0
- package/dist/react/cardcheckbox/index.d.ts +40 -0
- package/dist/react/cardcheckbox/index.js +48 -0
- package/dist/react/cardradio/index.d.ts +40 -0
- package/dist/react/cardradio/index.js +48 -0
- package/dist/react/index.d.ts +5 -1
- package/dist/react/index.js +5 -1
- package/dist/utils/mixins/CardComponentMixin.d.ts +20 -0
- package/dist/utils/mixins/CardComponentMixin.js +130 -0
- package/package.json +1 -1
@@ -3556,6 +3556,2251 @@
|
|
3556
3556
|
}
|
3557
3557
|
]
|
3558
3558
|
},
|
3559
|
+
{
|
3560
|
+
"kind": "javascript-module",
|
3561
|
+
"path": "components/card/card.component.js",
|
3562
|
+
"declarations": [
|
3563
|
+
{
|
3564
|
+
"kind": "class",
|
3565
|
+
"description": "The card component allows users to organize information in a structured and tangible\nformat that is visually appealing. `mdc-card` is a static component that supports\nthe following features:\n- Image\n- Header\n - Icon\n - Title\n - Subtitle\n- Body\n\nThe card can either be vertically or horizontally oriented.\n\nThere are 2 variants for the card that represent the border styling - 'border' and 'ghost'.\n\nTo make this card interactive, use the following slots:\n- `icon-button`: This slot supports action icon buttons in the header section (maximum of 3 buttons).\n- `footer-link`: This slot is for passing `mdc-link` component within the footer section.\n- `footer-button-primary`: This slot is for passing primary variant of\n`mdc-button` component within the footer section.\n- `footer-button-secondary`: This slot is for passing secondary variant of `mdc-button` component\nwithin the footer section.\n\nInteractive card additionally supports 'promotional' variant that represents the border styling - 'promotional'.",
|
3566
|
+
"name": "Card",
|
3567
|
+
"slots": [
|
3568
|
+
{
|
3569
|
+
"description": "This slot is for passing the content before the body",
|
3570
|
+
"name": "before-body"
|
3571
|
+
},
|
3572
|
+
{
|
3573
|
+
"description": "This slot is for passing the text content for the card",
|
3574
|
+
"name": "body"
|
3575
|
+
},
|
3576
|
+
{
|
3577
|
+
"description": "This slot is for passing the content after the body",
|
3578
|
+
"name": "after-body"
|
3579
|
+
},
|
3580
|
+
{
|
3581
|
+
"description": "This slot is for passing `mdc-link` component within the footer section.",
|
3582
|
+
"name": "footer-link"
|
3583
|
+
},
|
3584
|
+
{
|
3585
|
+
"description": "This slot is for passing primary variant of `mdc-button` component within the footer section.",
|
3586
|
+
"name": "footer-button-primary"
|
3587
|
+
},
|
3588
|
+
{
|
3589
|
+
"description": "This slot is for passing secondary variant of `mdc-button` component within the footer section.",
|
3590
|
+
"name": "footer-button-secondary"
|
3591
|
+
},
|
3592
|
+
{
|
3593
|
+
"description": "This slot is for passing the content before the body",
|
3594
|
+
"name": "before-body"
|
3595
|
+
},
|
3596
|
+
{
|
3597
|
+
"description": "This slot is for passing the text content for the card",
|
3598
|
+
"name": "body"
|
3599
|
+
},
|
3600
|
+
{
|
3601
|
+
"description": "This slot is for passing the content after the body",
|
3602
|
+
"name": "after-body"
|
3603
|
+
}
|
3604
|
+
],
|
3605
|
+
"members": [
|
3606
|
+
{
|
3607
|
+
"kind": "method",
|
3608
|
+
"name": "renderHeader",
|
3609
|
+
"privacy": "protected",
|
3610
|
+
"description": "Renders the header of the card if title is provided",
|
3611
|
+
"return": {
|
3612
|
+
"type": {
|
3613
|
+
"text": ""
|
3614
|
+
}
|
3615
|
+
}
|
3616
|
+
},
|
3617
|
+
{
|
3618
|
+
"kind": "field",
|
3619
|
+
"name": "cardTitle",
|
3620
|
+
"type": {
|
3621
|
+
"text": "string"
|
3622
|
+
},
|
3623
|
+
"default": "''",
|
3624
|
+
"description": "The title of the card - part of header section",
|
3625
|
+
"attribute": "card-title",
|
3626
|
+
"inheritedFrom": {
|
3627
|
+
"name": "CardComponentMixin",
|
3628
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3629
|
+
}
|
3630
|
+
},
|
3631
|
+
{
|
3632
|
+
"kind": "field",
|
3633
|
+
"name": "subtitle",
|
3634
|
+
"type": {
|
3635
|
+
"text": "string"
|
3636
|
+
},
|
3637
|
+
"default": "''",
|
3638
|
+
"description": "The subtitle of the card - part of header section",
|
3639
|
+
"attribute": "subtitle",
|
3640
|
+
"inheritedFrom": {
|
3641
|
+
"name": "CardComponentMixin",
|
3642
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3643
|
+
}
|
3644
|
+
},
|
3645
|
+
{
|
3646
|
+
"kind": "field",
|
3647
|
+
"name": "imageSrc",
|
3648
|
+
"type": {
|
3649
|
+
"text": "string"
|
3650
|
+
},
|
3651
|
+
"default": "''",
|
3652
|
+
"description": "The image source URL to render on the card",
|
3653
|
+
"attribute": "image-src",
|
3654
|
+
"inheritedFrom": {
|
3655
|
+
"name": "CardComponentMixin",
|
3656
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3657
|
+
}
|
3658
|
+
},
|
3659
|
+
{
|
3660
|
+
"kind": "field",
|
3661
|
+
"name": "imageAlt",
|
3662
|
+
"type": {
|
3663
|
+
"text": "string"
|
3664
|
+
},
|
3665
|
+
"default": "''",
|
3666
|
+
"description": "The image alt for accessibility support",
|
3667
|
+
"attribute": "image-alt",
|
3668
|
+
"inheritedFrom": {
|
3669
|
+
"name": "CardComponentMixin",
|
3670
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3671
|
+
}
|
3672
|
+
},
|
3673
|
+
{
|
3674
|
+
"kind": "field",
|
3675
|
+
"name": "variant",
|
3676
|
+
"type": {
|
3677
|
+
"text": "CardVariant"
|
3678
|
+
},
|
3679
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
3680
|
+
"default": "'border'",
|
3681
|
+
"attribute": "variant",
|
3682
|
+
"inheritedFrom": {
|
3683
|
+
"name": "CardComponentMixin",
|
3684
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3685
|
+
}
|
3686
|
+
},
|
3687
|
+
{
|
3688
|
+
"kind": "field",
|
3689
|
+
"name": "orientation",
|
3690
|
+
"type": {
|
3691
|
+
"text": "CardOrientation"
|
3692
|
+
},
|
3693
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
3694
|
+
"default": "'vertical'",
|
3695
|
+
"attribute": "orientation",
|
3696
|
+
"reflects": true,
|
3697
|
+
"inheritedFrom": {
|
3698
|
+
"name": "CardComponentMixin",
|
3699
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3700
|
+
}
|
3701
|
+
},
|
3702
|
+
{
|
3703
|
+
"kind": "field",
|
3704
|
+
"name": "titleTagName",
|
3705
|
+
"type": {
|
3706
|
+
"text": "TagNameType"
|
3707
|
+
},
|
3708
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
3709
|
+
"default": "'span'",
|
3710
|
+
"attribute": "title-tag-name",
|
3711
|
+
"inheritedFrom": {
|
3712
|
+
"name": "CardComponentMixin",
|
3713
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3714
|
+
}
|
3715
|
+
},
|
3716
|
+
{
|
3717
|
+
"kind": "field",
|
3718
|
+
"name": "subtitleTagName",
|
3719
|
+
"type": {
|
3720
|
+
"text": "TagNameType"
|
3721
|
+
},
|
3722
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
3723
|
+
"default": "'span'",
|
3724
|
+
"attribute": "subtitle-tag-name",
|
3725
|
+
"inheritedFrom": {
|
3726
|
+
"name": "CardComponentMixin",
|
3727
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3728
|
+
}
|
3729
|
+
},
|
3730
|
+
{
|
3731
|
+
"kind": "field",
|
3732
|
+
"name": "iconName",
|
3733
|
+
"type": {
|
3734
|
+
"text": "IconNames | undefined"
|
3735
|
+
},
|
3736
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
3737
|
+
"attribute": "icon-name",
|
3738
|
+
"inheritedFrom": {
|
3739
|
+
"name": "CardComponentMixin",
|
3740
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3741
|
+
}
|
3742
|
+
},
|
3743
|
+
{
|
3744
|
+
"kind": "method",
|
3745
|
+
"name": "renderImage",
|
3746
|
+
"description": "Renders the image on the card if image source is provided",
|
3747
|
+
"return": {
|
3748
|
+
"type": {
|
3749
|
+
"text": ""
|
3750
|
+
}
|
3751
|
+
},
|
3752
|
+
"inheritedFrom": {
|
3753
|
+
"name": "CardComponentMixin",
|
3754
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3755
|
+
}
|
3756
|
+
},
|
3757
|
+
{
|
3758
|
+
"kind": "method",
|
3759
|
+
"name": "renderIcon",
|
3760
|
+
"description": "Renders the icon on the card if icon name is provided",
|
3761
|
+
"return": {
|
3762
|
+
"type": {
|
3763
|
+
"text": ""
|
3764
|
+
}
|
3765
|
+
},
|
3766
|
+
"inheritedFrom": {
|
3767
|
+
"name": "CardComponentMixin",
|
3768
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3769
|
+
}
|
3770
|
+
},
|
3771
|
+
{
|
3772
|
+
"kind": "method",
|
3773
|
+
"name": "renderTitle",
|
3774
|
+
"description": "Renders the title and subtitle on the card",
|
3775
|
+
"return": {
|
3776
|
+
"type": {
|
3777
|
+
"text": ""
|
3778
|
+
}
|
3779
|
+
},
|
3780
|
+
"inheritedFrom": {
|
3781
|
+
"name": "CardComponentMixin",
|
3782
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3783
|
+
}
|
3784
|
+
}
|
3785
|
+
],
|
3786
|
+
"mixins": [
|
3787
|
+
{
|
3788
|
+
"name": "CardComponentMixin",
|
3789
|
+
"module": "/src/utils/mixins/CardComponentMixin"
|
3790
|
+
}
|
3791
|
+
],
|
3792
|
+
"superclass": {
|
3793
|
+
"name": "Component",
|
3794
|
+
"module": "/src/models"
|
3795
|
+
},
|
3796
|
+
"tagName": "mdc-card",
|
3797
|
+
"jsDoc": "/**\n * The card component allows users to organize information in a structured and tangible\n * format that is visually appealing. `mdc-card` is a static component that supports\n * the following features:\n * - Image\n * - Header\n * - Icon\n * - Title\n * - Subtitle\n * - Body\n *\n * The card can either be vertically or horizontally oriented.\n *\n * There are 2 variants for the card that represent the border styling - 'border' and 'ghost'.\n *\n * To make this card interactive, use the following slots:\n * - `icon-button`: This slot supports action icon buttons in the header section (maximum of 3 buttons).\n * - `footer-link`: This slot is for passing `mdc-link` component within the footer section.\n * - `footer-button-primary`: This slot is for passing primary variant of\n * `mdc-button` component within the footer section.\n * - `footer-button-secondary`: This slot is for passing secondary variant of `mdc-button` component\n * within the footer section.\n *\n * Interactive card additionally supports 'promotional' variant that represents the border styling - 'promotional'.\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n * @slot footer-link - This slot is for passing `mdc-link` component within the footer section.\n * @slot footer-button-primary - This slot is for passing primary variant of\n * `mdc-button` component within the footer section.\n * @slot footer-button-secondary - This slot is for passing secondary variant of `mdc-button` component\n * within the footer section.\n *\n * @tagname mdc-card\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n *\n */",
|
3798
|
+
"customElement": true,
|
3799
|
+
"attributes": [
|
3800
|
+
{
|
3801
|
+
"name": "card-title",
|
3802
|
+
"type": {
|
3803
|
+
"text": "string"
|
3804
|
+
},
|
3805
|
+
"default": "''",
|
3806
|
+
"description": "The title of the card - part of header section",
|
3807
|
+
"fieldName": "cardTitle",
|
3808
|
+
"inheritedFrom": {
|
3809
|
+
"name": "CardComponentMixin",
|
3810
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
3811
|
+
}
|
3812
|
+
},
|
3813
|
+
{
|
3814
|
+
"name": "subtitle",
|
3815
|
+
"type": {
|
3816
|
+
"text": "string"
|
3817
|
+
},
|
3818
|
+
"default": "''",
|
3819
|
+
"description": "The subtitle of the card - part of header section",
|
3820
|
+
"fieldName": "subtitle",
|
3821
|
+
"inheritedFrom": {
|
3822
|
+
"name": "CardComponentMixin",
|
3823
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
3824
|
+
}
|
3825
|
+
},
|
3826
|
+
{
|
3827
|
+
"name": "image-src",
|
3828
|
+
"type": {
|
3829
|
+
"text": "string"
|
3830
|
+
},
|
3831
|
+
"default": "''",
|
3832
|
+
"description": "The image source URL to render on the card",
|
3833
|
+
"fieldName": "imageSrc",
|
3834
|
+
"inheritedFrom": {
|
3835
|
+
"name": "CardComponentMixin",
|
3836
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
3837
|
+
}
|
3838
|
+
},
|
3839
|
+
{
|
3840
|
+
"name": "image-alt",
|
3841
|
+
"type": {
|
3842
|
+
"text": "string"
|
3843
|
+
},
|
3844
|
+
"default": "''",
|
3845
|
+
"description": "The image alt for accessibility support",
|
3846
|
+
"fieldName": "imageAlt",
|
3847
|
+
"inheritedFrom": {
|
3848
|
+
"name": "CardComponentMixin",
|
3849
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
3850
|
+
}
|
3851
|
+
},
|
3852
|
+
{
|
3853
|
+
"name": "variant",
|
3854
|
+
"type": {
|
3855
|
+
"text": "CardVariant"
|
3856
|
+
},
|
3857
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
3858
|
+
"default": "'border'",
|
3859
|
+
"fieldName": "variant",
|
3860
|
+
"inheritedFrom": {
|
3861
|
+
"name": "CardComponentMixin",
|
3862
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
3863
|
+
}
|
3864
|
+
},
|
3865
|
+
{
|
3866
|
+
"name": "orientation",
|
3867
|
+
"type": {
|
3868
|
+
"text": "CardOrientation"
|
3869
|
+
},
|
3870
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
3871
|
+
"default": "'vertical'",
|
3872
|
+
"fieldName": "orientation",
|
3873
|
+
"inheritedFrom": {
|
3874
|
+
"name": "CardComponentMixin",
|
3875
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
3876
|
+
}
|
3877
|
+
},
|
3878
|
+
{
|
3879
|
+
"name": "title-tag-name",
|
3880
|
+
"type": {
|
3881
|
+
"text": "TagNameType"
|
3882
|
+
},
|
3883
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
3884
|
+
"default": "'span'",
|
3885
|
+
"fieldName": "titleTagName",
|
3886
|
+
"inheritedFrom": {
|
3887
|
+
"name": "CardComponentMixin",
|
3888
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
3889
|
+
}
|
3890
|
+
},
|
3891
|
+
{
|
3892
|
+
"name": "subtitle-tag-name",
|
3893
|
+
"type": {
|
3894
|
+
"text": "TagNameType"
|
3895
|
+
},
|
3896
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
3897
|
+
"default": "'span'",
|
3898
|
+
"fieldName": "subtitleTagName",
|
3899
|
+
"inheritedFrom": {
|
3900
|
+
"name": "CardComponentMixin",
|
3901
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
3902
|
+
}
|
3903
|
+
},
|
3904
|
+
{
|
3905
|
+
"name": "icon-name",
|
3906
|
+
"type": {
|
3907
|
+
"text": "IconNames | undefined"
|
3908
|
+
},
|
3909
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
3910
|
+
"fieldName": "iconName",
|
3911
|
+
"inheritedFrom": {
|
3912
|
+
"name": "CardComponentMixin",
|
3913
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
3914
|
+
}
|
3915
|
+
}
|
3916
|
+
]
|
3917
|
+
}
|
3918
|
+
],
|
3919
|
+
"exports": [
|
3920
|
+
{
|
3921
|
+
"kind": "js",
|
3922
|
+
"name": "default",
|
3923
|
+
"declaration": {
|
3924
|
+
"name": "Card",
|
3925
|
+
"module": "components/card/card.component.js"
|
3926
|
+
}
|
3927
|
+
}
|
3928
|
+
]
|
3929
|
+
},
|
3930
|
+
{
|
3931
|
+
"kind": "javascript-module",
|
3932
|
+
"path": "components/cardbutton/cardbutton.component.js",
|
3933
|
+
"declarations": [
|
3934
|
+
{
|
3935
|
+
"kind": "class",
|
3936
|
+
"description": "cardbutton component looks like a card and behaves as a button component.\n\n**Note**: This is a single selection card i.e. interacting anywhere on the card would trigger the click event.\nMake sure to pass only non-interactable elements within the slots.",
|
3937
|
+
"name": "CardButton",
|
3938
|
+
"slots": [
|
3939
|
+
{
|
3940
|
+
"description": "This slot is for passing the content before the body",
|
3941
|
+
"name": "before-body"
|
3942
|
+
},
|
3943
|
+
{
|
3944
|
+
"description": "This slot is for passing the text content for the card",
|
3945
|
+
"name": "body"
|
3946
|
+
},
|
3947
|
+
{
|
3948
|
+
"description": "This slot is for passing the content after the body",
|
3949
|
+
"name": "after-body"
|
3950
|
+
}
|
3951
|
+
],
|
3952
|
+
"members": [
|
3953
|
+
{
|
3954
|
+
"kind": "method",
|
3955
|
+
"name": "renderHeader",
|
3956
|
+
"privacy": "protected",
|
3957
|
+
"description": "Renders the header of the card if title is provided",
|
3958
|
+
"return": {
|
3959
|
+
"type": {
|
3960
|
+
"text": ""
|
3961
|
+
}
|
3962
|
+
}
|
3963
|
+
},
|
3964
|
+
{
|
3965
|
+
"kind": "field",
|
3966
|
+
"name": "cardTitle",
|
3967
|
+
"type": {
|
3968
|
+
"text": "string"
|
3969
|
+
},
|
3970
|
+
"default": "''",
|
3971
|
+
"description": "The title of the card - part of header section",
|
3972
|
+
"attribute": "card-title",
|
3973
|
+
"inheritedFrom": {
|
3974
|
+
"name": "CardComponentMixin",
|
3975
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3976
|
+
}
|
3977
|
+
},
|
3978
|
+
{
|
3979
|
+
"kind": "field",
|
3980
|
+
"name": "subtitle",
|
3981
|
+
"type": {
|
3982
|
+
"text": "string"
|
3983
|
+
},
|
3984
|
+
"default": "''",
|
3985
|
+
"description": "The subtitle of the card - part of header section",
|
3986
|
+
"attribute": "subtitle",
|
3987
|
+
"inheritedFrom": {
|
3988
|
+
"name": "CardComponentMixin",
|
3989
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
3990
|
+
}
|
3991
|
+
},
|
3992
|
+
{
|
3993
|
+
"kind": "field",
|
3994
|
+
"name": "imageSrc",
|
3995
|
+
"type": {
|
3996
|
+
"text": "string"
|
3997
|
+
},
|
3998
|
+
"default": "''",
|
3999
|
+
"description": "The image source URL to render on the card",
|
4000
|
+
"attribute": "image-src",
|
4001
|
+
"inheritedFrom": {
|
4002
|
+
"name": "CardComponentMixin",
|
4003
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4004
|
+
}
|
4005
|
+
},
|
4006
|
+
{
|
4007
|
+
"kind": "field",
|
4008
|
+
"name": "imageAlt",
|
4009
|
+
"type": {
|
4010
|
+
"text": "string"
|
4011
|
+
},
|
4012
|
+
"default": "''",
|
4013
|
+
"description": "The image alt for accessibility support",
|
4014
|
+
"attribute": "image-alt",
|
4015
|
+
"inheritedFrom": {
|
4016
|
+
"name": "CardComponentMixin",
|
4017
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4018
|
+
}
|
4019
|
+
},
|
4020
|
+
{
|
4021
|
+
"kind": "field",
|
4022
|
+
"name": "variant",
|
4023
|
+
"type": {
|
4024
|
+
"text": "CardVariant"
|
4025
|
+
},
|
4026
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
4027
|
+
"default": "'border'",
|
4028
|
+
"attribute": "variant",
|
4029
|
+
"inheritedFrom": {
|
4030
|
+
"name": "CardComponentMixin",
|
4031
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4032
|
+
}
|
4033
|
+
},
|
4034
|
+
{
|
4035
|
+
"kind": "field",
|
4036
|
+
"name": "orientation",
|
4037
|
+
"type": {
|
4038
|
+
"text": "CardOrientation"
|
4039
|
+
},
|
4040
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
4041
|
+
"default": "'vertical'",
|
4042
|
+
"attribute": "orientation",
|
4043
|
+
"reflects": true,
|
4044
|
+
"inheritedFrom": {
|
4045
|
+
"name": "CardComponentMixin",
|
4046
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4047
|
+
}
|
4048
|
+
},
|
4049
|
+
{
|
4050
|
+
"kind": "field",
|
4051
|
+
"name": "titleTagName",
|
4052
|
+
"type": {
|
4053
|
+
"text": "TagNameType"
|
4054
|
+
},
|
4055
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
4056
|
+
"default": "'span'",
|
4057
|
+
"attribute": "title-tag-name",
|
4058
|
+
"inheritedFrom": {
|
4059
|
+
"name": "CardComponentMixin",
|
4060
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4061
|
+
}
|
4062
|
+
},
|
4063
|
+
{
|
4064
|
+
"kind": "field",
|
4065
|
+
"name": "subtitleTagName",
|
4066
|
+
"type": {
|
4067
|
+
"text": "TagNameType"
|
4068
|
+
},
|
4069
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
4070
|
+
"default": "'span'",
|
4071
|
+
"attribute": "subtitle-tag-name",
|
4072
|
+
"inheritedFrom": {
|
4073
|
+
"name": "CardComponentMixin",
|
4074
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4075
|
+
}
|
4076
|
+
},
|
4077
|
+
{
|
4078
|
+
"kind": "field",
|
4079
|
+
"name": "iconName",
|
4080
|
+
"type": {
|
4081
|
+
"text": "IconNames | undefined"
|
4082
|
+
},
|
4083
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
4084
|
+
"attribute": "icon-name",
|
4085
|
+
"inheritedFrom": {
|
4086
|
+
"name": "CardComponentMixin",
|
4087
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4088
|
+
}
|
4089
|
+
},
|
4090
|
+
{
|
4091
|
+
"kind": "method",
|
4092
|
+
"name": "renderImage",
|
4093
|
+
"description": "Renders the image on the card if image source is provided",
|
4094
|
+
"return": {
|
4095
|
+
"type": {
|
4096
|
+
"text": ""
|
4097
|
+
}
|
4098
|
+
},
|
4099
|
+
"inheritedFrom": {
|
4100
|
+
"name": "CardComponentMixin",
|
4101
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4102
|
+
}
|
4103
|
+
},
|
4104
|
+
{
|
4105
|
+
"kind": "method",
|
4106
|
+
"name": "renderIcon",
|
4107
|
+
"description": "Renders the icon on the card if icon name is provided",
|
4108
|
+
"return": {
|
4109
|
+
"type": {
|
4110
|
+
"text": ""
|
4111
|
+
}
|
4112
|
+
},
|
4113
|
+
"inheritedFrom": {
|
4114
|
+
"name": "CardComponentMixin",
|
4115
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4116
|
+
}
|
4117
|
+
},
|
4118
|
+
{
|
4119
|
+
"kind": "method",
|
4120
|
+
"name": "renderTitle",
|
4121
|
+
"description": "Renders the title and subtitle on the card",
|
4122
|
+
"return": {
|
4123
|
+
"type": {
|
4124
|
+
"text": ""
|
4125
|
+
}
|
4126
|
+
},
|
4127
|
+
"inheritedFrom": {
|
4128
|
+
"name": "CardComponentMixin",
|
4129
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
4130
|
+
}
|
4131
|
+
},
|
4132
|
+
{
|
4133
|
+
"kind": "field",
|
4134
|
+
"name": "tabIndex",
|
4135
|
+
"type": {
|
4136
|
+
"text": "number"
|
4137
|
+
},
|
4138
|
+
"default": "0",
|
4139
|
+
"description": "This property specifies the tab order of the element.",
|
4140
|
+
"attribute": "tabIndex",
|
4141
|
+
"reflects": true,
|
4142
|
+
"inheritedFrom": {
|
4143
|
+
"name": "Buttonsimple",
|
4144
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4145
|
+
}
|
4146
|
+
},
|
4147
|
+
{
|
4148
|
+
"kind": "field",
|
4149
|
+
"name": "disabled",
|
4150
|
+
"type": {
|
4151
|
+
"text": "boolean | undefined"
|
4152
|
+
},
|
4153
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
4154
|
+
"default": "undefined",
|
4155
|
+
"attribute": "disabled",
|
4156
|
+
"reflects": true,
|
4157
|
+
"inheritedFrom": {
|
4158
|
+
"name": "Buttonsimple",
|
4159
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4160
|
+
}
|
4161
|
+
},
|
4162
|
+
{
|
4163
|
+
"kind": "field",
|
4164
|
+
"name": "active",
|
4165
|
+
"type": {
|
4166
|
+
"text": "boolean | undefined"
|
4167
|
+
},
|
4168
|
+
"description": "The button's active state indicates whether it is currently toggled on (active) or off (inactive).\nWhen the active state is true, the button is considered to be in an active state, meaning it is toggled on.\nConversely, when the active state is false, the button is in an inactive state, indicating it is toggled off.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
|
4169
|
+
"default": "undefined",
|
4170
|
+
"attribute": "active",
|
4171
|
+
"reflects": true,
|
4172
|
+
"inheritedFrom": {
|
4173
|
+
"name": "Buttonsimple",
|
4174
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4175
|
+
}
|
4176
|
+
},
|
4177
|
+
{
|
4178
|
+
"kind": "field",
|
4179
|
+
"name": "softDisabled",
|
4180
|
+
"type": {
|
4181
|
+
"text": "boolean | undefined"
|
4182
|
+
},
|
4183
|
+
"description": "Indicates whether the button is soft disabled.\nWhen set to `true`, the button appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe button behaves like a disabled button, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
|
4184
|
+
"default": "undefined",
|
4185
|
+
"attribute": "soft-disabled",
|
4186
|
+
"reflects": true,
|
4187
|
+
"inheritedFrom": {
|
4188
|
+
"name": "Buttonsimple",
|
4189
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4190
|
+
}
|
4191
|
+
},
|
4192
|
+
{
|
4193
|
+
"kind": "field",
|
4194
|
+
"name": "size",
|
4195
|
+
"type": {
|
4196
|
+
"text": "ButtonSize"
|
4197
|
+
},
|
4198
|
+
"description": "Simplebutton size is a super set of all the sizes supported by children components.",
|
4199
|
+
"default": "32",
|
4200
|
+
"attribute": "size",
|
4201
|
+
"reflects": true,
|
4202
|
+
"inheritedFrom": {
|
4203
|
+
"name": "Buttonsimple",
|
4204
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4205
|
+
}
|
4206
|
+
},
|
4207
|
+
{
|
4208
|
+
"kind": "field",
|
4209
|
+
"name": "role",
|
4210
|
+
"description": "This property defines the ARIA role for the element. By default, it is set to 'button'.\nConsumers should override this role when:\n- The element is being used in a context where a different role is more appropriate.\n- Custom behaviors are implemented that require a specific ARIA role for accessibility purposes.",
|
4211
|
+
"default": "button",
|
4212
|
+
"attribute": "role",
|
4213
|
+
"reflects": true,
|
4214
|
+
"inheritedFrom": {
|
4215
|
+
"name": "Buttonsimple",
|
4216
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4217
|
+
}
|
4218
|
+
},
|
4219
|
+
{
|
4220
|
+
"kind": "field",
|
4221
|
+
"name": "ariaStateKey",
|
4222
|
+
"type": {
|
4223
|
+
"text": "string | undefined"
|
4224
|
+
},
|
4225
|
+
"description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
|
4226
|
+
"default": "'aria-pressed' (when)",
|
4227
|
+
"attribute": "ariaStateKey",
|
4228
|
+
"reflects": true,
|
4229
|
+
"inheritedFrom": {
|
4230
|
+
"name": "Buttonsimple",
|
4231
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4232
|
+
}
|
4233
|
+
},
|
4234
|
+
{
|
4235
|
+
"kind": "field",
|
4236
|
+
"name": "type",
|
4237
|
+
"type": {
|
4238
|
+
"text": "ButtonType"
|
4239
|
+
},
|
4240
|
+
"description": "This property defines the type attribute for the button element.\nThe type attribute specifies the behavior of the button when it is clicked.\n- **submit**: The button submits the form data to the server.\n- **reset**: The button resets the form data to its initial state.\n- **button**: The button does nothing when clicked.",
|
4241
|
+
"default": "button",
|
4242
|
+
"attribute": "type",
|
4243
|
+
"reflects": true,
|
4244
|
+
"inheritedFrom": {
|
4245
|
+
"name": "Buttonsimple",
|
4246
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4247
|
+
}
|
4248
|
+
},
|
4249
|
+
{
|
4250
|
+
"kind": "method",
|
4251
|
+
"name": "executeAction",
|
4252
|
+
"privacy": "protected",
|
4253
|
+
"inheritedFrom": {
|
4254
|
+
"name": "Buttonsimple",
|
4255
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4256
|
+
}
|
4257
|
+
},
|
4258
|
+
{
|
4259
|
+
"kind": "method",
|
4260
|
+
"name": "setActive",
|
4261
|
+
"privacy": "protected",
|
4262
|
+
"parameters": [
|
4263
|
+
{
|
4264
|
+
"name": "element",
|
4265
|
+
"type": {
|
4266
|
+
"text": "HTMLElement"
|
4267
|
+
},
|
4268
|
+
"description": "The button element"
|
4269
|
+
},
|
4270
|
+
{
|
4271
|
+
"name": "active",
|
4272
|
+
"optional": true,
|
4273
|
+
"type": {
|
4274
|
+
"text": "boolean"
|
4275
|
+
},
|
4276
|
+
"description": "The active state of the element"
|
4277
|
+
}
|
4278
|
+
],
|
4279
|
+
"description": "Sets the ariaStateKey attributes based on the active state of the button.",
|
4280
|
+
"inheritedFrom": {
|
4281
|
+
"name": "Buttonsimple",
|
4282
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4283
|
+
}
|
4284
|
+
},
|
4285
|
+
{
|
4286
|
+
"kind": "method",
|
4287
|
+
"name": "setSoftDisabled",
|
4288
|
+
"privacy": "private",
|
4289
|
+
"parameters": [
|
4290
|
+
{
|
4291
|
+
"name": "element",
|
4292
|
+
"type": {
|
4293
|
+
"text": "HTMLElement"
|
4294
|
+
},
|
4295
|
+
"description": "The button element."
|
4296
|
+
},
|
4297
|
+
{
|
4298
|
+
"name": "softDisabled",
|
4299
|
+
"optional": true,
|
4300
|
+
"type": {
|
4301
|
+
"text": "boolean"
|
4302
|
+
},
|
4303
|
+
"description": "The soft-disabled state."
|
4304
|
+
}
|
4305
|
+
],
|
4306
|
+
"description": "Sets the soft-disabled attribute for the button.\nWhen soft-disabled, the button looks to be disabled but remains focusable and clickable.\nAlso sets/removes aria-disabled attribute.",
|
4307
|
+
"inheritedFrom": {
|
4308
|
+
"name": "Buttonsimple",
|
4309
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4310
|
+
}
|
4311
|
+
},
|
4312
|
+
{
|
4313
|
+
"kind": "method",
|
4314
|
+
"name": "setDisabled",
|
4315
|
+
"privacy": "private",
|
4316
|
+
"parameters": [
|
4317
|
+
{
|
4318
|
+
"name": "element",
|
4319
|
+
"type": {
|
4320
|
+
"text": "HTMLElement"
|
4321
|
+
},
|
4322
|
+
"description": "The button element."
|
4323
|
+
},
|
4324
|
+
{
|
4325
|
+
"name": "disabled",
|
4326
|
+
"type": {
|
4327
|
+
"text": "boolean"
|
4328
|
+
},
|
4329
|
+
"description": "The disabled state."
|
4330
|
+
}
|
4331
|
+
],
|
4332
|
+
"description": "Sets the disabled attribute for the button.\nWhen disabled, the button is not focusable or clickable, and tabindex is set to -1.\nThe previous tabindex is stored and restored when enabled.\nAlso sets/removes aria-disabled attribute.",
|
4333
|
+
"inheritedFrom": {
|
4334
|
+
"name": "Buttonsimple",
|
4335
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4336
|
+
}
|
4337
|
+
},
|
4338
|
+
{
|
4339
|
+
"kind": "method",
|
4340
|
+
"name": "triggerClickEvent",
|
4341
|
+
"privacy": "private",
|
4342
|
+
"inheritedFrom": {
|
4343
|
+
"name": "Buttonsimple",
|
4344
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4345
|
+
}
|
4346
|
+
},
|
4347
|
+
{
|
4348
|
+
"kind": "method",
|
4349
|
+
"name": "handleBlur",
|
4350
|
+
"privacy": "private",
|
4351
|
+
"description": "In case the button is pressed and the focus is lost while pressing,\nthe pressed class is removed.",
|
4352
|
+
"inheritedFrom": {
|
4353
|
+
"name": "Buttonsimple",
|
4354
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4355
|
+
}
|
4356
|
+
},
|
4357
|
+
{
|
4358
|
+
"kind": "method",
|
4359
|
+
"name": "handleKeyDown",
|
4360
|
+
"privacy": "private",
|
4361
|
+
"parameters": [
|
4362
|
+
{
|
4363
|
+
"name": "event",
|
4364
|
+
"type": {
|
4365
|
+
"text": "KeyboardEvent"
|
4366
|
+
},
|
4367
|
+
"description": "The keyboard event."
|
4368
|
+
}
|
4369
|
+
],
|
4370
|
+
"description": "Handles the keydown event on the button.\nIf the key is 'Enter' or 'Space', the button is pressed.\nIf the key is 'Enter', the button is pressed. The native HTML button works in the same way.\nIf the key is 'Space', the button's default is prevent to avoid scrolling etc in the host application.",
|
4371
|
+
"inheritedFrom": {
|
4372
|
+
"name": "Buttonsimple",
|
4373
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4374
|
+
}
|
4375
|
+
},
|
4376
|
+
{
|
4377
|
+
"kind": "method",
|
4378
|
+
"name": "handleKeyUp",
|
4379
|
+
"privacy": "private",
|
4380
|
+
"parameters": [
|
4381
|
+
{
|
4382
|
+
"name": "event",
|
4383
|
+
"type": {
|
4384
|
+
"text": "KeyboardEvent"
|
4385
|
+
},
|
4386
|
+
"description": "The keyboard event."
|
4387
|
+
}
|
4388
|
+
],
|
4389
|
+
"description": "Handles the keyup event on the button.\nIf the key is 'Enter' or 'Space', the button is clicked.\nIf the key is 'Space', the button is pressed. The native HTML button works in the same way.",
|
4390
|
+
"inheritedFrom": {
|
4391
|
+
"name": "Buttonsimple",
|
4392
|
+
"module": "components/buttonsimple/buttonsimple.component.js"
|
4393
|
+
}
|
4394
|
+
}
|
4395
|
+
],
|
4396
|
+
"events": [
|
4397
|
+
{
|
4398
|
+
"description": "(React: onClick) Event that gets dispatched when the card is clicked.",
|
4399
|
+
"name": "click",
|
4400
|
+
"reactName": "onClick",
|
4401
|
+
"inheritedFrom": {
|
4402
|
+
"name": "Buttonsimple",
|
4403
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4404
|
+
}
|
4405
|
+
},
|
4406
|
+
{
|
4407
|
+
"description": "(React: onKeyDown) This event is dispatched when a key is pressed down on the card. It fires the click event when enter key is used.",
|
4408
|
+
"name": "keydown",
|
4409
|
+
"reactName": "onKeyDown",
|
4410
|
+
"inheritedFrom": {
|
4411
|
+
"name": "Buttonsimple",
|
4412
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4413
|
+
}
|
4414
|
+
},
|
4415
|
+
{
|
4416
|
+
"description": "(React: onKeyUp) This event is dispatched when a key is released on the card. It fires the click event when space key is used.",
|
4417
|
+
"name": "keyup",
|
4418
|
+
"reactName": "onKeyUp",
|
4419
|
+
"inheritedFrom": {
|
4420
|
+
"name": "Buttonsimple",
|
4421
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4422
|
+
}
|
4423
|
+
},
|
4424
|
+
{
|
4425
|
+
"description": "(React: onFocus) Event that gets dispatched when the card receives focus.",
|
4426
|
+
"name": "focus",
|
4427
|
+
"reactName": "onFocus",
|
4428
|
+
"inheritedFrom": {
|
4429
|
+
"name": "Buttonsimple",
|
4430
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4431
|
+
}
|
4432
|
+
}
|
4433
|
+
],
|
4434
|
+
"mixins": [
|
4435
|
+
{
|
4436
|
+
"name": "CardComponentMixin",
|
4437
|
+
"module": "/src/utils/mixins/CardComponentMixin"
|
4438
|
+
}
|
4439
|
+
],
|
4440
|
+
"superclass": {
|
4441
|
+
"name": "Buttonsimple",
|
4442
|
+
"module": "/src/components/buttonsimple/buttonsimple.component"
|
4443
|
+
},
|
4444
|
+
"tagName": "mdc-cardbutton",
|
4445
|
+
"jsDoc": "/**\n * cardbutton component looks like a card and behaves as a button component.\n *\n * **Note**: This is a single selection card i.e. interacting anywhere on the card would trigger the click event.\n * Make sure to pass only non-interactable elements within the slots.\n *\n * @tagname mdc-cardbutton\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n *\n * @event click - (React: onClick) Event that gets dispatched when the card is clicked.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the card.\n * It fires the click event when enter key is used.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.\n * It fires the click event when space key is used.\n * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.\n *\n */",
|
4446
|
+
"customElement": true,
|
4447
|
+
"attributes": [
|
4448
|
+
{
|
4449
|
+
"name": "card-title",
|
4450
|
+
"type": {
|
4451
|
+
"text": "string"
|
4452
|
+
},
|
4453
|
+
"default": "''",
|
4454
|
+
"description": "The title of the card - part of header section",
|
4455
|
+
"fieldName": "cardTitle",
|
4456
|
+
"inheritedFrom": {
|
4457
|
+
"name": "CardComponentMixin",
|
4458
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
4459
|
+
}
|
4460
|
+
},
|
4461
|
+
{
|
4462
|
+
"name": "subtitle",
|
4463
|
+
"type": {
|
4464
|
+
"text": "string"
|
4465
|
+
},
|
4466
|
+
"default": "''",
|
4467
|
+
"description": "The subtitle of the card - part of header section",
|
4468
|
+
"fieldName": "subtitle",
|
4469
|
+
"inheritedFrom": {
|
4470
|
+
"name": "CardComponentMixin",
|
4471
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
4472
|
+
}
|
4473
|
+
},
|
4474
|
+
{
|
4475
|
+
"name": "image-src",
|
4476
|
+
"type": {
|
4477
|
+
"text": "string"
|
4478
|
+
},
|
4479
|
+
"default": "''",
|
4480
|
+
"description": "The image source URL to render on the card",
|
4481
|
+
"fieldName": "imageSrc",
|
4482
|
+
"inheritedFrom": {
|
4483
|
+
"name": "CardComponentMixin",
|
4484
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
4485
|
+
}
|
4486
|
+
},
|
4487
|
+
{
|
4488
|
+
"name": "image-alt",
|
4489
|
+
"type": {
|
4490
|
+
"text": "string"
|
4491
|
+
},
|
4492
|
+
"default": "''",
|
4493
|
+
"description": "The image alt for accessibility support",
|
4494
|
+
"fieldName": "imageAlt",
|
4495
|
+
"inheritedFrom": {
|
4496
|
+
"name": "CardComponentMixin",
|
4497
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
4498
|
+
}
|
4499
|
+
},
|
4500
|
+
{
|
4501
|
+
"name": "variant",
|
4502
|
+
"type": {
|
4503
|
+
"text": "CardVariant"
|
4504
|
+
},
|
4505
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
4506
|
+
"default": "'border'",
|
4507
|
+
"fieldName": "variant",
|
4508
|
+
"inheritedFrom": {
|
4509
|
+
"name": "CardComponentMixin",
|
4510
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
4511
|
+
}
|
4512
|
+
},
|
4513
|
+
{
|
4514
|
+
"name": "orientation",
|
4515
|
+
"type": {
|
4516
|
+
"text": "CardOrientation"
|
4517
|
+
},
|
4518
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
4519
|
+
"default": "'vertical'",
|
4520
|
+
"fieldName": "orientation",
|
4521
|
+
"inheritedFrom": {
|
4522
|
+
"name": "CardComponentMixin",
|
4523
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
4524
|
+
}
|
4525
|
+
},
|
4526
|
+
{
|
4527
|
+
"name": "title-tag-name",
|
4528
|
+
"type": {
|
4529
|
+
"text": "TagNameType"
|
4530
|
+
},
|
4531
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
4532
|
+
"default": "'span'",
|
4533
|
+
"fieldName": "titleTagName",
|
4534
|
+
"inheritedFrom": {
|
4535
|
+
"name": "CardComponentMixin",
|
4536
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
4537
|
+
}
|
4538
|
+
},
|
4539
|
+
{
|
4540
|
+
"name": "subtitle-tag-name",
|
4541
|
+
"type": {
|
4542
|
+
"text": "TagNameType"
|
4543
|
+
},
|
4544
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
4545
|
+
"default": "'span'",
|
4546
|
+
"fieldName": "subtitleTagName",
|
4547
|
+
"inheritedFrom": {
|
4548
|
+
"name": "CardComponentMixin",
|
4549
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
4550
|
+
}
|
4551
|
+
},
|
4552
|
+
{
|
4553
|
+
"name": "icon-name",
|
4554
|
+
"type": {
|
4555
|
+
"text": "IconNames | undefined"
|
4556
|
+
},
|
4557
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
4558
|
+
"fieldName": "iconName",
|
4559
|
+
"inheritedFrom": {
|
4560
|
+
"name": "CardComponentMixin",
|
4561
|
+
"module": "src/utils/mixins/CardComponentMixin.ts"
|
4562
|
+
}
|
4563
|
+
},
|
4564
|
+
{
|
4565
|
+
"name": "tabIndex",
|
4566
|
+
"type": {
|
4567
|
+
"text": "number"
|
4568
|
+
},
|
4569
|
+
"default": "0",
|
4570
|
+
"description": "This property specifies the tab order of the element.",
|
4571
|
+
"fieldName": "tabIndex",
|
4572
|
+
"inheritedFrom": {
|
4573
|
+
"name": "Buttonsimple",
|
4574
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4575
|
+
}
|
4576
|
+
},
|
4577
|
+
{
|
4578
|
+
"name": "disabled",
|
4579
|
+
"type": {
|
4580
|
+
"text": "boolean | undefined"
|
4581
|
+
},
|
4582
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
4583
|
+
"default": "undefined",
|
4584
|
+
"fieldName": "disabled",
|
4585
|
+
"inheritedFrom": {
|
4586
|
+
"name": "Buttonsimple",
|
4587
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4588
|
+
}
|
4589
|
+
},
|
4590
|
+
{
|
4591
|
+
"name": "active",
|
4592
|
+
"type": {
|
4593
|
+
"text": "boolean | undefined"
|
4594
|
+
},
|
4595
|
+
"description": "The button's active state indicates whether it is currently toggled on (active) or off (inactive).\nWhen the active state is true, the button is considered to be in an active state, meaning it is toggled on.\nConversely, when the active state is false, the button is in an inactive state, indicating it is toggled off.\n\nThis attribute is used to set the provided `ariaStateKey` to true or false.",
|
4596
|
+
"default": "undefined",
|
4597
|
+
"fieldName": "active",
|
4598
|
+
"inheritedFrom": {
|
4599
|
+
"name": "Buttonsimple",
|
4600
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4601
|
+
}
|
4602
|
+
},
|
4603
|
+
{
|
4604
|
+
"name": "soft-disabled",
|
4605
|
+
"type": {
|
4606
|
+
"text": "boolean | undefined"
|
4607
|
+
},
|
4608
|
+
"description": "Indicates whether the button is soft disabled.\nWhen set to `true`, the button appears visually disabled but still allows\nfocus, click, and keyboard actions to be passed through.\n\n**Important:** When using soft disabled, consumers must ensure that\nthe button behaves like a disabled button, allowing only focus and\npreventing any interactions (clicks or keyboard actions) from triggering unintended actions.",
|
4609
|
+
"default": "undefined",
|
4610
|
+
"fieldName": "softDisabled",
|
4611
|
+
"inheritedFrom": {
|
4612
|
+
"name": "Buttonsimple",
|
4613
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4614
|
+
}
|
4615
|
+
},
|
4616
|
+
{
|
4617
|
+
"name": "size",
|
4618
|
+
"type": {
|
4619
|
+
"text": "ButtonSize"
|
4620
|
+
},
|
4621
|
+
"description": "Simplebutton size is a super set of all the sizes supported by children components.",
|
4622
|
+
"default": "32",
|
4623
|
+
"fieldName": "size",
|
4624
|
+
"inheritedFrom": {
|
4625
|
+
"name": "Buttonsimple",
|
4626
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4627
|
+
}
|
4628
|
+
},
|
4629
|
+
{
|
4630
|
+
"name": "role",
|
4631
|
+
"description": "This property defines the ARIA role for the element. By default, it is set to 'button'.\nConsumers should override this role when:\n- The element is being used in a context where a different role is more appropriate.\n- Custom behaviors are implemented that require a specific ARIA role for accessibility purposes.",
|
4632
|
+
"default": "button",
|
4633
|
+
"fieldName": "role",
|
4634
|
+
"inheritedFrom": {
|
4635
|
+
"name": "Buttonsimple",
|
4636
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4637
|
+
}
|
4638
|
+
},
|
4639
|
+
{
|
4640
|
+
"name": "ariaStateKey",
|
4641
|
+
"type": {
|
4642
|
+
"text": "string | undefined"
|
4643
|
+
},
|
4644
|
+
"description": "This property defines the ARIA state key, which will be toggled when the\nButton is set to `active`.\nThe default value is 'aria-pressed', which is commonly used for toggle buttons.\n\nConsumers can override this property to use a different ARIA state key if needed.\nIn case multiple aria attributes should be toggled, they can be passed in as\na comma separated string.\nFor example: `aria-pressed,aria-expanded`",
|
4645
|
+
"default": "'aria-pressed' (when)",
|
4646
|
+
"fieldName": "ariaStateKey",
|
4647
|
+
"inheritedFrom": {
|
4648
|
+
"name": "Buttonsimple",
|
4649
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4650
|
+
}
|
4651
|
+
},
|
4652
|
+
{
|
4653
|
+
"name": "type",
|
4654
|
+
"type": {
|
4655
|
+
"text": "ButtonType"
|
4656
|
+
},
|
4657
|
+
"description": "This property defines the type attribute for the button element.\nThe type attribute specifies the behavior of the button when it is clicked.\n- **submit**: The button submits the form data to the server.\n- **reset**: The button resets the form data to its initial state.\n- **button**: The button does nothing when clicked.",
|
4658
|
+
"default": "button",
|
4659
|
+
"fieldName": "type",
|
4660
|
+
"inheritedFrom": {
|
4661
|
+
"name": "Buttonsimple",
|
4662
|
+
"module": "src/components/buttonsimple/buttonsimple.component.ts"
|
4663
|
+
}
|
4664
|
+
}
|
4665
|
+
]
|
4666
|
+
}
|
4667
|
+
],
|
4668
|
+
"exports": [
|
4669
|
+
{
|
4670
|
+
"kind": "js",
|
4671
|
+
"name": "default",
|
4672
|
+
"declaration": {
|
4673
|
+
"name": "CardButton",
|
4674
|
+
"module": "components/cardbutton/cardbutton.component.js"
|
4675
|
+
}
|
4676
|
+
}
|
4677
|
+
]
|
4678
|
+
},
|
4679
|
+
{
|
4680
|
+
"kind": "javascript-module",
|
4681
|
+
"path": "components/cardcheckbox/cardcheckbox.component.js",
|
4682
|
+
"declarations": [
|
4683
|
+
{
|
4684
|
+
"kind": "class",
|
4685
|
+
"description": "cardcheckbox component extends `mdc-card` and supports checkbox selection interaction addtionally.\n\nWhile using this component within a form or group of cards, make sure cards are in a role = \"checkbox-group\".\nThis card would have events for selected and unselected (similar to checkbox)\n\n**Note**: This is a single selection card i.e. interacting anywhere on the card would toggle the checked state.\nMake sure to pass only non-interactable elements within the slots.\n\nMake sure to pass the `card-title` mandatorily for this card.",
|
4686
|
+
"name": "CardCheckbox",
|
4687
|
+
"slots": [
|
4688
|
+
{
|
4689
|
+
"description": "This slot is for passing the content before the body",
|
4690
|
+
"name": "before-body",
|
4691
|
+
"inheritedFrom": {
|
4692
|
+
"name": "Card",
|
4693
|
+
"module": "src/components/card/card.component.ts"
|
4694
|
+
}
|
4695
|
+
},
|
4696
|
+
{
|
4697
|
+
"description": "This slot is for passing the text content for the card",
|
4698
|
+
"name": "body",
|
4699
|
+
"inheritedFrom": {
|
4700
|
+
"name": "Card",
|
4701
|
+
"module": "src/components/card/card.component.ts"
|
4702
|
+
}
|
4703
|
+
},
|
4704
|
+
{
|
4705
|
+
"description": "This slot is for passing the content after the body",
|
4706
|
+
"name": "after-body",
|
4707
|
+
"inheritedFrom": {
|
4708
|
+
"name": "Card",
|
4709
|
+
"module": "src/components/card/card.component.ts"
|
4710
|
+
}
|
4711
|
+
},
|
4712
|
+
{
|
4713
|
+
"description": "This slot is for passing `mdc-link` component within the footer section.",
|
4714
|
+
"name": "footer-link",
|
4715
|
+
"inheritedFrom": {
|
4716
|
+
"name": "Card",
|
4717
|
+
"module": "src/components/card/card.component.ts"
|
4718
|
+
}
|
4719
|
+
},
|
4720
|
+
{
|
4721
|
+
"description": "This slot is for passing primary variant of `mdc-button` component within the footer section.",
|
4722
|
+
"name": "footer-button-primary",
|
4723
|
+
"inheritedFrom": {
|
4724
|
+
"name": "Card",
|
4725
|
+
"module": "src/components/card/card.component.ts"
|
4726
|
+
}
|
4727
|
+
},
|
4728
|
+
{
|
4729
|
+
"description": "This slot is for passing secondary variant of `mdc-button` component within the footer section.",
|
4730
|
+
"name": "footer-button-secondary",
|
4731
|
+
"inheritedFrom": {
|
4732
|
+
"name": "Card",
|
4733
|
+
"module": "src/components/card/card.component.ts"
|
4734
|
+
}
|
4735
|
+
}
|
4736
|
+
],
|
4737
|
+
"members": [
|
4738
|
+
{
|
4739
|
+
"kind": "field",
|
4740
|
+
"name": "checked",
|
4741
|
+
"type": {
|
4742
|
+
"text": "boolean"
|
4743
|
+
},
|
4744
|
+
"default": "false",
|
4745
|
+
"description": "The checked state of the card",
|
4746
|
+
"attribute": "checked",
|
4747
|
+
"reflects": true
|
4748
|
+
},
|
4749
|
+
{
|
4750
|
+
"kind": "field",
|
4751
|
+
"name": "selectionType",
|
4752
|
+
"type": {
|
4753
|
+
"text": "SelectionType"
|
4754
|
+
},
|
4755
|
+
"description": "The selection type of the card. It can either be set to 'check' or 'checkbox'",
|
4756
|
+
"default": "'check'",
|
4757
|
+
"attribute": "selection-type"
|
4758
|
+
},
|
4759
|
+
{
|
4760
|
+
"kind": "method",
|
4761
|
+
"name": "toggleChecked",
|
4762
|
+
"privacy": "private",
|
4763
|
+
"description": "Toggles the checked state"
|
4764
|
+
},
|
4765
|
+
{
|
4766
|
+
"kind": "method",
|
4767
|
+
"name": "toggleOnEnter",
|
4768
|
+
"privacy": "private",
|
4769
|
+
"parameters": [
|
4770
|
+
{
|
4771
|
+
"name": "event",
|
4772
|
+
"type": {
|
4773
|
+
"text": "KeyboardEvent"
|
4774
|
+
},
|
4775
|
+
"description": "The keyboard event"
|
4776
|
+
}
|
4777
|
+
],
|
4778
|
+
"description": "Toggles the checked state when enter key is used"
|
4779
|
+
},
|
4780
|
+
{
|
4781
|
+
"kind": "method",
|
4782
|
+
"name": "toggleOnSpace",
|
4783
|
+
"privacy": "private",
|
4784
|
+
"parameters": [
|
4785
|
+
{
|
4786
|
+
"name": "event",
|
4787
|
+
"type": {
|
4788
|
+
"text": "KeyboardEvent"
|
4789
|
+
},
|
4790
|
+
"description": "The keyboard event"
|
4791
|
+
}
|
4792
|
+
],
|
4793
|
+
"description": "Toggles the checked state when space key is used"
|
4794
|
+
},
|
4795
|
+
{
|
4796
|
+
"kind": "method",
|
4797
|
+
"name": "renderSelection",
|
4798
|
+
"privacy": "private",
|
4799
|
+
"description": "Renders the selection icon or checkbox based on the selection type",
|
4800
|
+
"return": {
|
4801
|
+
"type": {
|
4802
|
+
"text": ""
|
4803
|
+
}
|
4804
|
+
}
|
4805
|
+
},
|
4806
|
+
{
|
4807
|
+
"kind": "method",
|
4808
|
+
"name": "renderHeader",
|
4809
|
+
"privacy": "protected",
|
4810
|
+
"description": "Renders the header of the card",
|
4811
|
+
"return": {
|
4812
|
+
"type": {
|
4813
|
+
"text": ""
|
4814
|
+
}
|
4815
|
+
},
|
4816
|
+
"inheritedFrom": {
|
4817
|
+
"name": "Card",
|
4818
|
+
"module": "components/card/card.component.js"
|
4819
|
+
}
|
4820
|
+
},
|
4821
|
+
{
|
4822
|
+
"kind": "field",
|
4823
|
+
"name": "disabled",
|
4824
|
+
"type": {
|
4825
|
+
"text": "boolean | undefined"
|
4826
|
+
},
|
4827
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
4828
|
+
"default": "undefined",
|
4829
|
+
"attribute": "disabled",
|
4830
|
+
"reflects": true,
|
4831
|
+
"inheritedFrom": {
|
4832
|
+
"name": "DisabledMixin",
|
4833
|
+
"module": "utils/mixins/DisabledMixin.js"
|
4834
|
+
}
|
4835
|
+
},
|
4836
|
+
{
|
4837
|
+
"kind": "field",
|
4838
|
+
"name": "tabIndex",
|
4839
|
+
"type": {
|
4840
|
+
"text": "number"
|
4841
|
+
},
|
4842
|
+
"default": "0",
|
4843
|
+
"description": "This property specifies the tab order of the element.",
|
4844
|
+
"attribute": "tabIndex",
|
4845
|
+
"reflects": true,
|
4846
|
+
"inheritedFrom": {
|
4847
|
+
"name": "TabIndexMixin",
|
4848
|
+
"module": "utils/mixins/TabIndexMixin.js"
|
4849
|
+
}
|
4850
|
+
},
|
4851
|
+
{
|
4852
|
+
"kind": "field",
|
4853
|
+
"name": "cardTitle",
|
4854
|
+
"type": {
|
4855
|
+
"text": "string"
|
4856
|
+
},
|
4857
|
+
"default": "''",
|
4858
|
+
"description": "The title of the card - part of header section",
|
4859
|
+
"attribute": "card-title",
|
4860
|
+
"inheritedFrom": {
|
4861
|
+
"name": "Card",
|
4862
|
+
"module": "components/card/card.component.js"
|
4863
|
+
}
|
4864
|
+
},
|
4865
|
+
{
|
4866
|
+
"kind": "field",
|
4867
|
+
"name": "subtitle",
|
4868
|
+
"type": {
|
4869
|
+
"text": "string"
|
4870
|
+
},
|
4871
|
+
"default": "''",
|
4872
|
+
"description": "The subtitle of the card - part of header section",
|
4873
|
+
"attribute": "subtitle",
|
4874
|
+
"inheritedFrom": {
|
4875
|
+
"name": "Card",
|
4876
|
+
"module": "components/card/card.component.js"
|
4877
|
+
}
|
4878
|
+
},
|
4879
|
+
{
|
4880
|
+
"kind": "field",
|
4881
|
+
"name": "imageSrc",
|
4882
|
+
"type": {
|
4883
|
+
"text": "string"
|
4884
|
+
},
|
4885
|
+
"default": "''",
|
4886
|
+
"description": "The image source URL to render on the card",
|
4887
|
+
"attribute": "image-src",
|
4888
|
+
"inheritedFrom": {
|
4889
|
+
"name": "Card",
|
4890
|
+
"module": "components/card/card.component.js"
|
4891
|
+
}
|
4892
|
+
},
|
4893
|
+
{
|
4894
|
+
"kind": "field",
|
4895
|
+
"name": "imageAlt",
|
4896
|
+
"type": {
|
4897
|
+
"text": "string"
|
4898
|
+
},
|
4899
|
+
"default": "''",
|
4900
|
+
"description": "The image alt for accessibility support",
|
4901
|
+
"attribute": "image-alt",
|
4902
|
+
"inheritedFrom": {
|
4903
|
+
"name": "Card",
|
4904
|
+
"module": "components/card/card.component.js"
|
4905
|
+
}
|
4906
|
+
},
|
4907
|
+
{
|
4908
|
+
"kind": "field",
|
4909
|
+
"name": "variant",
|
4910
|
+
"type": {
|
4911
|
+
"text": "CardVariant"
|
4912
|
+
},
|
4913
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
4914
|
+
"default": "'border'",
|
4915
|
+
"attribute": "variant",
|
4916
|
+
"inheritedFrom": {
|
4917
|
+
"name": "Card",
|
4918
|
+
"module": "components/card/card.component.js"
|
4919
|
+
}
|
4920
|
+
},
|
4921
|
+
{
|
4922
|
+
"kind": "field",
|
4923
|
+
"name": "orientation",
|
4924
|
+
"type": {
|
4925
|
+
"text": "CardOrientation"
|
4926
|
+
},
|
4927
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
4928
|
+
"default": "'vertical'",
|
4929
|
+
"attribute": "orientation",
|
4930
|
+
"reflects": true,
|
4931
|
+
"inheritedFrom": {
|
4932
|
+
"name": "Card",
|
4933
|
+
"module": "components/card/card.component.js"
|
4934
|
+
}
|
4935
|
+
},
|
4936
|
+
{
|
4937
|
+
"kind": "field",
|
4938
|
+
"name": "titleTagName",
|
4939
|
+
"type": {
|
4940
|
+
"text": "TagNameType"
|
4941
|
+
},
|
4942
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
4943
|
+
"default": "'span'",
|
4944
|
+
"attribute": "title-tag-name",
|
4945
|
+
"inheritedFrom": {
|
4946
|
+
"name": "Card",
|
4947
|
+
"module": "components/card/card.component.js"
|
4948
|
+
}
|
4949
|
+
},
|
4950
|
+
{
|
4951
|
+
"kind": "field",
|
4952
|
+
"name": "subtitleTagName",
|
4953
|
+
"type": {
|
4954
|
+
"text": "TagNameType"
|
4955
|
+
},
|
4956
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
4957
|
+
"default": "'span'",
|
4958
|
+
"attribute": "subtitle-tag-name",
|
4959
|
+
"inheritedFrom": {
|
4960
|
+
"name": "Card",
|
4961
|
+
"module": "components/card/card.component.js"
|
4962
|
+
}
|
4963
|
+
},
|
4964
|
+
{
|
4965
|
+
"kind": "field",
|
4966
|
+
"name": "iconName",
|
4967
|
+
"type": {
|
4968
|
+
"text": "IconNames | undefined"
|
4969
|
+
},
|
4970
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
4971
|
+
"attribute": "icon-name",
|
4972
|
+
"inheritedFrom": {
|
4973
|
+
"name": "Card",
|
4974
|
+
"module": "components/card/card.component.js"
|
4975
|
+
}
|
4976
|
+
},
|
4977
|
+
{
|
4978
|
+
"kind": "method",
|
4979
|
+
"name": "renderImage",
|
4980
|
+
"description": "Renders the image on the card if image source is provided",
|
4981
|
+
"return": {
|
4982
|
+
"type": {
|
4983
|
+
"text": ""
|
4984
|
+
}
|
4985
|
+
},
|
4986
|
+
"inheritedFrom": {
|
4987
|
+
"name": "Card",
|
4988
|
+
"module": "components/card/card.component.js"
|
4989
|
+
}
|
4990
|
+
},
|
4991
|
+
{
|
4992
|
+
"kind": "method",
|
4993
|
+
"name": "renderIcon",
|
4994
|
+
"description": "Renders the icon on the card if icon name is provided",
|
4995
|
+
"return": {
|
4996
|
+
"type": {
|
4997
|
+
"text": ""
|
4998
|
+
}
|
4999
|
+
},
|
5000
|
+
"inheritedFrom": {
|
5001
|
+
"name": "Card",
|
5002
|
+
"module": "components/card/card.component.js"
|
5003
|
+
}
|
5004
|
+
},
|
5005
|
+
{
|
5006
|
+
"kind": "method",
|
5007
|
+
"name": "renderTitle",
|
5008
|
+
"description": "Renders the title and subtitle on the card",
|
5009
|
+
"return": {
|
5010
|
+
"type": {
|
5011
|
+
"text": ""
|
5012
|
+
}
|
5013
|
+
},
|
5014
|
+
"inheritedFrom": {
|
5015
|
+
"name": "Card",
|
5016
|
+
"module": "components/card/card.component.js"
|
5017
|
+
}
|
5018
|
+
}
|
5019
|
+
],
|
5020
|
+
"events": [
|
5021
|
+
{
|
5022
|
+
"description": "(React: onClick) Event that gets dispatched when the card is clicked. It toggles the checked state.",
|
5023
|
+
"name": "click",
|
5024
|
+
"reactName": "onClick"
|
5025
|
+
},
|
5026
|
+
{
|
5027
|
+
"description": "(React: onKeyDown) This event is dispatched when a key is pressed down on the card. It toggles the checked state when enter key is used.",
|
5028
|
+
"name": "keydown",
|
5029
|
+
"reactName": "onKeyDown"
|
5030
|
+
},
|
5031
|
+
{
|
5032
|
+
"description": "(React: onKeyUp) This event is dispatched when a key is released on the card. It toggles the checked state when space key is used.",
|
5033
|
+
"name": "keyup",
|
5034
|
+
"reactName": "onKeyUp"
|
5035
|
+
},
|
5036
|
+
{
|
5037
|
+
"description": "(React: onChange) Event that gets dispatched when the card state changes.",
|
5038
|
+
"name": "change",
|
5039
|
+
"reactName": "onChange"
|
5040
|
+
},
|
5041
|
+
{
|
5042
|
+
"description": "(React: onFocus) Event that gets dispatched when the card receives focus.",
|
5043
|
+
"name": "focus",
|
5044
|
+
"reactName": "onFocus"
|
5045
|
+
}
|
5046
|
+
],
|
5047
|
+
"attributes": [
|
5048
|
+
{
|
5049
|
+
"name": "checked",
|
5050
|
+
"type": {
|
5051
|
+
"text": "boolean"
|
5052
|
+
},
|
5053
|
+
"default": "false",
|
5054
|
+
"description": "The checked state of the card",
|
5055
|
+
"fieldName": "checked"
|
5056
|
+
},
|
5057
|
+
{
|
5058
|
+
"name": "selection-type",
|
5059
|
+
"type": {
|
5060
|
+
"text": "SelectionType"
|
5061
|
+
},
|
5062
|
+
"description": "The selection type of the card. It can either be set to 'check' or 'checkbox'",
|
5063
|
+
"default": "'check'",
|
5064
|
+
"fieldName": "selectionType"
|
5065
|
+
},
|
5066
|
+
{
|
5067
|
+
"name": "disabled",
|
5068
|
+
"type": {
|
5069
|
+
"text": "boolean | undefined"
|
5070
|
+
},
|
5071
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
5072
|
+
"default": "undefined",
|
5073
|
+
"fieldName": "disabled",
|
5074
|
+
"inheritedFrom": {
|
5075
|
+
"name": "DisabledMixin",
|
5076
|
+
"module": "src/utils/mixins/DisabledMixin.ts"
|
5077
|
+
}
|
5078
|
+
},
|
5079
|
+
{
|
5080
|
+
"name": "tabIndex",
|
5081
|
+
"type": {
|
5082
|
+
"text": "number"
|
5083
|
+
},
|
5084
|
+
"default": "0",
|
5085
|
+
"description": "This property specifies the tab order of the element.",
|
5086
|
+
"fieldName": "tabIndex",
|
5087
|
+
"inheritedFrom": {
|
5088
|
+
"name": "TabIndexMixin",
|
5089
|
+
"module": "src/utils/mixins/TabIndexMixin.ts"
|
5090
|
+
}
|
5091
|
+
},
|
5092
|
+
{
|
5093
|
+
"name": "card-title",
|
5094
|
+
"type": {
|
5095
|
+
"text": "string"
|
5096
|
+
},
|
5097
|
+
"default": "''",
|
5098
|
+
"description": "The title of the card - part of header section",
|
5099
|
+
"fieldName": "cardTitle",
|
5100
|
+
"inheritedFrom": {
|
5101
|
+
"name": "Card",
|
5102
|
+
"module": "src/components/card/card.component.ts"
|
5103
|
+
}
|
5104
|
+
},
|
5105
|
+
{
|
5106
|
+
"name": "subtitle",
|
5107
|
+
"type": {
|
5108
|
+
"text": "string"
|
5109
|
+
},
|
5110
|
+
"default": "''",
|
5111
|
+
"description": "The subtitle of the card - part of header section",
|
5112
|
+
"fieldName": "subtitle",
|
5113
|
+
"inheritedFrom": {
|
5114
|
+
"name": "Card",
|
5115
|
+
"module": "src/components/card/card.component.ts"
|
5116
|
+
}
|
5117
|
+
},
|
5118
|
+
{
|
5119
|
+
"name": "image-src",
|
5120
|
+
"type": {
|
5121
|
+
"text": "string"
|
5122
|
+
},
|
5123
|
+
"default": "''",
|
5124
|
+
"description": "The image source URL to render on the card",
|
5125
|
+
"fieldName": "imageSrc",
|
5126
|
+
"inheritedFrom": {
|
5127
|
+
"name": "Card",
|
5128
|
+
"module": "src/components/card/card.component.ts"
|
5129
|
+
}
|
5130
|
+
},
|
5131
|
+
{
|
5132
|
+
"name": "image-alt",
|
5133
|
+
"type": {
|
5134
|
+
"text": "string"
|
5135
|
+
},
|
5136
|
+
"default": "''",
|
5137
|
+
"description": "The image alt for accessibility support",
|
5138
|
+
"fieldName": "imageAlt",
|
5139
|
+
"inheritedFrom": {
|
5140
|
+
"name": "Card",
|
5141
|
+
"module": "src/components/card/card.component.ts"
|
5142
|
+
}
|
5143
|
+
},
|
5144
|
+
{
|
5145
|
+
"name": "variant",
|
5146
|
+
"type": {
|
5147
|
+
"text": "CardVariant"
|
5148
|
+
},
|
5149
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
5150
|
+
"default": "'border'",
|
5151
|
+
"fieldName": "variant",
|
5152
|
+
"inheritedFrom": {
|
5153
|
+
"name": "Card",
|
5154
|
+
"module": "src/components/card/card.component.ts"
|
5155
|
+
}
|
5156
|
+
},
|
5157
|
+
{
|
5158
|
+
"name": "orientation",
|
5159
|
+
"type": {
|
5160
|
+
"text": "CardOrientation"
|
5161
|
+
},
|
5162
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
5163
|
+
"default": "'vertical'",
|
5164
|
+
"fieldName": "orientation",
|
5165
|
+
"inheritedFrom": {
|
5166
|
+
"name": "Card",
|
5167
|
+
"module": "src/components/card/card.component.ts"
|
5168
|
+
}
|
5169
|
+
},
|
5170
|
+
{
|
5171
|
+
"name": "title-tag-name",
|
5172
|
+
"type": {
|
5173
|
+
"text": "TagNameType"
|
5174
|
+
},
|
5175
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
5176
|
+
"default": "'span'",
|
5177
|
+
"fieldName": "titleTagName",
|
5178
|
+
"inheritedFrom": {
|
5179
|
+
"name": "Card",
|
5180
|
+
"module": "src/components/card/card.component.ts"
|
5181
|
+
}
|
5182
|
+
},
|
5183
|
+
{
|
5184
|
+
"name": "subtitle-tag-name",
|
5185
|
+
"type": {
|
5186
|
+
"text": "TagNameType"
|
5187
|
+
},
|
5188
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
5189
|
+
"default": "'span'",
|
5190
|
+
"fieldName": "subtitleTagName",
|
5191
|
+
"inheritedFrom": {
|
5192
|
+
"name": "Card",
|
5193
|
+
"module": "src/components/card/card.component.ts"
|
5194
|
+
}
|
5195
|
+
},
|
5196
|
+
{
|
5197
|
+
"name": "icon-name",
|
5198
|
+
"type": {
|
5199
|
+
"text": "IconNames | undefined"
|
5200
|
+
},
|
5201
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
5202
|
+
"fieldName": "iconName",
|
5203
|
+
"inheritedFrom": {
|
5204
|
+
"name": "Card",
|
5205
|
+
"module": "src/components/card/card.component.ts"
|
5206
|
+
}
|
5207
|
+
}
|
5208
|
+
],
|
5209
|
+
"mixins": [
|
5210
|
+
{
|
5211
|
+
"name": "DisabledMixin",
|
5212
|
+
"module": "/src/utils/mixins/DisabledMixin"
|
5213
|
+
},
|
5214
|
+
{
|
5215
|
+
"name": "TabIndexMixin",
|
5216
|
+
"module": "/src/utils/mixins/TabIndexMixin"
|
5217
|
+
}
|
5218
|
+
],
|
5219
|
+
"superclass": {
|
5220
|
+
"name": "Card",
|
5221
|
+
"module": "/src/components/card/card.component"
|
5222
|
+
},
|
5223
|
+
"tagName": "mdc-cardcheckbox",
|
5224
|
+
"jsDoc": "/**\n * cardcheckbox component extends `mdc-card` and supports checkbox selection interaction addtionally.\n *\n * While using this component within a form or group of cards, make sure cards are in a role = \"checkbox-group\".\n * This card would have events for selected and unselected (similar to checkbox)\n *\n * **Note**: This is a single selection card i.e. interacting anywhere on the card would toggle the checked state.\n * Make sure to pass only non-interactable elements within the slots.\n *\n * Make sure to pass the `card-title` mandatorily for this card.\n *\n * @tagname mdc-cardcheckbox\n *\n * @dependency mdc-icon\n * @dependency mdc-staticcheckbox\n * @dependency mdc-text\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n *\n * @event click - (React: onClick) Event that gets dispatched when the card is clicked. It toggles the checked state.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the card.\n * It toggles the checked state when enter key is used.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.\n * It toggles the checked state when space key is used.\n * @event change - (React: onChange) Event that gets dispatched when the card state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.\n *\n */",
|
5225
|
+
"customElement": true
|
5226
|
+
}
|
5227
|
+
],
|
5228
|
+
"exports": [
|
5229
|
+
{
|
5230
|
+
"kind": "js",
|
5231
|
+
"name": "default",
|
5232
|
+
"declaration": {
|
5233
|
+
"name": "CardCheckbox",
|
5234
|
+
"module": "components/cardcheckbox/cardcheckbox.component.js"
|
5235
|
+
}
|
5236
|
+
}
|
5237
|
+
]
|
5238
|
+
},
|
5239
|
+
{
|
5240
|
+
"kind": "javascript-module",
|
5241
|
+
"path": "components/cardradio/cardradio.component.js",
|
5242
|
+
"declarations": [
|
5243
|
+
{
|
5244
|
+
"kind": "class",
|
5245
|
+
"description": "cardradio component extends `mdc-card` and supports radio selection interaction addtionally.\n\nWhile using this component within a form or group of cards, make sure cards are in a role = \"radio-group\".\nThis card would have events for selected and unselected (similar to radio)\n\n**Note**: This is a single selection card i.e. interacting anywhere on the card would toggle the checked state.\nMake sure to pass only non-interactable elements within the slots.\n\nMake sure to pass the `card-title` mandatorily for this card.",
|
5246
|
+
"name": "CardRadio",
|
5247
|
+
"slots": [
|
5248
|
+
{
|
5249
|
+
"description": "This slot is for passing the content before the body",
|
5250
|
+
"name": "before-body",
|
5251
|
+
"inheritedFrom": {
|
5252
|
+
"name": "Card",
|
5253
|
+
"module": "src/components/card/card.component.ts"
|
5254
|
+
}
|
5255
|
+
},
|
5256
|
+
{
|
5257
|
+
"description": "This slot is for passing the text content for the card",
|
5258
|
+
"name": "body",
|
5259
|
+
"inheritedFrom": {
|
5260
|
+
"name": "Card",
|
5261
|
+
"module": "src/components/card/card.component.ts"
|
5262
|
+
}
|
5263
|
+
},
|
5264
|
+
{
|
5265
|
+
"description": "This slot is for passing the content after the body",
|
5266
|
+
"name": "after-body",
|
5267
|
+
"inheritedFrom": {
|
5268
|
+
"name": "Card",
|
5269
|
+
"module": "src/components/card/card.component.ts"
|
5270
|
+
}
|
5271
|
+
},
|
5272
|
+
{
|
5273
|
+
"description": "This slot is for passing `mdc-link` component within the footer section.",
|
5274
|
+
"name": "footer-link",
|
5275
|
+
"inheritedFrom": {
|
5276
|
+
"name": "Card",
|
5277
|
+
"module": "src/components/card/card.component.ts"
|
5278
|
+
}
|
5279
|
+
},
|
5280
|
+
{
|
5281
|
+
"description": "This slot is for passing primary variant of `mdc-button` component within the footer section.",
|
5282
|
+
"name": "footer-button-primary",
|
5283
|
+
"inheritedFrom": {
|
5284
|
+
"name": "Card",
|
5285
|
+
"module": "src/components/card/card.component.ts"
|
5286
|
+
}
|
5287
|
+
},
|
5288
|
+
{
|
5289
|
+
"description": "This slot is for passing secondary variant of `mdc-button` component within the footer section.",
|
5290
|
+
"name": "footer-button-secondary",
|
5291
|
+
"inheritedFrom": {
|
5292
|
+
"name": "Card",
|
5293
|
+
"module": "src/components/card/card.component.ts"
|
5294
|
+
}
|
5295
|
+
}
|
5296
|
+
],
|
5297
|
+
"members": [
|
5298
|
+
{
|
5299
|
+
"kind": "field",
|
5300
|
+
"name": "checked",
|
5301
|
+
"type": {
|
5302
|
+
"text": "boolean"
|
5303
|
+
},
|
5304
|
+
"default": "false",
|
5305
|
+
"description": "The checked state of the card",
|
5306
|
+
"attribute": "checked",
|
5307
|
+
"reflects": true
|
5308
|
+
},
|
5309
|
+
{
|
5310
|
+
"kind": "field",
|
5311
|
+
"name": "name",
|
5312
|
+
"type": {
|
5313
|
+
"text": "string"
|
5314
|
+
},
|
5315
|
+
"default": "''",
|
5316
|
+
"description": "The name of the radio.",
|
5317
|
+
"attribute": "name"
|
5318
|
+
},
|
5319
|
+
{
|
5320
|
+
"kind": "method",
|
5321
|
+
"name": "getAllCardsWithinSameGroup",
|
5322
|
+
"privacy": "private",
|
5323
|
+
"return": {
|
5324
|
+
"type": {
|
5325
|
+
"text": "CardRadio[]"
|
5326
|
+
}
|
5327
|
+
},
|
5328
|
+
"description": "Returns all cards within the same group (name)."
|
5329
|
+
},
|
5330
|
+
{
|
5331
|
+
"kind": "method",
|
5332
|
+
"name": "toggleChecked",
|
5333
|
+
"privacy": "private",
|
5334
|
+
"return": {
|
5335
|
+
"type": {
|
5336
|
+
"text": "void"
|
5337
|
+
}
|
5338
|
+
},
|
5339
|
+
"description": "Handles the change event on the radio element.\nThis will toggle the state of the radio element.\nDispatches the change event."
|
5340
|
+
},
|
5341
|
+
{
|
5342
|
+
"kind": "method",
|
5343
|
+
"name": "toggleOnEnter",
|
5344
|
+
"privacy": "private",
|
5345
|
+
"parameters": [
|
5346
|
+
{
|
5347
|
+
"name": "event",
|
5348
|
+
"type": {
|
5349
|
+
"text": "KeyboardEvent"
|
5350
|
+
},
|
5351
|
+
"description": "The keyboard event"
|
5352
|
+
}
|
5353
|
+
],
|
5354
|
+
"description": "Toggles the checked state when enter key is used"
|
5355
|
+
},
|
5356
|
+
{
|
5357
|
+
"kind": "method",
|
5358
|
+
"name": "toggleOnSpace",
|
5359
|
+
"privacy": "private",
|
5360
|
+
"parameters": [
|
5361
|
+
{
|
5362
|
+
"name": "event",
|
5363
|
+
"type": {
|
5364
|
+
"text": "KeyboardEvent"
|
5365
|
+
},
|
5366
|
+
"description": "The keyboard event"
|
5367
|
+
}
|
5368
|
+
],
|
5369
|
+
"description": "Toggles the checked state when space key is used"
|
5370
|
+
},
|
5371
|
+
{
|
5372
|
+
"kind": "method",
|
5373
|
+
"name": "renderHeader",
|
5374
|
+
"privacy": "protected",
|
5375
|
+
"description": "Renders the header of the card",
|
5376
|
+
"return": {
|
5377
|
+
"type": {
|
5378
|
+
"text": ""
|
5379
|
+
}
|
5380
|
+
},
|
5381
|
+
"inheritedFrom": {
|
5382
|
+
"name": "Card",
|
5383
|
+
"module": "components/card/card.component.js"
|
5384
|
+
}
|
5385
|
+
},
|
5386
|
+
{
|
5387
|
+
"kind": "field",
|
5388
|
+
"name": "disabled",
|
5389
|
+
"type": {
|
5390
|
+
"text": "boolean | undefined"
|
5391
|
+
},
|
5392
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
5393
|
+
"default": "undefined",
|
5394
|
+
"attribute": "disabled",
|
5395
|
+
"reflects": true,
|
5396
|
+
"inheritedFrom": {
|
5397
|
+
"name": "DisabledMixin",
|
5398
|
+
"module": "utils/mixins/DisabledMixin.js"
|
5399
|
+
}
|
5400
|
+
},
|
5401
|
+
{
|
5402
|
+
"kind": "field",
|
5403
|
+
"name": "tabIndex",
|
5404
|
+
"type": {
|
5405
|
+
"text": "number"
|
5406
|
+
},
|
5407
|
+
"default": "0",
|
5408
|
+
"description": "This property specifies the tab order of the element.",
|
5409
|
+
"attribute": "tabIndex",
|
5410
|
+
"reflects": true,
|
5411
|
+
"inheritedFrom": {
|
5412
|
+
"name": "TabIndexMixin",
|
5413
|
+
"module": "utils/mixins/TabIndexMixin.js"
|
5414
|
+
}
|
5415
|
+
},
|
5416
|
+
{
|
5417
|
+
"kind": "field",
|
5418
|
+
"name": "cardTitle",
|
5419
|
+
"type": {
|
5420
|
+
"text": "string"
|
5421
|
+
},
|
5422
|
+
"default": "''",
|
5423
|
+
"description": "The title of the card - part of header section",
|
5424
|
+
"attribute": "card-title",
|
5425
|
+
"inheritedFrom": {
|
5426
|
+
"name": "Card",
|
5427
|
+
"module": "components/card/card.component.js"
|
5428
|
+
}
|
5429
|
+
},
|
5430
|
+
{
|
5431
|
+
"kind": "field",
|
5432
|
+
"name": "subtitle",
|
5433
|
+
"type": {
|
5434
|
+
"text": "string"
|
5435
|
+
},
|
5436
|
+
"default": "''",
|
5437
|
+
"description": "The subtitle of the card - part of header section",
|
5438
|
+
"attribute": "subtitle",
|
5439
|
+
"inheritedFrom": {
|
5440
|
+
"name": "Card",
|
5441
|
+
"module": "components/card/card.component.js"
|
5442
|
+
}
|
5443
|
+
},
|
5444
|
+
{
|
5445
|
+
"kind": "field",
|
5446
|
+
"name": "imageSrc",
|
5447
|
+
"type": {
|
5448
|
+
"text": "string"
|
5449
|
+
},
|
5450
|
+
"default": "''",
|
5451
|
+
"description": "The image source URL to render on the card",
|
5452
|
+
"attribute": "image-src",
|
5453
|
+
"inheritedFrom": {
|
5454
|
+
"name": "Card",
|
5455
|
+
"module": "components/card/card.component.js"
|
5456
|
+
}
|
5457
|
+
},
|
5458
|
+
{
|
5459
|
+
"kind": "field",
|
5460
|
+
"name": "imageAlt",
|
5461
|
+
"type": {
|
5462
|
+
"text": "string"
|
5463
|
+
},
|
5464
|
+
"default": "''",
|
5465
|
+
"description": "The image alt for accessibility support",
|
5466
|
+
"attribute": "image-alt",
|
5467
|
+
"inheritedFrom": {
|
5468
|
+
"name": "Card",
|
5469
|
+
"module": "components/card/card.component.js"
|
5470
|
+
}
|
5471
|
+
},
|
5472
|
+
{
|
5473
|
+
"kind": "field",
|
5474
|
+
"name": "variant",
|
5475
|
+
"type": {
|
5476
|
+
"text": "CardVariant"
|
5477
|
+
},
|
5478
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
5479
|
+
"default": "'border'",
|
5480
|
+
"attribute": "variant",
|
5481
|
+
"inheritedFrom": {
|
5482
|
+
"name": "Card",
|
5483
|
+
"module": "components/card/card.component.js"
|
5484
|
+
}
|
5485
|
+
},
|
5486
|
+
{
|
5487
|
+
"kind": "field",
|
5488
|
+
"name": "orientation",
|
5489
|
+
"type": {
|
5490
|
+
"text": "CardOrientation"
|
5491
|
+
},
|
5492
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
5493
|
+
"default": "'vertical'",
|
5494
|
+
"attribute": "orientation",
|
5495
|
+
"reflects": true,
|
5496
|
+
"inheritedFrom": {
|
5497
|
+
"name": "Card",
|
5498
|
+
"module": "components/card/card.component.js"
|
5499
|
+
}
|
5500
|
+
},
|
5501
|
+
{
|
5502
|
+
"kind": "field",
|
5503
|
+
"name": "titleTagName",
|
5504
|
+
"type": {
|
5505
|
+
"text": "TagNameType"
|
5506
|
+
},
|
5507
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
5508
|
+
"default": "'span'",
|
5509
|
+
"attribute": "title-tag-name",
|
5510
|
+
"inheritedFrom": {
|
5511
|
+
"name": "Card",
|
5512
|
+
"module": "components/card/card.component.js"
|
5513
|
+
}
|
5514
|
+
},
|
5515
|
+
{
|
5516
|
+
"kind": "field",
|
5517
|
+
"name": "subtitleTagName",
|
5518
|
+
"type": {
|
5519
|
+
"text": "TagNameType"
|
5520
|
+
},
|
5521
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
5522
|
+
"default": "'span'",
|
5523
|
+
"attribute": "subtitle-tag-name",
|
5524
|
+
"inheritedFrom": {
|
5525
|
+
"name": "Card",
|
5526
|
+
"module": "components/card/card.component.js"
|
5527
|
+
}
|
5528
|
+
},
|
5529
|
+
{
|
5530
|
+
"kind": "field",
|
5531
|
+
"name": "iconName",
|
5532
|
+
"type": {
|
5533
|
+
"text": "IconNames | undefined"
|
5534
|
+
},
|
5535
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
5536
|
+
"attribute": "icon-name",
|
5537
|
+
"inheritedFrom": {
|
5538
|
+
"name": "Card",
|
5539
|
+
"module": "components/card/card.component.js"
|
5540
|
+
}
|
5541
|
+
},
|
5542
|
+
{
|
5543
|
+
"kind": "method",
|
5544
|
+
"name": "renderImage",
|
5545
|
+
"description": "Renders the image on the card if image source is provided",
|
5546
|
+
"return": {
|
5547
|
+
"type": {
|
5548
|
+
"text": ""
|
5549
|
+
}
|
5550
|
+
},
|
5551
|
+
"inheritedFrom": {
|
5552
|
+
"name": "Card",
|
5553
|
+
"module": "components/card/card.component.js"
|
5554
|
+
}
|
5555
|
+
},
|
5556
|
+
{
|
5557
|
+
"kind": "method",
|
5558
|
+
"name": "renderIcon",
|
5559
|
+
"description": "Renders the icon on the card if icon name is provided",
|
5560
|
+
"return": {
|
5561
|
+
"type": {
|
5562
|
+
"text": ""
|
5563
|
+
}
|
5564
|
+
},
|
5565
|
+
"inheritedFrom": {
|
5566
|
+
"name": "Card",
|
5567
|
+
"module": "components/card/card.component.js"
|
5568
|
+
}
|
5569
|
+
},
|
5570
|
+
{
|
5571
|
+
"kind": "method",
|
5572
|
+
"name": "renderTitle",
|
5573
|
+
"description": "Renders the title and subtitle on the card",
|
5574
|
+
"return": {
|
5575
|
+
"type": {
|
5576
|
+
"text": ""
|
5577
|
+
}
|
5578
|
+
},
|
5579
|
+
"inheritedFrom": {
|
5580
|
+
"name": "Card",
|
5581
|
+
"module": "components/card/card.component.js"
|
5582
|
+
}
|
5583
|
+
}
|
5584
|
+
],
|
5585
|
+
"events": [
|
5586
|
+
{
|
5587
|
+
"description": "(React: onClick) Event that gets dispatched when the card is clicked. It toggles the checked state.",
|
5588
|
+
"name": "click",
|
5589
|
+
"reactName": "onClick"
|
5590
|
+
},
|
5591
|
+
{
|
5592
|
+
"description": "(React: onKeyDown) This event is dispatched when a key is pressed down on the card. It toggles the checked state when enter key is used.",
|
5593
|
+
"name": "keydown",
|
5594
|
+
"reactName": "onKeyDown"
|
5595
|
+
},
|
5596
|
+
{
|
5597
|
+
"description": "(React: onKeyUp) This event is dispatched when a key is released on the card. It toggles the checked state when space key is used.",
|
5598
|
+
"name": "keyup",
|
5599
|
+
"reactName": "onKeyUp"
|
5600
|
+
},
|
5601
|
+
{
|
5602
|
+
"description": "(React: onChange) Event that gets dispatched when the card state changes.",
|
5603
|
+
"name": "change",
|
5604
|
+
"reactName": "onChange"
|
5605
|
+
},
|
5606
|
+
{
|
5607
|
+
"description": "(React: onFocus) Event that gets dispatched when the card receives focus.",
|
5608
|
+
"name": "focus",
|
5609
|
+
"reactName": "onFocus"
|
5610
|
+
}
|
5611
|
+
],
|
5612
|
+
"attributes": [
|
5613
|
+
{
|
5614
|
+
"name": "checked",
|
5615
|
+
"type": {
|
5616
|
+
"text": "boolean"
|
5617
|
+
},
|
5618
|
+
"default": "false",
|
5619
|
+
"description": "The checked state of the card",
|
5620
|
+
"fieldName": "checked"
|
5621
|
+
},
|
5622
|
+
{
|
5623
|
+
"name": "name",
|
5624
|
+
"type": {
|
5625
|
+
"text": "string"
|
5626
|
+
},
|
5627
|
+
"default": "''",
|
5628
|
+
"description": "The name of the radio.",
|
5629
|
+
"fieldName": "name"
|
5630
|
+
},
|
5631
|
+
{
|
5632
|
+
"name": "disabled",
|
5633
|
+
"type": {
|
5634
|
+
"text": "boolean | undefined"
|
5635
|
+
},
|
5636
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
5637
|
+
"default": "undefined",
|
5638
|
+
"fieldName": "disabled",
|
5639
|
+
"inheritedFrom": {
|
5640
|
+
"name": "DisabledMixin",
|
5641
|
+
"module": "src/utils/mixins/DisabledMixin.ts"
|
5642
|
+
}
|
5643
|
+
},
|
5644
|
+
{
|
5645
|
+
"name": "tabIndex",
|
5646
|
+
"type": {
|
5647
|
+
"text": "number"
|
5648
|
+
},
|
5649
|
+
"default": "0",
|
5650
|
+
"description": "This property specifies the tab order of the element.",
|
5651
|
+
"fieldName": "tabIndex",
|
5652
|
+
"inheritedFrom": {
|
5653
|
+
"name": "TabIndexMixin",
|
5654
|
+
"module": "src/utils/mixins/TabIndexMixin.ts"
|
5655
|
+
}
|
5656
|
+
},
|
5657
|
+
{
|
5658
|
+
"name": "card-title",
|
5659
|
+
"type": {
|
5660
|
+
"text": "string"
|
5661
|
+
},
|
5662
|
+
"default": "''",
|
5663
|
+
"description": "The title of the card - part of header section",
|
5664
|
+
"fieldName": "cardTitle",
|
5665
|
+
"inheritedFrom": {
|
5666
|
+
"name": "Card",
|
5667
|
+
"module": "src/components/card/card.component.ts"
|
5668
|
+
}
|
5669
|
+
},
|
5670
|
+
{
|
5671
|
+
"name": "subtitle",
|
5672
|
+
"type": {
|
5673
|
+
"text": "string"
|
5674
|
+
},
|
5675
|
+
"default": "''",
|
5676
|
+
"description": "The subtitle of the card - part of header section",
|
5677
|
+
"fieldName": "subtitle",
|
5678
|
+
"inheritedFrom": {
|
5679
|
+
"name": "Card",
|
5680
|
+
"module": "src/components/card/card.component.ts"
|
5681
|
+
}
|
5682
|
+
},
|
5683
|
+
{
|
5684
|
+
"name": "image-src",
|
5685
|
+
"type": {
|
5686
|
+
"text": "string"
|
5687
|
+
},
|
5688
|
+
"default": "''",
|
5689
|
+
"description": "The image source URL to render on the card",
|
5690
|
+
"fieldName": "imageSrc",
|
5691
|
+
"inheritedFrom": {
|
5692
|
+
"name": "Card",
|
5693
|
+
"module": "src/components/card/card.component.ts"
|
5694
|
+
}
|
5695
|
+
},
|
5696
|
+
{
|
5697
|
+
"name": "image-alt",
|
5698
|
+
"type": {
|
5699
|
+
"text": "string"
|
5700
|
+
},
|
5701
|
+
"default": "''",
|
5702
|
+
"description": "The image alt for accessibility support",
|
5703
|
+
"fieldName": "imageAlt",
|
5704
|
+
"inheritedFrom": {
|
5705
|
+
"name": "Card",
|
5706
|
+
"module": "src/components/card/card.component.ts"
|
5707
|
+
}
|
5708
|
+
},
|
5709
|
+
{
|
5710
|
+
"name": "variant",
|
5711
|
+
"type": {
|
5712
|
+
"text": "CardVariant"
|
5713
|
+
},
|
5714
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
5715
|
+
"default": "'border'",
|
5716
|
+
"fieldName": "variant",
|
5717
|
+
"inheritedFrom": {
|
5718
|
+
"name": "Card",
|
5719
|
+
"module": "src/components/card/card.component.ts"
|
5720
|
+
}
|
5721
|
+
},
|
5722
|
+
{
|
5723
|
+
"name": "orientation",
|
5724
|
+
"type": {
|
5725
|
+
"text": "CardOrientation"
|
5726
|
+
},
|
5727
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
5728
|
+
"default": "'vertical'",
|
5729
|
+
"fieldName": "orientation",
|
5730
|
+
"inheritedFrom": {
|
5731
|
+
"name": "Card",
|
5732
|
+
"module": "src/components/card/card.component.ts"
|
5733
|
+
}
|
5734
|
+
},
|
5735
|
+
{
|
5736
|
+
"name": "title-tag-name",
|
5737
|
+
"type": {
|
5738
|
+
"text": "TagNameType"
|
5739
|
+
},
|
5740
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
5741
|
+
"default": "'span'",
|
5742
|
+
"fieldName": "titleTagName",
|
5743
|
+
"inheritedFrom": {
|
5744
|
+
"name": "Card",
|
5745
|
+
"module": "src/components/card/card.component.ts"
|
5746
|
+
}
|
5747
|
+
},
|
5748
|
+
{
|
5749
|
+
"name": "subtitle-tag-name",
|
5750
|
+
"type": {
|
5751
|
+
"text": "TagNameType"
|
5752
|
+
},
|
5753
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
5754
|
+
"default": "'span'",
|
5755
|
+
"fieldName": "subtitleTagName",
|
5756
|
+
"inheritedFrom": {
|
5757
|
+
"name": "Card",
|
5758
|
+
"module": "src/components/card/card.component.ts"
|
5759
|
+
}
|
5760
|
+
},
|
5761
|
+
{
|
5762
|
+
"name": "icon-name",
|
5763
|
+
"type": {
|
5764
|
+
"text": "IconNames | undefined"
|
5765
|
+
},
|
5766
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
5767
|
+
"fieldName": "iconName",
|
5768
|
+
"inheritedFrom": {
|
5769
|
+
"name": "Card",
|
5770
|
+
"module": "src/components/card/card.component.ts"
|
5771
|
+
}
|
5772
|
+
}
|
5773
|
+
],
|
5774
|
+
"mixins": [
|
5775
|
+
{
|
5776
|
+
"name": "DisabledMixin",
|
5777
|
+
"module": "/src/utils/mixins/DisabledMixin"
|
5778
|
+
},
|
5779
|
+
{
|
5780
|
+
"name": "TabIndexMixin",
|
5781
|
+
"module": "/src/utils/mixins/TabIndexMixin"
|
5782
|
+
}
|
5783
|
+
],
|
5784
|
+
"superclass": {
|
5785
|
+
"name": "Card",
|
5786
|
+
"module": "/src/components/card/card.component"
|
5787
|
+
},
|
5788
|
+
"tagName": "mdc-cardradio",
|
5789
|
+
"jsDoc": "/**\n * cardradio component extends `mdc-card` and supports radio selection interaction addtionally.\n *\n * While using this component within a form or group of cards, make sure cards are in a role = \"radio-group\".\n * This card would have events for selected and unselected (similar to radio)\n *\n * **Note**: This is a single selection card i.e. interacting anywhere on the card would toggle the checked state.\n * Make sure to pass only non-interactable elements within the slots.\n *\n * Make sure to pass the `card-title` mandatorily for this card.\n *\n * @tagname mdc-cardradio\n *\n * @dependency mdc-icon\n * @dependency mdc-staticradio\n * @dependency mdc-text\n *\n * @slot before-body - This slot is for passing the content before the body\n * @slot body - This slot is for passing the text content for the card\n * @slot after-body - This slot is for passing the content after the body\n *\n * @event click - (React: onClick) Event that gets dispatched when the card is clicked. It toggles the checked state.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the card.\n * It toggles the checked state when enter key is used.\n * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.\n * It toggles the checked state when space key is used.\n * @event change - (React: onChange) Event that gets dispatched when the card state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.\n *\n */",
|
5790
|
+
"customElement": true
|
5791
|
+
}
|
5792
|
+
],
|
5793
|
+
"exports": [
|
5794
|
+
{
|
5795
|
+
"kind": "js",
|
5796
|
+
"name": "default",
|
5797
|
+
"declaration": {
|
5798
|
+
"name": "CardRadio",
|
5799
|
+
"module": "components/cardradio/cardradio.component.js"
|
5800
|
+
}
|
5801
|
+
}
|
5802
|
+
]
|
5803
|
+
},
|
3559
5804
|
{
|
3560
5805
|
"kind": "javascript-module",
|
3561
5806
|
"path": "components/checkbox/checkbox.component.js",
|
@@ -9030,57 +11275,256 @@
|
|
9030
11275
|
}
|
9031
11276
|
},
|
9032
11277
|
{
|
9033
|
-
"name": "help-text-type",
|
11278
|
+
"name": "help-text-type",
|
11279
|
+
"type": {
|
11280
|
+
"text": "ValidationType"
|
11281
|
+
},
|
11282
|
+
"description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
|
11283
|
+
"fieldName": "helpTextType",
|
11284
|
+
"inheritedFrom": {
|
11285
|
+
"name": "FormfieldWrapper",
|
11286
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
11287
|
+
}
|
11288
|
+
},
|
11289
|
+
{
|
11290
|
+
"name": "help-text",
|
11291
|
+
"type": {
|
11292
|
+
"text": "string | undefined"
|
11293
|
+
},
|
11294
|
+
"description": "The help text that is displayed below the input field.",
|
11295
|
+
"fieldName": "helpText",
|
11296
|
+
"inheritedFrom": {
|
11297
|
+
"name": "FormfieldWrapper",
|
11298
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
11299
|
+
}
|
11300
|
+
}
|
11301
|
+
],
|
11302
|
+
"mixins": [
|
11303
|
+
{
|
11304
|
+
"name": "FormInternalsMixin",
|
11305
|
+
"module": "/src/utils/mixins/FormInternalsMixin"
|
11306
|
+
},
|
11307
|
+
{
|
11308
|
+
"name": "DataAriaLabelMixin",
|
11309
|
+
"module": "/src/utils/mixins/DataAriaLabelMixin"
|
11310
|
+
}
|
11311
|
+
],
|
11312
|
+
"superclass": {
|
11313
|
+
"name": "FormfieldWrapper",
|
11314
|
+
"module": "/src/components/formfieldwrapper"
|
11315
|
+
},
|
11316
|
+
"tagName": "mdc-input",
|
11317
|
+
"jsDoc": "/**\n * mdc-input is a component that allows users to input text.\n * It contains:\n * - label field - describe the input field.\n * - input field - contains the value\n * - help text or validation message - displayed below the input field.\n * - trailing button - it displays a clear the input field.\n * - prefix text - displayed before the input field.\n * - leading icon - displayed before the input field.\n * - clear-aria-label - aria label for the trailing button.\n * - all the attributes of the input field.\n *\n * @tagname mdc-input\n *\n * @event input - (React: onInput) This event is dispatched when the value of the input field changes (every press).\n * @event change - (React: onChange) This event is dispatched when the value of the input field changes (on blur).\n * @event focus - (React: onFocus) This event is dispatched when the input receives focus.\n * @event blur - (React: onBlur) This event is dispatched when the input loses focus.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-button\n *\n * @cssproperty --mdc-input-disabled-border-color - Border color for the input container when disabled\n * @cssproperty --mdc-input-disabled-text-color - Text color for the input field when disabled\n * @cssproperty --mdc-input-disabled-background-color - Background color for the input field when disabled\n * @cssproperty --mdc-input-border-color - Border color for the input container\n * @cssproperty --mdc-input-text-color - Text color for the input field\n * @cssproperty --mdc-input-background-color - Background color for the input field\n * @cssproperty --mdc-input-selection-background-color - Background color for the selected text\n * @cssproperty --mdc-input-selection-text-color - Text color for the selected text\n * @cssproperty --mdc-input-support-text-color - Text color for the help text\n * @cssproperty --mdc-input-hover-background-color - Background color for the input field when hovered\n * @cssproperty --mdc-input-focused-background-color - Background color for the input field when focused\n * @cssproperty --mdc-input-focused-border-color - Border color for the input container when focused\n * @cssproperty --mdc-input-error-border-color - Border color for the input container when error\n * @cssproperty --mdc-input-warning-border-color - Border color for the input container when warning\n * @cssproperty --mdc-input-success-border-color - Border color for the input container when success\n * @cssproperty --mdc-input-primary-border-color - Border color for the input container when primary\n *\n */",
|
11318
|
+
"customElement": true,
|
11319
|
+
"slots": [
|
11320
|
+
{
|
11321
|
+
"description": "slot to add the label info icon",
|
11322
|
+
"name": "label-info",
|
11323
|
+
"inheritedFrom": {
|
11324
|
+
"name": "FormfieldWrapper",
|
11325
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
11326
|
+
}
|
11327
|
+
}
|
11328
|
+
]
|
11329
|
+
}
|
11330
|
+
],
|
11331
|
+
"exports": [
|
11332
|
+
{
|
11333
|
+
"kind": "js",
|
11334
|
+
"name": "default",
|
11335
|
+
"declaration": {
|
11336
|
+
"name": "Input",
|
11337
|
+
"module": "components/input/input.component.js"
|
11338
|
+
}
|
11339
|
+
}
|
11340
|
+
]
|
11341
|
+
},
|
11342
|
+
{
|
11343
|
+
"kind": "javascript-module",
|
11344
|
+
"path": "components/inputchip/inputchip.component.js",
|
11345
|
+
"declarations": [
|
11346
|
+
{
|
11347
|
+
"kind": "class",
|
11348
|
+
"description": "mdc-inputchip component is an interactive chip that consumers can use to represent an input.\n\n- It supports a leading icon along with label.\n- It supports an error state for validation.\n- It supports a close button to remove the chip.",
|
11349
|
+
"name": "InputChip",
|
11350
|
+
"cssProperties": [
|
11351
|
+
{
|
11352
|
+
"description": "The color of the chip.",
|
11353
|
+
"name": "--mdc-chip-color"
|
11354
|
+
},
|
11355
|
+
{
|
11356
|
+
"description": "The border color of the chip.",
|
11357
|
+
"name": "--mdc-chip-border-color"
|
11358
|
+
},
|
11359
|
+
{
|
11360
|
+
"description": "The background color of the chip.",
|
11361
|
+
"name": "--mdc-chip-background-color"
|
11362
|
+
}
|
11363
|
+
],
|
11364
|
+
"members": [
|
11365
|
+
{
|
11366
|
+
"kind": "field",
|
11367
|
+
"name": "label",
|
11368
|
+
"type": {
|
11369
|
+
"text": "string"
|
11370
|
+
},
|
11371
|
+
"default": "''",
|
11372
|
+
"description": "The label of the inputchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
|
11373
|
+
"attribute": "label"
|
11374
|
+
},
|
11375
|
+
{
|
11376
|
+
"kind": "field",
|
11377
|
+
"name": "error",
|
11378
|
+
"type": {
|
11379
|
+
"text": "boolean"
|
11380
|
+
},
|
11381
|
+
"default": "false",
|
11382
|
+
"description": "The error state of the inputchip.",
|
11383
|
+
"attribute": "error"
|
11384
|
+
},
|
11385
|
+
{
|
11386
|
+
"kind": "field",
|
11387
|
+
"name": "clearAriaLabel",
|
11388
|
+
"type": {
|
11389
|
+
"text": "string"
|
11390
|
+
},
|
11391
|
+
"default": "''",
|
11392
|
+
"description": "The aria-label of the close button.",
|
11393
|
+
"attribute": "clear-aria-label"
|
11394
|
+
},
|
11395
|
+
{
|
11396
|
+
"kind": "method",
|
11397
|
+
"name": "renderIcon",
|
11398
|
+
"privacy": "private",
|
11399
|
+
"description": "Renders the icon element if available.",
|
11400
|
+
"return": {
|
11401
|
+
"type": {
|
11402
|
+
"text": ""
|
11403
|
+
}
|
11404
|
+
}
|
11405
|
+
},
|
11406
|
+
{
|
11407
|
+
"kind": "method",
|
11408
|
+
"name": "handleClose",
|
11409
|
+
"privacy": "private",
|
11410
|
+
"description": "Handles the behavior of the close button on click event.",
|
11411
|
+
"parameters": [
|
11412
|
+
{
|
11413
|
+
"description": "The event object.",
|
11414
|
+
"name": "event"
|
11415
|
+
}
|
11416
|
+
]
|
11417
|
+
},
|
11418
|
+
{
|
11419
|
+
"kind": "field",
|
11420
|
+
"name": "iconName",
|
11421
|
+
"type": {
|
11422
|
+
"text": "IconNames | undefined"
|
11423
|
+
},
|
11424
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
11425
|
+
"attribute": "icon-name",
|
11426
|
+
"inheritedFrom": {
|
11427
|
+
"name": "IconNameMixin",
|
11428
|
+
"module": "utils/mixins/IconNameMixin.js"
|
11429
|
+
}
|
11430
|
+
},
|
11431
|
+
{
|
11432
|
+
"kind": "field",
|
11433
|
+
"name": "disabled",
|
11434
|
+
"type": {
|
11435
|
+
"text": "boolean | undefined"
|
11436
|
+
},
|
11437
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
11438
|
+
"default": "undefined",
|
11439
|
+
"attribute": "disabled",
|
11440
|
+
"reflects": true,
|
11441
|
+
"inheritedFrom": {
|
11442
|
+
"name": "DisabledMixin",
|
11443
|
+
"module": "utils/mixins/DisabledMixin.js"
|
11444
|
+
}
|
11445
|
+
}
|
11446
|
+
],
|
11447
|
+
"events": [
|
11448
|
+
{
|
11449
|
+
"name": "remove",
|
11450
|
+
"type": {
|
11451
|
+
"text": "CustomEvent"
|
11452
|
+
},
|
11453
|
+
"description": "This event is dispatched when the close button is activated. It bubbles and is composed.",
|
11454
|
+
"reactName": "onRemove"
|
11455
|
+
}
|
11456
|
+
],
|
11457
|
+
"attributes": [
|
11458
|
+
{
|
11459
|
+
"name": "label",
|
11460
|
+
"type": {
|
11461
|
+
"text": "string"
|
11462
|
+
},
|
11463
|
+
"default": "''",
|
11464
|
+
"description": "The label of the inputchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
|
11465
|
+
"fieldName": "label"
|
11466
|
+
},
|
11467
|
+
{
|
11468
|
+
"name": "error",
|
11469
|
+
"type": {
|
11470
|
+
"text": "boolean"
|
11471
|
+
},
|
11472
|
+
"default": "false",
|
11473
|
+
"description": "The error state of the inputchip.",
|
11474
|
+
"fieldName": "error"
|
11475
|
+
},
|
11476
|
+
{
|
11477
|
+
"name": "clear-aria-label",
|
11478
|
+
"type": {
|
11479
|
+
"text": "string"
|
11480
|
+
},
|
11481
|
+
"default": "''",
|
11482
|
+
"description": "The aria-label of the close button.",
|
11483
|
+
"fieldName": "clearAriaLabel"
|
11484
|
+
},
|
11485
|
+
{
|
11486
|
+
"name": "icon-name",
|
9034
11487
|
"type": {
|
9035
|
-
"text": "
|
11488
|
+
"text": "IconNames | undefined"
|
9036
11489
|
},
|
9037
|
-
"description": "
|
9038
|
-
"fieldName": "
|
11490
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
11491
|
+
"fieldName": "iconName",
|
9039
11492
|
"inheritedFrom": {
|
9040
|
-
"name": "
|
9041
|
-
"module": "src/
|
11493
|
+
"name": "IconNameMixin",
|
11494
|
+
"module": "src/utils/mixins/IconNameMixin.ts"
|
9042
11495
|
}
|
9043
11496
|
},
|
9044
11497
|
{
|
9045
|
-
"name": "
|
11498
|
+
"name": "disabled",
|
9046
11499
|
"type": {
|
9047
|
-
"text": "
|
11500
|
+
"text": "boolean | undefined"
|
9048
11501
|
},
|
9049
|
-
"description": "
|
9050
|
-
"
|
11502
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
11503
|
+
"default": "undefined",
|
11504
|
+
"fieldName": "disabled",
|
9051
11505
|
"inheritedFrom": {
|
9052
|
-
"name": "
|
9053
|
-
"module": "src/
|
11506
|
+
"name": "DisabledMixin",
|
11507
|
+
"module": "src/utils/mixins/DisabledMixin.ts"
|
9054
11508
|
}
|
9055
11509
|
}
|
9056
11510
|
],
|
9057
11511
|
"mixins": [
|
9058
11512
|
{
|
9059
|
-
"name": "
|
9060
|
-
"module": "/src/utils/mixins/
|
11513
|
+
"name": "IconNameMixin",
|
11514
|
+
"module": "/src/utils/mixins/IconNameMixin"
|
9061
11515
|
},
|
9062
11516
|
{
|
9063
|
-
"name": "
|
9064
|
-
"module": "/src/utils/mixins/
|
11517
|
+
"name": "DisabledMixin",
|
11518
|
+
"module": "/src/utils/mixins/DisabledMixin"
|
9065
11519
|
}
|
9066
11520
|
],
|
9067
11521
|
"superclass": {
|
9068
|
-
"name": "
|
9069
|
-
"module": "/src/
|
11522
|
+
"name": "Component",
|
11523
|
+
"module": "/src/models"
|
9070
11524
|
},
|
9071
|
-
"tagName": "mdc-
|
9072
|
-
"jsDoc": "/**\n * mdc-
|
9073
|
-
"customElement": true
|
9074
|
-
"slots": [
|
9075
|
-
{
|
9076
|
-
"description": "slot to add the label info icon",
|
9077
|
-
"name": "label-info",
|
9078
|
-
"inheritedFrom": {
|
9079
|
-
"name": "FormfieldWrapper",
|
9080
|
-
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
9081
|
-
}
|
9082
|
-
}
|
9083
|
-
]
|
11525
|
+
"tagName": "mdc-inputchip",
|
11526
|
+
"jsDoc": "/**\n * mdc-inputchip component is an interactive chip that consumers can use to represent an input.\n *\n * - It supports a leading icon along with label.\n * - It supports an error state for validation.\n * - It supports a close button to remove the chip.\n *\n * @tagname mdc-inputchip\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @event remove - This event is dispatched when the close button is activated. It bubbles and is composed.\n *\n * @cssproperty --mdc-chip-color - The color of the chip.\n * @cssproperty --mdc-chip-border-color - The border color of the chip.\n * @cssproperty --mdc-chip-background-color - The background color of the chip.\n *\n */",
|
11527
|
+
"customElement": true
|
9084
11528
|
}
|
9085
11529
|
],
|
9086
11530
|
"exports": [
|
@@ -9088,8 +11532,8 @@
|
|
9088
11532
|
"kind": "js",
|
9089
11533
|
"name": "default",
|
9090
11534
|
"declaration": {
|
9091
|
-
"name": "
|
9092
|
-
"module": "components/
|
11535
|
+
"name": "InputChip",
|
11536
|
+
"module": "components/inputchip/inputchip.component.js"
|
9093
11537
|
}
|
9094
11538
|
}
|
9095
11539
|
]
|
@@ -9454,260 +11898,61 @@
|
|
9454
11898
|
},
|
9455
11899
|
{
|
9456
11900
|
"description": "Color of the link’s child content in the disabled state.",
|
9457
|
-
"name": "--mdc-link-color-disabled",
|
9458
|
-
"inheritedFrom": {
|
9459
|
-
"name": "Linksimple",
|
9460
|
-
"module": "src/components/linksimple/linksimple.component.ts"
|
9461
|
-
}
|
9462
|
-
},
|
9463
|
-
{
|
9464
|
-
"description": "Color of the link’s child content in the hover state.",
|
9465
|
-
"name": "--mdc-link-color-hover",
|
9466
|
-
"inheritedFrom": {
|
9467
|
-
"name": "Linksimple",
|
9468
|
-
"module": "src/components/linksimple/linksimple.component.ts"
|
9469
|
-
}
|
9470
|
-
},
|
9471
|
-
{
|
9472
|
-
"description": "Color of the link’s child content in the normal state.",
|
9473
|
-
"name": "--mdc-link-color-normal",
|
9474
|
-
"inheritedFrom": {
|
9475
|
-
"name": "Linksimple",
|
9476
|
-
"module": "src/components/linksimple/linksimple.component.ts"
|
9477
|
-
}
|
9478
|
-
},
|
9479
|
-
{
|
9480
|
-
"description": "Color of the inverted link’s child content in the active state.",
|
9481
|
-
"name": "--mdc-link-inverted-color-active",
|
9482
|
-
"inheritedFrom": {
|
9483
|
-
"name": "Linksimple",
|
9484
|
-
"module": "src/components/linksimple/linksimple.component.ts"
|
9485
|
-
}
|
9486
|
-
},
|
9487
|
-
{
|
9488
|
-
"description": "Color of the inverted link’s child content in the disabled state.",
|
9489
|
-
"name": "--mdc-link-inverted-color-disabled",
|
9490
|
-
"inheritedFrom": {
|
9491
|
-
"name": "Linksimple",
|
9492
|
-
"module": "src/components/linksimple/linksimple.component.ts"
|
9493
|
-
}
|
9494
|
-
},
|
9495
|
-
{
|
9496
|
-
"description": "Color of the inverted link’s child content in the hover state.",
|
9497
|
-
"name": "--mdc-link-inverted-color-hover",
|
9498
|
-
"inheritedFrom": {
|
9499
|
-
"name": "Linksimple",
|
9500
|
-
"module": "src/components/linksimple/linksimple.component.ts"
|
9501
|
-
}
|
9502
|
-
},
|
9503
|
-
{
|
9504
|
-
"description": "Color of the inverted link’s child content in the normal state.",
|
9505
|
-
"name": "--mdc-link-inverted-color-normal",
|
9506
|
-
"inheritedFrom": {
|
9507
|
-
"name": "Linksimple",
|
9508
|
-
"module": "src/components/linksimple/linksimple.component.ts"
|
9509
|
-
}
|
9510
|
-
}
|
9511
|
-
]
|
9512
|
-
}
|
9513
|
-
],
|
9514
|
-
"exports": [
|
9515
|
-
{
|
9516
|
-
"kind": "js",
|
9517
|
-
"name": "default",
|
9518
|
-
"declaration": {
|
9519
|
-
"name": "Link",
|
9520
|
-
"module": "components/link/link.component.js"
|
9521
|
-
}
|
9522
|
-
}
|
9523
|
-
]
|
9524
|
-
},
|
9525
|
-
{
|
9526
|
-
"kind": "javascript-module",
|
9527
|
-
"path": "components/inputchip/inputchip.component.js",
|
9528
|
-
"declarations": [
|
9529
|
-
{
|
9530
|
-
"kind": "class",
|
9531
|
-
"description": "mdc-inputchip component is an interactive chip that consumers can use to represent an input.\n\n- It supports a leading icon along with label.\n- It supports an error state for validation.\n- It supports a close button to remove the chip.",
|
9532
|
-
"name": "InputChip",
|
9533
|
-
"cssProperties": [
|
9534
|
-
{
|
9535
|
-
"description": "The color of the chip.",
|
9536
|
-
"name": "--mdc-chip-color"
|
9537
|
-
},
|
9538
|
-
{
|
9539
|
-
"description": "The border color of the chip.",
|
9540
|
-
"name": "--mdc-chip-border-color"
|
9541
|
-
},
|
9542
|
-
{
|
9543
|
-
"description": "The background color of the chip.",
|
9544
|
-
"name": "--mdc-chip-background-color"
|
9545
|
-
}
|
9546
|
-
],
|
9547
|
-
"members": [
|
9548
|
-
{
|
9549
|
-
"kind": "field",
|
9550
|
-
"name": "label",
|
9551
|
-
"type": {
|
9552
|
-
"text": "string"
|
9553
|
-
},
|
9554
|
-
"default": "''",
|
9555
|
-
"description": "The label of the inputchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
|
9556
|
-
"attribute": "label"
|
9557
|
-
},
|
9558
|
-
{
|
9559
|
-
"kind": "field",
|
9560
|
-
"name": "error",
|
9561
|
-
"type": {
|
9562
|
-
"text": "boolean"
|
9563
|
-
},
|
9564
|
-
"default": "false",
|
9565
|
-
"description": "The error state of the inputchip.",
|
9566
|
-
"attribute": "error"
|
9567
|
-
},
|
9568
|
-
{
|
9569
|
-
"kind": "field",
|
9570
|
-
"name": "clearAriaLabel",
|
9571
|
-
"type": {
|
9572
|
-
"text": "string"
|
9573
|
-
},
|
9574
|
-
"default": "''",
|
9575
|
-
"description": "The aria-label of the close button.",
|
9576
|
-
"attribute": "clear-aria-label"
|
9577
|
-
},
|
9578
|
-
{
|
9579
|
-
"kind": "method",
|
9580
|
-
"name": "renderIcon",
|
9581
|
-
"privacy": "private",
|
9582
|
-
"description": "Renders the icon element if available.",
|
9583
|
-
"return": {
|
9584
|
-
"type": {
|
9585
|
-
"text": ""
|
9586
|
-
}
|
9587
|
-
}
|
9588
|
-
},
|
9589
|
-
{
|
9590
|
-
"kind": "method",
|
9591
|
-
"name": "handleClose",
|
9592
|
-
"privacy": "private",
|
9593
|
-
"description": "Handles the behavior of the close button on click event.",
|
9594
|
-
"parameters": [
|
9595
|
-
{
|
9596
|
-
"description": "The event object.",
|
9597
|
-
"name": "event"
|
9598
|
-
}
|
9599
|
-
]
|
9600
|
-
},
|
9601
|
-
{
|
9602
|
-
"kind": "field",
|
9603
|
-
"name": "iconName",
|
9604
|
-
"type": {
|
9605
|
-
"text": "IconNames | undefined"
|
9606
|
-
},
|
9607
|
-
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
9608
|
-
"attribute": "icon-name",
|
9609
|
-
"inheritedFrom": {
|
9610
|
-
"name": "IconNameMixin",
|
9611
|
-
"module": "utils/mixins/IconNameMixin.js"
|
9612
|
-
}
|
9613
|
-
},
|
9614
|
-
{
|
9615
|
-
"kind": "field",
|
9616
|
-
"name": "disabled",
|
9617
|
-
"type": {
|
9618
|
-
"text": "boolean | undefined"
|
9619
|
-
},
|
9620
|
-
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
9621
|
-
"default": "undefined",
|
9622
|
-
"attribute": "disabled",
|
9623
|
-
"reflects": true,
|
9624
|
-
"inheritedFrom": {
|
9625
|
-
"name": "DisabledMixin",
|
9626
|
-
"module": "utils/mixins/DisabledMixin.js"
|
9627
|
-
}
|
9628
|
-
}
|
9629
|
-
],
|
9630
|
-
"events": [
|
9631
|
-
{
|
9632
|
-
"name": "remove",
|
9633
|
-
"type": {
|
9634
|
-
"text": "CustomEvent"
|
9635
|
-
},
|
9636
|
-
"description": "This event is dispatched when the close button is activated. It bubbles and is composed.",
|
9637
|
-
"reactName": "onRemove"
|
9638
|
-
}
|
9639
|
-
],
|
9640
|
-
"attributes": [
|
9641
|
-
{
|
9642
|
-
"name": "label",
|
9643
|
-
"type": {
|
9644
|
-
"text": "string"
|
9645
|
-
},
|
9646
|
-
"default": "''",
|
9647
|
-
"description": "The label of the inputchip.\n\nWe recommend limiting the <b>maximum length of the label text to 20 characters</b>,\nincluding empty spaces to split words.",
|
9648
|
-
"fieldName": "label"
|
11901
|
+
"name": "--mdc-link-color-disabled",
|
11902
|
+
"inheritedFrom": {
|
11903
|
+
"name": "Linksimple",
|
11904
|
+
"module": "src/components/linksimple/linksimple.component.ts"
|
11905
|
+
}
|
9649
11906
|
},
|
9650
11907
|
{
|
9651
|
-
"
|
9652
|
-
"
|
9653
|
-
|
9654
|
-
|
9655
|
-
|
9656
|
-
|
9657
|
-
"fieldName": "error"
|
11908
|
+
"description": "Color of the link’s child content in the hover state.",
|
11909
|
+
"name": "--mdc-link-color-hover",
|
11910
|
+
"inheritedFrom": {
|
11911
|
+
"name": "Linksimple",
|
11912
|
+
"module": "src/components/linksimple/linksimple.component.ts"
|
11913
|
+
}
|
9658
11914
|
},
|
9659
11915
|
{
|
9660
|
-
"
|
9661
|
-
"
|
9662
|
-
|
9663
|
-
|
9664
|
-
|
9665
|
-
|
9666
|
-
"fieldName": "clearAriaLabel"
|
11916
|
+
"description": "Color of the link’s child content in the normal state.",
|
11917
|
+
"name": "--mdc-link-color-normal",
|
11918
|
+
"inheritedFrom": {
|
11919
|
+
"name": "Linksimple",
|
11920
|
+
"module": "src/components/linksimple/linksimple.component.ts"
|
11921
|
+
}
|
9667
11922
|
},
|
9668
11923
|
{
|
9669
|
-
"
|
9670
|
-
"
|
9671
|
-
"text": "IconNames | undefined"
|
9672
|
-
},
|
9673
|
-
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
9674
|
-
"fieldName": "iconName",
|
11924
|
+
"description": "Color of the inverted link’s child content in the active state.",
|
11925
|
+
"name": "--mdc-link-inverted-color-active",
|
9675
11926
|
"inheritedFrom": {
|
9676
|
-
"name": "
|
9677
|
-
"module": "src/
|
11927
|
+
"name": "Linksimple",
|
11928
|
+
"module": "src/components/linksimple/linksimple.component.ts"
|
9678
11929
|
}
|
9679
11930
|
},
|
9680
11931
|
{
|
9681
|
-
"
|
9682
|
-
"
|
9683
|
-
"text": "boolean | undefined"
|
9684
|
-
},
|
9685
|
-
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
9686
|
-
"default": "undefined",
|
9687
|
-
"fieldName": "disabled",
|
11932
|
+
"description": "Color of the inverted link’s child content in the disabled state.",
|
11933
|
+
"name": "--mdc-link-inverted-color-disabled",
|
9688
11934
|
"inheritedFrom": {
|
9689
|
-
"name": "
|
9690
|
-
"module": "src/
|
11935
|
+
"name": "Linksimple",
|
11936
|
+
"module": "src/components/linksimple/linksimple.component.ts"
|
9691
11937
|
}
|
9692
|
-
}
|
9693
|
-
],
|
9694
|
-
"mixins": [
|
11938
|
+
},
|
9695
11939
|
{
|
9696
|
-
"
|
9697
|
-
"
|
11940
|
+
"description": "Color of the inverted link’s child content in the hover state.",
|
11941
|
+
"name": "--mdc-link-inverted-color-hover",
|
11942
|
+
"inheritedFrom": {
|
11943
|
+
"name": "Linksimple",
|
11944
|
+
"module": "src/components/linksimple/linksimple.component.ts"
|
11945
|
+
}
|
9698
11946
|
},
|
9699
11947
|
{
|
9700
|
-
"
|
9701
|
-
"
|
11948
|
+
"description": "Color of the inverted link’s child content in the normal state.",
|
11949
|
+
"name": "--mdc-link-inverted-color-normal",
|
11950
|
+
"inheritedFrom": {
|
11951
|
+
"name": "Linksimple",
|
11952
|
+
"module": "src/components/linksimple/linksimple.component.ts"
|
11953
|
+
}
|
9702
11954
|
}
|
9703
|
-
]
|
9704
|
-
"superclass": {
|
9705
|
-
"name": "Component",
|
9706
|
-
"module": "/src/models"
|
9707
|
-
},
|
9708
|
-
"tagName": "mdc-inputchip",
|
9709
|
-
"jsDoc": "/**\n * mdc-inputchip component is an interactive chip that consumers can use to represent an input.\n *\n * - It supports a leading icon along with label.\n * - It supports an error state for validation.\n * - It supports a close button to remove the chip.\n *\n * @tagname mdc-inputchip\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @event remove - This event is dispatched when the close button is activated. It bubbles and is composed.\n *\n * @cssproperty --mdc-chip-color - The color of the chip.\n * @cssproperty --mdc-chip-border-color - The border color of the chip.\n * @cssproperty --mdc-chip-background-color - The background color of the chip.\n *\n */",
|
9710
|
-
"customElement": true
|
11955
|
+
]
|
9711
11956
|
}
|
9712
11957
|
],
|
9713
11958
|
"exports": [
|
@@ -9715,8 +11960,8 @@
|
|
9715
11960
|
"kind": "js",
|
9716
11961
|
"name": "default",
|
9717
11962
|
"declaration": {
|
9718
|
-
"name": "
|
9719
|
-
"module": "components/
|
11963
|
+
"name": "Link",
|
11964
|
+
"module": "components/link/link.component.js"
|
9720
11965
|
}
|
9721
11966
|
}
|
9722
11967
|
]
|
@@ -24717,6 +26962,239 @@
|
|
24717
26962
|
}
|
24718
26963
|
]
|
24719
26964
|
},
|
26965
|
+
{
|
26966
|
+
"kind": "javascript-module",
|
26967
|
+
"path": "utils/mixins/CardComponentMixin.js",
|
26968
|
+
"declarations": [
|
26969
|
+
{
|
26970
|
+
"kind": "mixin",
|
26971
|
+
"description": "",
|
26972
|
+
"name": "CardComponentMixin",
|
26973
|
+
"members": [
|
26974
|
+
{
|
26975
|
+
"kind": "field",
|
26976
|
+
"name": "cardTitle",
|
26977
|
+
"type": {
|
26978
|
+
"text": "string"
|
26979
|
+
},
|
26980
|
+
"default": "''",
|
26981
|
+
"description": "The title of the card - part of header section",
|
26982
|
+
"attribute": "card-title"
|
26983
|
+
},
|
26984
|
+
{
|
26985
|
+
"kind": "field",
|
26986
|
+
"name": "subtitle",
|
26987
|
+
"type": {
|
26988
|
+
"text": "string"
|
26989
|
+
},
|
26990
|
+
"default": "''",
|
26991
|
+
"description": "The subtitle of the card - part of header section",
|
26992
|
+
"attribute": "subtitle"
|
26993
|
+
},
|
26994
|
+
{
|
26995
|
+
"kind": "field",
|
26996
|
+
"name": "imageSrc",
|
26997
|
+
"type": {
|
26998
|
+
"text": "string"
|
26999
|
+
},
|
27000
|
+
"default": "''",
|
27001
|
+
"description": "The image source URL to render on the card",
|
27002
|
+
"attribute": "image-src"
|
27003
|
+
},
|
27004
|
+
{
|
27005
|
+
"kind": "field",
|
27006
|
+
"name": "imageAlt",
|
27007
|
+
"type": {
|
27008
|
+
"text": "string"
|
27009
|
+
},
|
27010
|
+
"default": "''",
|
27011
|
+
"description": "The image alt for accessibility support",
|
27012
|
+
"attribute": "image-alt"
|
27013
|
+
},
|
27014
|
+
{
|
27015
|
+
"kind": "field",
|
27016
|
+
"name": "variant",
|
27017
|
+
"type": {
|
27018
|
+
"text": "CardVariant"
|
27019
|
+
},
|
27020
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
27021
|
+
"default": "'border'",
|
27022
|
+
"attribute": "variant"
|
27023
|
+
},
|
27024
|
+
{
|
27025
|
+
"kind": "field",
|
27026
|
+
"name": "orientation",
|
27027
|
+
"type": {
|
27028
|
+
"text": "CardOrientation"
|
27029
|
+
},
|
27030
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
27031
|
+
"default": "'vertical'",
|
27032
|
+
"attribute": "orientation",
|
27033
|
+
"reflects": true
|
27034
|
+
},
|
27035
|
+
{
|
27036
|
+
"kind": "field",
|
27037
|
+
"name": "titleTagName",
|
27038
|
+
"type": {
|
27039
|
+
"text": "TagNameType"
|
27040
|
+
},
|
27041
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
27042
|
+
"default": "'span'",
|
27043
|
+
"attribute": "title-tag-name"
|
27044
|
+
},
|
27045
|
+
{
|
27046
|
+
"kind": "field",
|
27047
|
+
"name": "subtitleTagName",
|
27048
|
+
"type": {
|
27049
|
+
"text": "TagNameType"
|
27050
|
+
},
|
27051
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
27052
|
+
"default": "'span'",
|
27053
|
+
"attribute": "subtitle-tag-name"
|
27054
|
+
},
|
27055
|
+
{
|
27056
|
+
"kind": "field",
|
27057
|
+
"name": "iconName",
|
27058
|
+
"type": {
|
27059
|
+
"text": "IconNames | undefined"
|
27060
|
+
},
|
27061
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
27062
|
+
"attribute": "icon-name"
|
27063
|
+
},
|
27064
|
+
{
|
27065
|
+
"kind": "method",
|
27066
|
+
"name": "renderImage",
|
27067
|
+
"description": "Renders the image on the card if image source is provided",
|
27068
|
+
"return": {
|
27069
|
+
"type": {
|
27070
|
+
"text": ""
|
27071
|
+
}
|
27072
|
+
}
|
27073
|
+
},
|
27074
|
+
{
|
27075
|
+
"kind": "method",
|
27076
|
+
"name": "renderIcon",
|
27077
|
+
"description": "Renders the icon on the card if icon name is provided",
|
27078
|
+
"return": {
|
27079
|
+
"type": {
|
27080
|
+
"text": ""
|
27081
|
+
}
|
27082
|
+
}
|
27083
|
+
},
|
27084
|
+
{
|
27085
|
+
"kind": "method",
|
27086
|
+
"name": "renderTitle",
|
27087
|
+
"description": "Renders the title and subtitle on the card",
|
27088
|
+
"return": {
|
27089
|
+
"type": {
|
27090
|
+
"text": ""
|
27091
|
+
}
|
27092
|
+
}
|
27093
|
+
}
|
27094
|
+
],
|
27095
|
+
"attributes": [
|
27096
|
+
{
|
27097
|
+
"name": "card-title",
|
27098
|
+
"type": {
|
27099
|
+
"text": "string"
|
27100
|
+
},
|
27101
|
+
"default": "''",
|
27102
|
+
"description": "The title of the card - part of header section",
|
27103
|
+
"fieldName": "cardTitle"
|
27104
|
+
},
|
27105
|
+
{
|
27106
|
+
"name": "subtitle",
|
27107
|
+
"type": {
|
27108
|
+
"text": "string"
|
27109
|
+
},
|
27110
|
+
"default": "''",
|
27111
|
+
"description": "The subtitle of the card - part of header section",
|
27112
|
+
"fieldName": "subtitle"
|
27113
|
+
},
|
27114
|
+
{
|
27115
|
+
"name": "image-src",
|
27116
|
+
"type": {
|
27117
|
+
"text": "string"
|
27118
|
+
},
|
27119
|
+
"default": "''",
|
27120
|
+
"description": "The image source URL to render on the card",
|
27121
|
+
"fieldName": "imageSrc"
|
27122
|
+
},
|
27123
|
+
{
|
27124
|
+
"name": "image-alt",
|
27125
|
+
"type": {
|
27126
|
+
"text": "string"
|
27127
|
+
},
|
27128
|
+
"default": "''",
|
27129
|
+
"description": "The image alt for accessibility support",
|
27130
|
+
"fieldName": "imageAlt"
|
27131
|
+
},
|
27132
|
+
{
|
27133
|
+
"name": "variant",
|
27134
|
+
"type": {
|
27135
|
+
"text": "CardVariant"
|
27136
|
+
},
|
27137
|
+
"description": "The variant of the card. It can either be set to 'border' or 'ghost'",
|
27138
|
+
"default": "'border'",
|
27139
|
+
"fieldName": "variant"
|
27140
|
+
},
|
27141
|
+
{
|
27142
|
+
"name": "orientation",
|
27143
|
+
"type": {
|
27144
|
+
"text": "CardOrientation"
|
27145
|
+
},
|
27146
|
+
"description": "The orientation of the card. It can either be set to 'vertical' or 'horizontal'",
|
27147
|
+
"default": "'vertical'",
|
27148
|
+
"fieldName": "orientation"
|
27149
|
+
},
|
27150
|
+
{
|
27151
|
+
"name": "title-tag-name",
|
27152
|
+
"type": {
|
27153
|
+
"text": "TagNameType"
|
27154
|
+
},
|
27155
|
+
"description": "The tag name for the card title. It supports all the types that `msc-text` supports",
|
27156
|
+
"default": "'span'",
|
27157
|
+
"fieldName": "titleTagName"
|
27158
|
+
},
|
27159
|
+
{
|
27160
|
+
"name": "subtitle-tag-name",
|
27161
|
+
"type": {
|
27162
|
+
"text": "TagNameType"
|
27163
|
+
},
|
27164
|
+
"description": "The tag name for the subtitle. It supports all the types that `msc-text` supports",
|
27165
|
+
"default": "'span'",
|
27166
|
+
"fieldName": "subtitleTagName"
|
27167
|
+
},
|
27168
|
+
{
|
27169
|
+
"name": "icon-name",
|
27170
|
+
"type": {
|
27171
|
+
"text": "IconNames | undefined"
|
27172
|
+
},
|
27173
|
+
"description": "Name of the icon (= filename).\n\nIf no `icon-name` is provided, no icon will be rendered.",
|
27174
|
+
"fieldName": "iconName"
|
27175
|
+
}
|
27176
|
+
],
|
27177
|
+
"parameters": [
|
27178
|
+
{
|
27179
|
+
"name": "superClass",
|
27180
|
+
"type": {
|
27181
|
+
"text": "T"
|
27182
|
+
}
|
27183
|
+
}
|
27184
|
+
]
|
27185
|
+
}
|
27186
|
+
],
|
27187
|
+
"exports": [
|
27188
|
+
{
|
27189
|
+
"kind": "js",
|
27190
|
+
"name": "CardComponentMixin",
|
27191
|
+
"declaration": {
|
27192
|
+
"name": "CardComponentMixin",
|
27193
|
+
"module": "utils/mixins/CardComponentMixin.js"
|
27194
|
+
}
|
27195
|
+
}
|
27196
|
+
]
|
27197
|
+
},
|
24720
27198
|
{
|
24721
27199
|
"kind": "javascript-module",
|
24722
27200
|
"path": "utils/mixins/DataAriaLabelMixin.js",
|