var Components = require("gd-sprest-bs").Components;
// Create the listGroup
var el = document.querySelector("#listGroup");
var listGroup = Components.listGroup({
el: el,
colWidth: 2,
isTabs: true,
items: [
{ tabName: "Tab 1", content: "This is the content for tab 1.", isActive: true },
{ tabName: "Tab 2", content: "This is the content for tab 2.", badge: { content: "10", type: 4 } },
{ tabName: "Tab 3", content: "This is the content for tab 3." },
{ tabName: "Tab 4", content: "This is the content for tab 4." },
{ tabName: "Tab 5", content: "This is the content for tab 5." }
]
});
import { Components } from "gd-sprest-bs";
// Create the listGroup
let el = document.querySelector("#listGroup");
let listGroup = Components.listGroup({
el: el,
colWidth: 2,
isTabs: true,
items: [
{ tabName: "Tab 1", content: "This is the content for tab 1.", isActive: true },
{ tabName: "Tab 2", content: "This is the content for tab 2.", badge: { content: "10", type: 4 } },
{ tabName: "Tab 3", content: "This is the content for tab 3." },
{ tabName: "Tab 4", content: "This is the content for tab 4." },
{ tabName: "Tab 5", content: "This is the content for tab 5." }
]
});
<script type="text/javascript" src="https://unpkg.com/gd-sprest-bs/wc/dist/gd-sprest-bs.js"></script>
<bs-list-group is-tabs="true" col-width="2">
// Return the list group properties
return {
items: [
{ tabName: "Tab 1", content: "This is the content for tab 1.", isActive: true },
{ tabName: "Tab 2", content: "This is the content for tab 2.", badge: { content: "10", type: 4 } },
{ tabName: "Tab 3", content: "This is the content for tab 3." },
{ tabName: "Tab 4", content: "This is the content for tab 4." },
{ tabName: "Tab 5", content: "This is the content for tab 5." }
]
};
</bs-list-group>
ListGroup(props:IListGroupProps):IListGroup