import type { Story, Meta } from '@storybook/react';

import { ASSETS_URL } from '../../../consts/common';
import { DialogTitle } from './dialog-title';
import type { DialogTitleProps } from './dialog-title';

export default {
  component: DialogTitle,
  title: 'Pop Overs/Modal/DialogTitle',
  argTypes: {
    icon: {
      description: 'Icon to be displayed before the title.'
    },
    onClose: {
      description: 'Callback to be fired on close icon click.'
    },
    children: {
      description: 'The content of the component.'
    }
  }
} as Meta;

const Template: Story<DialogTitleProps> = args => <DialogTitle {...args} />;

export const Primary = Template.bind({});
Primary.args = {
  onClose: () => alert('Will close dialog.'),
  children: 'Inner components.'
};

export const WithIcon = Template.bind({});
WithIcon.args = {
  icon: {
    src: `${ASSETS_URL}/icons/icon_database.svg`
  },
  children: 'Inner components.'
};