sn-controls-react/dist/src/fieldcontrols/RichTextEditor/RichTextEditor.js

React controls for sensenet ECM

"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = Object.setPrototypeOf ||
        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var ReactQuill = require("react-quill");
require("react-quill/dist/quill.snow.css");
require("./RichTextEditorStyles.css");
var radium_1 = require("radium");
var RichTextEditor = (function (_super) {
    __extends(RichTextEditor, _super);
    function RichTextEditor(props) {
        var _this = _super.call(this, props) || this;
        _this.state = {
            value: _this.setValue(_this.props['data-fieldValue'])
        };
        _this.handleChange = _this.handleChange.bind(_this);
        return _this;
    }
    RichTextEditor.prototype.setValue = function (value) {
        if (value) {
            return value;
        }
        else {
            if (this.props['data-defaultValue']) {
                return this.props['data-defaultValue'];
            }
            else {
                return '';
            }
        }
    };
    RichTextEditor.prototype.handleChange = function (event) {
        this.setState({ value: event.target.value });
    };
    RichTextEditor.prototype.render = function () {
        switch (this.props['data-actionName']) {
            case 'edit':
                return (React.createElement(ReactQuill, { name: this.props.name, label: this.props.required
                        ? this.props['data-labelText'] + ' *'
                        : this.props['data-labelText'], className: this.props.className, style: this.props.style, value: this.state.value, readOnly: this.props.readOnly, required: this.props.required, disabled: this.props.readOnly, error: this.props['data-errorText'], s: 12, m: 12, l: 12, modules: modules, formats: formats }));
            case 'new':
                return (React.createElement(ReactQuill, { name: this.props.name, label: this.props.required
                        ? this.props['data-labelText'] + ' *'
                        : this.props['data-labelText'], className: this.props.className, style: this.props.style, defaultValue: this.props['data-defaultValue'], readOnly: this.props.readOnly, required: this.props.required, disabled: this.props.readOnly, error: this.props['data-errorText'], s: 12, m: 12, l: 12, modules: modules, formats: formats }));
            case 'browse':
                return (React.createElement("div", null,
                    React.createElement("label", null, this.props['data-labelText']),
                    React.createElement("div", { dangerouslySetInnerHTML: { __html: this.props['data-fieldValue'] } })));
            default:
                return (React.createElement("div", null,
                    React.createElement("label", null, this.props['data-labelText']),
                    React.createElement("div", { dangerouslySetInnerHTML: { __html: this.props['data-fieldValue'] } })));
        }
    };
    RichTextEditor = __decorate([
        radium_1.default,
        __metadata("design:paramtypes", [Object])
    ], RichTextEditor);
    return RichTextEditor;
}(React.Component));
exports.RichTextEditor = RichTextEditor;
var modules = {
    toolbar: [
        ['bold', 'italic', 'underline', 'strike'],
        ['blockquote', 'code-block'],
        [{ 'header': 1 }, { 'header': 2 }],
        [{ 'list': 'ordered' }, { 'list': 'bullet' }],
        [{ 'script': 'sub' }, { 'script': 'super' }],
        [{ 'indent': '-1' }, { 'indent': '+1' }],
        [{ 'direction': 'rtl' }],
        [{ 'size': ['small', false, 'large', 'huge'] }],
        [{ 'header': [1, 2, 3, 4, 5, 6, false] }],
        [{ 'color': [] }, { 'background': [] }],
        [{ 'font': [] }],
        [{ 'align': [] }],
        ['clean']
    ]
};
var formats = [
    'header', 'font', 'size',
    'bold', 'italic', 'underline', 'strike', 'blockquote',
    'list', 'bullet', 'indent',
    'link', 'image', 'video'
];
//# sourceMappingURL=RichTextEditor.js.map