הוקים ו-REPL במסוף

⁦useInput⁩, ⁦useFocus⁩, ⁦useViewport⁩, ⁦useConsoleStats⁩ ו-window.text.

הוקים מחברים רכיבים לקלט, למיקוד ולאזור התצוגה.

useInput

useInput((e) => {  if (e.key === "up") setIndex((i) => i - 1);  if (e.ctrl && e.key === "p") setPaletteOpen(true);});
שדהתיאור
key"up" "return" "escape" "tab"…
inputהטקסט שהמקש מפיק
ctrl meta shift altמקשי צירוף
stopPropagation()עצירת מטפלים בעדיפות נמוכה יותר

קיצורי מקשים של הדפדפן כמו ⌘⌥J ו-⌘R תמיד עוברים ללא חסימה.

usePaste ו-useWheel מקבלים את אותן אפשרויות. ל-ambient אין השפעה על useWheel.

אפשרותתיאור
isActivefalse משבית את המטפל בלי להסיר את הרכיב מהעץ (ברירת מחדל true)
priorityמטפלים בעדיפות גבוהה יותר רצים ראשונים (ברירת מחדל 0). רכיבים ממוקדים משתמשים ב-FOCUSED_INPUT_PRIORITY (10)
globalהמשך קבלת קלט בזמן ש-<Modal> מחוץ לרכיב הזה פתוח (ברירת מחדל false)
ambientאי-הכללת המטפל בספירה לצורך רמז המיקוד (ברירת מחדל false)

קיצור המקשים של ⁦Dev Overlay⁩ (F2 או Ctrl+`) מסומן כ-ambient, ולכן דף שאין בו קלט מקלדת אחר אינו מציג את הרמז.

useInput((e) => {  if (e.key === "f2") toggleOverlay();}, { ambient: true });

usePaste ו-useWheel

usePaste((e) => insert(e.text));useWheel((e) => scrollBy(e.rows));

useKeyState (ניסיוני)

@textjs/react/experimental מייצא את useKeyState למעקב אחר מקשים פיזיים המוחזקים לחוצים לפי KeyboardEvent.code ("KeyW", "ArrowUp", "ControlLeft"). תשאול של keys.isDown(code) או קריאת keys.pressed אינם מפעילים רינדור מחדש ב-React. יש להעביר פונקציית callback כדי להגיב ללחיצות ולשחרורים של מקשים בזמן התרחשותם.

import { useKeyState } from "@textjs/react/experimental";const keys = useKeyState((e) => {  if (e.code === "Space" && e.down) fire();});

מקשים המוחזקים לחוצים משתחררים אוטומטית כשהדף מאבד מיקוד. פרטים על ניהול הגרסאות של ייצואים ניסיוניים מופיעים בסעיף שינויים שוברי תאימות.

useViewport

const { cols, rows, focused, paused } = useViewport();

usePageFocus

usePageFocus() מחזיר אם הדף ממוקד. הקשות מקשים מגיעות לאפליקציה רק כשהדף ממוקד. זהו אותו ערך כמו useViewport().focused, אך הוא גורם לרינדור מחדש רק כשהמיקוד משתנה.

const focused = usePageFocus();

כשהדף אינו ממוקד ובאפליקציה יש מטפל useInput או usePaste, הוק useKeyState או יעד מיקוד שאפשר להגיע אליו באמצעות Tab, השורה האחרונה בפריים של המסוף הופכת לפס בצבע ענבר עם הכיתוב "יש ללחוץ על הדף כדי להשתמש במקלדת". מטפלים המסומנים כ-ambient אינם נספרים. הרמז אינו מופיע בטרמינל, בבדיקות או בתצוגות מראה מוטמעות. בכל פעם שהרמז מופיע, הוא מהבהב במשך כ-6 שניות, אלא אם הגדרת צמצום התנועה של המערכת מופעלת. כדי לקבוע מתי הוא יוצג, יש להגדיר focusHint: false בתוך text.config.ts או ב-createConsoleRoot ולרנדר את <FocusHint>:

<FocusHint active={editing} />

useConsoleStats

const { totalMs, spanCount } = useConsoleStats({ interval: 250 });

useApp

const { exit, pause, resume } = useApp();

ה-REPL של window.text

כל אפליקציה מוסיפה פונקציות עזר ל-window.text. יש להקליד אותן בשורת הקלט של DevTools.

text.help()text.resize(120, 36)   // pin the grid sizetext.responsive(true)  // fit the docked console againtext.pause()text.stats()text.wireframe()text.copyText()
עריכת הדף ב-GitHub