Skip to content

TS forwardRef support #878

Open
Open
@shilman

Description

@shilman

The following input:

import React, { forwardRef } from 'react';

interface ButtonProps {
  variant?: 'small' | 'large';
  disabled?: boolean;
  children: React.ReactNode;
}

export const Button = forwardRef<HTMLButtonElement, ButtonProps>(function Button(
  { disabled = false, variant = 'small', children },
  ref
) {
  return (
    <button type="button" disabled={disabled} ref={ref}>
      {children} {variant}
    </button>
  );
});

Produces:

{}

It's come up several times in Storybook: storybookjs/storybook#8894 and storybookjs/storybook#9511

Filed from storybookjs/storybook#24165

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions