Files
supabase/apps/design-system/registry/default/example/status-code-demo.tsx
kemal.earth 2c48910673 feat(design-system): status code component (#42064)
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

Formalising our status code component that was introduced in the new
charts + update auth overview page.


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Added a StatusCode UI component to display HTTP methods and status
codes with color-coded indicators.
* Added a demo showcasing multiple StatusCode examples and alignment
variants.

* **Documentation**
* Added a documentation fragment and sidebar entry for Status Codes with
a preview of the demo.

* **Refactor**
* Updated an Auth Overview view to use the new StatusCode component for
consistent status rendering.

<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-03-12 10:57:46 +00:00

13 lines
363 B
TypeScript

import { StatusCode } from 'ui-patterns'
export default function StatusCodeDemo() {
return (
<div className="flex flex-col gap-2">
<StatusCode method="GET" statusCode="200" />
<StatusCode method="POST" statusCode="404" />
<StatusCode method="DELETE" statusCode="500" />
<StatusCode method="PUT" statusCode="100" />
</div>
)
}