all files / ui/ TextPropertyEditor.js

63.16% Statements 12/19
70% Branches 7/10
50% Functions 2/4
63.16% Lines 12/19
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87                                                                72× 72×   72×           136× 136×   136× 61× 61×   61×     136×                 136×                                                  
import Surface from './Surface'
import TextPropertyComponent from './TextPropertyComponent'
 
/**
  Editor for a text property (annotated string). Needs to be
  instantiated inside a {@link ui/Controller} context.
 
  @class
  @component
  @extends ui/Surface
 
  @prop {String} name unique editor name
  @prop {String[]} path path to a text property
  @prop {ui/SurfaceCommand[]} commands array of command classes to be available
 
  @example
 
  Create a `TextPropertyEditor` for the `name` property of an author object. Allow emphasis annotations.
 
  ```js
  $$(TextPropertyEditor, {
    name: 'authorNameEditor',
    path: ['author_1', 'name'],
    commands: [EmphasisCommand]
  })
  ```
*/
 
class TextPropertyEditor extends Surface {
 
  constructor(parent, props) {
    // making props.name optional
    props.name = props.name || props.path.join('.')
    super(parent, props)
 
    Iif (!props.path) {
      throw new Error("Property 'path' is mandatory.")
    }
  }
 
  render($$) {
    let el = super.render.apply(this, arguments)
    el.addClass("sc-text-property-editor")
 
    if (!this.props.disabled) {
      el.addClass('sm-enabled')
      el.attr('contenteditable', true)
      // native spellcheck
      el.attr('spellcheck', this.props.spellcheck === 'native')
    }
 
    el.append(
      $$(TextPropertyComponent, {
        tagName: this.props.tagName || "div",
        path: this.props.path,
        markers: this.props.markers,
        withoutBreak: this.props.withoutBreak
      })
    )
 
    return el
  }
 
  _handleEnterKey(event) {
    event.preventDefault()
    event.stopPropagation()
    if (this.props.multiLine) {
      super._handleEnterKey(event)
    }
    this.el.emit('enter', {
      altKey: event.altKey,
      ctrlKey: event.ctrlKey,
      metaKey: event.metaKey,
      shiftKey: event.shiftKey,
      code: event.code
    })
  }
 
  getPath() {
    return this.props.path
  }
}
 
TextPropertyEditor.prototype._isTextPropertyEditor = true
 
export default TextPropertyEditor