builder-settings-types 0.0.220 → 0.0.224

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 +534 -497
  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
  }
@@ -434,14 +438,31 @@ const p = class p {
434
438
  const i = this.getValues();
435
439
  this.initialValues = i, (s = this.onChange) == null || s.call(this, i);
436
440
  }
437
- addDeleteButtonToElement(t, e) {
438
- var l, c;
439
- const i = t.querySelector(".setting-group-title");
440
- if (!i) return;
441
- const s = i.querySelector(".actions-section");
441
+ addDeleteButtonToElement(t, e, i) {
442
+ let s = null;
443
+ try {
444
+ s = t.querySelector(":scope > .setting-group-title");
445
+ } catch {
446
+ s = null;
447
+ }
448
+ if (!s) {
449
+ const d = Array.from(
450
+ t.querySelectorAll(".setting-group-title")
451
+ );
452
+ for (const c of d)
453
+ if (c.closest(".setting-group") === t) {
454
+ s = c;
455
+ break;
456
+ }
457
+ s || (s = d[0] ?? null);
458
+ }
442
459
  if (!s) return;
443
- 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 = `
460
+ const n = s.querySelector(".actions-section");
461
+ if (!n) return;
462
+ const a = document.createElement("button");
463
+ a.type = "button", a.className = "sg-delete-button";
464
+ const o = i ? i.deleteItemCfg : this.deleteItemCfg ?? this.addItemCfg;
465
+ a.title = (o == null ? void 0 : o.deleteButtonLabel) || "Delete", a.style.cssText = `
445
466
  background: none;
446
467
  border: none;
447
468
  cursor: pointer;
@@ -454,23 +475,23 @@ 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 l = (o == null ? void 0 : o.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"/>
461
482
  </svg>
462
483
  `;
463
- n.innerHTML = o, n.addEventListener("mouseenter", () => {
464
- n.style.backgroundColor = "#fef2f2";
465
- }), n.addEventListener("mouseleave", () => {
466
- n.style.backgroundColor = "transparent";
467
- }), n.addEventListener("click", (r) => {
468
- r.stopPropagation(), r.preventDefault(), this.showDeleteConfirmation().then((d) => {
469
- d && this.removeSetting(e);
484
+ a.innerHTML = l, a.addEventListener("mouseenter", () => {
485
+ a.style.backgroundColor = "#fef2f2";
486
+ }), a.addEventListener("mouseleave", () => {
487
+ a.style.backgroundColor = "transparent";
488
+ }), a.addEventListener("click", (d) => {
489
+ d.stopPropagation(), d.preventDefault(), this.showDeleteConfirmation().then((c) => {
490
+ c && (i && i.deleteItemCfg ? this.removeSetting(e) : 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 r = n.querySelector(".setting-group-arrow");
494
+ r ? n.insertBefore(a, r) : n.appendChild(a);
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,105 @@ 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(
780
+ m,
781
+ c,
782
+ u
783
+ );
784
+ else {
785
+ const E = this.deleteItemCfg ?? this.addItemCfg;
786
+ if (E && E.showDeleteButton !== !1) {
787
+ const b = E.keyPrefix ?? ((d = this.addItemCfg) == null ? void 0 : d.keyPrefix);
788
+ b && c.startsWith(b) && this.addDeleteButtonToElement(m, c);
789
+ }
790
+ }
791
+ o.appendChild(m);
755
792
  }
756
793
  } else {
757
- const r = document.createElement("div");
758
- r.className = "setting-group-empty", r.textContent = "No settings in this group", a.appendChild(r);
794
+ const c = document.createElement("div");
795
+ c.className = "setting-group-empty", c.textContent = "No settings in this group", o.appendChild(c);
759
796
  }
760
797
  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 ?? `
798
+ const c = document.createElement("button");
799
+ c.type = "button", c.className = "sg-add-button-bottom", c.style.marginTop = "8px";
800
+ const u = this.addItemCfg.buttonIconSvg ?? `
764
801
  <svg width="16" height="16" viewBox="0 0 16 16" fill="none"
765
802
  xmlns="http://www.w3.org/2000/svg">
766
803
  <path d="M8 3.333v9.334M3.333 8h9.334" stroke="currentColor"
767
804
  stroke-width="1.5" stroke-linecap="round"/>
768
805
  </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);
806
+ c.innerHTML = `${u}<span style="margin-left:4px;">${this.addItemCfg.buttonLabel ?? "Add"}</span>`, c.addEventListener("click", (m) => {
807
+ m.stopPropagation(), m.preventDefault();
808
+ const M = this.getNextIndexFromPrefix(this.addItemCfg.keyPrefix), E = this.addItemCfg.createItem(M), b = `${this.addItemCfg.keyPrefix}${M}`;
809
+ this.addSetting(b, E), this.addItemCfg.expandNewItem !== !1 && E.expand && E.expand();
810
+ }), o.appendChild(c);
774
811
  }
775
- return e.appendChild(i), e.appendChild(n), t.appendChild(e), t.appendChild(a), this.elementRef = t, N.trackElement(t), setTimeout(() => {
812
+ return e.appendChild(i), e.appendChild(n), t.appendChild(e), t.appendChild(o), this.elementRef = t, S.trackElement(t), setTimeout(() => {
776
813
  this.updateNestingStyles();
777
814
  }, 0), this.pendingBlurHandler && (this.setupBlurHandlers(), this.pendingBlurHandler = null), t;
778
815
  }
@@ -809,10 +846,10 @@ const p = class p {
809
846
  let i = e;
810
847
  const s = Object.keys(this.settings), n = Object.keys(e);
811
848
  if (!s.some(
812
- (a) => n.includes(a)
849
+ (o) => n.includes(o)
813
850
  ) && n.length === 1) {
814
- const a = n[0];
815
- i = e[a];
851
+ const o = n[0];
852
+ i = e[o];
816
853
  }
817
854
  this.setValue(i);
818
855
  } catch (e) {
@@ -821,8 +858,8 @@ const p = class p {
821
858
  }
822
859
  };
823
860
  p.hiddenElements = /* @__PURE__ */ new Set();
824
- let f = p;
825
- class pt extends f {
861
+ let v = p;
862
+ class gt extends v {
826
863
  constructor(t) {
827
864
  super(t);
828
865
  const e = Object.keys(this.settings)[0];
@@ -856,28 +893,28 @@ class pt extends f {
856
893
  s.textContent = this.title, i.appendChild(s);
857
894
  const n = document.createElement("div");
858
895
  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 || "";
896
+ const a = document.createElement("div");
897
+ if (a.className = "tab-content", this.contentContainers = {}, Object.keys(this.settings).forEach((o, l) => {
898
+ const r = document.createElement("button");
899
+ 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);
900
+ const d = document.createElement("div");
901
+ d.className = "tab-panel", this.contentContainers[o] = d;
902
+ const c = this.settings[o];
903
+ c && (c instanceof v && c.setNestingLevel(this.getNestingLevel() + 1), d.appendChild(c.draw())), a.appendChild(d), l === 0 && !this.activeTabId && (this.activeTabId = o);
904
+ }), e.appendChild(i), e.appendChild(n), e.appendChild(a), !this.activeTabId) {
905
+ const o = Object.keys(this.settings)[0];
906
+ this.activeTabId = o || "";
870
907
  }
871
908
  return this.updateTabUI(), t;
872
909
  }
873
910
  }
874
- function R(h) {
875
- return new f(h);
911
+ function $(h) {
912
+ return new v(h);
876
913
  }
877
- function gt(h) {
914
+ function mt(h) {
878
915
  return h;
879
916
  }
880
- class $ extends g {
917
+ class F extends g {
881
918
  constructor(t = {}) {
882
919
  super(t), this.inputType = "text", t.onChange && this.setOnChange(t.onChange);
883
920
  }
@@ -897,31 +934,31 @@ class $ extends g {
897
934
  });
898
935
  }
899
936
  }
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 $ {
937
+ 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>";
938
+ class f extends F {
902
939
  constructor(t) {
903
940
  super({
904
941
  ...t,
905
- icon: t.icon || F,
942
+ icon: t.icon || z,
906
943
  title: t.title || "Color",
907
- default: t.default ? m.normalizeColorValue(t.default) : "#000000"
944
+ default: t.default ? f.normalizeColorValue(t.default) : "#000000"
908
945
  }), this.inputType = "color", this.element = null, this.colorInputEl = null, this.textInputEl = null, this.detectChange = t.detectChange;
909
946
  }
910
947
  static normalizeColorValue(t) {
911
- return t.startsWith("#") ? m.normalizeHexValue(t) : t.includes(",") ? m.rgbToHexStatic(t) : m.normalizeHexValue(t);
948
+ return t.startsWith("#") ? f.normalizeHexValue(t) : t.includes(",") ? f.rgbToHexStatic(t) : f.normalizeHexValue(t);
912
949
  }
913
950
  static normalizeHexValue(t) {
914
951
  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
952
  }
916
953
  static rgbToHexStatic(t) {
917
- const e = t.split(",").map((r) => parseInt(r.trim()));
954
+ const e = t.split(",").map((d) => parseInt(d.trim()));
918
955
  if (e.length !== 3 || e.some(isNaN))
919
956
  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;
957
+ 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) => {
958
+ const c = d.toString(16);
959
+ return c.length === 1 ? "0" + c : c;
923
960
  };
924
- return `#${c(o)}${c(a)}${c(l)}`;
961
+ return `#${r(a)}${r(o)}${r(l)}`;
925
962
  }
926
963
  setValue(t) {
927
964
  if (t === void 0) {
@@ -929,7 +966,7 @@ class m extends $ {
929
966
  return;
930
967
  }
931
968
  if (typeof t == "string") {
932
- const e = m.normalizeColorValue(t);
969
+ const e = f.normalizeColorValue(t);
933
970
  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
971
  } else
935
972
  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 +981,53 @@ class m extends $ {
944
981
  if (t.className = "color-setting-wrapper " + (this.props.wrapperClassName || ""), this.props.title || this.props.icon) {
945
982
  const l = document.createElement("div");
946
983
  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);
984
+ const r = document.createElement("span");
985
+ r.className = "input-icon", r.innerHTML = this.props.icon, l.appendChild(r);
949
986
  }
950
987
  if (this.props.title) {
951
- const c = document.createElement("span");
952
- c.className = "input-label", c.textContent = this.props.title, l.appendChild(c);
988
+ const r = document.createElement("span");
989
+ r.className = "input-label", r.textContent = this.props.title, l.appendChild(r);
953
990
  }
954
991
  t.appendChild(l);
955
992
  }
956
993
  const e = document.createElement("div");
957
994
  e.className = "color-input-wrapper";
958
995
  const i = (l) => {
959
- const c = l.value.trim();
960
- if (!c)
996
+ const r = l.value.trim();
997
+ if (!r)
961
998
  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;
999
+ const c = /^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/.test(r);
1000
+ return c ? e.classList.remove("error") : e.classList.add("error"), c;
964
1001
  }, s = document.createElement("input");
965
1002
  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
1003
  const n = document.createElement("div");
967
1004
  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();
1005
+ const a = this.value || "#000000";
1006
+ n.style.backgroundColor = a;
1007
+ const o = document.createElement("input");
1008
+ 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) => {
1009
+ var d, c;
1010
+ let r = l.target.value.trim();
974
1011
  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;
1012
+ const u = f.normalizeColorValue(r);
1013
+ 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
1014
  }
978
1015
  }), 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");
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, e.classList.remove("error");
982
1019
  }), 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;
