import { Meta, argsToTemplate } from '@storybook/angular';
import { ProductFormatIconGroup } from '@isa/icons';
import { ProductFormatIconComponent } from '@isa/shared/product-format';

type ProductFormatInputs = {
  format: string;
};

const options = Object.keys(ProductFormatIconGroup).map((key) =>
  key.toUpperCase(),
);

const meta: Meta<ProductFormatInputs> = {
  title: 'shared/product-format/ProductFormatIcon',
  component: ProductFormatIconComponent,
  argTypes: {
    format: {
      control: {
        type: 'select',
      },
      options,
      description: 'The product format to display the icon for.',
      defaultValue: options[0],
    },
  },
  args: {
    format: options[0], // Default value for the product format
  },
  render: (args) => ({
    props: args,
    template: `<shared-product-format-icon ${argsToTemplate(args)}></shared-product-format-icon>`,
  }),
};

export default meta;

type Story = typeof meta;

export const Default: Story = {};
