@goldenpine/react-form-builder2 0.18.4-patch.1

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 (54) hide show
  1. package/LICENSE +7 -0
  2. package/README.md +250 -0
  3. package/dist/1.app.js +1 -0
  4. package/dist/app.css +38 -0
  5. package/dist/app.css.map +1 -0
  6. package/dist/app.js +71 -0
  7. package/lib/ItemTypes.js +11 -0
  8. package/lib/UUID.js +67 -0
  9. package/lib/dynamic-option-list.js +189 -0
  10. package/lib/fieldset/FieldSet.js +121 -0
  11. package/lib/fieldset/index.js +13 -0
  12. package/lib/form-dynamic-edit.js +57 -0
  13. package/lib/form-elements/component-drag-handle.js +91 -0
  14. package/lib/form-elements/component-drag-layer.js +69 -0
  15. package/lib/form-elements/component-drag-preview.js +61 -0
  16. package/lib/form-elements/component-header.js +30 -0
  17. package/lib/form-elements/component-label.js +30 -0
  18. package/lib/form-elements/custom-element.js +74 -0
  19. package/lib/form-elements/date-picker.js +185 -0
  20. package/lib/form-elements/header-bar.js +55 -0
  21. package/lib/form-elements/index.js +1144 -0
  22. package/lib/form-elements/myxss.js +30 -0
  23. package/lib/form-elements/star-rating.js +338 -0
  24. package/lib/form-elements-edit.js +740 -0
  25. package/lib/form-place-holder.js +52 -0
  26. package/lib/form-validator.js +104 -0
  27. package/lib/form.js +592 -0
  28. package/lib/functions/index.js +47 -0
  29. package/lib/index.js +142 -0
  30. package/lib/language-provider/IntlMessages.js +16 -0
  31. package/lib/language-provider/entries/en-us.js +17 -0
  32. package/lib/language-provider/entries/fa-ir.js +17 -0
  33. package/lib/language-provider/entries/it-it.js +17 -0
  34. package/lib/language-provider/entries/vi-vn.js +17 -0
  35. package/lib/language-provider/index.js +41 -0
  36. package/lib/language-provider/locales/en-us.json +117 -0
  37. package/lib/language-provider/locales/fa-ir.json +109 -0
  38. package/lib/language-provider/locales/it-it.json +109 -0
  39. package/lib/language-provider/locales/vi-vn.json +96 -0
  40. package/lib/multi-column/MultiColumnRow.js +137 -0
  41. package/lib/multi-column/dustbin.js +156 -0
  42. package/lib/multi-column/grip.js +52 -0
  43. package/lib/multi-column/index.js +24 -0
  44. package/lib/preview.js +392 -0
  45. package/lib/sortable-element.js +177 -0
  46. package/lib/sortable-form-elements.js +66 -0
  47. package/lib/stores/registry.js +42 -0
  48. package/lib/stores/requests.js +31 -0
  49. package/lib/stores/store.js +139 -0
  50. package/lib/toolbar-draggable-item.js +60 -0
  51. package/lib/toolbar-group-item.js +40 -0
  52. package/lib/toolbar.js +726 -0
  53. package/package.json +118 -0
  54. package/types/index.d.ts +184 -0
