@assaabloy/gw-group-accordion

Web component - Accordion

21.3.27

latest

GitHub

npm

Version published: 4 days ago

Maintainers: 14

Weekly downloads: 394; decreased by-40.3%

Weekly downloads

Readme

Source

^{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": "", // NEW
  "text": "", // NEW
  "sections": [
    {
      "title": "Specifications 1",
      "layout": "1-large" | "1-small" | "2-small",
      "column1": {
        "text": "", // NEW
        "table": <table>, // NEW
        "assetsAndLinks": <assetsAndLinks>[] // NEW

      },
      "column2": {
        "type": "richText" | "assetsAndLinks" | "table", // REMOVED
        "content": "<p>Some richtext <b>content</b>.</p>" | "[<AssetsAndLinks>]" // REMOVED
        "text": "", // NEW
        "table": <table>, // NEW
        "assetsAndLinks": <assetsAndLinks>[] // NEW
      }
    },
  ]
  "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

FAQs

What is @assaabloy/gw-group-accordion?

Is @assaabloy/gw-group-accordion popular?

Is @assaabloy/gw-group-accordion well maintained?

Last updated on 28 Mar 2023

Did you know?

Socket installs a Github app to automatically flag issues on every pull request and report the health of your dependencies. Find out what is inside your node modules and prevent malicious activity before you update the dependencies.

Install Socket