builder-settings-types 0.0.220 → 0.0.223

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 (4) hide show
  1. package/dist/builder-settings-types.cjs.js +50 -50
  2. package/dist/builder-settings-types.es.js +519 -486
  3. package/dist/index.d.ts +9 -0
  4. package/package.json +1 -1
package/dist/builder-settings-types.es.js CHANGED
@@ -1,11 +1,11 @@
1
- const O = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";
2
- let I = (h = 21) => {
1
+ const H = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";
2
+ let O = (h = 21) => {
3
3
  let t = "", e = crypto.getRandomValues(new Uint8Array(h |= 0));
4
4
  for (; h--; )
5
- t += O[e[h] & 63];
5
+ t += H[e[h] & 63];
6
6
  return t;
7
7
  };
8
- function x(h) {
8
+ function k(h) {
9
9
  if (h === null || typeof h != "object")
10
10
  return h;
11
11
  if (h instanceof Date)
@@ -13,16 +13,16 @@ function x(h) {
13
13
  if (Array.isArray(h)) {
14
14
  const i = [];
15
15
  for (let s = 0; s < h.length; s++)
16
- i[s] = x(h[s]);
16
+ i[s] = k(h[s]);
17
17
  return i;
18
18
  }
19
19
  const t = {};
20
20
  for (const i in h)
21
- Object.prototype.hasOwnProperty.call(h, i) && (t[i] = x(h[i]));
21
+ Object.prototype.hasOwnProperty.call(h, i) && (t[i] = k(h[i]));
22
22
  const e = Object.getPrototypeOf(h);
23
23
  return e !== Object.prototype && Object.setPrototypeOf(t, e), t;
24
24
  }
25
- function H(h) {
25
+ function T(h) {
26
26
  switch (h) {
27
27
  case "number":
28
28
  return 0;
@@ -42,7 +42,7 @@ function H(h) {
42
42
  }
43
43
  class g {
44
44
  constructor(t = {}) {
45
- this.props = t, this.id = t.id || I(), this.value = this.props.default, this.desktop = this.props.default, this.title = t.title || "", this.includeGetJson = t.includeGetJson !== void 0 ? t.includeGetJson : !0;
45
+ this.props = t, this.id = t.id || O(), this.value = this.props.default, this.desktop = this.props.default, this.title = t.title || "", this.includeGetJson = t.includeGetJson !== void 0 ? t.includeGetJson : !0;
46
46
  }
47
47
  static SetUploadUrl(t) {
48
48
  window.DefaultUploadUrl = t, g.DefaultUploadUrl = t;
@@ -60,58 +60,58 @@ class g {
60
60
  this.value = t, this.inputEl && (this.inputEl.value = String(t)), this.onChange && this.onChange(t), this.props.detectChange && this.props.detectChange(t);
61
61
  }
62
62
  clone() {
63
- const t = this.constructor, e = x(this.props), i = new t(e);
64
- return i.value = x(this.value), i;
63
+ const t = this.constructor, e = k(this.props), i = new t(e);
64
+ return i.value = k(this.value), i;
65
65
  }
66
66
  createInput(t) {
67
67
  t = { ...this.props.inputProps, ...t };
68
68
  const e = document.createElement("div");
69
69
  if (e.className = t.wrapperClassName || "", t.title || t.icon) {
70
- const a = document.createElement("div");
71
- if (a.className = "icon-container", t.icon) {
70
+ const o = document.createElement("div");
71
+ if (o.className = "icon-container", t.icon) {
72
72
  const l = this.createIcon(t.icon, t.iconClassName);
73
- a.appendChild(l);
73
+ o.appendChild(l);
74
74
  }
75
75
  if (t.title) {
76
76
  const l = this.createLabel(t.title, t.labelClassName);
77
- a.appendChild(l);
77
+ o.appendChild(l);
78
78
  }
79
- e.appendChild(a);
79
+ e.appendChild(o);
80
80
  }
81
81
  const i = document.createElement("div");
82
82
  i.className = t.wrapperClassName || "";
83
83
  const s = document.createElement("input");
84
- this.inputEl = s, s.value = String(t.value || H(t.inputType)), s.type = t.inputType, s.placeholder = t.placeholder || "", s.className = t.inputClassName || "";
85
- const n = (a) => {
86
- const l = a.target;
87
- let c = l.value;
84
+ this.inputEl = s, s.value = String(t.value || T(t.inputType)), s.type = t.inputType, s.placeholder = t.placeholder || "", s.className = t.inputClassName || "";
85
+ const n = (o) => {
86
+ const l = o.target;
87
+ let r = l.value;
88
88
  switch (t.inputType) {
89
89
  case "number":
90
- c = Number(l.value);
90
+ r = Number(l.value);
91
91
  break;
92
92
  case "color":
93
- c = l.value;
93
+ r = l.value;
94
94
  break;
95
95
  case "date":
96
- c = l.value;
96
+ r = l.value;
97
97
  break;
98
98
  case "select":
99
- c = l.value;
99
+ r = l.value;
100
100
  break;
101
101
  case "text":
102
- c = l.value;
102
+ r = l.value;
103
103
  break;
104
104
  case "button":
105
- c = l.value;
105
+ r = l.value;
106
106
  break;
107
107
  default:
108
- c = l.value;
108
+ r = l.value;
109
109
  }
110
- this.value = c, this.onChange && this.onChange(this.value), this.props.detectChange && this.props.detectChange(this.value);
111
- }, o = (a) => {
112
- a.target, this.onBlur && this.onBlur(this.value);
110
+ this.value = r, this.onChange && this.onChange(this.value), this.props.detectChange && this.props.detectChange(this.value);
111
+ }, a = (o) => {
112
+ o.target, this.onBlur && this.onBlur(this.value);
113
113
  };
114
- return s.addEventListener("input", n), s.addEventListener("change", n), s.addEventListener("blur", o), t.inputCustomizer && t.inputCustomizer(s), i.appendChild(s), e.appendChild(i), e;
114
+ return s.addEventListener("input", n), s.addEventListener("change", n), s.addEventListener("blur", a), t.inputCustomizer && t.inputCustomizer(s), i.appendChild(s), e.appendChild(i), e;
115
115
  }
116
116
  createLabel(t, e) {
117
117
  const i = document.createElement("span");
@@ -122,31 +122,31 @@ class g {
122
122
  return i.className = "input-icon " + (e || ""), i.innerHTML = t, i;
123
123
  }
124
124
  }
125
- function T(h) {
125
+ function B(h) {
126
126
  let t = 0, e = h.parentElement;
127
127
  for (; e; )
128
128
  e.classList.contains("setting-group") && e !== h && t++, e = e.parentElement;
129
129
  return t;
130
130
  }
131
- function b(h, t) {
131
+ function L(h, t) {
132
132
  const e = Math.min(Math.max(t, 0), 5);
133
133
  h.setAttribute("data-nesting-level", e.toString()), e > 0 ? h.style.setProperty("--visual-indent", `${e * 2}px`) : (h.style.removeProperty("--visual-indent"), h.style.marginLeft = "");
134
134
  }
135
- function k(h, t = 0) {
135
+ function I(h, t = 0) {
136
136
  h.querySelectorAll(":scope > .setting-group-content > .setting-group").forEach((i) => {
137
137
  const s = i, n = t + 1;
138
- b(s, n), k(s, n);
138
+ L(s, n), I(s, n);
139
139
  });
140
140
  }
141
- const B = {
141
+ const A = {
142
142
  maxLevel: 5,
143
143
  spacingMultiplier: 1,
144
144
  visualIndentMultiplier: 2,
145
145
  enableAutoDetection: !0
146
146
  };
147
- class A {
147
+ class R {
148
148
  constructor(t = {}) {
149
- this.observedElements = /* @__PURE__ */ new Set(), this.config = { ...B, ...t }, this.config.enableAutoDetection && this.setupAutoDetection();
149
+ this.observedElements = /* @__PURE__ */ new Set(), this.config = { ...A, ...t }, this.config.enableAutoDetection && this.setupAutoDetection();
150
150
  }
151
151
  /**
152
152
  * Setup automatic detection using MutationObserver
@@ -180,7 +180,7 @@ class A {
180
180
  * Update nesting for a specific element
181
181
  */
182
182
  updateElementNesting(t) {
183
- const e = T(t);
183
+ const e = B(t);
184
184
  this.applyNestingWithConfig(t, e);
185
185
  }
186
186
  /**
@@ -228,8 +228,8 @@ class A {
228
228
  this.observer && (this.observer.disconnect(), this.observer = void 0), this.observedElements.clear();
229
229
  }
230
230
  }
231
- const N = new A();
232
- function w(h, t) {
231
+ const S = new R();
232
+ function x(h, t) {
233
233
  for (const e in h)
234
234
  if (Object.prototype.hasOwnProperty.call(h, e)) {
235
235
  const i = h[e];
@@ -239,11 +239,11 @@ function w(h, t) {
239
239
  const p = class p {
240
240
  constructor(t) {
241
241
  this.elementRef = null, this.isHidden = !1, this.custom = !1, this.initialValues = {}, this.changeTimeout = null, this.isHandlingChange = !1, this.changeHandlers = /* @__PURE__ */ new Set(), this.blurTimeout = null, this.lastChangeTime = 0, this.handleBlur = () => {
242
- }, this.pendingBlurHandler = null, this.originalDefaultValues = {}, this.nestingLevel = 0, this.parentNestingLevel = 0, this.id = t.id || I(), this.title = t.title, this.settings = t.settings, this.description = t.description, this.icon = t.icon, this.isCollapsed = t.collapsed ?? !1, this.isMain = t.main ?? !1, this.custom = t.custom ?? !1, this.hideCondition = t.hideCondition, this.onBlur = t.onBlur, this.parentNestingLevel = t.parentNestingLevel ?? 0, this.nestingLevel = this.parentNestingLevel, this.includeGetJson = t.includeGetJson ?? !0, this.addItemCfg = t.addItem, Object.assign(this, t.settings), this.initialValues = this.getValues(), this.originalDefaultValues = this.getDefaultValues(), this.propagateNestingLevel();
242
+ }, this.pendingBlurHandler = null, this.originalDefaultValues = {}, this.nestingLevel = 0, this.parentNestingLevel = 0, this.id = t.id || O(), this.title = t.title, this.settings = t.settings, this.description = t.description, this.icon = t.icon, this.isCollapsed = t.collapsed ?? !1, this.isMain = t.main ?? !1, this.custom = t.custom ?? !1, this.hideCondition = t.hideCondition, this.onBlur = t.onBlur, this.parentNestingLevel = t.parentNestingLevel ?? 0, this.nestingLevel = this.parentNestingLevel, this.includeGetJson = t.includeGetJson ?? !0, this.addItemCfg = t.addItem, this.deleteItemCfg = t.deleteItem, Object.assign(this, t.settings), this.initialValues = this.getValues(), this.originalDefaultValues = this.getDefaultValues(), this.propagateNestingLevel();
243
243
  }
244
244
  propagateNestingLevel() {
245
245
  const t = this.nestingLevel + 1;
246
- w(this.settings, (e, i) => {
246
+ x(this.settings, (e, i) => {
247
247
  i instanceof p && (i.parentNestingLevel = this.nestingLevel, i.nestingLevel = t, i.propagateNestingLevel());
248
248
  });
249
249
  }
@@ -254,7 +254,7 @@ const p = class p {
254
254
  this.nestingLevel = t, this.propagateNestingLevel(), this.elementRef && this.updateNestingStyles();
255
255
  }
256
256
  updateNestingStyles() {
257
- this.elementRef && (b(this.elementRef, this.nestingLevel), k(this.elementRef, this.nestingLevel));
257
+ this.elementRef && (L(this.elementRef, this.nestingLevel), I(this.elementRef, this.nestingLevel));
258
258
  }
259
259
  static hide() {
260
260
  this.hiddenElements.forEach((t) => {
@@ -277,19 +277,19 @@ const p = class p {
277
277
  Object.keys(s).length > 0 && (this.lastChangeTime = Date.now(), this.initialValues = i, t(i), this.updateVisibility()), this.isHandlingChange = !1;
278
278
  }, 50));
279
279
  };
280
- return this.changeHandlers.clear(), w(this.settings, (i, s) => {
280
+ return this.changeHandlers.clear(), x(this.settings, (i, s) => {
281
281
  var n;
282
282
  if (s instanceof p)
283
283
  s.setOnChange(() => {
284
- const o = this.getValues();
285
- this.initialValues = o, t(o);
284
+ const a = this.getValues();
285
+ this.initialValues = a, t(a);
286
286
  }), this.changeHandlers.add(() => t(this.getValues()));
287
287
  else if (s instanceof g) {
288
- const o = () => e();
289
- this.changeHandlers.add(o), s.setOnChange(o);
288
+ const a = () => e();
289
+ this.changeHandlers.add(a), s.setOnChange(a);
290
290
  } else {
291
- const o = () => e();
292
- this.changeHandlers.add(o), (n = s.setOnChange) == null || n.call(s, o);
291
+ const a = () => e();
292
+ this.changeHandlers.add(a), (n = s.setOnChange) == null || n.call(s, a);
293
293
  }
294
294
  }), this;
295
295
  }
@@ -306,7 +306,7 @@ const p = class p {
306
306
  "focusout",
307
307
  this.handleBlur,
308
308
  !0
309
- )), w(this.settings, (t, e) => {
309
+ )), x(this.settings, (t, e) => {
310
310
  e instanceof p && e.setOnBlur(() => {
311
311
  this.onBlur && this.onBlur();
312
312
  });
@@ -320,7 +320,7 @@ const p = class p {
320
320
  }
321
321
  clone() {
322
322
  const t = {};
323
- w(this.settings, (s, n) => {
323
+ x(this.settings, (s, n) => {
324
324
  typeof n.clone == "function" ? t[s] = n.clone() : (console.warn(
325
325
  `Setting with key '${s}' does not have a clone method. Copying reference.`
326
326
  ), t[s] = n);
@@ -336,8 +336,9 @@ const p = class p {
336
336
  hideCondition: this.hideCondition,
337
337
  parentNestingLevel: this.parentNestingLevel,
338
338
  includeGetJson: this.includeGetJson,
339
- addItem: this.addItemCfg
340
- }, i = R(e);
339
+ addItem: this.addItemCfg,
340
+ deleteItem: this.deleteItemCfg
341
+ }, i = $(e);
341
342
  return i.initialValues = this.getValues(), i;
342
343
  }
343
344
  setValue(t) {
@@ -345,9 +346,9 @@ const p = class p {
345
346
  Object.entries(t).forEach(([i, s]) => {
346
347
  let n = this.settings[i];
347
348
  if (!n && this.addItemCfg && i.startsWith(this.addItemCfg.keyPrefix)) {
348
- const o = i.slice(this.addItemCfg.keyPrefix.length), a = Number(o);
349
- if (Number.isFinite(a)) {
350
- const l = this.addItemCfg.createItem(a);
349
+ const a = i.slice(this.addItemCfg.keyPrefix.length), o = Number(a);
350
+ if (Number.isFinite(o)) {
351
+ const l = this.addItemCfg.createItem(o);
351
352
  this.addSetting(i, l), n = l;
352
353
  }
353
354
  }
@@ -378,36 +379,39 @@ const p = class p {
378
379
  wireChild(t) {
379
380
  var i, s, n;
380
381
  const e = () => {
381
- var a;
382
- const o = this.getValues();
383
- this.initialValues = o, (a = this.onChange) == null || a.call(this, o), this.updateVisibility();
382
+ var o;
383
+ const a = this.getValues();
384
+ this.initialValues = a, (o = this.onChange) == null || o.call(this, a), this.updateVisibility();
384
385
  };
385
386
  t instanceof p ? (t.setOnChange(() => e()), (i = t.setOnBlur) == null || i.call(t, () => {
386
- var o;
387
- return (o = this.onBlur) == null ? void 0 : o.call(this);
387
+ var a;
388
+ return (a = this.onBlur) == null ? void 0 : a.call(this);
388
389
  })) : t instanceof g ? (t.setOnChange(() => e()), (s = t.setOnBlur) == null || s.call(t, () => {
389
- var o;
390
- return (o = this.onBlur) == null ? void 0 : o.call(this);
390
+ var a;
391
+ return (a = this.onBlur) == null ? void 0 : a.call(this);
391
392
  })) : (n = t.setOnChange) == null || n.call(t, () => e());
392
393
  }
393
394
  addSetting(t, e) {
394
- var s;
395
+ var s, n;
395
396
  if (this.settings[t] = e, this.wireChild(e), this.elementRef) {
396
- const n = this.elementRef.querySelector(
397
+ const a = this.elementRef.querySelector(
397
398
  ".setting-group-content"
398
399
  );
399
- if (n) {
400
+ if (a) {
400
401
  e instanceof p && e.setNestingLevel(this.nestingLevel + 1);
401
- const o = e.draw();
402
- this.addItemCfg && this.addItemCfg.showDeleteButton !== !1 && t.startsWith(this.addItemCfg.keyPrefix) && this.addDeleteButtonToElement(o, t);
403
- const a = n.querySelector(".sg-add-button-bottom");
404
- a ? n.insertBefore(o, a) : n.appendChild(o), N.trackElement(o), b(o, this.nestingLevel + 1), k(o, this.nestingLevel + 1);
405
- const l = o.style.display;
406
- o.style.display = "none", o.offsetHeight, o.style.display = l, this.updateNestingStyles();
402
+ const o = e.draw(), l = this.deleteItemCfg ?? this.addItemCfg;
403
+ if (l && l.showDeleteButton !== !1) {
404
+ const c = l.keyPrefix ?? ((s = this.addItemCfg) == null ? void 0 : s.keyPrefix);
405
+ c && t.startsWith(c) && this.addDeleteButtonToElement(o, t);
406
+ }
407
+ const r = a.querySelector(".sg-add-button-bottom");
408
+ r ? a.insertBefore(o, r) : a.appendChild(o), S.trackElement(o), L(o, this.nestingLevel + 1), I(o, this.nestingLevel + 1);
409
+ const d = o.style.display;
410
+ o.style.display = "none", o.offsetHeight, o.style.display = d, this.updateNestingStyles();
407
411
  }
408
412
  }
409
413
  const i = this.getValues();
410
- this.initialValues = i, (s = this.onChange) == null || s.call(this, i);
414
+ this.initialValues = i, (n = this.onChange) == null || n.call(this, i);
411
415
  }
412
416
  removeSetting(t) {
413
417
  var s;
@@ -418,13 +422,13 @@ const p = class p {
418
422
  ".setting-group-content"
419
423
  );
420
424
  if (n) {
421
- const o = Array.from(
425
+ const a = Array.from(
422
426
  n.querySelectorAll(".setting-group, .setting")
423
427
  );
424
- for (const a of o) {
425
- const l = a.id;
428
+ for (const o of a) {
429
+ const l = o.id;
426
430
  if (l && l.includes(e.id)) {
427
- a.remove();
431
+ o.remove();
428
432
  break;
429
433
  }
430
434
  }
@@ -435,13 +439,30 @@ const p = class p {
435
439
  this.initialValues = i, (s = this.onChange) == null || s.call(this, i);
436
440
  }
437
441
  addDeleteButtonToElement(t, e) {
438
- var l, c;
439
- const i = t.querySelector(".setting-group-title");
442
+ let i = null;
443
+ try {
444
+ i = t.querySelector(":scope > .setting-group-title");
445
+ } catch {
446
+ i = null;
447
+ }
448
+ if (!i) {
449
+ const r = Array.from(
450
+ t.querySelectorAll(".setting-group-title")
451
+ );
452
+ for (const d of r)
453
+ if (d.closest(".setting-group") === t) {
454
+ i = d;
455
+ break;
456
+ }
457
+ i || (i = r[0] ?? null);
458
+ }
440
459
  if (!i) return;
441
460
  const s = i.querySelector(".actions-section");
442
461
  if (!s) return;
443
462
  const n = document.createElement("button");
444
- n.type = "button", n.className = "sg-delete-button", n.title = ((l = this.addItemCfg) == null ? void 0 : l.deleteButtonLabel) || "Delete", n.style.cssText = `
463
+ n.type = "button", n.className = "sg-delete-button";
464
+ const a = this.deleteItemCfg ?? this.addItemCfg;
465
+ n.title = (a == null ? void 0 : a.deleteButtonLabel) || "Delete", n.style.cssText = `
445
466
  background: none;
446
467
  border: none;
447
468
  cursor: pointer;
@@ -454,7 +475,7 @@ const p = class p {
454
475
  border-radius: 4px;
455
476
  transition: background-color 0.2s;
456
477
  `;
457
- const o = ((c = this.addItemCfg) == null ? void 0 : c.deleteButtonIconSvg) || `
478
+ const o = (a == null ? void 0 : a.deleteButtonIconSvg) || `
458
479
  <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
459
480
  <path d="M2 4h12M5.333 4V2.667a1.333 1.333 0 0 1 1.334-1.334h2.666a1.333 1.333 0 0 1 1.334 1.334V4m2 0v9.333a1.333 1.333 0 0 1-1.334 1.334H4.667a1.333 1.333 0 0 1-1.334-1.334V4h8.667Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
460
481
  <path d="M6.667 7.333v4M9.333 7.333v4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
@@ -469,8 +490,8 @@ const p = class p {
469
490
  d && this.removeSetting(e);
470
491
  });
471
492
  });
472
- const a = s.querySelector(".setting-group-arrow");
473
- a ? s.insertBefore(n, a) : s.appendChild(n);
493
+ const l = s.querySelector(".setting-group-arrow");
494
+ l ? s.insertBefore(n, l) : s.appendChild(n);
474
495
  }
475
496
  showDeleteConfirmation() {
476
497
  return new Promise((t) => {
@@ -513,14 +534,14 @@ const p = class p {
513
534
  font-size: 14px;
514
535
  line-height: 1.5;
515
536
  `;
516
- const o = document.createElement("div");
517
- o.style.cssText = `
537
+ const a = document.createElement("div");
538
+ a.style.cssText = `
518
539
  display: flex;
519
540
  gap: 12px;
520
541
  justify-content: flex-end;
521
542
  `;
522
- const a = document.createElement("button");
523
- a.textContent = "Cancel", a.type = "button", a.style.cssText = `
543
+ const o = document.createElement("button");
544
+ o.textContent = "Cancel", o.type = "button", o.style.cssText = `
524
545
  padding: 8px 16px;
525
546
  border: 1px solid #d1d5db;
526
547
  background: white;
@@ -542,31 +563,31 @@ const p = class p {
542
563
  font-weight: 500;
543
564
  cursor: pointer;
544
565
  transition: all 0.2s;
545
- `, a.addEventListener("mouseenter", () => {
546
- a.style.backgroundColor = "#f9fafb", a.style.borderColor = "#9ca3af";
547
- }), a.addEventListener("mouseleave", () => {
548
- a.style.backgroundColor = "white", a.style.borderColor = "#d1d5db";
566
+ `, o.addEventListener("mouseenter", () => {
567
+ o.style.backgroundColor = "#f9fafb", o.style.borderColor = "#9ca3af";
568
+ }), o.addEventListener("mouseleave", () => {
569
+ o.style.backgroundColor = "white", o.style.borderColor = "#d1d5db";
549
570
  }), l.addEventListener("mouseenter", () => {
550
571
  l.style.backgroundColor = "#dc2626";
551
572
  }), l.addEventListener("mouseleave", () => {
552
573
  l.style.backgroundColor = "#ef4444";
553
574
  });
554
- const c = () => {
575
+ const r = () => {
555
576
  e.style.opacity = "0", i.style.transform = "scale(0.95)", setTimeout(() => {
556
577
  e.parentNode && e.parentNode.removeChild(e);
557
578
  }, 200);
558
579
  };
559
- a.addEventListener("click", () => {
560
- c(), t(!1);
580
+ o.addEventListener("click", () => {
581
+ r(), t(!1);
561
582
  }), l.addEventListener("click", () => {
562
- c(), t(!0);
563
- }), e.addEventListener("click", (d) => {
564
- d.target === e && (c(), t(!1));
583
+ r(), t(!0);
584
+ }), e.addEventListener("click", (c) => {
585
+ c.target === e && (r(), t(!1));
565
586
  });
566
- const r = (d) => {
567
- d.key === "Escape" && (c(), t(!1), document.removeEventListener("keydown", r));
587
+ const d = (c) => {
588
+ c.key === "Escape" && (r(), t(!1), document.removeEventListener("keydown", d));
568
589
  };
569
- document.addEventListener("keydown", r), o.appendChild(a), o.appendChild(l), i.appendChild(s), i.appendChild(n), i.appendChild(o), e.appendChild(i), document.body.appendChild(e), requestAnimationFrame(() => {
590
+ document.addEventListener("keydown", d), a.appendChild(o), a.appendChild(l), i.appendChild(s), i.appendChild(n), i.appendChild(a), e.appendChild(i), document.body.appendChild(e), requestAnimationFrame(() => {
570
591
  e.style.opacity = "1", i.style.transform = "scale(1)";
571
592
  }), setTimeout(() => l.focus(), 100);
572
593
  });
@@ -584,8 +605,8 @@ const p = class p {
584
605
  ...Object.keys(t),
585
606
  ...Object.keys(e)
586
607
  ])).forEach((n) => {
587
- const o = t[n], a = e[n];
588
- JSON.stringify(o) !== JSON.stringify(a) && (i[n] = { from: o, to: a });
608
+ const a = t[n], o = e[n];
609
+ JSON.stringify(a) !== JSON.stringify(o) && (i[n] = { from: a, to: o });
589
610
  }), i;
590
611
  }
591
612
  hide() {
@@ -680,8 +701,9 @@ const p = class p {
680
701
  }
681
702
  }
682
703
  draw() {
704
+ var d;
683
705
  const t = document.createElement("div");
684
- t.className = "setting-group", t.id = `setting-group-${this.id}`, p.hiddenElements.add(t), this.hideCondition && this.hideCondition() && (t.style.display = "none"), this.isMain && t.classList.add("main-group"), this.custom && t.classList.add("custom_class"), b(t, this.nestingLevel);
706
+ t.className = "setting-group", t.id = `setting-group-${this.id}`, p.hiddenElements.add(t), this.hideCondition && this.hideCondition() && (t.style.display = "none"), this.isMain && t.classList.add("main-group"), this.custom && t.classList.add("custom_class"), L(t, this.nestingLevel);
685
707
  const e = document.createElement("div");
686
708
  e.className = "setting-group-title", this.isCollapsed && e.classList.add("collapsed-view"), e.setAttribute("role", "button"), e.setAttribute(
687
709
  "aria-expanded",
@@ -689,90 +711,101 @@ const p = class p {
689
711
  ), e.setAttribute("tabindex", "0");
690
712
  const i = document.createElement("div");
691
713
  if (i.className = "title-section", this.icon) {
692
- const r = document.createElement("span");
693
- r.className = "group-icon", r.innerHTML = this.icon, i.appendChild(r);
714
+ const c = document.createElement("span");
715
+ c.className = "group-icon", c.innerHTML = this.icon, i.appendChild(c);
694
716
  }
695
717
  const s = document.createElement("h3");
696
718
  s.textContent = this.title, i.appendChild(s);
697
719
  const n = document.createElement("div");
698
720
  if (n.className = "actions-section", this.description && this.isCollapsed) {
699
- const r = document.createElement("span");
700
- r.className = "info-marker", r.innerHTML = `
721
+ const c = document.createElement("span");
722
+ c.className = "info-marker", c.innerHTML = `
701
723
  <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
702
724
  <path d="M8 5.33333V8M8 10.6667H8.00667M14 8C14 11.3137 11.3137 14 8 14C4.68629 14 2 11.3137 2 8C2 4.68629 4.68629 2 8 2C11.3137 2 14 4.68629 14 8Z"
703
725
  stroke="currentColor" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
704
726
  </svg>
705
- `, r.title = this.description, n.appendChild(r);
727
+ `, c.title = this.description, n.appendChild(c);
706
728
  }
707
- const o = document.createElement("span");
708
- o.className = "setting-group-arrow", o.innerHTML = `
729
+ const a = document.createElement("span");
730
+ a.className = "setting-group-arrow", a.innerHTML = `
709
731
  <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
710
732
  <path d="M4 6L8 10L12 6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
711
733
  </svg>
712
- `, this.isCollapsed && o.classList.add("rotated"), n.appendChild(o);
713
- const a = document.createElement("div");
714
- if (a.className = "setting-group-content", this.isCollapsed && (a.classList.add("collapsed"), e.classList.add("collapsed-view"), o.classList.add("rotated"), t.classList.add("collapsed")), this.isMain && a.classList.add("main-content"), this.description && !this.isCollapsed) {
715
- const r = document.createElement("div");
716
- r.className = "setting-group-description", r.textContent = this.description, a.appendChild(r);
734
+ `, this.isCollapsed && a.classList.add("rotated"), n.appendChild(a);
735
+ const o = document.createElement("div");
736
+ if (o.className = "setting-group-content", this.isCollapsed && (o.classList.add("collapsed"), e.classList.add("collapsed-view"), a.classList.add("rotated"), t.classList.add("collapsed")), this.isMain && o.classList.add("main-content"), this.description && !this.isCollapsed) {
737
+ const c = document.createElement("div");
738
+ c.className = "setting-group-description", c.textContent = this.description, o.appendChild(c);
717
739
  }
718
740
  const l = () => {
719
- this.isCollapsed = !this.isCollapsed, a.classList.toggle("collapsed"), e.classList.toggle("collapsed-view"), o.classList.toggle("rotated"), t.classList.toggle("collapsed", this.isCollapsed), e.setAttribute(
741
+ this.isCollapsed = !this.isCollapsed, o.classList.toggle("collapsed"), e.classList.toggle("collapsed-view"), a.classList.toggle("rotated"), t.classList.toggle("collapsed", this.isCollapsed), e.setAttribute(
720
742
  "aria-expanded",
721
743
  (!this.isCollapsed).toString()
722
744
  );
723
- const r = a.querySelector(
745
+ const c = o.querySelector(
724
746
  ".setting-group-description"
725
- ), d = n.querySelector(".info-marker");
747
+ ), u = n.querySelector(".info-marker");
726
748
  if (this.description)
727
749
  if (this.isCollapsed) {
728
- if (r && r.remove(), !d) {
729
- const u = document.createElement("span");
730
- u.className = "info-marker", u.innerHTML = `
750
+ if (c && c.remove(), !u) {
751
+ const m = document.createElement("span");
752
+ m.className = "info-marker", m.innerHTML = `
731
753
  <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
732
754
  <path d="M8 5.33333V8M8 10.6667H8.00667M14 8C14 11.3137 11.3137 14 8 14C4.68629 14 2 11.3137 2 8C2 4.68629 4.68629 2 8 2C11.3137 2 14 4.68629 14 8Z"
733
755
  stroke="currentColor" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
734
756
  </svg>
735
- `, u.title = this.description, n.insertBefore(u, o);
757
+ `, m.title = this.description, n.insertBefore(m, a);
736
758
  }
737
759
  } else {
738
- if (!r) {
739
- const u = document.createElement("div");
740
- u.className = "setting-group-description", u.textContent = this.description, a.insertBefore(
741
- u,
742
- a.firstChild
760
+ if (!c) {
761
+ const m = document.createElement("div");
762
+ m.className = "setting-group-description", m.textContent = this.description, o.insertBefore(
763
+ m,
764
+ o.firstChild
743
765
  );
744
766
  }
745
- d && d.remove();
767
+ u && u.remove();
746
768
  }
747
769
  };
748
- if (e.onclick = l, e.onkeydown = (r) => {
749
- (r.key === "Enter" || r.key === " ") && (r.preventDefault(), l());
770
+ if (e.onclick = l, e.onkeydown = (c) => {
771
+ (c.key === "Enter" || c.key === " ") && (c.preventDefault(), l());
750
772
  }, Object.keys(this.settings).length > 0) {
751
- for (const r in this.settings)
752
- if (Object.prototype.hasOwnProperty.call(this.settings, r)) {
753
- const d = this.settings[r];
754
- d instanceof p && d.setNestingLevel(this.nestingLevel + 1), a.appendChild(d.draw());
773
+ for (const c in this.settings)
774
+ if (Object.prototype.hasOwnProperty.call(this.settings, c)) {
775
+ const u = this.settings[c];
776
+ u instanceof p && u.setNestingLevel(this.nestingLevel + 1);
777
+ const m = u.draw();
778
+ if (u instanceof p && u.deleteItemCfg)
779
+ this.addDeleteButtonToElement(m, c);
780
+ else {
781
+ const E = this.deleteItemCfg ?? this.addItemCfg;
782
+ if (E && E.showDeleteButton !== !1) {
783
+ const b = E.keyPrefix ?? ((d = this.addItemCfg) == null ? void 0 : d.keyPrefix);
784
+ b && c.startsWith(b) && this.addDeleteButtonToElement(m, c);
785
+ }
786
+ }
787
+ o.appendChild(m);
755
788
  }
756
789
  } else {
757
- const r = document.createElement("div");
758
- r.className = "setting-group-empty", r.textContent = "No settings in this group", a.appendChild(r);
790
+ const c = document.createElement("div");
791
+ c.className = "setting-group-empty", c.textContent = "No settings in this group", o.appendChild(c);
759
792
  }
760
793
  if (this.addItemCfg) {
761
- const r = document.createElement("button");
762
- r.type = "button", r.className = "sg-add-button-bottom", r.style.marginTop = "8px";
763
- const d = this.addItemCfg.buttonIconSvg ?? `
794
+ const c = document.createElement("button");
795
+ c.type = "button", c.className = "sg-add-button-bottom", c.style.marginTop = "8px";
796
+ const u = this.addItemCfg.buttonIconSvg ?? `
764
797
  <svg width="16" height="16" viewBox="0 0 16 16" fill="none"
765
798
  xmlns="http://www.w3.org/2000/svg">
766
799
  <path d="M8 3.333v9.334M3.333 8h9.334" stroke="currentColor"
767
800
  stroke-width="1.5" stroke-linecap="round"/>
768
801
  </svg>`;
769
- r.innerHTML = `${d}<span style="margin-left:4px;">${this.addItemCfg.buttonLabel ?? "Add"}</span>`, r.addEventListener("click", (u) => {
770
- u.stopPropagation(), u.preventDefault();
771
- const V = this.getNextIndexFromPrefix(this.addItemCfg.keyPrefix), L = this.addItemCfg.createItem(V), S = `${this.addItemCfg.keyPrefix}${V}`;
772
- this.addSetting(S, L), this.addItemCfg.expandNewItem !== !1 && L.expand && L.expand();
773
- }), a.appendChild(r);
802
+ c.innerHTML = `${u}<span style="margin-left:4px;">${this.addItemCfg.buttonLabel ?? "Add"}</span>`, c.addEventListener("click", (m) => {
803
+ m.stopPropagation(), m.preventDefault();
804
+ const M = this.getNextIndexFromPrefix(this.addItemCfg.keyPrefix), E = this.addItemCfg.createItem(M), b = `${this.addItemCfg.keyPrefix}${M}`;
805
+ this.addSetting(b, E), this.addItemCfg.expandNewItem !== !1 && E.expand && E.expand();
806
+ }), o.appendChild(c);
774
807
  }
775
- return e.appendChild(i), e.appendChild(n), t.appendChild(e), t.appendChild(a), this.elementRef = t, N.trackElement(t), setTimeout(() => {
808
+ return e.appendChild(i), e.appendChild(n), t.appendChild(e), t.appendChild(o), this.elementRef = t, S.trackElement(t), setTimeout(() => {
776
809
  this.updateNestingStyles();
777
810
  }, 0), this.pendingBlurHandler && (this.setupBlurHandlers(), this.pendingBlurHandler = null), t;
778
811
  }
@@ -809,10 +842,10 @@ const p = class p {
809
842
  let i = e;
810
843
  const s = Object.keys(this.settings), n = Object.keys(e);
811
844
  if (!s.some(
812
- (a) => n.includes(a)
845
+ (o) => n.includes(o)
813
846
  ) && n.length === 1) {
814
- const a = n[0];
815
- i = e[a];
847
+ const o = n[0];
848
+ i = e[o];
816
849
  }
817
850
  this.setValue(i);
818
851
  } catch (e) {
@@ -821,8 +854,8 @@ const p = class p {
821
854
  }
822
855
  };
823
856
  p.hiddenElements = /* @__PURE__ */ new Set();
824
- let f = p;
825
- class pt extends f {
857
+ let v = p;
858
+ class gt extends v {
826
859
  constructor(t) {
827
860
  super(t);
828
861
  const e = Object.keys(this.settings)[0];
@@ -856,28 +889,28 @@ class pt extends f {
856
889
  s.textContent = this.title, i.appendChild(s);
857
890
  const n = document.createElement("div");
858
891
  n.className = "tabs-header", this.tabsContainer = n;
859
- const o = document.createElement("div");
860
- if (o.className = "tab-content", this.contentContainers = {}, Object.keys(this.settings).forEach((a, l) => {
861
- const c = document.createElement("button");
862
- c.className = "tab-button", c.type = "button", c.setAttribute("data-tab-id", a), c.textContent = a, c.addEventListener("click", () => this.switchToTab(a)), n.appendChild(c);
863
- const r = document.createElement("div");
864
- r.className = "tab-panel", this.contentContainers[a] = r;
865
- const d = this.settings[a];
866
- d && (d instanceof f && d.setNestingLevel(this.getNestingLevel() + 1), r.appendChild(d.draw())), o.appendChild(r), l === 0 && !this.activeTabId && (this.activeTabId = a);
867
- }), e.appendChild(i), e.appendChild(n), e.appendChild(o), !this.activeTabId) {
868
- const a = Object.keys(this.settings)[0];
869
- this.activeTabId = a || "";
892
+ const a = document.createElement("div");
893
+ if (a.className = "tab-content", this.contentContainers = {}, Object.keys(this.settings).forEach((o, l) => {
894
+ const r = document.createElement("button");
895
+ r.className = "tab-button", r.type = "button", r.setAttribute("data-tab-id", o), r.textContent = o, r.addEventListener("click", () => this.switchToTab(o)), n.appendChild(r);
896
+ const d = document.createElement("div");
897
+ d.className = "tab-panel", this.contentContainers[o] = d;
898
+ const c = this.settings[o];
899
+ c && (c instanceof v && c.setNestingLevel(this.getNestingLevel() + 1), d.appendChild(c.draw())), a.appendChild(d), l === 0 && !this.activeTabId && (this.activeTabId = o);
900
+ }), e.appendChild(i), e.appendChild(n), e.appendChild(a), !this.activeTabId) {
901
+ const o = Object.keys(this.settings)[0];
902
+ this.activeTabId = o || "";
870
903
  }
871
904
  return this.updateTabUI(), t;
872
905
  }
873
906
  }
874
- function R(h) {
875
- return new f(h);
907
+ function $(h) {
908
+ return new v(h);
876
909
  }
877
- function gt(h) {
910
+ function mt(h) {
878
911
  return h;
879
912
  }
880
- class $ extends g {
913
+ class F extends g {
881
914
  constructor(t = {}) {
882
915
  super(t), this.inputType = "text", t.onChange && this.setOnChange(t.onChange);
883
916
  }
@@ -897,31 +930,31 @@ class $ extends g {
897
930
  });
898
931
  }
899
932
  }
900
- const F = "<svg xmlns='http://www.w3.org/2000/svg' width='18' height='19' viewBox='0 0 18 19' fill='none'><path d='M8.99999 15.8542C9.79613 16.5667 10.8475 17 12 17C14.4853 17 16.5 14.9853 16.5 12.5C16.5 10.4248 15.0953 8.67769 13.1849 8.15763M4.81513 8.15762C2.9047 8.67768 1.5 10.4248 1.5 12.5C1.5 14.9853 3.51472 17 6 17C8.48528 17 10.5 14.9853 10.5 12.5C10.5 11.9146 10.3882 11.3554 10.1849 10.8424M13.5 6.5C13.5 8.98528 11.4853 11 9 11C6.51472 11 4.5 8.98528 4.5 6.5C4.5 4.01472 6.51472 2 9 2C11.4853 2 13.5 4.01472 13.5 6.5Z' stroke='#667085' stroke-linecap='round' stroke-linejoin='round'/></svg>";
901
- class m extends $ {
933
+ const z = "<svg xmlns='http://www.w3.org/2000/svg' width='18' height='19' viewBox='0 0 18 19' fill='none'><path d='M8.99999 15.8542C9.79613 16.5667 10.8475 17 12 17C14.4853 17 16.5 14.9853 16.5 12.5C16.5 10.4248 15.0953 8.67769 13.1849 8.15763M4.81513 8.15762C2.9047 8.67768 1.5 10.4248 1.5 12.5C1.5 14.9853 3.51472 17 6 17C8.48528 17 10.5 14.9853 10.5 12.5C10.5 11.9146 10.3882 11.3554 10.1849 10.8424M13.5 6.5C13.5 8.98528 11.4853 11 9 11C6.51472 11 4.5 8.98528 4.5 6.5C4.5 4.01472 6.51472 2 9 2C11.4853 2 13.5 4.01472 13.5 6.5Z' stroke='#667085' stroke-linecap='round' stroke-linejoin='round'/></svg>";
934
+ class f extends F {
902
935
  constructor(t) {
903
936
  super({
904
937
  ...t,
905
- icon: t.icon || F,
938
+ icon: t.icon || z,
906
939
  title: t.title || "Color",
907
- default: t.default ? m.normalizeColorValue(t.default) : "#000000"
940
+ default: t.default ? f.normalizeColorValue(t.default) : "#000000"
908
941
  }), this.inputType = "color", this.element = null, this.colorInputEl = null, this.textInputEl = null, this.detectChange = t.detectChange;
909
942
  }
910
943
  static normalizeColorValue(t) {
911
- return t.startsWith("#") ? m.normalizeHexValue(t) : t.includes(",") ? m.rgbToHexStatic(t) : m.normalizeHexValue(t);
944
+ return t.startsWith("#") ? f.normalizeHexValue(t) : t.includes(",") ? f.rgbToHexStatic(t) : f.normalizeHexValue(t);
912
945
  }
913
946
  static normalizeHexValue(t) {
914
947
  return t = t.replace("#", ""), t.length === 3 && (t = t.split("").map((e) => e + e).join("")), t.length !== 6 ? (console.warn(`Invalid hex value "${t}", using default "#000000"`), "#000000") : /^[0-9A-Fa-f]{6}$/.test(t) ? `#${t.toLowerCase()}` : (console.warn(`Invalid hex value "${t}", using default "#000000"`), "#000000");
915
948
  }
916
949
  static rgbToHexStatic(t) {
917
- const e = t.split(",").map((r) => parseInt(r.trim()));
950
+ const e = t.split(",").map((d) => parseInt(d.trim()));
918
951
  if (e.length !== 3 || e.some(isNaN))
919
952
  return console.warn(`Invalid RGB value "${t}", using default "#000000"`), "#000000";
920
- const [i, s, n] = e, o = Math.max(0, Math.min(255, i)), a = Math.max(0, Math.min(255, s)), l = Math.max(0, Math.min(255, n)), c = (r) => {
921
- const d = r.toString(16);
922
- return d.length === 1 ? "0" + d : d;
953
+ const [i, s, n] = e, a = Math.max(0, Math.min(255, i)), o = Math.max(0, Math.min(255, s)), l = Math.max(0, Math.min(255, n)), r = (d) => {
954
+ const c = d.toString(16);
955
+ return c.length === 1 ? "0" + c : c;
923
956
  };
924
- return `#${c(o)}${c(a)}${c(l)}`;
957
+ return `#${r(a)}${r(o)}${r(l)}`;
925
958
  }
926
959
  setValue(t) {
927
960
  if (t === void 0) {
@@ -929,7 +962,7 @@ class m extends $ {
929
962
  return;
930
963
  }
931
964
  if (typeof t == "string") {
932
- const e = m.normalizeColorValue(t);
965
+ const e = f.normalizeColorValue(t);
933
966
  this.value = e, this.colorInputEl && (this.colorInputEl.value = e), this.textInputEl && (this.textInputEl.value = e), this.onChange && this.onChange(e), this.props.detectChange && this.props.detectChange(e);
934
967
  } else
935
968
  this.value = "#000000", this.colorInputEl && (this.colorInputEl.value = "#000000"), this.textInputEl && (this.textInputEl.value = "#000000"), this.onChange && this.onChange("#000000"), this.props.detectChange && this.props.detectChange("#000000");
@@ -944,53 +977,53 @@ class m extends $ {
944
977
  if (t.className = "color-setting-wrapper " + (this.props.wrapperClassName || ""), this.props.title || this.props.icon) {
945
978
  const l = document.createElement("div");
946
979
  if (l.className = "icon-container", this.props.icon) {
947
- const c = document.createElement("span");
948
- c.className = "input-icon", c.innerHTML = this.props.icon, l.appendChild(c);
980
+ const r = document.createElement("span");
981
+ r.className = "input-icon", r.innerHTML = this.props.icon, l.appendChild(r);
949
982
  }
950
983
  if (this.props.title) {
951
- const c = document.createElement("span");
952
- c.className = "input-label", c.textContent = this.props.title, l.appendChild(c);
984
+ const r = document.createElement("span");
985
+ r.className = "input-label", r.textContent = this.props.title, l.appendChild(r);
953
986
  }
954
987
  t.appendChild(l);
955
988
  }
956
989
  const e = document.createElement("div");
957
990
  e.className = "color-input-wrapper";
958
991
  const i = (l) => {
959
- const c = l.value.trim();
960
- if (!c)
992
+ const r = l.value.trim();
993
+ if (!r)
961
994
  return e.classList.remove("error"), !0;
962
- const d = /^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/.test(c);
963
- return d ? e.classList.remove("error") : e.classList.add("error"), d;
995
+ const c = /^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/.test(r);
996
+ return c ? e.classList.remove("error") : e.classList.add("error"), c;
964
997
  }, s = document.createElement("input");
965
998
  s.type = "color", s.className = "color-picker", s.value = this.value || "#000000", s.setAttribute("aria-label", "Choose color"), s.setAttribute("title", "Click to open color picker"), this.colorInputEl = s;
966
999
  const n = document.createElement("div");
967
1000
  n.className = "color-preview";
968
- const o = this.value || "#000000";
969
- n.style.backgroundColor = o;
970
- const a = document.createElement("input");
971
- return a.type = "text", a.className = "color-text-input", a.value = this.value || "", a.placeholder = "#000000", a.setAttribute("pattern", "#[0-9A-Fa-f]{6}"), a.setAttribute("title", "Enter a hex color value (e.g., #ff0000)"), a.setAttribute("aria-label", "Hex color value"), a.setAttribute("maxlength", "7"), this.textInputEl = a, this.textInputEl.addEventListener("input", (l) => {
972
- var r, d;
973
- let c = l.target.value.trim();
1001
+ const a = this.value || "#000000";
1002
+ n.style.backgroundColor = a;
1003
+ const o = document.createElement("input");
1004
+ return o.type = "text", o.className = "color-text-input", o.value = this.value || "", o.placeholder = "#000000", o.setAttribute("pattern", "#[0-9A-Fa-f]{6}"), o.setAttribute("title", "Enter a hex color value (e.g., #ff0000)"), o.setAttribute("aria-label", "Hex color value"), o.setAttribute("maxlength", "7"), this.textInputEl = o, this.textInputEl.addEventListener("input", (l) => {
1005
+ var d, c;
1006
+ let r = l.target.value.trim();
974
1007
  if (this.textInputEl && i(this.textInputEl)) {
975
- const u = m.normalizeColorValue(c);
976
- this.value = u, (r = this.onChange) == null || r.call(this, u), (d = this.detectChange) == null || d.call(this, u), this.colorInputEl && (this.colorInputEl.value = u), n.style.backgroundColor = u;
1008
+ const u = f.normalizeColorValue(r);
1009
+ this.value = u, (d = this.onChange) == null || d.call(this, u), (c = this.detectChange) == null || c.call(this, u), this.colorInputEl && (this.colorInputEl.value = u), n.style.backgroundColor = u;
977
1010
  }
978
1011
  }), this.colorInputEl.addEventListener("input", (l) => {
979
- var d, u;
980
- const c = l.target.value, r = m.normalizeColorValue(c);
981
- this.value = r, (d = this.onChange) == null || d.call(this, r), (u = this.detectChange) == null || u.call(this, r), this.textInputEl && (this.textInputEl.value = r), n.style.backgroundColor = r, e.classList.remove("error");
1012
+ var c, u;
1013
+ const r = l.target.value, d = f.normalizeColorValue(r);
1014
+ this.value = d, (c = this.onChange) == null || c.call(this, d), (u = this.detectChange) == null || u.call(this, d), this.textInputEl && (this.textInputEl.value = d), n.style.backgroundColor = d, e.classList.remove("error");
982
1015
  }), this.colorInputEl.addEventListener("change", (l) => {
983
- var d, u;
984
- const c = l.target.value, r = m.normalizeColorValue(c);
985
- this.value = r, (d = this.onChange) == null || d.call(this, r), (u = this.detectChange) == null || u.call(this, r), this.textInputEl && (this.textInputEl.value = r), n.style.backgroundColor = r;
986
- }), e.appendChild(s), e.appendChild(n), e.appendChild(a), t.appendChild(e), this.element = t, t;
1016
+ var c, u;
1017
+ const r = l.target.value, d = f.normalizeColorValue(r);
1018
+ this.value = d, (c = this.onChange) == null || c.call(this, d), (u = this.detectChange) == null || u.call(this, d), this.textInputEl && (this.textInputEl.value = d), n.style.backgroundColor = d;
1019
+ }), e.appendChild(s), e.appendChild(n), e.appendChild(o), t.appendChild(e), this.element = t, t;
987
1020
  }
988
1021
  getElement() {
989
1022
  return this.element;
990
1023
  }
991
1024
  // Helper method to get normalized hex value
992
1025
  getNormalizedValue() {
993
- return this.value ? m.normalizeColorValue(this.value) : "#000000";
1026
+ return this.value ? f.normalizeColorValue(this.value) : "#000000";
994
1027
  }
995
1028
  // Helper method to check if current value is valid hex
996
1029
  isValidHex() {
@@ -1001,20 +1034,20 @@ class m extends $ {
1001
1034
  return this.isValidHex() ? this.hexToRgb(this.value) : "0, 0, 0";
1002
1035
  }
1003
1036
  }
1004
- const z = `
1037
+ const j = `
1005
1038
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1006
1039
  <path d="M8.99999 15.8542C9.79613 16.5667 10.8475 17 12 17C14.4853 17 16.5 14.9853 16.5 12.5C16.5 10.4248 15.0953 8.67769 13.1849 8.15763M4.81513 8.15762C2.9047 8.67768 1.5 10.4248 1.5 12.5C1.5 14.9853 3.51472 17 6 17C8.48528 17 10.5 14.9853 10.5 12.5C10.5 11.9146 10.3882 11.3554 10.1849 10.8424M13.5 6.5C13.5 8.98528 11.4853 11 9 11C6.51472 11 4.5 8.98528 4.5 6.5C4.5 4.01472 6.51472 2 9 2C11.4853 2 13.5 4.01472 13.5 6.5Z" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
1007
1040
  <path d="M9 17C13.4183 17 17 13.4183 17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17Z" stroke="#667085" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round" opacity="0.5"/>
1008
1041
  <path d="M9 1V17C4.58172 17 1 13.4183 1 9C1 4.58172 4.58172 1 9 1Z" fill="#667085" stroke="#667085" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round" opacity="0.5"/>
1009
1042
  </svg>`;
1010
- class C extends g {
1043
+ class w extends g {
1011
1044
  constructor(t = {}) {
1012
1045
  super({
1013
1046
  ...t,
1014
- icon: t.icon || z,
1047
+ icon: t.icon || j,
1015
1048
  title: t.title || "Color & Opacity",
1016
1049
  default: t.default || "#000000FF"
1017
- }), this.inputType = "color", this.element = null, this.colorInputEl = null, this.textInputEl = null, this.opacityInputEl = null, this.colorPreviewEl = null, this.detectChange = t.detectChange, this.value && (this.value = C.normalizeHexWithOpacity(this.value));
1050
+ }), this.inputType = "color", this.element = null, this.colorInputEl = null, this.textInputEl = null, this.opacityInputEl = null, this.colorPreviewEl = null, this.detectChange = t.detectChange, this.value && (this.value = w.normalizeHexWithOpacity(this.value));
1018
1051
  }
1019
1052
  static normalizeHexWithOpacity(t) {
1020
1053
  return t = t.replace("#", ""), t.length === 3 && (t = t.split("").map((e) => e + e).join("")), t.length === 6 && (t = t + "FF"), t.length === 8 && /^[0-9A-Fa-f]{8}$/.test(t) ? `#${t.toUpperCase()}` : (console.warn(`Invalid hex value "${t}", using default "#000000FF"`), "#000000FF");
@@ -1032,18 +1065,18 @@ class C extends g {
1032
1065
  return `#${i}${n}`;
1033
1066
  }
1034
1067
  setValue(t) {
1035
- t === void 0 || t === "" ? this.value = "#000000FF" : this.value = C.normalizeHexWithOpacity(t), this.updateInputElements(), this.updateColorPreview(), this.onChange && this.onChange(this.value), this.detectChange && this.detectChange(this.value);
1068
+ t === void 0 || t === "" ? this.value = "#000000FF" : this.value = w.normalizeHexWithOpacity(t), this.updateInputElements(), this.updateColorPreview(), this.onChange && this.onChange(this.value), this.detectChange && this.detectChange(this.value);
1036
1069
  }
1037
1070
  updateInputElements() {
1038
1071
  this.value && (this.colorInputEl && (this.colorInputEl.value = this.getRgbColor()), this.textInputEl && (this.textInputEl.value = this.value), this.opacityInputEl && (this.opacityInputEl.value = this.getOpacityPercent().toString()));
1039
1072
  }
1040
1073
  updateColorPreview() {
1041
1074
  if (!this.colorPreviewEl || !this.value) return;
1042
- const t = this.getRgbColor(), e = this.getOpacityPercent() / 100, i = t.replace("#", ""), s = parseInt(i.substring(0, 2), 16), n = parseInt(i.substring(2, 4), 16), o = parseInt(i.substring(4, 6), 16);
1043
- this.colorPreviewEl.style.backgroundColor = `rgba(${s}, ${n}, ${o}, ${e})`;
1075
+ const t = this.getRgbColor(), e = this.getOpacityPercent() / 100, i = t.replace("#", ""), s = parseInt(i.substring(0, 2), 16), n = parseInt(i.substring(2, 4), 16), a = parseInt(i.substring(4, 6), 16);
1076
+ this.colorPreviewEl.style.backgroundColor = `rgba(${s}, ${n}, ${a}, ${e})`;
1044
1077
  }
1045
1078
  handleColorChange(t) {
1046
- const e = this.getOpacityPercent(), i = C.combineColorOpacity(t, e);
1079
+ const e = this.getOpacityPercent(), i = w.combineColorOpacity(t, e);
1047
1080
  this.setValue(i);
1048
1081
  }
1049
1082
  handleTextInput(t) {
@@ -1051,47 +1084,47 @@ class C extends g {
1051
1084
  return e || i ? (this.setValue(t), !0) : !1;
1052
1085
  }
1053
1086
  handleOpacityChange(t) {
1054
- const e = this.getRgbColor(), i = Math.max(0, Math.min(100, t)), s = C.combineColorOpacity(e, i);
1087
+ const e = this.getRgbColor(), i = Math.max(0, Math.min(100, t)), s = w.combineColorOpacity(e, i);
1055
1088
  this.setValue(s);
1056
1089
  }
1057
1090
  draw() {
1058
1091
  const t = document.createElement("div");
1059
1092
  if (t.className = "color-with-opacity-setting-wrapper " + (this.props.wrapperClassName || ""), this.props.title || this.props.icon) {
1060
- const o = document.createElement("div");
1061
- if (o.className = "icon-container", this.props.icon) {
1062
- const a = document.createElement("span");
1063
- a.className = "input-icon", a.innerHTML = this.props.icon, o.appendChild(a);
1093
+ const a = document.createElement("div");
1094
+ if (a.className = "icon-container", this.props.icon) {
1095
+ const o = document.createElement("span");
1096
+ o.className = "input-icon", o.innerHTML = this.props.icon, a.appendChild(o);
1064
1097
  }
1065
1098
  if (this.props.title) {
1066
- const a = document.createElement("span");
1067
- a.className = "input-label", a.textContent = this.props.title, o.appendChild(a);
1099
+ const o = document.createElement("span");
1100
+ o.className = "input-label", o.textContent = this.props.title, a.appendChild(o);
1068
1101
  }
1069
- t.appendChild(o);
1102
+ t.appendChild(a);
1070
1103
  }
1071
1104
  const e = document.createElement("div");
1072
- e.className = "color-with-opacity-input-wrapper", this.colorInputEl = document.createElement("input"), this.colorInputEl.type = "color", this.colorInputEl.className = "color-with-opacity-picker", this.colorPreviewEl = document.createElement("div"), this.colorPreviewEl.className = "color-with-opacity-preview", this.textInputEl = document.createElement("input"), this.textInputEl.type = "text", this.textInputEl.className = "color-with-opacity-text-input", this.textInputEl.placeholder = "#000000FF", this.updateInputElements(), this.updateColorPreview(), this.colorInputEl.addEventListener("input", (o) => {
1073
- const a = o.target;
1074
- this.handleColorChange(a.value), this.textInputEl && (this.textInputEl.value = this.value || "#000000FF"), this.updateColorPreview();
1075
- }), this.textInputEl.addEventListener("input", (o) => {
1076
- const a = o.target;
1077
- this.handleTextInput(a.value) ? (this.colorInputEl && (this.colorInputEl.value = this.getRgbColor()), this.updateColorPreview(), e.classList.remove("error")) : a.value.trim() === "" ? e.classList.remove("error") : e.classList.add("error");
1078
- }), this.textInputEl.addEventListener("blur", (o) => {
1079
- const a = o.target;
1080
- a.value.trim() === "" && (a.value = this.value || "#000000FF", e.classList.remove("error"));
1105
+ e.className = "color-with-opacity-input-wrapper", this.colorInputEl = document.createElement("input"), this.colorInputEl.type = "color", this.colorInputEl.className = "color-with-opacity-picker", this.colorPreviewEl = document.createElement("div"), this.colorPreviewEl.className = "color-with-opacity-preview", this.textInputEl = document.createElement("input"), this.textInputEl.type = "text", this.textInputEl.className = "color-with-opacity-text-input", this.textInputEl.placeholder = "#000000FF", this.updateInputElements(), this.updateColorPreview(), this.colorInputEl.addEventListener("input", (a) => {
1106
+ const o = a.target;
1107
+ this.handleColorChange(o.value), this.textInputEl && (this.textInputEl.value = this.value || "#000000FF"), this.updateColorPreview();
1108
+ }), this.textInputEl.addEventListener("input", (a) => {
1109
+ const o = a.target;
1110
+ this.handleTextInput(o.value) ? (this.colorInputEl && (this.colorInputEl.value = this.getRgbColor()), this.updateColorPreview(), e.classList.remove("error")) : o.value.trim() === "" ? e.classList.remove("error") : e.classList.add("error");
1111
+ }), this.textInputEl.addEventListener("blur", (a) => {
1112
+ const o = a.target;
1113
+ o.value.trim() === "" && (o.value = this.value || "#000000FF", e.classList.remove("error"));
1081
1114
  }), this.colorPreviewEl.addEventListener("click", () => {
1082
- var o;
1083
- (o = this.colorInputEl) == null || o.click();
1115
+ var a;
1116
+ (a = this.colorInputEl) == null || a.click();
1084
1117
  }), e.appendChild(this.colorInputEl), e.appendChild(this.colorPreviewEl), e.appendChild(this.textInputEl);
1085
1118
  const i = document.createElement("div");
1086
1119
  i.className = "color-with-opacity-opacity-wrapper", this.opacityInputEl = document.createElement("input"), this.opacityInputEl.type = "number", this.opacityInputEl.className = "color-with-opacity-opacity-input", this.opacityInputEl.value = this.getOpacityPercent().toString(), this.opacityInputEl.min = "0", this.opacityInputEl.max = "100", this.opacityInputEl.step = "1", this.opacityInputEl.placeholder = "100";
1087
1120
  const s = document.createElement("span");
1088
- s.className = "color-with-opacity-opacity-suffix", s.textContent = "%", this.opacityInputEl.addEventListener("input", (o) => {
1089
- const a = o.target, l = parseFloat(a.value);
1121
+ s.className = "color-with-opacity-opacity-suffix", s.textContent = "%", this.opacityInputEl.addEventListener("input", (a) => {
1122
+ const o = a.target, l = parseFloat(o.value);
1090
1123
  isNaN(l) || (this.handleOpacityChange(l), this.textInputEl && (this.textInputEl.value = this.value || "#000000FF"), this.updateColorPreview());
1091
- }), this.opacityInputEl.addEventListener("blur", (o) => {
1092
- const a = o.target;
1093
- let l = parseFloat(a.value);
1094
- isNaN(l) && (l = this.getOpacityPercent()), l = Math.max(0, Math.min(100, l)), a.value = l.toString(), this.handleOpacityChange(l), this.textInputEl && (this.textInputEl.value = this.value || "#000000FF"), this.updateColorPreview();
1124
+ }), this.opacityInputEl.addEventListener("blur", (a) => {
1125
+ const o = a.target;
1126
+ let l = parseFloat(o.value);
1127
+ isNaN(l) && (l = this.getOpacityPercent()), l = Math.max(0, Math.min(100, l)), o.value = l.toString(), this.handleOpacityChange(l), this.textInputEl && (this.textInputEl.value = this.value || "#000000FF"), this.updateColorPreview();
1095
1128
  }), i.appendChild(this.opacityInputEl), i.appendChild(s);
1096
1129
  const n = document.createElement("div");
1097
1130
  return n.className = "color-with-opacity-controls-wrapper", n.appendChild(e), n.appendChild(i), t.appendChild(n), this.element = t, this.updateInputElements(), this.updateColorPreview(), t;
@@ -1104,8 +1137,8 @@ class C extends g {
1104
1137
  }
1105
1138
  getRgbaValue() {
1106
1139
  if (!this.value) return "rgba(0, 0, 0, 1)";
1107
- const t = this.getRgbColor(), e = this.getOpacityPercent() / 100, i = t.replace("#", ""), s = parseInt(i.substring(0, 2), 16), n = parseInt(i.substring(2, 4), 16), o = parseInt(i.substring(4, 6), 16);
1108
- return `rgba(${s}, ${n}, ${o}, ${e})`;
1140
+ const t = this.getRgbColor(), e = this.getOpacityPercent() / 100, i = t.replace("#", ""), s = parseInt(i.substring(0, 2), 16), n = parseInt(i.substring(2, 4), 16), a = parseInt(i.substring(4, 6), 16);
1141
+ return `rgba(${s}, ${n}, ${a}, ${e})`;
1109
1142
  }
1110
1143
  getColorAndOpacity() {
1111
1144
  return {
@@ -1114,7 +1147,7 @@ class C extends g {
1114
1147
  };
1115
1148
  }
1116
1149
  }
1117
- class mt extends g {
1150
+ class ft extends g {
1118
1151
  constructor(t = {}) {
1119
1152
  super(t), this.inputType = "text", t.onChange && this.setOnChange(t.onChange);
1120
1153
  }
@@ -1126,27 +1159,27 @@ class mt extends g {
1126
1159
  if (t.className = "html-setting-wrapper " + (this.props.wrapperClassName || ""), this.props.title || this.props.icon) {
1127
1160
  const n = document.createElement("div");
1128
1161
  if (n.className = "icon-container", this.props.icon) {
1129
- const o = this.createIcon(this.props.icon);
1130
- n.appendChild(o);
1162
+ const a = this.createIcon(this.props.icon);
1163
+ n.appendChild(a);
1131
1164
  }
1132
1165
  if (this.props.title) {
1133
- const o = this.createLabel(this.props.title);
1134
- n.appendChild(o);
1166
+ const a = this.createLabel(this.props.title);
1167
+ n.appendChild(a);
1135
1168
  }
1136
1169
  t.appendChild(n);
1137
1170
  }
1138
1171
  const e = document.createElement("textarea");
1139
1172
  this.textareaEl = e, e.value = this.value || "", e.placeholder = this.props.placeholder || "Paste your HTML here...", e.className = "html-setting-textarea " + (this.props.textareaClassName || ""), e.rows = this.props.rows || 6, this.props.maxLength !== void 0 && (e.maxLength = this.props.maxLength), this.props.className && e.classList.add(this.props.className);
1140
1173
  const i = (n) => {
1141
- const a = n.target.value;
1142
- this.value = a, this.onChange && this.onChange(this.value), this.props.detectChange && this.props.detectChange(this.value);
1174
+ const o = n.target.value;
1175
+ this.value = o, this.onChange && this.onChange(this.value), this.props.detectChange && this.props.detectChange(this.value);
1143
1176
  }, s = (n) => {
1144
1177
  this.onBlur && this.value !== void 0 && this.onBlur(this.value);
1145
1178
  };
1146
1179
  return e.addEventListener("input", i), e.addEventListener("change", i), e.addEventListener("blur", s), t.appendChild(e), t;
1147
1180
  }
1148
1181
  }
1149
- class v extends g {
1182
+ class C extends g {
1150
1183
  constructor(t) {
1151
1184
  super(t), this.inputType = "number", this.inputElement = null, this.mobileValue = t.mobile, this.validateProps(), this.value = this.validateValue(this.value);
1152
1185
  }
@@ -1169,12 +1202,12 @@ class v extends g {
1169
1202
  const i = document.createElement("input");
1170
1203
  if (i.type = "number", i.className = "number-setting-input " + (this.props.inputClassName || ""), i.value = String(this.value ?? ""), i.placeholder = this.props.placeholder || "", this.props.minValue !== void 0 && (i.min = String(this.props.minValue)), this.props.maxValue !== void 0 && (i.max = String(this.props.maxValue)), this.props.step !== void 0 && (i.step = String(this.props.step)), i.addEventListener("input", () => {
1171
1204
  const s = this.props.minValue ?? Number.MIN_SAFE_INTEGER, n = this.props.maxValue ?? Number.MAX_SAFE_INTEGER;
1172
- let o = Number(i.value);
1173
- o < s && (o = s), o > n && (o = n), String(o) !== i.value && (i.value = String(o)), this.setValue(o);
1205
+ let a = Number(i.value);
1206
+ a < s && (a = s), a > n && (a = n), String(a) !== i.value && (i.value = String(a)), this.setValue(a);
1174
1207
  }), i.addEventListener("blur", () => {
1175
- var n, o;
1208
+ var n, a;
1176
1209
  const s = this.validateValue(Number(i.value));
1177
- s !== Number(i.value) && (i.value = String(s), this.setValue(s)), (o = (n = this.props).onBlur) == null || o.call(n);
1210
+ s !== Number(i.value) && (i.value = String(s), this.setValue(s)), (a = (n = this.props).onBlur) == null || a.call(n);
1178
1211
  }), e.appendChild(i), this.props.suffix && this.props.suffix !== "none") {
1179
1212
  const s = document.createElement("span");
1180
1213
  s.className = "suffix-label", s.textContent = this.props.suffix, e.appendChild(s);
@@ -1205,12 +1238,12 @@ class v extends g {
1205
1238
  );
1206
1239
  }
1207
1240
  }
1208
- const j = `
1241
+ const P = `
1209
1242
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1210
1243
  <path d="M9 17C13.4183 17 17 13.4183 17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17Z" stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
1211
1244
  <path d="M9 1V17C4.58172 17 1 13.4183 1 9C1 4.58172 4.58172 1 9 1Z" fill="#667085" stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
1212
1245
  </svg>`;
1213
- class P extends v {
1246
+ class G extends C {
1214
1247
  constructor(t = {}) {
1215
1248
  const e = {
1216
1249
  title: "Opacity",
@@ -1219,7 +1252,7 @@ class P extends v {
1219
1252
  maxValue: 100,
1220
1253
  step: 1,
1221
1254
  default: t.default ?? 100,
1222
- icon: j,
1255
+ icon: P,
1223
1256
  ...t
1224
1257
  };
1225
1258
  super(e), this.inputType = "number", this.mobileValue = t.mobile;
@@ -1231,12 +1264,12 @@ class P extends v {
1231
1264
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1232
1265
  }
1233
1266
  }
1234
- const G = `
1267
+ const D = `
1235
1268
  <svg xmlns="http://www.w3.org/2000/svg" class="svg-select" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down">
1236
1269
  <polyline points="6 9 12 15 18 9"></polyline>
1237
1270
  </svg>
1238
1271
  `;
1239
- class M extends g {
1272
+ class N extends g {
1240
1273
  constructor(t = {}) {
1241
1274
  if (super(t), this.inputType = "select", this._options = [], this.isOpen = !1, this.selectedOptionIndex = null, this.optionsListEl = null, this.svgContainer = null, this.buttonEl = null, this.isLoading = !1, this.container = null, this.clickOutsideListener = null, this.resizeListener = null, t.options && (this._options = [...t.options]), t.getOptions && this._options.push(...t.getOptions()), t.getOptionsAsync && (this.isLoading = !0), this.value !== void 0) {
1242
1275
  const e = this._options.findIndex((i) => i.value === this.value);
@@ -1257,12 +1290,12 @@ class M extends g {
1257
1290
  if (t.classList.add("select-container"), this.container = t, this.props.icon || this.props.title) {
1258
1291
  const n = document.createElement("div");
1259
1292
  if (n.className = "icon-container", this.props.icon) {
1260
- const o = this.createIcon(this.props.icon);
1261
- n.appendChild(o);
1293
+ const a = this.createIcon(this.props.icon);
1294
+ n.appendChild(a);
1262
1295
  }
1263
1296
  if (this.props.title) {
1264
- const o = this.createLabel(this.props.title);
1265
- n.appendChild(o);
1297
+ const a = this.createLabel(this.props.title);
1298
+ n.appendChild(a);
1266
1299
  }
1267
1300
  t.appendChild(n);
1268
1301
  } else {
@@ -1271,22 +1304,22 @@ class M extends g {
1271
1304
  }
1272
1305
  const e = document.createElement("div");
1273
1306
  e.classList.add("select-button"), this.isLoading ? e.classList.add("loading") : e.textContent = this.selectedOptionIndex !== null ? this._options[this.selectedOptionIndex].name : this.props.placeholder || "Select an option", e.onclick = () => {
1274
- var n, o;
1275
- this.isLoading || (this.isOpen = !this.isOpen, this.isOpen ? this.checkDropdownPosition() : this.cleanupDropdownPosition(), (n = this.optionsListEl) == null || n.classList.toggle("open", this.isOpen), (o = this.svgContainer) == null || o.classList.toggle("open", this.isOpen));
1307
+ var n, a;
1308
+ this.isLoading || (this.isOpen = !this.isOpen, this.isOpen ? this.checkDropdownPosition() : this.cleanupDropdownPosition(), (n = this.optionsListEl) == null || n.classList.toggle("open", this.isOpen), (a = this.svgContainer) == null || a.classList.toggle("open", this.isOpen));
1276
1309
  }, t.appendChild(e), this.buttonEl = e;
1277
1310
  const i = document.createElement("ul");
1278
- i.classList.add("select-options"), this._options.forEach((n, o) => {
1279
- const a = this.createOption(n, o);
1280
- a.onclick = (l) => this.selectOption(l, o, e), i.appendChild(a);
1311
+ i.classList.add("select-options"), this._options.forEach((n, a) => {
1312
+ const o = this.createOption(n, a);
1313
+ o.onclick = (l) => this.selectOption(l, a, e), i.appendChild(o);
1281
1314
  }), document.body.appendChild(i);
1282
1315
  const s = document.createElement("div");
1283
- return s.classList.add("svg-container"), s.innerHTML = G, t.appendChild(s), this.optionsListEl = i, this.svgContainer = s, this.props.getOptionsAsync && (this.isLoading = !0, this.updateButtonText(), this.props.getOptionsAsync().then((n) => {
1316
+ return s.classList.add("svg-container"), s.innerHTML = D, t.appendChild(s), this.optionsListEl = i, this.svgContainer = s, this.props.getOptionsAsync && (this.isLoading = !0, this.updateButtonText(), this.props.getOptionsAsync().then((n) => {
1284
1317
  this._options.push(...n), this.isLoading = !1, this.updateOptionsList(), this.updateButtonText();
1285
1318
  }).catch((n) => {
1286
1319
  console.error("Failed to fetch async options:", n), this.isLoading = !1, this.updateButtonText("Failed to load options");
1287
1320
  })), this.clickOutsideListener && document.removeEventListener("click", this.clickOutsideListener), this.clickOutsideListener = (n) => {
1288
- var o, a;
1289
- this.isOpen && !t.contains(n.target) && (this.isOpen = !1, (o = this.optionsListEl) == null || o.classList.remove("open"), (a = this.svgContainer) == null || a.classList.remove("open"), this.cleanupDropdownPosition());
1321
+ var a, o;
1322
+ this.isOpen && !t.contains(n.target) && (this.isOpen = !1, (a = this.optionsListEl) == null || a.classList.remove("open"), (o = this.svgContainer) == null || o.classList.remove("open"), this.cleanupDropdownPosition());
1290
1323
  }, document.addEventListener("click", this.clickOutsideListener), this.resizeListener && window.removeEventListener("resize", this.resizeListener), this.resizeListener = () => {
1291
1324
  this.isOpen && this.checkDropdownPosition();
1292
1325
  }, window.addEventListener("resize", this.resizeListener), t;
@@ -1308,10 +1341,10 @@ class M extends g {
1308
1341
  }
1309
1342
  }
1310
1343
  selectOption(t, e, i) {
1311
- var n, o, a;
1344
+ var n, a, o;
1312
1345
  const s = this._options[e];
1313
- s && (this.value = s.value, (n = this.onChange) == null || n.call(this, this.value), this.selectedOptionIndex = e, this.isOpen = !1, i.textContent = s.name, (o = this.optionsListEl) == null || o.classList.remove("open"), (a = this.svgContainer) == null || a.classList.remove("open"), this.cleanupDropdownPosition(), this.optionsListEl && this.optionsListEl.querySelectorAll(".select-option").forEach((c, r) => {
1314
- r === e ? c.classList.add("selected") : c.classList.remove("selected");
1346
+ s && (this.value = s.value, (n = this.onChange) == null || n.call(this, this.value), this.selectedOptionIndex = e, this.isOpen = !1, i.textContent = s.name, (a = this.optionsListEl) == null || a.classList.remove("open"), (o = this.svgContainer) == null || o.classList.remove("open"), this.cleanupDropdownPosition(), this.optionsListEl && this.optionsListEl.querySelectorAll(".select-option").forEach((r, d) => {
1347
+ d === e ? r.classList.add("selected") : r.classList.remove("selected");
1315
1348
  }));
1316
1349
  }
1317
1350
  /**
@@ -1394,15 +1427,15 @@ class W extends g {
1394
1427
  `
1395
1428
  }
1396
1429
  ].forEach((n) => {
1397
- const o = document.createElement("button");
1398
- o.className = "align-option-button", o.innerHTML = n.icon, this.value === n.name && o.classList.add("selected"), o.addEventListener("click", () => {
1399
- var a;
1400
- i.querySelectorAll(".align-option-button").forEach((l) => l.classList.remove("selected")), o.classList.add("selected"), this.value = n.name, (a = this.onChange) == null || a.call(this, this.value);
1401
- }), i.appendChild(o);
1430
+ const a = document.createElement("button");
1431
+ a.className = "align-option-button", a.innerHTML = n.icon, this.value === n.name && a.classList.add("selected"), a.addEventListener("click", () => {
1432
+ var o;
1433
+ i.querySelectorAll(".align-option-button").forEach((l) => l.classList.remove("selected")), a.classList.add("selected"), this.value = n.name, (o = this.onChange) == null || o.call(this, this.value);
1434
+ }), i.appendChild(a);
1402
1435
  }), t.appendChild(i), t;
1403
1436
  }
1404
1437
  }
1405
- class ft extends g {
1438
+ class vt extends g {
1406
1439
  constructor(t) {
1407
1440
  super(t), this.inputType = "button", this.bgWithAlpha = "rgba(145, 158, 171, 0.08)";
1408
1441
  }
@@ -1416,42 +1449,42 @@ class ft extends g {
1416
1449
  /^rgba\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)$/i
1417
1450
  );
1418
1451
  if (n) {
1419
- let a = +n[1], l = +n[2], c = +n[3], r = +n[4];
1420
- r >= 1 ? (a = Math.round(a * 0.9), l = Math.round(l * 0.9), c = Math.round(c * 0.9)) : r = Math.min(1, r + 0.12), s = `rgba(${a},${l},${c},${r})`;
1452
+ let o = +n[1], l = +n[2], r = +n[3], d = +n[4];
1453
+ d >= 1 ? (o = Math.round(o * 0.9), l = Math.round(l * 0.9), r = Math.round(r * 0.9)) : d = Math.min(1, d + 0.12), s = `rgba(${o},${l},${r},${d})`;
1421
1454
  }
1422
1455
  t.addEventListener("mouseenter", () => {
1423
1456
  console.log("hoverBg", s), t.style.setProperty("background-color", s, "important");
1424
1457
  }), t.addEventListener("mouseleave", () => {
1425
1458
  t.style.setProperty("background-color", e, "important");
1426
1459
  }), t.addEventListener("click", () => {
1427
- var a, l;
1428
- return (l = (a = this.props).onClick) == null ? void 0 : l.call(a);
1460
+ var o, l;
1461
+ return (l = (o = this.props).onClick) == null ? void 0 : l.call(o);
1429
1462
  });
1430
- const o = document.createElement("div");
1431
- return o.className = "button-setting-wrapper " + (this.props.wrapperClassName || ""), o.appendChild(t), o;
1463
+ const a = document.createElement("div");
1464
+ return a.className = "button-setting-wrapper " + (this.props.wrapperClassName || ""), a.appendChild(t), a;
1432
1465
  }
1433
1466
  }
1434
- class vt extends g {
1467
+ class Ct extends g {
1435
1468
  constructor(t = {}) {
1436
1469
  super(t), this.inputType = { width: "number", height: "number" }, this.aspectRatio = 1, this.isUpdating = !1;
1437
1470
  const e = t.width || 0, i = t.height || 0;
1438
1471
  this.value || (this.value = {
1439
1472
  width: e,
1440
1473
  height: i
1441
- }), this.minWidth = t.minWidth ?? 0, this.maxWidth = t.maxWidth, this.minHeight = t.minHeight ?? 0, this.maxHeight = t.maxHeight, this.locked = t.locked ?? !1, this.value.height > 0 && (this.aspectRatio = this.value.width / this.value.height), this.widthSetting = new v({
1474
+ }), this.minWidth = t.minWidth ?? 0, this.maxWidth = t.maxWidth, this.minHeight = t.minHeight ?? 0, this.maxHeight = t.maxHeight, this.locked = t.locked ?? !1, this.value.height > 0 && (this.aspectRatio = this.value.width / this.value.height), this.widthSetting = new C({
1442
1475
  title: "Width",
1443
1476
  default: this.value.width,
1444
1477
  suffix: "px",
1445
1478
  minValue: this.minWidth,
1446
1479
  maxValue: this.maxWidth,
1447
- icon: D
1448
- }), this.heightSetting = new v({
1480
+ icon: J
1481
+ }), this.heightSetting = new C({
1449
1482
  title: "Height",
1450
1483
  default: this.value.height,
1451
1484
  suffix: "px",
1452
1485
  minValue: this.minHeight,
1453
1486
  maxValue: this.maxHeight,
1454
- icon: J
1487
+ icon: U
1455
1488
  }), this.widthSetting.setOnChange(this.handleWidthChange.bind(this)), this.heightSetting.setOnChange(this.handleHeightChange.bind(this));
1456
1489
  }
1457
1490
  handleWidthChange(t) {
@@ -1521,8 +1554,8 @@ class vt extends g {
1521
1554
  return n.className = "dimension-lock-icon", n.setAttribute("type", "button"), n.setAttribute("aria-pressed", String(this.locked)), n.setAttribute(
1522
1555
  "aria-label",
1523
1556
  this.locked ? "Unlock aspect ratio" : "Lock aspect ratio"
1524
- ), n.title = this.locked ? "Unlock aspect ratio" : "Lock aspect ratio", n.innerHTML = this.getLockSVG(this.locked), n.onclick = (o) => {
1525
- o.preventDefault(), this.toggleLock(n);
1557
+ ), n.title = this.locked ? "Unlock aspect ratio" : "Lock aspect ratio", n.innerHTML = this.getLockSVG(this.locked), n.onclick = (a) => {
1558
+ a.preventDefault(), this.toggleLock(n);
1526
1559
  }, s.appendChild(n), t.appendChild(e), t.appendChild(s), t.appendChild(i), t;
1527
1560
  }
1528
1561
  isLocked() {
@@ -1545,15 +1578,15 @@ class vt extends g {
1545
1578
  }
1546
1579
  }
1547
1580
  }
1548
- const D = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1581
+ const J = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1549
1582
  <path d="M4.5 9.5H13.5M4.5 9.5L6 7.25M4.5 9.5L6 11.75M13.5 9.5L12 7.25M13.5 9.5L12 11.75M15.75 16.25V2.75M2.25 16.25V2.75" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
1550
- </svg>`, J = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1583
+ </svg>`, U = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1551
1584
  <path d="M9 14L9 5M9 14L6.75 12.5M9 14L11.25 12.5M9 5L6.75 6.5M9 5L11.25 6.5M15.75 2.75H2.25M15.75 16.25H2.25" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
1552
- </svg>`, y = `
1585
+ </svg>`, V = `
1553
1586
  <svg xmlns="http://www.w3.org/2000/svg" width="15" height="16" viewBox="0 0 15 16" fill="none">
1554
1587
  <path d="M5 10.5L7.5 8M7.5 8L10 10.5M7.5 8V13.625M12.5 10.9643C13.2634 10.3338 13.75 9.37996 13.75 8.3125C13.75 6.41402 12.211 4.875 10.3125 4.875C10.1759 4.875 10.0482 4.80375 9.97882 4.68609C9.16379 3.30302 7.65902 2.375 5.9375 2.375C3.34867 2.375 1.25 4.47367 1.25 7.0625C1.25 8.35381 1.77215 9.52317 2.61684 10.371" stroke="#475467" stroke-linecap="round" stroke-linejoin="round"/>
1555
1588
  </svg>
1556
- `, U = `
1589
+ `, q = `
1557
1590
  <svg width="91" height="71" viewBox="0 0 91 71" fill="none" xmlns="http://www.w3.org/2000/svg">
1558
1591
  <rect width="91" height="71" rx="4" fill="#F2F4F7"/>
1559
1592
  <path d="M37 31.5L39.5 29M39.5 29L42 31.5M39.5 29V34.625M44.5 31.9643C45.2634 31.3338 45.75 30.38 45.75 29.3125C45.75 27.414 44.211 25.875 42.3125 25.875C42.1759 25.875 42.0482 25.8037 41.9788 25.6861C41.1638 24.303 39.659 23.375 37.9375 23.375C35.3487 23.375 33.25 25.4737 33.25 28.0625C33.25 29.3538 33.7721 30.5232 34.6168 31.371" stroke="#475467" stroke-linecap="round" stroke-linejoin="round"/>
@@ -1562,7 +1595,7 @@ const D = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBo
1562
1595
  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 12 12" fill="none">
1563
1596
  <path d="M8 3V2.6C8 2.03995 8 1.75992 7.89101 1.54601C7.79513 1.35785 7.64215 1.20487 7.45399 1.10899C7.24008 1 6.96005 1 6.4 1H5.6C5.03995 1 4.75992 1 4.54601 1.10899C4.35785 1.20487 4.20487 1.35785 4.10899 1.54601C4 1.75992 4 2.03995 4 2.6V3M5 5.75V8.25M7 5.75V8.25M1.5 3H10.5M9.5 3V8.6C9.5 9.44008 9.5 9.86012 9.33651 10.181C9.1927 10.4632 8.96323 10.6927 8.68099 10.8365C8.36012 11 7.94008 11 7.1 11H4.9C4.05992 11 3.63988 11 3.31901 10.8365C3.03677 10.6927 2.8073 10.4632 2.66349 10.181C2.5 9.86012 2.5 9.44008 2.5 8.6V3" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
1564
1597
  </svg>
1565
- `, q = `
1598
+ `, Z = `
1566
1599
  <svg xmlns="http://www.w3.org/2000/svg" width="29" height="29" viewBox="0 0 29 29" fill="none">
1567
1600
  <!-- Top dot -->
1568
1601
  <circle cx="14.5" cy="3" r="1.5" fill="#02CC59" opacity="1"/>
@@ -1582,7 +1615,7 @@ const D = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBo
1582
1615
  <circle cx="6.7" cy="6.7" r="1.5" fill="#02CC59" opacity="0.3"/>
1583
1616
  </svg>
1584
1617
  `;
1585
- class Z extends g {
1618
+ class K extends g {
1586
1619
  constructor(t = {}) {
1587
1620
  super(t), this.inputType = "button", this.previewWrapper = null, this.previewEl = null, this.emptyStateEl = null, this.errorContainer = null, this.messageListener = null, this.loadingSpinner = null, this.props.delete === void 0 && (this.props.delete = !0), this.props.maxFileSizeMB === void 0 && (this.props.maxFileSizeMB = 5), !this.value && t.defaultUrl && t.defaultUrl !== "" && (this.value = t.defaultUrl), this.setupMessageListener();
1588
1621
  }
@@ -1632,18 +1665,18 @@ class Z extends g {
1632
1665
  );
1633
1666
  if (t && t !== "") {
1634
1667
  this.showLoading(), s && s instanceof HTMLElement && (s.style.display = "none"), e && e.classList.remove("no-image"), i && (i.innerHTML = `
1635
- <span class="upload-icon">${y}</span>
1668
+ <span class="upload-icon">${V}</span>
1636
1669
  <span class="upload-label">Replace</span>
1637
1670
  `);
1638
1671
  const n = () => {
1639
- this.hideLoading(), this.previewWrapper.classList.add("has-image"), this.previewEl.style.display = "block", this.previewEl.removeEventListener("load", n), this.previewEl.removeEventListener("error", o);
1640
- }, o = () => {
1641
- this.hideLoading(), this.showError("Failed to load image. Please try again."), this.previewWrapper.classList.remove("has-image"), this.previewEl.style.display = "none", this.previewWrapper.style.display = "none", s && s instanceof HTMLElement && (s.style.display = "block"), e && e.classList.add("no-image"), this.previewEl.removeEventListener("load", n), this.previewEl.removeEventListener("error", o);
1672
+ this.hideLoading(), this.previewWrapper.classList.add("has-image"), this.previewEl.style.display = "block", this.previewEl.removeEventListener("load", n), this.previewEl.removeEventListener("error", a);
1673
+ }, a = () => {
1674
+ this.hideLoading(), this.showError("Failed to load image. Please try again."), this.previewWrapper.classList.remove("has-image"), this.previewEl.style.display = "none", this.previewWrapper.style.display = "none", s && s instanceof HTMLElement && (s.style.display = "block"), e && e.classList.add("no-image"), this.previewEl.removeEventListener("load", n), this.previewEl.removeEventListener("error", a);
1642
1675
  };
1643
- this.previewEl.addEventListener("load", n), this.previewEl.addEventListener("error", o), this.previewEl.src = t;
1676
+ this.previewEl.addEventListener("load", n), this.previewEl.addEventListener("error", a), this.previewEl.src = t;
1644
1677
  } else
1645
1678
  this.hideLoading(), this.previewWrapper.classList.remove("has-image"), this.previewEl.src = "", this.previewEl.style.display = "none", this.previewWrapper.style.display = "none", s && s instanceof HTMLElement && (s.style.display = "block"), e && e.classList.add("no-image"), i && (i.innerHTML = `
1646
- <span class="upload-icon">${y}</span>
1679
+ <span class="upload-icon">${V}</span>
1647
1680
  <span class="upload-label">Upload</span>
1648
1681
  `);
1649
1682
  }
@@ -1651,24 +1684,24 @@ class Z extends g {
1651
1684
  const t = document.createElement("div");
1652
1685
  t.className = "upload-setting-wrapper", t.setAttribute("data-setting-id", this.id), t.addEventListener(
1653
1686
  "focusout",
1654
- (a) => {
1687
+ (o) => {
1655
1688
  var l;
1656
- a.relatedTarget && t.contains(a.relatedTarget) || (l = this.onBlur) == null || l.call(this, this.value ?? "");
1689
+ o.relatedTarget && t.contains(o.relatedTarget) || (l = this.onBlur) == null || l.call(this, this.value ?? "");
1657
1690
  },
1658
1691
  !0
1659
1692
  );
1660
1693
  const e = !!(this.props.title || this.props.icon);
1661
1694
  if (e || t.classList.add("no-label"), e) {
1662
- const a = document.createElement("div");
1663
- if (a.className = "icon-title-container", this.props.icon) {
1695
+ const o = document.createElement("div");
1696
+ if (o.className = "icon-title-container", this.props.icon) {
1664
1697
  const l = this.createIcon(this.props.icon);
1665
- a.appendChild(l);
1698
+ o.appendChild(l);
1666
1699
  }
1667
1700
  if (this.props.title) {
1668
1701
  const l = this.createLabel(this.props.title);
1669
- a.appendChild(l);
1702
+ o.appendChild(l);
1670
1703
  }
1671
- t.appendChild(a);
1704
+ t.appendChild(o);
1672
1705
  }
1673
1706
  this.errorContainer = document.createElement("div"), this.errorContainer.className = "error-message", this.errorContainer.style.display = "none", t.appendChild(this.errorContainer);
1674
1707
  const i = document.createElement("div");
@@ -1676,19 +1709,19 @@ class Z extends g {
1676
1709
  const s = this.value && this.value !== "";
1677
1710
  s || i.classList.add("no-image");
1678
1711
  const n = document.createElement("div");
1679
- if (n.className = "preview-placeholder", n.innerHTML = U, this.previewWrapper = document.createElement("div"), this.previewWrapper.className = "preview-wrapper", this.loadingSpinner = document.createElement("div"), this.loadingSpinner.className = "loading-spinner", this.loadingSpinner.innerHTML = q, this.loadingSpinner.style.display = "none", this.previewWrapper.appendChild(this.loadingSpinner), this.previewEl = document.createElement("img"), this.previewEl.className = "upload-preview", this.props.delete) {
1680
- const a = document.createElement("button");
1681
- a.className = "delete-button", a.type = "button", a.title = "Delete image", a.innerHTML = _, this.previewWrapper.appendChild(a), a.onclick = (l) => {
1682
- var c;
1683
- l.stopPropagation(), this.value = "", this.updatePreviewState(null), (c = this.onChange) == null || c.call(this, ""), this.hideError();
1712
+ if (n.className = "preview-placeholder", n.innerHTML = q, this.previewWrapper = document.createElement("div"), this.previewWrapper.className = "preview-wrapper", this.loadingSpinner = document.createElement("div"), this.loadingSpinner.className = "loading-spinner", this.loadingSpinner.innerHTML = Z, this.loadingSpinner.style.display = "none", this.previewWrapper.appendChild(this.loadingSpinner), this.previewEl = document.createElement("img"), this.previewEl.className = "upload-preview", this.props.delete) {
1713
+ const o = document.createElement("button");
1714
+ o.className = "delete-button", o.type = "button", o.title = "Delete image", o.innerHTML = _, this.previewWrapper.appendChild(o), o.onclick = (l) => {
1715
+ var r;
1716
+ l.stopPropagation(), this.value = "", this.updatePreviewState(null), (r = this.onChange) == null || r.call(this, ""), this.hideError();
1684
1717
  };
1685
1718
  }
1686
1719
  this.previewWrapper.appendChild(this.previewEl);
1687
- const o = document.createElement("button");
1688
- return o.className = "upload-button", o.innerHTML = `
1689
- <span class="upload-icon">${y}</span>
1720
+ const a = document.createElement("button");
1721
+ return a.className = "upload-button", a.innerHTML = `
1722
+ <span class="upload-icon">${V}</span>
1690
1723
  <span class="upload-label">Upload</span>
1691
- `, i.appendChild(n), i.appendChild(this.previewWrapper), i.appendChild(o), t.appendChild(i), s ? this.updatePreviewState(this.value) : this.updatePreviewState(null), o.onclick = () => {
1724
+ `, i.appendChild(n), i.appendChild(this.previewWrapper), i.appendChild(a), t.appendChild(i), s ? this.updatePreviewState(this.value) : this.updatePreviewState(null), a.onclick = () => {
1692
1725
  window.postMessage(
1693
1726
  {
1694
1727
  type: "OPEN_FILE_MANAGER_MODAL",
@@ -1699,14 +1732,14 @@ class Z extends g {
1699
1732
  }, t;
1700
1733
  }
1701
1734
  }
1702
- class Ct extends v {
1735
+ class wt extends C {
1703
1736
  constructor(t = {}) {
1704
1737
  super({
1705
1738
  ...t,
1706
1739
  title: t.title || "Height",
1707
1740
  suffix: t.suffix || "px",
1708
1741
  minValue: t.minValue ?? 0,
1709
- icon: t.icon || K,
1742
+ icon: t.icon || X,
1710
1743
  default: t.default ?? 100
1711
1744
  }), this.inputType = "number", this.mobileValue = t.mobile;
1712
1745
  }
@@ -1717,17 +1750,17 @@ class Ct extends v {
1717
1750
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1718
1751
  }
1719
1752
  }
1720
- const K = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1753
+ const X = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1721
1754
  <path d="M9 14L9 5M9 14L6.75 12.5M9 14L11.25 12.5M9 5L6.75 6.5M9 5L11.25 6.5M15.75 2.75H2.25M15.75 16.25H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
1722
1755
  </svg>`;
1723
- class wt extends v {
1756
+ class Et extends C {
1724
1757
  constructor(t = {}) {
1725
1758
  super({
1726
1759
  ...t,
1727
1760
  title: t.title || "Width",
1728
1761
  suffix: t.suffix || "px",
1729
1762
  minValue: t.minValue ?? 0,
1730
- icon: t.icon || X,
1763
+ icon: t.icon || Q,
1731
1764
  default: t.default ?? 100
1732
1765
  }), this.inputType = "number", this.mobileValue = t.mobile;
1733
1766
  }
@@ -1738,14 +1771,14 @@ class wt extends v {
1738
1771
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1739
1772
  }
1740
1773
  }
1741
- const X = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1774
+ const Q = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1742
1775
  <path d="M4.5 9.5H13.5M4.5 9.5L6 7.25M4.5 9.5L6 11.75M13.5 9.5L12 7.25M13.5 9.5L12 11.75M15.75 16.25V2.75M2.25 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
1743
- </svg>`, Q = `
1776
+ </svg>`, Y = `
1744
1777
  <svg xmlns="http://www.w3.org/2000/svg" class="svg-select-api" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down">
1745
1778
  <polyline points="6 9 12 15 18 9"></polyline>
1746
1779
  </svg>
1747
1780
  `;
1748
- class Et extends g {
1781
+ class bt extends g {
1749
1782
  constructor(t = {}) {
1750
1783
  if (super(t), this.inputType = "select", this._options = [], this.isOpen = !1, this.selectedOptionIndex = null, this.optionsListEl = null, this.svgContainer = null, this.buttonEl = null, this.isLoading = !1, this.container = null, this.hasInitializedOptions = !1, this.selectedOptionIndex = null, t.default !== void 0 && (this.value = t.default), this.initializeOptions(t), !t.getOptionsAsync && this.value !== void 0) {
1751
1784
  const e = this._options.findIndex(
@@ -1772,46 +1805,46 @@ class Et extends g {
1772
1805
  e.classList.add("has-label");
1773
1806
  const n = document.createElement("div");
1774
1807
  n.className = "select-label", n.textContent = this.props.title, e.appendChild(n);
1775
- const o = document.createElement("span");
1776
- if (o.className = "select-value", this.isLoading)
1777
- o.textContent = this.props.loadingText || "Loading options...";
1808
+ const a = document.createElement("span");
1809
+ if (a.className = "select-value", this.isLoading)
1810
+ a.textContent = this.props.loadingText || "Loading options...";
1778
1811
  else {
1779
- const a = this.selectedOptionIndex !== null && this._options && this.selectedOptionIndex >= 0 && this.selectedOptionIndex < this._options.length ? this._options[this.selectedOptionIndex] : null, l = a && typeof a.name == "string" ? a.name : "Select an option";
1780
- o.textContent = l;
1812
+ const o = this.selectedOptionIndex !== null && this._options && this.selectedOptionIndex >= 0 && this.selectedOptionIndex < this._options.length ? this._options[this.selectedOptionIndex] : null, l = o && typeof o.name == "string" ? o.name : "Select an option";
1813
+ a.textContent = l;
1781
1814
  }
1782
- e.appendChild(o);
1815
+ e.appendChild(a);
1783
1816
  } else {
1784
1817
  const n = document.createElement("span");
1785
1818
  if (this.isLoading)
1786
1819
  n.textContent = this.props.loadingText || "Loading options...";
1787
1820
  else {
1788
- const o = this.selectedOptionIndex !== null && this._options && this.selectedOptionIndex >= 0 && this.selectedOptionIndex < this._options.length ? this._options[this.selectedOptionIndex] : null, a = o && typeof o.name == "string" ? o.name : "Select an option";
1789
- n.textContent = a;
1821
+ const a = this.selectedOptionIndex !== null && this._options && this.selectedOptionIndex >= 0 && this.selectedOptionIndex < this._options.length ? this._options[this.selectedOptionIndex] : null, o = a && typeof a.name == "string" ? a.name : "Select an option";
1822
+ n.textContent = o;
1790
1823
  }
1791
1824
  e.appendChild(n);
1792
1825
  }
1793
1826
  e.onclick = () => {
1794
- var n, o;
1795
- this.isLoading || (this.isOpen = !this.isOpen, (n = this.optionsListEl) == null || n.classList.toggle("open", this.isOpen), (o = this.svgContainer) == null || o.classList.toggle("open", this.isOpen));
1827
+ var n, a;
1828
+ this.isLoading || (this.isOpen = !this.isOpen, (n = this.optionsListEl) == null || n.classList.toggle("open", this.isOpen), (a = this.svgContainer) == null || a.classList.toggle("open", this.isOpen));
1796
1829
  }, t.appendChild(e), this.buttonEl = e;
1797
1830
  const i = document.createElement("ul");
1798
- i.classList.add("select-api-options"), this._options.forEach((n, o) => {
1799
- const a = this.createOption(n, o);
1800
- a.onclick = (l) => this.selectApiOption(l, o, e), i.appendChild(a);
1831
+ i.classList.add("select-api-options"), this._options.forEach((n, a) => {
1832
+ const o = this.createOption(n, a);
1833
+ o.onclick = (l) => this.selectApiOption(l, a, e), i.appendChild(o);
1801
1834
  }), t.appendChild(i);
1802
1835
  const s = document.createElement("div");
1803
- return s.classList.add("svg-container"), s.innerHTML = Q, t.appendChild(s), s.onclick = () => {
1804
- var n, o;
1805
- this.isLoading || (this.isOpen = !this.isOpen, (n = this.optionsListEl) == null || n.classList.toggle("open", this.isOpen), (o = this.svgContainer) == null || o.classList.toggle("open", this.isOpen));
1836
+ return s.classList.add("svg-container"), s.innerHTML = Y, t.appendChild(s), s.onclick = () => {
1837
+ var n, a;
1838
+ this.isLoading || (this.isOpen = !this.isOpen, (n = this.optionsListEl) == null || n.classList.toggle("open", this.isOpen), (a = this.svgContainer) == null || a.classList.toggle("open", this.isOpen));
1806
1839
  }, this.optionsListEl = i, this.svgContainer = s, this.props.getOptionsAsync && !this.hasInitializedOptions ? (this.isLoading = !0, this.updateButtonText(), this.props.getOptionsAsync().then((n) => {
1807
- const o = new Set(
1840
+ const a = new Set(
1808
1841
  this._options.map((l) => JSON.stringify(l.value))
1809
- ), a = n.filter(
1810
- (l) => !o.has(JSON.stringify(l.value))
1842
+ ), o = n.filter(
1843
+ (l) => !a.has(JSON.stringify(l.value))
1811
1844
  );
1812
- if (this._options.push(...a), this.isLoading = !1, this.hasInitializedOptions = !0, this.value !== void 0) {
1845
+ if (this._options.push(...o), this.isLoading = !1, this.hasInitializedOptions = !0, this.value !== void 0) {
1813
1846
  const l = this._options.findIndex(
1814
- (c) => JSON.stringify(c.value) === JSON.stringify(this.value)
1847
+ (r) => JSON.stringify(r.value) === JSON.stringify(this.value)
1815
1848
  );
1816
1849
  this.selectedOptionIndex = l !== -1 ? l : null;
1817
1850
  } else
@@ -1823,14 +1856,14 @@ class Et extends g {
1823
1856
  !0
1824
1857
  );
1825
1858
  })) : this.props.getOptionsAsync && this._options.length <= 1 && (this.isLoading = !0, this.updateButtonText(), this.props.getOptionsAsync().then((n) => {
1826
- const o = new Set(
1859
+ const a = new Set(
1827
1860
  this._options.map((l) => JSON.stringify(l.value))
1828
- ), a = n.filter(
1829
- (l) => !o.has(JSON.stringify(l.value))
1861
+ ), o = n.filter(
1862
+ (l) => !a.has(JSON.stringify(l.value))
1830
1863
  );
1831
- if (this._options.push(...a), this.isLoading = !1, this.value !== void 0) {
1864
+ if (this._options.push(...o), this.isLoading = !1, this.value !== void 0) {
1832
1865
  const l = this._options.findIndex(
1833
- (c) => JSON.stringify(c.value) === JSON.stringify(this.value)
1866
+ (r) => JSON.stringify(r.value) === JSON.stringify(this.value)
1834
1867
  );
1835
1868
  this.selectedOptionIndex = l !== -1 ? l : null;
1836
1869
  } else
@@ -1847,19 +1880,19 @@ class Et extends g {
1847
1880
  return JSON.stringify(t ? {} : { value: this.value }, null, 2);
1848
1881
  }
1849
1882
  selectApiOption(t, e, i) {
1850
- var l, c, r, d;
1883
+ var l, r, d, c;
1851
1884
  const s = t.target, n = s.querySelector(".select-api-radio") || ((l = s.closest(".select-api-option")) == null ? void 0 : l.querySelector(".select-api-radio"));
1852
1885
  n && (n.checked = !0), this.selectedOptionIndex = e;
1853
- const o = this._options[e].value;
1854
- this.value = o;
1855
- const a = i.querySelector(".select-value");
1856
- if (a)
1857
- a.textContent = this._options[e].name;
1886
+ const a = this._options[e].value;
1887
+ this.value = a;
1888
+ const o = i.querySelector(".select-value");
1889
+ if (o)
1890
+ o.textContent = this._options[e].name;
1858
1891
  else {
1859
1892
  const u = i.firstChild;
1860
1893
  u && u.tagName === "SPAN" && (u.textContent = this._options[e].name);
1861
1894
  }
1862
- this.isOpen = !1, (c = this.optionsListEl) == null || c.classList.remove("open"), (r = this.svgContainer) == null || r.classList.remove("open"), (d = this.onChange) == null || d.call(this, o), this.detectChangeCallback && this.detectChangeCallback(o);
1895
+ this.isOpen = !1, (r = this.optionsListEl) == null || r.classList.remove("open"), (d = this.svgContainer) == null || d.classList.remove("open"), (c = this.onChange) == null || c.call(this, a), this.detectChangeCallback && this.detectChangeCallback(a);
1863
1896
  }
1864
1897
  updateOptionsList() {
1865
1898
  !this.optionsListEl || !this.buttonEl || (this.optionsListEl.innerHTML = "", this._options.forEach((t, e) => {
@@ -1892,13 +1925,13 @@ class Et extends g {
1892
1925
  ), this.updateButtonText();
1893
1926
  }
1894
1927
  }
1895
- class bt extends g {
1928
+ class xt extends g {
1896
1929
  constructor(t) {
1897
1930
  var e, i;
1898
1931
  super(t), this.inputType = "text", this.value = t.default ?? ((i = (e = t.options) == null ? void 0 : e[0]) == null ? void 0 : i.value) ?? "", this.detectChangeCallback = t.detectChange;
1899
1932
  }
1900
1933
  draw() {
1901
- var o, a;
1934
+ var a, o;
1902
1935
  const t = document.createElement("div");
1903
1936
  t.className = "toggle-setting-container", this.props.icon && t.classList.add("toggle-with-icon");
1904
1937
  const e = document.createElement("div");
@@ -1914,20 +1947,20 @@ class bt extends g {
1914
1947
  const i = document.createElement("label");
1915
1948
  i.className = "toggle-switch";
1916
1949
  const s = document.createElement("input");
1917
- s.type = "checkbox", s.checked = ((a = (o = this.props.options) == null ? void 0 : o.find((l) => l.value === this.value)) == null ? void 0 : a.status) ?? !1, s.addEventListener("change", () => {
1918
- var c, r;
1919
- const l = ((r = (c = this.props.options) == null ? void 0 : c.find((d) => d.status === s.checked)) == null ? void 0 : r.value) ?? "";
1950
+ s.type = "checkbox", s.checked = ((o = (a = this.props.options) == null ? void 0 : a.find((l) => l.value === this.value)) == null ? void 0 : o.status) ?? !1, s.addEventListener("change", () => {
1951
+ var r, d;
1952
+ const l = ((d = (r = this.props.options) == null ? void 0 : r.find((c) => c.status === s.checked)) == null ? void 0 : d.value) ?? "";
1920
1953
  this.value = l, this.onChange && this.onChange(this.value), this.detectChangeCallback && this.detectChangeCallback(this.value);
1921
1954
  });
1922
1955
  const n = document.createElement("span");
1923
1956
  if (n.className = "toggle-slider", this.props.activeColor || this.props.inactiveColor) {
1924
- const l = document.createElement("style"), c = this.props.activeColor || "#4CAF50", r = this.props.inactiveColor || "#ccc";
1957
+ const l = document.createElement("style"), r = this.props.activeColor || "#4CAF50", d = this.props.inactiveColor || "#ccc";
1925
1958
  l.textContent = `
1926
1959
  .toggle-switch input:checked + .toggle-slider {
1927
- background-color: ${c};
1960
+ background-color: ${r};
1928
1961
  }
1929
1962
  .toggle-switch .toggle-slider {
1930
- background-color: ${r};
1963
+ background-color: ${d};
1931
1964
  }
1932
1965
  `, document.head.appendChild(l);
1933
1966
  }
@@ -1937,13 +1970,13 @@ class bt extends g {
1937
1970
  this.detectChangeCallback = t;
1938
1971
  }
1939
1972
  }
1940
- const Y = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
1973
+ const tt = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
1941
1974
  <path d="M13.3334 5.99996H2.66675M13.3334 9.99996H2.66675M5.33341 12.6666V3.33329M10.6667 12.6666V3.33329" stroke="#667085" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
1942
1975
  </svg>`;
1943
- class xt extends g {
1976
+ class yt extends g {
1944
1977
  // Store mobile value
1945
1978
  constructor(t = {}) {
1946
- t.rowGap = t.rowGap ?? !0, t.columnGap = t.columnGap ?? !0, t.title = t.title ?? "Gap", t.icon = t.icon ?? Y, t.suffix = t.suffix ?? "px", t.minValue = t.minValue ?? 0, super(t), this.inputType = "number", this.inputValues = {}, this.mobileValue = t.mobile, this.value = this.validateValue(t.default ?? 0), t.rowGap && (this.inputValues.row = this.value), t.columnGap && (this.inputValues.column = this.value);
1979
+ t.rowGap = t.rowGap ?? !0, t.columnGap = t.columnGap ?? !0, t.title = t.title ?? "Gap", t.icon = t.icon ?? tt, t.suffix = t.suffix ?? "px", t.minValue = t.minValue ?? 0, super(t), this.inputType = "number", this.inputValues = {}, this.mobileValue = t.mobile, this.value = this.validateValue(t.default ?? 0), t.rowGap && (this.inputValues.row = this.value), t.columnGap && (this.inputValues.column = this.value);
1947
1980
  }
1948
1981
  draw() {
1949
1982
  const t = document.createElement("div");
@@ -1954,27 +1987,27 @@ class xt extends g {
1954
1987
  i.className = "setting-label", i.setAttribute("for", this.id + "-input");
1955
1988
  const s = document.createElement("span");
1956
1989
  if (s.textContent = this.props.title ?? "Gap", i.appendChild(s), this.props.icon) {
1957
- const a = document.createElement("span");
1958
- a.className = "setting-icon", a.innerHTML = this.props.icon, i.insertBefore(a, s);
1990
+ const o = document.createElement("span");
1991
+ o.className = "setting-icon", o.innerHTML = this.props.icon, i.insertBefore(o, s);
1959
1992
  }
1960
1993
  const n = document.createElement("div");
1961
1994
  n.className = `setting-input-wrapper ${this.props.wrapperClassName || ""}`, n.classList.add("gap-setting-wrapper");
1962
- const o = document.createElement("div");
1963
- return o.className = "gap-inputs-container", this.props.rowGap && o.appendChild(this.createGapInput("row", "Row")), this.props.columnGap && o.appendChild(this.createGapInput("column", "Col")), n.appendChild(o), e.appendChild(i), e.appendChild(n), t.appendChild(e), t;
1995
+ const a = document.createElement("div");
1996
+ return a.className = "gap-inputs-container", this.props.rowGap && a.appendChild(this.createGapInput("row", "Row")), this.props.columnGap && a.appendChild(this.createGapInput("column", "Col")), n.appendChild(a), e.appendChild(i), e.appendChild(n), t.appendChild(e), t;
1964
1997
  }
1965
1998
  createGapInput(t, e) {
1966
1999
  const i = document.createElement("div");
1967
2000
  i.className = "gap-input-wrapper";
1968
2001
  const s = document.createElement("input");
1969
2002
  if (s.type = "number", s.className = `gap-input gap-${t}-input ${this.props.inputClassName || ""}`, s.id = `${this.id}-${t}-input`, s.min = String(this.props.minValue ?? 0), this.props.maxValue !== void 0 && (s.max = String(this.props.maxValue)), s.step = String(this.props.step ?? 1), s.value = String(this.inputValues[t] ?? this.value), s.title = e, s.addEventListener("input", (n) => {
1970
- const o = n.target;
1971
- let a = parseFloat(o.value);
1972
- a = this.validateValue(a), String(a) !== o.value && (o.value = String(a)), this.inputValues[t] = a, this.setValue(a);
2003
+ const a = n.target;
2004
+ let o = parseFloat(a.value);
2005
+ o = this.validateValue(o), String(o) !== a.value && (a.value = String(o)), this.inputValues[t] = o, this.setValue(o);
1973
2006
  }), s.addEventListener("blur", (n) => {
1974
- var l, c;
1975
- const o = n.target;
1976
- let a = parseFloat(o.value);
1977
- a = this.validateValue(a), String(a) !== o.value && (o.value = String(a), this.inputValues[t] = a, this.setValue(a)), (c = (l = this.props).onBlur) == null || c.call(l);
2007
+ var l, r;
2008
+ const a = n.target;
2009
+ let o = parseFloat(a.value);
2010
+ o = this.validateValue(o), String(o) !== a.value && (a.value = String(o), this.inputValues[t] = o, this.setValue(o)), (r = (l = this.props).onBlur) == null || r.call(l);
1978
2011
  }), i.appendChild(s), this.props.suffix && this.props.suffix !== "none") {
1979
2012
  const n = document.createElement("span");
1980
2013
  n.className = "gap-suffix", n.textContent = this.props.suffix, i.appendChild(n), s.style.paddingRight = "30px";
@@ -1994,53 +2027,53 @@ class xt extends g {
1994
2027
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1995
2028
  }
1996
2029
  }
1997
- const tt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2030
+ const et = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1998
2031
  <path d="M2.25 11.75H15.75M5.85 2.75H12.15C13.4101 2.75 14.0402 2.75 14.5215 2.99524C14.9448 3.21095 15.289 3.55516 15.5048 3.97852C15.75 4.45982 15.75 5.08988 15.75 6.35V12.65C15.75 13.9101 15.75 14.5402 15.5048 15.0215C15.289 15.4448 14.9448 15.789 14.5215 16.0048C14.0402 16.25 13.4101 16.25 12.15 16.25H5.85C4.58988 16.25 3.95982 16.25 3.47852 16.0048C3.05516 15.789 2.71095 15.4448 2.49524 15.0215C2.25 14.5402 2.25 13.9101 2.25 12.65V6.35C2.25 5.08988 2.25 4.45982 2.49524 3.97852C2.71095 3.55516 3.05516 3.21095 3.47852 2.99524C3.95982 2.75 4.58988 2.75 5.85 2.75Z" stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
1999
2032
  </svg>`;
2000
- class Lt extends v {
2033
+ class Lt extends C {
2001
2034
  constructor(t = {}) {
2002
2035
  super({
2003
2036
  ...t,
2004
2037
  minValue: t.minValue ?? 0,
2005
2038
  maxValue: t.maxValue ?? 1e3,
2006
- icon: t.icon || tt,
2039
+ icon: t.icon || et,
2007
2040
  title: t.title || "Margin Bottom",
2008
2041
  default: t.default ?? 20,
2009
2042
  wrapperClassName: "margin-bottom-wrapper " + (t.wrapperClassName || "")
2010
2043
  }), this.inputType = "number";
2011
2044
  }
2012
2045
  }
2013
- const et = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2046
+ const it = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2014
2047
  <path d="M15.75 7.25H2.25m9.9 9h-6.3c-1.26 0-1.89 0-2.371-.245a2.25 2.25 0 0 1-.984-.983c-.245-.482-.245-1.112-.245-2.372v-6.3c0-1.26 0-1.89.245-2.371a2.25 2.25 0 0 1 .984-.984c.48-.245 1.11-.245 2.371-.245h6.3c1.26 0 1.89 0 2.371.245.424.216.768.56.984.984.245.48.245 1.11.245 2.371v6.3c0 1.26 0 1.89-.245 2.371-.216.424-.56.768-.984.984-.48.245-1.11.245-2.371.245"
2015
2048
  stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
2016
2049
  </svg>`;
2017
- class yt extends v {
2050
+ class kt extends C {
2018
2051
  constructor(t = {}) {
2019
2052
  super({
2020
2053
  ...t,
2021
2054
  minValue: t.minValue ?? 0,
2022
2055
  maxValue: t.maxValue ?? 1e3,
2023
- icon: t.icon || et,
2056
+ icon: t.icon || it,
2024
2057
  title: t.title || "Margin Top",
2025
2058
  default: t.default ?? 20,
2026
2059
  wrapperClassName: "margin-top-wrapper " + (t.wrapperClassName || "")
2027
2060
  }), this.inputType = "number";
2028
2061
  }
2029
2062
  }
2030
- const it = `
2063
+ const st = `
2031
2064
  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
2032
2065
  <polyline points="3,6 5,6 21,6"></polyline>
2033
2066
  <path d="m19,6v14a2,2 0 0,1-2,2H7a2,2 0 0,1-2-2V6m3,0V4a2,2 0 0,1,2-2h4a2,2 0 0,1,2,2v2"></path>
2034
2067
  <line x1="10" y1="11" x2="10" y2="17"></line>
2035
2068
  <line x1="14" y1="11" x2="14" y2="17"></line>
2036
2069
  </svg>
2037
- `, st = `
2070
+ `, nt = `
2038
2071
  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
2039
2072
  <line x1="12" y1="5" x2="12" y2="19"></line>
2040
2073
  <line x1="5" y1="12" x2="19" y2="12"></line>
2041
2074
  </svg>
2042
2075
  `;
2043
- class kt extends g {
2076
+ class Mt extends g {
2044
2077
  constructor(t = {}) {
2045
2078
  super(t), this.inputType = {}, this.container = null, this.languagesContainer = null, this.addLanguageSelect = null, this.addButton = null, this.defaultLanguages = [
2046
2079
  { code: "en", name: "English" },
@@ -2082,15 +2115,15 @@ class kt extends g {
2082
2115
  s.classList.add("language-label"), s.textContent = t.toUpperCase();
2083
2116
  const n = document.createElement("div");
2084
2117
  n.classList.add("language-input-group");
2085
- const o = document.createElement("input");
2086
- o.type = "text", o.classList.add("language-input"), o.value = e || "", o.placeholder = this.props.placeholder || "Enter text...", o.addEventListener("input", (l) => {
2087
- const c = l.target;
2088
- this.updateLanguageValue(t, c.value);
2118
+ const a = document.createElement("input");
2119
+ a.type = "text", a.classList.add("language-input"), a.value = e || "", a.placeholder = this.props.placeholder || "Enter text...", a.addEventListener("input", (l) => {
2120
+ const r = l.target;
2121
+ this.updateLanguageValue(t, r.value);
2089
2122
  });
2090
- const a = document.createElement("button");
2091
- return a.type = "button", a.classList.add("delete-language-btn"), a.innerHTML = it, a.title = `Delete ${t.toUpperCase()}`, a.addEventListener("click", () => {
2123
+ const o = document.createElement("button");
2124
+ return o.type = "button", o.classList.add("delete-language-btn"), o.innerHTML = st, o.title = `Delete ${t.toUpperCase()}`, o.addEventListener("click", () => {
2092
2125
  this.removeLanguage(t);
2093
- }), n.appendChild(o), n.appendChild(a), i.appendChild(s), i.appendChild(n), i;
2126
+ }), n.appendChild(a), n.appendChild(o), i.appendChild(s), i.appendChild(n), i;
2094
2127
  }
2095
2128
  updateLanguageValue(t, e) {
2096
2129
  this.value || (this.value = {}), this.value[t] = e, this.onChange && this.onChange(this.value), this.props.detectChange && this.props.detectChange(this.value);
@@ -2121,9 +2154,9 @@ class kt extends g {
2121
2154
  const s = document.createElement("select");
2122
2155
  s.classList.add("add-language-select"), this.addLanguageSelect = s;
2123
2156
  const n = document.createElement("button");
2124
- return n.type = "button", n.classList.add("add-language-btn"), n.innerHTML = `${st} Add`, this.addButton = n, n.addEventListener("click", () => {
2125
- const o = s.value;
2126
- o && this.addLanguage(o);
2157
+ return n.type = "button", n.classList.add("add-language-btn"), n.innerHTML = `${nt} Add`, this.addButton = n, n.addEventListener("click", () => {
2158
+ const a = s.value;
2159
+ a && this.addLanguage(a);
2127
2160
  }), i.appendChild(s), i.appendChild(n), t.appendChild(e), t.appendChild(i), t;
2128
2161
  }
2129
2162
  draw() {
@@ -2135,9 +2168,9 @@ class kt extends g {
2135
2168
  const e = document.createElement("div");
2136
2169
  e.classList.add("multi-language-content");
2137
2170
  const i = document.createElement("div");
2138
- i.classList.add("languages-container"), this.languagesContainer = i, this.value && Object.entries(this.value).forEach(([n, o]) => {
2139
- const a = this.createLanguageRow(n, o);
2140
- i.appendChild(a);
2171
+ i.classList.add("languages-container"), this.languagesContainer = i, this.value && Object.entries(this.value).forEach(([n, a]) => {
2172
+ const o = this.createLanguageRow(n, a);
2173
+ i.appendChild(o);
2141
2174
  }), e.appendChild(i);
2142
2175
  const s = this.createAddLanguageSection();
2143
2176
  return e.appendChild(s), t.appendChild(e), this.updateAddLanguageSelect(), this.container = t, t;
@@ -2149,7 +2182,7 @@ class kt extends g {
2149
2182
  }), this.updateAddLanguageSelect());
2150
2183
  }
2151
2184
  }
2152
- class Mt extends g {
2185
+ class Vt extends g {
2153
2186
  constructor(t = {}) {
2154
2187
  super(t), this.inputType = "select";
2155
2188
  const e = [
@@ -2160,7 +2193,7 @@ class Mt extends g {
2160
2193
  { name: "Bounce", value: "bounce 1.5s ease-in-out infinite" },
2161
2194
  { name: "Pulse", value: "pulse 1.5s ease-in-out infinite" }
2162
2195
  ];
2163
- this.selectSetting = new M({
2196
+ this.selectSetting = new N({
2164
2197
  title: this.title || "Animation",
2165
2198
  options: e,
2166
2199
  default: this.props.default || "none"
@@ -2176,34 +2209,34 @@ class Mt extends g {
2176
2209
  this.selectSetting.destroy(), super.destroy();
2177
2210
  }
2178
2211
  }
2179
- const nt = `
2212
+ const ot = `
2180
2213
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2181
2214
  <path d="M5.625 9.5H5.6325M12.375 9.5H12.3825M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M2.25 6.35L2.25 12.65C2.25 13.9101 2.25 14.5402 2.49524 15.0215C2.71095 15.4448 3.05516 15.789 3.47852 16.0048C3.95982 16.25 4.58988 16.25 5.85 16.25H12.15C13.4101 16.25 14.0402 16.25 14.5215 16.0048C14.9448 15.789 15.289 15.4448 15.5048 15.0215C15.75 14.5402 15.75 13.9101 15.75 12.65V6.35C15.75 5.08988 15.75 4.45982 15.5048 3.97852C15.289 3.55516 14.9448 3.21095 14.5215 2.99524C14.0402 2.75 13.4101 2.75 12.15 2.75L5.85 2.75C4.58988 2.75 3.95982 2.75 3.47852 2.99524C3.05516 3.21095 2.71095 3.55516 2.49524 3.97852C2.25 4.45982 2.25 5.08988 2.25 6.35Z" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2182
2215
  </svg>
2183
- `, ot = `
2216
+ `, at = `
2184
2217
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2185
2218
  <path d="M6 2.75H5.85C4.58988 2.75 3.95982 2.75 3.47852 2.99524C3.05516 3.21095 2.71095 3.55516 2.49524 3.97852C2.25 4.45982 2.25 5.08988 2.25 6.35V6.5M6 16.25H5.85C4.58988 16.25 3.95982 16.25 3.47852 16.0048C3.05516 15.789 2.71095 15.4448 2.49524 15.0215C2.25 14.5402 2.25 13.9101 2.25 12.65V12.5M15.75 6.5V6.35C15.75 5.08988 15.75 4.45982 15.5048 3.97852C15.289 3.55516 14.9448 3.21095 14.5215 2.99524C14.0402 2.75 13.4101 2.75 12.15 2.75H12M15.75 12.5V12.65C15.75 13.9101 15.75 14.5402 15.5048 15.0215C15.289 15.4448 14.9448 15.789 14.5215 16.0048C14.0402 16.25 13.4101 16.25 12.15 16.25H12" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2186
2219
  </svg>
2187
2220
  `;
2188
- class Vt extends f {
2221
+ class It extends v {
2189
2222
  constructor(t) {
2190
2223
  super({
2191
2224
  title: "Border",
2192
2225
  collapsed: t == null ? void 0 : t.collapsed,
2193
2226
  hideCondition: t == null ? void 0 : t.hideCondition,
2194
2227
  settings: {
2195
- size: new v({
2228
+ size: new C({
2196
2229
  title: "Size",
2197
- icon: ot,
2230
+ icon: at,
2198
2231
  default: (t == null ? void 0 : t.size) ?? 0,
2199
2232
  suffix: "px"
2200
2233
  }),
2201
- color: new C({
2234
+ color: new w({
2202
2235
  default: (t == null ? void 0 : t.color) ?? "0, 0, 30"
2203
2236
  }),
2204
- radius: new v({
2237
+ radius: new C({
2205
2238
  title: "Radius",
2206
- icon: nt,
2239
+ icon: ot,
2207
2240
  default: (t == null ? void 0 : t.radius) ?? 12,
2208
2241
  suffix: "px"
2209
2242
  })
@@ -2222,20 +2255,20 @@ class Vt extends f {
2222
2255
  `;
2223
2256
  }
2224
2257
  }
2225
- const at = `
2258
+ const lt = `
2226
2259
  <svg xmlns="http://www.w3.org/2000/svg" width="14" height="13" viewBox="0 0 14 13" fill="none">
2227
2260
  <path d="M1 2.75C1 2.05109 1 1.70163 1.11418 1.42597C1.26642 1.05843 1.55843 0.766422 1.92597 0.614181C2.20163 0.5 2.55109 0.5 3.25 0.5H10.75C11.4489 0.5 11.7984 0.5 12.074 0.614181C12.4416 0.766422 12.7336 1.05843 12.8858 1.42597C13 1.70163 13 2.05109 13 2.75M4.75 12.5H9.25M7 0.5V12.5" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2228
2261
  </svg>
2229
- `, lt = `
2262
+ `, rt = `
2230
2263
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2231
2264
  <path d="M3 5.75C3 5.05109 3 4.70163 3.11418 4.42597C3.26642 4.05843 3.55843 3.76642 3.92597 3.61418C4.20163 3.5 4.55109 3.5 5.25 3.5H12.75C13.4489 3.5 13.7984 3.5 14.074 3.61418C14.4416 3.76642 14.7336 4.05843 14.8858 4.42597C15 4.70163 15 5.05109 15 5.75M6 15.5H12M7.6875 3.5V15.5M10.3125 3.5V15.5" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2232
2265
  </svg>
2233
- `, rt = `
2266
+ `, ct = `
2234
2267
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2235
2268
  <path d="M6 5.75H12M9 5.75V13.25M5.85 16.25H12.15C13.4101 16.25 14.0402 16.25 14.5215 16.0048C14.9448 15.789 15.289 15.4448 15.5048 15.0215C15.75 14.5402 15.75 13.9101 15.75 12.65V6.35C15.75 5.08988 15.75 4.45982 15.5048 3.97852C15.289 3.55516 14.9448 3.21095 14.5215 2.99524C14.0402 2.75 13.4101 2.75 12.15 2.75H5.85C4.58988 2.75 3.95982 2.75 3.47852 2.99524C3.05516 3.21095 2.71095 3.55516 2.49524 3.97852C2.25 4.45982 2.25 5.08988 2.25 6.35V12.65C2.25 13.9101 2.25 14.5402 2.49524 15.0215C2.71095 15.4448 3.05516 15.789 3.47852 16.0048C3.95982 16.25 4.58988 16.25 5.85 16.25Z" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2236
2269
  </svg>
2237
2270
  `;
2238
- class Nt extends f {
2271
+ class Nt extends v {
2239
2272
  constructor(t = {}) {
2240
2273
  const { showAlign: e = t.showAlign ?? !0, ...i } = t;
2241
2274
  super({
@@ -2244,12 +2277,12 @@ class Nt extends f {
2244
2277
  hideCondition: i.hideCondition,
2245
2278
  settings: (() => {
2246
2279
  const s = {
2247
- color: new C({
2280
+ color: new w({
2248
2281
  default: i.colorDefault ?? "0, 0, 30"
2249
2282
  }),
2250
- fontFamily: new M({
2283
+ fontFamily: new N({
2251
2284
  title: "Font",
2252
- icon: at,
2285
+ icon: lt,
2253
2286
  default: i.fontFamilyDefault ?? "Satoshi",
2254
2287
  options: i.fontFamilyOptions ?? [
2255
2288
  { name: "Alt", value: "Croco Sans Black Caps Alt" },
@@ -2260,9 +2293,9 @@ class Nt extends f {
2260
2293
  getOptions: i.fontFamilyGetOptions,
2261
2294
  getOptionsAsync: i.fontFamilyGetOptionsAsync
2262
2295
  }),
2263
- fontWeight: new M({
2296
+ fontWeight: new N({
2264
2297
  title: "Weight",
2265
- icon: lt,
2298
+ icon: rt,
2266
2299
  default: i.fontWeightDefault ?? "400",
2267
2300
  options: i.fontWeightOptions ?? [
2268
2301
  { name: "Regular", value: "400" },
@@ -2272,9 +2305,9 @@ class Nt extends f {
2272
2305
  getOptions: i.fontWeightGetOptions,
2273
2306
  getOptionsAsync: i.fontWeightGetOptionsAsync
2274
2307
  }),
2275
- fontSize: new v({
2308
+ fontSize: new C({
2276
2309
  title: "Size",
2277
- icon: rt,
2310
+ icon: ct,
2278
2311
  default: i.fontSizeDefault ?? 12,
2279
2312
  suffix: "px",
2280
2313
  mobile: i.fontSizeMobileDefault
@@ -2291,8 +2324,8 @@ class Nt extends f {
2291
2324
  });
2292
2325
  }
2293
2326
  getCssCode() {
2294
- var o;
2295
- const t = this.settings.color.value ?? "#000000", e = this.settings.fontFamily.value ?? "Satoshi", i = this.settings.fontWeight.value ?? "bold", s = this.settings.fontSize.value ?? 12, n = ((o = this.settings.align) == null ? void 0 : o.value) ?? "left";
2327
+ var a;
2328
+ const t = this.settings.color.value ?? "#000000", e = this.settings.fontFamily.value ?? "Satoshi", i = this.settings.fontWeight.value ?? "bold", s = this.settings.fontSize.value ?? 12, n = ((a = this.settings.align) == null ? void 0 : a.value) ?? "left";
2296
2329
  return `
2297
2330
  color: ${t};
2298
2331
  font-family: ${e};
@@ -2302,7 +2335,7 @@ class Nt extends f {
2302
2335
  `;
2303
2336
  }
2304
2337
  }
2305
- class E extends g {
2338
+ class y extends g {
2306
2339
  constructor(t) {
2307
2340
  super({
2308
2341
  ...t,
@@ -2310,11 +2343,11 @@ class E extends g {
2310
2343
  }), this.inputType = "number", this.value = t.default !== void 0 ? t.default : "auto";
2311
2344
  }
2312
2345
  draw() {
2313
- const t = this.value === "auto" ? "text" : "number", e = (a) => {
2314
- this.value !== "auto" && (this.props.minValue !== void 0 && (a.min = String(this.props.minValue)), this.props.maxValue !== void 0 && (a.max = String(this.props.maxValue)), this.props.className && a.classList.add(this.props.className), a.addEventListener("input", () => {
2315
- const l = this.props.minValue ?? Number.MIN_SAFE_INTEGER, c = this.props.maxValue ?? Number.MAX_SAFE_INTEGER;
2316
- let r = Number(a.value);
2317
- r < l && (r = l), r > c && (r = c), a.value = String(r);
2346
+ const t = this.value === "auto" ? "text" : "number", e = (o) => {
2347
+ this.value !== "auto" && (this.props.minValue !== void 0 && (o.min = String(this.props.minValue)), this.props.maxValue !== void 0 && (o.max = String(this.props.maxValue)), this.props.className && o.classList.add(this.props.className), o.addEventListener("input", () => {
2348
+ const l = this.props.minValue ?? Number.MIN_SAFE_INTEGER, r = this.props.maxValue ?? Number.MAX_SAFE_INTEGER;
2349
+ let d = Number(o.value);
2350
+ d < l && (d = l), d > r && (d = r), o.value = String(d);
2318
2351
  }));
2319
2352
  }, i = this.createInput({
2320
2353
  value: this.value,
@@ -2335,47 +2368,47 @@ class E extends g {
2335
2368
  s && (s.style.paddingRight = "35px");
2336
2369
  const n = document.createElement("span");
2337
2370
  n.className = "suffix-label", n.textContent = this.props.suffix, i.appendChild(n);
2338
- const o = i.querySelector("input");
2339
- return o && (o.oninput = (a) => {
2340
- const l = a.target.value.trim();
2371
+ const a = i.querySelector("input");
2372
+ return a && (a.oninput = (o) => {
2373
+ const l = o.target.value.trim();
2341
2374
  if (l.toLowerCase() === "auto")
2342
2375
  this.value = "auto";
2343
2376
  else {
2344
- const c = Number(l);
2345
- isNaN(c) || (this.value = c);
2377
+ const r = Number(l);
2378
+ isNaN(r) || (this.value = r);
2346
2379
  }
2347
2380
  this.onChange && this.onChange(this.value);
2348
2381
  }), i;
2349
2382
  }
2350
2383
  }
2351
- class It extends f {
2384
+ class St extends v {
2352
2385
  constructor(t) {
2353
2386
  super({
2354
2387
  title: "Margins",
2355
2388
  collapsed: t == null ? void 0 : t.collapsed,
2356
2389
  hideCondition: t == null ? void 0 : t.hideCondition,
2357
2390
  settings: {
2358
- marginTop: new E({
2391
+ marginTop: new y({
2359
2392
  title: "Top",
2360
- icon: ct,
2393
+ icon: ht,
2361
2394
  suffix: "px",
2362
2395
  default: (t == null ? void 0 : t.marginTop) ?? "auto"
2363
2396
  }),
2364
- marginRight: new E({
2397
+ marginRight: new y({
2365
2398
  title: "Right",
2366
- icon: ht,
2399
+ icon: dt,
2367
2400
  suffix: "px",
2368
2401
  default: (t == null ? void 0 : t.marginRight) ?? 0
2369
2402
  }),
2370
- marginBottom: new E({
2403
+ marginBottom: new y({
2371
2404
  title: "Bottom",
2372
- icon: dt,
2405
+ icon: ut,
2373
2406
  suffix: "px",
2374
2407
  default: (t == null ? void 0 : t.marginBottom) ?? 0
2375
2408
  }),
2376
- marginLeft: new E({
2409
+ marginLeft: new y({
2377
2410
  title: "Left",
2378
- icon: ut,
2411
+ icon: pt,
2379
2412
  suffix: "px",
2380
2413
  default: (t == null ? void 0 : t.marginLeft) ?? 0
2381
2414
  })
@@ -2392,16 +2425,16 @@ class It extends f {
2392
2425
  `;
2393
2426
  }
2394
2427
  }
2395
- const ct = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2428
+ const ht = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2396
2429
  <path d="M2.25 16.25H2.2575M2.25 9.5H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M5.625 16.25H5.6325M5.625 9.5H5.6325M12.375 16.25H12.3825M12.375 9.5H12.3825M9 16.25H9.0075M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 16.25H15.7575M15.75 9.5H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M15.75 2.75H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2397
- </svg>`, ht = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2398
- <path d="M5.625 2.75H5.6325M5.625 9.5H5.6325M5.625 16.25H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M12.375 16.25H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 16.25H9.0075M9 12.875H9.0075M9 6.125H9.0075M2.25 2.75H2.2575M2.25 9.5H2.2575M2.25 16.25H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M15.75 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2399
2430
  </svg>`, dt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2400
- <path d="M2.25 2.75H2.2575M2.25 9.5H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M5.625 2.75H5.6325M5.625 9.5H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 2.75H15.7575M15.75 9.5H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M15.75 16.25H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2431
+ <path d="M5.625 2.75H5.6325M5.625 9.5H5.6325M5.625 16.25H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M12.375 16.25H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 16.25H9.0075M9 12.875H9.0075M9 6.125H9.0075M2.25 2.75H2.2575M2.25 9.5H2.2575M2.25 16.25H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M15.75 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2401
2432
  </svg>`, ut = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2433
+ <path d="M2.25 2.75H2.2575M2.25 9.5H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M5.625 2.75H5.6325M5.625 9.5H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 2.75H15.7575M15.75 9.5H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M15.75 16.25H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2434
+ </svg>`, pt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2402
2435
  <path d="M5.625 2.75H5.6325M5.625 9.5H5.6325M5.625 16.25H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M12.375 16.25H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 16.25H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 2.75H15.7575M15.75 9.5H15.7575M15.75 16.25H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M2.25 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
2403
2436
  </svg>`;
2404
- class St extends f {
2437
+ class Ot extends v {
2405
2438
  /**
2406
2439
  * Constructs a new BackgroundSettingSet.
2407
2440
  *
@@ -2431,14 +2464,14 @@ class St extends f {
2431
2464
  collapsed: t == null ? void 0 : t.collapsed,
2432
2465
  hideCondition: t == null ? void 0 : t.hideCondition,
2433
2466
  settings: {
2434
- backgroundImage: new Z({
2467
+ backgroundImage: new K({
2435
2468
  ...t == null ? void 0 : t.uploadProps,
2436
2469
  default: (t == null ? void 0 : t.backgroundImage) ?? ""
2437
2470
  }),
2438
- opacity: new P({
2471
+ opacity: new G({
2439
2472
  default: (t == null ? void 0 : t.opacity) ?? 100
2440
2473
  }),
2441
- backgroundColor: new C({
2474
+ backgroundColor: new w({
2442
2475
  default: (t == null ? void 0 : t.backgroundColor) ?? "0, 0, 30"
2443
2476
  })
2444
2477
  }
@@ -2450,10 +2483,10 @@ class St extends f {
2450
2483
  draw() {
2451
2484
  const t = super.draw(), e = t.querySelector(".setting-group-content");
2452
2485
  if (!e) return t;
2453
- const i = Array.from(e.children), [s, n, o] = i;
2486
+ const i = Array.from(e.children), [s, n, a] = i;
2454
2487
  e.innerHTML = "", e.appendChild(s), e.appendChild(n);
2455
- const a = document.createElement("div");
2456
- return a.className = "bgset-or-label", a.textContent = "OR", e.appendChild(a), e.appendChild(o), t;
2488
+ const o = document.createElement("div");
2489
+ return o.className = "bgset-or-label", o.textContent = "OR", e.appendChild(o), e.appendChild(a), t;
2457
2490
  }
2458
2491
  /**
2459
2492
  * Helper method to generate CSS based on the current settings.
@@ -2470,44 +2503,44 @@ class St extends f {
2470
2503
  `;
2471
2504
  }
2472
2505
  }
2473
- function Ot(h) {
2474
- return h instanceof f;
2475
- }
2476
2506
  function Ht(h) {
2507
+ return h instanceof v;
2508
+ }
2509
+ function Tt(h) {
2477
2510
  return h instanceof g;
2478
2511
  }
2479
2512
  export {
2480
2513
  W as AlignSetting,
2481
- Mt as AnimationSetting,
2482
- St as BackgroundSettingSet,
2483
- Vt as BorderSettingSet,
2484
- ft as ButtonSetting,
2485
- m as ColorSetting,
2486
- C as ColorWithOpacitySetting,
2487
- vt as DimensionSetting,
2488
- xt as GapSetting,
2514
+ Vt as AnimationSetting,
2515
+ Ot as BackgroundSettingSet,
2516
+ It as BorderSettingSet,
2517
+ vt as ButtonSetting,
2518
+ f as ColorSetting,
2519
+ w as ColorWithOpacitySetting,
2520
+ Ct as DimensionSetting,
2521
+ yt as GapSetting,
2489
2522
  Nt as HeaderTypographySettingSet,
2490
- Ct as HeightSetting,
2491
- mt as HtmlSetting,
2523
+ wt as HeightSetting,
2524
+ ft as HtmlSetting,
2492
2525
  Lt as MarginBottomSetting,
2493
- It as MarginSettingGroup,
2494
- yt as MarginTopSetting,
2495
- kt as MultiLanguageSetting,
2496
- v as NumberSetting,
2497
- P as OpacitySetting,
2498
- Et as SelectApiSettings,
2499
- M as SelectSetting,
2526
+ St as MarginSettingGroup,
2527
+ kt as MarginTopSetting,
2528
+ Mt as MultiLanguageSetting,
2529
+ C as NumberSetting,
2530
+ G as OpacitySetting,
2531
+ bt as SelectApiSettings,
2532
+ N as SelectSetting,
2500
2533
  g as Setting,
2501
- f as SettingGroup,
2502
- $ as StringSetting,
2503
- pt as TabSettingGroup,
2504
- pt as TabsSettingGroup,
2505
- bt as Toggle,
2506
- Z as UploadSetting,
2507
- wt as WidthSetting,
2508
- gt as asSettingGroupWithSettings,
2509
- R as createSettingGroup,
2510
- Ht as isSetting,
2511
- Ot as isSettingGroup,
2512
- w as iterateSettings
2534
+ v as SettingGroup,
2535
+ F as StringSetting,
2536
+ gt as TabSettingGroup,
2537
+ gt as TabsSettingGroup,
2538
+ xt as Toggle,
2539
+ K as UploadSetting,
2540
+ Et as WidthSetting,
2541
+ mt as asSettingGroupWithSettings,
2542
+ $ as createSettingGroup,
2543
+ Tt as isSetting,
2544
+ Ht as isSettingGroup,
2545
+ x as iterateSettings
2513
2546
  };