@enact/ui/ComponentOverride/ComponentOverride.d.ts

A collection of simplified unstyled cross-platform UI components for Enact

// Type definitions for ui/ComponentOverride

import * as React from "react";

type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
type Merge<M, N> = Omit<M, Extract<keyof M, keyof N>> & N;

export interface ComponentOverrideProps {}
/**
 * Utility to either create or clone a component instance with the given set of props.
 * 
 * `ComponentOverride`  can be used to support props that either accept a type, (e.g.  `Button` ) or an
element (e.g.  `<Button customProp="value" />` ) and return a new element which includes the
remaining props specified.
 * 
 * Example:
 * ```
const LabeledIconButton = ({iconComponent, label, ...rest}) => {
  return (
    <div {...rest}>
      <ComponentOverride
        component={iconComponent}
        icon="house"
      />
      <span>{label}</span>
    </div>
  );
};

// Usage

// Only the props defined by LabeledIconButton will be passed to CustomIcon
<LabeledIconButton
  label="Home"
  iconComponent={CustomIcon}
/>

// The color prop along with props defined by LabeledIconButton will be passed to CustomIcon
<LabeledIconButton
  label="Home"
  iconComponent={
    <CustomIcon color="green" />
  }
/>
```
 */

export class ComponentOverride extends React.Component<
  Merge<React.HTMLProps<HTMLElement>, ComponentOverrideProps>
> {}

export default ComponentOverride;