import React from 'react';
import type { Cursor } from '@instructure/ui-prop-types';
import type { AsElementType, OtherHTMLAttributes, PropValidators, ViewTheme } from '@instructure/shared-types';
import type { WithStyleProps, Spacing, BorderWidth, BorderRadii, Shadow, Stacking, ComponentStyle, StyleObject } from '@instructure/emotion';
type BorderColor = string | 'transparent' | 'primary' | 'secondary' | 'brand' | 'info' | 'success' | 'warning' | 'alert' | 'danger';
type ViewOwnProps = {
    /**
     * The element to render as the component root, `span` by default
     */
    as?: AsElementType;
    /**
     * provides a reference to the underlying html element
     */
    elementRef?: (element: HTMLElement | null) => void;
    /**
     * By default the display prop is 'auto', meaning it takes on the
     * display rules of the html element it's rendered as (see `as` prop).
     */
    display?: 'auto' | 'inline' | 'block' | 'inline-block' | 'flex' | 'inline-flex';
    overflowX?: 'auto' | 'hidden' | 'visible';
    overflowY?: 'auto' | 'hidden' | 'visible';
    height?: string | number;
    width?: string | number;
    maxHeight?: string | number;
    maxWidth?: string | number;
    minHeight?: string | number;
    minWidth?: string | number;
    /**
     * The children to render inside the <View />
     */
    children?: React.ReactNode;
    /**
     * Designates the text alignment within the `<View />`
     */
    textAlign?: 'start' | 'center' | 'end';
    /**
     * Sets the color of the View border.
     * Accepts a color string value (e.g., "#FFFFFF", "red") or one of the predefined theme color options.
     */
    borderColor?: BorderColor;
    /**
     * Designates the background style of the `<View />`
     */
    background?: 'transparent' | 'primary' | 'secondary' | 'primary-inverse' | 'brand' | 'info' | 'alert' | 'success' | 'danger' | 'warning';
    /**
     * Specify a value for the CSS position property. Use `relative` if `focusable` will be true.
     */
    position?: 'static' | 'absolute' | 'relative' | 'sticky' | 'fixed';
    /**
     * The `left` CSS property in left-to-right interfaces. Will not do anything if `position === "static"`.
     */
    insetInlineStart?: string;
    /**
     * The `right` CSS property in left-to-right interfaces. Will not do anything if `position === "static"`.
     */
    insetInlineEnd?: string;
    /**
     * The `top` CSS property. Will not do anything if `position === "static"`.
     */
    insetBlockStart?: string;
    /**
     * The `bottom` CSS property. Will not do anything if `position === "static"`.
     */
    insetBlockEnd?: string;
    /**
     * Manually control if the `View` should display a focus outline.
     *
     * When left `undefined` (which is the default) the focus outline will display
     * automatically if the `View` is focusable and receives focus.
     */
    withFocusOutline?: boolean;
    /**
     * Determines whether the focus outline displays offset or inset from the focused View
     */
    focusPosition?: 'offset' | 'inset';
    /**
     * Determines the color of the focus outline
     */
    focusColor?: 'info' | 'inverse' | 'success' | 'danger';
    /**
     * Determines if the focus ring should animate when it appears
     */
    shouldAnimateFocus?: boolean;
    /**
     * Activate a dotted outline around the component to make building your
     * layout easier
     */
    withVisualDebug?: boolean;
    dir?: 'ltr' | 'rtl';
    /**
     * Valid values are `0`, `none`, `auto`, `xxx-small`, `xx-small`, `x-small`,
     * `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
     * familiar CSS-like shorthand. For example: `margin="small auto large"`.
     */
    margin?: Spacing;
    /**
     * Valid values are `0`, `none`, `xxx-small`, `xx-small`, `x-small`,
     * `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
     * familiar CSS-like shorthand. For example: `padding="small x-large large"`.
     */
    padding?: Spacing;
    /**
     * Accepts the familiar CSS shorthand to designate border widths corresponding
     * to edges
     */
    borderWidth?: BorderWidth;
    /**
     * Accepts `small`, `medium`, `large`, `circle`, and `pill`. Border radius can be
     * assigned to individual corners in CSS shorthand style (e.g., `"medium large none pill"`).
     * Also accepts valid CSS length values like `1rem` or `12px`
     */
    borderRadius?: BorderRadii;
    /**
     * Controls the shadow depth for the `<View />`
     */
    shadow?: Shadow;
    /**
     * Controls the z-index depth for the `<View />`
     */
    stacking?: Stacking;
    /**
     * Specify a mouse cursor to use when hovering over the `<View />`
     */
    cursor?: Cursor;
    /**
     * Sets what a browser does when reaching the boundary of a scrolling area.
     * Valid values are `auto`, `contain`, `none`.
     */
    overscrollBehavior?: 'auto' | 'contain' | 'none';
    /**
     * DEPRECATED, this prop does nothing. Use the focusOutlineOffset theme
     * variable
     *
     * Sets the radius of the focus border ring.
     *
     * For offset type, the given value is increased by the difference between the focus ring' offset and the focus ring's width.
     *
     * For inset type, the given value is decreased by the sum of the focus ring' offset and the focus ring's width.
     */
    focusRingBorderRadius?: string;
    /**
     * Display the focus ring when any of the descendants is focused.
     * (uses the [:focus-within](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-within)
     * CSS selector)
     */
    focusWithin?: boolean;
};
type PropKeys = keyof ViewOwnProps;
type ViewProps = ViewOwnProps & WithStyleProps<ViewTheme, ViewStyle> & OtherHTMLAttributes<ViewOwnProps>;
type AllowedPropKeys = Readonly<Array<PropKeys>>;
type ViewStyle = ComponentStyle<'view'> & {
    inlineStyles: StyleObject;
};
declare const propTypes: PropValidators<PropKeys>;
declare const allowedProps: AllowedPropKeys;
export { propTypes, allowedProps };
export type { ViewProps, ViewOwnProps, ViewStyle, BorderColor };
//# sourceMappingURL=props.d.ts.map