baseui
Version:
A React Component library implementing the Base design language
343 lines (342 loc) • 9.46 kB
TypeScript
export declare const NEEDLE_SIZES: Readonly<{
readonly none: "none";
readonly short: "short";
readonly medium: "medium";
readonly tall: "tall";
}>;
export declare const NEEDLE_HEIGHTS: Readonly<{
readonly none: 0;
readonly short: 4;
readonly medium: 12;
readonly tall: 20;
}>;
export declare const PINHEAD_SIZES_SHAPES: Readonly<{
readonly xxSmallCircle: "xx-small-circle";
readonly xxSmallSquare: "xx-small-square";
readonly xSmallCircle: "x-small-circle";
readonly xSmallSquare: "x-small-square";
readonly small: "small";
readonly medium: "medium";
readonly large: "large";
}>;
export declare const xSmallPinheadDimension: {
height: number;
icon: number;
};
export declare const xxSmallPinheadDimension: {
height: number;
icon: number;
};
export declare const PINHEAD_DIMENSIONS: Readonly<{
"xx-small-square": {
height: number;
icon: number;
};
"xx-small-circle": {
height: number;
icon: number;
};
"x-small-square": {
height: number;
icon: number;
};
"x-small-circle": {
height: number;
icon: number;
};
small: {
height: number;
icon: number;
};
medium: {
height: number;
icon: number;
};
large: {
height: number;
icon: number;
};
}>;
export declare const PINHEAD_TYPES: Readonly<{
readonly floating: "floating";
readonly fixed: "fixed";
}>;
export declare const FLOATING_MARKER_SIZES: Readonly<{
readonly small: "small";
readonly medium: "medium";
readonly large: "large";
}>;
export declare const FLOATING_MARKER_ANCHOR_POSITIONS: Readonly<{
readonly none: "none";
readonly topLeft: "top-left";
readonly topRight: "top-right";
readonly bottomRight: "bottom-right";
readonly bottomLeft: "bottom-left";
}>;
export declare const FLOATING_MARKER_ANCHOR_TYPES: Readonly<{
readonly circle: "circle";
readonly square: "square";
readonly xxSmallCircle: "xx-small-circle";
readonly xxSmallSquare: "xx-small-square";
}>;
export declare const dragShadowHeight = 4;
export declare const dragShadowMarginTop = 6;
export declare const dragShadowWidth = 6;
export declare const anchorSize = 16;
export declare const LABEL_SIZES: {
"xx-small-circle": string;
"xx-small-square": string;
"x-small-circle": string;
"x-small-square": string;
small: string;
medium: string;
large: string;
};
export declare const LABEL_ENHANCER_POSITIONS: Readonly<{
readonly none: "none";
readonly top: "top";
readonly left: "left";
readonly right: "right";
readonly bottom: "bottom";
}>;
export declare const BADGE_ENHANCER_SIZES: Readonly<{
readonly none: "none";
readonly xSmall: "x-small";
readonly small: "small";
readonly mediumText: "medium-text";
readonly mediumIcon: "medium-icon";
}>;
export declare const BADGE_ENHANCER_POSITIONS: {
"xx-small-square": any;
"xx-small-circle": any;
"x-small-square": {
none: any;
"x-small": {
x: number;
y: number;
};
small: any;
"medium-text": any;
"medium-icon": any;
};
"x-small-circle": {
none: any;
"x-small": {
x: number;
y: number;
};
small: any;
"medium-text": any;
"medium-icon": any;
};
small: {
none: any;
"x-small": {
x: number;
y: number;
};
small: {
x: number;
y: number;
};
"medium-text": any;
"medium-icon": any;
};
medium: {
none: any;
"x-small": {
x: number;
y: number;
};
small: {
x: number;
y: number;
};
"medium-text": {
x: number;
y: number;
};
"medium-icon": {
x: number;
y: number;
};
};
large: {
none: any;
"x-small": {
x: number;
y: number;
};
small: any;
"medium-text": {
x: number;
y: number;
};
"medium-icon": {
x: number;
y: number;
};
};
};
export declare const BADGE_ENHANCER_STYLES: {
readonly none: {};
readonly "x-small": {
readonly height: "8px";
readonly width: "8px";
readonly borderRadius: "50%";
};
readonly small: {
readonly height: "16px";
readonly width: "16px";
readonly borderRadius: "50%";
readonly display: "flex";
readonly alignItems: "center";
readonly justifyContent: "center";
readonly fontSize: "10px";
};
readonly "medium-text": {
readonly borderRadius: "10px";
readonly height: "20px";
readonly padding: "0px 8px";
readonly display: "flex";
readonly alignItems: "center";
readonly boxSizing: "border-box";
};
readonly "medium-icon": {
readonly height: "20px";
readonly width: "20px";
readonly borderRadius: "50%";
readonly display: "flex";
readonly alignItems: "center";
readonly justifyContent: "center";
readonly boxSizing: "border-box";
};
};
export declare const BADGE_ENHANCER_CONTENT_SIZE: {
none: number;
"x-small": number;
small: number;
"medium-text": number;
"medium-icon": number;
};
export declare const KIND: Readonly<{
readonly default: "default";
readonly accent: "accent";
readonly negative: "negative";
}>;
export declare const LOCATION_PUCK_SIZES: Readonly<{
readonly small: "small";
readonly medium: "medium";
readonly large: "large";
}>;
export declare const LOCATION_PUCK_TYPES: Readonly<{
readonly consumer: "consumer";
readonly earner: "earner";
}>;
export declare const EARNER_LOCATION_PUCK_CORE_SCALES: Readonly<{
readonly small: "50%";
readonly medium: "75%";
readonly large: "100%";
}>;
export declare const FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS: Readonly<{
readonly topLeft: "top-left";
readonly topCenter: "top-center";
readonly topRight: "top-right";
readonly rightCenter: "right-center";
readonly bottomRight: "bottom-right";
readonly bottomCenter: "bottom-center";
readonly bottomLeft: "bottom-left";
readonly leftCenter: "left-center";
}>;
export declare const FLOATING_ROUTE_MARKER_POINTER_TYPES: Readonly<{
readonly diagonal: "diagonal";
readonly horizontal: "horizontal";
readonly vertical: "vertical";
}>;
export declare const FLOATING_ROUTE_MARKER_POINTERS: Readonly<{
readonly "top-left": {
readonly type: "diagonal";
readonly path: "M0 0L24 8L8 24L0 0Z";
};
readonly "top-right": {
readonly type: "diagonal";
readonly path: "M24 0L0 8L16 24L24 0Z";
};
readonly "top-center": {
readonly type: "vertical";
readonly path: "M8.49928 0L0.499411 8L16.5006 8L8.49928 0Z";
};
readonly "bottom-left": {
readonly type: "diagonal";
readonly path: "M0 24L24 16L8 0L0 24Z";
};
readonly "bottom-right": {
readonly type: "diagonal";
readonly path: "M24 24L0 16L16 0L24 24Z";
};
readonly "bottom-center": {
readonly type: "vertical";
readonly path: "M8.00133 8L16.0012 0H0L8.00133 8Z";
};
readonly "left-center": {
readonly type: "horizontal";
readonly path: "M0.000610352 8.00059L8.00061 16.0005L8.00061 -0.000732422L0.000610352 8.00059Z";
};
readonly "right-center": {
readonly type: "horizontal";
readonly path: "M8.00061 7.99916L0.000610352 -0.000711441L0.000610352 16.0005L8.00061 7.99916Z";
};
}>;
export declare const FLOATING_ROUTE_MARKER_POINTER_TRANSFORMS: Readonly<{
readonly "top-left": {
readonly transform: "translate(-33.33%, -33.33%)";
};
readonly "top-right": {
readonly right: 0;
readonly transform: "translate(33.33%, -33.33%)";
};
readonly "bottom-left": {
readonly transform: "translate(-33.33%, 33.33%)";
readonly bottom: 0;
};
readonly "bottom-right": {
readonly right: 0;
readonly transform: "translate(33.33%, 33.33%)";
readonly bottom: 0;
};
readonly "top-center": {
readonly right: "50%";
readonly transform: "translate(50%, -100%)";
};
readonly "bottom-center": {
readonly bottom: 0;
readonly right: "50%";
readonly transform: "translate(50%, 100%)";
};
readonly "left-center": {
readonly top: "50%";
readonly transform: "translate(-100%, -50%)";
};
readonly "right-center": {
readonly left: "100%";
readonly top: "50%";
readonly transform: "translate(0%, -50%)";
};
}>;
export declare const FLOATING_ROUTE_MARKER_POINTER_TYPE_WRAPPER_SIZES: Readonly<{
readonly diagonal: {
readonly height: "24";
readonly width: "24";
readonly viewBox: "0 0 24 24";
};
readonly vertical: {
readonly height: "8";
readonly width: "17";
readonly viewBox: "0 0 17 8";
};
readonly horizontal: {
readonly height: "16";
readonly width: "8";
readonly viewBox: "0 0 8 16";
};
}>;