ihk24/storybook/stories/components/header/Header.stories.js

import {createHeader} from "./HeaderComponent";

export default {
  title: 'Components/Header',
  parameters: {
    layout: 'fullscreen',
  },
  argTypes: {
    contactPhone: {
      name: 'Kontakt Telefonnummer',
      control: 'text',
      defaultValue: null,
    },
    contactMail: {
      name: 'Kontakt E-Mail',
      control: 'text',
      defaultValue: null,
    },
    contactLink: {
      name: 'Kontaktseite Link',
      control: 'text',
      defaultValue: null,
    },
    loginLink: {
      name: 'Login Link',
      control: 'text',
      defaultValue: null,
    }
  }
}

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

export const HeaderContactLogin = Template.bind({});
HeaderContactLogin.args = {
  contactLink: '#',
  loginLink: '#',
};

export const HeaderPhoneLogin = Template.bind({});
HeaderPhoneLogin.args = {
  contactPhone: '+49 123 / 45678-90',
  loginLink: '#',
};

export const HeaderMail = Template.bind({});
HeaderMail.args = {
  contactMail: 'kontakt@ihk.de',
};