---
url: "https://vueda.dev/v3/reference/theming/keys/FieldSetStackedInlineRow.md"
title: "FieldSetStackedInlineRow"
---

# FieldSetStackedInlineRow

Source: `client/lib/theme/vueda-tailwind/form/index.js`

> Class hook for the unsaved-row Delete button. Tone, emphasis, and size come from the component; appearance comes from [Button](/v3/reference/theming/keys/Button.md).

Vue component: [FieldSetStackedInlineRow](/v3/reference/api/vue/FieldSetStackedInlineRow.md)

| Slot | Default classes | Description |
| --- | --- | --- |
| [destroyButton](/v3/reference/theming/keys/FieldSetStackedInlineRow.md#theme-key-FieldSetStackedInlineRow-destroyButton) |  | Class hook for the unsaved-row Delete button. Tone, emphasis, and size come from the component; appearance comes from [Button](/v3/reference/theming/keys/Button.md). |
| [root](/v3/reference/theming/keys/FieldSetStackedInlineRow.md#theme-key-FieldSetStackedInlineRow-root) | 3 classes | Bordered row card with dirty and selected-for-destroy state chrome. |
| [beforeFields](/v3/reference/theming/keys/FieldSetStackedInlineRow.md#theme-key-FieldSetStackedInlineRow-beforeFields) | `w-6 shrink-0` | Fixed leading hook before row fields, commonly used for drag handles or markers. |
| [afterFields](/v3/reference/theming/keys/FieldSetStackedInlineRow.md#theme-key-FieldSetStackedInlineRow-afterFields) | `shrink-0` | Trailing hook after row fields and before actions. |
| [fieldInner](/v3/reference/theming/keys/FieldSetStackedInlineRow.md#theme-key-FieldSetStackedInlineRow-fieldInner) |  | Pass-through wrapper immediately inside a rendered row field. |
| [field](/v3/reference/theming/keys/FieldSetStackedInlineRow.md#theme-key-FieldSetStackedInlineRow-field) |  | Wrapper around each field rendered in the row. |
| [fields](/v3/reference/theming/keys/FieldSetStackedInlineRow.md#theme-key-FieldSetStackedInlineRow-fields) | `flex flex-col flex-1 min-w-0 gap-4` | Flexible field column that owns remaining row width. |
| [actionBarOuter](/v3/reference/theming/keys/FieldSetStackedInlineRow.md#theme-key-FieldSetStackedInlineRow-actionBarOuter) | `flex gap-1 2xs:gap-2 items-start shrink-0` | Outer action group for row controls, pinned to the row start edge. |

<a id="theme-key-FieldSetStackedInlineRow-destroyButton"></a>

## destroyButton

> Class hook for the unsaved-row Delete button. Tone, emphasis, and size come from the component; appearance comes from [Button](/v3/reference/theming/keys/Button.md).

Source: `client/lib/theme/vueda-tailwind/form/FieldSetStackedInlineRow.theme.js:18`

<a id="theme-key-FieldSetStackedInlineRow-root"></a>

## root

> Bordered row card with dirty and selected-for-destroy state chrome.

Default classes:

```text
flex items-start gap-3 hairline hairline-border rounded-vueda-card p-2.5
data-[state=dirty]:border-l-2 data-[state=dirty]:border-l-primary
data-[state=selected-for-destroy]:bg-destructive/5 data-[state=selected-for-destroy]:[--vueda-hairline-color:color-mix(in_oklab,var(--destructive)_40%,transparent)]
```

Source: `client/lib/theme/vueda-tailwind/form/FieldSetStackedInlineRow.theme.js:22`

<a id="theme-key-FieldSetStackedInlineRow-beforeFields"></a>

## beforeFields

> Fixed leading hook before row fields, commonly used for drag handles or markers.

Default classes:

`w-6 shrink-0`

Source: `client/lib/theme/vueda-tailwind/form/FieldSetStackedInlineRow.theme.js:31`

<a id="theme-key-FieldSetStackedInlineRow-afterFields"></a>

## afterFields

> Trailing hook after row fields and before actions.

Default classes:

`shrink-0`

Source: `client/lib/theme/vueda-tailwind/form/FieldSetStackedInlineRow.theme.js:35`

<a id="theme-key-FieldSetStackedInlineRow-fieldInner"></a>

## fieldInner

> Pass-through wrapper immediately inside a rendered row field.

Source: `client/lib/theme/vueda-tailwind/form/FieldSetStackedInlineRow.theme.js:39`

<a id="theme-key-FieldSetStackedInlineRow-field"></a>

## field

> Wrapper around each field rendered in the row.

Source: `client/lib/theme/vueda-tailwind/form/FieldSetStackedInlineRow.theme.js:43`

<a id="theme-key-FieldSetStackedInlineRow-fields"></a>

## fields

> Flexible field column that owns remaining row width.

Default classes:

`flex flex-col flex-1 min-w-0 gap-4`

Source: `client/lib/theme/vueda-tailwind/form/FieldSetStackedInlineRow.theme.js:49`

<a id="theme-key-FieldSetStackedInlineRow-actionBarOuter"></a>

## actionBarOuter

> Outer action group for row controls, pinned to the row start edge.

Default classes:

`flex gap-1 2xs:gap-2 items-start shrink-0`

Source: `client/lib/theme/vueda-tailwind/form/FieldSetStackedInlineRow.theme.js:53`