@chakra-xui/system/dist/types/system.d.ts

Chakra xui system primitives

import { ResponsiveValue, SystemProps, SystemStyleObject, ChakraStyleProps } from "@chakra-xui/styled-system";
import { Dict } from "@chakra-xui/utils";
import { CSSObject, FunctionInterpolation } from "@emotion/styled";
import { As, ChakraComponent, ChakraProps, PropsOf } from "./system.types";
import { DOMElements } from "./system.utils";
interface StyleResolverProps extends SystemProps {
    __css?: SystemStyleObject;
    sx?: SystemStyleObject;
    theme: Dict;
    css?: CSSObject;
    noOfLines?: ResponsiveValue<number>;
    isTruncated?: boolean;
    layerStyle?: string;
    textStyle?: string;
    apply?: ResponsiveValue<string>;
}
declare type StyleResolver = (params: {
    baseStyle?: SystemStyleObject;
}) => FunctionInterpolation<StyleResolverProps>;
/**
 * Style resolver function that manages how style props are merged
 * in combination with other possible ways of defining styles.
 *
 * For example, take a component defined this way:
 * ```jsx
 * <Box fontSize="24px" sx={{ fontSize: "40px" }}></Box>
 * ```
 *
 * We want to manage the priority of the styles properly to prevent unwanted
 * behaviors. Right now, the `sx` prop has the highest priority so the resolved
 * fontSize will be `40px`
 */
export declare const styleResolver: StyleResolver;
interface StyledOptions {
    shouldForwardProp?(prop: string): boolean;
    label?: string;
    baseStyle?: SystemStyleObject;
}
export declare function styled<T extends As, P = {}>(component: T, options?: StyledOptions): ChakraComponent<T, P>;
export declare type HTMLChakraComponents = {
    [Tag in DOMElements]: ChakraComponent<Tag, {}>;
};
export declare type HTMLChakraProps<T extends As> = Omit<PropsOf<T>, T extends "svg" ? "ref" | "children" | keyof ChakraStyleProps : "ref" | keyof ChakraStyleProps> & ChakraProps & {
    as?: As;
};
declare type ChakraFactory = {
    <T extends As, P = {}>(component: T, options?: StyledOptions): ChakraComponent<T, P>;
};
export declare const chakra: ChakraFactory & HTMLChakraComponents;
export {};