Copy page

Components

MetadataLoading

src/lib/components/ui/metadata-loading/MetadataLoading.svelte

Purpose

Full-height centered loading placeholder used inside list/table views while the metadata describing the entity collection is still being fetched. Renders a fading Cloud watermark with a spinning RefreshCw overlay and a localized status line. Drop it in wherever a list panel would otherwise be empty during the initial metadata load.

Origin

Custom — Primebrick-built placeholder. Uses the pb-watermark-fade animation defined in src/app.css.

Usage

Default (localized generic message)

Code
<script lang="ts">
  import MetadataLoading from "$lib/components/ui/metadata-loading/MetadataLoading.svelte";
</script>

<MetadataLoading />

Named entity

Code
<MetadataLoading entityName="users" />

Renders the localized string for metadata.loading.entity with { entity: "users" }.

Custom loading text

Code
<MetadataLoading loadingText="Fetching schema…" />

Props

Full prop table: see API reference — metadataloading.

Key props:

• entityName (string) — when provided, shows metadata.loading.entity with this value.
• loadingText (string) — overrides both of the above with a literal string.

When neither is provided, the localized metadata.loading.default string is used.

Next steps

• LoadingBar
• Component catalog
• UI stack
• API reference