Edit File by line

}

[500] Fix | Delete

}

[501] Fix | Delete

if (bp === 'desktop') { //backward

[502] Fix | Delete

const oldGutter = this.getSizes('gutter',bp),

[503] Fix | Delete

sel=this.type==='subrow'?'module_subrow':this.type + '_inner',

[504] Fix | Delete

cl = this.el.tfClass(sel)[0].classList;

[505] Fix | Delete

if (vals.gutter === 'none' || vals.gutter === 'narrow') {

[506] Fix | Delete

cl.add('gutter-' + vals.gutter);

[507] Fix | Delete

}

[508] Fix | Delete

if (oldGutter) {

[509] Fix | Delete

cl.remove('gutter-' + oldGutter);

[510] Fix | Delete

}

[511] Fix | Delete

}

[512] Fix | Delete

[513] Fix | Delete

this.setGridCss(res, bp);

[514] Fix | Delete

if (update !== false) {

[515] Fix | Delete

const savedVals = ['align', 'area', 'size', 'gutter', 'auto_h'],

[516] Fix | Delete

newVals = {};

[517] Fix | Delete

for (let i = savedVals.length - 1; i > -1; --i) {

[518] Fix | Delete

if (vals[savedVals[i]] !== undefined) {

[519] Fix | Delete

newVals[savedVals[i]] = vals[savedVals[i]];

[520] Fix | Delete

}

[521] Fix | Delete

}

[522] Fix | Delete

if (bp === 'desktop') {

[523] Fix | Delete

newVals.area = '';

[524] Fix | Delete

}

[525] Fix | Delete

[526] Fix | Delete

if (newVals.auto_h !== undefined && newVals.auto_h !== '-1') {

[527] Fix | Delete

newVals.align = '';

[528] Fix | Delete

}

[529] Fix | Delete

[530] Fix | Delete

this.setSizes(newVals, bp);

[531] Fix | Delete

}

[532] Fix | Delete

}

[533] Fix | Delete

optionsTab(el) {

[534] Fix | Delete

let prevData = null,

[535] Fix | Delete

prevType = null,

[536] Fix | Delete

prevModel = api.activeModel || null,

[537] Fix | Delete

constructor=ThemifyConstructor,

[538] Fix | Delete

prevComponent = constructor.component,

[539] Fix | Delete

args =this.constructor.getOptions().slice(0, 7);

[540] Fix | Delete

args.splice(2,1);

[541] Fix | Delete

if (prevModel !== null) {

[542] Fix | Delete

prevType = prevModel.type;

[543] Fix | Delete

prevData = api.Helper.cloneObject(prevModel.get('styling'));

[544] Fix | Delete

}

[545] Fix | Delete

constructor.values = prevModel?.id === this.id && constructor.clicked === 'setting' ? api.Forms.serialize('tb_options_setting', true) : (api.Helper.cloneObject(this.get('styling')) || {});

[546] Fix | Delete

[547] Fix | Delete

constructor.type = constructor.component = this.type;

[548] Fix | Delete

api.activeModel = this;

[549] Fix | Delete

args[5].accordion = false;

[550] Fix | Delete

el.replaceChildren(constructor.create(args));

[551] Fix | Delete

constructor.values = prevData;

[552] Fix | Delete

constructor.component = prevComponent;

[553] Fix | Delete

constructor.type = prevType;

[554] Fix | Delete

api.activeModel = prevModel;

[555] Fix | Delete

}

[556] Fix | Delete

