Indentation

Overview

The Indentation component enables to indent and unindent lines by shortcuts.

No Keyboard Trap

Preventing the default behavior of the Tab key does not meet the "No Keyboard Trap" criterion.

If keyboard focus can be moved to a component of the page using a keyboard interface, then focus can be moved away from that component using only a keyboard interface, and, if it requires more than unmodified arrow or tab keys or other standard exit methods, the user is advised of the method for moving focus away.

If the editor handles the Tab key for inserting indents, users lose the way to move focus away. To solve this problem, this extension remains inactive after initialization, and:

• when users click or touch the editor, it becomes active
• when users move focus to the editor by the Tab key and press it again, it shows a notice with following message

Inserting indents by the Tab is currently disabled. You can toggle it by Ctrl+M.

You can change this behavior by options.

Usage

Register Dialog and Indentation extensions:

import { RyuseiCode, Dialog, Indentation } from '@ryusei/code';

RyuseiCode.compose( { Dialog, Indentation } );
JavaScript

import { RyuseiCode, Dialog, Indentation } from '@ryusei/code';


RyuseiCode.compose( { Dialog, Indentation } );

or import files:

<script src="path-to-the-file/dialog.min.js"></script>
<script src="path-to-the-file/indentation.min.js"></script>
HTML

<script src="path-to-the-file/dialog.min.js"></script>
<script src="path-to-the-file/indentation.min.js"></script>

Options

Set an object to indentation to update default options, or false to deactivate it.

new RyuseiCode( { indentation: { ... } } );

// or
new RyuseiCode( { indentation: false } );
JavaScript

new RyuseiCode( { indentation: { ... } } );


// or
new RyuseiCode( { indentation: false } );

activation

Determines the timing when the extension becomes active.

• pointerdown or undefined: activates it when users click the editor
• load: activates it immediately when the editor gets ready

To satisfy the "No Keyboard Trap" criterion, this option should be pointerdown.

type: string default: undefined

help

Determines whether to display the help dialog that notifies how to toggle the tab mode, which is explained above. If the activation option is load, this option is ignored.

type: boolean default: true

deepIndent

Determines whether to insert an additional indent into a newline inside brackets.

type: boolean default: true

Methods