1020
+ var c, u;
1021
+ const r = l.target.value, d = f.normalizeColorValue(r);
1022
+ 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;
1023
+ }), e.appendChild(s), e.appendChild(n), e.appendChild(o), t.appendChild(e), this.element = t, t;
987
1024
  }
988
1025
  getElement() {
989
1026
  return this.element;
990
1027
  }
991
1028
  // Helper method to get normalized hex value
992
1029
  getNormalizedValue() {
993
- return this.value ? m.normalizeColorValue(this.value) : "#000000";
1030
+ return this.value ? f.normalizeColorValue(this.value) : "#000000";
994
1031
  }
995
1032
  // Helper method to check if current value is valid hex
996
1033
  isValidHex() {
@@ -1001,20 +1038,20 @@ class m extends $ {
1001
1038
  return this.isValidHex() ? this.hexToRgb(this.value) : "0, 0, 0";
1002
1039
  }
1003
1040
  }
1004
- const z = `
1041
+ const j = `
1005
1042
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1006
1043
  <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
1044
  <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
1045
  <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
1046
  </svg>`;
1010
- class C extends g {
1047
+ class w extends g {
1011
1048
  constructor(t = {}) {
1012
1049
  super({
1013
1050
  ...t,
1014
- icon: t.icon || z,
1051
+ icon: t.icon || j,
1015
1052
  title: t.title || "Color & Opacity",
1016
1053
  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));
1054
+ }), 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
1055
  }
1019
1056
  static normalizeHexWithOpacity(t) {
1020
1057
  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 +1069,18 @@ class C extends g {
1032
1069
  return `#${i}${n}`;
1033
1070
  }
1034
1071
  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);
1072
+ 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
1073
  }
1037
1074
  updateInputElements() {
1038
1075
  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
1076
  }
1040
1077
  updateColorPreview() {
1041
1078
  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})`;
1079
+ 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);
1080
+ this.colorPreviewEl.style.backgroundColor = `rgba(${s}, ${n}, ${a}, ${e})`;
1044
1081
  }
1045
1082
  handleColorChange(t) {
1046
- const e = this.getOpacityPercent(), i = C.combineColorOpacity(t, e);
1083
+ const e = this.getOpacityPercent(), i = w.combineColorOpacity(t, e);
1047
1084
  this.setValue(i);
1048
1085
  }
1049
1086
  handleTextInput(t) {
@@ -1051,47 +1088,47 @@ class C extends g {
1051
1088
  return e || i ? (this.setValue(t), !0) : !1;
1052
1089
  }
1053
1090
  handleOpacityChange(t) {
1054
- const e = this.getRgbColor(), i = Math.max(0, Math.min(100, t)), s = C.combineColorOpacity(e, i);
1091
+ const e = this.getRgbColor(), i = Math.max(0, Math.min(100, t)), s = w.combineColorOpacity(e, i);
1055
1092
  this.setValue(s);
1056
1093
  }
1057
1094
  draw() {
1058
1095
  const t = document.createElement("div");
1059
1096
  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);
1097
+ const a = document.createElement("div");
1098
+ if (a.className = "icon-container", this.props.icon) {
1099
+ const o = document.createElement("span");
1100
+ o.className = "input-icon", o.innerHTML = this.props.icon, a.appendChild(o);
1064
1101
  }
1065
1102
  if (this.props.title) {
1066
- const a = document.createElement("span");
1067
- a.className = "input-label", a.textContent = this.props.title, o.appendChild(a);
1103
+ const o = document.createElement("span");
1104
+ o.className = "input-label", o.textContent = this.props.title, a.appendChild(o);
1068
1105
  }
1069
- t.appendChild(o);
1106
+ t.appendChild(a);
1070
1107
  }
1071
1108
  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"));
1109
+ 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) => {
1110
+ const o = a.target;
1111
+ this.handleColorChange(o.value), this.textInputEl && (this.textInputEl.value = this.value || "#000000FF"), this.updateColorPreview();
1112
+ }), this.textInputEl.addEventListener("input", (a) => {
1113
+ const o = a.target;
1114
+ 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");
1115
+ }), this.textInputEl.addEventListener("blur", (a) => {
1116
+ const o = a.target;
1117
+ o.value.trim() === "" && (o.value = this.value || "#000000FF", e.classList.remove("error"));
1081
1118
  }), this.colorPreviewEl.addEventListener("click", () => {
1082
- var o;
1083
- (o = this.colorInputEl) == null || o.click();
1119
+ var a;
1120
+ (a = this.colorInputEl) == null || a.click();
1084
1121
  }), e.appendChild(this.colorInputEl), e.appendChild(this.colorPreviewEl), e.appendChild(this.textInputEl);
1085
1122
  const i = document.createElement("div");
1086
1123
  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
1124
  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);
1125
+ s.className = "color-with-opacity-opacity-suffix", s.textContent = "%", this.opacityInputEl.addEventListener("input", (a) => {
1126
+ const o = a.target, l = parseFloat(o.value);
1090
1127
  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();
1128
+ }), this.opacityInputEl.addEventListener("blur", (a) => {
1129
+ const o = a.target;
1130
+ let l = parseFloat(o.value);
1131
+ 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
1132
  }), i.appendChild(this.opacityInputEl), i.appendChild(s);
1096
1133
  const n = document.createElement("div");
1097
1134
  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 +1141,8 @@ class C extends g {
1104
1141
  }
1105
1142
  getRgbaValue() {
1106
1143
  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})`;
