---
title: Composants
description: Référence des composants sans styles de @open-pencil/vue.
---

# Composants

`@open-pencil/vue` fournit des composants sans styles pour la zone de travail, la navigation, les panneaux de propriétés et les champs spécialisés.

## Zone de travail

- [CanvasRoot](./canvas-root) — contexte de la zone de travail.
- [CanvasSurface](./canvas-surface) — surface de rendu.

## Navigation

- [PageListRoot](./page-list-root) — pages et actions.
- [LayerTreeRoot](./layer-tree-root) — arbre des calques.
- [LayerTreeItem](./layer-tree-item) — ligne de l’arbre.
- [ToolbarRoot](./toolbar-root) — état et actions de la barre d’outils.
- [ToolbarItem](./toolbar-item) — outil individuel.

## Panneaux de propriétés

- [PropertyListRoot](./property-list-root) — liste contrôlée de propriétés.
- [PropertyListItem](./property-list-item) — remplissage, contour ou effet.
- [PositionControlsRoot](./position-controls-root) — position, taille et transformation.
- [LayoutControlsRoot](./layout-controls-root) — disposition automatique.
- [AppearanceControlsRoot](./appearance-controls-root) — opacité, visibilité et angles.
- [TypographyControlsRoot](./typography-controls-root) — police, alignement et mise en forme.

## Couleur, dégradés et polices

- [ColorInputRoot](./color-input-root) — champ de couleur.
- [ColorPickerRoot](./color-picker-root) — sélecteur de couleur.
- [GradientEditorRoot](./gradient-editor-root) — édition des dégradés.
- [GradientEditorBar](./gradient-editor-bar) — barre de dégradé.
- [GradientEditorStop](./gradient-editor-stop) — point de dégradé.
- [FontPickerRoot](./font-picker-root) — sélecteur de polices.