# SolDevelo Registry > Open-source UI blocks for the projects SolDevelo builds, installable with the shadcn CLI. SolDevelo Registry publishes 29 installable items across 1 open-source project (OpenLMIS): 12 components, 13 blocks, and 4 page templates. Everything is open source and maintained by SolDevelo at https://github.com/SolDevelo/soldevelo-registry. Items are consumed with the shadcn CLI, which copies the source into the consumer's repository. There is no wrapper package and no runtime dependency on this site. ## Pages - [Home](https://registry.soldevelo.com/): What the registry contains and how to wire it up. - [Components](https://registry.soldevelo.com/components): 12 components, with live previews and full source. - [Blocks](https://registry.soldevelo.com/blocks): 13 blocks, with live previews and full source. - [Templates](https://registry.soldevelo.com/templates): 4 templates, with live previews and full source. - [Docs](https://registry.soldevelo.com/docs): Registry setup, install commands, where each kind lands, and the theme tokens items ship with. - [Changelog](https://registry.soldevelo.com/changelog): What changed in each release, generated from CHANGELOG.md. ## Item names Every item is prefixed with the project it belongs to, so two projects cannot collide. Each item also declares `meta.project`, which the build checks against the name. - OpenLMIS: `openlmis-{item}`, from https://openlmis.org. ## URLs - Item pages: `https://registry.soldevelo.com/{components|blocks|templates}/{item-name}`, with a short intro, the install command and the preview. - Projects: `https://registry.soldevelo.com/projects`. Each project's page, `https://registry.soldevelo.com/projects/{project-id}`, lists every item it publishes, grouped by kind. - Standalone previews: `https://registry.soldevelo.com/preview/{item-name}`. - Registry item JSON: `https://registry.soldevelo.com/r/{item-name}.json`. - Registry index: `https://registry.soldevelo.com/r/registry.json`. ## Installation Register the namespace once in `components.json`, then install any item by name: ```json { "registries": { "@soldevelo": "https://registry.soldevelo.com/r/{name}.json" } } ``` ```sh pnpm dlx shadcn@latest add @soldevelo/openlmis-pagination npx shadcn@latest add @soldevelo/openlmis-pagination ``` ## Catalog - [Pagination](https://registry.soldevelo.com/components/openlmis-pagination) `@soldevelo/openlmis-pagination` (component): 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. - [Search Input](https://registry.soldevelo.com/components/openlmis-search-input) `@soldevelo/openlmis-search-input` (component): 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. - [Select Filter](https://registry.soldevelo.com/components/openlmis-select-filter) `@soldevelo/openlmis-select-filter` (component): Toolbar dropdown that narrows a list to one value, reading "Status: Active" once picked, with a button to clear it. - [Column View Options](https://registry.soldevelo.com/components/openlmis-column-view-options) `@soldevelo/openlmis-column-view-options` (component): View menu that shows or hides a table's columns with checkboxes, and resets them to their defaults. - [Status Badge](https://registry.soldevelo.com/components/openlmis-status-badge) `@soldevelo/openlmis-status-badge` (component): 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. - [Page Breadcrumbs](https://registry.soldevelo.com/components/openlmis-page-breadcrumbs) `@soldevelo/openlmis-page-breadcrumbs` (component): 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. - [Form Fields](https://registry.soldevelo.com/components/openlmis-form-fields) `@soldevelo/openlmis-form-fields` (component): TanStack Form field components on shadcn Field: text, password with a show button, a type-to-filter combobox, radio and switch choice cards, required marks, inline errors, and skeletons that hold the form's shape while values load. - [Form Dialog](https://registry.soldevelo.com/components/openlmis-form-dialog) `@soldevelo/openlmis-form-dialog` (component): 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. - [Dashboard Card](https://registry.soldevelo.com/components/openlmis-dashboard-card) `@soldevelo/openlmis-dashboard-card` (component): 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. - [Stat Strip](https://registry.soldevelo.com/components/openlmis-stat-strip) `@soldevelo/openlmis-stat-strip` (component): 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. - [Discard Changes Dialog](https://registry.soldevelo.com/components/openlmis-discard-changes-dialog) `@soldevelo/openlmis-discard-changes-dialog` (component): 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. - [Callout](https://registry.soldevelo.com/components/openlmis-callout) `@soldevelo/openlmis-callout` (component): 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. - [Data Table](https://registry.soldevelo.com/blocks/openlmis-data-table) `@soldevelo/openlmis-data-table` (block): 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. - [Workspace](https://registry.soldevelo.com/blocks/openlmis-workspace) `@soldevelo/openlmis-workspace` (block): 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. - [List Toolbar](https://registry.soldevelo.com/blocks/openlmis-list-toolbar) `@soldevelo/openlmis-list-toolbar` (block): 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. - [User Form Dialog](https://registry.soldevelo.com/blocks/openlmis-user-form-dialog) `@soldevelo/openlmis-user-form-dialog` (block): Add User and Edit User dialog for OpenLMIS: name, email with its verified state, job title, phone, a searchable home facility, sign-in and notification settings, and removing home facility roles when the facility changes. It takes the user, facilities and save state as props. - [Reset Password Dialog](https://registry.soldevelo.com/blocks/openlmis-reset-password-dialog) `@soldevelo/openlmis-reset-password-dialog` (block): Reset Password dialog that emails the user a reset link or sets a password by hand, falls back to a typed password when the user has no email, and opens as Set Password for a user just created. - [Requisitions By Period](https://registry.soldevelo.com/blocks/openlmis-requisitions-by-period) `@soldevelo/openlmis-requisitions-by-period` (block): Stacked bar chart of sent requisitions over the latest six months, in progress against approved, grouped by the month their period starts, with two-line month ticks, totals on each bar and a table for screen readers. - [Requisition Status Meter](https://registry.soldevelo.com/blocks/openlmis-requisition-status-meter) `@soldevelo/openlmis-requisition-status-meter` (block): Where sent requisitions stand, from submitted to released, as one segmented bar in the chart ramp with a legend of counts and shares. - [Equipment Status](https://registry.soldevelo.com/blocks/openlmis-equipment-status) `@soldevelo/openlmis-equipment-status` (block): Cold chain equipment by functional status, each with its own icon, count and meter in a success, warning or destructive tone, so the state reads without relying on colour. - [Approvals Table](https://registry.soldevelo.com/blocks/openlmis-approvals-table) `@soldevelo/openlmis-approvals-table` (block): Requisitions waiting on the user, emergencies flagged: a table when the card has room and two lines per requisition on a narrow card, with loading, empty and error states. - [Role Assignments Table](https://registry.soldevelo.com/blocks/openlmis-role-assignments-table) `@soldevelo/openlmis-role-assignments-table` (block): One role type's assignments for a user: search, sort and paging in the browser, program and supervisory node or facility columns that fold under the role when narrow, Unsaved and Ignored badges, names that show a placeholder until they load, and View Rights and Remove row actions. - [Add Role Dialog](https://registry.soldevelo.com/blocks/openlmis-add-role-dialog) `@soldevelo/openlmis-add-role-dialog` (block): Dialog that adds one role of a type: searchable programs, supervisory nodes, facilities and roles as the type needs, the rights a role grants once picked, required fields, a refusal of duplicates, and a warning when a home facility role has no home facility to apply at. - [Import Roles Dialog](https://registry.soldevelo.com/blocks/openlmis-import-roles-dialog) `@soldevelo/openlmis-import-roles-dialog` (block): Dialog that copies another user's roles into the ones being edited, with a searchable list of users and a preview of how many roles are new before anything is added. - [Role Rights Dialog](https://registry.soldevelo.com/blocks/openlmis-role-rights-dialog) `@soldevelo/openlmis-role-rights-dialog` (block): Dialog listing what a role lets its holder do, each right named in words, scrolling inside the viewport when the list is long. - [List Page](https://registry.soldevelo.com/templates/openlmis-list-page) `@soldevelo/openlmis-list-page` (template): 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. - [Home Dashboard](https://registry.soldevelo.com/templates/openlmis-home-dashboard) `@soldevelo/openlmis-home-dashboard` (template): 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. - [User Roles Page](https://registry.soldevelo.com/templates/openlmis-user-roles-page) `@soldevelo/openlmis-user-roles-page` (template): 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. - [Not Found Page](https://registry.soldevelo.com/templates/openlmis-not-found-page) `@soldevelo/openlmis-not-found-page` (template): 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. ## Technology React 19, Tailwind CSS v4, shadcn/ui on Base UI primitives, and TypeScript. Items target a `base-*` style in components.json (the `shadcn init` default); legacy `new-york`/`radix-*` styles install Radix primitives, which reject the `render` prop some items use.