matrix-react-sdk/lib/src/components/structures/TabbedView.d.ts

SDK for matrix.org using React

import * as React from "react";
import { TranslationKey } from "../../languageHandler";
import { ScreenName } from "../../PosthogTrackers";
import { NonEmptyArray } from "../../@types/common";
/**
 * Represents a tab for the TabbedView.
 */
export declare class Tab<T extends string> {
    readonly id: T;
    readonly label: TranslationKey;
    readonly icon: string | JSX.Element | null;
    readonly body: React.ReactNode;
    readonly screenName?: ScreenName | undefined;
    /**
     * Creates a new tab.
     * @param {string} id The tab's ID.
     * @param {string} label The untranslated tab label.
     * @param {string|JSX.Element} icon An SVG element to use for the tab icon. Can also be a string for legacy icons, in which case it is the class for the tab icon. This should be a simple mask.
     * @param {React.ReactNode} body The JSX for the tab container.
     * @param {string} screenName The screen name to report to Posthog.
     */
    constructor(id: T, label: TranslationKey, icon: string | JSX.Element | null, body: React.ReactNode, screenName?: ScreenName | undefined);
}
export declare function useActiveTabWithDefault<T extends string>(tabs: NonEmptyArray<Tab<string>>, defaultTabID: T, initialTabID?: T): [T, (tabId: T) => void];
export declare enum TabLocation {
    LEFT = "left",
    TOP = "top"
}
interface IProps<T extends string> {
    tabs: NonEmptyArray<Tab<T>>;
    activeTabId: T;
    tabLocation?: TabLocation;
    onChange: (tabId: T) => void;
    screenName?: ScreenName;
    /**
     * If true, the layout of the tabbed view will be responsive to the viewport size (eg, just showing icons
     * instead of names of tabs).
     * Only applies if `tabLocation === TabLocation.LEFT`.
     * Default: false.
     */
    responsive?: boolean;
}
/**
 * A tabbed view component. Given objects representing content with titles, displays
 * them in a tabbed view where the user can select which one of the items to view at once.
 */
export default function TabbedView<T extends string>(props: IProps<T>): JSX.Element;
export {};