upfront-editable
Version:
Friendly contenteditable API
220 lines (200 loc) • 7.53 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = createDefaultEvents;
var _createDefaultBehavior = _interopRequireDefault(require("./create-default-behavior"));
function createDefaultEvents(editable) {
var behavior = (0, _createDefaultBehavior["default"])(editable);
return {
/**
* The focus event is triggered when an element gains focus.
* The default behavior is to... TODO
*
* @event focus
* @param {HTMLElement} element The element triggering the event.
*/
focus: function focus(element) {
behavior.focus(element);
},
/**
* The blur event is triggered when an element looses focus.
* The default behavior is to... TODO
*
* @event blur
* @param {HTMLElement} element The element triggering the event.
*/
blur: function blur(element) {
behavior.blur(element);
},
/**
* The flow event is triggered when the user starts typing or pause typing.
* The default behavior is to... TODO
*
* @event flow
* @param {HTMLElement} element The element triggering the event.
* @param {String} action The flow action: "start" or "pause".
*/
flow: function flow(element, action) {
behavior.flow(element, action);
},
/**
* The selection event is triggered after the user has selected some
* content.
* The default behavior is to... TODO
*
* @event selection
* @param {HTMLElement} element The element triggering the event.
* @param {Selection} selection The actual Selection object.
*/
selection: function selection(element, _selection) {
behavior.selection(element, _selection);
},
/**
* The cursor event is triggered after cursor position has changed.
* The default behavior is to... TODO
*
* @event cursor
* @param {HTMLElement} element The element triggering the event.
* @param {Cursor} cursor The actual Cursor object.
*/
cursor: function cursor(element, _cursor) {
behavior.cursor(element, _cursor);
},
/**
* The newline event is triggered when a newline should be inserted. This
* happens when SHIFT+ENTER key is pressed.
* The default behavior is to add a <br />
*
* @event newline
* @param {HTMLElement} element The element triggering the event.
* @param {Cursor} cursor The actual cursor object.
*/
newline: function newline(element, cursor) {
behavior.newline(element, cursor);
},
/**
* The split event is triggered when a block should be split into two
* blocks. This happens when ENTER is pressed within a non-empty block.
* The default behavior is to... TODO
*
* @event split
* @param {HTMLElement} element The element triggering the event.
* @param {String} before The HTML string before the split.
* @param {String} after The HTML string after the split.
* @param {Cursor} cursor The actual cursor object.
*/
split: function split(element, before, after, cursor) {
behavior.split(element, before, after, cursor);
},
/**
* The insert event is triggered when a new block should be inserted. This
* happens when ENTER key is pressed at the beginning of a block (should
* insert before) or at the end of a block (should insert after).
* The default behavior is to... TODO
*
* @event insert
* @param {HTMLElement} element The element triggering the event.
* @param {String} direction The insert direction: "before" or "after".
* @param {Cursor} cursor The actual cursor object.
*/
insert: function insert(element, direction, cursor) {
behavior.insert(element, direction, cursor);
},
/**
* The merge event is triggered when two needs to be merged. This happens
* when BACKSPACE is pressed at the beginning of a block (should merge with
* the preceding block) or DEL is pressed at the end of a block (should
* merge with the following block).
* The default behavior is to... TODO
*
* @event merge
* @param {HTMLElement} element The element triggering the event.
* @param {String} direction The merge direction: "before" or "after".
* @param {Cursor} cursor The actual cursor object.
*/
merge: function merge(element, direction, cursor) {
behavior.merge(element, direction, cursor);
},
/**
* The empty event is triggered when a block is emptied.
* The default behavior is to... TODO
*
* @event empty
* @param {HTMLElement} element The element triggering the event.
*/
empty: function empty(element) {
behavior.empty(element);
},
/**
* The switch event is triggered when the user switches to another block.
* This happens when an ARROW key is pressed near the boundaries of a block.
* The default behavior is to... TODO
*
* @event switch
* @param {HTMLElement} element The element triggering the event.
* @param {String} direction The switch direction: "before" or "after".
* @param {Cursor} cursor The actual cursor object.*
*/
"switch": function _switch(element, direction, cursor) {
behavior["switch"](element, direction, cursor);
},
/**
* The move event is triggered when the user moves a selection in a block.
* This happens when the user selects some (or all) content in a block and
* an ARROW key is pressed (up: drag before, down: drag after).
* The default behavior is to... TODO
*
* @event move
* @param {HTMLElement} element The element triggering the event.
* @param {Selection} selection The actual Selection object.
* @param {String} direction The move direction: "before" or "after".
*/
move: function move(element, selection, direction) {
behavior.move(element, selection, direction);
},
/**
* The clipboard event is triggered when the user copies or cuts
* a selection within a block.
*
* @event clipboard
* @param {HTMLElement} element The element triggering the event.
* @param {String} action The clipboard action: "copy" or "cut".
* @param {Selection} selection A selection object around the copied content.
*/
clipboard: function clipboard(element, action, selection) {
behavior.clipboard(element, action, selection);
},
/**
* The paste event is triggered when the user pastes text
*
* @event paste
* @param {HTMLElement} The element triggering the event.
* @param {Array of String} The pasted blocks
* @param {Cursor} The cursor object.
*/
paste: function paste(element, blocks, cursor) {
behavior.paste(element, blocks, cursor);
},
/**
* The toggleBold event is triggered when the bold keyboard shortcut is used
*
* @event toggleBold
* @param {Selection} The selection object.
*/
toggleBold: function toggleBold(selection) {
behavior.toggleBold(selection);
},
/**
* The toggleEmphasis event is triggered when the italic keyboard shortcut is used
*
* @event toggleEmphasis
* @param {Selection} The selection object.
*/
toggleEmphasis: function toggleEmphasis(selection) {
behavior.toggleEmphasis(selection);
}
};
}
module.exports = exports.default;