실행 미리 보기

실시간

접근 권한이 없습니다

kind="permission"

NxEmptyView

접근 권한이 없습니다

현재 사용자는 이 콘텐츠를 열 수 없습니다.

아직 레코드가 없습니다

kind="empty"

NxEmptyView

아직 레코드가 없습니다

첫 레코드를 만들어 작업을 시작하세요.

일치하는 레코드가 없습니다

kind="noResults"

NxEmptyView

일치하는 레코드가 없습니다

필터를 변경한 후 다시 시도하세요.

레코드를 찾을 수 없습니다

kind="notFound"

NxEmptyView

레코드를 찾을 수 없습니다

이동되었거나 삭제되었을 수 있습니다.

레코드를 불러오지 못했습니다

kind="error"

NxEmptyView

레코드를 불러오지 못했습니다

연결 상태를 확인한 후 다시 시도하세요.

복사 가능한 소스

코드 예시

TSX

import { NxButton, NxEmptyView } from "@nexia/sdk/host";

export function EmptyStatesExample() {
    return (
        <div className="grid gap-5 lg:grid-cols-2">
            <NxEmptyView
                kind="permission"
                title="Permission denied"
                description="The current actor cannot open this content."
            />
            <NxEmptyView
                kind="empty"
                title="No records yet"
                description="Create the first record to start this workflow."
            >
                <NxButton size="sm">Create record</NxButton>
            </NxEmptyView>
            <NxEmptyView
                kind="noResults"
                title="No matching records"
                description="Change the filters and try again."
            />
            <NxEmptyView
                kind="notFound"
                title="Record not found"
                description="It may have moved or been removed."
            />
            <NxEmptyView
                kind="error"
                title="Could not load records"
                description="Retry after checking the connection."
            >
                <NxButton size="sm" variant="secondary">
                    Retry
                </NxButton>
            </NxEmptyView>
        </div>
    );
}123456789101112131415161718192021222324252627282930313233343536373839