Bulk actions
Table selection actions
| Select all | Name | Role | |
|---|---|---|---|
| NameAlex Morgan | Email[email protected] | RoleOwner | |
| NameJamie Lee | Email[email protected] | RoleMember | |
| NameRiley Chen | Email[email protected] | RoleMember | |
| NameSam Rivera | Email[email protected] | RoleGuest |
0 selected
open System
open FSharp.ViewEngine
open Acme.Components.Primitives
open Acme.Components.Application
open type Html
open type Svg
open type Datastar
let bulkActionsExample selectionSource (content:HtmlElement) =
let contentWithFeedback =
div {
_class "grid gap-3"
content
output { _id "bulk-action-feedback"; _ariaLive "polite"; _class "text-sm text-[var(--fve-muted-text)]"; "Select records to use bulk actions." }
}
BulkActions.create "example-bulk-actions" selectionSource "Selected account actions" [
BulkAction.create "Queue review" "Selected accounts queued for review."
(fun keys -> $"document.getElementById('bulk-action-feedback').textContent = 'Queued IDs: ' + {keys}.join(', ')")
|> BulkAction.primary
BulkAction.create "Archive" "Selected accounts archived in this resettable demo."
(fun keys -> $"document.getElementById('bulk-action-feedback').textContent = 'Archived IDs: ' + {keys}.join(', ')")
|> BulkAction.destructive ] contentWithFeedback
|> BulkActions.render