ihk24/storybook/stories/components/infobox/Infobox.stories.js

import {createInfobox} from "./InfoboxComponent";

export default {
  title: 'Components/Infobox',
  argTypes: {
    type: {
      name: 'Box-Stil',
      control: {type: 'select'},
      options: ['regular', 'success', 'warning', 'error'],
      defaultValue: 'regular',
    },
    content: {
      name: 'Inhalt (HTML)',
      control: {type: 'text'},
      defaultValue: '<p><strong>Infobox: </strong>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci deserunt non quam rem, quae in <a href="#">porro sint veritatis</a> hic, quas dignissimos debitis sequi repudiandae ipsum dolorem placeat harum blanditiis. Vero.</p>'
    }
  }
}

const Template = ({...args}) => {
  return createInfobox({...args});
};

export const Infobox = Template.bind({});
Infobox.args = {};

export const Warning = Template.bind({});
Warning.args = {
  type: 'warning',
};

export const Error = Template.bind({});
Error.args = {
  type: 'error',
};

export const Success = Template.bind({});
Success.args = {
  type: 'success',
};