import type { Spacing } from "@mui/system/createTheme/createSpacing";
import type { CSSProperties, FC, HTMLAttributes } from "react";
import type { Alignment } from "../layout";
import type { ComponentModel } from "../models";
import type { UIContextProps } from "../ui";
/**
 * Base properties for a component corresponding to an element in a VertiGIS
 * Studio layout.
 */
export interface LayoutElementProperties<M extends ComponentModel = ComponentModel> extends Omit<HTMLAttributes<HTMLElement>, "style"> {
    /**
     * The ID of the component. This will be unique within the layout.
     */
    id?: string;
    /**
     * Whether the element is initially active.
     */
    active?: boolean;
    /**
     * Whether the component is available.
     */
    available?: boolean;
    /**
     * The name of the layout element.
     */
    element?: string;
    /**
     * The gap within child component, in em units (number) or spacing units
     * (string) represented as the units followed by an 's' eg: '1s`.
     */
    gap?: number | string;
    /**
     * The XML namespace of the layout element.
     */
    namespace?: string;
    /**
     * The component's model, if it has one.
     */
    model?: M;
    /**
     * The initial width of the component, in em units.
     */
    width?: number;
    /**
     * The initial height of the component, in em units.
     */
    height?: number;
    /**
     * The margin around the component, in em units (number) or spacing units
     * (string) represented as the units followed by an 's' eg: '1s`.
     */
    margin?: number | string;
    /**
     * The padding within the component, in em units (number) or spacing units
     * (string) represented as the units followed by an 's' eg: '1s`.
     */
    padding?: number | string;
    /**
     * Describes how the content of a component is horizontally aligned.
     */
    halign?: Alignment;
    /**
     * Describes how the content of a component is vertically aligned.
     */
    valign?: Alignment;
    /**
     * Determines how a this component will grow over its parent's primary axis
     * (see CSS property flex-grow for more details).
     */
    grow?: number;
    /**
     * Allows overflow content to have a scrollbar on the Y axis.
     */
    scrollContainerY?: boolean;
    /**
     * Allows overflow content to have a scrollbar on the X axis.
     */
    scrollContainerX?: boolean;
    /**
     * A named region in the parent where this component should be placed.
     */
    slot?: string;
    /**
     * Indicates if the element should be 'stretchy' if required.
     */
    stretch?: boolean;
    /**
     * Optionally pass in style that should be applied to this component.
     */
    style?: CSSProperties | string | undefined;
    /**
     * A function that can be invoked to pre-load all child layout elements.
     */
    preloadChildren: () => Promise<void>;
    /**
     * Indicates the visual state of the component.
     */
    visualState?: string;
    /**
     * A callback for changing the visual state.
     */
    changeVisualState?: (visualState: string) => void;
}
/**
 * A root element for components that correspond to a VertiGIS Studio layout
 * element. Layout attributes will be automatically converted to appropriate DOM
 * attributes.
 *
 * @param props The layout element properties.
 */
declare const LayoutElement: FC<LayoutElementProperties>;
export default LayoutElement;
/**
 * Converts layout XML attributes to DOM properties.
 *
 * @param props The props passed into LayoutElement.
 * @param context The UI context.
 * @param spacing The themes Spacing.
 * @param existingProps Props of the root element being wrapped by
 *   LayoutElement.
 */
export declare function getDomPropsFromLayoutProps<M extends ComponentModel = ComponentModel>(props: LayoutElementProperties<M>, context: UIContextProps, spacing: Spacing, existingProps?: HTMLAttributes<HTMLElement>): HTMLAttributes<HTMLElement> & {
    "data-layout-id": string;
};
/**
 * Converts a number in em units or a string in spacing units to a number in
 * spacing units. Conversion note: 1em == 14px, standard spacing == 8px.
 *
 * @param input The input to change to spacing units.
 */
export declare const toSpacingUnits: (input: number | string) => number;