import * as React from 'react';
import { B as BaseDefaultProps, N as NoInfer, S as Substitute } from './theme-aDBfke1X.js';
import { S as SxProp } from './sx.d-Cr4VrsXR.js';

type PolymorphicComponentProps<
  BaseProps extends object,
  AsTarget extends React.ElementType | undefined,
  AsTargetProps extends object = AsTarget extends React.ElementType
    ? React.ComponentPropsWithRef<AsTarget>
    : React.HTMLAttributes<HTMLElement>,
> = NoInfer<Omit<Substitute<BaseProps, AsTargetProps>, 'as' | 'component'>> & {
  /**
   * The component used for the root node.
   * Either a string to use a HTML element or a component.
   * Replacement for the emotion's `as` prop.
   */
  as?: AsTarget;
  /**
   * The component used for the root node.
   * Either a string to use a HTML element or a component.
   */
  component?: AsTarget;
  /**
   * The style extension prop that allows defining system overrides as well as additional CSS styles.
   */
  sx?: SxProp;
  /**
   * The content of the component.
   */
  children?: React.ReactNode;
};

interface PolymorphicComponent<BaseProps extends BaseDefaultProps>
  extends React.ForwardRefExoticComponent<BaseProps> {
  <AsTarget extends React.ElementType | undefined = undefined>(
    props: PolymorphicComponentProps<BaseProps, AsTarget>,
  ): React.JSX.Element;
}

export type { PolymorphicComponent as P };