grid(target) {

[557] Fix | Delete

let grid = target.dataset.grid || '',

[558] Fix | Delete

count = grid ? (grid.includes('_') ? grid.split('_').length : parseInt(grid)) : '',

[559] Fix | Delete

bp = api.activeBreakPoint,

[560] Fix | Delete

sel=this.type==='subrow'?'module_subrow':this.type + '_inner',

[561] Fix | Delete

inner = this.el.tfClass(sel)[0],

[562] Fix | Delete

cl = inner.classList,

[563] Fix | Delete

cols = api.Utils.getColumns(inner),

[564] Fix | Delete

oldCount = cols.length,

[565] Fix | Delete

wrap = target.closest('#grid'),

[566] Fix | Delete

range = wrap.querySelector('#range'),

[567] Fix | Delete

slider = wrap.querySelector('#slider'),

[568] Fix | Delete

gridCl = wrap.classList,

[569] Fix | Delete

changeType = bp === 'desktop' ? 'grid' : 'style',

[570] Fix | Delete

points = bp === 'desktop' ? api.breakpointsReverse : [bp],

[571] Fix | Delete

isSame=this.isLightboxOpen(),

[572] Fix | Delete

isLightboxClick=isSame? api.LightBox.el.contains(wrap.getRootNode().host):true;

[573] Fix | Delete

if (grid === 'user') {

[574] Fix | Delete

return;

[575] Fix | Delete

}

[576] Fix | Delete

if(!isSame){

[577] Fix | Delete

api.undoManager.start(changeType, this);

[578] Fix | Delete

}

[579] Fix | Delete

else if(!isLightboxClick){

[580] Fix | Delete

isLightboxClick=!this.syncLightbox('size',grid);

[581] Fix | Delete

}

[582] Fix | Delete

if (bp === 'desktop') {

[583] Fix | Delete

// remove unused column

[584] Fix | Delete

gridCl.remove('tb_col_count_' + oldCount);

[585] Fix | Delete

gridCl.add('tb_col_count_' + count);

[586] Fix | Delete

if(isLightboxClick){

[587] Fix | Delete

cl.remove('tb_col_count_' + oldCount);

[588] Fix | Delete

cl.add('tb_col_count_' + count);

[589] Fix | Delete

const fr = createDocumentFragment();

[590] Fix | Delete

if (count < oldCount) {

[591] Fix | Delete

for (let i = oldCount - 1; i >= count; --i) {

[592] Fix | Delete

let childs = cols[i].tfClass('tb_holder')[0].children;

[593] Fix | Delete

for (let j = 0; j < childs.length; ++j) {

[594] Fix | Delete

fr.appendChild(childs[j]);

[595] Fix | Delete

}

[596] Fix | Delete

cols[i].remove(); // finally remove it

[597] Fix | Delete

cols.splice(i,1);

[598] Fix | Delete

}

[599] Fix | Delete

cols[cols.length - 1].tfClass('tb_holder')[0].appendChild(fr); // relocate active_module

[600] Fix | Delete

} else {

[601] Fix | Delete

for (let i = 0; i < count; ++i) {

[602] Fix | Delete

if (!cols[i]) {

[603] Fix | Delete

// Add column

[604] Fix | Delete

let c = new api.Column(cols[i], this.type === 'subrow');

[605] Fix | Delete

fr.appendChild(c.el);

[606] Fix | Delete

}

[607] Fix | Delete

}

[608] Fix | Delete

cols[cols.length - 1].after(fr);

[609] Fix | Delete

}

[610] Fix | Delete

//backward compatibility

[611] Fix | Delete

cols=api.Utils.getColumns(inner);

[612] Fix | Delete

const _COL_CLASSES = api.getColClass(),

[613] Fix | Delete

_COL_CLASSES_VALUES = api.getColClassValues(),

[614] Fix | Delete

colsCount = cols.length,

[615] Fix | Delete

colsClass = _COL_CLASSES[grid] || _COL_CLASSES[colsCount],

[616] Fix | Delete

len = _COL_CLASSES_VALUES.length - 1;

[617] Fix | Delete

for (let i = colsCount - 1; i > -1; --i) {

[618] Fix | Delete

let c = cols[i].classList;

[619] Fix | Delete

for (let j = len; j > -1; --j) {

[620] Fix | Delete

c.remove(_COL_CLASSES_VALUES[j]);

[621] Fix | Delete

}

[622] Fix | Delete

if (colsClass !== undefined && colsCount < 7) {

[623] Fix | Delete

c.add(colsClass[i]);

[624] Fix | Delete

}

[625] Fix | Delete

c.remove('first', 'last');

[626] Fix | Delete

}

[627] Fix | Delete

if (colsCount > 1) {

[628] Fix | Delete

cols[0].classList.add('first');

[629] Fix | Delete

cols[colsCount - 1].classList.add('last');

[630] Fix | Delete

}

[631] Fix | Delete

}

[632] Fix | Delete

}

[633] Fix | Delete

if(isLightboxClick){

[634] Fix | Delete

this.setCols({size: grid, area: ''});

[635] Fix | Delete

}

[636] Fix | Delete

if (bp === 'desktop') {

[637] Fix | Delete

if(isLightboxClick){

[638] Fix | Delete

//reset in responsive mode

[639] Fix | Delete

for (let i = points.length - 2; i > -1; --i) {

[640] Fix | Delete

//reseting to auto, if breakpoint has auto value select it otherwise the parent value should be applied

[641] Fix | Delete

let _bp = points[i],

[642] Fix | Delete

area = this.getGridCss({size: 'auto'}, _bp);

[643] Fix | Delete

[644] Fix | Delete

[645] Fix | Delete

if (area['--area'] && !area['--area'].includes(' ')) {//apply css and update data

[646] Fix | Delete

this.setCols({size: 'auto'}, _bp);

[647] Fix | Delete

} else {

[648] Fix | Delete

this.setGridCss({'--area': '', '--col': ''}, _bp);

[649] Fix | Delete

this.setSizes({size: 'auto'}, _bp);// update data

[650] Fix | Delete

}

[651] Fix | Delete

this.setMaxGutter('',_bp);

[652] Fix | Delete

}

[653] Fix | Delete

}

[654] Fix | Delete

}

[655] Fix | Delete

else {

[656] Fix | Delete

const areaLength = getComputedStyle(inner).getPropertyValue('--area').split('" "')[0].split(' ').length;

[657] Fix | Delete

gridCl.toggle('tb_1col_grid', areaLength === 1);

[658] Fix | Delete

}

[659] Fix | Delete

range.max = slider.max = this.getMaxGutter();

[660] Fix | Delete

range.value = slider.value = parseFloat(this.setMaxGutter('',bp));

[661] Fix | Delete

if(isLightboxClick){

[662] Fix | Delete

api.Utils.setColumnsCount(cols);

[663] Fix | Delete

Themify.trigger('tb_grid_changed', [this.el.closest('.module_row'), inner]);

[664] Fix | Delete

api.Utils.onResize(true);

[665] Fix | Delete

if(!isSame){

[666] Fix | Delete

api.undoManager.end(changeType);

[667] Fix | Delete

}

[668] Fix | Delete

}

[669] Fix | Delete

}

[670] Fix | Delete

[671] Fix | Delete

gutter(target) {

[672] Fix | Delete

const gutter = target.dataset.value,

[673] Fix | Delete

gutterValue = ThemifyStyles.getGutterValue(gutter),

[674] Fix | Delete

rangeWrap = target.closest('#grid'),

[675] Fix | Delete

range = rangeWrap.querySelector('#range'),

[676] Fix | Delete

slider = rangeWrap.querySelector('#slider'),

[677] Fix | Delete

gutterVal = parseFloat(parseFloat(gutterValue).toFixed(2).toString()).toString(), //trailing zeros

[678] Fix | Delete

unit = gutterValue.replace(gutterVal, '') || '%',

[679] Fix | Delete

isSame=this.isLightboxOpen();

[680] Fix | Delete

[681] Fix | Delete

range.max = slider.max = this.getMaxGutter(unit);

[682] Fix | Delete

range.value = slider.value = gutterVal;

[683] Fix | Delete

rangeWrap.querySelector('#range_unit').value = unit;

[684] Fix | Delete

if(!isSame){

[685] Fix | Delete

api.undoManager.start('style', this);

[686] Fix | Delete

}

[687] Fix | Delete

else if(!api.LightBox.el.contains(rangeWrap.getRootNode().host)){

[688] Fix | Delete

this.syncLightbox(target.closest('[data-col]').dataset.col,gutter);

[689] Fix | Delete

return;

[690] Fix | Delete

}

[691] Fix | Delete

this.setCols({gutter: gutter});

[692] Fix | Delete

api.Utils.onResize(true);

[693] Fix | Delete

if(!isSame){

[694] Fix | Delete

api.undoManager.end('style');

[695] Fix | Delete

}

[696] Fix | Delete

}

[697] Fix | Delete

autoHeight(target) {

[698] Fix | Delete

const value = target.dataset.value,

[699] Fix | Delete

isSame=this.isLightboxOpen();

[700] Fix | Delete

if(!isSame){

[701] Fix | Delete

api.undoManager.start('style', this);

[702] Fix | Delete

}

[703] Fix | Delete

else if(!api.LightBox.el.contains(target.getRootNode().host)){

[704] Fix | Delete

this.syncLightbox(target.closest('[data-col]').dataset.col,value);

[705] Fix | Delete

return;

[706] Fix | Delete

}

[707] Fix | Delete

if (api.activeBreakPoint === 'desktop') { //backward

[708] Fix | Delete

const sel=this.type==='subrow'?'module_subrow':this.type + '_inner',

[709] Fix | Delete

inner = this.el.tfClass(sel)[0];

[710] Fix | Delete

inner.classList.toggle('col_auto_height', value === '1');

[711] Fix | Delete

}

[712] Fix | Delete

this.setCols({auto_h: value});

[713] Fix | Delete

if(!isSame){

[714] Fix | Delete

api.undoManager.end('style');

[715] Fix | Delete

}

[716] Fix | Delete

}

[717] Fix | Delete

alignment(target) {

[718] Fix | Delete

const value = target.dataset.value,

[719] Fix | Delete

isSame=this.isLightboxOpen();

[720] Fix | Delete

if(!isSame){

[721] Fix | Delete

api.undoManager.start('style', this);

[722] Fix | Delete

}

[723] Fix | Delete

else if(!api.LightBox.el.contains(target.getRootNode().host)){

[724] Fix | Delete

this.syncLightbox(target.closest('[data-col]').dataset.col,value);

[725] Fix | Delete

return;

[726] Fix | Delete

}

[727] Fix | Delete

if (api.activeBreakPoint === 'desktop') { //backward

[728] Fix | Delete

let sel=this.type==='subrow'?'module_subrow':this.type + '_inner',

[729] Fix | Delete

innerCl = this.el.tfClass(sel)[0].classList,

[730] Fix | Delete

prev = this.get('sizes').desktop_align,

[731] Fix | Delete

_align = value;

[732] Fix | Delete

if (prev) {

[733] Fix | Delete

prev = prev.replace('col_align_', '');

[734] Fix | Delete

if (prev === 'start') {

[735] Fix | Delete

prev = 'top';

[736] Fix | Delete

} else {

[737] Fix | Delete

prev = prev === 'center' ? 'middle' : 'bottom';

[738] Fix | Delete

}

[739] Fix | Delete

innerCl.remove('col_align_' + prev);

[740] Fix | Delete

}

[741] Fix | Delete

if (_align === 'start') {

[742] Fix | Delete

_align = 'top';

[743] Fix | Delete

} else {

[744] Fix | Delete

_align = _align === 'center' ? 'middle' : 'bottom';

[745] Fix | Delete

}

[746] Fix | Delete

innerCl.add('col_align_' + _align);

[747] Fix | Delete

}

[748] Fix | Delete

this.setCols({align: value});

[749] Fix | Delete

if(!isSame){

[750] Fix | Delete

api.undoManager.end('style');

[751] Fix | Delete

}

[752] Fix | Delete

}

[753] Fix | Delete

direction() {

[754] Fix | Delete

const mode = api.activeBreakPoint === 'desktop' ? 'direction' : 'style',

[755] Fix | Delete

sel=this.type==='subrow'?'module_subrow':this.type + '_inner',

[756] Fix | Delete

inner = this.el.tfClass(sel)[0],

[757] Fix | Delete

isSame=this.isLightboxOpen();

[758] Fix | Delete

if(!isSame){

[759] Fix | Delete

api.undoManager.start(mode, this);

[760] Fix | Delete

}

[761] Fix | Delete

if (api.activeBreakPoint === 'desktop') {

[762] Fix | Delete

if (!inner.hasAttribute('data-transition')) {

[763] Fix | Delete

inner.dataset.transition = 1;

[764] Fix | Delete

[765] Fix | Delete

let cols = api.Utils.getColumns(inner),

[766] Fix | Delete

self = this,

[767] Fix | Delete

len = cols.length,

[768] Fix | Delete

desktopSizes = this.getSizes('size'),

[769] Fix | Delete

oldcolsAreas = {};

[770] Fix | Delete

for (let i = len - 1; i > -1; --i) {

[771] Fix | Delete

oldcolsAreas[cols[i].dataset.cid] = (i + 1);

[772] Fix | Delete

}

[773] Fix | Delete

cols[len - 1].tfOn('transitionend', function () {

[774] Fix | Delete

const fr = createDocumentFragment();

[775] Fix | Delete

for (let i = len - 1; i > -1; --i) {

[776] Fix | Delete

fr.appendChild(cols[i]);

[777] Fix | Delete

}

[778] Fix | Delete

inner.prepend(fr);

[779] Fix | Delete

this.tfOn('transitionend', () => {

[780] Fix | Delete

for (let i = len - 1; i > -1; --i) {

[781] Fix | Delete

cols[i].style.setProperty('transition', '');

[782] Fix | Delete

cols[i].style.setProperty('transition-delay', '');

[783] Fix | Delete

cols[i].style.setProperty('transform', '');

[784] Fix | Delete

}

[785] Fix | Delete

inner.classList.remove('direction_rtl');

[786] Fix | Delete

inner.removeAttribute('data-transition');

[787] Fix | Delete

[788] Fix | Delete

const newColsAreas = {};

[789] Fix | Delete

for (let i = len - 1; i > -1; --i) {

[790] Fix | Delete

newColsAreas[cols[i].dataset.cid] = (i + 1);

[791] Fix | Delete

}

[792] Fix | Delete

//keep the breakpoints cols order

[793] Fix | Delete

for (let points = api.breakpointsReverse, i = points.length - 2; i > -1; --i) {

[794] Fix | Delete

let respArea = self.getSizes('area', points[i]);

[795] Fix | Delete

if (respArea) {

[796] Fix | Delete

if (!respArea.includes('"')) {//is css variable

[797] Fix | Delete

respArea = computed.getPropertyValue('--area' + respArea).replace(/\s\s+/g, ' ').trim();

[798] Fix | Delete

}

[799] Fix | Delete

for (let cid in newColsAreas) {

[800] Fix | Delete

if (oldcolsAreas[cid] !== newColsAreas[cid]) {

[801] Fix | Delete

respArea = respArea

[802] Fix | Delete

.replaceAll(oldcolsAreas[cid] + ' ', '#' + newColsAreas[cid] + '# ')

[803] Fix | Delete

.replaceAll(oldcolsAreas[cid] + '"', '#' + newColsAreas[cid] + '#"');

[804] Fix | Delete

}

[805] Fix | Delete

}

[806] Fix | Delete

self.setCols({area: respArea.replaceAll('#', '')}, points[i]);

[807] Fix | Delete

}

[808] Fix | Delete

}

[809] Fix | Delete

if(!isSame){

[810] Fix | Delete

api.undoManager.end(mode);

[811] Fix | Delete

}

[812] Fix | Delete

self = len = desktopSizes = cols = null;

[813] Fix | Delete

}, {

[814] Fix | Delete

once: true,

[815] Fix | Delete

passive: true

[816] Fix | Delete

});

[817] Fix | Delete

[818] Fix | Delete

if (desktopSizes) {

[819] Fix | Delete

self.setCols({size: desktopSizes.split(' ').reverse().join(' ')});

[820] Fix | Delete

}

[821] Fix | Delete

setTimeout(() => {

[822] Fix | Delete

for (let i = len - 1; i > -1; --i) {

[823] Fix | Delete

cols[i].style.setProperty('transition-delay', ((len - i) / 10) + 's');

[824] Fix | Delete

cols[i].style.setProperty('transform', 'scale(1)');

[825] Fix | Delete

}

[826] Fix | Delete

}, 60);

[827] Fix | Delete

[828] Fix | Delete

}, {

[829] Fix | Delete

once: true,

[830] Fix | Delete

passive: true

[831] Fix | Delete

});

[832] Fix | Delete

for (let i = len - 1; i > -1; --i) {

[833] Fix | Delete

cols[i].style.setProperty('transition', 'transform .3s ' + ((i + 1) / 10) + 's');

[834] Fix | Delete

cols[i].style.setProperty('transform', 'scale(0)');

[835] Fix | Delete

}

[836] Fix | Delete

}

[837] Fix | Delete

} else {

[838] Fix | Delete

let area = getComputedStyle(inner).getPropertyValue('--area').replace(/ +/g, ' ').trim(),

[839] Fix | Delete

newArea = [],

[840] Fix | Delete

colsSize = area.split('" "')[0].split(' ').length;

[841] Fix | Delete

[842] Fix | Delete

area = area.replaceAll('"', '').trim().split(' ').reverse();

[843] Fix | Delete

const len = area.length;

[844] Fix | Delete

for (let i = len - 1; i > -1; --i) {

[845] Fix | Delete

if (area[i] === '.') {

[846] Fix | Delete

area.push(area.splice(i, 1)[0]);

[847] Fix | Delete

}

[848] Fix | Delete

}

[849] Fix | Delete

for (let i = 0, len2 = (len / colsSize); i < len2; ++i) {

[850] Fix | Delete

newArea.push('"' + area.slice(i * colsSize, (i + 1) * colsSize).join(' ') + '"');

[851] Fix | Delete

}

[852] Fix | Delete

this.setCols({area: newArea.join(' ')});

[853] Fix | Delete

if(!isSame){

[854] Fix | Delete

api.undoManager.end(mode);

[855] Fix | Delete

}

[856] Fix | Delete

}

[857] Fix | Delete

}

