@vaadin/tabsheet
Version:
vaadin-tabsheet
197 lines (196 loc) • 7.27 kB
JSON
{
"schemaVersion": "1.0.0",
"readme": "",
"modules": [
{
"kind": "javascript-module",
"path": "vaadin-tabsheet.js",
"declarations": [],
"exports": [
{
"kind": "js",
"name": "*",
"declaration": {
"name": "*",
"module": "src/vaadin-tabsheet.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "src/vaadin-tabsheet-mixin.js",
"declarations": [
{
"kind": "mixin",
"description": "",
"name": "TabSheetMixin",
"members": [
{
"kind": "field",
"name": "items",
"privacy": "public",
"type": {
"text": "!Array<!Tab> | undefined"
},
"description": "A read-only list of `<vaadin-tab>`s from which a selection can be made.\nIt is populated from the elements passed inside the slotted\n`<vaadin-tabs>`, and updated dynamically when adding or removing items.",
"attribute": "items",
"readonly": true
},
{
"kind": "field",
"name": "selected",
"privacy": "public",
"type": {
"text": "number"
},
"description": "The index of the selected tab.",
"attribute": "selected"
}
],
"attributes": [
{
"name": "selected",
"type": {
"text": "number"
},
"description": "The index of the selected tab.",
"fieldName": "selected"
}
],
"mixins": [
{
"name": "DelegateStateMixin",
"package": "@vaadin/component-base/src/delegate-state-mixin.js"
}
],
"parameters": [
{
"name": "superClass"
}
]
}
],
"exports": [
{
"kind": "js",
"name": "TabSheetMixin",
"declaration": {
"name": "TabSheetMixin",
"module": "src/vaadin-tabsheet-mixin.js"
}
}
]
},
{
"kind": "javascript-module",
"path": "src/vaadin-tabsheet.js",
"declarations": [
{
"kind": "class",
"description": "`<vaadin-tabsheet>` is a Web Component for organizing and grouping content\ninto scrollable panels. The panels can be switched between by using tabs.\n\n```html\n<vaadin-tabsheet>\n <div slot=\"prefix\">Prefix</div>\n <div slot=\"suffix\">Suffix</div>\n\n <vaadin-tabs slot=\"tabs\">\n <vaadin-tab id=\"tab-1\">Tab 1</vaadin-tab>\n <vaadin-tab id=\"tab-2\">Tab 2</vaadin-tab>\n <vaadin-tab id=\"tab-3\">Tab 3</vaadin-tab>\n </vaadin-tabs>\n\n <div tab=\"tab-1\">Panel 1</div>\n <div tab=\"tab-2\">Panel 2</div>\n <div tab=\"tab-3\">Panel 3</div>\n</vaadin-tabsheet>\n```\n\n### Styling\n\nThe following shadow DOM parts are exposed for styling:\n\nPart name | Description\n--------- | ---------------\n`tabs-container` | The container for the slotted prefix, tabs and suffix\n`content` | The container for the slotted panels\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n------------------|-------------\n`loading` | Set when a tab without associated content is selected\n`overflow` | Set to `top`, `bottom`, `start`, `end`, all of them, or none.\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:------------------------------------|\n| `--vaadin-tabsheet-border-color` |\n| `--vaadin-tabsheet-border-radius` |\n| `--vaadin-tabsheet-border-width` |\n| `--vaadin-tabsheet-gap` |\n| `--vaadin-tabsheet-padding` |\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
"name": "TabSheet",
"members": [
{
"kind": "field",
"name": "items",
"privacy": "public",
"type": {
"text": "!Array<!Tab> | undefined"
},
"description": "A read-only list of `<vaadin-tab>`s from which a selection can be made.\nIt is populated from the elements passed inside the slotted\n`<vaadin-tabs>`, and updated dynamically when adding or removing items.",
"attribute": "items",
"readonly": true,
"inheritedFrom": {
"name": "TabSheetMixin",
"module": "src/vaadin-tabsheet-mixin.js"
}
},
{
"kind": "field",
"name": "selected",
"privacy": "public",
"type": {
"text": "number"
},
"description": "The index of the selected tab.",
"attribute": "selected",
"inheritedFrom": {
"name": "TabSheetMixin",
"module": "src/vaadin-tabsheet-mixin.js"
}
}
],
"events": [
{
"type": {
"text": "CustomEvent"
},
"description": "Fired when the `items` property changes.",
"name": "items-changed"
},
{
"type": {
"text": "CustomEvent"
},
"description": "Fired when the `selected` property changes.",
"name": "selected-changed"
}
],
"mixins": [
{
"name": "TabSheetMixin",
"module": "src/vaadin-tabsheet-mixin.js"
},
{
"name": "ThemableMixin",
"package": "@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js"
},
{
"name": "ElementMixin",
"package": "@vaadin/component-base/src/element-mixin.js"
},
{
"name": "PolylitMixin",
"package": "@vaadin/component-base/src/polylit-mixin.js"
},
{
"name": "LumoInjectionMixin",
"package": "@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js"
}
],
"superclass": {
"name": "LitElement",
"package": "lit"
},
"tagName": "vaadin-tabsheet",
"customElement": true,
"attributes": [
{
"name": "selected",
"type": {
"text": "number"
},
"description": "The index of the selected tab.",
"fieldName": "selected",
"inheritedFrom": {
"name": "TabSheetMixin",
"module": "src/vaadin-tabsheet-mixin.js"
}
}
]
}
],
"exports": [
{
"kind": "js",
"name": "TabSheet",
"declaration": {
"name": "TabSheet",
"module": "src/vaadin-tabsheet.js"
}
}
]
}
]
}