import { argsToTemplate, Meta, StoryObj } from '@storybook/angular';
import { withContrastedVariant } from '../../../.storybook/utils/with-contrasted-variant.decorator';
import { ToastComponent } from '../../public-api';

const meta: Meta<ToastComponent> = {
  title: 'Components/Toast/Toast',
  id: 'toast',
  component: ToastComponent,
  decorators: [
    withContrastedVariant({
      stateByProps: (props) => {
        return props['isInverse'] ? 'inverse' : null;
      }
    })
  ],
  argTypes: {
    closed: {
      control: {
        type: null
      }
    },
    dismissed: {
      control: {
        type: null
      }
    }
  },
  parameters: {
    docs: {
      imports: [ToastComponent]
    }
  }
};

export default meta;

type Story = StoryObj<ToastComponent>;

export const Toast: Story = {
  args: {
    toastId: 'toast-1'
  },
  render: (args) => ({
    props: args,
    template: `
      <nj-toast ${argsToTemplate(args)}>
        Toast Title
        <ng-container njToastBody>
          Toast body
        </ng-container>
      </nj-toast>
    `
  })
};