# Components: Feedback and status

> Plainkit 0.28.0. Generated by scripts/build-skills.mjs from Generated/*.razor, blazor/mappings, generated.manifest.json and core/dist/elements/api.json. Do not edit: change the source and run the generator.

Every component renders its element with the parameters you set as attributes. An attribute that is not a parameter (`id`, `class`, `data-*`, `aria-*`, ...) is put on the element as it is, and a `class` is added to the component's own (`ExtraClass` on a component that lists it). Names are `Pk` plus the tag in PascalCase.

## `PkAlert`

`<pk-alert>`: **Alert** (Feedback & status). A persistent message in a kind (info, success, warning, danger): optional heading, actions, a dismiss button, a full-bleed banner variant for the top of a page, and a plain form (coloured text only, optionally inline and compact).

**Parameters**

| Parameter | Type | Enum values | Sets | Description |
|---|---|---|---|---|
| `Kind` | `PkAlertKind` | `Error` `Warning` `Info` `Success` | attribute `kind` | The kind setting |
| `Title` | `string?` |  | attribute `heading` | The heading setting |
| `Message` | `string?` |  | default slot | Message. |
| `ChildContent` | `RenderFragment?` |  | default slot | Message. |
| `Dismissible` | `bool` |  | attribute `dismissible` | The dismissible setting |
| `OnDismiss` | `EventCallback` |  | event `pk-dismiss` | Dismissed; cancelable. |
| `Boxed` | `bool` |  | attribute `plain` | Coloured text with no box, icon or panel: the quiet form for a message beside a field or under a button. False is the plain form (coloured text, no box); the parameter is the opposite of the plain prop. |
| `Subtle` | `bool` |  | attribute `subtle` | A coloured left border and a faint tint background, no icon or dismiss control: a block-level 'finding' treatment between plain text and a full boxed panel, for a reconciliation notice, a nav strip, or a flagged table row. Coloured left border and faint tint background, no icon or dismiss control: a block-level 'finding' treatment between plain and Boxed. |
| `Inline` | `bool` |  | attribute `inline` | Flows in a line of text (like a span) instead of a block; use with plain. |
| `Compact` | `bool` |  | attribute `compact` | Smaller text and no margin, for an actions strip. |
| `ExtraClass` | `string?` |  |  | Extra CSS classes for the element. |
| `ActionContent` | `RenderFragment?` |  | slot `action` | Buttons or links. |
| `IconContent` | `RenderFragment?` |  | slot `icon` | Custom icon. |

When you set a named fragment (`ActionContent`, `IconContent`), write the body as an explicit `<ChildContent>` tag too: Razor does not allow an implicit body next to a named fragment.

Element details (parts, CSS custom properties, methods, accessibility): `pk-alert` in the `plainkit-sdk` skill.

## `PkEmptyState`

`<pk-empty-state>`: **Empty state** (Feedback). What a list shows when it has no rows: an optional icon, a title, a description and the actions that fill it. Densities for a whole page, a panel or a table row.

**Parameters**

| Parameter | Type | Enum values | Sets | Description |
|---|---|---|---|---|
| `Level` | `int` |  | attribute `level` | Heading level exposed to assistive technology. |
| `Title` | `string?` |  | attribute `heading` | The title. |
| `Description` | `string?` |  | attribute `description` | The explanation. |
| `Tone` | `EmptyStateTone?` | `Default` `Compact` `Boxed` `Error` | attribute `tone` | Density and frame. |
| `TitleContent` | `RenderFragment?` |  | slot `heading` | A rich title; overrides heading. |
| `ChildContent` | `RenderFragment?` |  | default slot | A rich description; overrides description. |
| `IconContent` | `RenderFragment?` |  | slot `icon` | An illustration or icon. |
| `ActionContent` | `RenderFragment?` |  | slot `actions` | The next step: a link back or a primary button, centred under the description. |

When you set a named fragment (`TitleContent`, `IconContent`, `ActionContent`), write the body as an explicit `<ChildContent>` tag too: Razor does not allow an implicit body next to a named fragment.

Element details (parts, CSS custom properties, methods, accessibility): `pk-empty-state` in the `plainkit-sdk` skill.

## `PkHint`

`<pk-hint>`: **Hint** (Feedback). An inline explanation that opens in the flow of the page: no tooltip, no hover-only content.

**Parameters**

| Parameter | Type | Enum values | Sets | Description |
|---|---|---|---|---|
| `Label` | `string?` |  | attribute `label` | The toggle text. |
| `Open` | `bool` |  | attribute `open` | Expanded. |
| `Tone` | `HintTone?` | `Info` `Warn` | attribute `tone` | Accent colour. |
| `OpenChanged` | `EventCallback<bool>` |  | two-way pair of `Open` | Raised with the new value of Open (two-way: Open follows it). |
| `ChildContent` | `RenderFragment?` |  | default slot | The explanation. |

Two-way binding: `@bind-Open`.

**Event args**

| Event | Args class | Fields |
|---|---|---|
| `pk-toggle` | `PkToggleEventArgs` | Open: bool?, Expanded: bool?, Pressed: bool?, Value: string?, Id: string? |

Element details (parts, CSS custom properties, methods, accessibility): `pk-hint` in the `plainkit-sdk` skill.

## `PkLoadingOverlay`

`<pk-loading-overlay>`: **Loading overlay** (Feedback & status). Covers a region (or the whole viewport with fullscreen) with a spinner and a label while busy, and makes what it covers inert so it cannot be clicked or tabbed into. With delay and min-time it owns the one busy timing rule (pk-page and Blazor's PageBase use it); both default to 0.

**Parameters**

| Parameter | Type | Enum values | Sets | Description |
|---|---|---|---|---|
| `Busy` | `bool` |  | attribute `busy` | Show the overlay and make the content inert (after delay, for at least min-time). aria-busy follows it at once. |
| `Label` | `string?` |  | attribute `label` | Announced and shown. |
| `Delay` | `int` |  | attribute `delay` | Milliseconds busy must last before the overlay appears, so a fast action never flashes it (about 150 for a page). 0 shows it at once. |
| `MinTime` | `int` |  | attribute `min-time` | Milliseconds the overlay stays once shown, so it never flickers (about 300 for a page). 0 hides it as soon as busy ends. |
| `Fullscreen` | `bool` |  | attribute `fullscreen` | Cover the viewport. |
| `Fill` | `bool` |  | attribute `fill` | Fill a definite-height flex column and pass that height to the covered content (a pk-list-page keeps its pinned header and pager). The parent needs a definite height: a flex column, or a block such as the <main> of a pk-app-shell[contain] body (the overlay is capped to it). Without contain it must be the body's direct child. |
| `ChildContent` | `RenderFragment?` |  | default slot | The content being covered. |

Element details (parts, CSS custom properties, methods, accessibility): `pk-loading-overlay` in the `plainkit-sdk` skill.

## `PkProgress`

`<pk-progress>`: **Progress** (Feedback). A determinate or indeterminate progress bar on the native progress element, with sizes, colours, stripes, a label, a value readout and automatic warning colours.

**Parameters**

| Parameter | Type | Enum values | Sets | Description |
|---|---|---|---|---|
| `Value` | `double` |  | attribute `value` | Current value. |
| `Max` | `double` |  | attribute `max` | Upper bound. |
| `Variant` | `ProgressVariant?` | `Accent` `Ok` `Warn` `Danger` | attribute `variant` | Colour. |
| `Size` | `ProgressSize?` | `Md` `Sm` `Lg` | attribute `size` | Height. |
| `Striped` | `bool` |  | attribute `striped` | Diagonal stripes. |
| `Indeterminate` | `bool` |  | attribute `indeterminate` | Unknown duration: the bar sweeps. |
| `Label` | `string?` |  | attribute `label` | Text above the bar; also its accessible name. |
| `ShowValue` | `bool` |  | attribute `show-value` | Append the percentage next to the label. |
| `Inline` | `bool` |  | attribute `inline` | Puts the label before the bar and the value after it on one line, instead of a row above the bar. |
| `LevelThresholds` | `string?` |  | attribute `level-thresholds` | Two percentages, for example "70,90": the bar turns warn then danger. |

Element details (parts, CSS custom properties, methods, accessibility): `pk-progress` in the `plainkit-sdk` skill.

## `PkSkeleton`

`<pk-skeleton>`: **Skeleton** (Feedback). A placeholder shape (line, paragraph, circle, block) that holds the layout while content loads.

**Parameters**

| Parameter | Type | Enum values | Sets | Description |
|---|---|---|---|---|
| `Variant` | `SkeletonVariant?` | `Line` `Text` `Circle` `Block` | attribute `variant` | Shape. |
| `Lines` | `double` |  | attribute `lines` | Lines in the text variant. |
| `Size` | `string?` |  | attribute `size` | Diameter of a circle or height of a block, any CSS length. |
| `Label` | `string?` |  | attribute `label` | Text for assistive technology. |

Element details (parts, CSS custom properties, methods, accessibility): `pk-skeleton` in the `plainkit-sdk` skill.

## `PkSpinner`

`<pk-spinner>`: **Spinner** (Feedback). A busy indicator: a ring, three dots or an indeterminate bar, in three sizes, with an overlay mode for a loading panel.

**Parameters**

| Parameter | Type | Enum values | Sets | Description |
|---|---|---|---|---|
| `Variant` | `SpinnerVariant?` | `Ring` `Dots` `Bar` | attribute `variant` | Shape. |
| `Size` | `SpinnerSize?` | `Md` `Sm` `Lg` | attribute `size` | Size. |
| `Label` | `string?` |  | attribute `label` | Accessible status text. |
| `Overlay` | `bool` |  | attribute `overlay` | Dim and cover a position: relative parent. |
| `ShowLabel` | `bool` |  | attribute `show-label` | Shows the label as visible text beside the spinner (under it with overlay), for a loading state that should say what it waits for; without it the label is for screen readers only. |

Element details (parts, CSS custom properties, methods, accessibility): `pk-spinner` in the `plainkit-sdk` skill.

## `PkToast`

`<pk-toast>`: **Toast** (Feedback & status). One transient message: kind, optional title, message, an action slot and a dismiss button; pauses its timer on hover and focus.

**Parameters**

| Parameter | Type | Enum values | Sets | Description |
|---|---|---|---|---|
| `Kind` | `ToastKind` | `Info` `Success` `Warning` `Danger` | attribute `kind` | The kind setting |
| `Heading` | `string?` |  | attribute `heading` | The heading setting |
| `Message` | `string?` |  | attribute `message` | Used when nothing is slotted. |
| `Duration` | `int` |  | attribute `duration` | Milliseconds before it dismisses itself; 0 keeps it until dismissed; -1 is automatic (5s, 8s with an action). |
| `NoClose` | `bool` |  | attribute `no-close` | Hide the dismiss button. |
| `ChildContent` | `RenderFragment?` |  | default slot | Message. |
| `ActionContent` | `RenderFragment?` |  | slot `action` | One or two buttons. |
| `OnDismiss` | `EventCallback<PkDismissEventArgs>` |  | event `pk-dismiss` | timeout, close, action or method. |

When you set a named fragment (`ActionContent`), write the body as an explicit `<ChildContent>` tag too: Razor does not allow an implicit body next to a named fragment.

**Event args**

| Event | Args class | Fields |
|---|---|---|
| `pk-dismiss` | `PkDismissEventArgs` | Reason: string? |

Element details (parts, CSS custom properties, methods, accessibility): `pk-toast` in the `plainkit-sdk` skill.

## `PkToastStack`

`<pk-toast-stack>`: **Toast stack** (Feedback & status). The live region that holds toasts at one screen position, shows at most three at once and queues the rest; PkToast.show(message, options) creates one per position on demand.

**Parameters**

| Parameter | Type | Enum values | Sets | Description |
|---|---|---|---|---|
| `Position` | `ToaststackPosition` | `TopStart` `Top` `TopEnd` `BottomStart` `Bottom` `BottomEnd` | attribute `position` | The position setting |
| `Max` | `int` |  | attribute `max` | Visible at once; the rest queue. |
| `ChildContent` | `RenderFragment?` |  | default slot | pk-toast children. |

Element details (parts, CSS custom properties, methods, accessibility): `pk-toast-stack` in the `plainkit-sdk` skill.