FormExport

Storybook

Browse the props, controls and all the stories of FormExport in Storybook.

The FormExport component displays the export options of a form: export the form schema as JSON, and export the submissions as JSON or CSV. It doesn't perform the export itself, it calls onClick with the requested action and format so you can trigger the download.

Usage

import "@tsed/react-formio/molecules/card/Card";

import { FormExport } from "@tsed/react-formio/organisms/form/exports/FormExport";

export function ExportPage() {
  return (
    <FormExport
      onClick={(action, format) => {
        // action: "export:form" | "export:submissions"
        // format: "json" | "csv"
        console.log(action, format);
      }}
    />
  );
}

INFO

FormExport resolves the Card component from the components registry. Import @tsed/react-formio/molecules/card/Card once in your application to register it.

Props

Name	Type	Default	Description
onClick	(action: "export:form" | "export:submissions", format: "json" | "csv") => void		Called when an export button is clicked.
i18n	FormOptions["i18n"]		Translations used for the labels (e.g. Export schema, Export submissions, Json, Csv).

Examples

Usage

Default export options.

Live exampleOpen in Storybook ↗

Resource

Export options for a resource.

Live exampleOpen in Storybook ↗

Translated

Labels translated with the i18n prop.

Live exampleOpen in Storybook ↗