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

# Actions

> The anatomy of Actions

An Action is a code-based operation that runs where that Action is mounted. Actions run when a user clicks the corresponding user prompt in Flatfile. Additional Actions can be mounted on a Sheet, a Workbook, or a file by a developer.

## Types of Actions

### Built-in Actions

Workbooks, Sheets and files come with five default built-in actions:

1. Mapping data from one workbook to another (moving data from a workbook to a Workbook)
2. Deleting data from a Workbook (or the entire file)
3. Exporting (downloading) data from a Workbook (or a file)
4. Find and Replacing data in a Sheet
5. Applying a Mutate function to data in a Sheet

When these built-in actions are clicked, they create Jobs. You can listen for these events and take appropriate actions if required. Learn more about [Jobs](/learning-center/concepts/jobs).

### Developer-Created Actions

Additional Actions can be mounted on a Sheet, a Workbook, or a file. When an action is clicked, it will create a job `operation` on the `domain` it is mounted.

For example, an Action with the property `operation: 'my-action'` placed on a Workbook would spawn a job called: `workbook:my-action`. This is the job you'd listen for to respond accordingly.

## The Anatomy of an Action

### Required Parameters

All Actions contain the the information needed to let a user run the Action. This includes:

<ParamField path="operation" type="string" required>
  A unique identifier for the Action that is used by the listener to determine
  what work to do as part of the resulting Job.
</ParamField>

<ParamField path="label" type="string" required>
  The text that will be displayed to the user in the UI as a button or menu
  item.
</ParamField>

### Optional Parameters

Optionally, an Action can also contain extra details about how it appears in the
UI. These include:

<ParamField path="primary" type="boolean" default="false">
  Whether the Action is a primary Action for the resource. Depending on the
  resource, primary Actions are displayed in the UI in a more prominent way.
</ParamField>

<ParamField path="confirm" type="boolean" default="true">
  When set to true, a modal is shown to confirm the Action.
</ParamField>

<ParamField path="description" type="string">
  The text that will be displayed to the user when a confirmation modal is used.
  Phrase this as a question.
</ParamField>

<ParamField path="icon" type="string">
  The icon to be displayed. Default is a lightning bolt. If you want to omit the
  icon, use `'none'`. All available icons are listed here: [Flatfile
  icons](/reference/icons). If the `label` is empty, then an icon will always
  be displayed.
</ParamField>

<ParamField path="tooltip" type="string">
  Setting this will display text in the UI for both buttons and list items as a
  tooltip on hover.
</ParamField>

<ParamField path="messages" type="array[{}]">
  Setting this will display text on disabled actions \[based on the state of the action] in the UI for
  both buttons and list items as a tooltip on hover.

  `[{ type: 'error' }]`

  `[{ type: 'info' }]`
</ParamField>

<ParamField path="constraints" type="array[{}]">
  `[{ type: 'hasAllValid' }]`: Adding this constraint will disable a Sheet or Workbook Action when there are invalid
  records.

  `[{ type: 'hasSelection' }]`: Adding this constraint will disable a Sheet or Workbook Action when no records are selected.

  `[{ type: 'hasData' }]`: Adding this constraint will disable a Sheet or Workbook Action when there are no records.
</ParamField>

<ParamField path="mode" type="string" default="background">
  Can be `foreground`, `background` or `toolbarBlocking`. Foreground mode will
  prevent interacting with the entire resource until complete. toolbarBlocking
  disables the sheet-level toolbar and Column Header menus, while still allowing
  users to enter records manually.
</ParamField>

### Usage

An Action with all of the above properties would look like this:

```js theme={"system"}
{
  operation: 'my-action',
  label: 'My Action',
  primary: true,
  confirm: true,
  description: 'Are you sure you want to run this action?',
  constraints: [{ type: 'hasAllValid' }, { type: 'hasSelection' }],
  mode: 'foreground'
  tooltip: 'Click to run action'
}
```

## inputForm

When initiating an action, there may be instances where additional information is required from the end user to successfully complete the intended task. For example, you might want to enable users to specify the name of the file they intend to export.

In such cases, if you configure input fields for your action, a secondary dialog will be presented to the end user, prompting them to provide the necessary information. Once the user has entered the required details, they can proceed with the action seamlessly

<ParamField path="inputForm" type="object">
  An object representing the input form configuration for the action.
</ParamField>

<ResponseField name="type" type="string" required>
  The type of the input form. Accepts: `simple`
</ResponseField>

### fields

<ResponseField name="fields" type="array[object]">
  An array of field objects representing the input form fields.
</ResponseField>

<ResponseField name="key" type="string" required>
  The key for the field.
</ResponseField>

<ResponseField name="label" type="string" required>
  The label for the field.
</ResponseField>

<ResponseField name="type" type="string" required>
  The type of the field. Accepts: `string` | `textarea` | `number` | `boolean` | `enum`
</ResponseField>

<ResponseField name="defaultValue" type="string">
  The default value for the field.
</ResponseField>

<ResponseField name="description" type="string">
  A description of the field.
</ResponseField>

#### config

<ResponseField name="config" type="array[object]">
  An object containing configuration options for the field.
</ResponseField>

<ResponseField name="options" type="array" required>
  An array of options for the field, each represented as an object.
</ResponseField>

<ResponseField name="value" type="string" required>
  The value or ID of the option.
</ResponseField>

<ResponseField name="label" type="string">
  A visual label for the option.
</ResponseField>

<ResponseField name="description" type="string">
  A short description of the option.
</ResponseField>

<ResponseField name="meta" type="object">
  An arbitrary JSON object associated with the option.
</ResponseField>

#### constraints

<ResponseField name="constraints" type="array[object]">
  An array of constraints for the field.
</ResponseField>

<ResponseField name="type" type="string" required>
  The type of constraint.  Accepts: `required`
</ResponseField>

### Usage

An Action that requests input from the end user using `inputForm` would look like this. Your listener would then grab this data from the Job and take action on it. Learn more about [Using Actions with Inputs](/learning-center/guides/actions#actions-with-input-forms).

<Snippet file="shared/workbook_submit_pt4.mdx" />

## Learn more

### Guides

Learn more about Workbook, Sheet, and File Actions.

<CardGroup cols={3}>
  <Card title="Workbook" icon="bolt" href="/learning-center/guides/actions#workbook-mounted">
    Run an operation on the entire dataset
  </Card>

  <Card title="Sheet" icon="bolt" href="/learning-center/guides/actions#sheet-mounted">
    Run an operation at the Sheet level
  </Card>

  <Card title="File" icon="bolt" href="/learning-center/guides/actions#file-mounted">
    Attach additional actions to a File
  </Card>
</CardGroup>

### Example Projects

Find an Actions example in the Flatfile GitHub repository.

<CardGroup cols={2}>
  <Card title="typescript" icon="code-merge" href="https://github.com/FlatFilers/flatfile-docs-kitchen-sink/blob/main/typescript/actions">
    Clone the Actions example in Typescript
  </Card>

  <Card title="javascript" icon="js" href="https://github.com/FlatFilers/flatfile-docs-kitchen-sink/blob/main/javascript/actions">
    Clone the Actions example in Javascript
  </Card>
</CardGroup>
