5.6.4 • Published 21 days ago
@maggioli-design-system/mds-accordion-item v5.6.4
mds-accordion-item
This is a web-component from Maggioli Design System Magma, built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScirpt framework you are using.
Properties
Property | Attribute | Description | Type | Default |
---|---|---|---|---|
label (required) | label | Specifies the title shown when the component is closed or selected | string | undefined |
selected | selected | Specifies if the component item is selected or not | boolean \| undefined | undefined |
typography | typography | Specifies the typography of the element | "action" \| "h1" \| "h2" \| "h3" \| "h4" \| "h5" \| "h6" \| undefined | 'h5' |
Events
Event | Description | Type |
---|---|---|
mdsAccordionItemChange | Emits when the component attribute selected is changed | CustomEvent<MdsAccordionItemEventDetail> |
mdsAccordionItemSelect | Emits when the component is selected | CustomEvent<MdsAccordionItemEventDetail> |
mdsAccordionItemUnselect | Emits when the component is unselected | CustomEvent<MdsAccordionItemEventDetail> |
Slots
Slot | Description |
---|---|
"default" | Add contents like text string , HTML elements or components to this slot. |
Shadow Parts
Part | Description |
---|---|
"contents" | |
"label" |
CSS Custom Properties
Name | Description |
---|---|
--mds-accordion-item-border-color | Sets the border-color of the component |
--mds-accordion-item-border-width | Sets the border-width of the separators of the component |
--mds-accordion-item-color | Sets the text-color of the component |
--mds-accordion-item-description-color | Sets the color of the always visible title description |
--mds-accordion-item-duration | Sets the transition duration of the close/open animation of the component |
--mds-accordion-item-padding-selected | Sets the vertical padding of the component when it's selected |
--mds-accordion-item-padding-unselected | Sets the vertical padding of the component when it's unselected |
Dependencies
Depends on
Graph
graph TD;
mds-accordion-item --> mds-text
style mds-accordion-item fill:#f9f,stroke:#333,stroke-width:4px
Built with love @ Gruppo Maggioli from R&D Department
5.6.4
21 days ago
5.6.3
3 months ago
5.6.2
3 months ago
5.6.1
3 months ago
5.6.0
3 months ago
5.5.0
3 months ago
5.4.4
4 months ago
5.4.3
4 months ago
5.4.2
5 months ago
5.4.1
6 months ago
5.4.0
6 months ago
5.1.3
7 months ago
5.3.0
6 months ago
5.1.2
7 months ago
5.1.1
8 months ago
5.1.0
8 months ago
5.0.1
10 months ago
4.3.0
11 months ago
4.1.0
1 year ago
4.0.1
1 year ago
4.0.0
1 year ago
4.2.0
1 year ago
3.2.0
1 year ago
3.1.1
1 year ago
3.1.0
1 year ago
3.0.2
2 years ago
3.0.1
2 years ago
3.0.0
2 years ago
2.0.0
2 years ago
1.0.2
2 years ago
1.0.1
2 years ago
1.0.3
2 years ago
1.0.0
2 years ago