@arbisoft/react-design-tool 1.0.21 → 1.0.23

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 (6) hide show
  1. package/README.md +36 -10
  2. package/dist/cjs/index.js +359 -559
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/esm/index.js +359 -559
  5. package/dist/esm/index.js.map +1 -1
  6. package/package.json +78 -78
package/dist/cjs/index.js CHANGED
@@ -186,306 +186,115 @@ function _objectWithoutPropertiesLoose(r, e) {
186
186
  }
187
187
  return t;
188
188
  }
189
- function _regeneratorRuntime() {
190
- _regeneratorRuntime = function () {
191
- return e;
192
- };
193
- var t,
194
- e = {},
195
- r = Object.prototype,
196
- n = r.hasOwnProperty,
197
- o = Object.defineProperty || function (t, e, r) {
198
- t[e] = r.value;
199
- },
200
- i = "function" == typeof Symbol ? Symbol : {},
201
- a = i.iterator || "@@iterator",
202
- c = i.asyncIterator || "@@asyncIterator",
203
- u = i.toStringTag || "@@toStringTag";
204
- function define(t, e, r) {
205
- return Object.defineProperty(t, e, {
206
- value: r,
207
- enumerable: true,
208
- configurable: true,
209
- writable: true
210
- }), t[e];
211
- }
212
- try {
213
- define({}, "");
214
- } catch (t) {
215
- define = function (t, e, r) {
216
- return t[e] = r;
217
- };
218
- }
219
- function wrap(t, e, r, n) {
220
- var i = e && e.prototype instanceof Generator ? e : Generator,
221
- a = Object.create(i.prototype),
222
- c = new Context(n || []);
223
- return o(a, "_invoke", {
224
- value: makeInvokeMethod(t, r, c)
225
- }), a;
226
- }
227
- function tryCatch(t, e, r) {
228
- try {
229
- return {
230
- type: "normal",
231
- arg: t.call(e, r)
232
- };
233
- } catch (t) {
234
- return {
235
- type: "throw",
236
- arg: t
237
- };
238
- }
239
- }
240
- e.wrap = wrap;
241
- var h = "suspendedStart",
242
- l = "suspendedYield",
243
- f = "executing",
244
- s = "completed",
245
- y = {};
246
- function Generator() {}
247
- function GeneratorFunction() {}
248
- function GeneratorFunctionPrototype() {}
249
- var p = {};
250
- define(p, a, function () {
251
- return this;
252
- });
253
- var d = Object.getPrototypeOf,
254
- v = d && d(d(values([])));
255
- v && v !== r && n.call(v, a) && (p = v);
256
- var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p);
257
- function defineIteratorMethods(t) {
258
- ["next", "throw", "return"].forEach(function (e) {
259
- define(t, e, function (t) {
260
- return this._invoke(e, t);
261
- });
262
- });
263
- }
264
- function AsyncIterator(t, e) {
265
- function invoke(r, o, i, a) {
266
- var c = tryCatch(t[r], t, o);
267
- if ("throw" !== c.type) {
268
- var u = c.arg,
269
- h = u.value;
270
- return h && "object" == typeof h && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) {
271
- invoke("next", t, i, a);
272
- }, function (t) {
273
- invoke("throw", t, i, a);
274
- }) : e.resolve(h).then(function (t) {
275
- u.value = t, i(u);
276
- }, function (t) {
277
- return invoke("throw", t, i, a);
278
- });
279
- }
280
- a(c.arg);
281
- }
282
- var r;
283
- o(this, "_invoke", {
284
- value: function (t, n) {
285
- function callInvokeWithMethodAndArg() {
286
- return new e(function (e, r) {
287
- invoke(t, n, e, r);
288
- });
189
+ function _regenerator() {
190
+ /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
191
+ var e,
192
+ t,
193
+ r = "function" == typeof Symbol ? Symbol : {},
194
+ n = r.iterator || "@@iterator",
195
+ o = r.toStringTag || "@@toStringTag";
196
+ function i(r, n, o, i) {
197
+ var c = n && n.prototype instanceof Generator ? n : Generator,
198
+ u = Object.create(c.prototype);
199
+ return _regeneratorDefine(u, "_invoke", function (r, n, o) {
200
+ var i,
201
+ c,
202
+ u,
203
+ f = 0,
204
+ p = o || [],
205
+ y = false,
206
+ G = {
207
+ p: 0,
208
+ n: 0,
209
+ v: e,
210
+ a: d,
211
+ f: d.bind(e, 4),
212
+ d: function (t, r) {
213
+ return i = t, c = 0, u = e, G.n = r, a;
214
+ }
215
+ };
216
+ function d(r, n) {
217
+ for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) {
218
+ var o,
219
+ i = p[t],
220
+ d = G.p,
221
+ l = i[2];
222
+ r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0));
289
223
  }
290
- return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg();
224
+ if (o || r > 1) return a;
225
+ throw y = true, n;
291
226
  }
292
- });
293
- }
294
- function makeInvokeMethod(e, r, n) {
295
- var o = h;
296
- return function (i, a) {
297
- if (o === f) throw Error("Generator is already running");
298
- if (o === s) {
299
- if ("throw" === i) throw a;
227
+ return function (o, p, l) {
228
+ if (f > 1) throw TypeError("Generator is already running");
229
+ for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) {
230
+ i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u);
231
+ try {
232
+ if (f = 2, i) {
233
+ if (c || (o = "next"), t = i[o]) {
234
+ if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object");
235
+ if (!t.done) return t;
236
+ u = t.value, c < 2 && (c = 0);
237
+ } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1);
238
+ i = e;
239
+ } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break;
240
+ } catch (t) {
241
+ i = e, c = 1, u = t;
242
+ } finally {
243
+ f = 1;
244
+ }
245
+ }
300
246
  return {
301
247
  value: t,
302
- done: true
248
+ done: y
303
249
  };
304
- }
305
- for (n.method = i, n.arg = a;;) {
306
- var c = n.delegate;
307
- if (c) {
308
- var u = maybeInvokeDelegate(c, n);
309
- if (u) {
310
- if (u === y) continue;
311
- return u;
312
- }
313
- }
314
- if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) {
315
- if (o === h) throw o = s, n.arg;
316
- n.dispatchException(n.arg);
317
- } else "return" === n.method && n.abrupt("return", n.arg);
318
- o = f;
319
- var p = tryCatch(e, r, n);
320
- if ("normal" === p.type) {
321
- if (o = n.done ? s : l, p.arg === y) continue;
322
- return {
323
- value: p.arg,
324
- done: n.done
325
- };
326
- }
327
- "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg);
328
- }
329
- };
330
- }
331
- function maybeInvokeDelegate(e, r) {
332
- var n = r.method,
333
- o = e.iterator[n];
334
- if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y;
335
- var i = tryCatch(o, e.iterator, r.arg);
336
- if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y;
337
- var a = i.arg;
338
- return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y);
339
- }
340
- function pushTryEntry(t) {
341
- var e = {
342
- tryLoc: t[0]
343
- };
344
- 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e);
345
- }
346
- function resetTryEntry(t) {
347
- var e = t.completion || {};
348
- e.type = "normal", delete e.arg, t.completion = e;
349
- }
350
- function Context(t) {
351
- this.tryEntries = [{
352
- tryLoc: "root"
353
- }], t.forEach(pushTryEntry, this), this.reset(true);
250
+ };
251
+ }(r, o, i), true), u;
354
252
  }
