הוקים ו-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.
| אפשרות | תיאור |
|---|---|
isActive | false משבית את המטפל בלי להסיר את הרכיב מהעץ (ברירת מחדל 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()