import React from "react";
import { Meta } from "@storybook/react";
import { PDFExportProps } from "./PDFExportProps";
import { PDFExport as KendoPDFExport } from "@progress/kendo-react-pdf";
import PDFExport from "./PDFExport";
import Button from "../../Buttons/Button/Button";

export default {
  title: "Design System/Pdf Processing/PDFExport",
  component: PDFExport,
  tags: ["autodocs"],
  parameters: {
    docs: {
      description: {
        component:
          'The KendoReact PDF Generator enables you to export a selection of or the entire content of a web page to a PDF file. \n\n```javascript\nimport { PDFExport } from "@renault-ui-library"\n```',
      },
    },
  },
  argTypes: {
    dataTestId: {
      control: { type: "text" },
      description: "Specifies the data-test-id attribute for testing purposes.",
    },
    author: {
      control: { type: "text" },
      description: "The author (metadata) of the PDF document.",
    },
    avoidLinks: {
      control: { type: "boolean" },
      description:
        "A flag that indicates whether to produce actual hyperlinks in the exported PDF file.",
    },
    creator: {
      control: { type: "text" },
      description: "The creator of the PDF document.",
    },
    date: {
      control: { type: "date" },
      description: "The date when the PDF document is created.",
    },
    fileName: {
      control: { type: "text" },
      description: "Specifies the name of the exported PDF file.",
    },
    forcePageBreak: {
      control: { type: "text" },
      description:
        "An optional CSS selector that specifies the elements which cause the page breaks.",
    },
    forceProxy: {
      control: { type: "boolean" },
      description:
        "If set to true, the content is forwarded to proxyURL even if the browser supports local saving of files.",
    },
    imageResolution: {
      control: { type: "number" },
      description:
        "The forced resolution of the images in the exported PDF document.",
    },
    keepTogether: {
      control: { type: "text" },
      description:
        "An optional CSS selector that specifies the elements which should not be split across the pages.",
    },
    keywords: {
      control: { type: "text" },
      description: "The keywords (metadata) of the PDF document.",
    },
    landscape: {
      control: { type: "boolean" },
      description:
        "A flag that indicates if the page will be in a landscape orientation.",
    },
    margin: {
      control: { type: "text" },
      description: "Specifies the margins of the page.",
    },
    pageTemplate: {
      control: { type: "object" },
      description:
        "A React functional or class component which is used as a template that is inserted into each page of the PDF document.",
    },
    paperSize: {
      control: { type: "text" },
      description: "Specifies the paper size of the PDF document.",
    },
    producer: {
      control: { type: "text" },
      description: "The producer (metadata) of the PDF document.",
    },
    proxyData: {
      control: { type: "object" },
      description:
        "A key/value dictionary of form values which will be sent to the proxy.",
    },
    proxyTarget: {
      control: { type: "text" },
      description:
        "A name or keyword which indicates where to display the document that is returned from the proxy.",
    },
    proxyURL: {
      control: { type: "text" },
      description:
        "The URL of the server-side proxy which streams the file to the end user.",
    },
    repeatHeaders: {
      control: { type: "boolean" },
      description:
        "Specifies if the <thead> elements of the tables will be repeated on each page.",
    },
    scale: {
      control: { type: "number" },
      description: "A scale factor.",
    },
    subject: {
      control: { type: "text" },
      description: "The subject (metadata) of the PDF document.",
    },
    title: {
      control: { type: "text" },
      description: "The title (metadata) of the PDF document.",
    },
  },
} as Meta;

export const Default = (args: PDFExportProps): JSX.Element => {
  const pdfExportComponent = React.useRef<KendoPDFExport>(null);
  return (
    <>
      <Button
        onClick={() => {
          if (pdfExportComponent.current) {
            pdfExportComponent.current.save();
          }
        }}
      >
        Export PDF
      </Button>
      <PDFExport paperSize="A4" margin="1cm" ref={pdfExportComponent} {...args}>
        <div style={{ width: "500px" }}>
          <p>
            Lorem, ipsum dolor sit amet consectetur adipisicing elit. Iste magni
            earum exercitationem recusandae. Animi repudiandae quidem in
            similique commodi odio!
          </p>
        </div>
      </PDFExport>
    </>
  );
};

Default.args = {
  dataTestId: "pdfexport-data-testid",
  fileName: "test.pdf",
};