pantoken / visual-debug

visual-debug ​

Bèta

@pantoken/plugin-visual-debug — de CSS voor InstUI's withVisualDebug eigenschap.

De layout-primitieven van InstUI (View, Flex, Grid, List, …) accepteren withVisualDebug om het vlak en zijn kinderen te omlijnen tijdens het debuggen van een layout. Deze plugin genereert één met een streepje voorafgegaan modifier, -with-visual-debug, die op elk element werkt (compound met elke basis, bijv. .instui-view -with-visual-debug). De outline-kleur is een --pantoken-visual-debug-color custom property (standaard een fel magenta) zodat het eenvoudig is om van kleur te veranderen.

Voorbeeld ​

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 ​

Variabelen ​

Functies ​

Referenties ​

default ​

Hernoemt en herexporteert visualDebug