Components, blocks and templates from the open-source projects SolDevelo builds, starting with OpenLMIS. Built on Base UI.
Composable authentication cards and a page shell with logo, title, form, actions and Powered By footer.
Message box in a warning, info or success tone, tinted border and background with an icon of its own and text in the foreground colours, for the states the stock Alert has no variant for.
View menu that shows or hides a table's columns with checkboxes, and resets them to their defaults.
A searchable toolbar filter with caller-supplied options, search callbacks, status and empty messages.
A value display and controlled copy button, with caller-owned copy behavior and feedback.
Card frame for a dashboard: a title with its count in a badge, a one-line description, placeholders and an error with Try Again for a body whose data is not ready, and a row that sets a wide card beside a narrow one when there is room.
Server-paged table on TanStack Table v9: sortable headers, fixed column widths that hold steady from page to page, columns that drop when the table is narrow, a skeleton built from the real columns, empty and error states, and a pagination footer.
A calendar date picker with date bounds, a clear button and accessible labels. Values stay in yyyy-MM-dd format.
Alert dialog asked before leaving a page with unsaved changes: how many would be lost and whose, Keep Editing, and a destructive Discard whose label says what happens next.
Mock facility editor with Information and Associated Programs tabs, managed fields, combined validation and discard confirmation.
Mock facility type administration with responsive columns, sorting, paging and create/edit forms.
Mock email reset request page with a neutral confirmation.
Cancel and Save actions for a form, with dirty and pending states, usable inside the form or in a page footer.
Dialog for a form that stays inside the viewport and scrolls only its body, ignores clicks outside so nothing typed is lost, locks while a save runs, and shows save and load errors in place with a way to try again.
Thirteen TanStack Form controls with stacked, row and inline layouts, accessible hints and errors, password reveal, searchable options, tags, images and dates, compact switch rows and radio cards or tiles.
OpenLMIS home screen on mock data: a greeting with what is waiting, Add User, system notices, a stat strip, requisitions by period and by status, cold chain equipment and the approvals queue, each shown only when the user's rights allow.
A truncated label with an accessible details button and a composable popover panel.
Complete users list screen on mock data: breadcrumbs and heading, a toolbar with search, a status filter, a View menu and Add User, a table with sorting, paging, empty and no-matches states, and row actions that open Edit User and Reset Password, with Add User going on to Set Password.
Layout for the controls above a list, installed with the search, filter and View menu it arranges: one row with room, and the search on a row of its own once the toolbar is narrow.
Mock lot list with product/expiry filters, paging and editable lot dialogs.
No-access empty state with a heading-level choice and optional Back Home link.
A 404 page that shows the address that was asked for, with Go Back and Back Home, ready to render inside an app shell so the navigation stays.
Pure number validation for text fields, including whole numbers, bounds and decimal precision.
Breadcrumb trail from a list of steps, where a step without a page, such as a menu section, shows as text, and links render through any router.
Pager for a server-paged list: rows per page, the range on screen out of the total, and first, previous, next and last page buttons, with a matching loading skeleton. Tightens to fit narrow containers.
A live checklist of password rules with pure validation helpers.
Mock product editor with General, Programs, Facility Types and Kit Unpack List tabs, dialogs and discard confirmation.
A mock profile with basic information, read-only role assignments, notification settings and a change password dialog.
Mock program administration with responsive columns, sorting, paging and create/edit forms.
Mock stock reason editor with assignment pairs, partial-save feedback and discard confirmation.
Mock password reset page with validation and link-status presentation.
One role type's assignments for a user: search, sortable columns that fold into one on a narrow card, a role's rights in a popover, unsaved and ignored badges, removal and Add Role, plus the role types and helpers the user, roles and profile pages share.
Search and filter roles by type, create or edit them, and view their rights using local mock data.
Search field that reports after a pause in typing, on Enter or when it loses focus, with a clear button, so a list updates once per search rather than on every keystroke.
A stacked meter with a labeled count and percentage legend, locale formatting and right-to-left support.
Toolbar dropdown that narrows a list to one value, reading "Status: Active" once picked, with a button to clear it.
Mock service-key list with sorting, paging, add/delete dialogs and copy-state presentation.
Bordered setting rows with labels, descriptions, badges and editable or read-only values.
Mock sign-in page with credentials, refused feedback and a signed-in result.
One panel of headline numbers split by hairlines, with as many columns as there are stats, and a placeholder or Try Again for any number that is not ready.
Badge for a state such as active, unsaved or ignored, in a success, warning, info or destructive tone with an icon of its own, so the state reads without relying on colour.
Composable labeled meters with icons, counts and semantic tones.
Mock branding and feature flag settings with sticky Save and Cancel, discard confirmation, defaults, conflict Reload and partial-save feedback.
A page selection checkbox column and a floating selected-count bar with Clear and actions.
Edit User Roles on mock data: Supervision, Fulfillment, Reports and Administration tabs with counts over one draft, Add Role, Import Roles and View Rights dialogs, Remove with Undo, and Cancel and Save Changes in a bar at the bottom that asks before discarding unsaved changes.
Mock valid sources and destinations with paired facility and program filters, responsive tables, selection across pages, Add and partial Delete.
Page frame for an app screen: breadcrumbs, a heading with an icon, title and one-line description, header actions that share the width when the header stacks, a content area, and a bar stuck to the bottom for page-wide actions such as Save.
Controlled page section tabs that wrap into a column or grid on narrow screens.