Contents

Hikari
Guides
Design
- Overview
System
Components — Layer 1
Components — Layer 2
Components — Layer 3

Feedback Components

User feedback-related composite components.

Drawer

(live preview unavailable)

Add a ```hikari:tsx block after ```hikari:rust to enable TSX preview

1

2

3

rsx! {
    div { style: "padding:1rem;color:#999;", "Component preview: pages/components/layer2/feedback#drawer" }
}

Popover

(live preview unavailable)

Add a ```hikari:tsx block after ```hikari:rust to enable TSX preview

1

2

3

4

5

6

rsx! {
    div { style: "padding:1rem;position:relative;",
        button { style: "padding:6px 16px;border:1px solid #ccc;border-radius:4px;cursor:pointer;", "Hover me" }
        div { style: "position:absolute;top:40px;left:0;padding:8px 12px;background:#333;color:#fff;border-radius:4px;font-size:12px;white-space:nowrap;", "Popover content" }
    }
}

Upload

(live preview unavailable)

Add a ```hikari:tsx block after ```hikari:rust to enable TSX preview

1

2

3

4

5

6

rsx! {
    div { style: "padding:1rem;",
        div { style: "border:2px dashed #ccc;border-radius:8px;padding:2rem;text-align:center;color:#999;",
            "Click or drag file to upload" }
    }
}