@sanity/ui 3.0.0-static.2 → 3.0.0-static.21

package/dist/_visual-editing.d.mts

@@ -1,806 +0,0 @@
-import {BoxStyleProps} from '@sanity/ui/css'
-import {ButtonStyleProps} from '@sanity/ui/css'
-import {CardStyleProps} from '@sanity/ui/css'
-import type {ComponentProps} from 'react'
-import {DisplayStyleProps} from '@sanity/ui/css'
-import {ElementProps} from '../..'
-import {ElementType} from 'react'
-import {FlexStyleProps} from '@sanity/ui/css'
-import {FontTextSize} from '@sanity/ui/theme'
-import {ForwardedRef} from 'react'
-import {ForwardRefExoticComponent} from 'react'
-import {GapStyleProps} from '@sanity/ui/css'
-import {InputStyleProps} from '@sanity/ui/css'
-import {InsetStyleProps} from '@sanity/ui/css'
-import {MutableRefObject} from 'react'
-import {NamedExoticComponent} from 'react'
-import {PaddingStyleProps} from '@sanity/ui/css'
-import {PolymorphicProps} from '../..'
-import {PositionStyleProps} from '@sanity/ui/css'
-import {Radius} from '@sanity/ui/theme'
-import {RadiusStyleProps} from '@sanity/ui/css'
-import {ReactElement} from 'react'
-import {ReactNode} from 'react'
-import {ReactPortal} from 'react'
-import {RefAttributes} from 'react'
-import {RefCallback} from 'react'
-import {ResponsiveProp} from '@sanity/ui/css'
-import {RootTheme} from '@sanity/ui/theme'
-import {ShadowStyleProps} from '@sanity/ui/css'
-import {Space} from '@sanity/ui/theme'
-import {TextOverflowStyleProps} from '@sanity/ui/css'
-import {TextStyleProps} from '@sanity/ui/css'
-import {Theme_v2} from '@sanity/ui/theme'
-import {ThemeColorButtonModeKey} from '@sanity/ui/theme'
-import {ThemeColorCardToneKey} from '@sanity/ui/theme'
-import {ThemeColorSchemeKey} from '@sanity/ui/theme'
-import {ThemeColorStateToneKey} from '@sanity/ui/theme'
-import {ThemeFontWeightKey} from '@sanity/ui/theme'
-import {Width} from '@sanity/ui/css'
-
-/** @public */
-declare type Assign<T, U> = Omit<T, keyof U> & U
-
-/**
- * The `Box` component is a basic layout wrapper component which provides utility properties
- * for flex, margins and padding.
- *
- * @public
- */
-export declare const Box: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof BoxProps> &
-    BoxProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare interface BoxProps
-  extends BoxStyleProps,
-    GapStyleProps,
-    InsetStyleProps,
-    PositionStyleProps {}
-
-/**
- * @public
- */
-export declare const Button: ForwardRefExoticComponent<
-  Omit<ElementProps<'button'> & PolymorphicProps, keyof ButtonProps> &
-    ButtonProps &
-    RefAttributes<HTMLButtonElement>
->
-
-/**
- * @public
- * @deprecated Use `ThemeColorButtonModeKey` instead
- */
-declare type ButtonMode = ThemeColorButtonModeKey
-
-/**
- * @public
- */
-export declare interface ButtonProps
-  extends ButtonStyleProps,
-    DisplayStyleProps,
-    FlexStyleProps,
-    GapStyleProps,
-    PaddingStyleProps {
-  'data-ui'?: string
-  'fontSize'?: ResponsiveProp<FontTextSize>
-  'href'?: string
-  'mode'?: ButtonMode
-  'icon'?: ElementType | ReactNode
-  'iconRight'?: ElementType | ReactNode
-  /** @beta Do not use in production, as this might change.*/
-  'loading'?: boolean
-  'selected'?: boolean
-  /** @deprecated Use `gap` instead. */
-  'space'?: ResponsiveProp<Space>
-  'textAlign'?: ButtonTextAlign
-  'muted'?: boolean
-  'target'?: string
-  'text'?: ReactNode
-  'textOverflow'?: TextProps['textOverflow']
-  'textWeight'?: TextProps['weight']
-  'tone'?: ButtonTone
-  'type'?: 'button' | 'reset' | 'submit'
-  'width'?: ResponsiveProp<Width>
-}
-
-/**
- * @public
- */
-declare type ButtonTextAlign = 'left' | 'right' | 'center'
-
-/**
- * @public
- * @deprecated Use `ThemeColorStateToneKey` instead
- */
-declare type ButtonTone = ThemeColorStateToneKey
-
-/**
- * The `Card` component acts much like a `Box`, but with a background and foreground color.
- * Components within a `Card` inherit its colors.
- *
- * @public
- */
-export declare const Card: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof CardProps> &
-    CardProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare interface CardProps extends BoxProps, CardStyleProps {
-  /**
-   * Do not use in production.
-   * @beta
-   */
-  __unstable_checkered?: boolean
-  /**
-   * Do not use in production.
-   * @beta
-   */
-  __unstable_focusRing?: boolean
-  disabled?: boolean
-  href?: string
-  pressed?: boolean
-  selected?: boolean
-  target?: string
-}
-
-/**
- * @public
- */
-declare type Delay =
-  | number
-  | Partial<{
-      open: number
-      close: number
-    }>
-
-/** @public */
-declare type ElementProps_2<E extends ElementType> = Omit<ComponentProps<E>, 'as' | 'ref'>
-
-/**
- * The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).
- *
- * @public
- */
-export declare const Flex: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof FlexProps> &
-    FlexProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare interface FlexProps extends Omit<BoxProps, 'display'> {
-  htmlFor?: string
-}
-
-/**
- * The `Grid` component is for building 2-dimensional layers (based on CSS grid).
- *
- * @public
- */
-export declare const Grid: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof GridProps> &
-    GridProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare interface GridProps extends Omit<BoxProps, 'display'> {}
-
-/**
- * Represent hotkeys (a keyboard combination) with semantic `<kbd>` elements.
- *
- * @public
- */
-export declare const Hotkeys: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof HotkeysProps> &
-    HotkeysProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare interface HotkeysProps extends GapStyleProps, RadiusStyleProps {
-  fontSize?: ResponsiveProp<FontTextSize>
-  padding?: ResponsiveProp<Space>
-  /** @deprecated Use `gap` instead. */
-  space?: ResponsiveProp<Space>
-  keys?: string[]
-}
-
-/**
- * @public
- */
-declare interface InlineProps extends Omit<BoxProps, 'align' | 'display' | 'justify'> {
-  /** @deprecated Use `gap` instead. */
-  space?: ResponsiveProp<Space>
-}
-
-/**
- * @internal
- */
-export declare function isHTMLAnchorElement(element: unknown): element is HTMLAnchorElement
-
-/**
- * @internal
- */
-export declare function isHTMLElement(node: unknown): node is HTMLElement
-
-/**
- * @public
- */
-declare interface LayerProps extends BoxProps {
-  /** A callback that fires when the layer becomes the top layer when it was not the top layer before. */
-  onActivate?: (props: {activeElement: HTMLElement | null}) => void
-  zOffset?: number | number[]
-}
-
-/**
- * @public
- */
-export declare function LayerProvider(props: LayerProviderProps): ReactElement
-
-export declare namespace LayerProvider {
-  var displayName: string
-}
-
-/**
- * @public
- */
-declare interface LayerProviderProps {
-  children?: ReactNode
-  zOffset?: number | number[]
-}
-
-/**
- * The `Menu` component is a building block for application menus.
- *
- * @public
- */
-export declare const Menu: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof MenuProps> &
-    MenuProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare const MenuDivider: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, never> &
-    MenuDividerProps &
-    RefAttributes<HTMLHRElement>
->
-
-/** @public */
-declare interface MenuDividerProps {}
-
-/**
- * @public
- */
-export declare function MenuGroup(props: Props<MenuGroupProps, 'div'>): ReactElement
-
-export declare namespace MenuGroup {
-  var displayName: string
-}
-
-/**
- * @public
- */
-export declare interface MenuGroupProps extends GapStyleProps {
-  disabled?: boolean
-  fontSize?: ResponsiveProp<FontTextSize>
-  icon?: ElementType | ReactNode
-  menu?: Omit<
-    MenuProps,
-    | 'onClickOutside'
-    | 'onEscape'
-    | 'onItemClick'
-    | 'onKeyDown'
-    | 'onMouseEnter'
-    | 'registerElement'
-    | 'shouldFocus'
-    | 'onBlurCapture'
-  >
-  padding?: ResponsiveProp<Space>
-  popover?: Omit<PopoverProps, 'content' | 'open'>
-  radius?: Radius | Radius[]
-  /** @deprecated Use `gap` instead. */
-  space?: ResponsiveProp<Space>
-  text: ReactNode
-  tone?: SelectableTone
-}
-
-/**
- * @public
- */
-export declare const MenuItem: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof MenuItemProps> &
-    MenuItemProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare interface MenuItemProps extends GapStyleProps, PaddingStyleProps, RadiusStyleProps {
-  disabled?: boolean
-  fontSize?: number | number[]
-  hotkeys?: string[]
-  icon?: ElementType | ReactNode
-  iconRight?: ElementType | ReactNode
-  pressed?: boolean
-  selected?: boolean
-  /** @deprecated Use `gap` instead. */
-  space?: ResponsiveProp<Space>
-  text?: ReactNode
-  tone?: SelectableTone
-}
-
-/**
- * @public
- */
-export declare interface MenuProps extends PaddingStyleProps, Pick<GapStyleProps, 'gap'> {
-  /**
-   * @deprecated Use `shouldFocus="first"` instead.
-   */
-  'focusFirst'?: boolean
-  /**
-   * @deprecated Use `shouldFocus="last"` instead.
-   */
-  'focusLast'?: boolean
-  'onClickOutside'?: (event: MouseEvent) => void
-  'onEscape'?: () => void
-  'onItemClick'?: () => void
-  'onItemSelect'?: (index: number) => void
-  'originElement'?: HTMLElement | null
-  'registerElement'?: (el: HTMLElement) => () => void
-  'shouldFocus'?: 'first' | 'last' | null
-  /** @deprecated Use `gap` property instead. */
-  'space'?: ResponsiveProp<Space>
-  'aria-labelledby'?: string
-}
-
-/**
- * Placement of floating UI elements.
- *
- * @public
- */
-declare type Placement =
-  | 'top'
-  | 'top-start'
-  | 'top-end'
-  | 'right'
-  | 'right-start'
-  | 'right-end'
-  | 'bottom'
-  | 'bottom-start'
-  | 'bottom-end'
-  | 'left'
-  | 'left-start'
-  | 'left-end'
-
-declare interface PolymorphicProps_2 {
-  as?: ElementType
-}
-
-/**
- * The `Popover` component is used to display some content on top of another.
- *
- * @public
- */
-export declare const Popover: NamedExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof PopoverProps> &
-    PopoverProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @beta
- */
-export declare type PopoverMargins = [number, number, number, number]
-
-/** @public */
-export declare interface PopoverProps extends CardProps, LayerProps {
-  /** @beta */
-  __unstable_margins?: PopoverMargins
-  /**
-   * Whether the popover should animate in and out.
-   *
-   * @beta
-   * @defaultValue false
-   */
-  animate?: boolean
-  arrow?: boolean
-  /** @deprecated Use `floatingBoundary` and/or `referenceBoundary` instead */
-  boundaryElement?: HTMLElement | null
-  children?: ReactElement<{
-    ref: ForwardedRef<HTMLElement>
-  }>
-  /**
-     * When `true`, prevent overflow within the current boundary:
-     * - by flipping on its side axis
-     * - by resizing
-     /*
-     * Note that:
-     * - setting `preventOverflow` to `true` also prevents overflow on its side axis
-     * - setting `matchReferenceWidth` to `true` also causes the popover to resize
-     *
-     * @defaultValue false
-     */
-  constrainSize?: boolean
-  content?: ReactNode
-  disabled?: boolean
-  fallbackPlacements?: Placement[]
-  floatingBoundary?: HTMLElement | null
-  /**
-   * When `true`, set the maximum width to match the reference element, and also prevent overflow within
-   * the current boundary by resizing.
-   *
-   * Note that setting `constrainSize` to `true` also causes the popover to resize
-   *
-   * @defaultValue false
-   */
-  matchReferenceWidth?: boolean
-  /**
-   * When true, blocks all pointer interaction with elements beneath the popover until closed.
-   *
-   * @beta
-   * @defaultValue false
-   */
-  modal?: boolean
-  open?: boolean
-  placement?: Placement
-  /** Whether or not to render the popover in a portal element. */
-  portal?: boolean | string
-  preventOverflow?: boolean
-  referenceBoundary?: HTMLElement | null
-  /**
-   * When defined, the popover will be positioned relative to this element.
-   * The children of the popover won't be rendered.
-   */
-  referenceElement?: HTMLElement | null
-  /** @beta */
-  updateRef?:
-    | MutableRefObject<PopoverUpdateCallback | undefined>
-    | RefCallback<PopoverUpdateCallback | undefined>
-}
-
-/** @beta */
-declare type PopoverUpdateCallback = () => void
-
-/**
- * @public
- */
-export declare function Portal(props: PortalProps): ReactPortal | null
-
-export declare namespace Portal {
-  var displayName: string
-}
-
-/**
- * @public
- */
-export declare interface PortalProps {
-  children: ReactNode
-  /**
-   * @beta This API might change. DO NOT USE IN PRODUCTION.
-   */
-  __unstable_name?: string
-}
-
-/**
- * @public
- */
-export declare function PortalProvider(props: PortalProviderProps): ReactElement
-
-export declare namespace PortalProvider {
-  var displayName: string
-}
-
-/**
- * @public
- */
-export declare interface PortalProviderProps {
-  /**
-   * @deprecated Use `<BoundaryElementProvider element={...} />` instead
-   */
-  boundaryElement?: HTMLElement | null
-  children: ReactNode
-  element?: HTMLElement | null
-  /**
-   * @beta
-   */
-  __unstable_elements?: Record<string, HTMLElement | null | undefined>
-}
-
-/** @public */
-declare type Props<P extends {} = {}, E extends ElementType = ElementType> = Assign<
-  ElementProps_2<E> & PolymorphicProps_2,
-  P
->
-
-/**
- * @public
- * @deprecated Use `ThemeColorStateToneKey` instead
- */
-declare type SelectableTone = ThemeColorStateToneKey
-
-/**
- * Indicate that something is loading for an indeterminate amount of time.
- *
- * @public
- */
-export declare const Spinner: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof SpinnerProps> &
-    SpinnerProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare interface SpinnerProps {
-  muted?: boolean
-  size?: ResponsiveProp<FontTextSize>
-}
-
-/**
- * The `Stack` component is used to place elements on top of each other.
- *
- * @public
- */
-export declare const Stack: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof StackProps> &
-    StackProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare interface StackProps
-  extends Omit<BoxProps, 'direction' | 'display' | 'gapX' | 'gapY'> {
-  /** @deprecated Use `gap` instead. */
-  space?: ResponsiveProp<Space>
-}
-
-/**
- * @public
- * @deprecated Use `buildTheme` from `@sanity/ui/theme` instead.
- */
-export declare const studioTheme: RootTheme
-
-/**
- * @public
- */
-export declare const Tab: ForwardRefExoticComponent<
-  Omit<ElementProps<'button'> & PolymorphicProps, keyof TabProps> &
-    TabProps &
-    RefAttributes<HTMLButtonElement>
->
-
-/**
- * @public
- */
-export declare const TabList: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof TabListProps> &
-    TabListProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-declare type TabListChild = ReactElement<Props<TabProps, 'button'>> | null | undefined | false
-
-/**
- * @public
- */
-export declare interface TabListProps extends Omit<InlineProps, 'as' | 'height'> {
-  children: TabListChild[]
-}
-
-/**
- * @public
- */
-export declare interface TabProps {
-  /**
-   * The `id` of the corresponding `TabPanel` component.
-   */
-  'aria-controls': string
-  'id': string
-  'icon'?: ElementType | ReactNode
-  'focused'?: boolean
-  'fontSize'?: ResponsiveProp<FontTextSize>
-  'label'?: ReactNode
-  'padding'?: ResponsiveProp<Space>
-  'selected'?: boolean
-  'tone'?: ButtonTone
-}
-
-/**
- * The `Text` component is an agile, themed typographic element.
- *
- * @public
- */
-declare const Text_2: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof TextProps> &
-    TextProps &
-    RefAttributes<HTMLDivElement>
->
-export {Text_2 as Text}
-
-/**
- * Single line text input.
- *
- * @public
- */
-export declare const TextInput: ForwardRefExoticComponent<
-  Omit<ElementProps<'input'> & PolymorphicProps, keyof TextInputProps> &
-    TextInputProps &
-    RefAttributes<HTMLInputElement>
->
-
-/**
- * @public
- */
-declare type TextInputClearButtonProps = Omit<
-  Props<ButtonProps, 'button'>,
-  'as' | 'onClick' | 'onMouseDown'
->
-
-/**
- * @public
- */
-export declare interface TextInputProps extends InputStyleProps {
-  /**
-   * @beta
-   */
-  __unstable_disableFocusRing?: boolean
-  /**
-   * @beta
-   */
-  clearButton?: boolean | TextInputClearButtonProps
-  customValidity?: string
-  icon?: ElementType | ReactNode
-  iconRight?: ElementType | ReactNode
-  /**
-   * @beta
-   */
-  onClear?: () => void
-  prefix?: ReactNode
-  /** @deprecated Use `gap` instead. */
-  space?: ResponsiveProp<Space>
-  suffix?: ReactNode
-  type?: TextInputType
-  weight?: ThemeFontWeightKey
-}
-
-/**
- * @public
- */
-declare type TextInputType =
-  | 'search'
-  | 'date'
-  | 'datetime-local'
-  | 'email'
-  | 'url'
-  | 'month'
-  | 'number'
-  | 'password'
-  | 'tel'
-  | 'time'
-  | 'text'
-  | 'week'
-  | 'color'
-
-/**
- * @public
- */
-export declare interface TextProps extends TextStyleProps, TextOverflowStyleProps {
-  htmlFor?: string
-}
-
-/**
- * @public
- */
-export declare function ThemeProvider(props: ThemeProviderProps): ReactElement
-
-export declare namespace ThemeProvider {
-  var displayName: string
-}
-
-/**
- * @public
- */
-export declare interface ThemeProviderProps {
-  children?: ReactNode
-  scheme?: ThemeColorSchemeKey
-  theme?: RootTheme
-  tone?: ThemeColorCardToneKey
-}
-
-/**
- * Tooltips display information when hovering, focusing or tapping.
- *
- * @public
- */
-export declare const Tooltip: ForwardRefExoticComponent<
-  Omit<ElementProps<'div'> & PolymorphicProps, keyof TooltipProps> &
-    TooltipProps &
-    RefAttributes<HTMLDivElement>
->
-
-/**
- * @public
- */
-export declare interface TooltipProps
-  extends Omit<LayerProps, 'as'>,
-    RadiusStyleProps,
-    ShadowStyleProps {
-  /** @deprecated Use `fallbackPlacements` instead. */
-  allowedAutoPlacements?: Placement[]
-  /**
-   * Whether the tooltip should animate in and out.
-   *
-   * @beta
-   * @defaultValue false
-   */
-  animate?: boolean
-  arrow?: boolean
-  boundaryElement?: HTMLElement | null
-  children?: ReactElement<Props>
-  content?: ReactNode
-  /**
-   * Adds a delay to open or close the tooltip.
-   *
-   * If only a `number` is passed, it will be used for both opening and closing.
-   *
-   * If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
-   *
-   * @public
-   * @defaultValue 0
-   */
-  delay?: Delay
-  disabled?: boolean
-  fallbackPlacements?: Placement[]
-  placement?: Placement
-  /** Whether or not to render the tooltip in a portal element. */
-  portal?: boolean | string
-  scheme?: ThemeColorSchemeKey
-  tone?: ThemeColorCardToneKey
-}
-
-/**
- * Returns true if a dark color scheme is preferred, false if a light color scheme is preferred or the preference is not known.
- *
- * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Since the server environment doesn't have access to the DOM, we can't determine the current value of the media query and we assume `(prefers-color-scheme: light)` since it's the most common scheme (https://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
- *
- * If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
- * Chrome supports reading the `prefers-color-scheme` media query from a header if the server response: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Sec-CH-Prefers-Color-Scheme
- * @example https://gist.github.com/stipsan/13c0cccf8dfc34f4b44bb1b984baf7df
- *
- * @public
- */
-export declare function usePrefersDark(getServerSnapshot?: () => boolean): boolean
-
-/**
- * @public
- */
-export declare function useTheme_v2(): Theme_v2
-
-export {}