import type { Meta, StoryObj } from "@storybook/react";
import React from "react";

import { ContentTitleWithSuggestions } from "../react";

const DEMO_TITLE =
  "Заголовок с @[Мария](123e4567-e89b-12d3-a456-426614174001), тегом #release и ссылкой github.com";

const meta: Meta<typeof ContentTitleWithSuggestions> = {
  title: "React/ContentTitleWithSuggestions",
  component: ContentTitleWithSuggestions,
  tags: ["autodocs"],
  args: {
    text: DEMO_TITLE,
    blur: false,
    ellipsis: {
      rows: 2,
      expandable: true,
      symbol: "Читать полностью",
    },
  },
  argTypes: {
    text: { control: "text" },
    blur: { control: "boolean" },
    ellipsis: { control: false },
    renderMention: { control: false },
    renderTag: { control: false },
    renderLink: { control: false },
    ParagraphComponent: { control: false },
    TextComponent: { control: false },
    TitleComponent: { control: false },
  },
  render: args => (
    <div style={{ maxWidth: 780, width: "100%" }}>
      <ContentTitleWithSuggestions {...args} />
    </div>
  ),
};

export default meta;

type Story = StoryObj<typeof meta>;

export const Playground: Story = {};

export const Blurred: Story = {
  args: {
    blur: true,
  },
};