Chainlink Demos
Filter Bar Debug (EXACT crec-ui layout)

Testing the exact WalletsPage layout with justify-between

Wallets

↑ Select multiple networks to test if container grows and pushes button

Select Primitives Comparison

All sizes (default, sm, xs) and states: empty, with value, disabled empty, disabled with value.

Default size

Empty

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

With value

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

Disabled (empty)

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

Disabled (with value)

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

SM size

Empty

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

With value

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

Disabled (empty)

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

Disabled (with value)

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

XS size

Empty

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

With value

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

Disabled (empty)

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

Disabled (with value)

ComboboxBaseUI (multiple)

ComboboxBaseUI

SimpleSelect

Select

Welcome to Demo App

Page showcasing components from the Blocks design system

DropdownMenu
SimpleSelect
This text is meant to help you.
There is a huge error
FieldInput
There is a huge error
Disabled States — Side by Side
Default
Disabled
Card 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Card 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Card 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Data DataTable

Sample Text

SAMPLE_CODE

Default

Another Text

ANOTHER_CODE

Success

More Text

MORE_CODE

Warning

Showing

1

to

3

of

5

records

Standalone Pagination

Default mode with total count

Showing

1

to

10

of

45

records

Display mode without total count

Showing

1

to

10

records

Page 1
Connect Wallet Modal
Platform Ads

Ephemeral messages that appear in the corner of the screen to inform users about events or actions

PageNotFound

Page not found

We can’t seem to find the page you’re looking for.

Return home

Want to host a demo? Contact the Frontend Engineering team or visit the slack #team-frontend to learn more