package/lib/toolbar.js ADDED
@@ -0,0 +1,726 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = void 0;
8
+ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
9
+ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
10
+ var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
11
+ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
12
+ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
13
+ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
14
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
+ var _react = _interopRequireDefault(require("react"));
16
+ var _reactIntl = require("react-intl");
17
+ var _toolbarDraggableItem = _interopRequireDefault(require("./toolbar-draggable-item"));
18
+ var _toolbarGroupItem = _interopRequireDefault(require("./toolbar-group-item"));
19
+ var _UUID = _interopRequireDefault(require("./UUID"));
20
+ var _store = _interopRequireDefault(require("./stores/store"));
21
+ var _functions = require("./functions");
22
+ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
23
+ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
24
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
25
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /**
26
+ * <Toolbar />
27
+ */
28
+ // function isDefaultItem(item) {
29
+ // const keys = Object.keys(item);
30
+ // return keys.filter(x => x !== 'element' && x !== 'key' && x !== 'group_name').length === 0;
31
+ // }
32
+
33
+ function buildItems(items, defaultItems) {
34
+ if (!items) {
35
+ return defaultItems;
36
+ }
37
+ return items.map(function (x) {
38
+ var found = defaultItems.find(function (y) {
39
+ return x.element === y.element && y.key === x.key;
40
+ });
41
+ if (!found) {
42
+ found = defaultItems.find(function (y) {
43
+ return (x.element || x.key) === (y.element || y.key);
44
+ });
45
+ }
46
+ if (found) {
47
+ if (x.inherited !== false) {
48
+ found = _objectSpread(_objectSpread({}, found), x);
49
+ } else if (x.group_name) {
50
+ found.group_name = x.group_name;
51
+ }
52
+ }
53
+ return found || x;
54
+ });
55
+ }
56
+ function buildGroupItems(allItems) {
57
+ var items = allItems.filter(function (x) {
58
+ return !x.group_name;
59
+ });
60
+ var gItems = allItems.filter(function (x) {
61
+ return !!x.group_name;
62
+ });
63
+ var grouped = (0, _functions.groupBy)(gItems, function (x) {
64
+ return x.group_name;
65
+ });
66
+ var groupKeys = gItems.map(function (x) {
67
+ return x.group_name;
68
+ }).filter(function (v, i, self) {
69
+ return self.indexOf(v) === i;
70
+ });
71
+ return {
72
+ items: items,
73
+ grouped: grouped,
74
+ groupKeys: groupKeys
75
+ };
76
+ }
77
+ var Toolbar = /*#__PURE__*/function (_React$Component) {
78
+ (0, _inherits2["default"])(Toolbar, _React$Component);
79
+ var _super = _createSuper(Toolbar);
80
+ function Toolbar(props) {
81
+ var _this;
82
+ (0, _classCallCheck2["default"])(this, Toolbar);
83
+ _this = _super.call(this, props);
84
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "renderItem", function (item) {
85
+ return /*#__PURE__*/_react["default"].createElement(_toolbarDraggableItem["default"], {
86
+ data: item,
87
+ key: item.key,
88
+ onClick: _this._onClick.bind((0, _assertThisInitialized2["default"])(_this), item),
89
+ onCreate: _this.create
90
+ });
91
+ });
92
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "togglePin", function () {
93
+ _this.setState(function (prevState) {
94
+ return {
95
+ isPinned: !prevState.isPinned
96
+ };
97
+ });
98
+ });
99
+ var intl = _this.props.intl;
100
+ var items = buildItems(props.items, _this._defaultItems(intl));
101
+ _this.state = {
102
+ items: items,
103
+ isPinned: false
104
+ };
105
+ _this.create = _this.create.bind((0, _assertThisInitialized2["default"])(_this));
106
+ return _this;
107
+ }
108
+ (0, _createClass2["default"])(Toolbar, [{
109
+ key: "componentDidMount",
110
+ value: function componentDidMount() {
111
+ var _this2 = this;
112
+ _store["default"].subscribe(function (state) {
113
+ return _this2.setState({
114
+ store: state
115
+ });
116
+ });
117
+ }
118
+ }, {
119
+ key: "_defaultItems",
120
+ value: function _defaultItems(intl) {
121
+ return [{
122
+ key: 'Header',
123
+ name: intl.formatMessage({
124
+ id: 'header-text'
125
+ }),
126
+ icon: 'fas fa-heading',
127
+ "static": true,
128
+ content: intl.formatMessage({
129
+ id: 'place-holder-text'
130
+ })
131
+ }, {
132
+ key: 'Label',
133
+ name: intl.formatMessage({
134
+ id: 'label'
135
+ }),
136
+ "static": true,
137
+ icon: 'fas fa-font',
138
+ content: intl.formatMessage({
139
+ id: 'place-holder-text'
140
+ })
141
+ }, {
142
+ key: 'Paragraph',
143
+ name: intl.formatMessage({
144
+ id: 'paragraph'
145
+ }),
146
+ "static": true,
147
+ icon: 'fas fa-paragraph',
148
+ content: intl.formatMessage({
149
+ id: 'place-holder-text'
150
+ })
151
+ }, {
152
+ key: 'LineBreak',
153
+ name: intl.formatMessage({
154
+ id: 'line-break'
155
+ }),
156
+ "static": true,
157
+ icon: 'fas fa-arrows-alt-h'
158
+ }, {
159
+ key: 'Dropdown',
160
+ canHaveAnswer: true,
161
+ name: intl.formatMessage({
162
+ id: 'dropdown'
163
+ }),
164
+ icon: 'far fa-caret-square-down',
165
+ label: intl.formatMessage({
166
+ id: 'place-holder-label'
167
+ }),
168
+ field_name: 'dropdown_',
169
+ options: []
170
+ }, {
171
+ key: 'Tags',
172
+ canHaveAnswer: true,
173
+ name: intl.formatMessage({
174
+ id: 'tags'
175
+ }),
176
+ icon: 'fas fa-tags',
177
+ label: intl.formatMessage({
178
+ id: 'place-holder-label'
179
+ }),
180
+ field_name: 'tags_',
181
+ options: []
182
+ }, {
183
+ key: 'Checkboxes',
184
+ canHaveAnswer: true,
185
+ name: intl.formatMessage({
186
+ id: 'checkboxes'
187
+ }),
188
+ icon: 'far fa-check-square',
189
+ label: intl.formatMessage({
190
+ id: 'place-holder-label'
191
+ }),
192
+ field_name: 'checkboxes_',
193
+ options: []
194
+ }, {
195
+ key: 'RadioButtons',
196
+ canHaveAnswer: true,
197
+ name: intl.formatMessage({
198
+ id: 'multiple-choice'
199
+ }),
200
+ icon: 'far fa-dot-circle',
201
+ label: intl.formatMessage({
202
+ id: 'place-holder-label'
203
+ }),
204
+ field_name: 'radiobuttons_',
205
+ options: []
206
+ }, {
207
+ key: 'TextInput',
208
+ canHaveAnswer: true,
209
+ name: intl.formatMessage({
210
+ id: 'text-input'
211
+ }),
212
+ label: intl.formatMessage({
213
+ id: 'place-holder-label'
214
+ }),
215
+ icon: 'fas fa-font',
216
+ field_name: 'text_input_'
217
+ }, {
218
+ key: 'EmailInput',
219
+ canHaveAnswer: true,
220
+ name: intl.formatMessage({
221
+ id: 'email-input'
222
+ }),
223
+ label: intl.formatMessage({
224
+ id: 'place-holder-email'
225
+ }),
226
+ icon: 'fas fa-envelope',
227
+ field_name: 'email_input_'
228
+ }, {
229
+ key: 'NumberInput',
230
+ canHaveAnswer: true,
231
+ name: intl.formatMessage({
232
+ id: 'number-input'
233
+ }),
234
+ label: intl.formatMessage({
235
+ id: 'place-holder-label'
236
+ }),
237
+ icon: 'fas fa-plus',
238
+ field_name: 'number_input_'
239
+ }, {
240
+ key: 'PhoneNumber',
241
+ canHaveAnswer: true,
242
+ name: intl.formatMessage({
243
+ id: 'phone-input'
244
+ }),
245
+ label: intl.formatMessage({
246
+ id: 'place-holder-phone-number'
247
+ }),
248
+ icon: 'fas fa-phone',
249
+ field_name: 'phone_input_'
250
+ }, {
251
+ key: 'TextArea',
252
+ canHaveAnswer: true,
253
+ name: intl.formatMessage({
254
+ id: 'multi-line-input'
255
+ }),
256
+ label: intl.formatMessage({
257
+ id: 'place-holder-label'
258
+ }),
259
+ icon: 'fas fa-text-height',
260
+ field_name: 'text_area_'
261
+ }, {
262
+ key: 'FieldSet',
263
+ canHaveAnswer: false,
264
+ name: intl.formatMessage({
265
+ id: 'fieldset'
266
+ }),
267
+ label: intl.formatMessage({
268
+ id: 'fieldset'
269
+ }),
270
+ icon: 'fas fa-bars',
271
+ field_name: 'fieldset-element'
272
+ }, {
273
+ key: 'TwoColumnRow',
274
+ canHaveAnswer: false,
275
+ name: intl.formatMessage({
276
+ id: 'two-columns-row'
277
+ }),
278
+ label: '',
279
+ icon: 'fas fa-columns',
280
+ field_name: 'two_col_row_'
281
+ }, {
282
+ key: 'ThreeColumnRow',
283
+ canHaveAnswer: false,
284
+ name: intl.formatMessage({
285
+ id: 'three-columns-row'
286
+ }),
287
+ label: '',
288
+ icon: 'fas fa-columns',
289
+ field_name: 'three_col_row_'
290
+ }, {
291
+ key: 'FourColumnRow',
292
+ element: 'MultiColumnRow',
293
+ canHaveAnswer: false,
294
+ name: intl.formatMessage({
295
+ id: 'four-columns-row'
296
+ }),
297
+ label: '',
298
+ icon: 'fas fa-columns',
299
+ field_name: 'four_col_row_',
300
+ col_count: 4,
301
+ class_name: 'col-md-3'
302
+ }, {
303
+ key: 'FiveColumnRow',
304
+ element: 'MultiColumnRow',
305
+ canHaveAnswer: false,
306
+ name: intl.formatMessage({
307
+ id: 'five-columns-row'
308
+ }),
309
+ label: '',
310
+ icon: 'fas fa-columns',
311
+ field_name: 'five_col_row_',
312
+ col_count: 5,
313
+ class_name: 'col'
314
+ }, {
315
+ key: 'SixColumnRow',
316
+ element: 'MultiColumnRow',
317
+ canHaveAnswer: false,
318
+ name: intl.formatMessage({
319
+ id: 'six-columns-row'
320
+ }),
321
+ label: '',
322
+ icon: 'fas fa-columns',
323
+ field_name: 'six_col_row_',
324
+ col_count: 6,
325
+ class_name: 'col-md-2'
326
+ }, {
327
+ key: 'Image',
328
+ name: intl.formatMessage({
329
+ id: 'image'
330
+ }),
331
+ label: '',
332
+ icon: 'far fa-image',
333
+ field_name: 'image_',
334
+ src: ''
335
+ }, {
336
+ key: 'Rating',
337
+ canHaveAnswer: true,
338
+ name: intl.formatMessage({
339
+ id: 'rating'
340
+ }),
341
+ label: intl.formatMessage({
342
+ id: 'place-holder-label'
343
+ }),
344
+ icon: 'fas fa-star',
345
+ field_name: 'rating_'
346
+ }, {
347
+ key: 'DatePicker',
348
+ canDefaultToday: true,
349
+ canReadOnly: true,
350
+ dateFormat: 'MM/dd/yyyy',
351
+ timeFormat: 'hh:mm aa',
352
+ showTimeSelect: false,
353
+ showTimeSelectOnly: false,
354
+ showTimeInput: false,
355
+ name: intl.formatMessage({
356
+ id: 'date'
357
+ }),
358
+ icon: 'far fa-calendar-alt',
359
+ label: intl.formatMessage({
360
+ id: 'place-holder-label'
361
+ }),
362
+ field_name: 'date_picker_'
363
+ }, {
364
+ key: 'Signature',
365
+ canReadOnly: true,
366
+ name: intl.formatMessage({
367
+ id: 'signature'
368
+ }),
369
+ icon: 'fas fa-pen-square',
370
+ label: intl.formatMessage({
371
+ id: 'signature'
372
+ }),
373
+ field_name: 'signature_'
374
+ }, {
375
+ key: 'HyperLink',
376
+ name: intl.formatMessage({
377
+ id: 'website'
378
+ }),
379
+ icon: 'fas fa-link',
380
+ "static": true,
381
+ content: intl.formatMessage({
382
+ id: 'place-holder-website-link'
383
+ }),
384
+ href: 'http://www.example.com'
385
+ }, {
386
+ key: 'Download',
387
+ name: intl.formatMessage({
388
+ id: 'file-attachment'
389
+ }),
390
+ icon: 'fas fa-file',
391
+ "static": true,
392
+ content: intl.formatMessage({
393
+ id: 'place-holder-file-name'
394
+ }),
395
+ field_name: 'download_',
396
+ file_path: '',
397
+ _href: ''
398
+ }, {
399
+ key: 'Range',
400
+ name: intl.formatMessage({
401
+ id: 'range'
402
+ }),
403
+ icon: 'fas fa-sliders-h',
404
+ label: intl.formatMessage({
405
+ id: 'place-holder-label'
406
+ }),
407
+ field_name: 'range_',
408
+ step: 1,
409
+ default_value: 3,
410
+ min_value: 1,
411
+ max_value: 5,
412
+ min_label: intl.formatMessage({
413
+ id: 'easy'
414
+ }),
415
+ max_label: intl.formatMessage({
416
+ id: 'difficult'
417
+ })
418
+ }, {
419
+ key: 'Camera',
420
+ name: intl.formatMessage({
421
+ id: 'camera'
422
+ }),
423
+ icon: 'fas fa-camera',
424
+ label: intl.formatMessage({
425
+ id: 'place-holder-label'
426
+ }),
427
+ field_name: 'camera_',
428
+ label_after_camera_icon: intl.formatMessage({
429
+ id: 'place-holder-display-label-after-camera-icon'
430
+ }),
431
+ message_under_camera_icon: intl.formatMessage({
432
+ id: 'place-holder-display-message-under-camera-icon'
433
+ }),
434
+ label_after_photo_clear_icon: intl.formatMessage({
435
+ id: 'place-holder-display-label-after-photo-clear-icon'
436
+ })
437
+ }, {
438
+ key: 'FileUpload',
439
+ name: intl.formatMessage({
440
+ id: 'file-upload'
441
+ }),
442
+ icon: 'fas fa-file',
443
+ label: intl.formatMessage({
444
+ id: 'place-holder-label'
445
+ }),
446
+ field_name: 'file_upload_',
447
+ label_after_file_icon: intl.formatMessage({
448
+ id: 'place-holder-display-label-after-file-icon'
449
+ }),
450
+ message_under_file_icon: intl.formatMessage({
451
+ id: 'place-holder-display-message-under-file-icon'
452
+ }),
453
+ label_after_file_clear_icon: intl.formatMessage({
454
+ id: 'place-holder-display-label-after-file-clear-icon'
455
+ })
456
+ }];
457
+ }
458
+ }, {
459
+ key: "addCustomOptions",
460
+ value: function addCustomOptions(item, elementOptions) {
461
+ if (item.type === 'custom') {
462
+ var customOptions = Object.assign({}, item, elementOptions);
463
+ customOptions.custom = true;
464
+ customOptions.component = item.component || null;
465
+ customOptions.custom_options = item.custom_options || [];
466
+ return customOptions;
467
+ }
468
+ return elementOptions;
469
+ }
470
+ }, {
471
+ key: "create",
472
+ value: function create(item) {
473
+ var intl = this.props.intl;
474
+ var elementKey = item.element || item.key;
475
+ var elementOptions = this.addCustomOptions(item, {
476
+ id: _UUID["default"].uuid(),
477
+ element: elementKey,
478
+ text: item.name,
479
+ group_name: item.group_name,
480
+ "static": item["static"],
481
+ required: false,
482
+ showDescription: item.showDescription
483
+ });
484
+ if (this.props.showDescription === true && !item["static"]) {
485
+ elementOptions.showDescription = true;
486
+ }
487
+ if (item["static"]) {
488
+ elementOptions.bold = false;
489
+ elementOptions.italic = false;
490
+ }
491
+ if (item.canHaveAnswer) {
492
+ elementOptions.canHaveAnswer = item.canHaveAnswer;
493
+ }
494
+ if (item.canReadOnly) {
495
+ elementOptions.readOnly = false;
496
+ }
497
+ if (item.canDefaultToday) {
498
+ elementOptions.defaultToday = false;
499
+ }
500
+ if (item.content) {
501
+ elementOptions.content = item.content;
502
+ }
503
+ if (item.href) {
504
+ elementOptions.href = item.href;
505
+ }
506
+ if (item.inherited !== undefined) {
507
+ elementOptions.inherited = item.inherited;
508
+ }
509
+ elementOptions.canHavePageBreakBefore = item.canHavePageBreakBefore !== false;
510
+ elementOptions.canHaveAlternateForm = item.canHaveAlternateForm !== false;
511
+ elementOptions.canHaveDisplayHorizontal = item.canHaveDisplayHorizontal !== false;
512
+ if (elementOptions.canHaveDisplayHorizontal) {
513
+ elementOptions.inline = item.inline;
514
+ }
515
+ elementOptions.canHaveOptionCorrect = item.canHaveOptionCorrect !== false;
516
+ elementOptions.canHaveOptionValue = item.canHaveOptionValue !== false;
517
+ elementOptions.canPopulateFromApi = item.canPopulateFromApi !== false;
518
+ if (item.class_name) {
519
+ elementOptions.class_name = item.class_name;
520
+ }
521
+ if (elementKey === 'Image') {
522
+ elementOptions.src = item.src;
523
+ }
524
+ if (elementKey === 'DatePicker') {
525
+ elementOptions.dateFormat = item.dateFormat;
526
+ elementOptions.timeFormat = item.timeFormat;
527
+ elementOptions.showTimeSelect = item.showTimeSelect;
528
+ elementOptions.showTimeSelectOnly = item.showTimeSelectOnly;
529
+ elementOptions.showTimeInput = item.showTimeInput;
530
+ }
531
+ if (elementKey === 'Download') {
532
+ elementOptions._href = item._href;
533
+ elementOptions.file_path = item.file_path;
534
+ }
535
+ if (elementKey === 'Range') {
536
+ elementOptions.step = item.step;
537
+ elementOptions.default_value = item.default_value;
538
+ elementOptions.min_value = item.min_value;
539
+ elementOptions.max_value = item.max_value;
540
+ elementOptions.min_label = item.min_label;
541
+ elementOptions.max_label = item.max_label;
542
+ }
543
+ if (elementKey === 'Camera') {
544
+ elementOptions.label_after_camera_icon = item.label_after_camera_icon;
545
+ elementOptions.message_under_camera_icon = item.message_under_camera_icon;
546
+ elementOptions.label_after_photo_clear_icon = item.label_after_photo_clear_icon;
547
+ }
548
+ if (elementKey === 'FileUpload') {
549
+ elementOptions.label_after_file_icon = item.label_after_file_icon;
550
+ elementOptions.message_under_file_icon = item.message_under_file_icon;
551
+ elementOptions.label_after_file_clear_icon = item.label_after_file_clear_icon;
552
+ }
553
+ if (item.element === 'MultiColumnRow') {
554
+ elementOptions.col_count = item.col_count;
555
+ }
556
+ if (item.defaultValue) {
557
+ elementOptions.defaultValue = item.defaultValue;
558
+ }
559
+ if (item.field_name) {
560
+ elementOptions.field_name = item.field_name + _UUID["default"].uuid();
561
+ }
562
+ if (item.label) {
563
+ elementOptions.label = item.label;
564
+ }
565
+ if (item.options) {
566
+ if (item.options.length > 0) {
567
+ elementOptions.options = item.options.map(function (x) {
568
+ return _objectSpread(_objectSpread({}, x), {}, {
569
+ key: "custom_option_".concat(_UUID["default"].uuid())
570
+ });
571
+ });
572
+ } else {
573
+ elementOptions.options = Toolbar._defaultItemOptions(elementOptions.element, intl);
574
+ }
575
+ }
576
+ return elementOptions;
577
+ }
578
+ }, {
579
+ key: "_onClick",
580
+ value: function _onClick(item) {
581
+ // ElementActions.createElement(this.create(item));
582
+ _store["default"].dispatch('create', this.create(item));
583
+ }
584
+ }, {
585
+ key: "render",
586
+ value: function render() {
587
+ var _this3 = this;
588
+ var _buildGroupItems = buildGroupItems(this.state.items),
589
+ items = _buildGroupItems.items,
590
+ grouped = _buildGroupItems.grouped,
591
+ groupKeys = _buildGroupItems.groupKeys;
592
+ return /*#__PURE__*/_react["default"].createElement("div", {
593
+ className: "col-md-3 react-form-builder-toolbar float-right",
594
+ style: {
595
+ position: this.state.isPinned ? 'fixed' : '',
596
+ // set up the vertical boundary by top/bottom,
597
+ // so later you can set height relative to the boundary to use scrollable bar.
598
+ top: this.state.isPinned ? '10%' : '',
599
+ bottom: this.state.isPinned ? '10%' : '',
600
+ right: this.state.isPinned ? '5%' : ''
601
+ }
602
+ }, /*#__PURE__*/_react["default"].createElement("div", {
603
+ style: {
604
+ display: 'flex'
605
+ }
606
+ }, /*#__PURE__*/_react["default"].createElement("button", {
607
+ onClick: this.togglePin,
608
+ style: {
609
+ marginBottom: '5px',
610
+ background: 'none',
611
+ outline: 'none',
612
+ // ✅ Removes the border when clicked
613
+ border: 'none',
614
+ transform: this.state.isPinned ? 'rotate(-45deg)' : 'rotate(90deg)',
615
+ // Rotates downward when pinned
616
+ transition: 'transform 0.2s ease-in-out'
617
+ }
618
+ }, "\uD83D\uDCCC"), /*#__PURE__*/_react["default"].createElement("h4", null, this.props.intl.formatMessage({
619
+ id: 'toolbox'
620
+ }))), /*#__PURE__*/_react["default"].createElement("div", {
621
+ style: {
622
+ overflowY: this.state.isPinned ? 'scroll' : '',
623
+ height: this.state.isPinned ? '90%' : ''
624
+ }
625
+ }, /*#__PURE__*/_react["default"].createElement("ul", null, items.map(this.renderItem), groupKeys.map(function (k) {
626
+ return /*#__PURE__*/_react["default"].createElement(_toolbarGroupItem["default"], {
627
+ key: k,
628
+ name: k,
629
+ group: grouped.get(k),
630
+ renderItem: _this3.renderItem
631
+ });
632
+ }))));
633
+ }
634
+ }], [{
635
+ key: "_defaultItemOptions",
636
+ value: function _defaultItemOptions(element, intl) {
637
+ switch (element) {
638
+ case 'Dropdown':
639
+ return [{
640
+ value: 'place_holder_option_1',
641
+ text: intl.formatMessage({
642
+ id: 'place-holder-option-1'
643
+ }),
644
+ key: "dropdown_option_".concat(_UUID["default"].uuid())
645
+ }, {
646
+ value: 'place_holder_option_2',
647
+ text: intl.formatMessage({
648
+ id: 'place-holder-option-2'
649
+ }),
650
+ key: "dropdown_option_".concat(_UUID["default"].uuid())
651
+ }, {
652
+ value: 'place_holder_option_3',
653
+ text: intl.formatMessage({
654
+ id: 'place-holder-option-3'
655
+ }),
656
+ key: "dropdown_option_".concat(_UUID["default"].uuid())
657
+ }];
658
+ case 'Tags':
659
+ return [{
660
+ value: 'place_holder_tag_1',
661
+ text: intl.formatMessage({
662
+ id: 'place-holder-tag-1'
663
+ }),
664
+ key: "tags_option_".concat(_UUID["default"].uuid())
665
+ }, {
666
+ value: 'place_holder_tag_2',
667
+ text: intl.formatMessage({
668
+ id: 'place-holder-tag-2'
669
+ }),
670
+ key: "tags_option_".concat(_UUID["default"].uuid())
671
+ }, {
672
+ value: 'place_holder_tag_3',
673
+ text: intl.formatMessage({
674
+ id: 'place-holder-tag-3'
675
+ }),
676
+ key: "tags_option_".concat(_UUID["default"].uuid())
677
+ }];
678
+ case 'Checkboxes':
679
+ return [{
680
+ value: 'place_holder_option_1',
681
+ text: intl.formatMessage({
682
+ id: 'place-holder-option-1'
683
+ }),
684
+ key: "checkboxes_option_".concat(_UUID["default"].uuid())
685
+ }, {
686
+ value: 'place_holder_option_2',
687
+ text: intl.formatMessage({
688
+ id: 'place-holder-option-2'
689
+ }),
690
+ key: "checkboxes_option_".concat(_UUID["default"].uuid())
691
+ }, {
692
+ value: 'place_holder_option_3',
693
+ text: intl.formatMessage({
694
+ id: 'place-holder-option-3'
695
+ }),
696
+ key: "checkboxes_option_".concat(_UUID["default"].uuid())
697
+ }];
698
+ case 'RadioButtons':
699
+ return [{
700
+ value: 'place_holder_option_1',
701
+ text: intl.formatMessage({
702
+ id: 'place-holder-option-1'
703
+ }),
704
+ key: "radiobuttons_option_".concat(_UUID["default"].uuid())
705
+ }, {
706
+ value: 'place_holder_option_2',
707
+ text: intl.formatMessage({
708
+ id: 'place-holder-option-2'
709
+ }),
710
+ key: "radiobuttons_option_".concat(_UUID["default"].uuid())
711
+ }, {
712
+ value: 'place_holder_option_3',
713
+ text: intl.formatMessage({
714
+ id: 'place-holder-option-3'
715
+ }),
716
+ key: "radiobuttons_option_".concat(_UUID["default"].uuid())
717
+ }];
718
+ default:
719
+ return [];
720
+ }
721
+ }
722
+ }]);
723
+ return Toolbar;
724
+ }(_react["default"].Component);
725
+ var _default = (0, _reactIntl.injectIntl)(Toolbar);
726
+ exports["default"] = _default;