import BlackTooltip from './BlackTooltip.vue'

export default {
  title: 'The Design system/Black tooltip',
  component: BlackTooltip,
  tags: ['autodocs'],
  args: {
    isCursorTracked: false,
    text: 'Локальная продукция неактивна<br>Локальная продукция привязана к глобальной продукции, у которой ПП delisted = True<br>Локальная продукция привязана к глобальной продукции',
    bottom: false,
    left: false,
    maxWidth: 250,
  },
  argTypes: {
    bottom: {
      options: [true, false],
      control: { type: 'boolean' },
    },
    left: {
      options: [true, false],
      control: { type: 'boolean' },
    },
  },
}

const Template = (args: any) => ({
  props: Object.keys(args),
  render() {
    return (
      <div style="padding: 100px">
        <BlackTooltip { ...args }>
          <p style="border: solid 1px black; padding: 3px 0; width: 130px; text-align: center;">Наведи сюда</p>
        </BlackTooltip>
      </div>
    )
  },
})

export const Primary = Template.bind({})