355
- function values(e) {
356
- if (e || "" === e) {
357
- var r = e[a];
358
- if (r) return r.call(e);
359
- if ("function" == typeof e.next) return e;
360
- if (!isNaN(e.length)) {
361
- var o = -1,
362
- i = function next() {
363
- for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = false, next;
364
- return next.value = t, next.done = true, next;
365
- };
366
- return i.next = i;
367
- }
368
- }
369
- throw new TypeError(typeof e + " is not iterable");
253
+ var a = {};
254
+ function Generator() {}
255
+ function GeneratorFunction() {}
256
+ function GeneratorFunctionPrototype() {}
257
+ t = Object.getPrototypeOf;
258
+ var c = [][n] ? t(t([][n]())) : (_regeneratorDefine(t = {}, n, function () {
259
+ return this;
260
+ }), t),
261
+ u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c);
262
+ function f(e) {
263
+ return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e;
370
264
  }
371
- return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", {
372
- value: GeneratorFunctionPrototype,
373
- configurable: true
374
- }), o(GeneratorFunctionPrototype, "constructor", {
375
- value: GeneratorFunction,
376
- configurable: true
377
- }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) {
378
- var e = "function" == typeof t && t.constructor;
379
- return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name));
380
- }, e.mark = function (t) {
381
- return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t;
382
- }, e.awrap = function (t) {
383
- return {
384
- __await: t
385
- };
386
- }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () {
265
+ return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine(u), _regeneratorDefine(u, o, "Generator"), _regeneratorDefine(u, n, function () {
387
266
  return this;
388
- }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) {
389
- void 0 === i && (i = Promise);
390
- var a = new AsyncIterator(wrap(t, r, n, o), i);
391
- return e.isGeneratorFunction(r) ? a : a.next().then(function (t) {
392
- return t.done ? t.value : a.next();
393
- });
394
- }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () {
395
- return this;
396
- }), define(g, "toString", function () {
267
+ }), _regeneratorDefine(u, "toString", function () {
397
268
  return "[object Generator]";
398
- }), e.keys = function (t) {
399
- var e = Object(t),
400
- r = [];
401
- for (var n in e) r.push(n);
402
- return r.reverse(), function next() {
403
- for (; r.length;) {
404
- var t = r.pop();
405
- if (t in e) return next.value = t, next.done = false, next;
406
- }
407
- return next.done = true, next;
269
+ }), (_regenerator = function () {
270
+ return {
271
+ w: i,
272
+ m: f
408
273
  };
409
- }, e.values = values, Context.prototype = {
410
- constructor: Context,
411
- reset: function (e) {
412
- if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = false, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t);
413
- },
414
- stop: function () {
415
- this.done = true;
416
- var t = this.tryEntries[0].completion;
417
- if ("throw" === t.type) throw t.arg;
418
- return this.rval;
419
- },
420
- dispatchException: function (e) {
421
- if (this.done) throw e;
422
- var r = this;
423
- function handle(n, o) {
424
- return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o;
425
- }
426
- for (var o = this.tryEntries.length - 1; o >= 0; --o) {
427
- var i = this.tryEntries[o],
428
- a = i.completion;
429
- if ("root" === i.tryLoc) return handle("end");
430
- if (i.tryLoc <= this.prev) {
431
- var c = n.call(i, "catchLoc"),
432
- u = n.call(i, "finallyLoc");
433
- if (c && u) {
434
- if (this.prev < i.catchLoc) return handle(i.catchLoc, true);
435
- if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
436
- } else if (c) {
437
- if (this.prev < i.catchLoc) return handle(i.catchLoc, true);
438
- } else {
439
- if (!u) throw Error("try statement without catch or finally");
440
- if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
441
- }
442
- }
443
- }
444
- },
445
- abrupt: function (t, e) {
446
- for (var r = this.tryEntries.length - 1; r >= 0; --r) {
447
- var o = this.tryEntries[r];
448
- if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) {
449
- var i = o;
450
- break;
451
- }
452
- }
453
- i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null);
454
- var a = i ? i.completion : {};
455
- return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a);
456
- },
457
- complete: function (t, e) {
458
- if ("throw" === t.type) throw t.arg;
459
- return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y;
460
- },
461
- finish: function (t) {
462
- for (var e = this.tryEntries.length - 1; e >= 0; --e) {
463
- var r = this.tryEntries[e];
464
- if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y;
465
- }
466
- },
467
- catch: function (t) {
468
- for (var e = this.tryEntries.length - 1; e >= 0; --e) {
469
- var r = this.tryEntries[e];
470
- if (r.tryLoc === t) {
471
- var n = r.completion;
472
- if ("throw" === n.type) {
473
- var o = n.arg;
474
- resetTryEntry(r);
475
- }
476
- return o;
477
- }
274
+ })();
275
+ }
276
+ function _regeneratorDefine(e, r, n, t) {
277
+ var i = Object.defineProperty;
278
+ try {
279
+ i({}, "", {});
280
+ } catch (e) {
281
+ i = 0;
282
+ }
283
+ _regeneratorDefine = function (e, r, n, t) {
284
+ if (r) i ? i(e, r, {
285
+ value: n,
286
+ enumerable: !t,
287
+ configurable: !t,
288
+ writable: !t
289
+ }) : e[r] = n;else {
290
+ function o(r, n) {
291
+ _regeneratorDefine(e, r, function (e) {
292
+ return this._invoke(r, n, e);
293
+ });
478
294
  }
479
- throw Error("illegal catch attempt");
480
- },
481
- delegateYield: function (e, r, n) {
482
- return this.delegate = {
483
- iterator: values(e),
484
- resultName: r,
485
- nextLoc: n
486
- }, "next" === this.method && (this.arg = t), y;
295
+ o("next", 0), o("throw", 1), o("return", 2);
487
296
  }
488
- }, e;
297
+ }, _regeneratorDefine(e, r, n, t);
489
298
  }
