@lobehub/cli-ui/dist/index.d.ts

Lobe CLI uikits

import * as react_jsx_runtime from 'react/jsx-runtime';
import * as react from 'react';
import { ReactNode, FC } from 'react';
import * as ink from 'ink';
import { TextProps, BoxProps } from 'ink';
import { SpinnerName } from 'cli-spinners';

declare const _default: {
    error: (text: string, exit?: boolean) => void;
    info: (text: string, exit?: boolean) => void;
    success: (text: string, exit?: boolean) => void;
    warn: (text: string, exit?: boolean) => void;
};

type AlertProps = {
    /**
     * Message.
     */
    readonly children: ReactNode;
    /**
     * Title to show above the message.
     */
    readonly title?: string;
    /**
     * Variant, which determines the color of the alert.
     */
    readonly variant: 'info' | 'success' | 'error' | 'warning';
};
declare function Alert({ children, variant, title }: AlertProps): react_jsx_runtime.JSX.Element;

type BadgeProps = {
    /**
     * Label.
     */
    readonly children: ReactNode;
    /**
     * Color.
     *
     * @default "magenta"
     */
    readonly color?: TextProps['color'];
};
declare function Badge({ children, color }: BadgeProps): react_jsx_runtime.JSX.Element;

type ConfirmInputProps = {
    /**
     * Default choice.
     *
     * @default "confirm"
     */
    readonly defaultChoice?: 'confirm' | 'cancel';
    /**
     * When disabled, user input is ignored.
     *
     * @default false
     */
    readonly isDisabled?: boolean;
    /**
     * Callback to trigger on cancellation.
     */
    readonly onCancel: () => void;
    /**
     * Callback to trigger on confirmation.
     */
    readonly onConfirm: () => void;
    /**
     * Confirm or cancel when user presses enter, depending on the `defaultChoice` value.
     * Can be useful to disable when an explicit confirmation is required, such as pressing "Y" key.
     *
     * @default true
     */
    readonly submitOnEnter?: boolean;
};
declare function ConfirmInput({ isDisabled, defaultChoice, submitOnEnter, onConfirm, onCancel, }: ConfirmInputProps): react_jsx_runtime.JSX.Element;

type EmailInputProps = {
    /**
     * Default input value.
     */
    readonly defaultValue?: string;
    /**
     * Domains of email providers to autocomplete.
     *
     * @default ["aol.com", "gmail.com", "yahoo.com", "hotmail.com", "live.com", "outlook.com", "icloud.com", "hey.com"]
     */
    readonly domains?: string[];
    /**
     * When disabled, user input is ignored.
     *
     * @default false
     */
    readonly isDisabled?: boolean;
    /**
     * Callback when input value changes.
     */
    readonly onChange?: (value: string) => void;
    /**
     * Callback when enter is pressed. First argument is input value.
     */
    readonly onSubmit?: (value: string) => void;
    /**
     * Text to display when input is empty.
     */
    readonly placeholder?: string;
};
declare function EmailInput({ isDisabled, defaultValue, placeholder, domains, onChange, onSubmit, }: EmailInputProps): react_jsx_runtime.JSX.Element;

type Option = {
    label: string;
    value: string;
};

type MultiSelectProps = {
    /**
     * Initially selected option values.
     */
    readonly defaultValue?: string[];
    /**
     * Highlight text in option labels.
     * Useful for filtering options.
     */
    readonly highlightText?: string;
    /**
     * When disabled, user input is ignored.
     *
     * @default false
     */
    readonly isDisabled?: boolean;
    /**
     * Callback for selecting options.
     */
    readonly onChange?: (value: string[]) => void;
    /**
     * Callback when user presses enter.
     * First argument is an array of selected option values.
     */
    readonly onSubmit?: (value: string[]) => void;
    /**
     * Options.
     */
    readonly options: Option[];
    /**
     * Number of visible options.
     *
     * @default 5
     */
    readonly visibleOptionCount?: number;
};
declare function MultiSelect({ isDisabled, visibleOptionCount, highlightText, options, defaultValue, onChange, onSubmit, }: MultiSelectProps): react_jsx_runtime.JSX.Element;

type OrderedListItemProps = {
    /**
     * List item content.
     */
    readonly children: ReactNode;
};
declare function OrderedListItem({ children }: OrderedListItemProps): react_jsx_runtime.JSX.Element;

