@stories-js/core
Version:
Stories web components to build stories
102 lines • 2.87 kB
JavaScript
/*!
* (C) StoriesJS https://storiesjs.org - GPL-2.0 License
*/
// eslint-disable-next-line @typescript-eslint/no-unused-vars
import { Component, Host, h, Element, Prop, Watch, Event } from '@stencil/core';
import { createColorClasses } from '../../utils';
export class TabBar {
selectedTabChanged() {
if (this.selectedTab !== undefined) {
this.storiesTabBarChange.emit({
tab: this.selectedTab
});
}
}
componentWillLoad() {
this.selectedTabChanged();
}
render() {
const { color } = this;
return (h(Host, { class: createColorClasses(color, {}), role: "tablist" },
h("slot", null)));
}
static get is() { return "stories-tab-bar"; }
static get encapsulation() { return "shadow"; }
static get originalStyleUrls() { return {
"$": ["tab-bar.scss"]
}; }
static get styleUrls() { return {
"$": ["tab-bar.css"]
}; }
static get properties() { return {
"color": {
"type": "string",
"mutable": false,
"complexType": {
"original": "Color",
"resolved": "string",
"references": {
"Color": {
"location": "import",
"path": "../../types"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics)."
},
"attribute": "color",
"reflect": true
},
"selectedTab": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "The selected tab component"
},
"attribute": "selected-tab",
"reflect": false
}
}; }
static get events() { return [{
"method": "storiesTabBarChange",
"name": "storiesTabBarChange",
"bubbles": true,
"cancelable": true,
"composed": true,
"docs": {
"tags": [{
"name": "internal",
"text": undefined
}],
"text": ""
},
"complexType": {
"original": "TabBarChangedEventDetail",
"resolved": "TabBarChangedEventDetail",
"references": {
"TabBarChangedEventDetail": {
"location": "import",
"path": "../../types"
}
}
}
}]; }
static get elementRef() { return "el"; }
static get watchers() { return [{
"propName": "selectedTab",
"methodName": "selectedTabChanged"
}]; }
}
//# sourceMappingURL=tab-bar.js.map