useLayout

useLayout() es el composable de control principal para los paneles relacionados con el layout.

Expone estado y acciones para:

• modo flex vs grid
• tamaño de ancho/alto
• relleno
• alineación
• edición de pistas de plantilla de cuadrícula

Uso

import { useLayout } from '@open-pencil/vue'

const layout = useLayout()

Ejemplo básico

const {
  isGrid,
  isFlex,
  widthSizing,
  heightSizing,
  setWidthSizing,
  setHeightSizing,
} = useLayout()

Ejemplos prácticos

Alternar entre relleno uniforme e individual

layout.toggleIndividualPadding()

Actualizar pistas de cuadrícula

layout.updateGridTrack('gridTemplateColumns', 0, { sizing: 'FIXED', value: 240 })
layout.addTrack('gridTemplateRows')

Cambiar la alineación

layout.setAlignment('CENTER', 'MAX')

APIs relacionadas

• usePosition
• useEditor