type OrderedListProps = {
    /**
     * List items.
     */
    readonly children: ReactNode;
};
declare function OrderedList({ children }: OrderedListProps): react_jsx_runtime.JSX.Element;
declare namespace OrderedList {
    var Item: typeof OrderedListItem;
}

type PasswordInputProps = {
    /**
     * When disabled, user input is ignored.
     *
     * @default false
     */
    readonly isDisabled?: boolean;
    /**
     * Callback when value updates.
     */
    readonly onChange?: (value: string) => void;
    /**
     * Callback when `Enter` is pressed. First argument is a value of the input.
     */
    readonly onSubmit?: (value: string) => void;
    /**
     * Text to display when `value` is empty.
     */
    readonly placeholder?: string;
};
declare function PasswordInput({ isDisabled, placeholder, onChange, onSubmit, }: PasswordInputProps): react_jsx_runtime.JSX.Element;

type ProgressBarProps = {
    /**
     * Progress.
     * Must be between 0 and 100.
     *
     * @default 0
     */
    readonly value: number;
};
declare function ProgressBar({ value }: ProgressBarProps): react_jsx_runtime.JSX.Element;

type SelectProps = {
    /**
     * Default value.
     */
    readonly defaultValue?: string;
    /**
     * Highlight text in option labels.
     */
    readonly highlightText?: string;
    /**
     * When disabled, user input is ignored.
     *
     * @default false
     */
    readonly isDisabled?: boolean;
    /**
     * Callback when selected option changes.
     */
    readonly onChange?: (value: string) => void;
    /**
     * Options.
     */
    readonly options: Option[];
    /**
     * Number of visible options.
     *
     * @default 5
     */
    readonly visibleOptionCount?: number;
};
declare function Select({ isDisabled, visibleOptionCount, highlightText, options, defaultValue, onChange, }: SelectProps): react_jsx_runtime.JSX.Element;

type UseSpinnerProps = {
    /**
     * Type of a spinner.
     * See [cli-spinners](https://github.com/sindresorhus/cli-spinners) for available spinners.
     *
     * @default dots
     */
    type?: SpinnerName;
};
type UseSpinnerResult = {
    frame: string;
};
declare function useSpinner({ type }: UseSpinnerProps): UseSpinnerResult;

type SpinnerProps = UseSpinnerProps & {
    /**
     * Label to show near the spinner.
     */
    readonly label?: string;
};
declare function Spinner({ label, type }: SpinnerProps): react_jsx_runtime.JSX.Element;

type StatusMessageVariant = 'info' | 'success' | 'error' | 'warning';

type StatusMessageProps = {
    /**
     * Message.
     */
    readonly children: ReactNode;
    /**
     * Variant, which determines the color used in the status message.
     */
    readonly variant: StatusMessageVariant;
};
declare function StatusMessage({ children, variant }: StatusMessageProps): react_jsx_runtime.JSX.Element;

type TextInputProps = {
    /**
     * Default input value.
     */
    readonly defaultValue?: string;
    /**
     * When disabled, user input is ignored.
     *
     * @default false
     */
    readonly isDisabled?: boolean;
    /**
     * Callback when input value changes.
     */
    readonly onChange?: (value: string) => void;
    /**
     * Callback when enter is pressed. First argument is input value.
     */
    readonly onSubmit?: (value: string) => void;
    /**
     * Text to display when input is empty.
     */
    readonly placeholder?: string;
    /**
     * Suggestions to autocomplete the input value.
     */
    readonly suggestions?: string[];
};
declare function TextInput({ isDisabled, defaultValue, placeholder, suggestions, onChange, onSubmit, }: TextInputProps): react_jsx_runtime.JSX.Element;

type UnorderedListItemProps = {
    /**
     * List item content.
     */
    readonly children: ReactNode;
};
declare function UnorderedListItem({ children }: UnorderedListItemProps): react_jsx_runtime.JSX.Element;

type UnorderedListProps = {
    /**
     * List items.
     */
    readonly children: ReactNode;
};
declare function UnorderedList({ children }: UnorderedListProps): react_jsx_runtime.JSX.Element;
declare namespace UnorderedList {
    var Item: typeof UnorderedListItem;
}