1144
+ 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);
1145
+ return `rgba(${s}, ${n}, ${a}, ${e})`;
1109
1146
  }
1110
1147
  getColorAndOpacity() {
1111
1148
  return {
@@ -1114,7 +1151,7 @@ class C extends g {
1114
1151
  };
1115
1152
  }
1116
1153
  }
1117
- class mt extends g {
1154
+ class ft extends g {
1118
1155
  constructor(t = {}) {
1119
1156
  super(t), this.inputType = "text", t.onChange && this.setOnChange(t.onChange);
1120
1157
  }
@@ -1126,27 +1163,27 @@ class mt extends g {
1126
1163
  if (t.className = "html-setting-wrapper " + (this.props.wrapperClassName || ""), this.props.title || this.props.icon) {
1127
1164
  const n = document.createElement("div");
1128
1165
  if (n.className = "icon-container", this.props.icon) {
1129
- const o = this.createIcon(this.props.icon);
1130
- n.appendChild(o);
1166
+ const a = this.createIcon(this.props.icon);
1167
+ n.appendChild(a);
1131
1168
  }
1132
1169
  if (this.props.title) {
1133
- const o = this.createLabel(this.props.title);
1134
- n.appendChild(o);
1170
+ const a = this.createLabel(this.props.title);
1171
+ n.appendChild(a);
1135
1172
  }
1136
1173
  t.appendChild(n);
1137
1174
  }
1138
1175
  const e = document.createElement("textarea");
1139
1176
  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
1177
  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);
1178
+ const o = n.target.value;
1179
+ this.value = o, this.onChange && this.onChange(this.value), this.props.detectChange && this.props.detectChange(this.value);
1143
1180
  }, s = (n) => {
1144
1181
  this.onBlur && this.value !== void 0 && this.onBlur(this.value);
1145
1182
  };
1146
1183
  return e.addEventListener("input", i), e.addEventListener("change", i), e.addEventListener("blur", s), t.appendChild(e), t;
1147
1184
  }
1148
1185
  }
1149
- class v extends g {
1186
+ class C extends g {
1150
1187
  constructor(t) {
1151
1188
  super(t), this.inputType = "number", this.inputElement = null, this.mobileValue = t.mobile, this.validateProps(), this.value = this.validateValue(this.value);
1152
1189
  }
@@ -1169,12 +1206,12 @@ class v extends g {
1169
1206
  const i = document.createElement("input");
1170
1207
  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
1208
  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);
1209
+ let a = Number(i.value);
1210
+ a < s && (a = s), a > n && (a = n), String(a) !== i.value && (i.value = String(a)), this.setValue(a);
1174
1211
  }), i.addEventListener("blur", () => {
1175
- var n, o;
1212
+ var n, a;
1176
1213
  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);
1214
+ s !== Number(i.value) && (i.value = String(s), this.setValue(s)), (a = (n = this.props).onBlur) == null || a.call(n);
1178
1215
  }), e.appendChild(i), this.props.suffix && this.props.suffix !== "none") {
1179
1216
  const s = document.createElement("span");
1180
1217
  s.className = "suffix-label", s.textContent = this.props.suffix, e.appendChild(s);
@@ -1205,12 +1242,12 @@ class v extends g {
1205
1242
  );
1206
1243
  }
1207
1244
  }
1208
- const j = `
1245
+ const P = `
1209
1246
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1210
1247
  <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
1248
  <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
1249
  </svg>`;
1213
- class P extends v {
1250
+ class G extends C {
1214
1251
  constructor(t = {}) {
1215
1252
  const e = {
1216
1253
  title: "Opacity",
@@ -1219,7 +1256,7 @@ class P extends v {
1219
1256
  maxValue: 100,
1220
1257
  step: 1,
1221
1258
  default: t.default ?? 100,
1222
- icon: j,
1259
+ icon: P,
1223
1260
  ...t
1224
1261
  };
1225
1262
  super(e), this.inputType = "number", this.mobileValue = t.mobile;
@@ -1231,12 +1268,12 @@ class P extends v {
1231
1268
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1232
1269
  }
1233
1270
  }
1234
- const G = `
1271
+ const D = `
1235
1272
  <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
1273
  <polyline points="6 9 12 15 18 9"></polyline>
1237
1274
  </svg>
1238
1275
  `;
1239
- class M extends g {
1276
+ class N extends g {
1240
1277
  constructor(t = {}) {
1241
1278
  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
1279
  const e = this._options.findIndex((i) => i.value === this.value);
@@ -1257,12 +1294,12 @@ class M extends g {
1257
1294
  if (t.classList.add("select-container"), this.container = t, this.props.icon || this.props.title) {
1258
1295
  const n = document.createElement("div");
1259
1296
  if (n.className = "icon-container", this.props.icon) {
1260
- const o = this.createIcon(this.props.icon);
1261
- n.appendChild(o);
1297
+ const a = this.createIcon(this.props.icon);
1298
+ n.appendChild(a);
1262
1299
  }
1263
1300
  if (this.props.title) {
1264
- const o = this.createLabel(this.props.title);
1265
- n.appendChild(o);
1301
+ const a = this.createLabel(this.props.title);
1302
+ n.appendChild(a);
1266
1303
  }
1267
1304
  t.appendChild(n);
1268
1305
  } else {
@@ -1271,22 +1308,22 @@ class M extends g {
1271
1308
  }
1272
1309
  const e = document.createElement("div");
1273
1310
  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));
1311
+ var n, a;
1312
+ 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
1313
  }, t.appendChild(e), this.buttonEl = e;
1277
1314
  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);
1315
+ i.classList.add("select-options"), this._options.forEach((n, a) => {
1316
+ const o = this.createOption(n, a);
1317
+ o.onclick = (l) => this.selectOption(l, a, e), i.appendChild(o);
1281
1318
  }), document.body.appendChild(i);
1282
1319
  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) => {
1320
+ 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
1321
  this._options.push(...n), this.isLoading = !1, this.updateOptionsList(), this.updateButtonText();
1285
1322
  }).catch((n) => {
1286
1323
  console.error("Failed to fetch async options:", n), this.isLoading = !1, this.updateButtonText("Failed to load options");
1287
1324
  })), 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());
