embed icon indicating copy to clipboard operation
embed copied to clipboard

Missing react types for 4 of the components

Open Multiply opened this issue 4 months ago • 0 comments

When importing all five components, and creating a simple wrapper around them for easily rendering in one place, we're mostly seeing it accept any type, which is not neat.

Sample code:

import { Popover, PopupButton, Sidetab, SliderButton, Widget } from '@typeform/embed-react'
import React, { ComponentProps } from 'react'

type EmbedReactProps =
  | { type: 'popover' } & ComponentProps<typeof Popover>
  | { type: 'popup_button' } & ComponentProps<typeof PopupButton>
  | { type: 'sidetab' } & ComponentProps<typeof Sidetab>
  | { type: 'slider_button' } & ComponentProps<typeof SliderButton>
  | { type: 'widget' } & ComponentProps<typeof Widget>

const EmbedReact = ({ type, ...rest }: EmbedReactProps) => {
  switch (type) {
    case 'popover': return <Popover {...rest} />
    case 'popup_button': return <PopupButton {...rest} />
    case 'sidetab': return <Sidetab {...rest} />
    case 'slider_button': return <SliderButton {...rest} />
    case 'widget': return <Widget {...rest} />
    default: return null
  }
}

Please refer to my recording here for an example:

https://github.com/Typeform/embed/assets/453031/20c1cd3f-95d1-4750-b89d-c722621c151d

Edit: I noticed the components are importing types from different folders, where @typeform/embed imports work, and @typeform/embed/types/base doesn't. image

Multiply avatar Mar 06 '24 04:03 Multiply