27 lines
815 B
TypeScript
27 lines
815 B
TypeScript
import type { Theme } from './utils';
|
|
import { getStyles } from './utils';
|
|
import styled from 'styled-components';
|
|
|
|
type WithArrayType<T> = {
|
|
[K in keyof T]: Array<T[K]> | T[K];
|
|
};
|
|
|
|
type AllowedProps = Omit<HTMLDivElement['style'], 'color' | 'translate'>;
|
|
|
|
export type GridProps = Partial<WithArrayType<AllowedProps>>;
|
|
export const Grid = styled.div<GridProps>`
|
|
display: grid;
|
|
${({ theme, ...props }: GridProps & { theme: Theme }) => getStyles(props, theme)}
|
|
`;
|
|
|
|
export type FlexProps = GridProps;
|
|
export const Flex = styled.div<GridProps>`
|
|
display: flex;
|
|
${({ theme, ...props }: GridProps & { theme: Theme }) => getStyles(props, theme)}
|
|
`;
|
|
|
|
export type BoxProps = GridProps;
|
|
export const Box = styled.div<GridProps>`
|
|
${({ theme, ...props }: GridProps & { theme: Theme }) => getStyles(props, theme)}
|
|
`;
|