Empty state
With recovery action
No accounts yet
Create an account to start tracking balances and entries.
open System
open FSharp.ViewEngine
open Acme.Components.Primitives
open Acme.Components.Application
open type Html
open type Svg
open type Datastar
let private plusIcon =
raw """<svg viewBox="0 0 20 20" fill="currentColor" class="size-4"><path d="M10 4.25a.75.75 0 0 1 .75.75v4.25H15a.75.75 0 0 1 0 1.5h-4.25V15a.75.75 0 0 1-1.5 0v-4.25H5a.75.75 0 0 1 0-1.5h4.25V5a.75.75 0 0 1 .75-.75Z"/></svg>"""
let emptyStateExample =
EmptyState.create "No accounts yet" "Create an account to start tracking balances and entries."
|> EmptyState.withIcon plusIcon
|> EmptyState.withActions (
ActionCluster.create "empty-account-actions" [
ApplicationAction.link "/components/page-examples/account-management?destination=ledger-create-account" "Create account"
|> ApplicationAction.withVariant ButtonVariant.Primary ]
|> ActionCluster.render id)
|> EmptyState.render