Feedback

PageLoading

A loading screen in CSS alone, so it moves before JavaScript runs. The command types itself, and the list of what is loading appears only if the wait passes 2.2s.

view .md

Preview

Installation

terminal

bash

npx @entrepta/cli@latest add page-loading

// Resolves dependencies, copies the source, and installs npm packages automatically.

Usage

page-loading.tsx

tsx

import { PageLoading } from "@/components/entrepta/page-loading"

// app/log/loading.tsx
export default function Loading() {
  return (
    <PageLoading
      command="ls ./log"
      crumb="log"
      label="the log"
      steps={["reading entries", "reading covers"]}
    />
  )
}

Props

Prop	Type	Default	Description
command	string	-	The command the loaded page prints
crumb	string	-	Breadcrumb after ~
steps	string[]	-	Shown only on a long wait
label	string	-	Announced once: Loading {label}