操作提示

w-hint
	div(slot="mouse")
		='Use'
		w-hint-mouse Left
		='to active a button, and use'
		w-hint-key ArrowUp
		w-hint-key ArrowRight
		w-hint-key ArrowDown
		w-hint-key ArrowLeft
		='to navigate.'
	div(slot="gamepad")
		='Use'
		w-hint-gamepad A
		='to active a button, and use'
		w-hint-gamepad Up
		w-hint-gamepad Right
		w-hint-gamepad Down
		w-hint-gamepad Left
		='to navigate.'
	div(slot="touch")
		='Use'
		w-hint-touch Tap
		='to active a button.'
	div(slot="pen")
		='Use'
		w-hint-pen Tap
		='to active a button, and use'
		w-hint-key ArrowUp
		w-hint-key ArrowRight
		w-hint-key ArrowDown
		w-hint-key ArrowLeft
		='to navigate.'

import { KEYS_ALLOW } from 'abm-ui';
import { $, $apply, $new } from 'abm-utils';

$('#main')?.append(
	...KEYS_ALLOW.map((key) => $new('w-hint-key', { prop: { key } })),
	$new('w-hint-key'),
);

$apply($('#panel')!, { style: { display: 'none' } });

w-hint-mouse Move
w-hint-mouse MoveHorizontal
w-hint-mouse MoveVertical
w-hint-mouse Wheel
w-hint-mouse WheelPress
w-hint-mouse WheelUp
w-hint-mouse WheelDown
w-hint-mouse Left
w-hint-mouse Right
w-hint-mouse

w-hint-gamepad Home
w-hint-gamepad Back
w-hint-gamepad Start
w-hint-gamepad A
w-hint-gamepad B
w-hint-gamepad X
w-hint-gamepad Y
w-hint-gamepad LB
w-hint-gamepad RB
w-hint-gamepad LT
w-hint-gamepad RT
w-hint-gamepad LSB
w-hint-gamepad RSB
w-hint-gamepad Up
w-hint-gamepad Right
w-hint-gamepad Down
w-hint-gamepad Left
w-hint-gamepad LS
w-hint-gamepad RS
w-hint-gamepad

w-hint-touch Tap
w-hint-touch DualTap
w-hint-touch Hold
w-hint-touch Move
w-hint-touch SwapUp
w-hint-touch SwapRight
w-hint-touch SwapDown
w-hint-touch SwapLeft
w-hint-touch

w-hint-pen Tap
w-hint-pen DualTap
w-hint-pen Hold
w-hint-pen Draw
w-hint-pen DrawHorizontal
w-hint-pen DrawVertical
w-hint-pen Move
w-hint-pen MoveHorizontal
w-hint-pen MoveVertical
w-hint-pen