Core RH

Inicio Demo Ejemplos

Design System · Demo

Fundamentos, patrones y componentes del Design System con estructura guiada.

Inventario de la categoria

Listado completo de componentes incluidos en este grupo.

button

input

textarea

select

checkbox

radio-group

switch

slider

input-otp

toggle

toggle-group

form

label

entity-link

Botones

Variantes, tamaños, con icono y estados disabled / loading

Variantes

Tamaños e icono

Estados

Inputs basicos

input, textarea, label y estados

Nombre

Deshabilitado

Con error

Formato incorrecto.

Notas

Select, checkbox, switch y radio-group

Notificar por correo

Activo

Semanal

Mensual

Slider, toggle y toggle-group

Intensidad: 55%

Input OTP y Form (react-hook-form)

Codigo de 4 digitos

[data-input-otp] { --nojs-bg: white !important; --nojs-fg: black !important; background-color: var(--nojs-bg) !important; color: var(--nojs-fg) !important; caret-color: var(--nojs-fg) !important; letter-spacing: .25em !important; text-align: center !important; border: 1px solid var(--nojs-fg) !important; border-radius: 4px !important; width: 100% !important; } @media (prefers-color-scheme: dark) { [data-input-otp] { --nojs-bg: black !important; --nojs-fg: white !important; } }

EntityLink

Referencia inline navegable a otra entidad, con variante deshabilitada.

Reporta a en el departamento .

Sucursal principal: Sin sucursal asignada (variante disabled).