import { FlattenSimpleInterpolation } from 'styled-components';
import { ReactElement, ReactNode } from 'react';
import { BoxProps } from '../../components/Box';

export interface IStyledContainerWrapperProps {
    $stretch: boolean;
    $css?: FlattenSimpleInterpolation;
    $roundedInner?: boolean;
}
export interface IStyledSplitContainerWrapperProps extends IStyledContainerWrapperProps {
    $view: TContainerView;
    $minColWidth?: string;
    $gap?: string;
    $fixedWidth?: string;
}
export type TContainerView = '30/70' | '20/80' | '70/30' | '80/20' | '1/1' | '1/1/1' | '1/3/1' | 'fixed-fluid';
export interface IContainerBaseProps {
    roundedInner?: boolean;
    className?: string;
    stretch?: boolean;
    css?: BoxProps['$css'];
}
export interface ISplitContainerProps extends IContainerBaseProps {
    split: true;
    children?: [ReactElement, ReactElement] | [ReactElement, ReactElement, ReactElement];
    view?: TContainerView;
    minColWidth?: string;
    gap?: string;
    fixedWidth?: string;
}
export interface INotSplitContainerProps extends IContainerBaseProps {
    split?: false;
    children?: ReactNode;
}
export type ContainerProps = ISplitContainerProps | INotSplitContainerProps;