490
299
  function _slicedToArray(r, e) {
491
300
  return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
@@ -2125,15 +1934,15 @@ var StyledContainer$6 = styled.div(_templateObject$p || (_templateObject$p = _ta
2125
1934
  }, function (_ref9) {
2126
1935
  var disabled = _ref9.disabled;
2127
1936
  return disabled ? 'not-allowed' : 'pointer';
2128
- }, function (_ref10) {
2129
- var _ref10$gap = _ref10.gap,
2130
- gap = _ref10$gap === void 0 ? 0 : _ref10$gap;
1937
+ }, function (_ref0) {
1938
+ var _ref0$gap = _ref0.gap,
1939
+ gap = _ref0$gap === void 0 ? 0 : _ref0$gap;
2131
1940
  return "".concat(gap, "px");
2132
- }, function (_ref11) {
2133
- var disabled = _ref11.disabled;
1941
+ }, function (_ref1) {
1942
+ var disabled = _ref1.disabled;
2134
1943
  return disabled ? 0.5 : 1;
2135
- }, function (_ref12) {
2136
- var disabled = _ref12.disabled;
1944
+ }, function (_ref10) {
1945
+ var disabled = _ref10.disabled;
2137
1946
  return disabled ? 'none' : 'all';
2138
1947
  });
2139
1948
 
@@ -2381,78 +2190,78 @@ var StyledImage = styled.img(_templateObject$k || (_templateObject$k = _taggedTe
2381
2190
  var _ref9$marginLeft = _ref9.marginLeft,
2382
2191
  marginLeft = _ref9$marginLeft === void 0 ? 0 : _ref9$marginLeft;
2383
2192
  return "".concat(marginLeft, "px");
2384
- }, function (_ref10) {
2385
- var _ref10$paddingTop = _ref10.paddingTop,
2386
- paddingTop = _ref10$paddingTop === void 0 ? 0 : _ref10$paddingTop;
2193
+ }, function (_ref0) {
2194
+ var _ref0$paddingTop = _ref0.paddingTop,
2195
+ paddingTop = _ref0$paddingTop === void 0 ? 0 : _ref0$paddingTop;
2387
2196
  return "".concat(paddingTop, "px");
2388
- }, function (_ref11) {
2389
- var _ref11$paddingRight = _ref11.paddingRight,
2390
- paddingRight = _ref11$paddingRight === void 0 ? 0 : _ref11$paddingRight;
2197
+ }, function (_ref1) {
2198
+ var _ref1$paddingRight = _ref1.paddingRight,
2199
+ paddingRight = _ref1$paddingRight === void 0 ? 0 : _ref1$paddingRight;
2391
2200
  return "".concat(paddingRight, "px");
2392
- }, function (_ref12) {
2393
- var _ref12$paddingBottom = _ref12.paddingBottom,
2394
- paddingBottom = _ref12$paddingBottom === void 0 ? 0 : _ref12$paddingBottom;
2201
+ }, function (_ref10) {
2202
+ var _ref10$paddingBottom = _ref10.paddingBottom,
2203
+ paddingBottom = _ref10$paddingBottom === void 0 ? 0 : _ref10$paddingBottom;
2395
2204
  return "".concat(paddingBottom, "px");
2396
- }, function (_ref13) {
2397
- var _ref13$paddingLeft = _ref13.paddingLeft,
2398
- paddingLeft = _ref13$paddingLeft === void 0 ? 0 : _ref13$paddingLeft;
2205
+ }, function (_ref11) {
2206
+ var _ref11$paddingLeft = _ref11.paddingLeft,
2207
+ paddingLeft = _ref11$paddingLeft === void 0 ? 0 : _ref11$paddingLeft;
2399
2208
  return "".concat(paddingLeft, "px");
2400
- }, function (_ref14) {
2401
- var _ref14$borderRadius = _ref14.borderRadius,
2402
- borderRadius = _ref14$borderRadius === void 0 ? 0 : _ref14$borderRadius;
2209
+ }, function (_ref12) {
2210
+ var _ref12$borderRadius = _ref12.borderRadius,
2211
+ borderRadius = _ref12$borderRadius === void 0 ? 0 : _ref12$borderRadius;
2403
2212
  return "".concat(borderRadius, "px");
2404
2213
  });
2405
- var StyledText = styled.p(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n padding-top: ", ";\n padding-right: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n"])), function (_ref15) {
2406
- var fontFamily = _ref15.fontFamily;
2214
+ var StyledText = styled.p(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n padding-top: ", ";\n padding-right: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n"])), function (_ref13) {
2215
+ var fontFamily = _ref13.fontFamily;
2407
2216
  return fontFamily || theme.fonts.primary;
2408
- }, function (_ref16) {
2409
- var _ref16$fontSize = _ref16.fontSize,
2410
- fontSize = _ref16$fontSize === void 0 ? 14 : _ref16$fontSize;
2217
+ }, function (_ref14) {
2218
+ var _ref14$fontSize = _ref14.fontSize,
2219
+ fontSize = _ref14$fontSize === void 0 ? 14 : _ref14$fontSize;
2411
2220
  return "".concat(fontSize, "px");
2412
- }, function (_ref17) {
2413
- var color = _ref17.color;
2221
+ }, function (_ref15) {
2222
+ var color = _ref15.color;
2414
2223
  return color || theme.color.gray_700;
2415
- }, function (_ref18) {
2416
- var _ref18$fontWeight = _ref18.fontWeight,
2417
- fontWeight = _ref18$fontWeight === void 0 ? 400 : _ref18$fontWeight;
2224
+ }, function (_ref16) {
2225
+ var _ref16$fontWeight = _ref16.fontWeight,
2226
+ fontWeight = _ref16$fontWeight === void 0 ? 400 : _ref16$fontWeight;
2418
2227
  return fontWeight;
2419
- }, function (_ref19) {
2420
- var lineHeight = _ref19.lineHeight;
2228
+ }, function (_ref17) {
2229
+ var lineHeight = _ref17.lineHeight;
2421
2230
  return lineHeight || 'normal';
2422
- }, function (_ref20) {
2423
- var textAlign = _ref20.textAlign;
2231
+ }, function (_ref18) {
2232
+ var textAlign = _ref18.textAlign;
2424
2233
  return textAlign || 'left';
2425
- }, function (_ref21) {
2426
- var _ref21$marginTop = _ref21.marginTop,
2427
- marginTop = _ref21$marginTop === void 0 ? 0 : _ref21$marginTop;
2234
+ }, function (_ref19) {
2235
+ var _ref19$marginTop = _ref19.marginTop,
2236
+ marginTop = _ref19$marginTop === void 0 ? 0 : _ref19$marginTop;
2428
2237
  return "".concat(marginTop, "px");
2429
- }, function (_ref22) {
2430
- var _ref22$marginRight = _ref22.marginRight,
2431
- marginRight = _ref22$marginRight === void 0 ? 0 : _ref22$marginRight;
2238
+ }, function (_ref20) {
2239
+ var _ref20$marginRight = _ref20.marginRight,
2240
+ marginRight = _ref20$marginRight === void 0 ? 0 : _ref20$marginRight;
2432
2241
  return "".concat(marginRight, "px");
2433
- }, function (_ref23) {
2434
- var _ref23$marginBottom = _ref23.marginBottom,
2435
- marginBottom = _ref23$marginBottom === void 0 ? 0 : _ref23$marginBottom;
2242
+ }, function (_ref21) {
2243
+ var _ref21$marginBottom = _ref21.marginBottom,
2244
+ marginBottom = _ref21$marginBottom === void 0 ? 0 : _ref21$marginBottom;
2436
2245
  return "".concat(marginBottom, "px");
2437
- }, function (_ref24) {
2438
- var _ref24$marginLeft = _ref24.marginLeft,
2439
- marginLeft = _ref24$marginLeft === void 0 ? 0 : _ref24$marginLeft;
2246
+ }, function (_ref22) {
2247
+ var _ref22$marginLeft = _ref22.marginLeft,
2248
+ marginLeft = _ref22$marginLeft === void 0 ? 0 : _ref22$marginLeft;
2440
2249
  return "".concat(marginLeft, "px");
2441
- }, function (_ref25) {
2442
- var _ref25$paddingTop = _ref25.paddingTop,
2443
- paddingTop = _ref25$paddingTop === void 0 ? 0 : _ref25$paddingTop;
2250
+ }, function (_ref23) {
2251
+ var _ref23$paddingTop = _ref23.paddingTop,
2252
+ paddingTop = _ref23$paddingTop === void 0 ? 0 : _ref23$paddingTop;
2444
2253
  return "".concat(paddingTop, "px");
2445
- }, function (_ref26) {
2446
- var _ref26$paddingRight = _ref26.paddingRight,
2447
- paddingRight = _ref26$paddingRight === void 0 ? 0 : _ref26$paddingRight;
2254
+ }, function (_ref24) {
2255
+ var _ref24$paddingRight = _ref24.paddingRight,
2256
+ paddingRight = _ref24$paddingRight === void 0 ? 0 : _ref24$paddingRight;
2448
2257
  return "".concat(paddingRight, "px");
2449
- }, function (_ref27) {
2450
- var _ref27$paddingBottom = _ref27.paddingBottom,
2451
- paddingBottom = _ref27$paddingBottom === void 0 ? 0 : _ref27$paddingBottom;
2258
+ }, function (_ref25) {
2259
+ var _ref25$paddingBottom = _ref25.paddingBottom,
2260
+ paddingBottom = _ref25$paddingBottom === void 0 ? 0 : _ref25$paddingBottom;
2452
2261
  return "".concat(paddingBottom, "px");
2453
- }, function (_ref28) {
2454
- var _ref28$paddingLeft = _ref28.paddingLeft,
2455
- paddingLeft = _ref28$paddingLeft === void 0 ? 0 : _ref28$paddingLeft;
2262
+ }, function (_ref26) {
2263
+ var _ref26$paddingLeft = _ref26.paddingLeft,
2264
+ paddingLeft = _ref26$paddingLeft === void 0 ? 0 : _ref26$paddingLeft;
2456
2265
  return "".concat(paddingLeft, "px");
2457
2266
  });
2458
2267
 
@@ -2550,12 +2359,12 @@ var loadAllGoogleFonts = function loadAllGoogleFonts() {
2550
2359
  });
