Koala logo Design
No matches for “
↑↓ navigate open Esc close
Components Destructive actions

Destructive actions

The destructive-actions block at the bottom of an entity detail page (View Quote / Transaction / Partner / Branch). A calm surface-recessed panel with a neutral border-outline hairline — so it reads as a defined panel in both light and dark, with no alarming red fill — holding a hairline-divided list of <koala-destructive-action> rows, each a title + description with the destructive control (a Danger outlined button or tray link) on the right. No heading: the danger signal is each row's outlined button and its confirm step.

<koala-destructive-actions>

Canonical — one action

Disable this partner

Hides this partner from everyone, including admins, until you re-enable it.

<koala-destructive-actions>
    <koala-destructive-action title="Disable this partner"
                              description="Hides this partner from everyone, including admins, until you re-enable it."
                              action-label="Disable partner" on-click="confirmOpen = true" />
</koala-destructive-actions>

Multiple actions (hairline-divided)

Cancel this quote

Cancels the quote and stops further action.

Delete this quote

Removes this quote and every earlier revision.

<koala-destructive-actions>
    <koala-destructive-action title="Cancel this quote"
                              description="Cancels the quote and stops further action."
                              action-label="Cancel quote" on-click="confirmOpen = true" />
    <koala-destructive-action title="Delete this quote"
                              description="Removes this quote and every earlier revision."
                              action-label="Delete quote" on-click="deleteOpen = true" />
</koala-destructive-actions>

Action as a tray link

Disable this branch

Stops new work being routed to this branch and hides it from team selection.

<koala-destructive-actions>
    <koala-destructive-action title="Disable this branch"
                              description="Stops new work being routed to this branch and hides it from team selection."
                              action-label="Disable branch" href="@disableUrl" tray="true" />
</koala-destructive-actions>