@dossierhq/design/lib/utils/LayoutPropsUtils.d.ts

The design system for Dossier.

import type { FlexContainerProps } from './FlexboxUtils.js';
export type SpacingValue = (typeof SpacingValues)[number];
export declare const SpacingValues: readonly [0, 1, 2, 3, 4, 5, 6];
export interface SpacingProps extends MarginProps, PaddingProps, GapProps {
}
export interface MarginProps {
    margin?: SpacingValue;
    marginLeft?: SpacingValue;
    marginTop?: SpacingValue;
    marginRight?: SpacingValue;
    marginBottom?: SpacingValue;
    marginHorizontal?: SpacingValue;
    marginVertical?: SpacingValue;
}
export interface PaddingProps {
    padding?: SpacingValue;
    paddingLeft?: SpacingValue;
    paddingTop?: SpacingValue;
    paddingRight?: SpacingValue;
    paddingBottom?: SpacingValue;
    paddingHorizontal?: SpacingValue;
    paddingVertical?: SpacingValue;
}
export interface GapProps {
    gap?: SpacingValue;
    columnGap?: SpacingValue;
    rowGap?: SpacingValue;
}
declare const heightToClassNameMap: {
    0: string;
    '100%': string;
    '100vh': string;
};
declare const widthToClassNameMap: {
    '100%': string;
};
declare const maxWidthToClassNameMap: {
    '40rem': string;
};
declare const aspectRatioClassNameMap: {
    '1/1': string;
    '16/9': string;
};
export interface SizeProps {
    width?: keyof typeof widthToClassNameMap;
    height?: keyof typeof heightToClassNameMap;
    maxWidth?: keyof typeof maxWidthToClassNameMap;
    aspectRatio?: keyof typeof aspectRatioClassNameMap;
}
type LayoutProps = SizeProps & SpacingProps & FlexContainerProps;
export declare function toSpacingClassName({ margin, marginLeft, marginTop, marginRight, marginBottom, marginHorizontal, marginVertical, padding, paddingLeft, paddingTop, paddingRight, paddingBottom, paddingHorizontal, paddingVertical, gap, columnGap, rowGap, }: MarginProps & PaddingProps & GapProps): string;
export declare function toSizeClassName({ width, height, maxWidth, aspectRatio }: SizeProps): string;
export declare function extractLayoutProps<T extends LayoutProps>(props: T): {
    layoutProps: LayoutProps;
    otherProps: Omit<T, keyof LayoutProps>;
};
export {};