UNPKG

@primer/react

Version:

An implementation of GitHub's Primer Design System using React

114 lines (113 loc) 3.6 kB
//#region src/KeybindingHint/key-names.ts /** Converts the first character of the string to upper case and the remaining to lower case. */ const capitalize = ([first, ...rest]) => { var _first$toUpperCase; return ((_first$toUpperCase = first === null || first === void 0 ? void 0 : first.toUpperCase()) !== null && _first$toUpperCase !== void 0 ? _first$toUpperCase : "") + rest.join("").toLowerCase(); }; /** * Short-form iconic versions of keys. These should be intuitive (not archaic) and match icons on keyboards. */ const condensedKeyName = (key, platform) => { var _alt$control$shift$me; return (_alt$control$shift$me = { alt: platform === "apple" ? "⌥" : "Alt", control: "⌃", shift: "⇧", meta: platform === "apple" ? "⌘" : platform === "windows" ? "Win" : "Meta", mod: platform === "apple" ? "⌘" : "⌃", pageup: "PgUp", pagedown: "PgDn", arrowup: "↑", arrowdown: "↓", arrowleft: "←", arrowright: "→", plus: "+", backspace: "⌫", delete: "Del", space: "␣", tab: "⇥", enter: "⏎", escape: "Esc", function: "Fn", capslock: "CapsLock", insert: "Ins", printscreen: "PrtScn" }[key]) !== null && _alt$control$shift$me !== void 0 ? _alt$control$shift$me : capitalize(key); }; /** * Specific key displays for 'full' format. We still do show some icons (ie punctuation) * because that's more intuitive, but for the rest of keys we show the standard key name. */ const fullKeyName = (key, platform) => { var _alt$meta$mod$$pageu; return (_alt$meta$mod$$pageu = { alt: platform === "apple" ? "Option" : "Alt", meta: platform === "apple" ? "Command" : platform === "windows" ? "Windows" : "Meta", mod: platform === "apple" ? "Command" : "Control", "+": "Plus", pageup: "Page Up", pagedown: "Page Down", arrowup: "Up Arrow", arrowdown: "Down Arrow", arrowleft: "Left Arrow", arrowright: "Right Arrow", capslock: "Caps Lock", printscreen: "Print Screen" }[key]) !== null && _alt$meta$mod$$pageu !== void 0 ? _alt$meta$mod$$pageu : capitalize(key); }; /** * Accessible key names intended to be read by a screen reader. This prevents screen * readers from expressing punctuation in speech, ie, reading a long pause instead of the * word "period". */ const accessibleKeyName = (key, platform) => { var _alt$meta$mod$pageup$; return (_alt$meta$mod$pageup$ = { alt: platform === "apple" ? "option" : "alt", meta: platform === "apple" ? "command" : platform === "windows" ? "Windows" : "meta", mod: platform === "apple" ? "command" : "control", pageup: "page up", pagedown: "page down", arrowup: "up arrow", arrowdown: "down arrow", arrowleft: "left arrow", arrowright: "right arrow", capslock: "caps lock", printscreen: "print screen", "`": "backtick", "~": "tilde", "!": "exclamation point", "@": "at", "#": "hash", $: "dollar sign", "%": "percent", "^": "caret", "&": "ampersand", "*": "asterisk", "(": "left parenthesis", ")": "right parenthesis", _: "underscore", "-": "dash", "+": "plus", "=": "equals", "[": "left bracket", "{": "left curly brace", "]": "right bracket", "}": "right curly brace", "\\": "backslash", "|": "pipe", ";": "semicolon", ":": "colon", "'": "single quote", "\"": "double quote", ",": "comma", "<": "left angle bracket", ".": "period", ">": "right angle bracket", "/": "forward slash", "?": "question mark", " ": "space" }[key]) !== null && _alt$meta$mod$pageup$ !== void 0 ? _alt$meta$mod$pageup$ : key.toLowerCase(); }; //#endregion export { accessibleKeyName, condensedKeyName, fullKeyName };