Component library

All Components Map

Browse through Loomora’s comprehensive set of accessible, theme-driven components. Each component includes an interactive live sandbox, full API reference, and LoomoraProvider configuration links.

Component Directory

Component Map & Catalog

Explore 33 production-ready components. Filter by category, search by feature, or view related configuration defaults.

Configurable in LoomoraProvider only

Showing 33 of 33 components

UIAccordion

Accordion

Animated disclosure section for progressively revealed content.

Config:accordion

View component & live demo

UIButton

Button

Semantic action and navigation control with variant, size, and loading states.

Config:button form.submitButton

View component & live demo

UIDialog

Dialog

Modal surface with overlay, positioning, portal, and close behavior.

Config:dialog

View component & live demo

UIDigit

Digit

Locale-aware numeric display for prices, counts, and measurements.

Config:translations.digit

View component & live demo

UIDropdown

Dropdown

Button-anchored menu with outside-close handling and placement options.

Config:dropdown

View component & live demo

UIFlag

Flag

Country flag image with an error fallback and configurable dimensions.

Config:flag

View component & live demo

UIBreadcrumbs

Breadcrumbs

Compact hierarchical navigation trail with active item styling.

Config:breadcrumbs

View component & live demo

UICopyrights

Copyrights

Small copyright and sponsor attribution line.

Config:copyrights

View component & live demo

PartialsLoader

Loader

Animated skeleton blocks for loading and placeholder layouts.

Config:loader

View component & live demo

PartialsProgressBar

ProgressBar

Progress visualization with optional label and value text.

Config:progressBar

View component & live demo

Form fieldsLabel

Label

Reusable label primitive with required state and forwarded label attributes.

Config:form.label

View component & live demo

Form fieldsInputHelper

InputHelper

Helper or error message primitive for form inputs.

Config:form.inputHelper

View component & live demo

Form fieldsTextField

TextField

Controlled text input with label, helper, prefix, suffix, and validation states.

Config:form.textField

View component & live demo

Form fieldsSearchField

SearchField

Text input with search, clear, and keyboard callbacks.

Config:form.searchField

View component & live demo

Form fieldsTextareaField

TextareaField

Controlled multiline text input with shared field styling.

Config:form.textareaField

View component & live demo

Form fieldsSelect

Select

Styled select control with option groups and controlled selection.

View component & live demo

Form fieldsCheckField

CheckField

Checkbox, radio, and switch controls with checked state.

Config:form.checkField

View component & live demo

Form fieldsPinField

PinField

Controlled one-time-code entry split across digit cells.

Config:form.pinField

View component & live demo

Form fieldsPasswordField

PasswordField

Password input with generation, visibility, copy, and validation features.

Config:form.passwordField

View component & live demo

Form fieldsPhoneInput

PhoneInput

Country-aware phone entry with parsing and formatting callbacks.

Config:form.phoneInput

View component & live demo

Form fieldsRangeField

RangeField

Custom range slider with marks, value display, and controlled state.

Config:form.rangeField

View component & live demo

Form fieldsRatingField

RatingField

Star rating input with hover preview, half steps, keyboard support, and native form submission.

Config:form.ratingField

View component & live demo

Form fieldsNumberField

NumberField

Numeric text input with thousand separators, decimal limits, and numeric change events.

Config:form.numberField

View component & live demo

Form fieldsColorField

ColorField

Modern custom color picker with hex input, presets, and optional opacity.

Config:form.colorField

View component & live demo

Form fieldsDateField

DateField

Comprehensive date and time picker supporting single dates, times, ranges, presets, and responsive dual calendars.

Config:form.dateField translations.dateField

View component & live demo

Form fieldsAutocomplete

Autocomplete

Searchable single- or multi-select option picker.

View component & live demo

Form fieldsUploaderField

UploaderField

Controlled file picker with validation, drag/drop, paste, and preview layouts.

View component & live demo

Form fieldsTextEditor

TextEditor

TinyMCE rich-text editor with controlled content and configurable toolbar.

View component & live demo

Form compositionForm

Form

Composes typed input definitions, layout wrappers, and action buttons.

Config:form

View component & live demo

Form compositionInput

Input

Dispatches a single input definition to its matching field component.

Config:form.input

View component & live demo

Form compositionInputs

Inputs

Renders an array of Input definitions inside a configurable grid wrapper.

Config:form

View component & live demo

HelpersConditionalWrapper

ConditionalWrapper

Wraps children conditionally and supports a fallback wrapper.

View component & live demo

HelpersContent

Content

Renders data with custom renderers, loading state, and empty fallback.

View component & live demo