Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

110
Vistas
How to add Formik in Storybook with MDX

I am trying to add an Input story in Storybook.

This story is an input field, so it uses Formik's <Field/> tag.

However, when I try to view the story in the browser, nothing appears.

I've added the 'storybook-formik/register' in .storybook/main.js, but nothing changes.

This is my code:

// Input.js
import React from 'react'
import {Field} from 'formik'

export default function Input({type, name, placeholder, dataId}) {
  return (
    <Field
      type={type}
      name={name}
    />
  )
}
// Input.stories.mdx
import Input from './Input'
import {Canvas, Meta, Story} from '@storybook/addon-docs'

<Meta title="forms/Input" component={Input} />

export const Template = (args) => <Input {...args} />

# An input box

<Canvas>
  <Story
    name="input-box"
    args={{
      type: 'text',
      name: 'Email',
    }}>
    >{Template.bind({})}
  </Story>
</Canvas>

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda