builder-settings-types 0.0.250 → 0.0.252

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.
@@ -3,7 +3,7 @@ import { SettingsMap, SettingChild, ExtractSettingValues, ExtractSettingValuesOp
3
3
  export type AddItemConfig = {
4
4
  buttonLabel?: string;
5
5
  keyPrefix: string;
6
- createItem: (index: number) => SettingChild;
6
+ createItem: (index: number) => unknown;
7
7
  };
8
8
  export type DeleteItemConfig = {
9
9
  keyPrefix?: string;
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";let P=(c=21)=>{let t="",e=crypto.getRandomValues(new Uint8Array(c|=0));for(;c--;)t+=R[e[c]&63];return t};function z(c){let t=0,e=c.parentElement;for(;e;)e.classList.contains("setting-group")&&e!==c&&t++,e=e.parentElement;return t}function L(c,t){const e=Math.min(Math.max(t,0),5);c.setAttribute("data-nesting-level",e.toString()),e>0?c.style.setProperty("--visual-indent",`${e*2}px`):(c.style.removeProperty("--visual-indent"),c.style.marginLeft="")}function N(c,t=0){c.querySelectorAll(":scope > .setting-group-content > .setting-group").forEach(i=>{const s=i,n=t+1;L(s,n),N(s,n)})}const W={maxLevel:5,spacingMultiplier:1,visualIndentMultiplier:2,enableAutoDetection:!0};class G{constructor(t={}){this.observedElements=new Set,this.config={...W,...t},this.config.enableAutoDetection&&this.setupAutoDetection()}setupAutoDetection(){this.observer=new MutationObserver(t=>{let e=!1;t.forEach(i=>{i.type==="childList"&&i.addedNodes.forEach(s=>{s instanceof HTMLElement&&(s.classList.contains("setting-group")?[s]:Array.from(s.querySelectorAll(".setting-group"))).length>0&&(e=!0)})}),e&&this.updateAllNesting()}),this.observer.observe(document.body,{childList:!0,subtree:!0})}trackElement(t){this.observedElements.add(t),this.updateElementNesting(t)}untrackElement(t){this.observedElements.delete(t)}updateElementNesting(t){const e=z(t);this.applyNestingWithConfig(t,e)}updateAllNesting(){this.observedElements.forEach(t=>{t.isConnected?this.updateElementNesting(t):this.observedElements.delete(t)})}applyNestingWithConfig(t,e){const i=Math.min(Math.max(e,0),this.config.maxLevel);if(t.setAttribute("data-nesting-level",i.toString()),i>0){const s=i*this.config.visualIndentMultiplier;t.style.setProperty("--visual-indent",`${s}px`)}else t.style.removeProperty("--visual-indent"),t.style.marginLeft=""}recalculateNesting(t=document.body){t.querySelectorAll(".setting-group").forEach(i=>{const s=i;this.updateElementNesting(s),this.trackElement(s)})}getNestingStats(){const t={};return this.observedElements.forEach(e=>{const i=parseInt(e.getAttribute("data-nesting-level")||"0",10);t[i]=(t[i]||0)+1}),t}destroy(){this.observer&&(this.observer.disconnect(),this.observer=void 0),this.observedElements.clear()}}const T=new G;function k(c){if(c===null||typeof c!="object")return c;if(c instanceof Date)return new Date(c.getTime());if(c instanceof Array)return c.map(t=>k(t));if(typeof c=="object"){const t={};for(const e in c)Object.prototype.hasOwnProperty.call(c,e)&&(t[e]=k(c[e]));return t}return c}function _(c){switch(c){case"number":return 0;case"text":return"";case"select":return null;case"color":return"#000000";case"date":return new Date().toISOString().split("T")[0];case"button":return"";default:return""}}class p{constructor(t={}){this.props=t,this.dataPropsPath="",this.id=t.id||P(),this.value=this.props.default,this.desktop=this.props.default,this.title=t.title||"",this.includeGetJson=t.includeGetJson!==void 0?t.includeGetJson:!0}static SetUploadUrl(t){globalThis.DefaultUploadUrl=t,p.DefaultUploadUrl=t}static SetDefaultLanguage(t){globalThis.DefaultLanguage=t,p.DefaultLanguage=t}destroy(){throw new Error("Method not implemented.")}setOnChange(t){return this.onChange=t,this}setOnBlur(t){return this.onBlur=t,this}setDataPropsPath(t){this.dataPropsPath=t}getDataPropsPath(){return this.dataPropsPath}setValue(t){this.value=t,this.inputEl&&(this.inputEl.value=String(t)),this.onChange&&this.onChange(t),this.props.detectChange&&this.props.detectChange(t)}clone(){const t=this.constructor,e=k(this.props),i=new t(e);return i.value=k(this.value),i}createInput(t){t={...this.props.inputProps,...t};const e=document.createElement("div");if(e.className=t.wrapperClassName||"",t.title||t.icon){const o=document.createElement("div");if(o.className="icon-container",t.icon){const l=this.createIcon(t.icon,t.iconClassName);o.appendChild(l)}if(t.title){const l=this.createLabel(t.title,t.labelClassName);o.appendChild(l)}e.appendChild(o)}const i=document.createElement("div");i.className=t.wrapperClassName||"";const s=document.createElement("input");this.inputEl=s,s.value=String(t.value||_(t.inputType)),s.type=t.inputType,s.placeholder=t.placeholder||"",s.className=t.inputClassName||"",this.dataPropsPath&&s.setAttribute("data-test-id",this.dataPropsPath);const n=o=>{const l=o.target;let r=l.value;switch(t.inputType){case"number":r=Number(l.value);break;case"color":r=l.value;break;case"date":r=l.value;break;case"select":r=l.value;break;case"text":r=l.value;break;case"button":r=l.value;break;default:r=l.value}this.value=r,this.onChange&&this.onChange(this.value),this.props.detectChange&&this.props.detectChange(this.value)},a=o=>{o.target,this.onBlur&&this.onBlur(this.value)};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}createLabel(t,e){const i=document.createElement("span");return i.textContent=t,i.className="input-label "+(e||""),i}createIcon(t,e){const i=document.createElement("span");return i.className="input-icon "+(e||""),i.innerHTML=t,i}}function w(c){return c instanceof p}function g(c){return c instanceof v}function j(c){return w(c)||g(c)}function x(c,t){for(const e in c)if(Object.prototype.hasOwnProperty.call(c,e)){const i=c[e];t(e,i)}}const S=class S{constructor(t){this.elementRef=null,this.isHidden=!1,this.custom=!1,this.initialValues={},this.changeTimeout=null,this.isHandlingChange=!1,this.changeHandlers=new Set,this.blurTimeout=null,this.lastChangeTime=0,this.handleBlur=()=>{},this.pendingBlurHandler=null,this.originalDefaultValues={},this.nestingLevel=0,this.dataPropsPath="",this.id=t.id||P(),this.title=t.title,this.settings=t.settings,this.isCollapsed=t.collapsed??!1,this.isMain=t.main??!1,this.custom=t.custom??!1,this.nestingLevel=0,this.includeGetJson=t.includeGetJson??!0,this.addItemCfg=t.addItem,this.deleteItemCfg=t.deleteItem,this.dataProps=t.dataProps,this.dataPropsPath=t.dataProps||"",Object.assign(this,t.settings),this.initialValues=this.getValues(),this.originalDefaultValues=this.getDefaultValues(),this.propagateNestingLevel(),this.propagateDataPropsPath()}propagateNestingLevel(){const t=this.nestingLevel+1;x(this.settings,(e,i)=>{g(i)&&(i.nestingLevel=t,i.propagateNestingLevel())})}getNestingLevel(){return this.nestingLevel}setNestingLevel(t){this.nestingLevel=t,this.propagateNestingLevel(),this.elementRef&&this.updateNestingStyles()}getDataPropsPath(){return this.dataPropsPath}setDataPropsPath(t){this.dataPropsPath=t,this.propagateDataPropsPath()}propagateDataPropsPath(){x(this.settings,(t,e)=>{const i=String(t),s=this.dataPropsPath?`${this.dataPropsPath}_${i}`:i;(g(e)||w(e)&&typeof e.setDataPropsPath=="function")&&e.setDataPropsPath(s)})}updateNestingStyles(){this.elementRef&&(L(this.elementRef,this.nestingLevel),N(this.elementRef,this.nestingLevel))}forceChildUIRefresh(){Object.entries(this.settings).forEach(([t,e])=>{try{if(g(e)){const i=e.getValues();e.setValue(i)}else if(typeof e.setValue=="function"){const i=e.value;i!==void 0&&e.setValue(i)}}catch(i){console.warn(`Error refreshing UI for setting ${t}:`,i)}})}removeSetting(t){var s;const e=this.settings[t];if(!e)return;if(delete this.settings[t],this.elementRef){const n=this.elementRef.querySelector(".setting-group-content");if(n){const a=Array.from(n.querySelectorAll(".setting-group, .setting"));for(const o of a){const l=o.id;if(l&&"id"in e&&typeof e.id=="string"&&l.includes(e.id)){o.remove();break}}}}typeof e.cleanup=="function"&&e.cleanup(),this.updateNestingStyles();const i=this.getValues();this.initialValues=i,(s=this.onChange)==null||s.call(this,i)}updateVisibility(){this.elementRef}clone(){const t={};x(this.settings,(s,n)=>{const a=String(s);typeof n.clone=="function"?t[a]=n.clone():(console.warn(`Setting with key '${a}' does not have a clone method. Copying reference.`),t[a]=n)});const e={title:this.title,settings:t,collapsed:this.isCollapsed,main:this.isMain,custom:this.custom,includeGetJson:this.includeGetJson,addItem:this.addItemCfg,deleteItem:this.deleteItemCfg,dataProps:this.dataProps},i=A(e);return i.initialValues=this.getValues(),i}resetDefault(){const t=this.originalDefaultValues;this.setValue(t),this.onChange&&this.onChange(this.getValues())}setMobileValues(t){!t||typeof t!="object"||(Object.entries(t).forEach(([e,i])=>{const s=this.settings[e];s&&(g(s)||w(s))&&typeof s.setMobileValue=="function"&&s.setMobileValue(i)}),this.setValue(t),this.onChange&&this.onChange(this.getValues()))}getMobileValues(t){if(t===void 0){const e={};for(const i in this.settings)if(Object.prototype.hasOwnProperty.call(this.settings,i)){const s=this.settings[i];if(g(s))e[i]=s.getMobileValues();else{const n=s;e[i]=n.mobileValue!==void 0?n.mobileValue:n.value}}return e}else{const e=this.settings[t];if(!e)return;if(g(e))return e.getMobileValues();const i=e;return i.mobileValue!==void 0?i.mobileValue:i.value}}setOnChange(t){this.onChange=t;const e=()=>{this.isHandlingChange||(this.isHandlingChange=!0,this.changeTimeout&&clearTimeout(this.changeTimeout),this.changeTimeout=setTimeout(()=>{const i=this.getValues(),s=this.calculateChanges(this.initialValues,i);Object.keys(s).length>0&&(this.lastChangeTime=Date.now(),this.initialValues=i,t(i),this.updateVisibility()),this.isHandlingChange=!1},50))};return this.changeHandlers.clear(),x(this.settings,(i,s)=>{var n;if(g(s))s.setOnChange(()=>{const a=this.getValues();this.initialValues=a,t(a)}),this.changeHandlers.add(()=>t(this.getValues()));else if(w(s)){const a=()=>e();this.changeHandlers.add(a),s.setOnChange(a)}else{const a=()=>e();this.changeHandlers.add(a),(n=s.setOnChange)==null||n.call(s,a)}}),this}cleanup(){this.changeTimeout&&(clearTimeout(this.changeTimeout),this.changeTimeout=null),this.blurTimeout&&(clearTimeout(this.blurTimeout),this.blurTimeout=null),this.elementRef&&this.elementRef.removeEventListener("focusout",this.handleBlur),this.changeHandlers.clear()}setValue(t){if(!t||typeof t!="object")return;Object.entries(t).forEach(([i,s])=>{let n=this.settings[i];if(!n&&this.addItemCfg&&i.startsWith(this.addItemCfg.keyPrefix)){const a=i.slice(this.addItemCfg.keyPrefix.length),o=Number(a);if(Number.isFinite(o)){const l=this.addItemCfg.createItem(o);this.addSetting(i,l),n=l}}n&&(g(n)||w(n))&&typeof n.setValue=="function"&&n.setValue(s)}),setTimeout(()=>{this.forceChildUIRefresh()},0);const e=this.getValues();this.initialValues=e,this.onChange&&this.onChange(e)}wireChild(t){var i;const e=()=>{var n;const s=this.getValues();this.initialValues=s,(n=this.onChange)==null||n.call(this,s),this.updateVisibility()};g(t)?t.setOnChange(()=>e()):w(t)?t.setOnChange(()=>e()):(i=t.setOnChange)==null||i.call(t,()=>e())}addSetting(t,e){var s,n;if(this.settings[t]=e,this.wireChild(e),this.elementRef){const a=this.elementRef.querySelector(".setting-group-content");if(a){g(e)&&typeof e.setNestingLevel=="function"&&e.setNestingLevel(this.nestingLevel+1);const o=e.draw(),l=this.deleteItemCfg??this.addItemCfg;if(l){const d=l.keyPrefix??((s=this.addItemCfg)==null?void 0:s.keyPrefix);d&&t.startsWith(d)&&this.addDeleteButtonToElement(o,t)}const r=a.querySelector(".sg-add-button-bottom");r?a.insertBefore(o,r):a.appendChild(o),T.trackElement(o),L(o,this.nestingLevel+1),N(o,this.nestingLevel+1);const h=o.style.display;o.style.display="none",o.offsetHeight,o.style.display=h,this.updateNestingStyles()}}const i=this.getValues();this.initialValues=i,(n=this.onChange)==null||n.call(this,i)}addDeleteButtonToElement(t,e,i){let s=null;try{s=t.querySelector(":scope > .setting-group-title")}catch{s=null}if(!s){const r=Array.from(t.querySelectorAll(".setting-group-title"));for(const h of r)if(h.closest(".setting-group")===t){s=h;break}s||(s=r[0]??null)}if(!s)return;const n=s.querySelector(".actions-section");if(!n)return;const a=document.createElement("button");a.type="button",a.className="sg-delete-button",i?i.deleteItemCfg:this.deleteItemCfg??this.addItemCfg,a.title="Delete",a.style.cssText=`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const z="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";let A=(c=21)=>{let t="",e=crypto.getRandomValues(new Uint8Array(c|=0));for(;c--;)t+=z[e[c]&63];return t};function W(c){let t=0,e=c.parentElement;for(;e;)e.classList.contains("setting-group")&&e!==c&&t++,e=e.parentElement;return t}function k(c,t){const e=Math.min(Math.max(t,0),5);c.setAttribute("data-nesting-level",e.toString()),e>0?c.style.setProperty("--visual-indent",`${e*2}px`):(c.style.removeProperty("--visual-indent"),c.style.marginLeft="")}function N(c,t=0){c.querySelectorAll(":scope > .setting-group-content > .setting-group").forEach(i=>{const s=i,n=t+1;k(s,n),N(s,n)})}const G={maxLevel:5,spacingMultiplier:1,visualIndentMultiplier:2,enableAutoDetection:!0};class _{constructor(t={}){this.observedElements=new Set,this.config={...G,...t},this.config.enableAutoDetection&&this.setupAutoDetection()}setupAutoDetection(){this.observer=new MutationObserver(t=>{let e=!1;t.forEach(i=>{i.type==="childList"&&i.addedNodes.forEach(s=>{s instanceof HTMLElement&&(s.classList.contains("setting-group")?[s]:Array.from(s.querySelectorAll(".setting-group"))).length>0&&(e=!0)})}),e&&this.updateAllNesting()}),this.observer.observe(document.body,{childList:!0,subtree:!0})}trackElement(t){this.observedElements.add(t),this.updateElementNesting(t)}untrackElement(t){this.observedElements.delete(t)}updateElementNesting(t){const e=W(t);this.applyNestingWithConfig(t,e)}updateAllNesting(){this.observedElements.forEach(t=>{t.isConnected?this.updateElementNesting(t):this.observedElements.delete(t)})}applyNestingWithConfig(t,e){const i=Math.min(Math.max(e,0),this.config.maxLevel);if(t.setAttribute("data-nesting-level",i.toString()),i>0){const s=i*this.config.visualIndentMultiplier;t.style.setProperty("--visual-indent",`${s}px`)}else t.style.removeProperty("--visual-indent"),t.style.marginLeft=""}recalculateNesting(t=document.body){t.querySelectorAll(".setting-group").forEach(i=>{const s=i;this.updateElementNesting(s),this.trackElement(s)})}getNestingStats(){const t={};return this.observedElements.forEach(e=>{const i=parseInt(e.getAttribute("data-nesting-level")||"0",10);t[i]=(t[i]||0)+1}),t}destroy(){this.observer&&(this.observer.disconnect(),this.observer=void 0),this.observedElements.clear()}}const P=new _;function M(c){if(c===null||typeof c!="object")return c;if(c instanceof Date)return new Date(c.getTime());if(c instanceof Array)return c.map(t=>M(t));if(typeof c=="object"){const t={};for(const e in c)Object.prototype.hasOwnProperty.call(c,e)&&(t[e]=M(c[e]));return t}return c}function j(c){switch(c){case"number":return 0;case"text":return"";case"select":return null;case"color":return"#000000";case"date":return new Date().toISOString().split("T")[0];case"button":return"";default:return""}}class p{constructor(t={}){this.props=t,this.dataPropsPath="",this.id=t.id||A(),this.value=this.props.default,this.desktop=this.props.default,this.title=t.title||"",this.includeGetJson=t.includeGetJson!==void 0?t.includeGetJson:!0}static SetUploadUrl(t){globalThis.DefaultUploadUrl=t,p.DefaultUploadUrl=t}static SetDefaultLanguage(t){globalThis.DefaultLanguage=t,p.DefaultLanguage=t}destroy(){throw new Error("Method not implemented.")}setOnChange(t){return this.onChange=t,this}setOnBlur(t){return this.onBlur=t,this}setDataPropsPath(t){this.dataPropsPath=t}getDataPropsPath(){return this.dataPropsPath}setValue(t){this.value=t,this.inputEl&&(this.inputEl.value=String(t)),this.onChange&&this.onChange(t),this.props.detectChange&&this.props.detectChange(t)}clone(){const t=this.constructor,e=M(this.props),i=new t(e);return i.value=M(this.value),i}createInput(t){t={...this.props.inputProps,...t};const e=document.createElement("div");if(e.className=t.wrapperClassName||"",t.title||t.icon){const o=document.createElement("div");if(o.className="icon-container",t.icon){const l=this.createIcon(t.icon,t.iconClassName);o.appendChild(l)}if(t.title){const l=this.createLabel(t.title,t.labelClassName);o.appendChild(l)}e.appendChild(o)}const i=document.createElement("div");i.className=t.wrapperClassName||"";const s=document.createElement("input");this.inputEl=s,s.value=String(t.value||j(t.inputType)),s.type=t.inputType,s.placeholder=t.placeholder||"",s.className=t.inputClassName||"",this.dataPropsPath&&s.setAttribute("data-test-id",this.dataPropsPath);const n=o=>{const l=o.target;let r=l.value;switch(t.inputType){case"number":r=Number(l.value);break;case"color":r=l.value;break;case"date":r=l.value;break;case"select":r=l.value;break;case"text":r=l.value;break;case"button":r=l.value;break;default:r=l.value}this.value=r,this.onChange&&this.onChange(this.value),this.props.detectChange&&this.props.detectChange(this.value)},a=o=>{o.target,this.onBlur&&this.onBlur(this.value)};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}createLabel(t,e){const i=document.createElement("span");return i.textContent=t,i.className="input-label "+(e||""),i}createIcon(t,e){const i=document.createElement("span");return i.className="input-icon "+(e||""),i.innerHTML=t,i}}function w(c){return c instanceof p}function g(c){return c instanceof v}function O(c){return w(c)||g(c)}function x(c,t){for(const e in c)if(Object.prototype.hasOwnProperty.call(c,e)){const i=c[e];t(e,i)}}const V=class V{constructor(t){this.elementRef=null,this.isHidden=!1,this.custom=!1,this.initialValues={},this.changeTimeout=null,this.isHandlingChange=!1,this.changeHandlers=new Set,this.blurTimeout=null,this.lastChangeTime=0,this.handleBlur=()=>{},this.pendingBlurHandler=null,this.originalDefaultValues={},this.nestingLevel=0,this.dataPropsPath="",this.id=t.id||A(),this.title=t.title,this.settings=t.settings,this.isCollapsed=t.collapsed??!1,this.isMain=t.main??!1,this.custom=t.custom??!1,this.nestingLevel=0,this.includeGetJson=t.includeGetJson??!0,this.addItemCfg=t.addItem,this.deleteItemCfg=t.deleteItem,this.dataProps=t.dataProps,this.dataPropsPath=t.dataProps||"",Object.assign(this,t.settings),this.initialValues=this.getValues(),this.originalDefaultValues=this.getDefaultValues(),this.propagateNestingLevel(),this.propagateDataPropsPath()}propagateNestingLevel(){const t=this.nestingLevel+1;x(this.settings,(e,i)=>{g(i)&&(i.nestingLevel=t,i.propagateNestingLevel())})}getNestingLevel(){return this.nestingLevel}setNestingLevel(t){this.nestingLevel=t,this.propagateNestingLevel(),this.elementRef&&this.updateNestingStyles()}getDataPropsPath(){return this.dataPropsPath}setDataPropsPath(t){this.dataPropsPath=t,this.propagateDataPropsPath()}propagateDataPropsPath(){x(this.settings,(t,e)=>{const i=String(t),s=this.dataPropsPath?`${this.dataPropsPath}_${i}`:i;(g(e)||w(e)&&typeof e.setDataPropsPath=="function")&&e.setDataPropsPath(s)})}updateNestingStyles(){this.elementRef&&(k(this.elementRef,this.nestingLevel),N(this.elementRef,this.nestingLevel))}forceChildUIRefresh(){Object.entries(this.settings).forEach(([t,e])=>{try{if(g(e)){const i=e.getValues();e.setValue(i)}else if(typeof e.setValue=="function"){const i=e.value;i!==void 0&&e.setValue(i)}}catch(i){console.warn(`Error refreshing UI for setting ${t}:`,i)}})}removeSetting(t){var s;const e=this.settings[t];if(!e)return;if(delete this.settings[t],this.elementRef){const n=this.elementRef.querySelector(".setting-group-content");if(n){const a=Array.from(n.querySelectorAll(".setting-group, .setting"));for(const o of a){const l=o.id;if(l&&"id"in e&&typeof e.id=="string"&&l.includes(e.id)){o.remove();break}}}}typeof e.cleanup=="function"&&e.cleanup(),this.updateNestingStyles();const i=this.getValues();this.initialValues=i,(s=this.onChange)==null||s.call(this,i)}updateVisibility(){this.elementRef}clone(){const t={};x(this.settings,(s,n)=>{const a=String(s);typeof n.clone=="function"?t[a]=n.clone():(console.warn(`Setting with key '${a}' does not have a clone method. Copying reference.`),t[a]=n)});const e={title:this.title,settings:t,collapsed:this.isCollapsed,main:this.isMain,custom:this.custom,includeGetJson:this.includeGetJson,addItem:this.addItemCfg,deleteItem:this.deleteItemCfg,dataProps:this.dataProps},i=B(e);return i.initialValues=this.getValues(),i}resetDefault(){const t=this.originalDefaultValues;this.setValue(t),this.onChange&&this.onChange(this.getValues())}setMobileValues(t){!t||typeof t!="object"||(Object.entries(t).forEach(([e,i])=>{const s=this.settings[e];s&&(g(s)||w(s))&&typeof s.setMobileValue=="function"&&s.setMobileValue(i)}),this.setValue(t),this.onChange&&this.onChange(this.getValues()))}getMobileValues(t){if(t===void 0){const e={};for(const i in this.settings)if(Object.prototype.hasOwnProperty.call(this.settings,i)){const s=this.settings[i];if(g(s))e[i]=s.getMobileValues();else{const n=s;e[i]=n.mobileValue!==void 0?n.mobileValue:n.value}}return e}else{const e=this.settings[t];if(!e)return;if(g(e))return e.getMobileValues();const i=e;return i.mobileValue!==void 0?i.mobileValue:i.value}}setOnChange(t){this.onChange=t;const e=()=>{this.isHandlingChange||(this.isHandlingChange=!0,this.changeTimeout&&clearTimeout(this.changeTimeout),this.changeTimeout=setTimeout(()=>{const i=this.getValues(),s=this.calculateChanges(this.initialValues,i);Object.keys(s).length>0&&(this.lastChangeTime=Date.now(),this.initialValues=i,t(i),this.updateVisibility()),this.isHandlingChange=!1},50))};return this.changeHandlers.clear(),x(this.settings,(i,s)=>{var n;if(g(s))s.setOnChange(()=>{const a=this.getValues();this.initialValues=a,t(a)}),this.changeHandlers.add(()=>t(this.getValues()));else if(w(s)){const a=()=>e();this.changeHandlers.add(a),s.setOnChange(a)}else{const a=()=>e();this.changeHandlers.add(a),(n=s.setOnChange)==null||n.call(s,a)}}),this}cleanup(){this.changeTimeout&&(clearTimeout(this.changeTimeout),this.changeTimeout=null),this.blurTimeout&&(clearTimeout(this.blurTimeout),this.blurTimeout=null),this.elementRef&&this.elementRef.removeEventListener("focusout",this.handleBlur),this.changeHandlers.clear()}setValue(t){if(!t||typeof t!="object")return;Object.entries(t).forEach(([i,s])=>{let n=this.settings[i];if(!n&&this.addItemCfg&&i.startsWith(this.addItemCfg.keyPrefix)){const a=i.slice(this.addItemCfg.keyPrefix.length),o=Number(a);if(Number.isFinite(o)){const l=this.addItemCfg.createItem(o);O(l)&&(this.addSetting(i,l),n=l)}}n&&(g(n)||w(n))&&typeof n.setValue=="function"&&n.setValue(s)}),setTimeout(()=>{this.forceChildUIRefresh()},0);const e=this.getValues();this.initialValues=e,this.onChange&&this.onChange(e)}wireChild(t){var i;const e=()=>{var n;const s=this.getValues();this.initialValues=s,(n=this.onChange)==null||n.call(this,s),this.updateVisibility()};g(t)?t.setOnChange(()=>e()):w(t)?t.setOnChange(()=>e()):(i=t.setOnChange)==null||i.call(t,()=>e())}addSetting(t,e){var s,n;if(this.settings[t]=e,this.wireChild(e),this.elementRef){const a=this.elementRef.querySelector(".setting-group-content");if(a){g(e)&&typeof e.setNestingLevel=="function"&&e.setNestingLevel(this.nestingLevel+1);const o=e.draw(),l=this.deleteItemCfg??this.addItemCfg;if(l){const d=l.keyPrefix??((s=this.addItemCfg)==null?void 0:s.keyPrefix);d&&t.startsWith(d)&&this.addDeleteButtonToElement(o,t)}const r=a.querySelector(".sg-add-button-bottom");r?a.insertBefore(o,r):a.appendChild(o),P.trackElement(o),k(o,this.nestingLevel+1),N(o,this.nestingLevel+1);const h=o.style.display;o.style.display="none",o.offsetHeight,o.style.display=h,this.updateNestingStyles()}}const i=this.getValues();this.initialValues=i,(n=this.onChange)==null||n.call(this,i)}addDeleteButtonToElement(t,e,i){let s=null;try{s=t.querySelector(":scope > .setting-group-title")}catch{s=null}if(!s){const r=Array.from(t.querySelectorAll(".setting-group-title"));for(const h of r)if(h.closest(".setting-group")===t){s=h;break}s||(s=r[0]??null)}if(!s)return;const n=s.querySelector(".actions-section");if(!n)return;const a=document.createElement("button");a.type="button",a.className="sg-delete-button",i?i.deleteItemCfg:this.deleteItemCfg??this.addItemCfg,a.title="Delete",a.style.cssText=`
2
2
  background: none;
3
3
  border: none;
4
4
  cursor: pointer;
@@ -70,7 +70,7 @@
70
70
  font-weight: 500;
71
71
  cursor: pointer;
72
72
  transition: all 0.2s;
73
- `,o.addEventListener("mouseenter",()=>{o.style.backgroundColor="#f9fafb",o.style.borderColor="#9ca3af"}),o.addEventListener("mouseleave",()=>{o.style.backgroundColor="white",o.style.borderColor="#d1d5db"}),l.addEventListener("mouseenter",()=>{l.style.backgroundColor="#dc2626"}),l.addEventListener("mouseleave",()=>{l.style.backgroundColor="#ef4444"});const r=()=>{e.style.opacity="0",i.style.transform="scale(0.95)",setTimeout(()=>{e.parentNode&&e.parentNode.removeChild(e)},200)};o.addEventListener("click",()=>{r(),t(!1)}),l.addEventListener("click",()=>{r(),t(!0)}),e.addEventListener("click",d=>{d.target===e&&(r(),t(!1))});const h=d=>{d.key==="Escape"&&(r(),t(!1),document.removeEventListener("keydown",h))};document.addEventListener("keydown",h),a.appendChild(o),a.appendChild(l),i.appendChild(s),i.appendChild(n),i.appendChild(a),e.appendChild(i),document.body.appendChild(e),requestAnimationFrame(()=>{e.style.opacity="1",i.style.transform="scale(1)"}),setTimeout(()=>l.focus(),100)})}getNextIndexFromPrefix(t){const e=Object.keys(this.settings).filter(i=>i.startsWith(t)).map(i=>{const s=Number(i.slice(t.length));return Number.isFinite(s)?s:-1}).filter(i=>i>=0);return e.length?Math.max(...e)+1:0}calculateChanges(t,e){const i={};return new Set([...Object.keys(t),...Object.keys(e)]).forEach(n=>{const a=t[n],o=e[n];JSON.stringify(a)!==JSON.stringify(o)&&(i[n]={from:a,to:o})}),i}getValues(t){if(t===void 0){const e={};for(const i in this.settings)if(Object.prototype.hasOwnProperty.call(this.settings,i)){const s=this.settings[i];g(s)?e[i]=s.getValues():e[i]=s.value}return e}else{const e=this.settings[t];return e?g(e)?e.getValues():e.value:void 0}}getValuesForJson(t){if(t===void 0){if(this.includeGetJson===!1)return null;const e={};for(const i in this.settings)if(Object.prototype.hasOwnProperty.call(this.settings,i)){const s=this.settings[i];if(g(s))e[i]=s.getValuesForJson();else{const n=s;n.includeGetJson===!1?e[i]=null:e[i]=n.value}}return e}else{const e=this.settings[t];if(!e)return;if(g(e))return e.includeGetJson===!1?null:e.getValuesForJson();{const i=e;return i.includeGetJson===!1?null:i.value}}}getDefaultValues(t){if(t===void 0){const e={};for(const i in this.settings)if(Object.prototype.hasOwnProperty.call(this.settings,i)){const s=this.settings[i];if(g(s))e[i]=s.getDefaultValues();else{const n=s;e[i]=n.default!==void 0?n.default:n.value}}return e}else{const e=this.settings[t];if(!e)return;if(g(e))return e.getDefaultValues();const i=e;return i.default!==void 0?i.default:i.value}}draw(){const t=document.createElement("div");t.className="setting-group",t.id=`setting-group-${this.id}`,S.hiddenElements.add(t),this.isMain&&t.classList.add("main-group"),this.custom&&t.classList.add("custom_class"),L(t,this.nestingLevel);const e=document.createElement("div");e.className="setting-group-title",this.isCollapsed&&e.classList.add("collapsed-view"),e.setAttribute("role","button"),e.setAttribute("aria-expanded",(!this.isCollapsed).toString()),e.setAttribute("tabindex","0");const i=document.createElement("div");i.className="title-section";const s=document.createElement("h3");s.textContent=this.title,i.appendChild(s);const n=document.createElement("div");n.className="actions-section";const a=document.createElement("span");a.className="setting-group-arrow",a.innerHTML=`
73
+ `,o.addEventListener("mouseenter",()=>{o.style.backgroundColor="#f9fafb",o.style.borderColor="#9ca3af"}),o.addEventListener("mouseleave",()=>{o.style.backgroundColor="white",o.style.borderColor="#d1d5db"}),l.addEventListener("mouseenter",()=>{l.style.backgroundColor="#dc2626"}),l.addEventListener("mouseleave",()=>{l.style.backgroundColor="#ef4444"});const r=()=>{e.style.opacity="0",i.style.transform="scale(0.95)",setTimeout(()=>{e.parentNode&&e.parentNode.removeChild(e)},200)};o.addEventListener("click",()=>{r(),t(!1)}),l.addEventListener("click",()=>{r(),t(!0)}),e.addEventListener("click",d=>{d.target===e&&(r(),t(!1))});const h=d=>{d.key==="Escape"&&(r(),t(!1),document.removeEventListener("keydown",h))};document.addEventListener("keydown",h),a.appendChild(o),a.appendChild(l),i.appendChild(s),i.appendChild(n),i.appendChild(a),e.appendChild(i),document.body.appendChild(e),requestAnimationFrame(()=>{e.style.opacity="1",i.style.transform="scale(1)"}),setTimeout(()=>l.focus(),100)})}getNextIndexFromPrefix(t){const e=Object.keys(this.settings).filter(i=>i.startsWith(t)).map(i=>{const s=Number(i.slice(t.length));return Number.isFinite(s)?s:-1}).filter(i=>i>=0);return e.length?Math.max(...e)+1:0}calculateChanges(t,e){const i={};return new Set([...Object.keys(t),...Object.keys(e)]).forEach(n=>{const a=t[n],o=e[n];JSON.stringify(a)!==JSON.stringify(o)&&(i[n]={from:a,to:o})}),i}getValues(t){if(t===void 0){const e={};for(const i in this.settings)if(Object.prototype.hasOwnProperty.call(this.settings,i)){const s=this.settings[i];g(s)?e[i]=s.getValues():e[i]=s.value}return e}else{const e=this.settings[t];return e?g(e)?e.getValues():e.value:void 0}}getValuesForJson(t){if(t===void 0){if(this.includeGetJson===!1)return null;const e={};for(const i in this.settings)if(Object.prototype.hasOwnProperty.call(this.settings,i)){const s=this.settings[i];if(g(s))e[i]=s.getValuesForJson();else{const n=s;n.includeGetJson===!1?e[i]=null:e[i]=n.value}}return e}else{const e=this.settings[t];if(!e)return;if(g(e))return e.includeGetJson===!1?null:e.getValuesForJson();{const i=e;return i.includeGetJson===!1?null:i.value}}}getDefaultValues(t){if(t===void 0){const e={};for(const i in this.settings)if(Object.prototype.hasOwnProperty.call(this.settings,i)){const s=this.settings[i];if(g(s))e[i]=s.getDefaultValues();else{const n=s;e[i]=n.default!==void 0?n.default:n.value}}return e}else{const e=this.settings[t];if(!e)return;if(g(e))return e.getDefaultValues();const i=e;return i.default!==void 0?i.default:i.value}}draw(){const t=document.createElement("div");t.className="setting-group",t.id=`setting-group-${this.id}`,V.hiddenElements.add(t),this.isMain&&t.classList.add("main-group"),this.custom&&t.classList.add("custom_class"),k(t,this.nestingLevel);const e=document.createElement("div");e.className="setting-group-title",this.isCollapsed&&e.classList.add("collapsed-view"),e.setAttribute("role","button"),e.setAttribute("aria-expanded",(!this.isCollapsed).toString()),e.setAttribute("tabindex","0");const i=document.createElement("div");i.className="title-section";const s=document.createElement("h3");s.textContent=this.title,i.appendChild(s);const n=document.createElement("div");n.className="actions-section";const a=document.createElement("span");a.className="setting-group-arrow",a.innerHTML=`
74
74
  <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
75
75
  <path d="M4 6L8 10L12 6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
76
76
  </svg>
@@ -79,7 +79,7 @@
79
79
  xmlns="http://www.w3.org/2000/svg">
80
80
  <path d="M8 3.333v9.334M3.333 8h9.334" stroke="currentColor"
81
81
  stroke-width="1.5" stroke-linecap="round"/>
82
- </svg>`;h.innerHTML=`${d}<span style="margin-left:4px;">${this.addItemCfg.buttonLabel??"Add"}</span>`,h.addEventListener("click",u=>{u.stopPropagation(),u.preventDefault();const b=this.getNextIndexFromPrefix(this.addItemCfg.keyPrefix),V=this.addItemCfg.createItem(b),E=`${this.addItemCfg.keyPrefix}${b}`;this.addSetting(E,V)}),o.appendChild(h)}return e.appendChild(i),e.appendChild(n),t.appendChild(e),t.appendChild(o),this.elementRef=t,T.trackElement(t),setTimeout(()=>{this.updateNestingStyles()},0),this.pendingBlurHandler&&(this.pendingBlurHandler=null),t}collapse(){if(!this.elementRef||this.isCollapsed)return;const t=this.elementRef.querySelector(".setting-group-content"),e=this.elementRef.querySelector(".setting-group-arrow"),i=this.elementRef.querySelector(".setting-group-title");t&&e&&i&&(this.isCollapsed=!0,t.classList.add("collapsed"),e.classList.add("rotated"),i.setAttribute("aria-expanded","false"))}expand(){if(!this.elementRef||!this.isCollapsed)return;const t=this.elementRef.querySelector(".setting-group-content"),e=this.elementRef.querySelector(".setting-group-arrow"),i=this.elementRef.querySelector(".setting-group-title");t&&e&&i&&(this.isCollapsed=!1,t.classList.remove("collapsed"),e.classList.remove("rotated"),i.setAttribute("aria-expanded","true"))}getJson(){return JSON.stringify(this.getValuesForJson(),null,2)}setJson(t){try{const e=JSON.parse(t);let i=e;const s=Object.keys(this.settings),n=Object.keys(e);if(!s.some(o=>n.includes(o))&&n.length===1){const o=n[0];i=e[o]}this.setValue(i)}catch(e){throw console.error("Invalid JSON provided to setJson:",e),new Error("Invalid JSON format")}}};S.hiddenElements=new Set;let v=S;function U(c){return new O(c)}class O extends v{constructor(t){super(t);const e=Object.keys(this.settings)[0];this.activeTabId=e||""}getActiveTabId(){return this.activeTabId}switchToTab(t){this.settings[t]&&(this.activeTabId=t,this.updateTabUI())}updateTabUI(){if(!this.tabsContainer||!this.contentContainers)return;this.tabsContainer.querySelectorAll(".tab-button").forEach(e=>{e.getAttribute("data-tab-id")===this.activeTabId?e.classList.add("active"):e.classList.remove("active")}),Object.entries(this.contentContainers).forEach(([e,i])=>{e===this.activeTabId?i.classList.add("active"):i.classList.remove("active")})}draw(){const t=super.draw();t.classList.add("tabs-settings-container");const e=t.querySelector(".setting-group-content");if(!e)return t;e.innerHTML="";const i=document.createElement("div");i.className="tabs-title";const s=document.createElement("h3");s.textContent=this.title,i.appendChild(s);const n=document.createElement("div");n.className="tabs-header",this.tabsContainer=n;const a=document.createElement("div");if(a.className="tab-content",this.contentContainers={},Object.keys(this.settings).forEach((o,l)=>{const r=document.createElement("button");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);const h=document.createElement("div");h.className="tab-panel",this.contentContainers[o]=h;const d=this.settings[o];d&&(g(d)&&typeof d.setNestingLevel=="function"&&d.setNestingLevel(this.getNestingLevel()+1),h.appendChild(d.draw())),a.appendChild(h),l===0&&!this.activeTabId&&(this.activeTabId=o)}),e.appendChild(i),e.appendChild(n),e.appendChild(a),!this.activeTabId){const o=Object.keys(this.settings)[0];this.activeTabId=o||""}return this.updateTabUI(),t}}function A(c){return new v(c)}function J(c){return c}class B extends p{constructor(t={}){super(t),this.inputType="text",t.onChange&&this.setOnChange(t.onChange)}draw(){const t=e=>{this.props.maxLength!==void 0&&(e.maxLength=this.props.maxLength),this.props.className&&e.classList.add(this.props.className)};return this.createInput({value:this.value,inputType:this.inputType,title:this.props.title,placeholder:this.props.placeholder,icon:this.props.icon,inputClassName:"string-setting-input "+(this.props.inputClassName||""),wrapperClassName:"string-setting-wrapper "+(this.props.wrapperClassName||""),inputCustomizer:t})}}const q="<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>";class m extends B{constructor(t){super({...t,icon:t.icon||q,title:t.title||"Color",default:t.default?m.normalizeColorValue(t.default):"#000000"}),this.inputType="color",this.element=null,this.colorInputEl=null,this.textInputEl=null,this.detectChange=t.detectChange}static normalizeColorValue(t){return t.startsWith("#")?m.normalizeHexValue(t):t.includes(",")?m.rgbToHexStatic(t):m.normalizeHexValue(t)}static normalizeHexValue(t){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")}static rgbToHexStatic(t){const e=t.split(",").map(h=>parseInt(h.trim()));if(e.length!==3||e.some(isNaN))return console.warn(`Invalid RGB value "${t}", using default "#000000"`),"#000000";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=h=>{const d=h.toString(16);return d.length===1?"0"+d:d};return`#${r(a)}${r(o)}${r(l)}`}setValue(t){if(t===void 0){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");return}if(typeof t=="string"){const e=m.normalizeColorValue(t);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)}else 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")}hexToRgb(t){t=t.replace("#","");const e=parseInt(t.substring(0,2),16),i=parseInt(t.substring(2,4),16),s=parseInt(t.substring(4,6),16);return`${e}, ${i}, ${s}`}draw(){const t=document.createElement("div");if(t.className="color-setting-wrapper "+(this.props.wrapperClassName||""),this.props.title||this.props.icon){const l=document.createElement("div");if(l.className="icon-container",this.props.icon){const r=document.createElement("span");r.className="input-icon",r.innerHTML=this.props.icon,l.appendChild(r)}if(this.props.title){const r=document.createElement("span");r.className="input-label",r.textContent=this.props.title,l.appendChild(r)}t.appendChild(l)}const e=document.createElement("div");e.className="color-input-wrapper";const i=l=>{const r=l.value.trim();if(!r)return e.classList.remove("error"),!0;const d=/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/.test(r);return d?e.classList.remove("error"):e.classList.add("error"),d},s=document.createElement("input");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.getDataPropsPath()&&s.setAttribute("data-test-id",this.getDataPropsPath()),this.colorInputEl=s;const n=document.createElement("div");n.className="color-preview";const a=this.value||"#000000";n.style.backgroundColor=a;const o=document.createElement("input");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.getDataPropsPath()&&o.setAttribute("data-test-id",`${this.getDataPropsPath()}_text`),this.textInputEl=o,this.textInputEl.addEventListener("input",l=>{var h,d;let r=l.target.value.trim();if(this.textInputEl&&i(this.textInputEl)){const u=m.normalizeColorValue(r);this.value=u,(h=this.onChange)==null||h.call(this,u),(d=this.detectChange)==null||d.call(this,u),this.colorInputEl&&(this.colorInputEl.value=u),n.style.backgroundColor=u}}),this.colorInputEl.addEventListener("input",l=>{var d,u;const r=l.target.value,h=m.normalizeColorValue(r);this.value=h,(d=this.onChange)==null||d.call(this,h),(u=this.detectChange)==null||u.call(this,h),this.textInputEl&&(this.textInputEl.value=h),n.style.backgroundColor=h,e.classList.remove("error")}),this.colorInputEl.addEventListener("change",l=>{var d,u;const r=l.target.value,h=m.normalizeColorValue(r);this.value=h,(d=this.onChange)==null||d.call(this,h),(u=this.detectChange)==null||u.call(this,h),this.textInputEl&&(this.textInputEl.value=h),n.style.backgroundColor=h}),e.appendChild(s),e.appendChild(n),e.appendChild(o),t.appendChild(e),this.element=t,t}getElement(){return this.element}getNormalizedValue(){return this.value?m.normalizeColorValue(this.value):"#000000"}isValidHex(){return this.value?/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/.test(this.value):!1}toRgb(){return this.isValidHex()?this.hexToRgb(this.value):"0, 0, 0"}}const Z=`
82
+ </svg>`;h.innerHTML=`${d}<span style="margin-left:4px;">${this.addItemCfg.buttonLabel??"Add"}</span>`,h.addEventListener("click",u=>{u.stopPropagation(),u.preventDefault();const b=this.getNextIndexFromPrefix(this.addItemCfg.keyPrefix),y=this.addItemCfg.createItem(b);if(O(y)){const E=`${this.addItemCfg.keyPrefix}${b}`;this.addSetting(E,y)}}),o.appendChild(h)}return e.appendChild(i),e.appendChild(n),t.appendChild(e),t.appendChild(o),this.elementRef=t,P.trackElement(t),setTimeout(()=>{this.updateNestingStyles()},0),this.pendingBlurHandler&&(this.pendingBlurHandler=null),t}collapse(){if(!this.elementRef||this.isCollapsed)return;const t=this.elementRef.querySelector(".setting-group-content"),e=this.elementRef.querySelector(".setting-group-arrow"),i=this.elementRef.querySelector(".setting-group-title");t&&e&&i&&(this.isCollapsed=!0,t.classList.add("collapsed"),e.classList.add("rotated"),i.setAttribute("aria-expanded","false"))}expand(){if(!this.elementRef||!this.isCollapsed)return;const t=this.elementRef.querySelector(".setting-group-content"),e=this.elementRef.querySelector(".setting-group-arrow"),i=this.elementRef.querySelector(".setting-group-title");t&&e&&i&&(this.isCollapsed=!1,t.classList.remove("collapsed"),e.classList.remove("rotated"),i.setAttribute("aria-expanded","true"))}getJson(){return JSON.stringify(this.getValuesForJson(),null,2)}setJson(t){try{const e=JSON.parse(t);let i=e;const s=Object.keys(this.settings),n=Object.keys(e);if(!s.some(o=>n.includes(o))&&n.length===1){const o=n[0];i=e[o]}this.setValue(i)}catch(e){throw console.error("Invalid JSON provided to setJson:",e),new Error("Invalid JSON format")}}};V.hiddenElements=new Set;let v=V;function U(c){return new H(c)}class H extends v{constructor(t){super(t);const e=Object.keys(this.settings)[0];this.activeTabId=e||""}getActiveTabId(){return this.activeTabId}switchToTab(t){this.settings[t]&&(this.activeTabId=t,this.updateTabUI())}updateTabUI(){if(!this.tabsContainer||!this.contentContainers)return;this.tabsContainer.querySelectorAll(".tab-button").forEach(e=>{e.getAttribute("data-tab-id")===this.activeTabId?e.classList.add("active"):e.classList.remove("active")}),Object.entries(this.contentContainers).forEach(([e,i])=>{e===this.activeTabId?i.classList.add("active"):i.classList.remove("active")})}draw(){const t=super.draw();t.classList.add("tabs-settings-container");const e=t.querySelector(".setting-group-content");if(!e)return t;e.innerHTML="";const i=document.createElement("div");i.className="tabs-title";const s=document.createElement("h3");s.textContent=this.title,i.appendChild(s);const n=document.createElement("div");n.className="tabs-header",this.tabsContainer=n;const a=document.createElement("div");if(a.className="tab-content",this.contentContainers={},Object.keys(this.settings).forEach((o,l)=>{const r=document.createElement("button");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);const h=document.createElement("div");h.className="tab-panel",this.contentContainers[o]=h;const d=this.settings[o];d&&(g(d)&&typeof d.setNestingLevel=="function"&&d.setNestingLevel(this.getNestingLevel()+1),h.appendChild(d.draw())),a.appendChild(h),l===0&&!this.activeTabId&&(this.activeTabId=o)}),e.appendChild(i),e.appendChild(n),e.appendChild(a),!this.activeTabId){const o=Object.keys(this.settings)[0];this.activeTabId=o||""}return this.updateTabUI(),t}}function B(c){return new v(c)}function J(c){return c}class $ extends p{constructor(t={}){super(t),this.inputType="text",t.onChange&&this.setOnChange(t.onChange)}draw(){const t=e=>{this.props.maxLength!==void 0&&(e.maxLength=this.props.maxLength),this.props.className&&e.classList.add(this.props.className)};return this.createInput({value:this.value,inputType:this.inputType,title:this.props.title,placeholder:this.props.placeholder,icon:this.props.icon,inputClassName:"string-setting-input "+(this.props.inputClassName||""),wrapperClassName:"string-setting-wrapper "+(this.props.wrapperClassName||""),inputCustomizer:t})}}const q="<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>";class m extends ${constructor(t){super({...t,icon:t.icon||q,title:t.title||"Color",default:t.default?m.normalizeColorValue(t.default):"#000000"}),this.inputType="color",this.element=null,this.colorInputEl=null,this.textInputEl=null,this.detectChange=t.detectChange}static normalizeColorValue(t){return t.startsWith("#")?m.normalizeHexValue(t):t.includes(",")?m.rgbToHexStatic(t):m.normalizeHexValue(t)}static normalizeHexValue(t){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")}static rgbToHexStatic(t){const e=t.split(",").map(h=>parseInt(h.trim()));if(e.length!==3||e.some(isNaN))return console.warn(`Invalid RGB value "${t}", using default "#000000"`),"#000000";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=h=>{const d=h.toString(16);return d.length===1?"0"+d:d};return`#${r(a)}${r(o)}${r(l)}`}setValue(t){if(t===void 0){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");return}if(typeof t=="string"){const e=m.normalizeColorValue(t);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)}else 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")}hexToRgb(t){t=t.replace("#","");const e=parseInt(t.substring(0,2),16),i=parseInt(t.substring(2,4),16),s=parseInt(t.substring(4,6),16);return`${e}, ${i}, ${s}`}draw(){const t=document.createElement("div");if(t.className="color-setting-wrapper "+(this.props.wrapperClassName||""),this.props.title||this.props.icon){const l=document.createElement("div");if(l.className="icon-container",this.props.icon){const r=document.createElement("span");r.className="input-icon",r.innerHTML=this.props.icon,l.appendChild(r)}if(this.props.title){const r=document.createElement("span");r.className="input-label",r.textContent=this.props.title,l.appendChild(r)}t.appendChild(l)}const e=document.createElement("div");e.className="color-input-wrapper";const i=l=>{const r=l.value.trim();if(!r)return e.classList.remove("error"),!0;const d=/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/.test(r);return d?e.classList.remove("error"):e.classList.add("error"),d},s=document.createElement("input");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.getDataPropsPath()&&s.setAttribute("data-test-id",this.getDataPropsPath()),this.colorInputEl=s;const n=document.createElement("div");n.className="color-preview";const a=this.value||"#000000";n.style.backgroundColor=a;const o=document.createElement("input");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.getDataPropsPath()&&o.setAttribute("data-test-id",`${this.getDataPropsPath()}_text`),this.textInputEl=o,this.textInputEl.addEventListener("input",l=>{var h,d;let r=l.target.value.trim();if(this.textInputEl&&i(this.textInputEl)){const u=m.normalizeColorValue(r);this.value=u,(h=this.onChange)==null||h.call(this,u),(d=this.detectChange)==null||d.call(this,u),this.colorInputEl&&(this.colorInputEl.value=u),n.style.backgroundColor=u}}),this.colorInputEl.addEventListener("input",l=>{var d,u;const r=l.target.value,h=m.normalizeColorValue(r);this.value=h,(d=this.onChange)==null||d.call(this,h),(u=this.detectChange)==null||u.call(this,h),this.textInputEl&&(this.textInputEl.value=h),n.style.backgroundColor=h,e.classList.remove("error")}),this.colorInputEl.addEventListener("change",l=>{var d,u;const r=l.target.value,h=m.normalizeColorValue(r);this.value=h,(d=this.onChange)==null||d.call(this,h),(u=this.detectChange)==null||u.call(this,h),this.textInputEl&&(this.textInputEl.value=h),n.style.backgroundColor=h}),e.appendChild(s),e.appendChild(n),e.appendChild(o),t.appendChild(e),this.element=t,t}getElement(){return this.element}getNormalizedValue(){return this.value?m.normalizeColorValue(this.value):"#000000"}isValidHex(){return this.value?/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/.test(this.value):!1}toRgb(){return this.isValidHex()?this.hexToRgb(this.value):"0, 0, 0"}}const Z=`
83
83
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
84
84
  <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"/>
85
85
  <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"/>
@@ -88,11 +88,11 @@
88
88
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
89
89
  <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"/>
90
90
  <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"/>
91
- </svg>`;class $ extends f{constructor(t={}){const e={title:"Opacity",suffix:"%",minValue:0,maxValue:100,step:1,default:t.default??100,icon:X,...t};super(e),this.inputType="number",this.mobileValue=t.mobile}getMobileValue(){return this.mobileValue}setMobileValue(t){this.mobileValue=t,t!==void 0&&this.setValue(t)}}const Y=`
91
+ </svg>`;class D extends f{constructor(t={}){const e={title:"Opacity",suffix:"%",minValue:0,maxValue:100,step:1,default:t.default??100,icon:X,...t};super(e),this.inputType="number",this.mobileValue=t.mobile}getMobileValue(){return this.mobileValue}setMobileValue(t){this.mobileValue=t,t!==void 0&&this.setValue(t)}}const Y=`
92
92
  <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">
93
93
  <polyline points="6 9 12 15 18 9"></polyline>
94
94
  </svg>
95
- `;class M extends p{constructor(t={}){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){const e=this._options.findIndex(i=>i.value===this.value);e>=0&&(this.selectedOptionIndex=e)}}setValue(t){super.setValue(t);const e=this._options.findIndex(i=>i.value===t);e>=0?this.selectedOptionIndex=e:this.selectedOptionIndex=null,this.updateButtonText()}createOption(t,e){const i=document.createElement("li");return i.classList.add("select-option"),i.textContent=t.name,i.dataset.index=String(e),this.selectedOptionIndex===e&&i.classList.add("selected"),i}draw(){const t=document.createElement("div");if(t.classList.add("select-container"),this.container=t,this.props.icon||this.props.title){const n=document.createElement("div");if(n.className="icon-container",this.props.icon){const a=this.createIcon(this.props.icon);n.appendChild(a)}if(this.props.title){const a=this.createLabel(this.props.title);n.appendChild(a)}t.appendChild(n)}else{const n=document.createElement("div");t.appendChild(n)}const e=document.createElement("div");e.classList.add("select-button"),this.getDataPropsPath()&&e.setAttribute("data-test-id",this.getDataPropsPath()),this.isLoading?e.classList.add("loading"):e.textContent=this.selectedOptionIndex!==null?this._options[this.selectedOptionIndex].name:this.props.placeholder||"Select an option",e.onclick=()=>{var n,a;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))},t.appendChild(e),this.buttonEl=e;const i=document.createElement("ul");i.classList.add("select-options"),this._options.forEach((n,a)=>{const o=this.createOption(n,a);o.onclick=l=>this.selectOption(l,a,e),i.appendChild(o)}),document.body.appendChild(i);const s=document.createElement("div");return s.classList.add("svg-container"),s.innerHTML=Y,t.appendChild(s),this.optionsListEl=i,this.svgContainer=s,this.props.getOptionsAsync&&(this.isLoading=!0,this.updateButtonText(),this.props.getOptionsAsync().then(n=>{this._options.push(...n),this.isLoading=!1,this.updateOptionsList(),this.updateButtonText()}).catch(n=>{console.error("Failed to fetch async options:",n),this.isLoading=!1,this.updateButtonText("Failed to load options")})),this.clickOutsideListener&&document.removeEventListener("click",this.clickOutsideListener),this.clickOutsideListener=n=>{var a,o;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())},document.addEventListener("click",this.clickOutsideListener),this.resizeListener&&window.removeEventListener("resize",this.resizeListener),this.resizeListener=()=>{this.isOpen&&this.checkDropdownPosition()},window.addEventListener("resize",this.resizeListener),t}checkDropdownPosition(){if(!this.optionsListEl||!this.buttonEl||!this.container)return;const t=this.buttonEl.getBoundingClientRect();this.optionsListEl.classList.remove("dropdown-up"),this.optionsListEl.style.position="fixed",this.optionsListEl.style.top=`${t.bottom+2}px`,this.optionsListEl.style.bottom="auto",this.optionsListEl.style.left=`${t.left}px`,this.optionsListEl.style.right="auto",this.optionsListEl.style.width=`${t.width}px`;const e=Math.min(this._options.length*40+12,280);if(window.innerHeight-t.bottom<e){const s=Math.max(10,window.innerHeight-e-10);this.optionsListEl.style.top=`${s}px`}}selectOption(t,e,i){var n,a,o;const s=this._options[e];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,h)=>{h===e?r.classList.add("selected"):r.classList.remove("selected")}))}cleanupDropdownPosition(){this.optionsListEl&&(this.optionsListEl.style.position="",this.optionsListEl.style.top="",this.optionsListEl.style.bottom="",this.optionsListEl.style.left="",this.optionsListEl.style.right="",this.optionsListEl.style.width="")}updateOptionsList(){if(this.optionsListEl){if(this.optionsListEl.innerHTML="",this._options.length===0){const t=document.createElement("li");t.classList.add("select-option","empty-message"),t.textContent="No options available",this.optionsListEl.appendChild(t);return}this._options.forEach((t,e)=>{const i=this.createOption(t,e);i.onclick=s=>{this.buttonEl&&this.selectOption(s,e,this.buttonEl)},this.optionsListEl.appendChild(i)})}}updateButtonText(t){if(!this.buttonEl)return;if(this.isLoading){this.buttonEl.classList.add("loading"),this.buttonEl.textContent=this.props.loadingText||"Loading options...";return}this.buttonEl.classList.remove("loading","error");let e;t?((t.includes("Failed")||t.includes("Error"))&&this.buttonEl.classList.add("error"),e=t):this.selectedOptionIndex!==null&&this._options[this.selectedOptionIndex]?e=this._options[this.selectedOptionIndex].name:e=this.props.placeholder||"Select an option",this.buttonEl.textContent=e}destroy(){this.clickOutsideListener&&(document.removeEventListener("click",this.clickOutsideListener),this.clickOutsideListener=null),this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null),this.cleanupDropdownPosition(),this.optionsListEl&&this.optionsListEl.parentNode&&this.optionsListEl.parentNode.removeChild(this.optionsListEl),super.destroy()}}class D extends p{constructor(t={}){super(t),this.inputType="button",this.value||(this.value="center")}draw(){const t=document.createElement("div");t.className="align-setting-wrapper";const e=document.createElement("label");e.className="align-setting-label",e.textContent=this.title||"Align",t.appendChild(e);const i=document.createElement("div");return i.className="align-options-container",[{name:"left",icon:`
95
+ `;class S extends p{constructor(t={}){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){const e=this._options.findIndex(i=>i.value===this.value);e>=0&&(this.selectedOptionIndex=e)}}setValue(t){super.setValue(t);const e=this._options.findIndex(i=>i.value===t);e>=0?this.selectedOptionIndex=e:this.selectedOptionIndex=null,this.updateButtonText()}createOption(t,e){const i=document.createElement("li");return i.classList.add("select-option"),i.textContent=t.name,i.dataset.index=String(e),this.selectedOptionIndex===e&&i.classList.add("selected"),i}draw(){const t=document.createElement("div");if(t.classList.add("select-container"),this.container=t,this.props.icon||this.props.title){const n=document.createElement("div");if(n.className="icon-container",this.props.icon){const a=this.createIcon(this.props.icon);n.appendChild(a)}if(this.props.title){const a=this.createLabel(this.props.title);n.appendChild(a)}t.appendChild(n)}else{const n=document.createElement("div");t.appendChild(n)}const e=document.createElement("div");e.classList.add("select-button"),this.getDataPropsPath()&&e.setAttribute("data-test-id",this.getDataPropsPath()),this.isLoading?e.classList.add("loading"):e.textContent=this.selectedOptionIndex!==null?this._options[this.selectedOptionIndex].name:this.props.placeholder||"Select an option",e.onclick=()=>{var n,a;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))},t.appendChild(e),this.buttonEl=e;const i=document.createElement("ul");i.classList.add("select-options"),this._options.forEach((n,a)=>{const o=this.createOption(n,a);o.onclick=l=>this.selectOption(l,a,e),i.appendChild(o)}),document.body.appendChild(i);const s=document.createElement("div");return s.classList.add("svg-container"),s.innerHTML=Y,t.appendChild(s),this.optionsListEl=i,this.svgContainer=s,this.props.getOptionsAsync&&(this.isLoading=!0,this.updateButtonText(),this.props.getOptionsAsync().then(n=>{this._options.push(...n),this.isLoading=!1,this.updateOptionsList(),this.updateButtonText()}).catch(n=>{console.error("Failed to fetch async options:",n),this.isLoading=!1,this.updateButtonText("Failed to load options")})),this.clickOutsideListener&&document.removeEventListener("click",this.clickOutsideListener),this.clickOutsideListener=n=>{var a,o;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())},document.addEventListener("click",this.clickOutsideListener),this.resizeListener&&window.removeEventListener("resize",this.resizeListener),this.resizeListener=()=>{this.isOpen&&this.checkDropdownPosition()},window.addEventListener("resize",this.resizeListener),t}checkDropdownPosition(){if(!this.optionsListEl||!this.buttonEl||!this.container)return;const t=this.buttonEl.getBoundingClientRect();this.optionsListEl.classList.remove("dropdown-up"),this.optionsListEl.style.position="fixed",this.optionsListEl.style.top=`${t.bottom+2}px`,this.optionsListEl.style.bottom="auto",this.optionsListEl.style.left=`${t.left}px`,this.optionsListEl.style.right="auto",this.optionsListEl.style.width=`${t.width}px`;const e=Math.min(this._options.length*40+12,280);if(window.innerHeight-t.bottom<e){const s=Math.max(10,window.innerHeight-e-10);this.optionsListEl.style.top=`${s}px`}}selectOption(t,e,i){var n,a;const s=this._options[e];s&&(this.setValue(s.value),this.selectedOptionIndex=e,this.isOpen=!1,i.textContent=s.name,(n=this.optionsListEl)==null||n.classList.remove("open"),(a=this.svgContainer)==null||a.classList.remove("open"),this.cleanupDropdownPosition(),this.optionsListEl&&this.optionsListEl.querySelectorAll(".select-option").forEach((l,r)=>{r===e?l.classList.add("selected"):l.classList.remove("selected")}))}cleanupDropdownPosition(){this.optionsListEl&&(this.optionsListEl.style.position="",this.optionsListEl.style.top="",this.optionsListEl.style.bottom="",this.optionsListEl.style.left="",this.optionsListEl.style.right="",this.optionsListEl.style.width="")}updateOptionsList(){if(this.optionsListEl){if(this.optionsListEl.innerHTML="",this._options.length===0){const t=document.createElement("li");t.classList.add("select-option","empty-message"),t.textContent="No options available",this.optionsListEl.appendChild(t);return}this._options.forEach((t,e)=>{const i=this.createOption(t,e);i.onclick=s=>{this.buttonEl&&this.selectOption(s,e,this.buttonEl)},this.optionsListEl.appendChild(i)})}}updateButtonText(t){if(!this.buttonEl)return;if(this.isLoading){this.buttonEl.classList.add("loading"),this.buttonEl.textContent=this.props.loadingText||"Loading options...";return}this.buttonEl.classList.remove("loading","error");let e;t?((t.includes("Failed")||t.includes("Error"))&&this.buttonEl.classList.add("error"),e=t):this.selectedOptionIndex!==null&&this._options[this.selectedOptionIndex]?e=this._options[this.selectedOptionIndex].name:e=this.props.placeholder||"Select an option",this.buttonEl.textContent=e}destroy(){this.clickOutsideListener&&(document.removeEventListener("click",this.clickOutsideListener),this.clickOutsideListener=null),this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null),this.cleanupDropdownPosition(),this.optionsListEl&&this.optionsListEl.parentNode&&this.optionsListEl.parentNode.removeChild(this.optionsListEl),super.destroy()}}class F extends p{constructor(t={}){super(t),this.inputType="button",this.value||(this.value="center")}draw(){const t=document.createElement("div");t.className="align-setting-wrapper";const e=document.createElement("label");e.className="align-setting-label",e.textContent=this.title||"Align",t.appendChild(e);const i=document.createElement("div");return i.className="align-options-container",[{name:"left",icon:`
96
96
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none">
97
97
  <path d="M10.5 7.5C11.1989 7.5 11.5484 7.5 11.824 7.38582C12.1916 7.23358 12.4836 6.94157 12.6358 6.57402C12.75 6.29837 12.75 5.94891 12.75 5.25C12.75 4.55109 12.75 4.20163 12.6358 3.92598C12.4836 3.55843 12.1916 3.26642 11.824 3.11418C11.5484 3 11.1989 3 10.5 3L4.5 3C3.80109 3 3.45163 3 3.17598 3.11418C2.80843 3.26642 2.51642 3.55843 2.36418 3.92597C2.25 4.20163 2.25 4.55109 2.25 5.25C2.25 5.94891 2.25 6.29837 2.36418 6.57402C2.51642 6.94157 2.80843 7.23358 3.17598 7.38582C3.45163 7.5 3.80109 7.5 4.5 7.5L10.5 7.5Z"
98
98
  stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/>
@@ -155,7 +155,7 @@
155
155
  <!-- Top-left dot -->
156
156
  <circle cx="6.7" cy="6.7" r="1.5" fill="#02CC59" opacity="0.3"/>
157
157
  </svg>
158
- `;class H extends p{constructor(t={}){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()}setupMessageListener(){this.messageListener=t=>{var e;if(t.data&&t.data.type==="FILE_MANAGER_IMAGE_SELECTED"&&t.data.settingId===this.id){const i=t.data.imageUrl;i&&typeof i=="string"&&(this.value=i,this.updatePreviewState(i),(e=this.onChange)==null||e.call(this,i),this.hideError())}},window.addEventListener("message",this.messageListener)}cleanupMessageListener(){this.messageListener&&(window.removeEventListener("message",this.messageListener),this.messageListener=null)}destroy(){this.cleanupMessageListener()}showError(t){this.errorContainer&&(this.errorContainer.textContent=t,this.errorContainer.style.display="block",setTimeout(()=>{this.errorContainer&&(this.errorContainer.style.display="none")},5e3))}hideError(){this.errorContainer&&(this.errorContainer.style.display="none")}showLoading(){!this.previewWrapper||!this.loadingSpinner||(this.previewWrapper.classList.add("loading"),this.previewWrapper.style.display="flex",this.loadingSpinner.style.display="block",this.previewEl&&(this.previewEl.style.display="none"))}hideLoading(){!this.previewWrapper||!this.loadingSpinner||(this.previewWrapper.classList.remove("loading"),this.loadingSpinner.style.display="none")}validateFileSize(t){const e=(this.props.maxFileSizeMB||5)*1024*1024;if(t.size>e){const i=this.props.maxFileSizeMB||5,s=(t.size/(1024*1024)).toFixed(1);return this.showError(`File size (${s}MB) exceeds maximum limit of ${i}MB`),!1}return!0}updatePreviewState(t=null){if(!this.previewWrapper||!this.previewEl)return;const e=this.previewWrapper.parentElement,i=e==null?void 0:e.querySelector(".upload-button"),s=e==null?void 0:e.querySelector(".preview-placeholder");if(t&&t!==""){this.showLoading(),s&&s instanceof HTMLElement&&(s.style.display="none"),e&&e.classList.remove("no-image"),i&&(i.innerHTML=`
158
+ `;class T extends p{constructor(t={}){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()}setupMessageListener(){this.messageListener=t=>{var e;if(t.data&&t.data.type==="FILE_MANAGER_IMAGE_SELECTED"&&t.data.settingId===this.id){const i=t.data.imageUrl;i&&typeof i=="string"&&(this.value=i,this.updatePreviewState(i),(e=this.onChange)==null||e.call(this,i),this.hideError())}},window.addEventListener("message",this.messageListener)}cleanupMessageListener(){this.messageListener&&(window.removeEventListener("message",this.messageListener),this.messageListener=null)}setValue(t){super.setValue(t),this.previewWrapper&&this.previewEl&&this.updatePreviewState(t)}destroy(){this.cleanupMessageListener()}showError(t){this.errorContainer&&(this.errorContainer.textContent=t,this.errorContainer.style.display="block",setTimeout(()=>{this.errorContainer&&(this.errorContainer.style.display="none")},5e3))}hideError(){this.errorContainer&&(this.errorContainer.style.display="none")}showLoading(){!this.previewWrapper||!this.loadingSpinner||(this.previewWrapper.classList.add("loading"),this.previewWrapper.style.display="flex",this.loadingSpinner.style.display="block",this.previewEl&&(this.previewEl.style.display="none"))}hideLoading(){!this.previewWrapper||!this.loadingSpinner||(this.previewWrapper.classList.remove("loading"),this.loadingSpinner.style.display="none")}validateFileSize(t){const e=(this.props.maxFileSizeMB||5)*1024*1024;if(t.size>e){const i=this.props.maxFileSizeMB||5,s=(t.size/(1024*1024)).toFixed(1);return this.showError(`File size (${s}MB) exceeds maximum limit of ${i}MB`),!1}return!0}updatePreviewState(t=null){if(!this.previewWrapper||!this.previewEl)return;const e=this.previewWrapper.parentElement,i=e==null?void 0:e.querySelector(".upload-button"),s=e==null?void 0:e.querySelector(".preview-placeholder");if(t&&t!==""){this.showLoading(),s&&s instanceof HTMLElement&&(s.style.display="none"),e&&e.classList.remove("no-image"),i&&(i.innerHTML=`
159
159
  <span class="upload-icon">${I}</span>
160
160
  <span class="upload-label">Replace</span>
161
161
  `);const n=()=>{this.hideLoading(),this.previewWrapper.classList.add("has-image"),this.previewEl.style.display="block",this.previewEl.removeEventListener("load",n),this.previewEl.removeEventListener("error",a)},a=()=>{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)};this.previewEl.addEventListener("load",n),this.previewEl.addEventListener("error",a),this.previewEl.src=t}else 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=`
@@ -186,7 +186,7 @@
186
186
  </svg>`;class ft extends f{constructor(t={}){super({...t,minValue:t.minValue??0,maxValue:t.maxValue??1e3,icon:t.icon||mt,title:t.title||"Margin Bottom",default:t.default??20,wrapperClassName:"margin-bottom-wrapper "+(t.wrapperClassName||"")}),this.inputType="number"}}const vt=`<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
187
187
  <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"
188
188
  stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
189
- </svg>`;class Ct extends f{constructor(t={}){super({...t,minValue:t.minValue??0,maxValue:t.maxValue??1e3,icon:t.icon||vt,title:t.title||"Margin Top",default:t.default??20,wrapperClassName:"margin-top-wrapper "+(t.wrapperClassName||"")}),this.inputType="number"}}class wt extends p{constructor(t){super(t),this.inputType={},this.container=null,this.defaultLanguage="",this.uploadSettings=new Map,t.default?this.value={...t.default}:this.value||(this.value={}),this.defaultLanguage=t.languages.includes(p.DefaultLanguage)?p.DefaultLanguage:t.languages[0];const e=t.defaultValue||`Enter text in ${this.capitalizeFirstLetter(this.defaultLanguage)}`;t.languages.forEach(i=>{var s,n;i in(this.value||{})||(this.value||(this.value={}),i===this.defaultLanguage&&e?this.value[i]=((s=t.default)==null?void 0:s[i])||e:this.value[i]=((n=t.default)==null?void 0:n[i])||"")})}capitalizeFirstLetter(t){return String(t).charAt(0).toUpperCase()+String(t).slice(1)}measureTextWidth(t,e){this.textMeasureCanvas||(this.textMeasureCanvas=document.createElement("canvas"));const i=this.textMeasureCanvas.getContext("2d");if(!i)return t.length*10;const s=`${e.fontStyle} ${e.fontWeight} ${e.fontSize} ${e.fontFamily}`.trim();return i.font=s,i.measureText(t).width}adaptPlaceholderToSingleLine(t,e){const i=window.getComputedStyle(t),s=parseFloat(i.paddingLeft)||0,n=parseFloat(i.paddingRight)||0,a=parseFloat(i.borderLeftWidth)||0,o=parseFloat(i.borderRightWidth)||0,l=Math.max(0,t.clientWidth-s-n-a-o);if(l<=0){t.placeholder=e;return}if(this.measureTextWidth(e,i)<=l){t.placeholder=e;return}const h="...";let d=0,u=e.length,b=0;for(;d<=u;){const E=Math.floor((d+u)/2),F=e.slice(0,E).trimEnd()+h;this.measureTextWidth(F,i)<=l?(b=E,d=E+1):u=E-1}const V=e.slice(0,b).trimEnd()+h;t.placeholder=V}autosizeTextarea(t,e=3){t.style.height="auto";const i=window.getComputedStyle(t),s=parseFloat(i.lineHeight)||20,n=parseFloat(i.paddingTop)+parseFloat(i.paddingBottom),a=parseFloat(i.borderTopWidth)+parseFloat(i.borderBottomWidth),o=s*e+n+a,l=Math.min(t.scrollHeight||44,o);t.style.height=`${l}px`,t.scrollHeight>o?t.style.overflowY="auto":t.style.overflowY="hidden"}createTextareaRow(t,e){const i=document.createElement("div");i.classList.add("simple-multi-language-row");const s=document.createElement("label");if(s.classList.add("simple-language-label"),s.textContent=t.toUpperCase(),s.setAttribute("for",`textarea-${t}`),i.appendChild(s),this.props.multiImg){const n=new H({defaultUrl:e||"",title:"",id:`${this.id}_upload_${t}`});n.setOnChange(o=>{this.updateLanguageValue(t,o),t===this.defaultLanguage&&this.updateOtherLanguagePlaceholders(o)}),this.uploadSettings.set(t,n);const a=n.draw();a.classList.add("simple-language-upload"),i.appendChild(a)}else{const n=document.createElement("textarea");n.id=`textarea-${t}`,n.classList.add("simple-language-textarea"),n.value=e||"",n.rows=1,n.style.overflowY="hidden";let a=this.props.placeholder||"Enter text in {language}...";a.includes("{language}")&&(a=a.replace("{language}",t.toUpperCase())),n.setAttribute("data-full-placeholder",a),this.adaptPlaceholderToSingleLine(n,a),this.getDataPropsPath()&&n.setAttribute("data-test-id",`${this.getDataPropsPath()}_${t}`),n.addEventListener("input",l=>{const r=l.target;this.updateLanguageValue(t,r.value),t===this.defaultLanguage&&this.updateOtherLanguagePlaceholders(r.value),this.autosizeTextarea(r,3);const h=n.getAttribute("data-full-placeholder")||"";h&&this.adaptPlaceholderToSingleLine(n,h)}),i.appendChild(n),(l=>(typeof queueMicrotask=="function"?queueMicrotask:r=>setTimeout(r,0))(l))(()=>{this.autosizeTextarea(n,3);const l=n.getAttribute("data-full-placeholder")||"";l&&this.adaptPlaceholderToSingleLine(n,l)})}return i}updateLanguageValue(t,e){this.value||(this.value={});const i={...this.value,[t]:e};this.setValue(i)}updateOtherLanguagePlaceholders(t){this.container&&this.props.languages.forEach(e=>{var s,n;if(e===this.defaultLanguage)return;const i=(s=this.container)==null?void 0:s.querySelector(`#textarea-${e}`);if(i&&(!i.value||i.value.trim()==="")){const a=t||((n=this.props.placeholder)==null?void 0:n.replace("{language}",e.toUpperCase()))||`Enter text in ${e.toUpperCase()}...`;i.setAttribute("data-full-placeholder",a),this.adaptPlaceholderToSingleLine(i,a)}})}draw(){const t=document.createElement("div");if(t.classList.add("simple-multi-language-wrapper"),this.props.title){const s=document.createElement("div");s.classList.add("simple-multi-language-title"),s.textContent=this.props.title,t.appendChild(s)}const e=document.createElement("div");e.classList.add("simple-multi-language-content"),this.props.languages.forEach(s=>{var o;const n=((o=this.value)==null?void 0:o[s])||"",a=this.createTextareaRow(s,n);e.appendChild(a)}),t.appendChild(e),this.container=t;const i=()=>{if(!this.container)return;this.container.querySelectorAll(".simple-language-textarea").forEach(n=>{const a=n.getAttribute("data-full-placeholder")||"";a&&this.adaptPlaceholderToSingleLine(n,a)})};return window.addEventListener("resize",i),t}setValue(t){super.setValue(t),this.container&&this.props.languages.forEach(e=>{var i;if(this.props.multiImg){const s=this.uploadSettings.get(e);s&&s.setValue((t==null?void 0:t[e])||"")}else{const s=(i=this.container)==null?void 0:i.querySelector(`#textarea-${e}`);s&&(s.value=(t==null?void 0:t[e])||"")}})}}class bt extends p{constructor(t={}){super(t),this.inputType="select";const e=[{name:"None",value:"none"},{name:"Fade",value:"fade 1.5s ease-in-out infinite"},{name:"Slide",value:"slide 1.5s ease-in-out infinite"},{name:"Zoom",value:"zoom 1.5s ease-in-out infinite"},{name:"Bounce",value:"bounce 1.5s ease-in-out infinite"},{name:"Pulse",value:"pulse 1.5s ease-in-out infinite"}];this.selectSetting=new M({title:this.title||"Animation",options:e,default:this.props.default||"none"}),this.selectSetting.onChange=i=>{var s;this.value=i,(s=this.onChange)==null||s.call(this,i)}}draw(){return this.selectSetting.draw()}destroy(){this.selectSetting.destroy(),super.destroy()}}const Et=`
189
+ </svg>`;class Ct extends f{constructor(t={}){super({...t,minValue:t.minValue??0,maxValue:t.maxValue??1e3,icon:t.icon||vt,title:t.title||"Margin Top",default:t.default??20,wrapperClassName:"margin-top-wrapper "+(t.wrapperClassName||"")}),this.inputType="number"}}class wt extends p{constructor(t){super(t),this.inputType={},this.container=null,this.defaultLanguage="",this.uploadSettings=new Map,t.default?this.value={...t.default}:this.value||(this.value={}),this.defaultLanguage=t.languages.includes(p.DefaultLanguage)?p.DefaultLanguage:t.languages[0];const e=t.defaultValue||`Enter text in ${this.capitalizeFirstLetter(this.defaultLanguage)}`;t.languages.forEach(i=>{var s,n;i in(this.value||{})||(this.value||(this.value={}),i===this.defaultLanguage&&e?this.value[i]=((s=t.default)==null?void 0:s[i])||e:this.value[i]=((n=t.default)==null?void 0:n[i])||"")})}capitalizeFirstLetter(t){return String(t).charAt(0).toUpperCase()+String(t).slice(1)}measureTextWidth(t,e){this.textMeasureCanvas||(this.textMeasureCanvas=document.createElement("canvas"));const i=this.textMeasureCanvas.getContext("2d");if(!i)return t.length*10;const s=`${e.fontStyle} ${e.fontWeight} ${e.fontSize} ${e.fontFamily}`.trim();return i.font=s,i.measureText(t).width}adaptPlaceholderToSingleLine(t,e){const i=window.getComputedStyle(t),s=parseFloat(i.paddingLeft)||0,n=parseFloat(i.paddingRight)||0,a=parseFloat(i.borderLeftWidth)||0,o=parseFloat(i.borderRightWidth)||0,l=Math.max(0,t.clientWidth-s-n-a-o);if(l<=0){t.placeholder=e;return}if(this.measureTextWidth(e,i)<=l){t.placeholder=e;return}const h="...";let d=0,u=e.length,b=0;for(;d<=u;){const E=Math.floor((d+u)/2),R=e.slice(0,E).trimEnd()+h;this.measureTextWidth(R,i)<=l?(b=E,d=E+1):u=E-1}const y=e.slice(0,b).trimEnd()+h;t.placeholder=y}autosizeTextarea(t,e=3){t.style.height="auto";const i=window.getComputedStyle(t),s=parseFloat(i.lineHeight)||20,n=parseFloat(i.paddingTop)+parseFloat(i.paddingBottom),a=parseFloat(i.borderTopWidth)+parseFloat(i.borderBottomWidth),o=s*e+n+a,l=Math.min(t.scrollHeight||44,o);t.style.height=`${l}px`,t.scrollHeight>o?t.style.overflowY="auto":t.style.overflowY="hidden"}createTextareaRow(t,e){const i=document.createElement("div");i.classList.add("simple-multi-language-row");const s=document.createElement("label");if(s.classList.add("simple-language-label"),s.textContent=t.toUpperCase(),s.setAttribute("for",`textarea-${t}`),i.appendChild(s),this.props.multiImg){const n=new T({defaultUrl:e||"",title:"",id:`${this.id}_upload_${t}`});n.setOnChange(o=>{this.updateLanguageValue(t,o),t===this.defaultLanguage&&this.updateOtherLanguagePlaceholders(o)}),this.uploadSettings.set(t,n);const a=n.draw();a.classList.add("simple-language-upload"),i.appendChild(a)}else{const n=document.createElement("textarea");n.id=`textarea-${t}`,n.classList.add("simple-language-textarea"),n.value=e||"",n.rows=1,n.style.overflowY="hidden";let a=this.props.placeholder||"Enter text in {language}...";a.includes("{language}")&&(a=a.replace("{language}",t.toUpperCase())),n.setAttribute("data-full-placeholder",a),this.adaptPlaceholderToSingleLine(n,a),this.getDataPropsPath()&&n.setAttribute("data-test-id",`${this.getDataPropsPath()}_${t}`),n.addEventListener("input",l=>{const r=l.target;this.updateLanguageValue(t,r.value),t===this.defaultLanguage&&this.updateOtherLanguagePlaceholders(r.value),this.autosizeTextarea(r,3);const h=n.getAttribute("data-full-placeholder")||"";h&&this.adaptPlaceholderToSingleLine(n,h)}),i.appendChild(n),(l=>(typeof queueMicrotask=="function"?queueMicrotask:r=>setTimeout(r,0))(l))(()=>{this.autosizeTextarea(n,3);const l=n.getAttribute("data-full-placeholder")||"";l&&this.adaptPlaceholderToSingleLine(n,l)})}return i}updateLanguageValue(t,e){this.value||(this.value={});const i={...this.value,[t]:e};this.setValue(i)}updateOtherLanguagePlaceholders(t){this.container&&this.props.languages.forEach(e=>{var s,n;if(e===this.defaultLanguage)return;const i=(s=this.container)==null?void 0:s.querySelector(`#textarea-${e}`);if(i&&(!i.value||i.value.trim()==="")){const a=t||((n=this.props.placeholder)==null?void 0:n.replace("{language}",e.toUpperCase()))||`Enter text in ${e.toUpperCase()}...`;i.setAttribute("data-full-placeholder",a),this.adaptPlaceholderToSingleLine(i,a)}})}draw(){const t=document.createElement("div");if(t.classList.add("simple-multi-language-wrapper"),this.props.title){const s=document.createElement("div");s.classList.add("simple-multi-language-title"),s.textContent=this.props.title,t.appendChild(s)}const e=document.createElement("div");e.classList.add("simple-multi-language-content"),this.props.languages.forEach(s=>{var o;const n=((o=this.value)==null?void 0:o[s])||"",a=this.createTextareaRow(s,n);e.appendChild(a)}),t.appendChild(e),this.container=t;const i=()=>{if(!this.container)return;this.container.querySelectorAll(".simple-language-textarea").forEach(n=>{const a=n.getAttribute("data-full-placeholder")||"";a&&this.adaptPlaceholderToSingleLine(n,a)})};return window.addEventListener("resize",i),t}setValue(t){super.setValue(t),this.container&&this.props.languages.forEach(e=>{var i;if(this.props.multiImg){const s=this.uploadSettings.get(e);s&&s.setValue((t==null?void 0:t[e])||"")}else{const s=(i=this.container)==null?void 0:i.querySelector(`#textarea-${e}`);s&&(s.value=(t==null?void 0:t[e])||"")}})}}class bt extends p{constructor(t={}){super(t),this.inputType="select";const e=[{name:"None",value:"none"},{name:"Fade",value:"fade 1.5s ease-in-out infinite"},{name:"Slide",value:"slide 1.5s ease-in-out infinite"},{name:"Zoom",value:"zoom 1.5s ease-in-out infinite"},{name:"Bounce",value:"bounce 1.5s ease-in-out infinite"},{name:"Pulse",value:"pulse 1.5s ease-in-out infinite"}];this.selectSetting=new S({title:this.title||"Animation",options:e,default:this.props.default||"none"}),this.selectSetting.onChange=i=>{var s;this.value=i,(s=this.onChange)==null||s.call(this,i)}}draw(){return this.selectSetting.draw()}destroy(){this.selectSetting.destroy(),super.destroy()}}const Et=`
190
190
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
191
191
  <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"/>
192
192
  </svg>
@@ -210,13 +210,13 @@
210
210
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
211
211
  <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"/>
212
212
  </svg>
213
- `;class St extends v{constructor(t={}){const{showAlign:e=t.showAlign??!0,...i}=t;super({title:i.title||"Typography",collapsed:i.collapsed,settings:(()=>{const s={color:new C({default:i.colorDefault??"0, 0, 30"}),fontFamily:new M({title:"Font",icon:Lt,default:i.fontFamilyDefault??"Satoshi",options:i.fontFamilyOptions??[{name:"Alt",value:"Croco Sans Black Caps Alt"},{name:"Regular",value:"Croco Sans Caps Regular"},{name:"Caps",value:"Croco Sans Black Caps"},{name:"FaraGo",value:"'FiraGO', sans-serif"}],getOptions:i.fontFamilyGetOptions,getOptionsAsync:i.fontFamilyGetOptionsAsync}),fontWeight:new M({title:"Weight",icon:kt,default:i.fontWeightDefault??"400",options:i.fontWeightOptions??[{name:"Regular",value:"400"},{name:"Medium",value:"500"},{name:"Bold",value:"600"}],getOptions:i.fontWeightGetOptions,getOptionsAsync:i.fontWeightGetOptionsAsync}),fontSize:new f({title:"Size",icon:Mt,default:i.fontSizeDefault??12,suffix:"px",mobile:i.fontSizeMobileDefault})};return e?{...s,align:new D({title:"Align",default:i.alignDefault??"center"})}:s})()})}getCssCode(){var a;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";return`
213
+ `;class St extends v{constructor(t={}){const{showAlign:e=t.showAlign??!0,...i}=t;super({title:i.title||"Typography",collapsed:i.collapsed,settings:(()=>{const s={color:new C({default:i.colorDefault??"0, 0, 30"}),fontFamily:new S({title:"Font",icon:Lt,default:i.fontFamilyDefault??"Satoshi",options:i.fontFamilyOptions??[{name:"Alt",value:"Croco Sans Black Caps Alt"},{name:"Regular",value:"Croco Sans Caps Regular"},{name:"Caps",value:"Croco Sans Black Caps"},{name:"FaraGo",value:"'FiraGO', sans-serif"}],getOptions:i.fontFamilyGetOptions,getOptionsAsync:i.fontFamilyGetOptionsAsync}),fontWeight:new S({title:"Weight",icon:kt,default:i.fontWeightDefault??"400",options:i.fontWeightOptions??[{name:"Regular",value:"400"},{name:"Medium",value:"500"},{name:"Bold",value:"600"}],getOptions:i.fontWeightGetOptions,getOptionsAsync:i.fontWeightGetOptionsAsync}),fontSize:new f({title:"Size",icon:Mt,default:i.fontSizeDefault??12,suffix:"px",mobile:i.fontSizeMobileDefault})};return e?{...s,align:new F({title:"Align",default:i.alignDefault??"center"})}:s})()})}getCssCode(){var a;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";return`
214
214
  color: ${t};
215
215
  font-family: ${e};
216
216
  font-weight: ${i};
217
217
  font-size: ${s}px;
218
218
  text-align: ${n};
219
- `}}class y extends p{constructor(t){super({...t,default:t.default!==void 0?t.default:"auto"}),this.inputType="number",this.value=t.default!==void 0?t.default:"auto"}draw(){const t=this.value==="auto"?"text":"number",e=o=>{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",()=>{const l=this.props.minValue??Number.MIN_SAFE_INTEGER,r=this.props.maxValue??Number.MAX_SAFE_INTEGER;let h=Number(o.value);h<l&&(h=l),h>r&&(h=r),o.value=String(h)}))},i=this.createInput({value:this.value,inputType:t,title:this.props.title,icon:this.props.icon,inputClassName:"number-setting-input "+(this.props.inputClassName||""),wrapperClassName:"number-setting-wrapper "+(this.props.wrapperClassName||""),inputCustomizer:e,placeholder:this.value==="auto"?"auto":""});if(!this.props.suffix||this.props.suffix==="none")return i;i.classList.add("suffix-wrapper");const s=i.querySelector("input.number-setting-input");s&&(s.style.paddingRight="35px");const n=document.createElement("span");n.className="suffix-label",n.textContent=this.props.suffix,i.appendChild(n);const a=i.querySelector("input");return a&&(a.oninput=o=>{const l=o.target.value.trim();if(l.toLowerCase()==="auto")this.value="auto";else{const r=Number(l);isNaN(r)||(this.value=r)}this.onChange&&this.onChange(this.value)}),i}}class Vt extends v{constructor(t){super({title:"Margins",collapsed:t==null?void 0:t.collapsed,settings:{marginTop:new y({title:"Top",icon:It,suffix:"px",default:(t==null?void 0:t.marginTop)??"auto"}),marginRight:new y({title:"Right",icon:Nt,suffix:"px",default:(t==null?void 0:t.marginRight)??0}),marginBottom:new y({title:"Bottom",icon:Ot,suffix:"px",default:(t==null?void 0:t.marginBottom)??0}),marginLeft:new y({title:"Left",icon:Ht,suffix:"px",default:(t==null?void 0:t.marginLeft)??0})}})}getCssCode(){const t=typeof this.settings.marginTop.value=="number"?`${this.settings.marginTop.value}px`:this.settings.marginTop.value,e=typeof this.settings.marginRight.value=="number"?`${this.settings.marginRight.value}px`:this.settings.marginRight.value,i=typeof this.settings.marginBottom.value=="number"?`${this.settings.marginBottom.value}px`:this.settings.marginBottom.value,s=typeof this.settings.marginLeft.value=="number"?`${this.settings.marginLeft.value}px`:this.settings.marginLeft.value;return`
219
+ `}}class L extends p{constructor(t){super({...t,default:t.default!==void 0?t.default:"auto"}),this.inputType="number",this.value=t.default!==void 0?t.default:"auto"}draw(){const t=this.value==="auto"?"text":"number",e=o=>{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",()=>{const l=this.props.minValue??Number.MIN_SAFE_INTEGER,r=this.props.maxValue??Number.MAX_SAFE_INTEGER;let h=Number(o.value);h<l&&(h=l),h>r&&(h=r),o.value=String(h)}))},i=this.createInput({value:this.value,inputType:t,title:this.props.title,icon:this.props.icon,inputClassName:"number-setting-input "+(this.props.inputClassName||""),wrapperClassName:"number-setting-wrapper "+(this.props.wrapperClassName||""),inputCustomizer:e,placeholder:this.value==="auto"?"auto":""});if(!this.props.suffix||this.props.suffix==="none")return i;i.classList.add("suffix-wrapper");const s=i.querySelector("input.number-setting-input");s&&(s.style.paddingRight="35px");const n=document.createElement("span");n.className="suffix-label",n.textContent=this.props.suffix,i.appendChild(n);const a=i.querySelector("input");return a&&(a.oninput=o=>{const l=o.target.value.trim();if(l.toLowerCase()==="auto")this.value="auto";else{const r=Number(l);isNaN(r)||(this.value=r)}this.onChange&&this.onChange(this.value)}),i}}class Vt extends v{constructor(t){super({title:"Margins",collapsed:t==null?void 0:t.collapsed,settings:{marginTop:new L({title:"Top",icon:It,suffix:"px",default:(t==null?void 0:t.marginTop)??"auto"}),marginRight:new L({title:"Right",icon:Nt,suffix:"px",default:(t==null?void 0:t.marginRight)??0}),marginBottom:new L({title:"Bottom",icon:Ot,suffix:"px",default:(t==null?void 0:t.marginBottom)??0}),marginLeft:new L({title:"Left",icon:Ht,suffix:"px",default:(t==null?void 0:t.marginLeft)??0})}})}getCssCode(){const t=typeof this.settings.marginTop.value=="number"?`${this.settings.marginTop.value}px`:this.settings.marginTop.value,e=typeof this.settings.marginRight.value=="number"?`${this.settings.marginRight.value}px`:this.settings.marginRight.value,i=typeof this.settings.marginBottom.value=="number"?`${this.settings.marginBottom.value}px`:this.settings.marginBottom.value,s=typeof this.settings.marginLeft.value=="number"?`${this.settings.marginLeft.value}px`:this.settings.marginLeft.value;return`
220
220
  margin-top: ${t};
221
221
  margin-right: ${e};
222
222
  margin-bottom: ${i};
@@ -229,11 +229,11 @@
229
229
  <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"/>
230
230
  </svg>`,Ht=`<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
231
231
  <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"/>
232
- </svg>`;class Tt extends v{constructor(t){super({title:"Background Image",collapsed:t==null?void 0:t.collapsed,settings:{backgroundImage:new H({...t==null?void 0:t.uploadProps,default:(t==null?void 0:t.backgroundImage)??""}),opacity:new $({default:(t==null?void 0:t.opacity)??100}),backgroundColor:new C({default:(t==null?void 0:t.backgroundColor)??"0, 0, 30"})}})}draw(){const t=super.draw(),e=t.querySelector(".setting-group-content");if(!e)return t;const i=Array.from(e.children),[s,n,a]=i;e.innerHTML="",e.appendChild(s),e.appendChild(n);const o=document.createElement("div");return o.className="bgset-or-label",o.textContent="OR",e.appendChild(o),e.appendChild(a),t}getCssCode(){const t=this.settings.backgroundImage.value||"",e=this.settings.opacity.value??100,i=this.settings.backgroundColor.value||"#000000";return t?`
232
+ </svg>`;class Tt extends v{constructor(t){super({title:"Background Image",collapsed:t==null?void 0:t.collapsed,settings:{backgroundImage:new T({...t==null?void 0:t.uploadProps,default:(t==null?void 0:t.backgroundImage)??""}),opacity:new D({default:(t==null?void 0:t.opacity)??100}),backgroundColor:new C({default:(t==null?void 0:t.backgroundColor)??"0, 0, 30"})}})}draw(){const t=super.draw(),e=t.querySelector(".setting-group-content");if(!e)return t;const i=Array.from(e.children),[s,n,a]=i;e.innerHTML="",e.appendChild(s),e.appendChild(n);const o=document.createElement("div");return o.className="bgset-or-label",o.textContent="OR",e.appendChild(o),e.appendChild(a),t}getCssCode(){const t=this.settings.backgroundImage.value||"",e=this.settings.opacity.value??100,i=this.settings.backgroundColor.value||"#000000";return t?`
233
233
  background-image: url("${t}");
234
234
  background-size: cover;
235
235
  background-position: center;
236
236
  opacity: ${e/100};
237
237
  `:`
238
238
  background-color: ${i};
239
- `}}exports.AlignSetting=D;exports.AnimationSetting=bt;exports.BackgroundSettingSet=Tt;exports.BorderSettingSet=yt;exports.ButtonSetting=Q;exports.ColorSetting=m;exports.ColorWithOpacitySetting=C;exports.DimensionSetting=tt;exports.GapSetting=gt;exports.HeaderTypographySettingSet=St;exports.HeightSetting=ot;exports.HtmlSetting=K;exports.MarginBottomSetting=ft;exports.MarginSettingGroup=Vt;exports.MarginTopSetting=Ct;exports.MultiLanguageSetting=wt;exports.NumberSetting=f;exports.OpacitySetting=$;exports.SelectApiSettings=dt;exports.SelectSetting=M;exports.Setting=p;exports.SettingGroup=v;exports.StringSetting=B;exports.TabSettingGroup=O;exports.TabsSettingGroup=O;exports.Toggle=ut;exports.UploadSetting=H;exports.WidthSetting=rt;exports.asSettingGroupWithSettings=J;exports.createSettingGroup=A;exports.createTabSettingGroup=U;exports.isSetting=w;exports.isSettingChild=j;exports.isSettingGroup=g;exports.iterateSettings=x;
239
+ `}}exports.AlignSetting=F;exports.AnimationSetting=bt;exports.BackgroundSettingSet=Tt;exports.BorderSettingSet=yt;exports.ButtonSetting=Q;exports.ColorSetting=m;exports.ColorWithOpacitySetting=C;exports.DimensionSetting=tt;exports.GapSetting=gt;exports.HeaderTypographySettingSet=St;exports.HeightSetting=ot;exports.HtmlSetting=K;exports.MarginBottomSetting=ft;exports.MarginSettingGroup=Vt;exports.MarginTopSetting=Ct;exports.MultiLanguageSetting=wt;exports.NumberSetting=f;exports.OpacitySetting=D;exports.SelectApiSettings=dt;exports.SelectSetting=S;exports.Setting=p;exports.SettingGroup=v;exports.StringSetting=$;exports.TabSettingGroup=H;exports.TabsSettingGroup=H;exports.Toggle=ut;exports.UploadSetting=T;exports.WidthSetting=rt;exports.asSettingGroupWithSettings=J;exports.createSettingGroup=B;exports.createTabSettingGroup=U;exports.isSetting=w;exports.isSettingChild=O;exports.isSettingGroup=g;exports.iterateSettings=x;
@@ -1,35 +1,35 @@
1
- const A = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";
2
- let H = (c = 21) => {
1
+ const B = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";
2
+ let T = (c = 21) => {
3
3
  let t = "", e = crypto.getRandomValues(new Uint8Array(c |= 0));
4
4
  for (; c--; )
5
- t += A[e[c] & 63];
5
+ t += B[e[c] & 63];
6
6
  return t;
7
7
  };
8
- function B(c) {
8
+ function $(c) {
9
9
  let t = 0, e = c.parentElement;
10
10
  for (; e; )
11
11
  e.classList.contains("setting-group") && e !== c && t++, e = e.parentElement;
12
12
  return t;
13
13
  }
14
- function L(c, t) {
14
+ function k(c, t) {
15
15
  const e = Math.min(Math.max(t, 0), 5);
16
16
  c.setAttribute("data-nesting-level", e.toString()), e > 0 ? c.style.setProperty("--visual-indent", `${e * 2}px`) : (c.style.removeProperty("--visual-indent"), c.style.marginLeft = "");
17
17
  }
18
18
  function S(c, t = 0) {
19
19
  c.querySelectorAll(":scope > .setting-group-content > .setting-group").forEach((i) => {
20
20
  const s = i, n = t + 1;
21
- L(s, n), S(s, n);
21
+ k(s, n), S(s, n);
22
22
  });
23
23
  }
24
- const $ = {
24
+ const D = {
25
25
  maxLevel: 5,
26
26
  spacingMultiplier: 1,
27
27
  visualIndentMultiplier: 2,
28
28
  enableAutoDetection: !0
29
29
  };
30
- class D {
30
+ class F {
31
31
  constructor(t = {}) {
32
- this.observedElements = /* @__PURE__ */ new Set(), this.config = { ...$, ...t }, this.config.enableAutoDetection && this.setupAutoDetection();
32
+ this.observedElements = /* @__PURE__ */ new Set(), this.config = { ...D, ...t }, this.config.enableAutoDetection && this.setupAutoDetection();
33
33
  }
34
34
  /**
35
35
  * Setup automatic detection using MutationObserver
@@ -63,7 +63,7 @@ class D {
63
63
  * Update nesting for a specific element
64
64
  */
65
65
  updateElementNesting(t) {
66
- const e = B(t);
66
+ const e = $(t);
67
67
  this.applyNestingWithConfig(t, e);
68
68
  }
69
69
  /**
@@ -111,20 +111,20 @@ class D {
111
111
  this.observer && (this.observer.disconnect(), this.observer = void 0), this.observedElements.clear();
112
112
  }
113
113
  }
114
- const O = new D();
115
- function k(c) {
114
+ const O = new F();
115
+ function M(c) {
116
116
  if (c === null || typeof c != "object") return c;
117
117
  if (c instanceof Date) return new Date(c.getTime());
118
- if (c instanceof Array) return c.map((t) => k(t));
118
+ if (c instanceof Array) return c.map((t) => M(t));
119
119
  if (typeof c == "object") {
120
120
  const t = {};
121
121
  for (const e in c)
122
- Object.prototype.hasOwnProperty.call(c, e) && (t[e] = k(c[e]));
122
+ Object.prototype.hasOwnProperty.call(c, e) && (t[e] = M(c[e]));
123
123
  return t;
124
124
  }
125
125
  return c;
126
126
  }
127
- function F(c) {
127
+ function R(c) {
128
128
  switch (c) {
129
129
  case "number":
130
130
  return 0;
@@ -144,7 +144,7 @@ function F(c) {
144
144
  }
145
145
  class p {
146
146
  constructor(t = {}) {
147
- this.props = t, this.dataPropsPath = "", this.id = t.id || H(), this.value = this.props.default, this.desktop = this.props.default, this.title = t.title || "", this.includeGetJson = t.includeGetJson !== void 0 ? t.includeGetJson : !0;
147
+ this.props = t, this.dataPropsPath = "", this.id = t.id || T(), this.value = this.props.default, this.desktop = this.props.default, this.title = t.title || "", this.includeGetJson = t.includeGetJson !== void 0 ? t.includeGetJson : !0;
148
148
  }
149
149
  static SetUploadUrl(t) {
150
150
  globalThis.DefaultUploadUrl = t, p.DefaultUploadUrl = t;
@@ -171,8 +171,8 @@ class p {
171
171
  this.value = t, this.inputEl && (this.inputEl.value = String(t)), this.onChange && this.onChange(t), this.props.detectChange && this.props.detectChange(t);
172
172
  }
173
173
  clone() {
174
- const t = this.constructor, e = k(this.props), i = new t(e);
175
- return i.value = k(this.value), i;
174
+ const t = this.constructor, e = M(this.props), i = new t(e);
175
+ return i.value = M(this.value), i;
176
176
  }
177
177
  createInput(t) {
178
178
  t = { ...this.props.inputProps, ...t };
@@ -192,7 +192,7 @@ class p {
192
192
  const i = document.createElement("div");
193
193
  i.className = t.wrapperClassName || "";
194
194
  const s = document.createElement("input");
195
- this.inputEl = s, s.value = String(t.value || F(t.inputType)), s.type = t.inputType, s.placeholder = t.placeholder || "", s.className = t.inputClassName || "", this.dataPropsPath && s.setAttribute("data-test-id", this.dataPropsPath);
195
+ this.inputEl = s, s.value = String(t.value || R(t.inputType)), s.type = t.inputType, s.placeholder = t.placeholder || "", s.className = t.inputClassName || "", this.dataPropsPath && s.setAttribute("data-test-id", this.dataPropsPath);
196
196
  const n = (o) => {
197
197
  const l = o.target;
198
198
  let r = l.value;
@@ -239,24 +239,24 @@ function E(c) {
239
239
  function g(c) {
240
240
  return c instanceof v;
241
241
  }
242
- function ft(c) {
242
+ function H(c) {
243
243
  return E(c) || g(c);
244
244
  }
245
- function x(c, t) {
245
+ function y(c, t) {
246
246
  for (const e in c)
247
247
  if (Object.prototype.hasOwnProperty.call(c, e)) {
248
248
  const i = c[e];
249
249
  t(e, i);
250
250
  }
251
251
  }
252
- const M = class M {
252
+ const V = class V {
253
253
  constructor(t) {
254
254
  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 = () => {
255
- }, this.pendingBlurHandler = null, this.originalDefaultValues = {}, this.nestingLevel = 0, this.dataPropsPath = "", this.id = t.id || H(), this.title = t.title, this.settings = t.settings, this.isCollapsed = t.collapsed ?? !1, this.isMain = t.main ?? !1, this.custom = t.custom ?? !1, this.nestingLevel = 0, this.includeGetJson = t.includeGetJson ?? !0, this.addItemCfg = t.addItem, this.deleteItemCfg = t.deleteItem, this.dataProps = t.dataProps, this.dataPropsPath = t.dataProps || "", Object.assign(this, t.settings), this.initialValues = this.getValues(), this.originalDefaultValues = this.getDefaultValues(), this.propagateNestingLevel(), this.propagateDataPropsPath();
255
+ }, this.pendingBlurHandler = null, this.originalDefaultValues = {}, this.nestingLevel = 0, this.dataPropsPath = "", this.id = t.id || T(), this.title = t.title, this.settings = t.settings, this.isCollapsed = t.collapsed ?? !1, this.isMain = t.main ?? !1, this.custom = t.custom ?? !1, this.nestingLevel = 0, this.includeGetJson = t.includeGetJson ?? !0, this.addItemCfg = t.addItem, this.deleteItemCfg = t.deleteItem, this.dataProps = t.dataProps, this.dataPropsPath = t.dataProps || "", Object.assign(this, t.settings), this.initialValues = this.getValues(), this.originalDefaultValues = this.getDefaultValues(), this.propagateNestingLevel(), this.propagateDataPropsPath();
256
256
  }
257
257
  propagateNestingLevel() {
258
258
  const t = this.nestingLevel + 1;
259
- x(this.settings, (e, i) => {
259
+ y(this.settings, (e, i) => {
260
260
  g(i) && (i.nestingLevel = t, i.propagateNestingLevel());
261
261
  });
262
262
  }
@@ -273,13 +273,13 @@ const M = class M {
273
273
  this.dataPropsPath = t, this.propagateDataPropsPath();
274
274
  }
275
275
  propagateDataPropsPath() {
276
- x(this.settings, (t, e) => {
276
+ y(this.settings, (t, e) => {
277
277
  const i = String(t), s = this.dataPropsPath ? `${this.dataPropsPath}_${i}` : i;
278
278
  (g(e) || E(e) && typeof e.setDataPropsPath == "function") && e.setDataPropsPath(s);
279
279
  });
280
280
  }
281
281
  updateNestingStyles() {
282
- this.elementRef && (L(this.elementRef, this.nestingLevel), S(this.elementRef, this.nestingLevel));
282
+ this.elementRef && (k(this.elementRef, this.nestingLevel), S(this.elementRef, this.nestingLevel));
283
283
  }
284
284
  forceChildUIRefresh() {
285
285
  Object.entries(this.settings).forEach(([t, e]) => {
@@ -328,7 +328,7 @@ const M = class M {
328
328
  }
329
329
  clone() {
330
330
  const t = {};
331
- x(this.settings, (s, n) => {
331
+ y(this.settings, (s, n) => {
332
332
  const a = String(s);
333
333
  typeof n.clone == "function" ? t[a] = n.clone() : (console.warn(
334
334
  `Setting with key '${a}' does not have a clone method. Copying reference.`
@@ -344,7 +344,7 @@ const M = class M {
344
344
  addItem: this.addItemCfg,
345
345
  deleteItem: this.deleteItemCfg,
346
346
  dataProps: this.dataProps
347
- }, i = z(e);
347
+ }, i = W(e);
348
348
  return i.initialValues = this.getValues(), i;
349
349
  }
350
350
  resetDefault() {
@@ -390,7 +390,7 @@ const M = class M {
390
390
  Object.keys(s).length > 0 && (this.lastChangeTime = Date.now(), this.initialValues = i, t(i), this.updateVisibility()), this.isHandlingChange = !1;
391
391
  }, 50));
392
392
  };
393
- return this.changeHandlers.clear(), x(this.settings, (i, s) => {
393
+ return this.changeHandlers.clear(), y(this.settings, (i, s) => {
394
394
  var n;
395
395
  if (g(s))
396
396
  s.setOnChange(() => {
@@ -420,7 +420,7 @@ const M = class M {
420
420
  const a = i.slice(this.addItemCfg.keyPrefix.length), o = Number(a);
421
421
  if (Number.isFinite(o)) {
422
422
  const l = this.addItemCfg.createItem(o);
423
- this.addSetting(i, l), n = l;
423
+ H(l) && (this.addSetting(i, l), n = l);
424
424
  }
425
425
  }
426
426
  n && (g(n) || E(n)) && typeof n.setValue == "function" && n.setValue(s);
@@ -453,7 +453,7 @@ const M = class M {
453
453
  d && t.startsWith(d) && this.addDeleteButtonToElement(o, t);
454
454
  }
455
455
  const r = a.querySelector(".sg-add-button-bottom");
456
- r ? a.insertBefore(o, r) : a.appendChild(o), O.trackElement(o), L(o, this.nestingLevel + 1), S(o, this.nestingLevel + 1);
456
+ r ? a.insertBefore(o, r) : a.appendChild(o), O.trackElement(o), k(o, this.nestingLevel + 1), S(o, this.nestingLevel + 1);
457
457
  const h = o.style.display;
458
458
  o.style.display = "none", o.offsetHeight, o.style.display = h, this.updateNestingStyles();
459
459
  }
@@ -694,7 +694,7 @@ const M = class M {
694
694
  }
695
695
  draw() {
696
696
  const t = document.createElement("div");
697
- t.className = "setting-group", t.id = `setting-group-${this.id}`, M.hiddenElements.add(t), this.isMain && t.classList.add("main-group"), this.custom && t.classList.add("custom_class"), L(t, this.nestingLevel);
697
+ t.className = "setting-group", t.id = `setting-group-${this.id}`, V.hiddenElements.add(t), this.isMain && t.classList.add("main-group"), this.custom && t.classList.add("custom_class"), k(t, this.nestingLevel);
698
698
  const e = document.createElement("div");
699
699
  e.className = "setting-group-title", this.isCollapsed && e.classList.add("collapsed-view"), e.setAttribute("role", "button"), e.setAttribute(
700
700
  "aria-expanded",
@@ -749,8 +749,11 @@ const M = class M {
749
749
  </svg>`;
750
750
  h.innerHTML = `${d}<span style="margin-left:4px;">${this.addItemCfg.buttonLabel ?? "Add"}</span>`, h.addEventListener("click", (u) => {
751
751
  u.stopPropagation(), u.preventDefault();
752
- const w = this.getNextIndexFromPrefix(this.addItemCfg.keyPrefix), V = this.addItemCfg.createItem(w), b = `${this.addItemCfg.keyPrefix}${w}`;
753
- this.addSetting(b, V);
752
+ const w = this.getNextIndexFromPrefix(this.addItemCfg.keyPrefix), x = this.addItemCfg.createItem(w);
753
+ if (H(x)) {
754
+ const b = `${this.addItemCfg.keyPrefix}${w}`;
755
+ this.addSetting(b, x);
756
+ }
754
757
  }), o.appendChild(h);
755
758
  }
756
759
  return e.appendChild(i), e.appendChild(n), t.appendChild(e), t.appendChild(o), this.elementRef = t, O.trackElement(t), setTimeout(() => {
@@ -795,12 +798,12 @@ const M = class M {
795
798
  }
796
799
  }
797
800
  };
798
- M.hiddenElements = /* @__PURE__ */ new Set();
799
- let v = M;
801
+ V.hiddenElements = /* @__PURE__ */ new Set();
802
+ let v = V;
800
803
  function vt(c) {
801
- return new R(c);
804
+ return new z(c);
802
805
  }
803
- class R extends v {
806
+ class z extends v {
804
807
  constructor(t) {
805
808
  super(t);
806
809
  const e = Object.keys(this.settings)[0];
@@ -851,13 +854,13 @@ class R extends v {
851
854
  return this.updateTabUI(), t;
852
855
  }
853
856
  }
854
- function z(c) {
857
+ function W(c) {
855
858
  return new v(c);
856
859
  }
857
860
  function Ct(c) {
858
861
  return c;
859
862
  }
860
- class W extends p {
863
+ class G extends p {
861
864
  constructor(t = {}) {
862
865
  super(t), this.inputType = "text", t.onChange && this.setOnChange(t.onChange);
863
866
  }
@@ -877,12 +880,12 @@ class W extends p {
877
880
  });
878
881
  }
879
882
  }
880
- const G = "<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>";
881
- class m extends W {
883
+ const _ = "<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>";
884
+ class m extends G {
882
885
  constructor(t) {
883
886
  super({
884
887
  ...t,
885
- icon: t.icon || G,
888
+ icon: t.icon || _,
886
889
  title: t.title || "Color",
887
890
  default: t.default ? m.normalizeColorValue(t.default) : "#000000"
888
891
  }), this.inputType = "color", this.element = null, this.colorInputEl = null, this.textInputEl = null, this.detectChange = t.detectChange;
@@ -981,7 +984,7 @@ class m extends W {
981
984
  return this.isValidHex() ? this.hexToRgb(this.value) : "0, 0, 0";
982
985
  }
983
986
  }
984
- const _ = `
987
+ const j = `
985
988
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
986
989
  <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"/>
987
990
  <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"/>
@@ -991,7 +994,7 @@ class C extends p {
991
994
  constructor(t = {}) {
992
995
  super({
993
996
  ...t,
994
- icon: t.icon || _,
997
+ icon: t.icon || j,
995
998
  title: t.title || "Color & Opacity",
996
999
  default: t.default || "#000000FF"
997
1000
  }), 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));
@@ -1200,12 +1203,12 @@ class f extends p {
1200
1203
  );
1201
1204
  }
1202
1205
  }
1203
- const j = `
1206
+ const U = `
1204
1207
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1205
1208
  <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"/>
1206
1209
  <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"/>
1207
1210
  </svg>`;
1208
- class U extends f {
1211
+ class J extends f {
1209
1212
  constructor(t = {}) {
1210
1213
  const e = {
1211
1214
  title: "Opacity",
@@ -1214,7 +1217,7 @@ class U extends f {
1214
1217
  maxValue: 100,
1215
1218
  step: 1,
1216
1219
  default: t.default ?? 100,
1217
- icon: j,
1220
+ icon: U,
1218
1221
  ...t
1219
1222
  };
1220
1223
  super(e), this.inputType = "number", this.mobileValue = t.mobile;
@@ -1226,7 +1229,7 @@ class U extends f {
1226
1229
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1227
1230
  }
1228
1231
  }
1229
- const J = `
1232
+ const q = `
1230
1233
  <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">
1231
1234
  <polyline points="6 9 12 15 18 9"></polyline>
1232
1235
  </svg>
@@ -1275,7 +1278,7 @@ class N extends p {
1275
1278
  o.onclick = (l) => this.selectOption(l, a, e), i.appendChild(o);
1276
1279
  }), document.body.appendChild(i);
1277
1280
  const s = document.createElement("div");
1278
- return s.classList.add("svg-container"), s.innerHTML = J, t.appendChild(s), this.optionsListEl = i, this.svgContainer = s, this.props.getOptionsAsync && (this.isLoading = !0, this.updateButtonText(), this.props.getOptionsAsync().then((n) => {
1281
+ return s.classList.add("svg-container"), s.innerHTML = q, t.appendChild(s), this.optionsListEl = i, this.svgContainer = s, this.props.getOptionsAsync && (this.isLoading = !0, this.updateButtonText(), this.props.getOptionsAsync().then((n) => {
1279
1282
  this._options.push(...n), this.isLoading = !1, this.updateOptionsList(), this.updateButtonText();
1280
1283
  }).catch((n) => {
1281
1284
  console.error("Failed to fetch async options:", n), this.isLoading = !1, this.updateButtonText("Failed to load options");
@@ -1303,10 +1306,10 @@ class N extends p {
1303
1306
  }
1304
1307
  }
1305
1308
  selectOption(t, e, i) {
1306
- var n, a, o;
1309
+ var n, a;
1307
1310
  const s = this._options[e];
1308
- 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, h) => {
1309
- h === e ? r.classList.add("selected") : r.classList.remove("selected");
1311
+ s && (this.setValue(s.value), this.selectedOptionIndex = e, this.isOpen = !1, i.textContent = s.name, (n = this.optionsListEl) == null || n.classList.remove("open"), (a = this.svgContainer) == null || a.classList.remove("open"), this.cleanupDropdownPosition(), this.optionsListEl && this.optionsListEl.querySelectorAll(".select-option").forEach((l, r) => {
1312
+ r === e ? l.classList.add("selected") : l.classList.remove("selected");
1310
1313
  }));
1311
1314
  }
1312
1315
  /**
@@ -1344,7 +1347,7 @@ class N extends p {
1344
1347
  this.clickOutsideListener && (document.removeEventListener("click", this.clickOutsideListener), this.clickOutsideListener = null), this.resizeListener && (window.removeEventListener("resize", this.resizeListener), this.resizeListener = null), this.cleanupDropdownPosition(), this.optionsListEl && this.optionsListEl.parentNode && this.optionsListEl.parentNode.removeChild(this.optionsListEl), super.destroy();
1345
1348
  }
1346
1349
  }
1347
- class q extends p {
1350
+ class Z extends p {
1348
1351
  constructor(t = {}) {
1349
1352
  super(t), this.inputType = "button", this.value || (this.value = "center");
1350
1353
  }
@@ -1442,14 +1445,14 @@ class Et extends p {
1442
1445
  suffix: "px",
1443
1446
  minValue: this.minWidth,
1444
1447
  maxValue: this.maxWidth,
1445
- icon: Z
1448
+ icon: K
1446
1449
  }), this.heightSetting = new f({
1447
1450
  title: "Height",
1448
1451
  default: this.value.height,
1449
1452
  suffix: "px",
1450
1453
  minValue: this.minHeight,
1451
1454
  maxValue: this.maxHeight,
1452
- icon: K
1455
+ icon: X
1453
1456
  }), this.widthSetting.setOnChange(this.handleWidthChange.bind(this)), this.heightSetting.setOnChange(this.handleHeightChange.bind(this));
1454
1457
  }
1455
1458
  handleWidthChange(t) {
@@ -1543,24 +1546,24 @@ class Et extends p {
1543
1546
  }
1544
1547
  }
1545
1548
  }
1546
- const Z = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1549
+ const K = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1547
1550
  <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"/>
1548
- </svg>`, K = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1551
+ </svg>`, X = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1549
1552
  <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"/>
1550
1553
  </svg>`, I = `
1551
1554
  <svg xmlns="http://www.w3.org/2000/svg" width="15" height="16" viewBox="0 0 15 16" fill="none">
1552
1555
  <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"/>
1553
1556
  </svg>
1554
- `, X = `
1557
+ `, Y = `
1555
1558
  <svg width="91" height="71" viewBox="0 0 91 71" fill="none" xmlns="http://www.w3.org/2000/svg">
1556
1559
  <rect width="91" height="71" rx="4" fill="#F2F4F7"/>
1557
1560
  <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"/>
1558
1561
  </svg>
1559
- `, Y = `
1562
+ `, Q = `
1560
1563
  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 12 12" fill="none">
1561
1564
  <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"/>
1562
1565
  </svg>
1563
- `, Q = `
1566
+ `, tt = `
1564
1567
  <svg xmlns="http://www.w3.org/2000/svg" width="29" height="29" viewBox="0 0 29 29" fill="none">
1565
1568
  <!-- Top dot -->
1566
1569
  <circle cx="14.5" cy="3" r="1.5" fill="#02CC59" opacity="1"/>
@@ -1580,7 +1583,7 @@ const Z = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBo
1580
1583
  <circle cx="6.7" cy="6.7" r="1.5" fill="#02CC59" opacity="0.3"/>
1581
1584
  </svg>
1582
1585
  `;
1583
- class T extends p {
1586
+ class P extends p {
1584
1587
  constructor(t = {}) {
1585
1588
  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();
1586
1589
  }
@@ -1596,6 +1599,9 @@ class T extends p {
1596
1599
  cleanupMessageListener() {
1597
1600
  this.messageListener && (window.removeEventListener("message", this.messageListener), this.messageListener = null);
1598
1601
  }
1602
+ setValue(t) {
1603
+ super.setValue(t), this.previewWrapper && this.previewEl && this.updatePreviewState(t);
1604
+ }
1599
1605
  destroy() {
1600
1606
  this.cleanupMessageListener();
1601
1607
  }
@@ -1674,9 +1680,9 @@ class T extends p {
1674
1680
  const s = this.value && this.value !== "";
1675
1681
  s || i.classList.add("no-image");
1676
1682
  const n = document.createElement("div");
1677
- if (n.className = "preview-placeholder", n.innerHTML = X, 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) {
1683
+ if (n.className = "preview-placeholder", n.innerHTML = Y, this.previewWrapper = document.createElement("div"), this.previewWrapper.className = "preview-wrapper", this.loadingSpinner = document.createElement("div"), this.loadingSpinner.className = "loading-spinner", this.loadingSpinner.innerHTML = tt, this.loadingSpinner.style.display = "none", this.previewWrapper.appendChild(this.loadingSpinner), this.previewEl = document.createElement("img"), this.previewEl.className = "upload-preview", this.props.delete) {
1678
1684
  const o = document.createElement("button");
1679
- o.className = "delete-button", o.type = "button", o.title = "Delete image", o.innerHTML = Y, this.previewWrapper.appendChild(o), o.onclick = (l) => {
1685
+ o.className = "delete-button", o.type = "button", o.title = "Delete image", o.innerHTML = Q, this.previewWrapper.appendChild(o), o.onclick = (l) => {
1680
1686
  var r;
1681
1687
  l.stopPropagation(), this.value = "", this.updatePreviewState(null), (r = this.onChange) == null || r.call(this, ""), this.hideError();
1682
1688
  };
@@ -1704,7 +1710,7 @@ class xt extends f {
1704
1710
  title: t.title || "Height",
1705
1711
  suffix: t.suffix || "px",
1706
1712
  minValue: t.minValue ?? 0,
1707
- icon: t.icon || tt,
1713
+ icon: t.icon || et,
1708
1714
  default: t.default ?? 100
1709
1715
  }), this.inputType = "number", this.mobileValue = t.mobile;
1710
1716
  }
@@ -1715,7 +1721,7 @@ class xt extends f {
1715
1721
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1716
1722
  }
1717
1723
  }
1718
- const tt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1724
+ const et = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1719
1725
  <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"/>
1720
1726
  </svg>`;
1721
1727
  class yt extends f {
@@ -1725,7 +1731,7 @@ class yt extends f {
1725
1731
  title: t.title || "Width",
1726
1732
  suffix: t.suffix || "px",
1727
1733
  minValue: t.minValue ?? 0,
1728
- icon: t.icon || et,
1734
+ icon: t.icon || it,
1729
1735
  default: t.default ?? 100
1730
1736
  }), this.inputType = "number", this.mobileValue = t.mobile;
1731
1737
  }
@@ -1736,9 +1742,9 @@ class yt extends f {
1736
1742
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1737
1743
  }
1738
1744
  }
1739
- const et = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1745
+ const it = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1740
1746
  <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"/>
1741
- </svg>`, it = `
1747
+ </svg>`, st = `
1742
1748
  <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">
1743
1749
  <polyline points="6 9 12 15 18 9"></polyline>
1744
1750
  </svg>
@@ -1798,7 +1804,7 @@ class Lt extends p {
1798
1804
  o.onclick = (l) => this.selectApiOption(l, a, e), i.appendChild(o);
1799
1805
  }), t.appendChild(i);
1800
1806
  const s = document.createElement("div");
1801
- return s.classList.add("svg-container"), s.innerHTML = it, t.appendChild(s), s.onclick = () => {
1807
+ return s.classList.add("svg-container"), s.innerHTML = st, t.appendChild(s), s.onclick = () => {
1802
1808
  var n, a;
1803
1809
  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));
1804
1810
  }, this.optionsListEl = i, this.svgContainer = s, this.props.getOptionsAsync && !this.hasInitializedOptions ? (this.isLoading = !0, this.updateButtonText(), this.props.getOptionsAsync().then((n) => {
@@ -1935,13 +1941,13 @@ class kt extends p {
1935
1941
  this.detectChangeCallback = t;
1936
1942
  }
1937
1943
  }
1938
- const st = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
1944
+ const nt = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
1939
1945
  <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"/>
1940
1946
  </svg>`;
1941
1947
  class Mt extends p {
1942
1948
  // Store mobile value
1943
1949
  constructor(t = {}) {
1944
- t.rowGap = t.rowGap ?? !0, t.columnGap = t.columnGap ?? !0, t.title = t.title ?? "Gap", t.icon = t.icon ?? st, 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);
1950
+ t.rowGap = t.rowGap ?? !0, t.columnGap = t.columnGap ?? !0, t.title = t.title ?? "Gap", t.icon = t.icon ?? nt, 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);
1945
1951
  }
1946
1952
  draw() {
1947
1953
  const t = document.createElement("div");
@@ -1992,7 +1998,7 @@ class Mt extends p {
1992
1998
  this.mobileValue = t, t !== void 0 && this.setValue(t);
1993
1999
  }
1994
2000
  }
1995
- const nt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2001
+ const at = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
1996
2002
  <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"/>
1997
2003
  </svg>`;
1998
2004
  class Vt extends f {
@@ -2001,14 +2007,14 @@ class Vt extends f {
2001
2007
  ...t,
2002
2008
  minValue: t.minValue ?? 0,
2003
2009
  maxValue: t.maxValue ?? 1e3,
2004
- icon: t.icon || nt,
2010
+ icon: t.icon || at,
2005
2011
  title: t.title || "Margin Bottom",
2006
2012
  default: t.default ?? 20,
2007
2013
  wrapperClassName: "margin-bottom-wrapper " + (t.wrapperClassName || "")
2008
2014
  }), this.inputType = "number";
2009
2015
  }
2010
2016
  }
2011
- const at = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2017
+ const ot = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2012
2018
  <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"
2013
2019
  stroke="#667085" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
2014
2020
  </svg>`;
@@ -2018,7 +2024,7 @@ class It extends f {
2018
2024
  ...t,
2019
2025
  minValue: t.minValue ?? 0,
2020
2026
  maxValue: t.maxValue ?? 1e3,
2021
- icon: t.icon || at,
2027
+ icon: t.icon || ot,
2022
2028
  title: t.title || "Margin Top",
2023
2029
  default: t.default ?? 20,
2024
2030
  wrapperClassName: "margin-top-wrapper " + (t.wrapperClassName || "")
@@ -2060,11 +2066,11 @@ class St extends p {
2060
2066
  const h = "...";
2061
2067
  let d = 0, u = e.length, w = 0;
2062
2068
  for (; d <= u; ) {
2063
- const b = Math.floor((d + u) / 2), P = e.slice(0, b).trimEnd() + h;
2064
- this.measureTextWidth(P, i) <= l ? (w = b, d = b + 1) : u = b - 1;
2069
+ const b = Math.floor((d + u) / 2), A = e.slice(0, b).trimEnd() + h;
2070
+ this.measureTextWidth(A, i) <= l ? (w = b, d = b + 1) : u = b - 1;
2065
2071
  }
2066
- const V = e.slice(0, w).trimEnd() + h;
2067
- t.placeholder = V;
2072
+ const x = e.slice(0, w).trimEnd() + h;
2073
+ t.placeholder = x;
2068
2074
  }
2069
2075
  autosizeTextarea(t, e = 3) {
2070
2076
  t.style.height = "auto";
@@ -2076,7 +2082,7 @@ class St extends p {
2076
2082
  i.classList.add("simple-multi-language-row");
2077
2083
  const s = document.createElement("label");
2078
2084
  if (s.classList.add("simple-language-label"), s.textContent = t.toUpperCase(), s.setAttribute("for", `textarea-${t}`), i.appendChild(s), this.props.multiImg) {
2079
- const n = new T({
2085
+ const n = new P({
2080
2086
  defaultUrl: e || "",
2081
2087
  title: "",
2082
2088
  id: `${this.id}_upload_${t}`
@@ -2195,11 +2201,11 @@ class Nt extends p {
2195
2201
  this.selectSetting.destroy(), super.destroy();
2196
2202
  }
2197
2203
  }
2198
- const ot = `
2204
+ const lt = `
2199
2205
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2200
2206
  <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"/>
2201
2207
  </svg>
2202
- `, lt = `
2208
+ `, rt = `
2203
2209
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2204
2210
  <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"/>
2205
2211
  </svg>
@@ -2212,7 +2218,7 @@ class Ot extends v {
2212
2218
  settings: {
2213
2219
  size: new f({
2214
2220
  title: "Size",
2215
- icon: lt,
2221
+ icon: rt,
2216
2222
  default: (t == null ? void 0 : t.size) ?? 0,
2217
2223
  suffix: "px"
2218
2224
  }),
@@ -2221,7 +2227,7 @@ class Ot extends v {
2221
2227
  }),
2222
2228
  radius: new f({
2223
2229
  title: "Radius",
2224
- icon: ot,
2230
+ icon: lt,
2225
2231
  default: (t == null ? void 0 : t.radius) ?? 12,
2226
2232
  suffix: "px"
2227
2233
  })
@@ -2240,15 +2246,15 @@ class Ot extends v {
2240
2246
  `;
2241
2247
  }
2242
2248
  }
2243
- const rt = `
2249
+ const ht = `
2244
2250
  <svg xmlns="http://www.w3.org/2000/svg" width="14" height="13" viewBox="0 0 14 13" fill="none">
2245
2251
  <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"/>
2246
2252
  </svg>
2247
- `, ht = `
2253
+ `, ct = `
2248
2254
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2249
2255
  <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"/>
2250
2256
  </svg>
2251
- `, ct = `
2257
+ `, dt = `
2252
2258
  <svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2253
2259
  <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"/>
2254
2260
  </svg>
@@ -2266,7 +2272,7 @@ class Ht extends v {
2266
2272
  }),
2267
2273
  fontFamily: new N({
2268
2274
  title: "Font",
2269
- icon: rt,
2275
+ icon: ht,
2270
2276
  default: i.fontFamilyDefault ?? "Satoshi",
2271
2277
  options: i.fontFamilyOptions ?? [
2272
2278
  { name: "Alt", value: "Croco Sans Black Caps Alt" },
@@ -2279,7 +2285,7 @@ class Ht extends v {
2279
2285
  }),
2280
2286
  fontWeight: new N({
2281
2287
  title: "Weight",
2282
- icon: ht,
2288
+ icon: ct,
2283
2289
  default: i.fontWeightDefault ?? "400",
2284
2290
  options: i.fontWeightOptions ?? [
2285
2291
  { name: "Regular", value: "400" },
@@ -2291,7 +2297,7 @@ class Ht extends v {
2291
2297
  }),
2292
2298
  fontSize: new f({
2293
2299
  title: "Size",
2294
- icon: ct,
2300
+ icon: dt,
2295
2301
  default: i.fontSizeDefault ?? 12,
2296
2302
  suffix: "px",
2297
2303
  mobile: i.fontSizeMobileDefault
@@ -2299,7 +2305,7 @@ class Ht extends v {
2299
2305
  };
2300
2306
  return e ? {
2301
2307
  ...s,
2302
- align: new q({
2308
+ align: new Z({
2303
2309
  title: "Align",
2304
2310
  default: i.alignDefault ?? "center"
2305
2311
  })
@@ -2319,7 +2325,7 @@ class Ht extends v {
2319
2325
  `;
2320
2326
  }
2321
2327
  }
2322
- class y extends p {
2328
+ class L extends p {
2323
2329
  constructor(t) {
2324
2330
  super({
2325
2331
  ...t,
@@ -2371,27 +2377,27 @@ class Tt extends v {
2371
2377
  title: "Margins",
2372
2378
  collapsed: t == null ? void 0 : t.collapsed,
2373
2379
  settings: {
2374
- marginTop: new y({
2380
+ marginTop: new L({
2375
2381
  title: "Top",
2376
- icon: dt,
2382
+ icon: ut,
2377
2383
  suffix: "px",
2378
2384
  default: (t == null ? void 0 : t.marginTop) ?? "auto"
2379
2385
  }),
2380
- marginRight: new y({
2386
+ marginRight: new L({
2381
2387
  title: "Right",
2382
- icon: ut,
2388
+ icon: pt,
2383
2389
  suffix: "px",
2384
2390
  default: (t == null ? void 0 : t.marginRight) ?? 0
2385
2391
  }),
2386
- marginBottom: new y({
2392
+ marginBottom: new L({
2387
2393
  title: "Bottom",
2388
- icon: pt,
2394
+ icon: gt,
2389
2395
  suffix: "px",
2390
2396
  default: (t == null ? void 0 : t.marginBottom) ?? 0
2391
2397
  }),
2392
- marginLeft: new y({
2398
+ marginLeft: new L({
2393
2399
  title: "Left",
2394
- icon: gt,
2400
+ icon: mt,
2395
2401
  suffix: "px",
2396
2402
  default: (t == null ? void 0 : t.marginLeft) ?? 0
2397
2403
  })
@@ -2408,13 +2414,13 @@ class Tt extends v {
2408
2414
  `;
2409
2415
  }
2410
2416
  }
2411
- const dt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2417
+ const ut = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2412
2418
  <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"/>
2413
- </svg>`, ut = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2414
- <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"/>
2415
2419
  </svg>`, pt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2416
- <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"/>
2420
+ <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"/>
2417
2421
  </svg>`, gt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2422
+ <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"/>
2423
+ </svg>`, mt = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="19" viewBox="0 0 18 19" fill="none">
2418
2424
  <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"/>
2419
2425
  </svg>`;
2420
2426
  class Pt extends v {
@@ -2423,11 +2429,11 @@ class Pt extends v {
2423
2429
  title: "Background Image",
2424
2430
  collapsed: t == null ? void 0 : t.collapsed,
2425
2431
  settings: {
2426
- backgroundImage: new T({
2432
+ backgroundImage: new P({
2427
2433
  ...t == null ? void 0 : t.uploadProps,
2428
2434
  default: (t == null ? void 0 : t.backgroundImage) ?? ""
2429
2435
  }),
2430
- opacity: new U({
2436
+ opacity: new J({
2431
2437
  default: (t == null ? void 0 : t.opacity) ?? 100
2432
2438
  }),
2433
2439
  backgroundColor: new C({
@@ -2457,7 +2463,7 @@ class Pt extends v {
2457
2463
  }
2458
2464
  }
2459
2465
  export {
2460
- q as AlignSetting,
2466
+ Z as AlignSetting,
2461
2467
  Nt as AnimationSetting,
2462
2468
  Pt as BackgroundSettingSet,
2463
2469
  Ot as BorderSettingSet,
@@ -2474,22 +2480,22 @@ export {
2474
2480
  It as MarginTopSetting,
2475
2481
  St as MultiLanguageSetting,
2476
2482
  f as NumberSetting,
2477
- U as OpacitySetting,
2483
+ J as OpacitySetting,
2478
2484
  Lt as SelectApiSettings,
2479
2485
  N as SelectSetting,
2480
2486
  p as Setting,
2481
2487
  v as SettingGroup,
2482
- W as StringSetting,
2483
- R as TabSettingGroup,
2484
- R as TabsSettingGroup,
2488
+ G as StringSetting,
2489
+ z as TabSettingGroup,
2490
+ z as TabsSettingGroup,
2485
2491
  kt as Toggle,
2486
- T as UploadSetting,
2492
+ P as UploadSetting,
2487
2493
  yt as WidthSetting,
2488
2494
  Ct as asSettingGroupWithSettings,
2489
- z as createSettingGroup,
2495
+ W as createSettingGroup,
2490
2496
  vt as createTabSettingGroup,
2491
2497
  E as isSetting,
2492
- ft as isSettingChild,
2498
+ H as isSettingChild,
2493
2499
  g as isSettingGroup,
2494
- x as iterateSettings
2500
+ y as iterateSettings
2495
2501
  };
@@ -20,6 +20,7 @@ export declare class UploadSetting extends Setting<string, UploadSettingProps> {
20
20
  constructor(props?: UploadSettingProps);
21
21
  private setupMessageListener;
22
22
  private cleanupMessageListener;
23
+ setValue(newValue: string): void;
23
24
  destroy(): void;
24
25
  private showError;
25
26
  private hideError;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "builder-settings-types",
3
3
  "description": "builder settings",
4
- "version": "0.0.250",
4
+ "version": "0.0.252",
5
5
  "type": "module",
6
6
  "main": "dist/builder-settings-types.cjs.js",
7
7
  "module": "dist/builder-settings-types.es.js",