Duskmoon UI · Storybook

Components PhoenixDuskmoon.Component · 67 UI demos

Browse the component gallery by category. Every card opens a real UI demonstration page; React integrations use LiveView for server events, validation, and streaming state.

Action

Button

dm_btn

Interactive UI demo for dm_btn.

Open demo

Link

dm_link

Interactive UI demo for dm_link.

Open demo

Dropdown

dm_dropdown

Interactive UI demo for dm_dropdown.

Open demo

Toggle

dm_toggle_group

Interactive UI demo for dm_toggle_group.

Open demo

Data Display

Accordion

dm_accordion

Interactive UI demo for dm_accordion.

Open demo

Avatar

dm_avatar

Interactive UI demo for dm_avatar.

Open demo

Badge

dm_badge

Interactive UI demo for dm_badge.

Open demo

Card

dm_card

Interactive UI demo for dm_card.

Open demo

Chat

dm_chat

Interactive UI demo for dm_chat.

Open demo

React Chat

dm_react_chat

Streaming transcript, Markdown, tool calls, retries, and batched event updates.

Open demo

Chip

dm_chip

Interactive UI demo for dm_chip.

Open demo

Datetime

dm_datetime

Interactive UI demo for dm_datetime.

Open demo

Flash

dm_flash

Interactive UI demo for dm_flash.

Open demo

Markdown

dm_markdown

Interactive UI demo for dm_markdown.

Open demo

Markdown Body

dm_markdown_body

Interactive UI demo for dm_markdown_body.

Open demo

Pagination

dm_pagination

Interactive UI demo for dm_pagination.

Open demo

Progress

dm_progress

Interactive UI demo for dm_progress.

Open demo

Skeleton

dm_skeleton

Interactive UI demo for dm_skeleton.

Open demo

Stat

dm_stat

Interactive UI demo for dm_stat.

Open demo

Table

dm_table

Interactive UI demo for dm_table.

Open demo

Timeline

dm_timeline

Interactive UI demo for dm_timeline.

Open demo

Tooltip

dm_tooltip

Interactive UI demo for dm_tooltip.

Open demo

Popover

dm_popover

Interactive UI demo for dm_popover.

Open demo

List

dm_list

Interactive UI demo for dm_list.

Open demo

Collapse

dm_collapse

Interactive UI demo for dm_collapse.

Open demo

Data Entry

Autocomplete

dm_autocomplete

Interactive UI demo for dm_autocomplete.

Open demo

Checkbox

dm_checkbox

Interactive UI demo for dm_checkbox.

Open demo

Compact Input

dm_compact_input

Interactive UI demo for dm_compact_input.

Open demo

File Upload

dm_file_upload

Interactive UI demo for dm_file_upload.

Open demo

Form

dm_form

Interactive UI demo for dm_form.

Open demo

React Form

dm_react_form

Nested typed JSON form with React fields, native controls, validation, and reset events.

Open demo

Input

dm_input

Interactive UI demo for dm_input.

Open demo

OTP Input

dm_otp_input

Interactive UI demo for dm_otp_input.

Open demo

Rating

dm_rating

Interactive UI demo for dm_rating.

Open demo

Radio

dm_radio

Interactive UI demo for dm_radio.

Open demo

Segment Control

dm_segment_control

Interactive UI demo for dm_segment_control.

Open demo

Select

dm_select

Interactive UI demo for dm_select.

Open demo

Slider

dm_slider

Interactive UI demo for dm_slider.

Open demo

Switch

dm_switch

Interactive UI demo for dm_switch.

Open demo

Textarea

dm_textarea

Interactive UI demo for dm_textarea.

Open demo

Time Input

dm_time_input

Interactive UI demo for dm_time_input.

Open demo

PIN Input

dm_pin_input

Interactive UI demo for dm_pin_input.

Open demo

Multi Select

dm_multi_select

Interactive UI demo for dm_multi_select.

Open demo

Tree Select

dm_tree_select

Interactive UI demo for dm_tree_select.

Open demo

Cascader

dm_cascader

Interactive UI demo for dm_cascader.

Open demo

Markdown Input

dm_markdown_input

Interactive UI demo for dm_markdown_input.

Open demo

Code Engine

dm_code_engine

Interactive UI demo for dm_code_engine.

Open demo

Feedback

Dialog

dm_modal

Interactive UI demo for dm_modal.

Open demo

Loading

dm_loading_spinner

Interactive UI demo for dm_loading_spinner.

Open demo

Toast

dm_toast

Interactive UI demo for dm_toast.

Open demo

Snackbar

dm_snackbar

Interactive UI demo for dm_snackbar.

Open demo

Icon

Icons

dm_mdi / dm_bsi

Interactive UI demo for dm_mdi / dm_bsi.

Open demo

Layout

Bottom Sheet

dm_bottom_sheet

Interactive UI demo for dm_bottom_sheet.

Open demo

Divider

dm_divider

Interactive UI demo for dm_divider.

Open demo

Drawer

dm_drawer

Interactive UI demo for dm_drawer.

Open demo

Theme Switcher

dm_theme_switcher

Interactive UI demo for dm_theme_switcher.

Open demo

Navigation

Actionbar

dm_actionbar

Interactive UI demo for dm_actionbar.

Open demo

Appbar

dm_appbar

Interactive UI demo for dm_appbar.

Open demo

Bottom Nav

dm_bottom_nav

Interactive UI demo for dm_bottom_nav.

Open demo

Breadcrumb

dm_breadcrumb

Interactive UI demo for dm_breadcrumb.

Open demo

Left Menu

dm_left_menu

Interactive UI demo for dm_left_menu.

Open demo

Navbar

dm_navbar

Interactive UI demo for dm_navbar.

Open demo

Page Footer

dm_page_footer

Interactive UI demo for dm_page_footer.

Open demo

Page Header

dm_page_header

Interactive UI demo for dm_page_header.

Open demo

Stepper

dm_stepper

Interactive UI demo for dm_stepper.

Open demo

Tab

dm_tab

Interactive UI demo for dm_tab.

Open demo