# UI Descripción general

- Human documentation: [https://docs.univer.ai/es-ES/guides/bases/ui/overview](https://docs.univer.ai/es-ES/guides/bases/ui/overview)

- Agent Markdown: [https://docs.univer.ai/es-ES/guides/bases/ui/overview.md](https://docs.univer.ai/es-ES/guides/bases/ui/overview.md)

- Requested language: `es-ES`

- Content language: `es-ES`

- Documentation version: `1.2.0`

- Source: [bases/ui/overview.es-ES.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/bases/ui/overview.es-ES.mdx)

---

`@univerjs-pro/bases-ui` proporciona el área de trabajo con licencia para Univer Bases en el navegador. Renderiza la navegación de tablas y vistas, las vistas de cuadrícula, kanban, calendario, Gantt y galería, además de editores de campos, detalles de registros, menús y selección.

## Registrar el área de trabajo

Registre la licencia y los motores de fórmulas antes de los plugins de Bases. Los campos de fórmula usan `@univerjs-pro/engine-formula`; no requieren una aplicación de Sheets.

```ts
univer.registerPlugin(UniverLicensePlugin, {
  license: process.env.CLIENT_LICENSE_TEXT,
})

univer.registerPlugin(UniverProFormulaEnginePlugin)
univer.registerPlugin(UniverRenderEnginePlugin)
univer.registerPlugin(UniverUIPlugin, { container: 'app' })
univer.registerPlugin(UniverBasesPlugin)
univer.registerPlugin(UniverBasesUIPlugin)
```

Consulte [Instalación y uso básico](https://docs.univer.ai/es-ES/guides/bases/getting-started/installation.md) para ver las importaciones, estilos e idiomas.

## Configurar el diseño inicial

`IUniverBaseUIConfig` controla las regiones del área de trabajo y la primera tabla y vista que se muestran.

```ts
univer.registerPlugin(UniverBasesUIPlugin, {
  workbench: {
    header: true,
    headerMenu: true,
    content: true,
    leftSidebar: true,
    rightSidebar: false,
    rightPanelMode: 'dock',
  },
  initialState: {
    tableId: 'tasks',
    viewId: 'kanban',
  },
})
```

Use `disableEdit` para un área de trabajo de solo lectura. Configure `attachment`, `personOptions` o `groupOptions` únicamente cuando los campos correspondientes necesiten datos de la aplicación host.