pantoken / visual-debug

visual-debug ​

Beta

@pantoken/plugin-visual-debug — el CSS para la propiedad withVisualDebug de InstUI.

Los primitivos de diseño de InstUI (View, Flex, Grid, List, …) aceptan withVisualDebug para delinear el cuadro y sus hijos mientras se depura un diseño. Este plugin emite un único modificador con prefijo guion, -with-visual-debug, que funciona en cualquier elemento (compuesto con cualquier base, p. ej. .instui-view -with-visual-debug). El color del contorno es una propiedad personalizada --pantoken-visual-debug-color (predeterminada: un magenta brillante), por lo que es fácil volver a teñirlo.

Ejemplo ​

ts
import { toCss } from "@pantoken/css";
import { byTheme } from "@pantoken/tokens";
import { visualDebug } from "@pantoken/plugin-visual-debug";

const css = toCss(byTheme("rebrand"), { plugins: [visualDebug()] });
// <div class="instui-view -with-visual-debug">…</div>

Interfaces ​

Variables ​

Funciones ​

Referencias ​

default ​

Renombra y vuelve a exportar visualDebug