goobs-frontend/dist/theme/treeview.d.ts

A comprehensive React-based libary for building modern web applications

import { default as React } from 'react';
export interface TreeViewTheme {
    container: {
        backgroundColor: string;
        backgroundImage?: string;
        backgroundRepeat?: string;
        backgroundSize?: string;
        backgroundPosition?: string;
        backgroundAttachment?: string;
        backgroundOrigin?: string;
        backgroundClip?: string;
        border?: string;
        borderWidth?: string;
        borderStyle?: string;
        borderColor?: string;
        borderRadius: string;
        boxShadow: string;
        backdropFilter: string;
        color: string;
        fontFamily: string;
        fontSize: string;
        lineHeight: string | number;
        padding: string;
        width: string;
        minWidth: string;
        maxWidth?: string;
        height: string;
        minHeight?: string;
        maxHeight?: string;
        overflow: string;
        position: React.CSSProperties['position'];
    };
    item: {
        backgroundColor: string;
        backgroundImage?: string;
        backgroundRepeat?: string;
        backgroundSize?: string;
        backgroundPosition?: string;
        backgroundAttachment?: string;
        backgroundOrigin?: string;
        backgroundClip?: string;
        border?: string;
        borderWidth?: string;
        borderStyle?: string;
        borderColor?: string;
        borderRadius: string;
        color: string;
        fontFamily: string;
        fontSize: string;
        fontWeight: string | number;
        letterSpacing: string;
        textShadow?: string;
        padding: string;
        minHeight: string;
        margin: string;
        cursor: string;
        transition: string;
        outline: string;
        position: React.CSSProperties['position'];
        display: string;
        alignItems: string;
        whiteSpace: string;
        textOverflow: string;
        overflow: string;
    };
    itemHover: {
        backgroundColor: string;
        borderColor?: string;
        color: string;
        transform?: string;
        textShadow?: string;
        boxShadow?: string;
    };
    itemSelected: {
        backgroundColor: string;
        borderColor?: string;
        color: string;
        fontWeight: string | number;
        textShadow?: string;
        boxShadow?: string;
        backgroundImage?: string;
    };
    itemExpanded: {
        backgroundColor: string;
        borderColor?: string;
        color: string;
        fontWeight: string | number;
        textShadow?: string;
    };
    itemDisabled: {
        backgroundColor: string;
        color: string;
        cursor: string;
        opacity: number;
        borderColor?: string;
    };
    itemFocused: {
        outline: string;
        outlineOffset: string;
        boxShadow: string;
        backgroundColor?: string;
    };
    iconContainer: {
        display: string;
        alignItems: string;
        justifyContent: string;
        width: string;
        height: string;
        minWidth: string;
        marginRight: string;
        position: React.CSSProperties['position'];
        cursor: string;
        transition: string;
    };
    expandIcon: {
        color: string;
        fontSize: string;
        transition: string;
        filter?: string;
        opacity?: number;
    };
    expandIconHover: {
        color: string;
        transform: string;
        filter?: string;
    };
    expandIconExpanded: {
        transform: string;
        color: string;
        filter?: string;
    };
    checkbox: {
        width: string;
        height: string;
        marginRight: string;
        accentColor: string;
        cursor: string;
        transition: string;
        borderRadius?: string;
        border?: string;
        backgroundColor?: string;
        backgroundImage?: string;
        backgroundRepeat?: string;
        backgroundSize?: string;
        backgroundPosition?: string;
        backgroundAttachment?: string;
        backgroundOrigin?: string;
        backgroundClip?: string;
    };
    content: {
        paddingLeft: string;
        borderLeft?: string;
        marginLeft?: string;
        position: React.CSSProperties['position'];
        transition: string;
        overflow: string;
    };
    label: {
        flex: string;
        fontSize: string;
        fontWeight: string | number;
        color: string;
        textShadow?: string;
        userSelect: React.CSSProperties['userSelect'];
        cursor: string;
        transition: string;
        whiteSpace: string;
        textOverflow: string;
        overflow: string;
    };
    sacred?: {
        glyph: {
            position: React.CSSProperties['position'];
            color: string;
            fontSize: string;
            zIndex: number;
            pointerEvents: string;
            transition: string;
            opacity: number;
            animation?: string;
        };
        glyphLeft: {
            left: string;
            top: string;
            transform: string;
        };
        glyphRight: {
            right: string;
            top: string;
            transform: string;
        };
        glyphVisible: {
            opacity: number;
            animation?: string;
        };
        shimmer: {
            position: string;
            top: string;
            left: string;
            width: string;
            height: string;
            backgroundColor: string;
            backgroundImage: string;
            backgroundRepeat: string;
            backgroundSize: string;
            backgroundPosition: string;
            backgroundAttachment: string;
            backgroundOrigin: string;
            backgroundClip: string;
            animation?: string;
            pointerEvents: string;
        };
        backgroundGlyph: {
            position: string;
            top: string;
            right: string;
            color: string;
            fontSize: string;
            animation?: string;
            pointerEvents: string;
            zIndex: number;
        };
    };
    transition: string;
}
export interface TreeViewStyles {
    theme?: 'light' | 'dark' | 'sacred';
    backgroundColor?: string;
    borderColor?: string;
    borderRadius?: string;
    borderWidth?: string;
    boxShadow?: string;
    backdropFilter?: string;
    backgroundImage?: string;
    color?: string;
    fontFamily?: string;
    fontSize?: string;
    lineHeight?: string | number;
    padding?: string;
    width?: string;
    minWidth?: string;
    maxWidth?: string;
    height?: string;
    minHeight?: string;
    maxHeight?: string;
    itemBackgroundColor?: string;
    itemBorderColor?: string;
    itemBorderRadius?: string;
    itemColor?: string;
    itemFontFamily?: string;
    itemFontSize?: string;
    itemFontWeight?: string | number;
    itemLetterSpacing?: string;
    itemTextShadow?: string;
    itemPadding?: string;
    itemMinHeight?: string;
    itemMargin?: string;
    itemHoverBackgroundColor?: string;
    itemHoverBorderColor?: string;
    itemHoverColor?: string;
    itemHoverTransform?: string;
    itemHoverTextShadow?: string;
    itemHoverBoxShadow?: string;
    itemSelectedBackgroundColor?: string;
    itemSelectedBorderColor?: string;
    itemSelectedColor?: string;
    itemSelectedFontWeight?: string | number;
    itemSelectedTextShadow?: string;
    itemSelectedBoxShadow?: string;
    itemSelectedBackgroundImage?: string;
    itemExpandedBackgroundColor?: string;
    itemExpandedBorderColor?: string;
    itemExpandedColor?: string;
    itemExpandedFontWeight?: string | number;
    itemExpandedTextShadow?: string;
    itemDisabledBackgroundColor?: string;
    itemDisabledColor?: string;
    itemDisabledOpacity?: number;
    itemDisabledBorderColor?: string;
    itemFocusedOutline?: string;
    itemFocusedOutlineOffset?: string;
    itemFocusedBoxShadow?: string;
    itemFocusedBackgroundColor?: string;
    iconContainerWidth?: string;
    iconContainerHeight?: string;
    iconContainerMarginRight?: string;
    expandIconColor?: string;
    expandIconFontSize?: string;
    expandIconHoverColor?: string;
    expandIconHoverTransform?: string;
    expandIconExpandedTransform?: string;
    expandIconExpandedColor?: string;
    checkboxWidth?: string;
    checkboxHeight?: string;
    checkboxMarginRight?: string;
    checkboxAccentColor?: string;
    checkboxBorderRadius?: string;
    checkboxBorder?: string;
    checkboxBackground?: string;
    contentPaddingLeft?: string;
    contentBorderLeft?: string;
    contentMarginLeft?: string;
    labelFontSize?: string;
    labelFontWeight?: string | number;
    labelColor?: string;
    labelTextShadow?: string;
    itemChildrenIndentation?: string | number;
    levelIndentBase?: number;
    levelIndentIncrement?: number;
    sacredGlyphColor?: string;
    sacredGlyphFontSize?: string;
    sacredGlyphAnimation?: string;
    sacredShimmerBackground?: string;
    sacredShimmerAnimation?: string;
    sacredBackgroundGlyphColor?: string;
    sacredBackgroundGlyphAnimation?: string;
    margin?: string;
    marginTop?: string;
    marginBottom?: string;
    marginLeft?: string;
    marginRight?: string;
    transitionDuration?: string;
    transitionEasing?: string;
    disabled?: boolean;
    outline?: boolean;
    multiSelect?: boolean;
    checkboxSelection?: boolean;
    disableSelection?: boolean;
    expandOnClick?: boolean;
}
export declare const treeViewThemes: Record<'light' | 'dark' | 'sacred', TreeViewTheme>;
export declare const getTreeViewStyles: (styles?: TreeViewStyles, isDisabled?: boolean) => React.CSSProperties;
export declare const getTreeItemStyles: (styles?: TreeViewStyles, isHovered?: boolean, isSelected?: boolean, isExpanded?: boolean, isFocused?: boolean, isDisabled?: boolean, level?: number) => {
    item: React.CSSProperties;
    iconContainer: React.CSSProperties;
    expandIcon: React.CSSProperties;
    checkbox: React.CSSProperties;
    label: React.CSSProperties;
    content: React.CSSProperties;
};
//# sourceMappingURL=treeview.d.ts.map