@re-flex/styles/sx.d.ts

Core Style Util Package

import { CSSProperties } from "react";
import { CSSAttribute } from "./Gooberize";
import { BreakPointsKeys, PropertyStringPath, Theme } from "./Types";
declare type BreakpointValueGeneric<T> = {
    [key in BreakPointsKeys]?: T;
};
declare type ColorPath = PropertyStringPath<Theme["palette"]> | CSSProperties["backgroundColor"];
declare type DefaultORBreakpointType<T> = BreakpointValueGeneric<T> | T;
export declare type ShortSxType = {
    backgroundColor?: ColorPath;
    bgColor?: ColorPath;
    color?: ColorPath;
    w?: CSSProperties["width"];
    h?: CSSProperties["height"];
    m?: CSSProperties["margin"];
    mt?: CSSProperties["marginTop"];
    mr?: CSSProperties["marginRight"];
    mb?: CSSProperties["marginBottom"];
    ml?: CSSProperties["marginLeft"];
    mx?: CSSProperties["marginLeft"];
    my?: CSSProperties["marginTop"];
    p?: CSSProperties["padding"];
    pt?: CSSProperties["paddingTop"];
    pr?: CSSProperties["paddingRight"];
    pb?: CSSProperties["paddingBottom"];
    pl?: CSSProperties["paddingLeft"];
    px?: CSSProperties["paddingLeft"];
    py?: CSSProperties["paddingTop"];
    boxShadow?: CSSProperties["boxShadow"] | number;
};
declare type Tags = keyof JSX.IntrinsicElements;
export declare type ShortSxTypeWithBreakpoints = {
    [P in keyof ShortSxType]?: DefaultORBreakpointType<ShortSxType[P]>;
};
export declare type Properties = ShortSxTypeWithBreakpoints & {
    [P in keyof CSSProperties]?: DefaultORBreakpointType<CSSProperties[P]>;
};
export declare type PropertiesWithBreakPoints = Properties & {
    [k in BreakPointsKeys]?: ShortSxTypeWithBreakpoints;
};
export declare type SxType = PropertiesWithBreakPoints & {
    [k in Tags]?: SxType;
};
export declare const sxPropInitializer: (args: SxType | ((theme: Theme) => SxType)) => CSSAttribute;
export default sxPropInitializer;