Skip to content

pantoken / visual-debug

visual-debug

Beta

@pantoken/plugin-visual-debug — CSS untuk properti withVisualDebug InstUI.

Primitif tata letak InstUI (View, Flex, Grid, List, …) menerima withVisualDebug untuk memberi garis luar pada kotak dan anak-anaknya saat men-debug tata letak. Plugin ini mengeluarkan satu modifier berawalan strip, -with-visual-debug, yang bekerja pada elemen mana pun (dapat dikombinasikan dengan basis apa pun, mis. .instui-view -with-visual-debug). Warna garis luar adalah properti kustom --pantoken-visual-debug-color (default adalah magenta cerah) sehingga mudah untuk diwarnai ulang.

Contoh

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>

Antarmuka

Variabel

Fungsi

Referensi

default

Mengganti nama dan mengekspor ulang visualDebug