Result state

TS

import { … } from "@fungi.computer/caps/blocks/result-state";

Success

TSX

import { ResultState } from "@fungi.computer/caps/blocks/result-state";
import { Button } from "@fungi.computer/caps/components/button";

export default function Success() {
  return (
    <ResultState
      icon={<span className="text-3xl">✅</span>}
      title="Batch logged"
      description="Your Lion's Mane harvest was added to the forage log."
      actions={<Button size="sm">View log</Button>}
    />
  );
}

Error

TSX

import { ResultState } from "@fungi.computer/caps/blocks/result-state";
import { Button } from "@fungi.computer/caps/components/button";

export default function ErrorResult() {
  return (
    <ResultState
      icon={<span className="text-3xl">⚠️</span>}
      title="Could not save batch"
      description="Check your connection and try logging it again."
      actions={
        <Button size="sm" variant="outline">
          Retry
        </Button>
      }
    />
  );
}

Props

ResultStateProps

Prop	Type	Description
actions?	ReactNode
description	ReactNode
icon?	ReactNode
title	ReactNode

• actions?ReactNode
• descriptionReactNode
• icon?ReactNode
• titleReactNode

Full types: API reference.