2551
2360
  };
2552
2361
  var preloadRelevantImages = /*#__PURE__*/function () {
2553
- var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
2362
+ var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
2554
2363
  var elements,
2555
2364
  imagePromises,
2556
2365
  _args = arguments;
2557
- return _regeneratorRuntime().wrap(function _callee$(_context) {
2558
- while (1) switch (_context.prev = _context.next) {
2366
+ return _regenerator().w(function (_context) {
2367
+ while (1) switch (_context.n) {
2559
2368
  case 0:
2560
2369
  elements = _args.length > 0 && _args[0] !== undefined ? _args[0] : [];
2561
2370
  imagePromises = elements === null || elements === void 0 ? void 0 : elements.map(function (elem) {
@@ -2583,7 +2392,7 @@ var preloadRelevantImages = /*#__PURE__*/function () {
2583
2392
  img.src = src;
2584
2393
  });
2585
2394
  }).filter(Boolean);
2586
- return _context.abrupt("return", Promise === null || Promise === void 0 ? void 0 : Promise.allSettled(imagePromises).then(function (results) {
2395
+ return _context.a(2, Promise === null || Promise === void 0 ? void 0 : Promise.allSettled(imagePromises).then(function (results) {
2587
2396
  var successes = results === null || results === void 0 ? void 0 : results.filter(function (r) {
2588
2397
  return (r === null || r === void 0 ? void 0 : r.status) === 'fulfilled';
2589
2398
  }).map(function (r) {
@@ -2599,9 +2408,6 @@ var preloadRelevantImages = /*#__PURE__*/function () {
2599
2408
  errors: errors
2600
2409
  };
2601
2410
  }));
2602
- case 3:
2603
- case "end":
2604
- return _context.stop();
2605
2411
  }
2606
2412
  }, _callee);
2607
2413
  }));
@@ -2622,58 +2428,54 @@ var removeImageProperty = function removeImageProperty() {
2622
2428
  });
2623
2429
  };
2624
2430
  var exportStageAsImage = /*#__PURE__*/function () {
2625
- var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee3(stageRef, pageSizeKey) {
2431
+ var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3(stageRef, pageSizeKey) {
2626
2432
  var scale,
2627
2433
  _args3 = arguments;
2628
- return _regeneratorRuntime().wrap(function _callee3$(_context3) {
2629
- while (1) switch (_context3.prev = _context3.next) {
2434
+ return _regenerator().w(function (_context3) {
2435
+ while (1) switch (_context3.n) {
2630
2436
  case 0:
2631
2437
  scale = _args3.length > 2 && _args3[2] !== undefined ? _args3[2] : 2;
2632
- return _context3.abrupt("return", new Promise(/*#__PURE__*/function () {
2633
- var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2(resolve, reject) {
2634
- var stage, canvas, dataURL;
2635
- return _regeneratorRuntime().wrap(function _callee2$(_context2) {
2636
- while (1) switch (_context2.prev = _context2.next) {
2438
+ return _context3.a(2, new Promise(/*#__PURE__*/function () {
2439
+ var _ref3 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(resolve, reject) {
2440
+ var stage, canvas, dataURL, _t;
2441
+ return _regenerator().w(function (_context2) {
2442
+ while (1) switch (_context2.n) {
2637
2443
  case 0:
2638
- _context2.prev = 0;
2444
+ _context2.p = 0;
2639
2445
  stage = stageRef === null || stageRef === void 0 ? void 0 : stageRef.current;
2640
2446
  if (stage) {
2641
- _context2.next = 4;
2447
+ _context2.n = 1;
2642
2448
  break;
2643
2449
  }
2644
- return _context2.abrupt("return", reject('Stage is not available'));
2645
- case 4:
2646
- _context2.next = 6;
2450
+ return _context2.a(2, reject('Stage is not available'));
2451
+ case 1:
2452
+ _context2.n = 2;
2647
2453
  return stage.toCanvas({
2648
2454
  pixelRatio: scale
2649
2455
  });
2650
- case 6:
2651
- canvas = _context2.sent;
2652
- _context2.next = 9;
2456
+ case 2:
2457
+ canvas = _context2.v;
2458
+ _context2.n = 3;
2653
2459
  return canvas.toDataURL('image/png');
2654
- case 9:
2655
- dataURL = _context2.sent;
2460
+ case 3:
2461
+ dataURL = _context2.v;
2656
2462
  // Return the data URL as the resolved value
2657
2463
  resolve(dataURL);
2658
- _context2.next = 16;
2464
+ _context2.n = 5;
2659
2465
  break;
2660
- case 13:
2661
- _context2.prev = 13;
2662
- _context2.t0 = _context2["catch"](0);
2663
- reject(_context2.t0);
2664
- case 16:
2665
- case "end":
2666
- return _context2.stop();
2466
+ case 4:
2467
+ _context2.p = 4;
2468
+ _t = _context2.v;
2469
+ reject(_t);
2470
+ case 5:
2471
+ return _context2.a(2);
2667
2472
  }
2668
- }, _callee2, null, [[0, 13]]);
2473
+ }, _callee2, null, [[0, 4]]);
2669
2474
  }));
2670
2475
  return function (_x3, _x4) {
2671
2476
  return _ref3.apply(this, arguments);
2672
2477
  };
2673
2478
  }()));
2674
- case 2:
2675
- case "end":
2676
- return _context3.stop();
2677
2479
  }
2678
2480
  }, _callee3);
2679
2481
  }));
@@ -2958,43 +2760,42 @@ var TemplateToolBar = function TemplateToolBar(_ref) {
2958
2760
  onSetBackgroundColor(e);
2959
2761
  };
2960
2762
  var handleBackgroundUpload = /*#__PURE__*/function () {
2961
- var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
2763
+ var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
2962
2764
  var file, imageUrl, reader;
2963
- return _regeneratorRuntime().wrap(function _callee$(_context) {
2964
- while (1) switch (_context.prev = _context.next) {
2765
+ return _regenerator().w(function (_context) {
2766
+ while (1) switch (_context.n) {
2965
2767
  case 0:
2966
- _context.next = 2;
2768
+ _context.n = 1;
2967
2769
  return pickImage();
2968
- case 2:
2969
- file = _context.sent;
2770
+ case 1:
2771
+ file = _context.v;
2970
2772
  if (file) {
2971
- _context.next = 5;
2773
+ _context.n = 2;
2972
2774
  break;
2973
2775
  }
2974
- return _context.abrupt("return");
2975
- case 5:
2776
+ return _context.a(2);
2777
+ case 2:
2976
2778
  if (!uploadImageCallBack) {
2977
- _context.next = 14;
2779
+ _context.n = 4;
2978
2780
  break;
2979
2781
  }
2980
2782
  setLoadingUploadImage(true);
2981
- _context.next = 9;
2783
+ _context.n = 3;
2982
2784
  return uploadImageCallBack(file);
2983
- case 9:
2984
- imageUrl = _context.sent;
2785
+ case 3:
2786
+ imageUrl = _context.v;
2985
2787
  onSetBackgroundImage(imageUrl);
2986
2788
  setLoadingUploadImage(false);
2987
- _context.next = 17;
2789
+ _context.n = 5;
2988
2790
  break;
2989
- case 14:
2791
+ case 4:
2990
2792
  reader = new FileReader();
2991
2793
  reader.onload = function () {
2992
2794
  onSetBackgroundImage(reader.result);
2993
2795
  };
2994
2796
  reader.readAsDataURL(file);
2995
- case 17:
2996
- case "end":
2997
- return _context.stop();
2797
+ case 5:
2798
+ return _context.a(2);
2998
2799
  }
2999
2800
  }, _callee);
3000
2801
  }));
@@ -3128,20 +2929,20 @@ var TabItem = styled.div(_templateObject2$e || (_templateObject2$e = _taggedTemp
3128
2929
  var _ref9$selected = _ref9.selected,
3129
2930
  selected = _ref9$selected === void 0 ? false : _ref9$selected;
3130
2931
  return selected ? theme.color.gray_200 : theme.color.white;
3131
- }, function (_ref10) {
3132
- var isFirst = _ref10.isFirst;
2932
+ }, function (_ref0) {
2933
+ var isFirst = _ref0.isFirst;
3133
2934
  return isFirst ? '5' : '0';
3134
- }, function (_ref11) {
3135
- var isFirst = _ref11.isFirst;
2935
+ }, function (_ref1) {
2936
+ var isFirst = _ref1.isFirst;
3136
2937
  return isFirst ? '5' : '0';
3137
- }, function (_ref12) {
3138
- var isLast = _ref12.isLast;
2938
+ }, function (_ref10) {
2939
+ var isLast = _ref10.isLast;
3139
2940
  return isLast ? '5' : '0';
3140
- }, function (_ref13) {
3141
- var isLast = _ref13.isLast;
2941
+ }, function (_ref11) {
2942
+ var isLast = _ref11.isLast;
3142
2943
  return isLast ? '5' : '0';
3143
- }, function (_ref14) {
3144
- var disabled = _ref14.disabled;
2944
+ }, function (_ref12) {
2945
+ var disabled = _ref12.disabled;
3145
2946
  return disabled ? 'none' : 'all';
3146
2947
  });
3147
2948
 
@@ -3182,7 +2983,7 @@ var ToolsTabBar = function ToolsTabBar(_ref) {
3182
2983
  ToolsTabBar.propTypes = propTypes$n;
3183
2984
 
3184
2985
  var TextToolBar = function TextToolBar(_ref) {
3185
- var _TEXT_DICTIONARY$lang, _TEXT_DICTIONARY$lang2, _TEXT_DICTIONARY$lang3, _TEXT_DICTIONARY$lang4, _TEXT_DICTIONARY$lang5, _TEXT_DICTIONARY$lang6, _TEXT_DICTIONARY$lang7, _TEXT_DICTIONARY$lang8, _TEXT_DICTIONARY$lang9, _TEXT_DICTIONARY$lang10, _TEXT_DICTIONARY$lang11, _TEXT_DICTIONARY$lang12;
2986
+ var _TEXT_DICTIONARY$lang, _TEXT_DICTIONARY$lang2, _TEXT_DICTIONARY$lang3, _TEXT_DICTIONARY$lang4, _TEXT_DICTIONARY$lang5, _TEXT_DICTIONARY$lang6, _TEXT_DICTIONARY$lang7, _TEXT_DICTIONARY$lang8, _TEXT_DICTIONARY$lang9, _TEXT_DICTIONARY$lang0, _TEXT_DICTIONARY$lang1, _TEXT_DICTIONARY$lang10;
3186
2987
  var fontFamily = _ref.fontFamily,
3187
2988
  fontSize = _ref.fontSize,
3188
2989
  lineHeight = _ref.lineHeight,
@@ -3329,11 +3130,11 @@ var TextToolBar = function TextToolBar(_ref) {
3329
3130
  src: IconDropDown,
3330
3131
  marginLeft: 10
3331
3132
  }),
3332
- tooltip: TEXT_DICTIONARY === null || TEXT_DICTIONARY === void 0 || (_TEXT_DICTIONARY$lang10 = TEXT_DICTIONARY[languageLocale]) === null || _TEXT_DICTIONARY$lang10 === void 0 ? void 0 : _TEXT_DICTIONARY$lang10.TEXT_LINE_HEIGHT,
3133
+ tooltip: TEXT_DICTIONARY === null || TEXT_DICTIONARY === void 0 || (_TEXT_DICTIONARY$lang0 = TEXT_DICTIONARY[languageLocale]) === null || _TEXT_DICTIONARY$lang0 === void 0 ? void 0 : _TEXT_DICTIONARY$lang0.TEXT_LINE_HEIGHT,
3333
3134
  tooltipPosition: 'bottom'
3334
3135
  }), /*#__PURE__*/React.createElement(ToolBarButtonWrapper, {
3335
3136
  gap: 12,
3336
- tooltip: TEXT_DICTIONARY === null || TEXT_DICTIONARY === void 0 || (_TEXT_DICTIONARY$lang11 = TEXT_DICTIONARY[languageLocale]) === null || _TEXT_DICTIONARY$lang11 === void 0 ? void 0 : _TEXT_DICTIONARY$lang11.TEXT_COLOR,
3137
+ tooltip: TEXT_DICTIONARY === null || TEXT_DICTIONARY === void 0 || (_TEXT_DICTIONARY$lang1 = TEXT_DICTIONARY[languageLocale]) === null || _TEXT_DICTIONARY$lang1 === void 0 ? void 0 : _TEXT_DICTIONARY$lang1.TEXT_COLOR,
3337
3138
  tooltipPosition: 'bottom'
3338
3139
  }, /*#__PURE__*/React.createElement(StyledImage, {
3339
3140
  src: IconTextSmall
@@ -3359,7 +3160,7 @@ var TextToolBar = function TextToolBar(_ref) {
3359
3160
  onChangeOpacity: function onChangeOpacity(e) {
3360
3161
  return onChangeTextProperty('opacity', e);
3361
3162
  },
3362
- tooltip: TEXT_DICTIONARY === null || TEXT_DICTIONARY === void 0 || (_TEXT_DICTIONARY$lang12 = TEXT_DICTIONARY[languageLocale]) === null || _TEXT_DICTIONARY$lang12 === void 0 ? void 0 : _TEXT_DICTIONARY$lang12.TEXT_OPACITY,
3163
+ tooltip: TEXT_DICTIONARY === null || TEXT_DICTIONARY === void 0 || (_TEXT_DICTIONARY$lang10 = TEXT_DICTIONARY[languageLocale]) === null || _TEXT_DICTIONARY$lang10 === void 0 ? void 0 : _TEXT_DICTIONARY$lang10.TEXT_OPACITY,
3363
3164
  tooltipPosition: 'bottom'
3364
3165
  }));
3365
3166
  };
@@ -4025,9 +3826,9 @@ var QrElement = function QrElement(_ref) {
4025
3826
  };
4026
3827
  }, [element]);
4027
3828
  var addQR = /*#__PURE__*/function () {
4028
- var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
4029
- return _regeneratorRuntime().wrap(function _callee$(_context) {
4030
- while (1) switch (_context.prev = _context.next) {
3829
+ var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
3830
+ return _regenerator().w(function (_context) {
3831
+ while (1) switch (_context.n) {
4031
3832
  case 0:
4032
3833
  try {
4033
3834
  QRCode.toDataURL(element === null || element === void 0 ? void 0 : element.qrText, {
@@ -4053,8 +3854,7 @@ var QrElement = function QrElement(_ref) {
4053
3854
  console.error('Failed to generate QR code', err);
4054
3855
  }
4055
3856
  case 1:
4056
- case "end":
4057
- return _context.stop();
3857
+ return _context.a(2);
4058
3858
  }
4059
3859
  }, _callee);
4060
3860
  }));
@@ -4230,9 +4030,9 @@ var EditableText = function EditableText(_ref) {
4230
4030
  text = _useState8[0],
4231
4031
  setText = _useState8[1];
4232
4032
  var _useState9 = React.useState(false),
4233
- _useState10 = _slicedToArray(_useState9, 2),
4234
- isFontLoaded = _useState10[0],
4235
- setIsFontLoaded = _useState10[1];
4033
+ _useState0 = _slicedToArray(_useState9, 2),
4034
+ isFontLoaded = _useState0[0],
4035
+ setIsFontLoaded = _useState0[1];
4236
4036
  React.useEffect(function () {
4237
4037
  setIsFontLoaded(false);
4238
4038
  setTimeout(function () {
@@ -5492,43 +5292,42 @@ var ImageSideBar = function ImageSideBar(_ref) {
5492
5292
  }));
5493
5293
  }));
5494
5294
  var addImageToList = /*#__PURE__*/function () {
5495
- var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
5295
+ var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
5496
5296
  var file, imageUrl, reader;
5497
- return _regeneratorRuntime().wrap(function _callee$(_context) {
5498
- while (1) switch (_context.prev = _context.next) {
5297
+ return _regenerator().w(function (_context) {
5298
+ while (1) switch (_context.n) {
5499
5299
  case 0:
5500
- _context.next = 2;
5300
+ _context.n = 1;
5501
5301
  return pickImage();
5502
- case 2:
5503
- file = _context.sent;
5302
+ case 1:
5303
+ file = _context.v;
5504
5304
  if (file) {
5505
- _context.next = 5;
5305
+ _context.n = 2;
5506
5306
  break;
5507
5307
  }
5508
- return _context.abrupt("return");
5509
- case 5:
5308
+ return _context.a(2);
5309
+ case 2:
5510
5310
  if (!uploadImageCallBack) {
5511
- _context.next = 14;
5311
+ _context.n = 4;
5512
5312
  break;
5513
5313
  }
5514
5314
  setLoadingUploadImage(true);
5515
- _context.next = 9;
5315
+ _context.n = 3;
5516
5316
  return uploadImageCallBack(file);
5517
- case 9:
5518
- imageUrl = _context.sent;
5317
+ case 3:
5318
+ imageUrl = _context.v;
5519
5319
  onAddCustomImageToList(imageUrl);
5520
5320
  setLoadingUploadImage(false);
5521
- _context.next = 17;
5321
+ _context.n = 5;
5522
5322
  break;
5523
- case 14:
5323
+ case 4:
5524
5324
  reader = new FileReader();
5525
5325
  reader.onload = function () {
5526
5326
  onAddCustomImageToList(reader.result);
5527
5327
  };
5528
5328
  reader.readAsDataURL(file);
5529
- case 17:
5530
- case "end":
5531
- return _context.stop();
5329
+ case 5:
5330
+ return _context.a(2);
5532
5331
  }
5533
5332
  }, _callee);
5534
5333
  }));
@@ -5890,6 +5689,7 @@ var isPropValid = /* #__PURE__ */memoize(function (prop) {
5890
5689
  /**
5891
5690
  * @typedef {Object} StudioProps
5892
5691
  * @property {string} [title]
5692
+ * @property {string} [defaultQrLogo]
5893
5693
  * @property {string} [languageLocale]
5894
5694
  * @property {Array} [elementsList]
5895
5695
  * @property {Array} [customImages]
@@ -5912,6 +5712,8 @@ var Studio = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
5912
5712
  var _elements$elements$fi, _elements$find4, _elements$find5, _elements$find6;
5913
5713
  var _ref$title = _ref.title,
5914
5714
  title = _ref$title === void 0 ? '' : _ref$title,
5715
+ _ref$defaultQrLogo = _ref.defaultQrLogo,
5716
+ defaultQrLogo = _ref$defaultQrLogo === void 0 ? null : _ref$defaultQrLogo,
5915
5717
  _ref$elementsList = _ref.elementsList,
5916
5718
  elementsList = _ref$elementsList === void 0 ? defaultElements : _ref$elementsList,
5917
5719
  uploadImageCallBack = _ref.uploadImageCallBack,
@@ -5952,97 +5754,98 @@ var Studio = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
5952
5754
  loadingFonts = _useState8[0],
5953
5755
  setLoadingFonts = _useState8[1];
5954
5756
  var _useState9 = React.useState(true),
5955
- _useState10 = _slicedToArray(_useState9, 2),
5956
- loadingImages = _useState10[0],
5957
- setLoadingImages = _useState10[1];
5757
+ _useState0 = _slicedToArray(_useState9, 2),
5758
+ loadingImages = _useState0[0],
5759
+ setLoadingImages = _useState0[1];
5760
+ var _useState1 = React.useState(false),
5761
+ _useState10 = _slicedToArray(_useState1, 2),
5762
+ loading = _useState10[0],
5763
+ setLoading = _useState10[1];
5958
5764
  var _useState11 = React.useState(false),
5959
5765
  _useState12 = _slicedToArray(_useState11, 2),
5960
- loading = _useState12[0],
5961
- setLoading = _useState12[1];
5962
- var _useState13 = React.useState(false),
5766
+ loadingUploadImage = _useState12[0],
5767
+ setLoadingUploadImage = _useState12[1];
5768
+ var _useState13 = React.useState(true),
5963
5769
  _useState14 = _slicedToArray(_useState13, 2),
5964
- loadingUploadImage = _useState14[0],
5965
- setLoadingUploadImage = _useState14[1];
5966
- var _useState15 = React.useState(true),
5770
+ helperSideBarVisible = _useState14[0],
5771
+ setHelperSideBarVisible = _useState14[1];
5772
+ var _useState15 = React.useState(100),
5967
5773
  _useState16 = _slicedToArray(_useState15, 2),
5968
- helperSideBarVisible = _useState16[0],
5969
- setHelperSideBarVisible = _useState16[1];
5970
- var _useState17 = React.useState(100),
5774
+ zoomPercentage = _useState16[0],
5775
+ setZoomPercentage = _useState16[1];
5776
+ var _useState17 = React.useState(elementsList),
5971
5777
  _useState18 = _slicedToArray(_useState17, 2),
5972
- zoomPercentage = _useState18[0],
5973
- setZoomPercentage = _useState18[1];
5974
- var _useState19 = React.useState(elementsList),
5778
+ elements = _useState18[0],
5779
+ setElements = _useState18[1];
5780
+ var _useState19 = React.useState(1),
5975
5781
  _useState20 = _slicedToArray(_useState19, 2),
5976
- elements = _useState20[0],
5977
- setElements = _useState20[1];
5978
- var _useState21 = React.useState(1),
5782
+ backgroundImageOpacity = _useState20[0],
5783
+ setBackgroundImageOpacity = _useState20[1];
5784
+ var _useState21 = React.useState([]),
5979
5785
  _useState22 = _slicedToArray(_useState21, 2),
5980
- backgroundImageOpacity = _useState22[0],
5981
- setBackgroundImageOpacity = _useState22[1];
5786
+ history = _useState22[0],
5787
+ setHistory = _useState22[1];
5982
5788
  var _useState23 = React.useState([]),
5983
5789
  _useState24 = _slicedToArray(_useState23, 2),
5984
- history = _useState24[0],
5985
- setHistory = _useState24[1];
5986
- var _useState25 = React.useState([]),
5790
+ redoStack = _useState24[0],
5791
+ setRedoStack = _useState24[1];
5792
+ var _useState25 = React.useState(theme.color.white),
5987
5793
  _useState26 = _slicedToArray(_useState25, 2),
5988
- redoStack = _useState26[0],
5989
- setRedoStack = _useState26[1];
5990
- var _useState27 = React.useState(theme.color.white),
5794
+ shapeFillColor = _useState26[0],
5795
+ setShapeFillColor = _useState26[1];
5796
+ var _useState27 = React.useState(1),
5991
5797
  _useState28 = _slicedToArray(_useState27, 2),
5992
- shapeFillColor = _useState28[0],
5993
- setShapeFillColor = _useState28[1];
5994
- var _useState29 = React.useState(1),
5798
+ shapeStrokeWidth = _useState28[0],
5799
+ setShapeStrokeWidth = _useState28[1];
5800
+ var _useState29 = React.useState(theme.color.black),
5995
5801
  _useState30 = _slicedToArray(_useState29, 2),
5996
- shapeStrokeWidth = _useState30[0],
5997
- setShapeStrokeWidth = _useState30[1];
5998
- var _useState31 = React.useState(theme.color.black),
5802
+ shapeStrokeColor = _useState30[0],
5803
+ setShapeStrokeColor = _useState30[1];
5804
+ var _useState31 = React.useState(1),
5999
5805
  _useState32 = _slicedToArray(_useState31, 2),
6000
- shapeStrokeColor = _useState32[0],
6001
- setShapeStrokeColor = _useState32[1];
6002
- var _useState33 = React.useState(1),
5806
+ shapeOpacity = _useState32[0],
5807
+ setShapeOpacity = _useState32[1];
5808
+ var _useState33 = React.useState(0),
6003
5809
  _useState34 = _slicedToArray(_useState33, 2),
6004
- shapeOpacity = _useState34[0],
6005
- setShapeOpacity = _useState34[1];
6006
- var _useState35 = React.useState(0),
5810
+ imageStrokeWidth = _useState34[0],
5811
+ setImageStrokeWidth = _useState34[1];
5812
+ var _useState35 = React.useState(theme.color.black),
6007
5813
  _useState36 = _slicedToArray(_useState35, 2),
6008
- imageStrokeWidth = _useState36[0],
6009
- setImageStrokeWidth = _useState36[1];
6010
- var _useState37 = React.useState(theme.color.black),
5814
+ imageStrokeColor = _useState36[0],
5815
+ setImageStrokeColor = _useState36[1];
5816
+ var _useState37 = React.useState(1),
6011
5817
  _useState38 = _slicedToArray(_useState37, 2),
6012
- imageStrokeColor = _useState38[0],
6013
- setImageStrokeColor = _useState38[1];
6014
- var _useState39 = React.useState(1),
5818
+ imageOpacity = _useState38[0],
5819
+ setImageOpacity = _useState38[1];
5820
+ var _useState39 = React.useState(2),
6015
5821
  _useState40 = _slicedToArray(_useState39, 2),
6016
- imageOpacity = _useState40[0],
6017
- setImageOpacity = _useState40[1];
6018
- var _useState41 = React.useState(2),
5822
+ qrStrokeWidth = _useState40[0],
5823
+ setQrStrokeWidth = _useState40[1];
5824
+ var _useState41 = React.useState(theme.color.black),
6019
5825
  _useState42 = _slicedToArray(_useState41, 2),
6020
- qrStrokeWidth = _useState42[0],
6021
- setQrStrokeWidth = _useState42[1];
6022
- var _useState43 = React.useState(theme.color.black),
5826
+ qrStrokeColor = _useState42[0],
5827
+ setQrStrokeColor = _useState42[1];
5828
+ var _useState43 = React.useState(1),
6023
5829
  _useState44 = _slicedToArray(_useState43, 2),
6024
- qrStrokeColor = _useState44[0],
6025
- setQrStrokeColor = _useState44[1];
6026
- var _useState45 = React.useState(1),
5830
+ qrOpacity = _useState44[0],
5831
+ setQrOpacity = _useState44[1];
5832
+ var _useState45 = React.useState(null),
6027
5833
  _useState46 = _slicedToArray(_useState45, 2),
6028
- qrOpacity = _useState46[0],
6029
- setQrOpacity = _useState46[1];
6030
- var _useState47 = React.useState(null),
5834
+ selectedElement = _useState46[0],
5835
+ setSelectedElement = _useState46[1];
5836
+ var _useState47 = React.useState(customImages || []),
6031
5837
  _useState48 = _slicedToArray(_useState47, 2),
6032
- selectedElement = _useState48[0],
6033
- setSelectedElement = _useState48[1];
6034
- var _useState49 = React.useState(customImages || []),
5838
+ customImagesList = _useState48[0],
5839
+ setCustomImagesList = _useState48[1];
5840
+ var _useState49 = React.useState(defaultQrLogo),
6035
5841
  _useState50 = _slicedToArray(_useState49, 2),
6036
- customImagesList = _useState50[0],
6037
- setCustomImagesList = _useState50[1];
6038
- var _useState51 = React.useState(null),
5842
+ qrLogo = _useState50[0],
5843
+ setQrLogo = _useState50[1];
5844
+ var _useState51 = React.useState(basicTextProps),
6039
5845
  _useState52 = _slicedToArray(_useState51, 2),
6040
- qrLogo = _useState52[0],
6041
- setQrLogo = _useState52[1];
6042
- var _useState53 = React.useState(basicTextProps),
6043
- _useState54 = _slicedToArray(_useState53, 2),
6044
- defaultTextProps = _useState54[0],
6045
- setDefaultTextProps = _useState54[1];
5846
+ defaultTextProps = _useState52[0],
5847
+ setDefaultTextProps = _useState52[1];
5848
+ var overallLoading = loadingFonts || loadingImages || loadingUploadImage || loading;
6046
5849
  var undo = React.useCallback(function () {
6047
5850
  if (history.length > 0) {
6048
5851
  setSelectedElement(null);
@@ -6064,32 +5867,29 @@ var Studio = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
6064
5867
  React.useImperativeHandle(ref, function () {
6065
5868
  return {
6066
5869
  onSave: function () {
6067
- var _onSave = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
5870
+ var _onSave = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
6068
5871
  var processedElements, dataURL;
6069
- return _regeneratorRuntime().wrap(function _callee$(_context) {
6070
- while (1) switch (_context.prev = _context.next) {
5872
+ return _regenerator().w(function (_context) {
5873
+ while (1) switch (_context.n) {
6071
5874
  case 0:
6072
5875
  setLoading(true);
6073
5876
  setSelectedElement(null);
6074
5877
  setZoomPercentage(100);
6075
- _context.next = 5;
5878
+ _context.n = 1;
6076
5879
  return new Promise(function (resolve) {
6077
5880
  return setTimeout(resolve, 100);
6078
5881
  });
6079
- case 5:
5882
+ case 1:
6080
5883
  processedElements = removeImageProperty(elements);
6081
- _context.next = 8;
5884
+ _context.n = 2;
6082
5885
  return exportStageAsImage(stageRef);
6083
- case 8:
6084
- dataURL = _context.sent;
5886
+ case 2:
5887
+ dataURL = _context.v;
6085
5888
  setLoading(false);
6086
- return _context.abrupt("return", {
5889
+ return _context.a(2, {
6087
5890
  elements: processedElements,
6088
5891
  image: dataURL
6089
5892
  });
6090
- case 11:
6091
- case "end":
6092
- return _context.stop();
6093
5893
  }
6094
5894
  }, _callee);
6095
5895
  }));
@@ -6097,7 +5897,9 @@ var Studio = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
6097
5897
  return _onSave.apply(this, arguments);
6098
5898
  }
6099
5899
  return onSave;
6100
- }()
5900
+ }(),
5901
+ loading: overallLoading,
5902
+ setLoading: setLoading
6101
5903
  };
6102
5904
  });
6103
5905
  React.useEffect(function () {
@@ -6160,7 +5962,7 @@ var Studio = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
6160
5962
  setLanguageLocale(validateLocale(locale));
6161
5963
  }, [locale]);
6162
5964
  React.useEffect(function () {
6163
- setCustomImagesList(customImages);
5965
+ setCustomImagesList(customImages || []);
6164
5966
  }, [customImages]);
6165
5967
  React.useEffect(function () {
6166
5968
  setLoadingFonts(true);
@@ -6688,43 +6490,42 @@ var Studio = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
6688
6490
  }
6689
6491
  };
6690
6492
  var addQrLogo = /*#__PURE__*/function () {
6691
- var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
6493
+ var _ref3 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
6692
6494
  var file, imageUrl, reader;
6693
- return _regeneratorRuntime().wrap(function _callee2$(_context2) {
6694
- while (1) switch (_context2.prev = _context2.next) {
6495
+ return _regenerator().w(function (_context2) {
6496
+ while (1) switch (_context2.n) {
6695
6497
  case 0:
6696
- _context2.next = 2;
6498
+ _context2.n = 1;
6697
6499
  return pickImage();
6698
- case 2:
6699
- file = _context2.sent;
6500
+ case 1:
6501
+ file = _context2.v;
6700
6502
  if (file) {
6701
- _context2.next = 5;
6503
+ _context2.n = 2;
6702
6504
  break;
6703
6505
  }
6704
- return _context2.abrupt("return");
6705
- case 5:
6506
+ return _context2.a(2);
6507
+ case 2:
6706
6508
  if (!uploadImageCallBack) {
6707
- _context2.next = 14;
6509
+ _context2.n = 4;
6708
6510
  break;
6709
6511
  }
6710
6512
  setLoadingUploadImage(true);
6711
- _context2.next = 9;
6513
+ _context2.n = 3;
6712
6514
  return uploadImageCallBack(file);
6713
- case 9:
6714
- imageUrl = _context2.sent;
6515
+ case 3:
6516
+ imageUrl = _context2.v;
6715
6517
  addLogo(imageUrl);
6716
6518
  setLoadingUploadImage(false);
6717
- _context2.next = 17;
6519
+ _context2.n = 5;
6718
6520
  break;
6719
- case 14:
6521
+ case 4:
6720
6522
  reader = new FileReader();
6721
6523
  reader.onload = function () {
6722
6524
  addLogo(reader.result);
6723
6525
  };
6724
6526
  reader.readAsDataURL(file);
6725
- case 17:
6726
- case "end":
6727
- return _context2.stop();
6527
+ case 5:
6528
+ return _context2.a(2);
6728
6529
  }
6729
6530
  }, _callee2);
6730
6531
  }));
@@ -6758,38 +6559,37 @@ var Studio = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
6758
6559
  }
6759
6560
  };
6760
6561
  var onSaveProgress = /*#__PURE__*/function () {
6761
- var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
6562
+ var _ref4 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3() {
6762
6563
  var processedElements, dataURL;
6763
- return _regeneratorRuntime().wrap(function _callee3$(_context3) {
6764
- while (1) switch (_context3.prev = _context3.next) {
6564
+ return _regenerator().w(function (_context3) {
6565
+ while (1) switch (_context3.n) {
6765
6566
  case 0:
6766
6567
  if (onSave) {
6767
- _context3.next = 2;
6568
+ _context3.n = 1;
6768
6569
  break;
6769
6570
  }
6770
- return _context3.abrupt("return");
6771
- case 2:
6571
+ return _context3.a(2);
6572
+ case 1:
6772
6573
  setLoading(true);
6773
6574
  setSelectedElement(null);
6774
6575
  setZoomPercentage(100);
6775
- _context3.next = 7;
6576
+ _context3.n = 2;
6776
6577
  return new Promise(function (resolve) {
6777
6578
  return setTimeout(resolve, 100);
6778
6579
  });
6779
- case 7:
6580
+ case 2:
6780
6581
  processedElements = removeImageProperty(elements);
6781
- _context3.next = 10;
6582
+ _context3.n = 3;
6782
6583
  return exportStageAsImage(stageRef);
6783
- case 10:
6784
- dataURL = _context3.sent;
6584
+ case 3:
6585
+ dataURL = _context3.v;
6785
6586
  setLoading(false);
6786
6587
  onSave({
6787
6588
  elements: processedElements,
6788
6589
  image: dataURL
6789
6590
  });
6790
- case 13:
6791
- case "end":
6792
- return _context3.stop();
6591
+ case 4:
6592
+ return _context3.a(2);
6793
6593
  }
6794
6594
  }, _callee3);
6795
6595
  }));
@@ -6834,7 +6634,7 @@ var Studio = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
6834
6634
  styleProps: styleProps,
6835
6635
  defaultText: defaultText,
6836
6636
  languageLocale: languageLocale
6837
- }), /*#__PURE__*/React.createElement(Editor
6637
+ }), loadingFonts ? null : /*#__PURE__*/React.createElement(Editor
6838
6638
  // canvasSize={canvasSize}
6839
6639
  , {
6840
6640
  cuttingGuideStroke: (elements === null || elements === void 0 || (_elements$find4 = elements.find(function (e) {
@@ -6906,7 +6706,7 @@ var Studio = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
6906
6706
  saveButtonText: saveButtonText,
6907
6707
  languageLocale: languageLocale,
6908
6708
  onRemoveBackgroundImage: onRemoveBackgroundImage
6909
- }), (loadingFonts || loadingImages || loadingUploadImage || loading) && /*#__PURE__*/React.createElement(Overlay, null, /*#__PURE__*/React.createElement(LoadingSpinner, {
6709
+ }), overallLoading && /*#__PURE__*/React.createElement(Overlay, null, /*#__PURE__*/React.createElement(LoadingSpinner, {
6910
6710
  size: "60px",
6911
6711
  color: theme.color.secondary
6912
6712
  }))));