Global web - web components
Accordion
Custom HTML element
<gw-group-accordion content="" theme=""></gw-group-accordion>
Properties
Name | Type | Description |
---|
content | String | base64 encoded object |
theme | String | |
content
{
"title": "",
"text": "",
"sections": [
{
"title": "Specifications 1",
"layout": "1-large" | "1-small" | "2-small",
"column1": {
"text": "",
"table": <table>,
"assetsAndLinks": <assetsAndLinks>[]
},
"column2": {
"type": "richText" | "assetsAndLinks" | "table",
"content": "<p>Some richtext <b>content</b>.</p>" | "[<AssetsAndLinks>]"
"text": "",
"table": <table>,
"assetsAndLinks": <assetsAndLinks>[]
}
},
]
"config": {
"padding": {
"bottom": false,
"top": true
}
}
}
assetsAndLinks
{
"title": "Technical guidelines",
"links": [
{
"title": "Yale",
"url": "https://www.assaabloy.com/some-document",
"asset": false,
"external": false,
"fileSize": 1000
},
]
}
table
For the table to be generated correctly the keys in tableColumns and tableItems
can be whatever but they have to match.
{
"tableColumns": [
{
"name": "Displayed text"
"key": "Match with tableitem key"
"position": "1"
},
{
"name": "Barcode"
"key": "barcode"
"position": "1"
},
{
"name": "Description"
"key": "description"
"position": "2"
},
{
"name": "Part number"
"key": "partNumber"
"position": "2"
}
],
"tableItems": [
{
"barcode": "Barcode 1",
"description": "Description 1",
"partNumber": "Part Number 1"
},
{
"barcode": "Barcode 2",
"description": "Description 2",
"partNumber": "Part Number 2"
}
]
}
theme
Two different background options:
- "theme-alt-1" (white)
- "theme-alt-2" (grey)
Dependencies
@assaabloy/gw-group-vendor
@assaabloy/brand-styles