Herramientas de extensiones / TSDocs
Módulo ui
Componentes (ui.*), acciones (act.*), expresiones (expr.*) y su vocabulario.
Generado automáticamente de los .d.ts del SDK con npm run docs:tsdocs.
215 símbolos
Acciones (34)
- SetStateActionInterfaz · uiGuarda value en state[key] (la clave admite ruta con puntos).
- MergeStateActionInterfaz · uiMezcla un objeto en state[key].
- MapArrayActionInterfaz · uiTransforma state[source] con template (usa item).
- FilterArrayActionInterfaz · uiFiltra state[source] con condition (usa item).
- SetLoadingActionInterfaz · uiMarca una clave como cargando (state.$loading).
- OpenOverlayActionInterfaz · uiAbre un OVERLAY del manifest.
- CloseOverlayActionInterfaz · uiCierra el overlay actual.
- OpenUrlActionInterfaz · uiAbre una URL http(s)/mailto/tel en pestana nueva.
- NavigateActionInterfaz · uiNavega a una ruta INTERNA de la app (empieza por /).
- RefreshActionInterfaz · uiRefresca los datos de la pagina.
- DelayActionInterfaz · uiEspera ms (max 10000).
- ConfirmActionInterfaz · uiPide confirmacion y encadena onConfirm/onCancel.
- CallBackendActionInterfaz · uiLlama a una funcion del server.js. Pone state.$loading[key]/state.$error[key] solos, admite reintento y guarda el resultado con resultKey.
- CallApiActionInterfaz · uiLlama a una ruta del propio origen (/api/...).
- ToastActionInterfaz · uiMuestra un aviso breve.
- CopyToClipboardActionInterfaz · uiCopia texto.
- InsertContentActionInterfaz · uiInserta HTML/texto en el editor del composer.
- AppendBodyActionInterfaz · uiAnade contenido al final del cuerpo.
- SetSubjectActionInterfaz · uiFija el asunto del correo.
- AddAttachmentActionInterfaz · uiAdjunta un archivo (url o contentBase64).
- SetContextValueActionInterfaz · uiLlama a un setter del contexto (p. ej. setLocation).
- NextStepActionInterfaz · uiAvanza el WIZARD que contiene al componente.
- PrevStepActionInterfaz · uiRetrocede el WIZARD.
- SecureSaveActionInterfaz · uiGuarda un dato cifrado en el navegador del usuario.
- SecureReadActionInterfaz · uiLee un dato cifrado local a state[targetState].
- OauthConnectActionInterfaz · uiInicia la conexion OAuth de un proveedor.
- OauthDisconnectActionInterfaz · uiDesconecta el proveedor.
- UiActionTipo · uiCualquier accion del catalogo (union discriminada por action).
- UiActionTypeTipo · uiNombre de una accion.
- UiActionInputTipo · uiUna accion, una lista (se ejecutan en orden) o { actions: [...] }.
- ActionHelpersInterfaz · ui
- actConstante · uiHelpers de acciones: act.callBackend('miFuncion', { a: 1 }, { onSuccess: act.toast('Listo') }).
- actionsConstante · uiAlias de act.
- ACTION_TYPESConstante · uiNombres de todas las acciones del catalogo.
Expresiones (4)
- ExprTipo · uiExpresion ${...} evaluada en el navegador (ver _shared/expressions.ts). Cualquier texto que la contenga es valido donde el schema admite un numero, booleano, enum o arreglo: tone: "${state.ok ? 'su
- I18nTextTipo · uiTexto por idioma: { es: "Guardar", en: "Save" } en lugar de un string. El renderer usa el idioma del usuario y cae a en, luego es, luego el primero. Vale en cualquier prop de texto (label, content,
- ExprHelpersInterfaz · ui
- exprConstante · uiConstructores de expresiones ${...}.
Componentes (157)
- CommonPropsInterfaz · uiProps que admite CUALQUIER componente.
- StackPropsInterfaz · uiApila hijos en vertical con un espacio de la escala. Categoria: layout.
- StackNodeInterfaz · uiNodo STACK: { type, props, children }.
- RowPropsInterfaz · uiColoca hijos en horizontal. Categoria: layout.
- RowNodeInterfaz · uiNodo ROW: { type, props, children }.
- GridPropsInterfaz · uiRejilla de columnas iguales; en movil se reduce sola. Categoria: layout.
- GridNodeInterfaz · uiNodo GRID: { type, props, children }.
- CardPropsInterfaz · uiTarjeta con titulo opcional. Hereda radio y paleta del tema. Categoria: layout.
- CardNodeInterfaz · uiNodo CARD: { type, props, children }.
- SectionPropsInterfaz · uiSeccion con encabezado; puede plegarse. Categoria: layout.
- SectionNodeInterfaz · uiNodo SECTION: { type, props, children }.
- PageHeaderPropsInterfaz · uiCabecera de una pagina completa: migas de pan, titulo (h1), estado, descripcion y acciones; muestra su propio estado de carga y error con Reintentar. Categoria: layout.
- PageHeaderNodeInterfaz · uiNodo PAGE_HEADER: { type, props, children }.
- SplitPanePropsInterfaz · uiDos paneles (p. ej. lista y detalle): lado a lado en escritorio y apilados en pantallas estrechas. Redimensionable con raton o teclado si resizable. Categoria: layout.
- SplitPaneNodeInterfaz · uiNodo SPLIT_PANE: { type, props, children }.
- DividerPropsInterfaz · uiLinea separadora, con etiqueta opcional. Categoria: layout.
- DividerNodeInterfaz · uiNodo DIVIDER: { type, props, children }.
- SpacerPropsInterfaz · uiEspacio vacio de la escala. Categoria: layout.
- SpacerNodeInterfaz · uiNodo SPACER: { type, props, children }.
- TextPropsInterfaz · uiParrafo de texto plano (nunca HTML). Categoria: typography.
- TextNodeInterfaz · uiNodo TEXT: { type, props, children }.
- HeadingPropsInterfaz · uiEncabezado semantico (h1-h6). Categoria: typography.
- HeadingNodeInterfaz · uiNodo HEADING: { type, props, children }.
- CodePropsInterfaz · uiCodigo en linea o bloque, con boton de copiar opcional. Categoria: typography.
- CodeNodeInterfaz · uiNodo CODE: { type, props, children }.
- LinkPropsInterfaz · uiEnlace seguro (solo http, https, mailto, tel o ruta interna). Categoria: typography.
- LinkNodeInterfaz · uiNodo LINK: { type, props, children }.
- MarkdownPropsInterfaz · uiMarkdown seguro (negrita, cursiva, codigo, listas, enlaces). El HTML crudo se muestra como texto. Categoria: typography.
- MarkdownNodeInterfaz · uiNodo MARKDOWN: { type, props, children }.
- IconPropsInterfaz · uiIcono decorativo: Lucide, "brand:<slug>" (logotipo de una app integrada) o "initials:<XY>". Categoria: typography.
- IconNodeInterfaz · uiNodo ICON: { type, props, children }.
- ButtonPropsInterfaz · uiBoton. Color segun tone + variant; contraste garantizado por el tema. Categoria: action.
- ButtonNodeInterfaz · uiNodo BUTTON: { type, props, children }.
- IconButtonPropsInterfaz · uiBoton solo con icono; label es obligatorio (nombre accesible y tooltip). Categoria: action.
- IconButtonNodeInterfaz · uiNodo ICON_BUTTON: { type, props, children }.
- ButtonGroupPropsInterfaz · uiAgrupa botones; attached los une. Categoria: action.
- ButtonGroupNodeInterfaz · uiNodo BUTTON_GROUP: { type, props, children }.
- MenuPropsInterfaz · uiBoton que abre un menu de acciones (teclado: flechas, Enter, Escape). Categoria: action.
- MenuNodeInterfaz · uiNodo MENU: { type, props, children }.
- ImageButtonPropsInterfaz · uiImagen pulsable (https). Categoria: action.
- ImageButtonNodeInterfaz · uiNodo IMAGE_BUTTON: { type, props, children }.
- SmartReplyChipsPropsInterfaz · uiFila de sugerencias de respuesta pulsables. Categoria: action.
- SmartReplyChipsNodeInterfaz · uiNodo SMART_REPLY_CHIPS: { type, props, children }.
- InputPropsInterfaz · uiCampo de texto de una linea. Categoria: input.
- InputNodeInterfaz · uiNodo INPUT: { type, props, children }.
- TextareaPropsInterfaz · uiTexto de varias lineas. Categoria: input.
- TextareaNodeInterfaz · uiNodo TEXTAREA: { type, props, children }.
- SelectPropsInterfaz · uiLista desplegable nativa. Categoria: input.
- SelectNodeInterfaz · uiNodo SELECT: { type, props, children }.
- CheckboxPropsInterfaz · uiCasilla de verificacion. Categoria: input.
- CheckboxNodeInterfaz · uiNodo CHECKBOX: { type, props, children }.
- RadioGroupPropsInterfaz · uiGrupo de opciones excluyentes (flechas para moverse). Categoria: input.
- RadioGroupNodeInterfaz · uiNodo RADIO_GROUP: { type, props, children }.
- TogglePropsInterfaz · uiInterruptor (switch) on/off. Categoria: input.
- ToggleNodeInterfaz · uiNodo TOGGLE: { type, props, children }.
- SliderPropsInterfaz · uiControl deslizante numerico. Categoria: input.
- SliderNodeInterfaz · uiNodo SLIDER: { type, props, children }.
- DatePickerPropsInterfaz · uiFecha (valor AAAA-MM-DD). Categoria: input.
- DatePickerNodeInterfaz · uiNodo DATE_PICKER: { type, props, children }.
- TimePickerPropsInterfaz · uiHora (valor HH:MM). Categoria: input.
- TimePickerNodeInterfaz · uiNodo TIME_PICKER: { type, props, children }.
- ColorPickerPropsInterfaz · uiSelector de color SOLO para datos del usuario (etiquetas, agendas). El valor es un hex en state; nunca estiliza la interfaz. Categoria: input.
- ColorPickerNodeInterfaz · uiNodo COLOR_PICKER: { type, props, children }.
- FileInputPropsInterfaz · uiSeleccion de archivos con limite de tamano; puede leerlos como base64/texto. Categoria: input.
- FileInputNodeInterfaz · uiNodo FILE_INPUT: { type, props, children }.
- TagInputPropsInterfaz · uiLista de etiquetas/valores (Enter o coma anade, Retroceso quita). Categoria: input.
- TagInputNodeInterfaz · uiNodo TAG_INPUT: { type, props, children }.
- ContactPickerPropsInterfaz · uiSelector de contactos de la libreta (correos). El valor es un arreglo de correos. Categoria: input.
- ContactPickerNodeInterfaz · uiNodo CONTACT_PICKER: { type, props, children }.
- FormPropsInterfaz · uiFormulario con validacion declarativa y estados (cargando/error/exito) automaticos. Categoria: input.
- FormNodeInterfaz · uiNodo FORM: { type, props, children }.
- TablePropsInterfaz · uiTabla con orden, paginacion y seleccion. Categoria: data.
- TableNodeInterfaz · uiNodo TABLE: { type, props, children }.
- ListPropsInterfaz · uiLista de elementos: con itemTemplate + items (una plantilla por dato) o con hijos LIST_ITEM. Categoria: data.
- ListNodeInterfaz · uiNodo LIST: { type, props, children }.
- ListItemPropsInterfaz · uiElemento de lista con titulo, descripcion, icono y acciones finales (hijos). Categoria: data.
- ListItemNodeInterfaz · uiNodo LIST_ITEM: { type, props, children }.
- TimelinePropsInterfaz · uiLinea de tiempo vertical de eventos (fecha, titulo, descripcion, icono y tono). Categoria: data.
- TimelineNodeInterfaz · uiNodo TIMELINE: { type, props, children }.
- TreePropsInterfaz · uiArbol navegable accesible (WAI-ARIA tree: flechas, Inicio/Fin, Intro). Nodos {id, label, icon?, badge?, children?}. Categoria: data.
- TreeNodeInterfaz · uiNodo TREE: { type, props, children }.
- TabsPropsInterfaz · uiPestanas accesibles (flechas, Inicio/Fin). Categoria: navigation.
- TabsNodeInterfaz · uiNodo TABS: { type, props, children }.
- TabItemPropsInterfaz · uiPanel de TABS (forma heredada con hijos). Categoria: navigation.
- TabItemNodeInterfaz · uiNodo TAB_ITEM: { type, props, children }.
- AccordionPropsInterfaz · uiSecciones plegables (Enter/Espacio). Categoria: navigation.
- AccordionNodeInterfaz · uiNodo ACCORDION: { type, props, children }.
- AccordionItemPropsInterfaz · uiSeccion de ACCORDION (forma heredada con hijos). Categoria: navigation.
- AccordionItemNodeInterfaz · uiNodo ACCORDION_ITEM: { type, props, children }.
- StepperPropsInterfaz · uiIndicador de los pasos de un proceso (completado, actual, pendiente, error). Solo informa; para mostrar contenido por pasos usa WIZARD. Categoria: navigation.
- StepperNodeInterfaz · uiNodo STEPPER: { type, props, children }.
- WizardPropsInterfaz · uiAsistente por pasos con indicador de progreso. Categoria: navigation.
- WizardNodeInterfaz · uiNodo WIZARD: { type, props, children }.
- BadgePropsInterfaz · uiEtiqueta corta de estado. Categoria: feedback.
- BadgeNodeInterfaz · uiNodo BADGE: { type, props, children }.
- ChipPropsInterfaz · uiChip (filtro/valor) opcionalmente pulsable o eliminable. Categoria: feedback.
- ChipNodeInterfaz · uiNodo CHIP: { type, props, children }.
- AvatarPropsInterfaz · uiAvatar con imagen (https) o iniciales. Categoria: feedback.
- AvatarNodeInterfaz · uiNodo AVATAR: { type, props, children }.
- StatPropsInterfaz · uiMetrica destacada con variacion. Categoria: feedback.
- StatNodeInterfaz · uiNodo STAT: { type, props, children }.
- ProgressPropsInterfaz · uiBarra de progreso (role=progressbar). Categoria: feedback.
- ProgressNodeInterfaz · uiNodo PROGRESS: { type, props, children }.
- KpiCardPropsInterfaz · uiIndicador clave (KPI): valor destacado, variacion, mini-tendencia, estado de carga y error. Pulsable con onClick. Categoria: data.
- KpiCardNodeInterfaz · uiNodo KPI_CARD: { type, props, children }.
- SkeletonPropsInterfaz · uiMarcador de carga. Categoria: feedback.
- SkeletonNodeInterfaz · uiNodo SKELETON: { type, props, children }.
- EmptyPropsInterfaz · uiEstado vacio con mensaje y accion. Categoria: feedback.
- EmptyNodeInterfaz · uiNodo EMPTY: { type, props, children }.
- AlertPropsInterfaz · uiAviso en linea (role=alert para danger/warning). Categoria: feedback.
- AlertNodeInterfaz · uiNodo ALERT: { type, props, children }.
- CalloutPropsInterfaz · uiNota destacada (consejo, advertencia) con hijos. Categoria: feedback.
- CalloutNodeInterfaz · uiNodo CALLOUT: { type, props, children }.
- LoadingPropsInterfaz · uiIndicador de carga. Categoria: feedback.
- LoadingNodeInterfaz · uiNodo LOADING: { type, props, children }.
- ModalPropsInterfaz · uiMarco de un OVERLAY (titulo + contenido). Con open/bind se comporta como dialogo propio accesible. Categoria: overlay.
- ModalNodeInterfaz · uiNodo MODAL: { type, props, children }.
- DrawerPropsInterfaz · uiPanel lateral accesible. Categoria: overlay.
- DrawerNodeInterfaz · uiNodo DRAWER: { type, props, children }.
- PopoverPropsInterfaz · uiContenido flotante anclado a un disparador. Categoria: overlay.
- PopoverNodeInterfaz · uiNodo POPOVER: { type, props, children }.
- TooltipPropsInterfaz · uiAyuda al pasar el raton o enfocar (Escape cierra). Categoria: overlay.
- TooltipNodeInterfaz · uiNodo TOOLTIP: { type, props, children }.
- BarChartPropsInterfaz · uiBarras simples en SVG propio con colores de tema. Categoria: chart.
- BarChartNodeInterfaz · uiNodo BAR_CHART: { type, props, children }.
- ChartPropsInterfaz · uiGrafico de lineas, barras, area, sectores o anillo con varias series, leyenda y tooltips accesibles (raton y teclado). SVG propio con colores del tema, sin librerias. Categoria: chart.
- ChartNodeInterfaz · uiNodo CHART: { type, props, children }.
- SparklinePropsInterfaz · uiLinea de tendencia minima. Categoria: chart.
- SparklineNodeInterfaz · uiNodo SPARKLINE: { type, props, children }.
- DonutPropsInterfaz · uiAnillo de proporciones con leyenda. Categoria: chart.
- DonutNodeInterfaz · uiNodo DONUT: { type, props, children }.
- ConditionalPropsInterfaz · uiMuestra true o false segun condition. Categoria: logic.
- ConditionalNodeInterfaz · uiNodo CONDITIONAL: { type, props, children }.
- ConditionPropsInterfaz · uiComo CONDITIONAL con if y else. Categoria: logic.
- ConditionNodeInterfaz · uiNodo CONDITION: { type, props, children }.
- ForEachPropsInterfaz · uiRepite template por cada elemento de items. Categoria: logic.
- ForEachNodeInterfaz · uiNodo FOR_EACH: { type, props, children }.
- RepeatPropsInterfaz · uiRepite los hijos N veces o por item. Categoria: logic.
- RepeatNodeInterfaz · uiNodo REPEAT: { type, props, children }.
- SwitchPropsInterfaz · uiElige un caso segun value (forma cases o hijos CASE/DEFAULT). Categoria: logic.
- SwitchNodeInterfaz · uiNodo SWITCH: { type, props, children }.
- CasePropsInterfaz · uiCaso de SWITCH (forma con hijos). Categoria: logic.
- CaseNodeInterfaz · uiNodo CASE: { type, props, children }.
- DefaultPropsInterfaz · uiCaso por defecto de SWITCH. Categoria: logic.
- DefaultNodeInterfaz · uiNodo DEFAULT: { type, props, children }.
- SetVarPropsInterfaz · uiFija una variable de state (no visible). Categoria: logic.
- SetVarNodeInterfaz · uiNodo SET_VAR: { type, props, children }.
- HeadlessPropsInterfaz · uiSin interfaz: solo ejecuta onLoad. Categoria: logic.
- HeadlessNodeInterfaz · uiNodo HEADLESS: { type, props, children }.
- DebugPropsInterfaz · uiSolo desarrollo: muestra contexto y estado. Categoria: logic.
- DebugNodeInterfaz · uiNodo DEBUG: { type, props, children }.
- UiNodeTipo · uiCualquier componente del catalogo (union discriminada por type).
- UiComponentTypeTipo · uiNombre de un componente.
- UiNodeOfTipo · uiNodo concreto por nombre: UiNodeOf<"BUTTON">.
- UiHelpersInterfaz · ui
- uiConstante · uiHelpers de componentes: ui.stack({ gap: 3 }, ui.text('Hola'), ui.button({ label: 'Ok' })).
- COMPONENT_TYPESConstante · uiNombres de todos los componentes del catalogo.
Formas reutilizadas (6)
- ElementoDeMenuShapeInterfaz · uiElemento de menu
- ComoSePresentaLaAccionEnLasBarrasShapeInterfaz · uiComo se presenta la accion en las barras.
- ReglasDeValidacionDeclarativasShapeInterfaz · uiReglas de validacion declarativas.
- OpcionShapeInterfaz · uiOpcion
- DatoShapeInterfaz · uiDato
- ReintentoDeclarativoShapeInterfaz · uiReintento declarativo.
Vocabulario semántico (14)
- ToneTipo · ui
- SizeTipo · ui
- SizeXlTipo · ui
- AlignTipo · ui
- JustifyTipo · ui
- TextAlignTipo · ui
- GapTipo · ui
- ButtonVariantTipo · ui
- SurfaceVariantTipo · ui
- DensityTipo · ui
- WidthTipo · ui
- TextSizeTipo · ui
- WeightTipo · ui
- UiChildTipo · uiLo que aceptan los helpers como hijo: nodos, arreglos de nodos y valores vacios (null/undefined/false se descartan).