mosaicstack/stack
25
0
Fork 1
Code Issues 341 Pull Requests 13 Actions Packages Projects Releases 15 Wiki Activity

format: apply repo prettier (3.8.1) to the folded skills tree

Browse Source 
963 markdown files reformatted with the repository's pinned prettier so
pnpm format:check covers the folded tree like every other repo file.

The formatter's embedded-language pass also normalized code fences
(TS semicolons, closed HTML tags in examples, lowercased CSS hex colors,
one renumbered list that skipped an index). Alphanumeric token deltas vs
the fold commit were audited file-by-file; all are formatter-equivalent
markup normalizations plus the four sanitized skills.
This commit is contained in:
fargo
2026-08-19 14:37:17 -05:00
parent d2eeb64433
commit 1a822493ba
962 changed files with 29594 additions and 27188 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/mosaic/framework/skills/vueuse-functions/references/useKeyModifier.md
+27 -27
View File
@@ -11,11 +11,11 @@ Reactive [Modifier State](https://developer.mozilla.org/en-US/docs/Web/API/Keybo
## Usage
```ts
import { useKeyModifier } from '@vueuse/core'
import { useKeyModifier } from '@vueuse/core';
const capsLockState = useKeyModifier('CapsLock')
const capsLockState = useKeyModifier('CapsLock');
console.log(capsLockState.value)
console.log(capsLockState.value);
```
## Events
@@ -23,17 +23,17 @@ console.log(capsLockState.value)
You can customize which events will prompt the state to update. By default, these are `mouseup`, `mousedown`, `keyup`, `keydown`. To customize these events:
```ts
import { useKeyModifier } from '@vueuse/core'
import { useKeyModifier } from '@vueuse/core';
const capsLockState = useKeyModifier('CapsLock', { events: ['mouseup', 'mousedown'] })
const capsLockState = useKeyModifier('CapsLock', { events: ['mouseup', 'mousedown'] });
console.log(capsLockState) // null
console.log(capsLockState); // null
// Caps Lock turned on with key press
console.log(capsLockState) // null
console.log(capsLockState); // null
// Mouse button clicked
console.log(capsLockState) // true
console.log(capsLockState); // true
```
## Initial State
@@ -41,47 +41,47 @@ console.log(capsLockState) // true
By default, the returned ref will be `Ref<null>` until the first event is received. You can explicitly pass the initial state to it via:
```ts
import { useKeyModifier } from '@vueuse/core'
import { useKeyModifier } from '@vueuse/core';
// ---cut---
const capsLockState1 = useKeyModifier('CapsLock') // Ref<boolean | null>
const capsLockState2 = useKeyModifier('CapsLock', { initial: false }) // Ref<boolean>
const capsLockState1 = useKeyModifier('CapsLock'); // Ref<boolean | null>
const capsLockState2 = useKeyModifier('CapsLock', { initial: false }); // Ref<boolean>
```
## Type Declarations
```ts
export type KeyModifier =
| "Alt"
| "AltGraph"
| "CapsLock"
| "Control"
| "Fn"
| "FnLock"
| "Meta"
| "NumLock"
| "ScrollLock"
| "Shift"
| "Symbol"
| "SymbolLock"
| 'Alt'
| 'AltGraph'
| 'CapsLock'
| 'Control'
| 'Fn'
| 'FnLock'
| 'Meta'
| 'NumLock'
| 'ScrollLock'
| 'Shift'
| 'Symbol'
| 'SymbolLock';
export interface UseModifierOptions<Initial> extends ConfigurableDocument {
/**
* Event names that will prompt update to modifier states
*
* @default ['mousedown', 'mouseup', 'keydown', 'keyup']
*/
events?: WindowEventName[]
events?: WindowEventName[];
/**
* Initial value of the returned ref
*
* @default null
*/
initial?: Initial
initial?: Initial;
}
export type UseKeyModifierReturn<Initial> = ShallowRef<
Initial extends boolean ? boolean : boolean | null
>
>;
export declare function useKeyModifier<Initial extends boolean | null>(
modifier: KeyModifier,
options?: UseModifierOptions<Initial>,
): UseKeyModifierReturn<Initial>
): UseKeyModifierReturn<Initial>;
```