Resumen
ImportaShortcut y formatShortcut desde twenty-ui/primitives/typography. Ambos comparten el mismo modelo, símbolos y separadores. Registra atajos en tu aplicación. Shortcut solo da formato a la indicación; no registra acciones del teclado. Los atributos nativos, controladores de eventos, estilos, nombres de clase y refs se dirigen a su span externo. ShortcutProps y ShortcutFormatOptions son tipos públicos.
”Uso”
Combinaciones y secuencias
['Mod', 'K'] significa pulsar Mod y K a la vez. Una matriz anidada es una secuencia ordenada: [['G'], ['P']] significa pulsar G y luego P. Cada matriz anidada es una combinación, por lo que [['Mod', 'K'], ['Mod', 'C']] significa pulsar Mod y K, y luego Mod y C. Usa una matriz de un elemento para una sola tecla. Ambas formas de matriz pueden ser de solo lectura.
Mod y CommandOrControl muestran Command en macOS e iOS, y Control en otros sistemas. Las teclas explícitas Command, Control, Alt y Enter también tienen etiquetas de visualización. Las demás cadenas se muestran tal como se proporcionan. La detección de dispositivos es segura sin globales del navegador; platform puede sustituirla opcionalmente por mac u other.
Usa sequenceJoinLabel para texto de unión localizado. combinationSeparator puede conservar una convención del host, como +. El separador de texto predeterminado está vacío en los dispositivos Apple y es un espacio en otros sistemas. variant selecciona keys, text o button. visibility="desktop" oculta la indicación en anchos de ventana móvil, mientras que always permanece visible.
Los símbolos de teclas tienen nombres accesibles legibles. Use accessibleKeyLabels para localizar los nombres de teclas individuales en la salida del lector de pantalla. Proporcione aria-label o aria-labelledby para un nombre localizado de todo el atajo, o aria-hidden para una indicación decorativa. Los botones conservan los nombres de sus acciones y ocultan sus indicaciones decorativas en dispositivos móviles. Las filas de menú y lista mantienen visibles sus indicaciones.
Apariencia
Usakeys para teclas individuales, text para una indicación en línea o button para la indicación compacta dentro de una acción. Estas variantes solo cambian la presentación.
Migración
Las matrices planas almacenadas que representan pulsaciones de teclas sucesivas deben anidarse antes de pasarlas a
shortcut: hotKeys.map((key) => [key]). Las matrices que representan teclas simultáneas se pueden pasar directamente. Las cadenas de teclas siguen siendo tokens literales, por lo que ['Mod', '+'] contiene una tecla de signo más y ['Space'] contiene la tecla Espacio; no se requiere analizar cadenas de atajos.
”Props”
Readonly<Record<string, string>>
Optional localized names for individual keys in screen reader output.
string
Optional separator between simultaneous keys. Defaults to no separator on Apple devices and a space elsewhere.
"mac" | "other"
Optional mac or other platform override. Defaults to server-safe device detection.
string
Text between sequence steps. Defaults to then.
ShortcutDefinition
requerido
Flat key array for a simultaneous combination, or nested key arrays for an ordered sequence of combinations.
"button" | "keys" | "text"
predeterminado:"keys"
Keycaps, inline text, or a separated button hint.
"always" | "desktop"
predeterminado:"always"
Always visible by default. Desktop hints hide on mobile viewports.