pantoken / visual-debug

visual-debug ​

Beta

@pantoken/plugin-visual-debug — CSS-en for InstUI sin withVisualDebug-prop.

InstUI sine layout-primitivar (View, Flex, Grid, List, …) tek withVisualDebug for å markere boksen og hennar barn medan ein feilsøkjer eit layout. Denne pluginen gir ein enkelt bindestrek-prefiksert modifikator, -with-visual-debug, som fungerer på alle element (kombinert med kva for ei base som helst, t.d. .instui-view -with-visual-debug). Omrissfargen er ei --pantoken-visual-debug-color-eigenskap (standard: ein klar magenta) så det er lett å endre fargen.

Døme ​

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>

Grensesnitt ​

Variablar ​

Funksjonar ​

Referansar ​

default ​

Omdøyper og re-eksporterer visualDebug