{() => {
    const StyledInput = createComponent(
      ({ focused }) => ({
        backgroundColor: focused ? 'lightblue' : 'white',
      }),
      'input',
      ['onBlur', 'onFocus', 'type'],
    )
    class TextInput extends Component {
      render() {
        const { focused } = this.props
        return (
          <Focusable focused={focused}>
            {({ focused, bind, ref }) => {
              return <StyledInput {...bind} focused={focused} innerRef={ref} />
            }}
          
        )
      }
    }
    return (
      <SpacedGroup direction="vertical">
        <TextInput focused />
        <TextInput />
        <TextInput />
      </SpacedGroup>
    )
  }}
</Playground>