import * as class_variance_authority_types from 'class-variance-authority/types';
import * as React from 'react';
import { VariantProps } from 'class-variance-authority';

/**
 * The page-width column, carrying the same lateral rhythm the chrome
 * components apply to their own inner wrappers.
 *
 * `Masthead`, `Header`, `MainNav` and `Footer` each declare a private
 * `*ContainerVariants` with an identical `16px → 24px → 48px` padding ramp
 * funnelled through a `--<name>-padding-x` custom property. Nothing exposed
 * that rhythm to page CONTENT, so every consuming app retyped it — and any
 * app that retyped it slightly differently got content that failed to line up
 * with the header above it at one breakpoint but not the others, which is the
 * hardest kind of misalignment to notice in review.
 *
 * The variant names (`fluid` / `contained`) and the `--container-max-width`
 * escape hatch deliberately mirror the chrome's vocabulary, so a shell that
 * themes its `Header` writes the same word here.
 */
declare const containerVariants: (props?: ({
    size?: "fluid" | "contained" | "wide" | "narrow" | null | undefined;
} & class_variance_authority_types.ClassProp) | undefined) => string;
type ContainerProps = React.ComponentPropsWithoutRef<'div'> & VariantProps<typeof containerVariants> & {
    ref?: React.Ref<HTMLDivElement>;
};
/**
 * Width-constraining page column with the NSW lateral rhythm.
 *
 * Purely presentational — it renders a `<div>` and adds no semantics, so it
 * can sit inside any landmark without affecting the document outline. Pair it
 * with `Section` for vertical rhythm.
 */
declare function Container({ className, size, ref, ...props }: ContainerProps): React.JSX.Element;

export { Container, type ContainerProps, containerVariants };