apphouse
Version:
Component library for React that uses observable state management and theme-able components.
67 lines (66 loc) • 1.59 kB
TypeScript
import React from 'react';
/**
* Interface for a Tab view state
*/
export interface UITabView {
/**
* The id of the current selected tab in the tab view.
* @optional
* @default first tab in the view will be the selected one
*/
selectedId?: string | undefined;
/**
* The unique id for this tab view.
* It is a global id for this tab view.
*/
id: string;
/**
* The list of options for this tab.
*/
tabs?: UITabViewOption[];
}
/**
* Interface for one tab option.
*/
export interface UITabViewOption {
/**
* Unique id for the tab.
* Must be unique across all tabs, if used in a tab group.
*/
id: string;
/**
* The label of the tab.
*/
label: string;
/**
* The index of the tab.
* @optional
* @default undefined
*/
index?: number;
/**
* The action to be called when the tab is selected.
* @returns void
*/
action?: () => void;
/**
* This is added for convenience.
* However, if using a react component, it will make this tab not
* configurable via json.
* @optional use with caution
*/
content?: React.ReactNode;
}
/**
* A model to handle tabs in the app.
*/
export declare class TabViewModel {
id: string;
selectedId: string | undefined;
tabs: UITabViewOption[];
constructor(tab: UITabView);
get content(): React.ReactNode | null;
setSelectedId: (value?: string | undefined) => void;
setTabs: (tabs: UITabViewOption[]) => void;
onSelected: (id: string) => void;
}