Components

Loading state

A bounded, labelled loading region; the caller owns the message.

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

Basic

import { LoadingState } from "@fungi.computer/caps/blocks/loading-state";

export default function Basic() {
  return <LoadingState message="Loading the forage log…" />;
}

In card

import { LoadingState } from "@fungi.computer/caps/blocks/loading-state";
import { Card, CardContent } from "@fungi.computer/caps/components/card";

export default function InCard() {
  return (
    <Card variant="outline" className="w-full max-w-xs">
      <CardContent>
        <LoadingState message="Fetching batch 12…" />
      </CardContent>
    </Card>
  );
}