interface ConfigPanelItem {
    children: ReactNode;
    defaultValue: any;
    desc?: string;
    key: string;
    label: string;
    showValue?: boolean;
    value: any;
}
interface ConfigPanelProps extends BoxProps {
    active?: string;
    items: ConfigPanelItem[];
    logo?: string;
    maxLength?: number;
    setActive?: (key: string) => void;
    show?: boolean;
    title?: string;
}
declare const ConfigPanel: react.NamedExoticComponent<ConfigPanelProps>;

declare const useTheme: () => {
    blue: string;
    cyan: string;
    geekblue: string;
    gold: string;
    gray: string;
    green: string;
    lime: string;
    magenta: string;
    orange: string;
    pink: string;
    purple: string;
    red: string;
    volcano: string;
    yellow: string;
    colorError: string;
    colorInfo: string;
    colorPrimary: string;
    colorSuccess: string;
    colorWarning: string;
    colorBgContainer: string;
    colorBgElevated: string;
    colorBgLayout: string;
    colorBgSpotlight: string;
    colorBorder: string;
    colorBorderSecondary: string;
    colorText: string;
    colorTextDescription: string;
    colorTextPlaceholder: string;
    colorTextQuaternary: string;
    colorTextSecondary: string;
    colorTextTertiary: string;
};

interface PanelProps extends BoxProps {
    bodyConfig?: BoxProps;
    children: ReactNode;
    footer?: ReactNode;
    footerConfig?: BoxProps;
    header?: ReactNode;
    headerConfig?: BoxProps;
    reverse?: boolean;
    show?: boolean;
    title?: string;
}
declare const Panel: react.NamedExoticComponent<PanelProps>;

declare const render: (children: ReactNode) => ink.Instance;

interface IndicatorProps {
    highlightColor: string;
    isSelected?: boolean;
}

interface ItemProps {
    highlightColor: string;
    isSelected?: boolean;
    label: string | ReactNode;
}

interface SelectInputItem {
    key?: string;
    label: string | ReactNode;
    value: string;
}
interface SelectInputProps {
    highlightColor?: string;
    indicatorComponent?: FC<IndicatorProps>;
    initialIndex?: number;
    isFocused?: boolean;
    itemComponent?: FC<ItemProps>;
    items?: SelectInputItem[];
    limit?: number;
    onHighlight?: (item: SelectInputItem) => void;
    onSelect?: (item: SelectInputItem) => void;
}
declare const SelectInput: react.NamedExoticComponent<SelectInputProps>;

interface SplitViewProps extends BoxProps {
    children: ReactNode;
    direction?: 'top' | 'bottom';
}
declare const SplitView: react.NamedExoticComponent<SplitViewProps>;

type Theme = {
    components: Record<string, ComponentTheme>;
};
type ComponentTheme = {
    config?: (props?: any) => Record<string, unknown>;
    styles?: Record<string, (props?: any) => ComponentStyles>;
};
type ComponentStyles = Record<string, unknown>;
declare const defaultTheme: Theme;
declare const ThemeContext: react.Context<Theme>;
type ThemeProviderProps = {
    readonly children: ReactNode;
    readonly theme: Theme;
};
declare const extendTheme: (originalTheme: Theme, newTheme: Theme) => {
    components: Record<string, ComponentTheme>;
};
declare const useComponentTheme: <Theme extends ComponentTheme>(component: string) => Theme;

declare const ThemeProvider: react.NamedExoticComponent<{
    children: ReactNode;
}>;

export { Alert, type AlertProps, Badge, type BadgeProps, type ComponentStyles, type ComponentTheme, ConfigPanel, type ConfigPanelItem, type ConfigPanelProps, ConfirmInput, type ConfirmInputProps, EmailInput, type EmailInputProps, MultiSelect, type MultiSelectProps, type Option, OrderedList, type OrderedListProps, Panel, type PanelProps, PasswordInput, type PasswordInputProps, ProgressBar, type ProgressBarProps, Select, SelectInput, type SelectInputItem, type SelectInputProps, type SelectProps, Spinner, type SpinnerProps, SplitView, type SplitViewProps, StatusMessage, type StatusMessageProps, TextInput, type TextInputProps, type Theme, ThemeContext, ThemeProvider, type ThemeProviderProps, UnorderedList, type UnorderedListProps, type UseSpinnerProps, type UseSpinnerResult, _default as alert, defaultTheme, extendTheme, render, useComponentTheme, useSpinner, useTheme };