> ## Documentation Index
> Fetch the complete documentation index at: https://flatfileinc-feat-updatereactquickstart.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# @flatfile/plugin-dxp-configure

> A plugin for using DXP class-based configurations.

<Info>
  If you're upgrading from Portal 3, check out the [Upgrade Guide](/upgrade/v3_dxp_configure).
</Info>

<CardGroup cols={1}>
  <Card title="@flatfile/plugin-dxp-configure" icon="download">
    The `@flatfile/plugin-dxp-configure` plugin lets you easily attach your
    implementation of the class-based schema configuration library
    `@flatfile/configure` to `@flatfile/listener`.
  </Card>
</CardGroup>

## Parameters

<ParamField path="workbook" type="Workbook">
  The `workbook` parameter takes a Flatfile Workbook.
</ParamField>

## Usage

You can simply attach any existing workbook configuration you have to a listener and it'll automatically apply to your next Space.

```bash install
npm i @flatfile/plugin-dxp-configure
```

```js import
import { dxpConfigure } from "@flatfile/plugin-dxp-configure";
```

<CodeGroup>
  ```js listener.js
  import { MyWorkbook } from './my-dxp-workbook.js'
  import { dxpConfigure } from '@flatfile/plugin-dxp-configure'

  export default (listener) => {
    listener.use(dxpConfigure(MyWorkbook))
  }
  ```

  ```js listener.ts
  import { MyWorkbook } from "./my-dxp-workbook.js";
  import { dxpConfigure } from "@flatfile/plugin-dxp-configure";
  import { FlatfileListener } from "@flatfile/listener";

  export default (listener: FlatfileListener) => {
    listener.use(dxpConfigure(MyWorkbook));
  };
  ```
</CodeGroup>

```js my-dxp-workbook.js
import { Sheet, TextField, Workbook } from "@flatfile/configure";

export const MyWorkbook = new Workbook({
  name: "My Workbook",
  namespace: "test",
  sheets: {
    mySheet: new Sheet("Test", {
      name: TextField("Full Name"),
      email: TextField({
        label: "Email Address",
        compute: (val) => {
          return val.toLowerCase();
        },
      }),
    }),
  },
});
```

## See the code

<CardGroup cols={2}>
  <Card title="@flatfile/plugin-dxp-configure" href="https://github.com/FlatFilers/flatfile-plugins/tree/main/plugins/dxp-configure" icon="github" />
</CardGroup>