pyro
Version:
Pyro custom elements
44 lines (43 loc) • 1.24 kB
TypeScript
import { LitElement } from 'lit';
import { PyroTab } from './tab';
import { TargetValueEvent } from '../types';
/**
* Grouping element for `pyro-tab`s, ensures only one is selected at a time
* [docs](https://pyrojs.com/el/tab)
*
* ```html
* <pyro-tab-group id="tabGroup">
* <pyro-tab>one</pyro-tab>
* <pyro-tab>two</pyro-tab>
* <pyro-tab>three</pyro-tab>
* </pyro-tab-group>
* ```
*
* @tag pyro-tab-group
*
* @event {ClickEvent} click - emitted when any tab is clicked
*
* @slot - `pyro-tab`s or elements containing `pyro-tab`s
*
* @cssprop [--pyro-tab-group-gap=0] - gap between tabs
* @cssprop [--pyro-tab-group-justify-content=flex-start] - justify tabs with flexbox `justify-content`
*/
export declare class PyroTabGroup extends LitElement {
static styles: import('lit').CSSResult;
/** The tabs fill all available space */
fill: boolean;
_slotElements: any;
_tabs: PyroTab[];
firstUpdated(): void;
private handleTabClick;
render(): import('lit-html').TemplateResult<1>;
}
export interface TabGroupProps {
fill?: boolean;
onClick?: (e: TargetValueEvent) => void;
}
declare global {
interface HTMLElementTagNameMap {
'pyro-tab-group': PyroTabGroup;
}
}