1325
+ var a, o;
1326
+ 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
1327
  }, document.addEventListener("click", this.clickOutsideListener), this.resizeListener && window.removeEventListener("resize", this.resizeListener), this.resizeListener = () => {
1291
1328
  this.isOpen && this.checkDropdownPosition();
1292
1329
  }, window.addEventListener("resize", this.resizeListener), t;
@@ -1308,10 +1345,10 @@ class M extends g {
1308
1345
  }
1309
1346
  }
1310
1347
  selectOption(t, e, i) {
1311
- var n, o, a;
1348
+ var n, a, o;
1312
1349
  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");
1350
+ 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) => {
1351
+ d === e ? r.classList.add("selected") : r.classList.remove("selected");
1315
1352
  }));
1316
1353
  }
1317
1354
  /**
@@ -1394,15 +1431,15 @@ class W extends g {
1394
1431
  `
1395
1432
  }
1396
1433
  ].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);
1434
+ const a = document.createElement("button");
1435
+ a.className = "align-option-button", a.innerHTML = n.icon, this.value === n.name && a.classList.add("selected"), a.addEventListener("click", () => {
1436
+ var o;
1437
+ 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);
1438
+ }), i.appendChild(a);
1402
1439
  }), t.appendChild(i), t;
1403
1440
  }
1404
1441
  }
1405
- class ft extends g {
1442
+ class vt extends g {
1406
1443
  constructor(t) {
1407
1444
  super(t), this.inputType = "button", this.bgWithAlpha = "rgba(145, 158, 171, 0.08)";
1408
1445
  }
@@ -1416,42 +1453,42 @@ class ft extends g {
1416
1453
  /^rgba\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)$/i
1417
1454
  );
1418
1455
  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})`;
1456
+ let o = +n[1], l = +n[2], r = +n[3], d = +n[4];
1457
+ 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
1458
  }
1422
1459
  t.addEventListener("mouseenter", () => {
1423
1460
  console.log("hoverBg", s), t.style.setProperty("background-color", s, "important");
1424
1461
  }), t.addEventListener("mouseleave", () => {
1425
1462
  t.style.setProperty("background-color", e, "important");
1426
1463
  }), t.addEventListener("click", () => {
1427
- var a, l;
1428
- return (l = (a = this.props).onClick) == null ? void 0 : l.call(a);
1464
+ var o, l;
1465
+ return (l = (o = this.props).onClick) == null ? void 0 : l.call(o);
1429
1466
  });
1430
- const o = document.createElement("div");
1431
- return o.className = "button-setting-wrapper " + (this.props.wrapperClassName || ""), o.appendChild(t), o;
1467
+ const a = document.createElement("div");
1468
+ return a.className = "button-setting-wrapper " + (this.props.wrapperClassName || ""), a.appendChild(t), a;
1432
1469
  }
1433
1470
  }
1434
- class vt extends g {
1471
+ class Ct extends g {
1435
1472
  constructor(t = {}) {
1436
1473
  super(t), this.inputType = { width: "number", height: "number" }, this.aspectRatio = 1, this.isUpdating = !1;
1437
1474
  const e = t.width || 0, i = t.height || 0;
1438
1475
  this.value || (this.value = {
1439
1476
  width: e,
1440
1477
  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({
1478
+ }), 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
1479
  title: "Width",
1443
1480
  default: this.value.width,
1444
1481
  suffix: "px",
1445
1482
  minValue: this.minWidth,
1446
1483
  maxValue: this.maxWidth,
1447
- icon: D
1448
- }), this.heightSetting = new v({
1484
+ icon: J
1485
+ }), this.heightSetting = new C({
1449
1486
  title: "Height",
1450
1487
  default: this.value.height,
1451
1488
  suffix: "px",
1452
1489
  minValue: this.minHeight,
1453
1490
  maxValue: this.maxHeight,
1454
- icon: J
1491
+ icon: U
1455
1492
  }), this.widthSetting.setOnChange(this.handleWidthChange.bind(this)), this.heightSetting.setOnChange(this.handleHeightChange.bind(this));
1456
1493
  }
1457
1494
  handleWidthChange(t) {
@@ -1521,8 +1558,8 @@ class vt extends g {
1521
1558
  return n.className = "dimension-lock-icon", n.setAttribute("type", "button"), n.setAttribute("aria-pressed", String(this.locked)), n.setAttribute(
1522
1559
  "aria-label",
1523
1560
  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);
1561
+ ), n.title = this.locked ? "Unlock aspect ratio" : "Lock aspect ratio", n.innerHTML = this.getLockSVG(this.locked), n.onclick = (a) => {
1562
+ a.preventDefault(), this.toggleLock(n);
1526
1563
  }, s.appendChild(n), t.appendChild(e), t.appendChild(s), t.appendChild(i), t;
1527
1564
  }
1528
1565
  isLocked() {
@@ -1545,15 +1582,15 @@ class vt extends g {
1545
1582
  }
1546
1583
  }
1547
1584
  }
1548
- const D = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1585
+ const J = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1549
1586
  <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">
1587
+ </svg>`, U = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1551
1588
  <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 = `
1589
+ </svg>`, V = `
1553
1590
  <svg xmlns="http://www.w3.org/2000/svg" width="15" height="16" viewBox="0 0 15 16" fill="none">
1554
1591
  <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
1592
  </svg>
1556
- `, U = `
1593
+ `, q = `
1557
1594
  <svg width="91" height="71" viewBox="0 0 91 71" fill="none" xmlns="http://www.w3.org/2000/svg">
1558
1595
  <rect width="91" height="71" rx="4" fill="#F2F4F7"/>
1559
1596
  <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 +1599,7 @@ const D = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBo
1562
1599
  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 12 12" fill="none">
1563
1600
  <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
1601
  </svg>
1565
- `, q = `
1602
+ `, Z = `
1566
1603
  <svg xmlns="http://www.w3.org/2000/svg" width="29" height="29" viewBox="0 0 29 29" fill="none">
1567
1604
  <!-- Top dot -->
1568
1605
  <circle cx="14.5" cy="3" r="1.5" fill="#02CC59" opacity="1"/>
@@ -1582,7 +1619,7 @@ const D = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBo
1582
1619
  <circle cx="6.7" cy="6.7" r="1.5" fill="#02CC59" opacity="0.3"/>
1583
1620
  </svg>
1584
1621
  `;
1585
- class Z extends g {
1622
+ class K extends g {
1586
1623
  constructor(t = {}) {
1587
1624
  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
1625
  }
@@ -1632,18 +1669,18 @@ class Z extends g {
1632
1669
  );
1633
1670
  if (t && t !== "") {
1634
1671
  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>
1672
+ <span class="upload-icon">${V}</span>
1636
1673
  <span class="upload-label">Replace</span>
1637
1674
  `);
1638
1675
  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);
1676
+ this.hideLoading(), this.previewWrapper.classList.add("has-image"), this.previewEl.style.display = "block", this.previewEl.removeEventListener("load", n), this.previewEl.removeEventListener("error", a);
1677
+ }, a = () => {
1678
+ 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
1679
  };
1643
- this.previewEl.addEventListener("load", n), this.previewEl.addEventListener("error", o), this.previewEl.src = t;
1680
+ this.previewEl.addEventListener("load", n), this.previewEl.addEventListener("error", a), this.previewEl.src = t;
1644
1681
  } else
1645
1682
  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>
1683
+ <span class="upload-icon">${V}</span>
1647
1684
  <span class="upload-label">Upload</span>
1648
1685
  `);
1649
1686
  }
@@ -1651,24 +1688,24 @@ class Z extends g {
1651
1688
  const t = document.createElement("div");
1652
1689
  t.className = "upload-setting-wrapper", t.setAttribute("data-setting-id", this.id), t.addEventListener(
1653
1690
  "focusout",
1654
- (a) => {
1691
+ (o) => {
1655
1692
  var l;
1656
- a.relatedTarget && t.contains(a.relatedTarget) || (l = this.onBlur) == null || l.call(this, this.value ?? "");
1693
+ o.relatedTarget && t.contains(o.relatedTarget) || (l = this.onBlur) == null || l.call(this, this.value ?? "");
1657
1694
  },
1658
1695
  !0
1659
1696
  );
1660
1697
  const e = !!(this.props.title || this.props.icon);
1661
1698
  if (e || t.classList.add("no-label"), e) {
1662
- const a = document.createElement("div");
1663
- if (a.className = "icon-title-container", this.props.icon) {
1699
+ const o = document.createElement("div");
1700
+ if (o.className = "icon-title-container", this.props.icon) {
1664
1701
  const l = this.createIcon(this.props.icon);
1665
- a.appendChild(l);
1702
+ o.appendChild(l);
1666
1703
  }
1667
1704
  if (this.props.title) {
1668
1705
  const l = this.createLabel(this.props.title);
1669
- a.appendChild(l);
1706
+ o.appendChild(l);
1670
1707
  }
1671
- t.appendChild(a);
1708
+ t.appendChild(o);
1672
1709
  }
1673
1710
  this.errorContainer = document.createElement("div"), this.errorContainer.className = "error-message", this.errorContainer.style.display = "none", t.appendChild(this.errorContainer);
1674
1711
  const i = document.createElement("div");
@@ -1676,19 +1713,19 @@ class Z extends g {
1676
1713
  const s = this.value && this.value !== "";
1677
1714
  s || i.classList.add("no-image");
1678
1715
  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();
1716
+ 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) {
1717
+ const o = document.createElement("button");
1718
+ o.className = "delete-button", o.type = "button", o.title = "Delete image", o.innerHTML = _, this.previewWrapper.appendChild(o), o.onclick = (l) => {
1719
+ var r;
1720
+ l.stopPropagation(), this.value = "", this.updatePreviewState(null), (r = this.onChange) == null || r.call(this, ""), this.hideError();
1684
1721
  };
1685
1722
  }
1686
1723
  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>
1724
+ const a = document.createElement("button");
1725
+ return a.className = "upload-button", a.innerHTML = `
1726
+ <span class="upload-icon">${V}</span>
1690
1727
  <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 = () => {
1728
+ `, i.appendChild(n), i.appendChild(this.previewWrapper), i.appendChild(a), t.appendChild(i), s ? this.updatePreviewState(this.value) : this.updatePreviewState(null), a.onclick = () => {
1692
1729
  window.postMessage(
1693
1730
  {
1694
1731
  type: "OPEN_FILE_MANAGER_MODAL",
@@ -1699,14 +1736,14 @@ class Z extends g {
1699
1736
  }, t;
1700
1737
  }
1701
1738
  }
1702
- class Ct extends v {
1739
+ class wt extends C {
1703
1740
  constructor(t = {}) {
1704
1741
  super({
1705
1742
  ...t,
1706
1743
  title: t.title || "Height",
1707
1744
  suffix: t.suffix || "px",
1708
1745
  minValue: t.minValue ?? 0,
1709
- icon: t.icon || K,
1746
+ icon: t.icon || X,
1710
1747
  default: t.default ?? 100
1711
1748
  }), this.inputType = "number", this.mobileValue = t.mobile;
1712
1749
  }
@@ -1717,17 +1754,17 @@ class Ct extends v {
1717
1754
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1718
1755
  }
1719
1756
  }
1720
- const K = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1757
+ const X = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1721
1758
  <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
1759
  </svg>`;
1723
- class wt extends v {
1760
+ class Et extends C {
1724
1761
  constructor(t = {}) {
1725
1762
  super({
1726
1763
  ...t,
1727
1764
  title: t.title || "Width",
1728
1765
  suffix: t.suffix || "px",
1729
1766
  minValue: t.minValue ?? 0,
1730
- icon: t.icon || X,
1767
+ icon: t.icon || Q,
1731
1768
  default: t.default ?? 100
1732
1769
  }), this.inputType = "number", this.mobileValue = t.mobile;
1733
1770
  }
@@ -1738,14 +1775,14 @@ class wt extends v {
1738
1775
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1739
1776
  }
1740
1777
  }
1741
- const X = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1778
+ const Q = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1742
1779
  <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 = `
1780
+ </svg>`, Y = `
1744
1781
  <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
1782
  <polyline points="6 9 12 15 18 9"></polyline>
1746
1783
  </svg>
1747
1784
  `;
1748
- class Et extends g {
1785
+ class bt extends g {
1749
1786
  constructor(t = {}) {
1750
1787
  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
1788
  const e = this._options.findIndex(
@@ -1772,46 +1809,46 @@ class Et extends g {
1772
1809
  e.classList.add("has-label");
1773
1810
  const n = document.createElement("div");
1774
1811
  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...";
1812
+ const a = document.createElement("span");
1813
+ if (a.className = "select-value", this.isLoading)
1814
+ a.textContent = this.props.loadingText || "Loading options...";
1778
1815
  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;
1816
+ 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";
1817
+ a.textContent = l;
1781
1818
  }
1782
- e.appendChild(o);
1819
+ e.appendChild(a);
1783
1820
  } else {
1784
1821
  const n = document.createElement("span");
1785
1822
  if (this.isLoading)
1786
1823
  n.textContent = this.props.loadingText || "Loading options...";
1787
1824
  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;
1825
+ 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";
1826
+ n.textContent = o;
1790
1827
  }
1791
1828
  e.appendChild(n);
1792
1829
  }
1793
1830
  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));
1831
+ var n, a;
1832
+ 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
1833
  }, t.appendChild(e), this.buttonEl = e;
1797
1834
  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);
1835
+ i.classList.add("select-api-options"), this._options.forEach((n, a) => {
1836
+ const o = this.createOption(n, a);
1837
+ o.onclick = (l) => this.selectApiOption(l, a, e), i.appendChild(o);
1801
1838
  }), t.appendChild(i);
1802
1839
  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));
1840
+ return s.classList.add("svg-container"), s.innerHTML = Y, t.appendChild(s), s.onclick = () => {
1841
+ var n, a;
1842
+ 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
1843
  }, 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(
1844
+ const a = new Set(
1808
1845
  this._options.map((l) => JSON.stringify(l.value))
1809
- ), a = n.filter(
1810
- (l) => !o.has(JSON.stringify(l.value))
1846
+ ), o = n.filter(
1847
+ (l) => !a.has(JSON.stringify(l.value))
1811
1848
  );
1812
- if (this._options.push(...a), this.isLoading = !1, this.hasInitializedOptions = !0, this.value !== void 0) {
1849
+ if (this._options.push(...o), this.isLoading = !1, this.hasInitializedOptions = !0, this.value !== void 0) {
1813
1850
  const l = this._options.findIndex(
1814
- (c) => JSON.stringify(c.value) === JSON.stringify(this.value)
1851
+ (r) => JSON.stringify(r.value) === JSON.stringify(this.value)
1815
1852
  );
1816
1853
  this.selectedOptionIndex = l !== -1 ? l : null;
1817
1854
  } else
@@ -1823,14 +1860,14 @@ class Et extends g {
1823
1860
  !0
1824
1861
  );
1825
1862
  })) : this.props.getOptionsAsync && this._options.length <= 1 && (this.isLoading = !0, this.updateButtonText(), this.props.getOptionsAsync().then((n) => {
1826
- const o = new Set(
1863
+ const a = new Set(
1827
1864
  this._options.map((l) => JSON.stringify(l.value))
1828
- ), a = n.filter(
1829
- (l) => !o.has(JSON.stringify(l.value))
1865
+ ), o = n.filter(
1866
+ (l) => !a.has(JSON.stringify(l.value))
1830
1867
  );
1831
- if (this._options.push(...a), this.isLoading = !1, this.value !== void 0) {
1868
+ if (this._options.push(...o), this.isLoading = !1, this.value !== void 0) {
1832
1869
  const l = this._options.findIndex(
1833
- (c) => JSON.stringify(c.value) === JSON.stringify(this.value)
1870
+ (r) => JSON.stringify(r.value) === JSON.stringify(this.value)
1834
1871
  );
1835
1872
  this.selectedOptionIndex = l !== -1 ? l : null;
1836
1873
  } else
@@ -1847,19 +1884,19 @@ class Et extends g {
1847
1884
  return JSON.stringify(t ? {} : { value: this.value }, null, 2);
1848
1885
  }
1849
1886
  selectApiOption(t, e, i) {
1850
- var l, c, r, d;
1887
+ var l, r, d, c;
1851
1888
  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
1889
  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;
1890
+ const a = this._options[e].value;
1891
+ this.value = a;
1892
+ const o = i.querySelector(".select-value");
1893
+ if (o)
1894
+ o.textContent = this._options[e].name;
1858
1895
  else {
1859
1896
  const u = i.firstChild;
1860
1897
  u && u.tagName === "SPAN" && (u.textContent = this._options[e].name);
1861
1898
  }
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);
1899
+ 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
1900
  }
1864
1901
  updateOptionsList() {
1865
1902
  !this.optionsListEl || !this.buttonEl || (this.optionsListEl.innerHTML = "", this._options.forEach((t, e) => {
@@ -1892,13 +1929,13 @@ class Et extends g {
1892
1929
  ), this.updateButtonText();
1893
1930
  }
1894
1931
  }
1895
- class bt extends g {
1932
+ class xt extends g {
1896
1933
  constructor(t) {
1897
1934
  var e, i;
1898
1935
  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
1936
  }
1900
1937
  draw() {
1901
- var o, a;
1938
+ var a, o;
1902
1939
  const t = document.createElement("div");
1903
1940
  t.className = "toggle-setting-container", this.props.icon && t.classList.add("toggle-with-icon");
1904
1941
  const e = document.createElement("div");
@@ -1914,20 +1951,20 @@ class bt extends g {
1914
1951
  const i = document.createElement("label");
1915
1952
  i.className = "toggle-switch";
1916
1953
  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) ?? "";
1954
+ 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", () => {
1955
+ var r, d;
1956
+ const l = ((d = (r = this.props.options) == null ? void 0 : r.find((c) => c.status === s.checked)) == null ? void 0 : d.value) ?? "";
1920
1957
  this.value = l, this.onChange && this.onChange(this.value), this.detectChangeCallback && this.detectChangeCallback(this.value);
1921
1958
  });
1922
1959
  const n = document.createElement("span");
1923
1960
  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";
1961
+ const l = document.createElement("style"), r = this.props.activeColor || "#4CAF50", d = this.props.inactiveColor || "#ccc";
1925
1962
  l.textContent = `
1926
1963
  .toggle-switch input:checked + .toggle-slider {
1927
- background-color: ${c};
1964
+ background-color: ${r};
1928
1965
  }
1929
1966
  .toggle-switch .toggle-slider {
1930
- background-color: ${r};
1967
+ background-color: ${d};
1931
1968
  }
1932
1969
  `, document.head.appendChild(l);
1933
1970
  }
@@ -1937,13 +1974,13 @@ class bt extends g {
1937
1974
  this.detectChangeCallback = t;
1938
1975
  }
1939
1976
  }
1940
- const Y = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
1977
+ const tt = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
1941
1978
  <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
1979
  </svg>`;
1943
- class xt extends g {
1980
+ class yt extends g {
1944
1981
  // Store mobile value
1945
1982
  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);
1983
+ 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
1984
  }
1948
1985
  draw() {
1949
1986
  const t = document.createElement("div");
@@ -1954,27 +1991,27 @@ class xt extends g {
1954
1991
  i.className = "setting-label", i.setAttribute("for", this.id + "-input");
1955
1992
  const s = document.createElement("span");
1956
1993
  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);
1994
+ const o = document.createElement("span");
1995
+ o.className = "setting-icon", o.innerHTML = this.props.icon, i.insertBefore(o, s);
1959
1996
  }
1960
1997
  const n = document.createElement("div");
1961
1998
  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;
1999
+ const a = document.createElement("div");
2000
+ 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
2001
  }
1965
2002
  createGapInput(t, e) {
1966
2003
  const i = document.createElement("div");
1967
2004
  i.className = "gap-input-wrapper";
1968
2005
  const s = document.createElement("input");
1969
2006
  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);
2007
+ const a = n.target;
2008
+ let o = parseFloat(a.value);
2009
+ o = this.validateValue(o), String(o) !== a.value && (a.value = String(o)), this.inputValues[t] = o, this.setValue(o);
1973
2010
  }), 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);
2011
+ var l, r;
2012
+ const a = n.target;
2013
+ let o = parseFloat(a.value);
2014
+ 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
2015
  }), i.appendChild(s), this.props.suffix && this.props.suffix !== "none") {
1979
2016
  const n = document.createElement("span");
1980
2017
  n.className = "gap-suffix", n.textContent = this.props.suffix, i.appendChild(n), s.style.paddingRight = "30px";
@@ -1994,53 +2031,53 @@ class xt extends g {
1994
2031
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1995
2032
  }
1996
2033
  }
1997
- const tt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2034
+ const et = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1998
2035
  <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
2036
  </svg>`;
2000
- class Lt extends v {
2037
+ class Lt extends C {
2001
2038
  constructor(t = {}) {
2002
2039
  super({
2003
2040
  ...t,
2004
2041
  minValue: t.minValue ?? 0,
2005
2042
  maxValue: t.maxValue ?? 1e3,
2006
- icon: t.icon || tt,
2043
+ icon: t.icon || et,
2007
2044
  title: t.title || "Margin Bottom",
2008
2045
  default: t.default ?? 20,
2009
2046
  wrapperClassName: "margin-bottom-wrapper " + (t.wrapperClassName || "")
2010
2047
  }), this.inputType = "number";
2011
2048
  }
2012
2049
  }
2013
- const et = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2050
+ const it = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2014
2051
  <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
2052
  stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
2016
2053
  </svg>`;
2017
- class yt extends v {
2054
+ class kt extends C {
2018
2055
  constructor(t = {}) {
2019
2056
  super({
2020
2057
  ...t,
2021
2058
  minValue: t.minValue ?? 0,
2022
2059
  maxValue: t.maxValue ?? 1e3,
2023
- icon: t.icon || et,
2060
+ icon: t.icon || it,
2024
2061
  title: t.title || "Margin Top",
2025
2062
  default: t.default ?? 20,
2026
2063
  wrapperClassName: "margin-top-wrapper " + (t.wrapperClassName || "")
2027
2064
  }), this.inputType = "number";
2028
2065
  }
2029
2066
  }
2030
- const it = `
2067
+ const st = `
2031
2068
  <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
2069
  <polyline points="3,6 5,6 21,6"></polyline>
2033
2070
  <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
2071
  <line x1="10" y1="11" x2="10" y2="17"></line>
2035
2072
  <line x1="14" y1="11" x2="14" y2="17"></line>
2036
2073
  </svg>
2037
- `, st = `
2074
+ `, nt = `
2038
2075
  <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
2076
  <line x1="12" y1="5" x2="12" y2="19"></line>
2040
2077
  <line x1="5" y1="12" x2="19" y2="12"></line>
2041
2078
  </svg>
2042
2079
  `;
2043
- class kt extends g {
2080
+ class Mt extends g {
2044
2081
  constructor(t = {}) {
2045
2082
  super(t), this.inputType = {}, this.container = null, this.languagesContainer = null, this.addLanguageSelect = null, this.addButton = null, this.defaultLanguages = [
2046
2083
  { code: "en", name: "English" },
@@ -2082,15 +2119,15 @@ class kt extends g {
2082
2119
  s.classList.add("language-label"), s.textContent = t.toUpperCase();
2083
2120
  const n = document.createElement("div");
2084
2121
  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);
2122
+ const a = document.createElement("input");
2123
+ a.type = "text", a.classList.add("language-input"), a.value = e || "", a.placeholder = this.props.placeholder || "Enter text...", a.addEventListener("input", (l) => {
2124
+ const r = l.target;
2125
+ this.updateLanguageValue(t, r.value);
2089
2126
  });
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", () => {
2127
+ const o = document.createElement("button");
2128
+ return o.type = "button", o.classList.add("delete-language-btn"), o.innerHTML = st, o.title = `Delete ${t.toUpperCase()}`, o.addEventListener("click", () => {
2092
2129
  this.removeLanguage(t);
2093
- }), n.appendChild(o), n.appendChild(a), i.appendChild(s), i.appendChild(n), i;
2130
+ }), n.appendChild(a), n.appendChild(o), i.appendChild(s), i.appendChild(n), i;
2094
2131
  }
2095
2132
  updateLanguageValue(t, e) {
2096
2133
  this.value || (this.value = {}), this.value[t] = e, this.onChange && this.onChange(this.value), this.props.detectChange && this.props.detectChange(this.value);
@@ -2121,9 +2158,9 @@ class kt extends g {
2121
2158
  const s = document.createElement("select");
2122
2159
  s.classList.add("add-language-select"), this.addLanguageSelect = s;
2123
2160
  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);
2161
+ return n.type = "button", n.classList.add("add-language-btn"), n.innerHTML = `${nt} Add`, this.addButton = n, n.addEventListener("click", () => {
2162
+ const a = s.value;
2163
+ a && this.addLanguage(a);
2127
2164
  }), i.appendChild(s), i.appendChild(n), t.appendChild(e), t.appendChild(i), t;
2128
2165
  }
2129
2166
  draw() {
@@ -2135,9 +2172,9 @@ class kt extends g {
2135
2172
  const e = document.createElement("div");
2136
2173
  e.classList.add("multi-language-content");
2137
2174
  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);
2175
+ i.classList.add("languages-container"), this.languagesContainer = i, this.value && Object.entries(this.value).forEach(([n, a]) => {
2176
+ const o = this.createLanguageRow(n, a);
2177
+ i.appendChild(o);
2141
2178
  }), e.appendChild(i);
2142
2179
  const s = this.createAddLanguageSection();
2143
2180
  return e.appendChild(s), t.appendChild(e), this.updateAddLanguageSelect(), this.container = t, t;
@@ -2149,7 +2186,7 @@ class kt extends g {
2149
2186
  }), this.updateAddLanguageSelect());
2150
2187
  }
2151
2188
  }
2152
- class Mt extends g {
2189
+ class Vt extends g {
2153
2190
  constructor(t = {}) {
2154
2191
  super(t), this.inputType = "select";
2155
2192
  const e = [
@@ -2160,7 +2197,7 @@ class Mt extends g {
2160
2197
  { name: "Bounce", value: "bounce 1.5s ease-in-out infinite" },
2161
2198
  { name: "Pulse", value: "pulse 1.5s ease-in-out infinite" }
2162
2199
  ];
2163
- this.selectSetting = new M({
2200
+ this.selectSetting = new N({
2164
2201
  title: this.title || "Animation",
2165
2202
  options: e,
2166
2203
  default: this.props.default || "none"
@@ -2176,34 +2213,34 @@ class Mt extends g {
2176
2213
  this.selectSetting.destroy(), super.destroy();
2177
2214
  }
2178
2215
  }
2179
- const nt = `
2216
+ const ot = `
2180
2217
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2181
2218
  <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
2219
  </svg>
2183
- `, ot = `
2220
+ `, at = `
2184
2221
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2185
2222
  <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
2223
  </svg>
2187
2224
  `;
2188
- class Vt extends f {
2225
+ class It extends v {
2189
2226
  constructor(t) {
2190
2227
  super({
2191
2228
  title: "Border",
2192
2229
  collapsed: t == null ? void 0 : t.collapsed,
2193
2230
  hideCondition: t == null ? void 0 : t.hideCondition,
2194
2231
  settings: {
2195
- size: new v({
2232
+ size: new C({
2196
2233
  title: "Size",
2197
- icon: ot,
2234
+ icon: at,
2198
2235
  default: (t == null ? void 0 : t.size) ?? 0,
2199
2236
  suffix: "px"
2200
2237
  }),
2201
- color: new C({
2238
+ color: new w({
2202
2239
  default: (t == null ? void 0 : t.color) ?? "0, 0, 30"
2203
2240
  }),
2204
- radius: new v({
2241
+ radius: new C({
2205
2242
  title: "Radius",
2206
- icon: nt,
2243
+ icon: ot,
2207
2244
  default: (t == null ? void 0 : t.radius) ?? 12,
2208
2245
  suffix: "px"
2209
2246
  })
@@ -2222,20 +2259,20 @@ class Vt extends f {
2222
2259
  `;
2223
2260
  }
2224
2261
  }
2225
- const at = `
2262
+ const lt = `
2226
2263
  <svg xmlns="http://www.w3.org/2000/svg" width="14" height="13" viewBox="0 0 14 13" fill="none">
2227
2264
  <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
2265
  </svg>
2229
- `, lt = `
2266
+ `, rt = `
2230
2267
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2231
2268
  <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
2269
  </svg>
2233
- `, rt = `
2270
+ `, ct = `
2234
2271
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2235
2272
  <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
2273
  </svg>
2237
2274
  `;
2238
- class Nt extends f {
2275
+ class Nt extends v {
2239
2276
  constructor(t = {}) {
2240
2277
  const { showAlign: e = t.showAlign ?? !0, ...i } = t;
2241
2278
  super({
@@ -2244,12 +2281,12 @@ class Nt extends f {
2244
2281
  hideCondition: i.hideCondition,
2245
2282
  settings: (() => {
2246
2283
  const s = {
2247
- color: new C({
2284
+ color: new w({
2248
2285
  default: i.colorDefault ?? "0, 0, 30"
2249
2286
  }),
2250
- fontFamily: new M({
2287
+ fontFamily: new N({
2251
2288
  title: "Font",
2252
- icon: at,
2289
+ icon: lt,
2253
2290
  default: i.fontFamilyDefault ?? "Satoshi",
2254
2291
  options: i.fontFamilyOptions ?? [
2255
2292
  { name: "Alt", value: "Croco Sans Black Caps Alt" },
@@ -2260,9 +2297,9 @@ class Nt extends f {
2260
2297
  getOptions: i.fontFamilyGetOptions,
2261
2298
  getOptionsAsync: i.fontFamilyGetOptionsAsync
2262
2299
  }),
2263
- fontWeight: new M({
2300
+ fontWeight: new N({
2264
2301
  title: "Weight",
2265
- icon: lt,
2302
+ icon: rt,
2266
2303
  default: i.fontWeightDefault ?? "400",
2267
2304
  options: i.fontWeightOptions ?? [
2268
2305
  { name: "Regular", value: "400" },
@@ -2272,9 +2309,9 @@ class Nt extends f {
2272
2309
  getOptions: i.fontWeightGetOptions,
2273
2310
  getOptionsAsync: i.fontWeightGetOptionsAsync
2274
2311
  }),
2275
- fontSize: new v({
2312
+ fontSize: new C({
2276
2313
  title: "Size",
2277
- icon: rt,
2314
+ icon: ct,
2278
2315
  default: i.fontSizeDefault ?? 12,
2279
2316
  suffix: "px",
2280
2317
  mobile: i.fontSizeMobileDefault
@@ -2291,8 +2328,8 @@ class Nt extends f {
2291
2328
  });
2292
2329
  }
2293
2330
  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";
2331
+ var a;
2332
+ 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
2333
  return `
2297
2334
  color: ${t};
2298
2335
  font-family: ${e};
@@ -2302,7 +2339,7 @@ class Nt extends f {
2302
2339
  `;
2303
2340
  }
2304
2341
  }
2305
- class E extends g {
2342
+ class y extends g {
2306
2343
  constructor(t) {
2307
2344
  super({
2308
2345
  ...t,
@@ -2310,11 +2347,11 @@ class E extends g {
2310
2347
  }), this.inputType = "number", this.value = t.default !== void 0 ? t.default : "auto";
2311
2348
  }
2312
2349
  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);
2350
+ const t = this.value === "auto" ? "text" : "number", e = (o) => {
2351
+ 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", () => {
2352
+ const l = this.props.minValue ?? Number.MIN_SAFE_INTEGER, r = this.props.maxValue ?? Number.MAX_SAFE_INTEGER;
2353
+ let d = Number(o.value);
2354
+ d < l && (d = l), d > r && (d = r), o.value = String(d);
2318
2355
  }));
2319
2356
  }, i = this.createInput({
2320
2357
  value: this.value,
@@ -2335,47 +2372,47 @@ class E extends g {
2335
2372
  s && (s.style.paddingRight = "35px");
2336
2373
  const n = document.createElement("span");
2337
2374
  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();
2375
+ const a = i.querySelector("input");
2376
+ return a && (a.oninput = (o) => {
2377
+ const l = o.target.value.trim();
2341
2378
  if (l.toLowerCase() === "auto")
2342
2379
  this.value = "auto";
2343
2380
  else {
2344
- const c = Number(l);
2345
- isNaN(c) || (this.value = c);
2381
+ const r = Number(l);
2382
+ isNaN(r) || (this.value = r);
2346
2383
  }
2347
2384
  this.onChange && this.onChange(this.value);
2348
2385
  }), i;
2349
2386
  }
2350
2387
  }
2351
- class It extends f {
2388
+ class St extends v {
2352
2389
  constructor(t) {
2353
2390
  super({
2354
2391
  title: "Margins",
2355
2392
  collapsed: t == null ? void 0 : t.collapsed,
2356
2393
  hideCondition: t == null ? void 0 : t.hideCondition,
2357
2394
  settings: {
2358
- marginTop: new E({
2395
+ marginTop: new y({
2359
2396
  title: "Top",
2360
- icon: ct,
2397
+ icon: ht,
2361
2398
  suffix: "px",
2362
2399
  default: (t == null ? void 0 : t.marginTop) ?? "auto"
2363
2400
  }),
2364
- marginRight: new E({
2401
+ marginRight: new y({
2365
2402
  title: "Right",
2366
- icon: ht,
2403
+ icon: dt,
2367
2404
  suffix: "px",
2368
2405
  default: (t == null ? void 0 : t.marginRight) ?? 0
2369
2406
  }),
2370
- marginBottom: new E({
2407
+ marginBottom: new y({
2371
2408
  title: "Bottom",
2372
- icon: dt,
2409
+ icon: ut,
2373
2410
  suffix: "px",
2374
2411
  default: (t == null ? void 0 : t.marginBottom) ?? 0
2375
2412
  }),
2376
- marginLeft: new E({
2413
+ marginLeft: new y({
2377
2414
  title: "Left",
2378
- icon: ut,
2415
+ icon: pt,
2379
2416
  suffix: "px",
2380
2417
  default: (t == null ? void 0 : t.marginLeft) ?? 0
2381
2418
  })
@@ -2392,16 +2429,16 @@ class It extends f {
2392
2429
  `;
2393
2430
  }
2394
2431
  }
2395
- const ct = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2432
+ const ht = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2396
2433
  <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
2434
  </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"/>
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.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
2436
  </svg>`, ut = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2437
+ <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"/>
2438
+ </svg>`, pt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2402
2439
  <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
2440
  </svg>`;
2404
- class St extends f {
2441
+ class Ot extends v {
2405
2442
  /**
2406
2443
  * Constructs a new BackgroundSettingSet.
2407
2444
  *
@@ -2431,14 +2468,14 @@ class St extends f {
2431
2468
  collapsed: t == null ? void 0 : t.collapsed,
2432
2469
  hideCondition: t == null ? void 0 : t.hideCondition,
2433
2470
  settings: {
2434
- backgroundImage: new Z({
2471
+ backgroundImage: new K({
2435
2472
  ...t == null ? void 0 : t.uploadProps,
2436
2473
  default: (t == null ? void 0 : t.backgroundImage) ?? ""
2437
2474
  }),
2438
- opacity: new P({
2475
+ opacity: new G({
2439
2476
  default: (t == null ? void 0 : t.opacity) ?? 100
2440
2477
  }),
2441
- backgroundColor: new C({
2478
+ backgroundColor: new w({
2442
2479
  default: (t == null ? void 0 : t.backgroundColor) ?? "0, 0, 30"
2443
2480
  })
2444
2481
  }
@@ -2450,10 +2487,10 @@ class St extends f {
2450
2487
  draw() {
2451
2488
  const t = super.draw(), e = t.querySelector(".setting-group-content");
2452
2489
  if (!e) return t;
2453
- const i = Array.from(e.children), [s, n, o] = i;
2490
+ const i = Array.from(e.children), [s, n, a] = i;
2454
2491
  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;
2492
+ const o = document.createElement("div");
2493
+ return o.className = "bgset-or-label", o.textContent = "OR", e.appendChild(o), e.appendChild(a), t;
2457
2494
  }
2458
2495
  /**
2459
2496
  * Helper method to generate CSS based on the current settings.
@@ -2470,44 +2507,44 @@ class St extends f {
2470
2507
  `;
2471
2508
  }
2472
2509
  }
2473
- function Ot(h) {
2474
- return h instanceof f;
2475
- }
2476
2510
  function Ht(h) {
2511
+ return h instanceof v;
2512
+ }
2513
+ function Tt(h) {
2477
2514
  return h instanceof g;
2478
2515
  }
2479
2516
  export {
2480
2517
  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,
2518
+ Vt as AnimationSetting,
2519
+ Ot as BackgroundSettingSet,
2520
+ It as BorderSettingSet,
2521
+ vt as ButtonSetting,
2522
+ f as ColorSetting,
2523
+ w as ColorWithOpacitySetting,
2524
+ Ct as DimensionSetting,
2525
+ yt as GapSetting,
2489
2526
  Nt as HeaderTypographySettingSet,
2490
- Ct as HeightSetting,
2491
- mt as HtmlSetting,
2527
+ wt as HeightSetting,
2528
+ ft as HtmlSetting,
2492
2529
  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,
2530
+ St as MarginSettingGroup,
2531
+ kt as MarginTopSetting,
2532
+ Mt as MultiLanguageSetting,
2533
+ C as NumberSetting,
2534
+ G as OpacitySetting,
2535
+ bt as SelectApiSettings,
2536
+ N as SelectSetting,
2500
2537
  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
2538
+ v as SettingGroup,
2539
+ F as StringSetting,
2540
+ gt as TabSettingGroup,
2541
+ gt as TabsSettingGroup,
2542
+ xt as Toggle,
2543
+ K as UploadSetting,
2544
+ Et as WidthSetting,
2545
+ mt as asSettingGroupWithSettings,
2546
+ $ as createSettingGroup,
2547
+ Tt as isSetting,
2548
+ Ht as isSettingGroup,
2549
+ x as iterateSettings
2513
2550
  };