merchi_product_form
Version:
A React component for Merchi product forms
68 lines • 10.2 kB
JavaScript
import * as React from 'react';
import { ContentState, convertFromRaw, EditorState } from 'draft-js';
import createAlignmentPlugin from '@draft-js-plugins/alignment';
import createImagePlugin from '@draft-js-plugins/image';
import Editor, { composeDecorators } from '@draft-js-plugins/editor';
import '@draft-js-plugins/text-alignment/lib/plugin.css';
import 'draft-js/dist/Draft.css';
import '@draft-js-plugins/image/lib/plugin.css';
import '@draft-js-plugins/alignment/lib/plugin.css';
import createFocusPlugin from '@draft-js-plugins/focus';
import createVideoPlugin from '@draft-js-plugins/video';
import createBlockDndPlugin from '@draft-js-plugins/drag-n-drop';
import createTextAlignmentPlugin from '@draft-js-plugins/text-alignment';
import { jsx as _jsx } from "react/jsx-runtime";
var textAlignmentPlugin = createTextAlignmentPlugin();
var blockDndPlugin = createBlockDndPlugin();
var alignmentPlugin = createAlignmentPlugin();
var focusPlugin = createFocusPlugin();
export var defaultThemeVideo = {
iframeContainer: 'rte-editor-iframeContainer',
iframe: 'rte-editor-iframe',
invalidVideoSrc: 'rte-editor-invalidVideoSrc',
video: 'rte-editor-video'
};
var decorator = composeDecorators(alignmentPlugin.decorator, blockDndPlugin.decorator, focusPlugin.decorator);
var videoDecorator = composeDecorators(alignmentPlugin.decorator, focusPlugin.decorator);
var imagePlugin = createImagePlugin({
decorator: decorator
});
var videoPlugin = createVideoPlugin({
decorator: videoDecorator,
theme: defaultThemeVideo
});
var plugins = [focusPlugin, alignmentPlugin, blockDndPlugin, imagePlugin, textAlignmentPlugin, videoPlugin];
function VariationFieldInputInstructions(_ref) {
var instructions = _ref.instructions;
var message;
var content;
try {
content = convertFromRaw(JSON.parse(instructions));
} catch (_unused) {
if (!instructions || instructions === '') {
message = '';
} else {
message = instructions;
}
content = ContentState.createFromText(message);
}
var initialEditorState = EditorState.createWithContent(content);
var editorRef = React.useRef(null);
return /*#__PURE__*/_jsx("div", {
className: "variation-field-instructions",
style: {
width: 'auto%'
},
children: /*#__PURE__*/_jsx(Editor, {
onChange: function onChange() {
return null;
},
ref: editorRef,
editorState: initialEditorState,
readOnly: true,
plugins: plugins
})
});
}
export default VariationFieldInputInstructions;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJSZWFjdCIsIkNvbnRlbnRTdGF0ZSIsImNvbnZlcnRGcm9tUmF3IiwiRWRpdG9yU3RhdGUiLCJjcmVhdGVBbGlnbm1lbnRQbHVnaW4iLCJjcmVhdGVJbWFnZVBsdWdpbiIsIkVkaXRvciIsImNvbXBvc2VEZWNvcmF0b3JzIiwiY3JlYXRlRm9jdXNQbHVnaW4iLCJjcmVhdGVWaWRlb1BsdWdpbiIsImNyZWF0ZUJsb2NrRG5kUGx1Z2luIiwiY3JlYXRlVGV4dEFsaWdubWVudFBsdWdpbiIsImpzeCIsIl9qc3giLCJ0ZXh0QWxpZ25tZW50UGx1Z2luIiwiYmxvY2tEbmRQbHVnaW4iLCJhbGlnbm1lbnRQbHVnaW4iLCJmb2N1c1BsdWdpbiIsImRlZmF1bHRUaGVtZVZpZGVvIiwiaWZyYW1lQ29udGFpbmVyIiwiaWZyYW1lIiwiaW52YWxpZFZpZGVvU3JjIiwidmlkZW8iLCJkZWNvcmF0b3IiLCJ2aWRlb0RlY29yYXRvciIsImltYWdlUGx1Z2luIiwidmlkZW9QbHVnaW4iLCJ0aGVtZSIsInBsdWdpbnMiLCJWYXJpYXRpb25GaWVsZElucHV0SW5zdHJ1Y3Rpb25zIiwiX3JlZiIsImluc3RydWN0aW9ucyIsIm1lc3NhZ2UiLCJjb250ZW50IiwiSlNPTiIsInBhcnNlIiwiX3VudXNlZCIsImNyZWF0ZUZyb21UZXh0IiwiaW5pdGlhbEVkaXRvclN0YXRlIiwiY3JlYXRlV2l0aENvbnRlbnQiLCJlZGl0b3JSZWYiLCJ1c2VSZWYiLCJjbGFzc05hbWUiLCJzdHlsZSIsIndpZHRoIiwiY2hpbGRyZW4iLCJvbkNoYW5nZSIsInJlZiIsImVkaXRvclN0YXRlIiwicmVhZE9ubHkiXSwic291cmNlcyI6WyIuLi8uLi9zcmMvY29tcG9uZW50cy9WYXJpYXRpb25GaWVsZElucHV0SW5zdHJ1Y3Rpb25zLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgKiBhcyBSZWFjdCBmcm9tICdyZWFjdCc7XHJcbmltcG9ydCB7IENvbnRlbnRTdGF0ZSwgY29udmVydEZyb21SYXcsIEVkaXRvclN0YXRlIH0gZnJvbSAnZHJhZnQtanMnO1xyXG5pbXBvcnQgY3JlYXRlQWxpZ25tZW50UGx1Z2luIGZyb20gJ0BkcmFmdC1qcy1wbHVnaW5zL2FsaWdubWVudCc7XHJcbmltcG9ydCBjcmVhdGVJbWFnZVBsdWdpbiBmcm9tICdAZHJhZnQtanMtcGx1Z2lucy9pbWFnZSc7XHJcbmltcG9ydCBFZGl0b3IsIHsgY29tcG9zZURlY29yYXRvcnMgfSBmcm9tICdAZHJhZnQtanMtcGx1Z2lucy9lZGl0b3InO1xyXG5pbXBvcnQgJ0BkcmFmdC1qcy1wbHVnaW5zL3RleHQtYWxpZ25tZW50L2xpYi9wbHVnaW4uY3NzJztcclxuaW1wb3J0ICdkcmFmdC1qcy9kaXN0L0RyYWZ0LmNzcyc7XHJcbmltcG9ydCAnQGRyYWZ0LWpzLXBsdWdpbnMvaW1hZ2UvbGliL3BsdWdpbi5jc3MnO1xyXG5pbXBvcnQgJ0BkcmFmdC1qcy1wbHVnaW5zL2FsaWdubWVudC9saWIvcGx1Z2luLmNzcyc7XHJcblxyXG5pbXBvcnQgY3JlYXRlRm9jdXNQbHVnaW4gZnJvbSAnQGRyYWZ0LWpzLXBsdWdpbnMvZm9jdXMnO1xyXG5pbXBvcnQgY3JlYXRlVmlkZW9QbHVnaW4gZnJvbSAnQGRyYWZ0LWpzLXBsdWdpbnMvdmlkZW8nO1xyXG5pbXBvcnQgY3JlYXRlQmxvY2tEbmRQbHVnaW4gZnJvbSAnQGRyYWZ0LWpzLXBsdWdpbnMvZHJhZy1uLWRyb3AnO1xyXG5pbXBvcnQgY3JlYXRlVGV4dEFsaWdubWVudFBsdWdpbiBmcm9tICdAZHJhZnQtanMtcGx1Z2lucy90ZXh0LWFsaWdubWVudCc7XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIFZpZGVvUGx1Z2luVGhlbWUge1xyXG4gIGlmcmFtZUNvbnRhaW5lcjogc3RyaW5nO1xyXG4gIGlmcmFtZTogc3RyaW5nO1xyXG4gIGludmFsaWRWaWRlb1NyYzogc3RyaW5nO1xyXG4gIHZpZGVvOiBzdHJpbmc7XHJcbn1cclxuXHJcbmNvbnN0IHRleHRBbGlnbm1lbnRQbHVnaW4gPSBjcmVhdGVUZXh0QWxpZ25tZW50UGx1Z2luKCk7XHJcbmNvbnN0IGJsb2NrRG5kUGx1Z2luID0gY3JlYXRlQmxvY2tEbmRQbHVnaW4oKTtcclxuY29uc3QgYWxpZ25tZW50UGx1Z2luID0gY3JlYXRlQWxpZ25tZW50UGx1Z2luKCk7XHJcbmNvbnN0IGZvY3VzUGx1Z2luID0gY3JlYXRlRm9jdXNQbHVnaW4oKTtcclxuXHJcbmV4cG9ydCBjb25zdCBkZWZhdWx0VGhlbWVWaWRlbzogVmlkZW9QbHVnaW5UaGVtZSA9IHtcclxuICBpZnJhbWVDb250YWluZXI6ICdydGUtZWRpdG9yLWlmcmFtZUNvbnRhaW5lcicsXHJcbiAgaWZyYW1lOiAncnRlLWVkaXRvci1pZnJhbWUnLFxyXG4gIGludmFsaWRWaWRlb1NyYzogJ3J0ZS1lZGl0b3ItaW52YWxpZFZpZGVvU3JjJyxcclxuICB2aWRlbzogJ3J0ZS1lZGl0b3ItdmlkZW8nLFxyXG59O1xyXG5cclxuY29uc3QgZGVjb3JhdG9yOmFueSA9IGNvbXBvc2VEZWNvcmF0b3JzKFxyXG4gIGFsaWdubWVudFBsdWdpbi5kZWNvcmF0b3IsXHJcbiAgYmxvY2tEbmRQbHVnaW4uZGVjb3JhdG9yLFxyXG4gIGZvY3VzUGx1Z2luLmRlY29yYXRvcixcclxuKTtcclxuXHJcbmNvbnN0IHZpZGVvRGVjb3JhdG9yOmFueSA9IGNvbXBvc2VEZWNvcmF0b3JzKFxyXG4gIGFsaWdubWVudFBsdWdpbi5kZWNvcmF0b3IsXHJcbiAgZm9jdXNQbHVnaW4uZGVjb3JhdG9yLFxyXG4pO1xyXG5cclxuY29uc3QgaW1hZ2VQbHVnaW4gPSBjcmVhdGVJbWFnZVBsdWdpbih7XHJcbiAgZGVjb3JhdG9yLFxyXG59KTtcclxuXHJcbmNvbnN0IHZpZGVvUGx1Z2luID0gY3JlYXRlVmlkZW9QbHVnaW4oe1xyXG4gIGRlY29yYXRvcjogdmlkZW9EZWNvcmF0b3IsXHJcbiAgdGhlbWU6IGRlZmF1bHRUaGVtZVZpZGVvLFxyXG59KTtcclxuXHJcbmNvbnN0IHBsdWdpbnM6IGFueSA9IFtcclxuICBmb2N1c1BsdWdpbixcclxuICBhbGlnbm1lbnRQbHVnaW4sXHJcbiAgYmxvY2tEbmRQbHVnaW4sXHJcbiAgaW1hZ2VQbHVnaW4sXHJcbiAgdGV4dEFsaWdubWVudFBsdWdpbixcclxuICB2aWRlb1BsdWdpbixcclxuXTtcclxuXHJcbmludGVyZmFjZSBQcm9wcyB7XHJcbiAgaW5zdHJ1Y3Rpb25zOiBzdHJpbmc7XHJcbn1cclxuXHJcbmZ1bmN0aW9uIFZhcmlhdGlvbkZpZWxkSW5wdXRJbnN0cnVjdGlvbnMoIHsgaW5zdHJ1Y3Rpb25zIH06IFByb3BzKSB7XHJcbiAgbGV0IG1lc3NhZ2U7XHJcbiAgbGV0IGNvbnRlbnQ7XHJcbiAgdHJ5IHtcclxuICAgIGNvbnRlbnQgPSBjb252ZXJ0RnJvbVJhdyhKU09OLnBhcnNlKGluc3RydWN0aW9ucykpO1xyXG4gIH0gY2F0Y2gge1xyXG4gICAgaWYgKCFpbnN0cnVjdGlvbnMgIHx8IGluc3RydWN0aW9ucyA9PT0gJycpIHtcclxuICAgICAgbWVzc2FnZSA9ICcnO1xyXG4gICAgfSBlbHNlIHtcclxuICAgICAgbWVzc2FnZSA9IGluc3RydWN0aW9ucztcclxuICAgIH1cclxuICAgIGNvbnRlbnQgPSBDb250ZW50U3RhdGUuY3JlYXRlRnJvbVRleHQobWVzc2FnZSk7XHJcbiAgfVxyXG4gIGNvbnN0IGluaXRpYWxFZGl0b3JTdGF0ZSA9IEVkaXRvclN0YXRlLmNyZWF0ZVdpdGhDb250ZW50KGNvbnRlbnQpO1xyXG4gIGNvbnN0IGVkaXRvclJlZiA9IFJlYWN0LnVzZVJlZjxFZGl0b3I+KG51bGwpO1xyXG4gIHJldHVybiAoXHJcbiAgICA8ZGl2IGNsYXNzTmFtZT1cInZhcmlhdGlvbi1maWVsZC1pbnN0cnVjdGlvbnNcIiBzdHlsZT17eyB3aWR0aDogJ2F1dG8lJyB9fT5cclxuICAgICAgPEVkaXRvclxyXG4gICAgICAgIG9uQ2hhbmdlPXsoKSA9PiBudWxsfVxyXG4gICAgICAgIHJlZj17ZWRpdG9yUmVmfVxyXG4gICAgICAgIGVkaXRvclN0YXRlPXtpbml0aWFsRWRpdG9yU3RhdGV9XHJcbiAgICAgICAgcmVhZE9ubHk9e3RydWV9XHJcbiAgICAgICAgcGx1Z2lucz17cGx1Z2luc31cclxuICAgICAgLz5cclxuICAgIDwvZGl2PlxyXG4gICk7XHJcbn1cclxuXHJcbmV4cG9ydCBkZWZhdWx0IFZhcmlhdGlvbkZpZWxkSW5wdXRJbnN0cnVjdGlvbnM7XHJcbiJdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLQSxLQUFLLE1BQU0sT0FBTztBQUM5QixTQUFTQyxZQUFZLEVBQUVDLGNBQWMsRUFBRUMsV0FBVyxRQUFRLFVBQVU7QUFDcEUsT0FBT0MscUJBQXFCLE1BQU0sNkJBQTZCO0FBQy9ELE9BQU9DLGlCQUFpQixNQUFNLHlCQUF5QjtBQUN2RCxPQUFPQyxNQUFNLElBQUlDLGlCQUFpQixRQUFRLDBCQUEwQjtBQUNwRSxPQUFPLGlEQUFpRDtBQUN4RCxPQUFPLHlCQUF5QjtBQUNoQyxPQUFPLHdDQUF3QztBQUMvQyxPQUFPLDRDQUE0QztBQUVuRCxPQUFPQyxpQkFBaUIsTUFBTSx5QkFBeUI7QUFDdkQsT0FBT0MsaUJBQWlCLE1BQU0seUJBQXlCO0FBQ3ZELE9BQU9DLG9CQUFvQixNQUFNLCtCQUErQjtBQUNoRSxPQUFPQyx5QkFBeUIsTUFBTSxrQ0FBa0M7QUFBQyxTQUFBQyxHQUFBLElBQUFDLElBQUE7QUFTekUsSUFBTUMsbUJBQW1CLEdBQUdILHlCQUF5QixDQUFDLENBQUM7QUFDdkQsSUFBTUksY0FBYyxHQUFHTCxvQkFBb0IsQ0FBQyxDQUFDO0FBQzdDLElBQU1NLGVBQWUsR0FBR1oscUJBQXFCLENBQUMsQ0FBQztBQUMvQyxJQUFNYSxXQUFXLEdBQUdULGlCQUFpQixDQUFDLENBQUM7QUFFdkMsT0FBTyxJQUFNVSxpQkFBbUMsR0FBRztFQUNqREMsZUFBZSxFQUFFLDRCQUE0QjtFQUM3Q0MsTUFBTSxFQUFFLG1CQUFtQjtFQUMzQkMsZUFBZSxFQUFFLDRCQUE0QjtFQUM3Q0MsS0FBSyxFQUFFO0FBQ1QsQ0FBQztBQUVELElBQU1DLFNBQWEsR0FBR2hCLGlCQUFpQixDQUNyQ1MsZUFBZSxDQUFDTyxTQUFTLEVBQ3pCUixjQUFjLENBQUNRLFNBQVMsRUFDeEJOLFdBQVcsQ0FBQ00sU0FDZCxDQUFDO0FBRUQsSUFBTUMsY0FBa0IsR0FBR2pCLGlCQUFpQixDQUMxQ1MsZUFBZSxDQUFDTyxTQUFTLEVBQ3pCTixXQUFXLENBQUNNLFNBQ2QsQ0FBQztBQUVELElBQU1FLFdBQVcsR0FBR3BCLGlCQUFpQixDQUFDO0VBQ3BDa0IsU0FBUyxFQUFUQTtBQUNGLENBQUMsQ0FBQztBQUVGLElBQU1HLFdBQVcsR0FBR2pCLGlCQUFpQixDQUFDO0VBQ3BDYyxTQUFTLEVBQUVDLGNBQWM7RUFDekJHLEtBQUssRUFBRVQ7QUFDVCxDQUFDLENBQUM7QUFFRixJQUFNVSxPQUFZLEdBQUcsQ0FDbkJYLFdBQVcsRUFDWEQsZUFBZSxFQUNmRCxjQUFjLEVBQ2RVLFdBQVcsRUFDWFgsbUJBQW1CLEVBQ25CWSxXQUFXLENBQ1o7QUFNRCxTQUFTRywrQkFBK0JBLENBQUFDLElBQUEsRUFBMkI7RUFBQSxJQUF2QkMsWUFBWSxHQUFBRCxJQUFBLENBQVpDLFlBQVk7RUFDdEQsSUFBSUMsT0FBTztFQUNYLElBQUlDLE9BQU87RUFDWCxJQUFJO0lBQ0ZBLE9BQU8sR0FBRy9CLGNBQWMsQ0FBQ2dDLElBQUksQ0FBQ0MsS0FBSyxDQUFDSixZQUFZLENBQUMsQ0FBQztFQUNwRCxDQUFDLENBQUMsT0FBQUssT0FBQSxFQUFNO0lBQ04sSUFBSSxDQUFDTCxZQUFZLElBQUtBLFlBQVksS0FBSyxFQUFFLEVBQUU7TUFDekNDLE9BQU8sR0FBRyxFQUFFO0lBQ2QsQ0FBQyxNQUFNO01BQ0xBLE9BQU8sR0FBR0QsWUFBWTtJQUN4QjtJQUNBRSxPQUFPLEdBQUdoQyxZQUFZLENBQUNvQyxjQUFjLENBQUNMLE9BQU8sQ0FBQztFQUNoRDtFQUNBLElBQU1NLGtCQUFrQixHQUFHbkMsV0FBVyxDQUFDb0MsaUJBQWlCLENBQUNOLE9BQU8sQ0FBQztFQUNqRSxJQUFNTyxTQUFTLEdBQUd4QyxLQUFLLENBQUN5QyxNQUFNLENBQVMsSUFBSSxDQUFDO0VBQzVDLG9CQUNFNUIsSUFBQTtJQUFLNkIsU0FBUyxFQUFDLDhCQUE4QjtJQUFDQyxLQUFLLEVBQUU7TUFBRUMsS0FBSyxFQUFFO0lBQVEsQ0FBRTtJQUFBQyxRQUFBLGVBQ3RFaEMsSUFBQSxDQUFDUCxNQUFNO01BQ0x3QyxRQUFRLEVBQUUsU0FBVkEsUUFBUUEsQ0FBQTtRQUFBLE9BQVEsSUFBSTtNQUFBLENBQUM7TUFDckJDLEdBQUcsRUFBRVAsU0FBVTtNQUNmUSxXQUFXLEVBQUVWLGtCQUFtQjtNQUNoQ1csUUFBUSxFQUFFLElBQUs7TUFDZnJCLE9BQU8sRUFBRUE7SUFBUSxDQUNsQjtFQUFDLENBQ0MsQ0FBQztBQUVWO0FBRUEsZUFBZUMsK0JBQStCIiwiaWdub3JlTGlzdCI6W119