@panneau/field-html 1.0.3-alpha.1 → 1.0.3-alpha.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/es/index.js +30 -36
  2. package/lib/index.js +30 -36
  3. package/package.json +5 -5
package/es/index.js CHANGED
@@ -5,56 +5,50 @@ import classNames from 'classnames';
5
5
  import PropTypes from 'prop-types';
6
6
  import React, { useState, useEffect, useCallback } from 'react';
7
7
  import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
8
+ import { loadPackage } from '@panneau/core/utils';
8
9
 
9
10
  /**
10
11
  * Locale loader
11
12
  */
12
-
13
13
  var packageCache = null;
14
-
15
14
  var useCKEditorBuild = function useCKEditorBuild() {
16
15
  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
17
- _ref$disabled = _ref.disabled,
18
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
19
- _ref$inline = _ref.inline,
20
- inline = _ref$inline === void 0 ? false : _ref$inline;
21
-
16
+ _ref$disabled = _ref.disabled,
17
+ disabled = _ref$disabled === void 0 ? false : _ref$disabled,
18
+ _ref$inline = _ref.inline,
19
+ inline = _ref$inline === void 0 ? false : _ref$inline;
22
20
  var _useState = useState({
23
- "package": packageCache
24
- }),
25
- _useState2 = _slicedToArray(_useState, 2),
26
- loadedPackage = _useState2[0]["package"],
27
- setLoadedPackage = _useState2[1];
28
-
21
+ "package": packageCache
22
+ }),
23
+ _useState2 = _slicedToArray(_useState, 2),
24
+ loadedPackage = _useState2[0]["package"],
25
+ setLoadedPackage = _useState2[1];
29
26
  useEffect(function () {
30
27
  var canceled = false;
31
-
32
28
  if (loadedPackage !== null) {
33
29
  return function () {
34
30
  canceled = true;
35
31
  };
36
32
  }
37
-
38
33
  if (!disabled) {
39
34
  var onEditorBuildLoaded = function onEditorBuildLoaded(_ref2) {
40
35
  var EditorBuild = _ref2["default"];
41
36
  packageCache = EditorBuild;
42
-
43
37
  if (!canceled) {
44
38
  setLoadedPackage({
45
39
  "package": EditorBuild
46
40
  });
47
41
  }
48
- }; // if (inline) {
42
+ };
43
+ // if (inline) {
49
44
  // import('@ckeditor/ckeditor5-build-inline').then(onEditorBuildLoaded);
50
45
  // } else {
51
46
  // import('@ckeditor/ckeditor5-build-classic').then(onEditorBuildLoaded);
52
47
  // }
53
-
54
-
55
- import('@ckeditor/ckeditor5-build-classic').then(onEditorBuildLoaded);
48
+ loadPackage('@ckeditor/ckeditor5-build-classic', function () {
49
+ return import('@ckeditor/ckeditor5-build-classic');
50
+ }).then(onEditorBuildLoaded);
56
51
  }
57
-
58
52
  return function () {
59
53
  canceled = true;
60
54
  };
@@ -87,9 +81,11 @@ var defaultProps = {
87
81
  onFocus: null,
88
82
  onBlur: null,
89
83
  ckConfig: {
90
- toolbar: ['heading', '|', 'bold', 'italic', 'link', 'bulletedList', 'numberedList' // 'blockQuote',
84
+ toolbar: ['heading', '|', 'bold', 'italic', 'link', 'bulletedList', 'numberedList'
85
+ // 'blockQuote',
91
86
  // 'mediaEmbed',
92
87
  ],
88
+
93
89
  heading: {
94
90
  options: [{
95
91
  model: 'paragraph',
@@ -118,26 +114,23 @@ var defaultProps = {
118
114
  ckOptions: null,
119
115
  className: null
120
116
  };
121
-
122
117
  var HtmlField = function HtmlField(_ref) {
123
118
  var _ref2;
124
-
125
119
  var feedback = _ref.feedback,
126
- errors = _ref.errors,
127
- value = _ref.value,
128
- inline = _ref.inline,
129
- onChange = _ref.onChange,
130
- onFocus = _ref.onFocus,
131
- onBlur = _ref.onBlur,
132
- ckConfig = _ref.ckConfig,
133
- ckOptions = _ref.ckOptions,
134
- className = _ref.className;
120
+ errors = _ref.errors,
121
+ value = _ref.value,
122
+ inline = _ref.inline,
123
+ onChange = _ref.onChange,
124
+ onFocus = _ref.onFocus,
125
+ onBlur = _ref.onBlur,
126
+ ckConfig = _ref.ckConfig,
127
+ ckOptions = _ref.ckOptions,
128
+ className = _ref.className;
135
129
  var CKEditorBuild = useCKEditorBuild();
136
130
  var CKValue = value !== null ? value : '';
137
131
  var finalClassName = inline ? classNames(['form-control', (_ref2 = {}, _defineProperty(_ref2, className, className !== null), _defineProperty(_ref2, 'is-valid', feedback === 'valid'), _defineProperty(_ref2, 'is-invalid', feedback === 'invalid' || errors !== null && errors.length > 0), _ref2)]) : className;
138
132
  var onCkEditorChange = useCallback(function (event, editor) {
139
133
  var data = editor.getData();
140
-
141
134
  if (onChange !== null) {
142
135
  onChange(data === '' ? null : data);
143
136
  }
@@ -145,7 +138,9 @@ var HtmlField = function HtmlField(_ref) {
145
138
  var commonProps = {
146
139
  onFocus: onFocus,
147
140
  onBlur: onBlur
148
- }; // console.log('CKValue', CKValue);
141
+ };
142
+
143
+ // console.log('CKValue', CKValue);
149
144
 
150
145
  var ckElement = CKEditorBuild !== null ? /*#__PURE__*/React.createElement("div", {
151
146
  className: finalClassName
@@ -157,7 +152,6 @@ var HtmlField = function HtmlField(_ref) {
157
152
  }, commonProps, ckOptions))) : null;
158
153
  return inline ? /*#__PURE__*/React.createElement(InputGroup, null, ckElement) : ckElement;
159
154
  };
160
-
161
155
  HtmlField.propTypes = propTypes;
162
156
  HtmlField.defaultProps = defaultProps;
163
157
 
package/lib/index.js CHANGED
@@ -9,6 +9,7 @@ var classNames = require('classnames');
9
9
  var PropTypes = require('prop-types');
10
10
  var React = require('react');
11
11
  var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
12
+ var utils = require('@panneau/core/utils');
12
13
 
13
14
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
14
15
 
@@ -40,52 +41,45 @@ var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray)
40
41
  /**
41
42
  * Locale loader
42
43
  */
43
-
44
44
  var packageCache = null;
45
-
46
45
  var useCKEditorBuild = function useCKEditorBuild() {
47
46
  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
48
- _ref$disabled = _ref.disabled,
49
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
50
- _ref$inline = _ref.inline,
51
- inline = _ref$inline === void 0 ? false : _ref$inline;
52
-
47
+ _ref$disabled = _ref.disabled,
48
+ disabled = _ref$disabled === void 0 ? false : _ref$disabled,
49
+ _ref$inline = _ref.inline,
50
+ inline = _ref$inline === void 0 ? false : _ref$inline;
53
51
  var _useState = React.useState({
54
- "package": packageCache
55
- }),
56
- _useState2 = _slicedToArray__default["default"](_useState, 2),
57
- loadedPackage = _useState2[0]["package"],
58
- setLoadedPackage = _useState2[1];
59
-
52
+ "package": packageCache
53
+ }),
54
+ _useState2 = _slicedToArray__default["default"](_useState, 2),
55
+ loadedPackage = _useState2[0]["package"],
56
+ setLoadedPackage = _useState2[1];
60
57
  React.useEffect(function () {
61
58
  var canceled = false;
62
-
63
59
  if (loadedPackage !== null) {
64
60
  return function () {
65
61
  canceled = true;
66
62
  };
67
63
  }
68
-
69
64
  if (!disabled) {
70
65
  var onEditorBuildLoaded = function onEditorBuildLoaded(_ref2) {
71
66
  var EditorBuild = _ref2["default"];
72
67
  packageCache = EditorBuild;
73
-
74
68
  if (!canceled) {
75
69
  setLoadedPackage({
76
70
  "package": EditorBuild
77
71
  });
78
72
  }
79
- }; // if (inline) {
73
+ };
74
+ // if (inline) {
80
75
  // import('@ckeditor/ckeditor5-build-inline').then(onEditorBuildLoaded);
81
76
  // } else {
82
77
  // import('@ckeditor/ckeditor5-build-classic').then(onEditorBuildLoaded);
83
78
  // }
84
-
85
-
86
- Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@ckeditor/ckeditor5-build-classic')); }).then(onEditorBuildLoaded);
79
+ utils.loadPackage('@ckeditor/ckeditor5-build-classic', function () {
80
+ return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@ckeditor/ckeditor5-build-classic')); });
81
+ }).then(onEditorBuildLoaded);
87
82
  }
88
-
89
83
  return function () {
90
84
  canceled = true;
91
85
  };
@@ -118,9 +112,11 @@ var defaultProps = {
118
112
  onFocus: null,
119
113
  onBlur: null,
120
114
  ckConfig: {
121
- toolbar: ['heading', '|', 'bold', 'italic', 'link', 'bulletedList', 'numberedList' // 'blockQuote',
115
+ toolbar: ['heading', '|', 'bold', 'italic', 'link', 'bulletedList', 'numberedList'
116
+ // 'blockQuote',
122
117
  // 'mediaEmbed',
123
118
  ],
119
+
124
120
  heading: {
125
121
  options: [{
126
122
  model: 'paragraph',
@@ -149,26 +145,23 @@ var defaultProps = {
149
145
  ckOptions: null,
150
146
  className: null
151
147
  };
152
-
153
148
  var HtmlField = function HtmlField(_ref) {
154
149
  var _ref2;
155
-
156
150
  var feedback = _ref.feedback,
157
- errors = _ref.errors,
158
- value = _ref.value,
159
- inline = _ref.inline,
160
- onChange = _ref.onChange,
161
- onFocus = _ref.onFocus,
162
- onBlur = _ref.onBlur,
163
- ckConfig = _ref.ckConfig,
164
- ckOptions = _ref.ckOptions,
165
- className = _ref.className;
151
+ errors = _ref.errors,
152
+ value = _ref.value,
153
+ inline = _ref.inline,
154
+ onChange = _ref.onChange,
155
+ onFocus = _ref.onFocus,
156
+ onBlur = _ref.onBlur,
157
+ ckConfig = _ref.ckConfig,
158
+ ckOptions = _ref.ckOptions,
159
+ className = _ref.className;
166
160
  var CKEditorBuild = useCKEditorBuild();
167
161
  var CKValue = value !== null ? value : '';
168
162
  var finalClassName = inline ? classNames__default["default"](['form-control', (_ref2 = {}, _defineProperty__default["default"](_ref2, className, className !== null), _defineProperty__default["default"](_ref2, 'is-valid', feedback === 'valid'), _defineProperty__default["default"](_ref2, 'is-invalid', feedback === 'invalid' || errors !== null && errors.length > 0), _ref2)]) : className;
169
163
  var onCkEditorChange = React.useCallback(function (event, editor) {
170
164
  var data = editor.getData();
171
-
172
165
  if (onChange !== null) {
173
166
  onChange(data === '' ? null : data);
174
167
  }
@@ -176,7 +169,9 @@ var HtmlField = function HtmlField(_ref) {
176
169
  var commonProps = {
177
170
  onFocus: onFocus,
178
171
  onBlur: onBlur
179
- }; // console.log('CKValue', CKValue);
172
+ };
173
+
174
+ // console.log('CKValue', CKValue);
180
175
 
181
176
  var ckElement = CKEditorBuild !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
182
177
  className: finalClassName
@@ -188,7 +183,6 @@ var HtmlField = function HtmlField(_ref) {
188
183
  }, commonProps, ckOptions))) : null;
189
184
  return inline ? /*#__PURE__*/React__default["default"].createElement(InputGroup__default["default"], null, ckElement) : ckElement;
190
185
  };
191
-
192
186
  HtmlField.propTypes = propTypes;
193
187
  HtmlField.defaultProps = defaultProps;
194
188
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@panneau/field-html",
3
- "version": "1.0.3-alpha.1",
3
+ "version": "1.0.3-alpha.7",
4
4
  "description": "A HTML field, using either Quill or CK Editor",
5
5
  "keywords": [
6
6
  "javascript"
@@ -56,14 +56,14 @@
56
56
  "@ckeditor/ckeditor5-build-classic": "^27.0.0",
57
57
  "@ckeditor/ckeditor5-build-inline": "^27.0.0",
58
58
  "@ckeditor/ckeditor5-react": "^3.0.2",
59
- "@panneau/core": "^1.0.3-alpha.1",
60
- "@panneau/field-input-group": "^1.0.3-alpha.1",
61
- "@panneau/themes": "^1.0.3-alpha.1",
59
+ "@panneau/core": "^1.0.3-alpha.7",
60
+ "@panneau/field-input-group": "^1.0.3-alpha.7",
61
+ "@panneau/themes": "^1.0.3-alpha.7",
62
62
  "classnames": "^2.2.6",
63
63
  "prop-types": "^15.7.2"
64
64
  },
65
65
  "publishConfig": {
66
66
  "access": "public"
67
67
  },
68
- "gitHead": "e04e663c7f1eb692f89a0136f2e8f45024fbe355"
68
+ "gitHead": "a11f9633326e3c025b0abe892111017a0588730a"
69
69
  }