Bonjour à tous,
Je suis designer, spécialisé en Design System. J'ai quelques notions en react, et je voudrais crééer un storybook d'un Design System.
Je rencontre un soucis pour récupérer l'objet children (https://mui.com/material-ui/api/button/)
Je fais un premier test sur un composant bouton :
MyButton.js
import React from "react";
import { Button as MuiButton } from '@mui/material';
export const MyButton = ({ label, children, ...rest }) => {
return <MuiButton {...rest}>{children}</MuiButton>
}
MyButton.stories.js
import { MyButton } from "./MyButton";
export default {
title: 'UI/MyButton',
component: MyButton,
argTypes: {
children: {control: 'object'}
}
};
const Template = (args) => <MyButton {...args} />
export const Variant = Template.bind({});
Variant.args = {
variant: 'outlined',
label: 'Button'
}
Sur storybook, ça ne m'affiche pas le contenu du bouton.
Par contre, si j'affiche {label} au lieu de {children}, j'affiche bien le label du bouton.
Quelqu'un aurait la solution pour que ça fonctionne également en utilisant l'objet children ?
Merci !