[858] Fix | Delete

breakpoint(el) {

[859] Fix | Delete

api.ToolBar.breakpointSwitcher(el.dataset.id).then(() => {

[860] Fix | Delete

if (api.isFrontend) {

[861] Fix | Delete

api.ActionBar.clear();

[862] Fix | Delete

setTimeout(() => {

[863] Fix | Delete

const scrollTop = this.el.getBoundingClientRect().top + window.scrollY - 100;

[864] Fix | Delete

window.top.scroll(0, scrollTop);

[865] Fix | Delete

window.scroll(0, scrollTop);

[866] Fix | Delete

api.ActionBar.hover({target: this.el.tfClass('tb_' + this.type + '_action')[0]});

[867] Fix | Delete

}, 50);

[868] Fix | Delete

}

[869] Fix | Delete

}).catch(() => {

[870] Fix | Delete

[871] Fix | Delete

});

[872] Fix | Delete

}

[873] Fix | Delete

gridMenu(el) {

[874] Fix | Delete

const tpl = doc.tfId('tmpl-builder_grid_list').content.cloneNode(true),

[875] Fix | Delete

bp = api.activeBreakPoint,

[876] Fix | Delete

sel=this.type==='subrow'?'module_subrow':this.type + '_inner',

[877] Fix | Delete

inner = this.el.tfClass(sel)[0],

[878] Fix | Delete

cl = inner.classList,

[879] Fix | Delete

elCl = el.classList,

[880] Fix | Delete

count = api.Utils.getColumns(inner).length,

[881] Fix | Delete

countClass = 'tb_col_count_' + count,

[882] Fix | Delete

areaLength = bp !== 'desktop' ? getComputedStyle(inner).getPropertyValue('--area').split('" "')[0].split(' ').length : null,

[883] Fix | Delete

range = tpl.querySelector('#range'),

[884] Fix | Delete

rangeUnit = tpl.querySelector('#range_unit'),

[885] Fix | Delete

slider = tpl.querySelector('#slider'),

[886] Fix | Delete

cid=this.id;

[887] Fix | Delete

[888] Fix | Delete

this.setMaxGutter('',bp);

[889] Fix | Delete

let items = tpl.querySelector('.grid_list').children,

[890] Fix | Delete

{gutter, align, size, auto_h} = this.getSizes('',bp);

[891] Fix | Delete

if (!size || count===1) {

[892] Fix | Delete

size = count > 6 ? 'user' : count;

[893] Fix | Delete

}

[894] Fix | Delete

else if (typeof size === 'string' && size.includes(' ')) {

[895] Fix | Delete

size = 'user';

[896] Fix | Delete

}

[897] Fix | Delete

for (let i = cl.length - 1; i > -1; --i) {

[898] Fix | Delete

if (cl[i].indexOf('tb_col_count_') === 0) {

[899] Fix | Delete

if (countClass !== cl[i]) {

[900] Fix | Delete

cl.remove(cl[i]);

[901] Fix | Delete

}

[902] Fix | Delete

break;

[903] Fix | Delete

}

[904] Fix | Delete

}

[905] Fix | Delete

cl.add(countClass);

[906] Fix | Delete

elCl.add(countClass, api.activeBreakPoint);

[907] Fix | Delete

elCl.toggle('tb_1col_grid', areaLength === 1);

[908] Fix | Delete

if (api.activeBreakPoint !== 'desktop') {

[909] Fix | Delete

elCl.add('tb_responsive_mode');

[910] Fix | Delete

}

[911] Fix | Delete

[912] Fix | Delete

if (this.el.classList.contains('fullheight')) {

[913] Fix | Delete

elCl.add('fullheight');

[914] Fix | Delete

}

[915] Fix | Delete

for (let i = items.length - 1; i > -1; --i) {

[916] Fix | Delete

items[i].classList.toggle('selected', items[i].dataset.grid === size.toString());

[917] Fix | Delete

}

[918] Fix | Delete

if (align) {

[919] Fix | Delete

items = tpl.querySelector('.alignment').children;

[920] Fix | Delete

for (let i = items.length - 1; i > -1; --i) {

[921] Fix | Delete

items[i].classList.toggle('selected', items[i].dataset.value === align);

[922] Fix | Delete

}

[923] Fix | Delete

}

[924] Fix | Delete

[925] Fix | Delete

if (auto_h) {

[926] Fix | Delete

auto_h=auto_h.toString();

[927] Fix | Delete

items = tpl.querySelector('.auto_height').children;

[928] Fix | Delete

for (let i = items.length - 1; i > -1; --i) {

[929] Fix | Delete

items[i].classList.toggle('selected', items[i].dataset.value === auto_h);

[930] Fix | Delete

}

[931] Fix | Delete

}

[932] Fix | Delete

[933] Fix | Delete

if (gutter) {

[934] Fix | Delete

gutter = ThemifyStyles.getGutter(gutter);

[935] Fix | Delete

items = tpl.querySelector('.gutter').children;

[936] Fix | Delete

for (let i = items.length - 1; i > -1; --i) {

[937] Fix | Delete

items[i].classList.toggle('selected', items[i].dataset.value === gutter);

[938] Fix | Delete

}

[939] Fix | Delete

}

[940] Fix | Delete

else {

[941] Fix | Delete

gutter = 'gutter';

[942] Fix | Delete

}

[943] Fix | Delete

[944] Fix | Delete

gutter = ThemifyStyles.getGutterValue(gutter);

[945] Fix | Delete

[946] Fix | Delete

const gutterVal = parseFloat(gutter),

[947] Fix | Delete

gutter_unit = gutter.toString().replace(gutterVal.toString(), '') || '%';

[948] Fix | Delete

range.max = slider.max = this.getMaxGutter(gutter_unit,bp);

[949] Fix | Delete

range.value = slider.value = parseFloat(gutterVal.toFixed(4)).toString(); //trailing zeros

[950] Fix | Delete

rangeUnit.value = gutter_unit,

[951] Fix | Delete

parent=el.parentNode || el;

[952] Fix | Delete

[953] Fix | Delete

parent.tfOn(_CLICK_, e => {

[954] Fix | Delete

const target=e.target,

[955] Fix | Delete

selected = target.closest('li'),

[956] Fix | Delete

model=api.Registry.get(cid);

[957] Fix | Delete

if (selected) {

[958] Fix | Delete

const colAction = selected.closest('[data-col]');

[959] Fix | Delete

if (colAction) {

[960] Fix | Delete

e.stopPropagation();

[961] Fix | Delete

const childs = colAction.children,

[962] Fix | Delete

action = colAction.dataset.col;

[963] Fix | Delete

if (childs.length > 1) {

[964] Fix | Delete

for (let i = childs.length - 1; i > -1; --i) {

[965] Fix | Delete

childs[i].classList.toggle('selected', selected === childs[i]);

[966] Fix | Delete

}

[967] Fix | Delete

}

[968] Fix | Delete

model[action](selected);

[969] Fix | Delete

}

[970] Fix | Delete

}

[971] Fix | Delete

else if (target.closest('.expand')) {

[972] Fix | Delete

e.stopPropagation();

[973] Fix | Delete

model.edit();

[974] Fix | Delete

}

[975] Fix | Delete

}, {passive: true});

[976] Fix | Delete

el.appendChild(tpl);

[977] Fix | Delete

[978] Fix | Delete

setTimeout(() => {

[979] Fix | Delete

if (el) {

[980] Fix | Delete

const holder = el.querySelector('#range_holder'),

[981] Fix | Delete

input = ThemifyConstructor.range.render({

[982] Fix | Delete

id: 'range',

[983] Fix | Delete

control: false,

[984] Fix | Delete

event: 'input',

[985] Fix | Delete

value: range.value,

[986] Fix | Delete

unit: rangeUnit.value,

[987] Fix | Delete

units: {

[988] Fix | Delete

'%': {

[989] Fix | Delete

min: 0,

[990] Fix | Delete

increment: .1,

[991] Fix | Delete

max: this.getMaxGutter('%')

[992] Fix | Delete

[993] Fix | Delete

'em': {

[994] Fix | Delete

min: 0,

[995] Fix | Delete

max: this.getMaxGutter('em')

[996] Fix | Delete

[997] Fix | Delete

px: {

[998] Fix | Delete

min: 0,

[999] Fix | Delete

123 4