Skip to content

pantoken-root / visual-debug

visual-debug ​

Bêta

@pantoken/plugin-visual-debug — le CSS pour la prop withVisualDebug d'InstUI.

Les primitives de mise en page d'InstUI (View, Flex, Grid, List, …) acceptent withVisualDebug pour délimiter la boîte et ses enfants lors du débogage d'une mise en page. Ce plugin émet un seul modificateur préfixé d'un tiret, -with-visual-debug, qui fonctionne sur n'importe quel élément (composé avec n'importe quelle base, p.ex. .instui-view -with-visual-debug). La couleur du contour est une propriété personnalisée --pantoken-visual-debug-color (par défaut un magenta vif) afin qu'il soit facile de la retinter.

Exemple ​

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 ​

Fonctions ​

Références ​

default ​

Renomme et ré-exporte visualDebug