/**
 * Copyright 2019, SumUp Ltd.
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/** @jsxImportSource @emotion/react */
import { type ReactElement } from 'react';
export interface InlineElementsProps {
    /**
     * The child elements to be displayed inline.
     */
    children: ReactElement | ReactElement[];
    /**
     * Let's children take up widths according to given ratios. The ratios are
     * equivalent to the flex-grow parameter, which they are used with.
     */
    ratios?: number[];
    /**
     * Forces inline display even on mobile.
     */
    inlineMobile?: boolean;
}
/**
 * @deprecated Use [CSS Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) or [CSS Grid](https://css-tricks.com/css-grid-layout-guide/) instead.
 *
 * Layout helper that displays child elements inline. Useful for form elements.
 */
export declare const InlineElements: import("@emotion/styled").StyledComponent<{
    theme?: import("@emotion/react").Theme;
    as?: React.ElementType;
} & InlineElementsProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;