"use strict";
(self["webpackChunksolace"] = self["webpackChunksolace"] || []).push([["assets_apps_customizer-controls_src_builder_components_Builder_tsx"],{

/***/ "./node_modules/@wordpress/icons/build-module/library/close-small.js":
/*!***************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/close-small.js ***!
  \***************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const closeSmall = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M12 13.06l3.712 3.713 1.061-1.06L13.061 12l3.712-3.712-1.06-1.06L12 10.938 8.288 7.227l-1.061 1.06L10.939 12l-3.712 3.712 1.06 1.061L12 13.061z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (closeSmall);
//# sourceMappingURL=close-small.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/close.js":
/*!*********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/close.js ***!
  \*********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const close = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M13 11.8l6.1-6.3-1-1-6.1 6.2-6.1-6.2-1 1 6.1 6.3-6.5 6.7 1 1 6.5-6.6 6.5 6.6 1-1z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (close);
//# sourceMappingURL=close.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/cog.js":
/*!*******************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/cog.js ***!
  \*******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const cog = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  fillRule: "evenodd",
  d: "M10.289 4.836A1 1 0 0111.275 4h1.306a1 1 0 01.987.836l.244 1.466c.787.26 1.503.679 2.108 1.218l1.393-.522a1 1 0 011.216.437l.653 1.13a1 1 0 01-.23 1.273l-1.148.944a6.025 6.025 0 010 2.435l1.149.946a1 1 0 01.23 1.272l-.653 1.13a1 1 0 01-1.216.437l-1.394-.522c-.605.54-1.32.958-2.108 1.218l-.244 1.466a1 1 0 01-.987.836h-1.306a1 1 0 01-.986-.836l-.244-1.466a5.995 5.995 0 01-2.108-1.218l-1.394.522a1 1 0 01-1.217-.436l-.653-1.131a1 1 0 01.23-1.272l1.149-.946a6.026 6.026 0 010-2.435l-1.148-.944a1 1 0 01-.23-1.272l.653-1.131a1 1 0 011.217-.437l1.393.522a5.994 5.994 0 012.108-1.218l.244-1.466zM14.929 12a3 3 0 11-6 0 3 3 0 016 0z",
  clipRule: "evenodd"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (cog);
//# sourceMappingURL=cog.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/drag-handle.js":
/*!***************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/drag-handle.js ***!
  \***************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const dragHandle = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  width: "18",
  height: "18",
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 18 18"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M5 4h2V2H5v2zm6-2v2h2V2h-2zm-6 8h2V8H5v2zm6 0h2V8h-2v2zm-6 6h2v-2H5v2zm6 0h2v-2h-2v2z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (dragHandle);
//# sourceMappingURL=drag-handle.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/info.js":
/*!********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/info.js ***!
  \********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const info = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M12 3.2c-4.8 0-8.8 3.9-8.8 8.8 0 4.8 3.9 8.8 8.8 8.8 4.8 0 8.8-3.9 8.8-8.8 0-4.8-4-8.8-8.8-8.8zm0 16c-4 0-7.2-3.3-7.2-7.2C4.8 8 8 4.8 12 4.8s7.2 3.3 7.2 7.2c0 4-3.2 7.2-7.2 7.2zM11 17h2v-6h-2v6zm0-8h2V7h-2v2z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (info);
//# sourceMappingURL=info.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/search.js":
/*!**********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/search.js ***!
  \**********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const search = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M13.5 6C10.5 6 8 8.5 8 11.5c0 1.1.3 2.1.9 3l-3.4 3 1 1.1 3.4-2.9c1 .9 2.2 1.4 3.6 1.4 3 0 5.5-2.5 5.5-5.5C19 8.5 16.5 6 13.5 6zm0 9.5c-2.2 0-4-1.8-4-4s1.8-4 4-4 4 1.8 4 4-1.8 4-4 4z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (search);
//# sourceMappingURL=search.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/settings.js":
/*!************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/settings.js ***!
  \************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const settings = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M14.5 13.8c-1.1 0-2.1.7-2.4 1.8H4V17h8.1c.3 1 1.3 1.8 2.4 1.8s2.1-.7 2.4-1.8H20v-1.5h-3.1c-.3-1-1.3-1.7-2.4-1.7zM11.9 7c-.3-1-1.3-1.8-2.4-1.8S7.4 6 7.1 7H4v1.5h3.1c.3 1 1.3 1.8 2.4 1.8s2.1-.7 2.4-1.8H20V7h-8.1z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (settings);
//# sourceMappingURL=settings.js.map

/***/ }),

/***/ "./assets/apps/customizer-controls/src/builder/components/Builder.tsx":
/*!****************************************************************************!*\
  !*** ./assets/apps/customizer-controls/src/builder/components/Builder.tsx ***!
  \****************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Row__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Row */ "./assets/apps/customizer-controls/src/builder/components/Row.tsx");
/* harmony import */ var _ResponsiveSwitches__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ResponsiveSwitches */ "./assets/apps/customizer-controls/src/builder/components/ResponsiveSwitches.tsx");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _BuilderContext__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../BuilderContext */ "./assets/apps/customizer-controls/src/builder/BuilderContext.tsx");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/cog.js");








const Builder = ({ value, hidden, portalMount }) => {
    const { device, builder, hasColumns } = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useContext)(_BuilderContext__WEBPACK_IMPORTED_MODULE_5__["default"]);
    const { rows } = window.SolaceReactCustomize.HFG[builder];
    const items = { ...value[device] };
    const sectionTop = `hfg_${builder}_layout_top`;
    const sectionMain = `hfg_${builder}_layout_main`;
    const sectionBottom = `hfg_${builder}_layout_bottom`;
    const [currentRow, setCurrentRow] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    const focusRowSectionTop = () => {
        window.wp.customize.section(sectionTop).focus();
    };
    const focusRowSectionMain = () => {
        window.wp.customize.section(sectionMain).focus();
    };
    const focusRowSectionBottom = () => {
        window.wp.customize.section(sectionBottom).focus();
    };
    const preview = document.querySelector('#customize-preview');
    // Remove preview offset.
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
        return () => {
            if (preview === null) {
                return;
            }
            preview.style.maxHeight = '';
            preview.style.marginTop = '';
        };
    }, []);
    const adaptPreviewHeight = (scroll = false) => {
        const builderNode = (portalMount === null || portalMount === void 0 ? void 0 : portalMount.querySelector('.solace-builder')) || null;
        if (builderNode === null || preview === null) {
            return;
        }
        if (hidden) {
            preview.style.maxHeight = '';
            preview.style.marginTop = '';
            return;
        }
        const height = builderNode.offsetHeight;
        preview.style.maxHeight = `calc(100vh - ${height}px)`;
        preview.style.marginTop = '0';
        if (!scroll) {
            return;
        }
        if (builder === 'footer') {
            setTimeout(() => {
                window.wp.customize.previewer.send('scroll', 100000000);
            }, 150);
            return;
        }
        // Scroll to top if we're using another builder (header, page-header)
        setTimeout(() => {
            window.wp.customize.previewer.send('scroll', 0);
        }, 150);
    };
    // Offset preview to make space for builder.
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
        setTimeout(() => {
            adaptPreviewHeight(true);
        }, 100);
    }, [hidden]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
        window.wp.customize.previewer.bind('selective-refresh-setting-validities', () => {
            adaptPreviewHeight();
        });
    }, [hidden]);
    const builderClasses = classnames__WEBPACK_IMPORTED_MODULE_3___default()('solace-builder ' + builder, {
        hide: hidden,
        'columns-builder': hasColumns,
    });
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
        async function fetchData() {
            try {
                const headerTopValue = await new Promise((resolve, reject) => {
                    window.wp.customize('solace_pro_global_header_settings_top_shortcut', function (valuex) {
                        const value = valuex();
                        resolve(value);
                    });
                });
                setIsRowHeaderTopVisible(headerTopValue);
                const headerMainValue = await new Promise((resolve, reject) => {
                    window.wp.customize('solace_pro_global_header_settings_main_shortcut', function (valuex) {
                        const value = valuex();
                        resolve(value);
                    });
                });
                setIsRowHeaderMainVisible(headerMainValue);
                const headerBottomValue = await new Promise((resolve, reject) => {
                    window.wp.customize('solace_pro_global_header_settings_bottom_shortcut', function (valuex) {
                        const value = valuex();
                        resolve(value);
                    });
                });
                setIsRowHeaderBottomVisible(headerBottomValue);
                const footerTopValue = await new Promise((resolve, reject) => {
                    window.wp.customize('solace_pro_global_footer_settings_top_shortcut', function (valuex) {
                        const value = valuex();
                        resolve(value);
                    });
                });
                setIsRowFooterTopVisible(footerTopValue);
                const footerMainValue = await new Promise((resolve, reject) => {
                    window.wp.customize('solace_pro_global_footer_settings_main_shortcut', function (valuex) {
                        const value = valuex();
                        resolve(value);
                    });
                });
                setIsRowFooterMainVisible(footerMainValue);
                const footerBottomValue = await new Promise((resolve, reject) => {
                    window.wp.customize('solace_pro_global_footer_settings_bottom_shortcut', function (valuex) {
                        const value = valuex();
                        resolve(value);
                    });
                });
                setIsRowFooterBottomVisible(footerBottomValue);
            }
            catch (error) {
                console.error('Error fetching data:', error);
            }
        }
        fetchData();
    }, []); // Memastikan hanya dijalankan sekali saat komponen did mount
    var headerTopValue = "";
    var headerTopState = window.wp.customize('solace_pro_global_header_settings_top_shortcut', function (value) {
        headerTopValue = value();
    });
    const [isRowHeaderTopVisible, setIsRowHeaderTopVisible] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(headerTopState);
    const handleTopHeaderClick = () => {
        setIsRowHeaderTopVisible(!isRowHeaderTopVisible);
        window.wp.customize('solace_pro_global_header_settings_top_shortcut', function (setting) {
            setting.set(!isRowHeaderTopVisible);
            setting.preview();
            window.wp.customize.previewer.send('changeset-update', { transport: 'auto' });
            window.wp.customize.previewer.refresh();
        });
    };
    var headerMainValue = "";
    var headerMainState = window.wp.customize('solace_pro_global_header_settings_main_shortcut', function (value) {
        headerMainValue = value();
    });
    const [isRowHeaderMainVisible, setIsRowHeaderMainVisible] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(headerMainState);
    const handleMainHeaderClick = () => {
        setIsRowHeaderMainVisible(!isRowHeaderMainVisible);
        window.wp.customize('solace_pro_global_header_settings_main_shortcut', function (setting) {
            setting.set(!isRowHeaderMainVisible);
            setting.preview();
            window.wp.customize.previewer.send('changeset-update', { transport: 'auto' }); // Menyimpan perubahan ke dalam customizer
            window.wp.customize.previewer.refresh();
        });
    };
    var headerBottomValue = "";
    var headerBottomState = window.wp.customize('solace_pro_global_header_settings_bottom_shortcut', function (value) {
        headerBottomValue = value();
    });
    const [isRowHeaderBottomVisible, setIsRowHeaderBottomVisible] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(headerBottomState);
    const handleBottomHeaderClick = () => {
        setIsRowHeaderBottomVisible(!isRowHeaderBottomVisible);
        window.wp.customize('solace_pro_global_header_settings_bottom_shortcut', function (setting) {
            setting.set(!isRowHeaderBottomVisible);
            setting.preview();
            // setting.save(); // Menyimpan perubahan ke dalam customizer
            window.wp.customize.previewer.send('changeset-update', { transport: 'auto' }); // Menyimpan perubahan ke dalam customizer
            window.wp.customize.previewer.refresh();
        });
    };
    var footerTopValue = "";
    var footerTopState = window.wp.customize('solace_pro_global_footer_settings_top_shortcut', function (value) {
        footerTopValue = value();
    });
    const [isRowFooterTopVisible, setIsRowFooterTopVisible] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(footerTopState);
    const handleTopFooterClick = () => {
        setIsRowFooterTopVisible(!isRowFooterTopVisible);
        window.wp.customize('solace_pro_global_footer_settings_top_shortcut', function (setting) {
            setting.set(!isRowFooterTopVisible);
            setting.preview();
            // setting.save(); // Menyimpan perubahan ke dalam customizer
            window.wp.customize.previewer.send('changeset-update', { transport: 'auto' }); // Menyimpan perubahan ke dalam customizer
            window.wp.customize.previewer.refresh();
        });
    };
    var footerMainValue = "";
    var footerMainState = window.wp.customize('solace_pro_global_footer_settings_main_shortcut', function (value) {
        footerMainValue = value();
    });
    const [isRowFooterMainVisible, setIsRowFooterMainVisible] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(footerMainState);
    const handleMainFooterClick = () => {
        setIsRowFooterMainVisible(!isRowFooterMainVisible);
        window.wp.customize('solace_pro_global_footer_settings_main_shortcut', function (setting) {
            setting.set(!isRowFooterMainVisible);
            setting.preview();
            // setting.save(); // Menyimpan perubahan ke dalam customizer
            window.wp.customize.previewer.send('changeset-update', { transport: 'auto' }); // Menyimpan perubahan ke dalam customizer
            window.wp.customize.previewer.refresh();
        });
    };
    var footerBottomValue = "";
    var footerBottomState = window.wp.customize('solace_pro_global_footer_settings_bottom_shortcut', function (value) {
        footerBottomValue = value();
    });
    const [isRowFooterBottomVisible, setIsRowFooterBottomVisible] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(footerBottomState);
    const handleBottomFooterClick = () => {
        setIsRowFooterBottomVisible(!isRowFooterBottomVisible);
        window.wp.customize('solace_pro_global_footer_settings_bottom_shortcut', function (setting) {
            setting.set(!isRowFooterBottomVisible);
            setting.preview();
            // setting.save(); // Menyimpan perubahan ke dalam customizer
            window.wp.customize.previewer.send('changeset-update', { transport: 'auto' }); // Menyimpan perubahan ke dalam customizer
            window.wp.customize.previewer.refresh();
        });
    };
    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: builderClasses },
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ResponsiveSwitches__WEBPACK_IMPORTED_MODULE_2__["default"], { device: device }),
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "rows-wrapper" },
            rows.sidebar && device !== 'desktop' && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "vertical-rows" },
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_1__["default"], { rowId: "sidebar", items: items.sidebar }))),
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "horizontal-rows ocir2" }, Object.keys(rows).map((rowId, rowIndex) => {
                if (rowId === 'sidebar') {
                    return null;
                }
                const builderposition = `${builder}`;
                return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), { key: rowIndex },
                    rowIndex === 0 && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: `top-row ${builderposition}` },
                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_1__["default"], { rowId: rowId, items: items[rowId] || [] }),
                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'titlebar' },
                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("label", { className: 'rowID' }, "Top Row"),
                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'box-icon' },
                                builderposition === 'header' ? (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { type: "button", className: "showhide", onClick: handleTopHeaderClick }, isRowHeaderTopVisible ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-hidden" }) : react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-visibility" }))) : (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { type: "button", className: "showhide", onClick: handleTopFooterClick }, isRowFooterTopVisible ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-hidden" }) : react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-visibility" }))),
                                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, { icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], iconSize: 18, className: "row-settings gear", onClick: focusRowSectionTop, isPrimary: currentRow }))))),
                    rowIndex === 1 && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'main-row' },
                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_1__["default"], { rowId: rowId, items: items[rowId] || [] }),
                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'titlebar' },
                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("label", { className: '' }, "Main Row"),
                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'box-icon' },
                                builderposition === 'header' ? (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { type: "button", className: "showhide", onClick: handleMainHeaderClick }, isRowHeaderMainVisible ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-hidden" }) : react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-visibility" }))) : (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { type: "button", className: "showhide", onClick: handleMainFooterClick }, isRowFooterMainVisible ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-hidden" }) : react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-visibility" }))),
                                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, { icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], iconSize: 18, className: "row-settings gear", onClick: focusRowSectionMain, isPrimary: currentRow }))))),
                    rowIndex === 2 && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'bottom-row' },
                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Row__WEBPACK_IMPORTED_MODULE_1__["default"], { rowId: rowId, items: items[rowId] || [] }),
                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'titlebar' },
                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("label", { className: '' }, "Bottom Row"),
                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'box-icon' },
                                builderposition === 'header' ? (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { type: "button", className: "showhide", onClick: handleBottomHeaderClick }, isRowHeaderBottomVisible ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-hidden" }) : react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-visibility" }))) : (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { type: "button", className: "showhide", onClick: handleBottomFooterClick }, isRowFooterBottomVisible ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-hidden" }) : react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dashicon dashicons dashicons-visibility" }))),
                                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, { icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], iconSize: 18, className: "row-settings gear", onClick: focusRowSectionBottom, isPrimary: currentRow })))))));
                // return (
                // 	<Row
                // 		key={rowIndex}
                // 		rowId={rowId as RowTypes}
                // 		items={items[rowId] || []}
                // 	/>
                // );
            })))));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Builder);


/***/ }),

/***/ "./assets/apps/customizer-controls/src/builder/components/BuilderHeaderNotification.tsx":
/*!**********************************************************************************************!*\
  !*** ./assets/apps/customizer-controls/src/builder/components/BuilderHeaderNotification.tsx ***!
  \**********************************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/info.js");





const BuilderHeaderNotification = ({ builder, builderName, }) => {
    const [modalVisible, setModalVisible] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [currentHeaderName, setCurrentHeaderName] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(null);
    const toggleModal = () => {
        setModalVisible(!modalVisible);
    };
    const focusConditionalSelector = () => {
        window.wp.customize.control('solace_header_conditional_selector').focus();
    };
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
        // @ts-ignore
        const updateName = (e) => {
            setCurrentHeaderName(e.detail);
        };
        document.addEventListener('nv-change-conditional-header', updateName);
        return () => document.removeEventListener('nv-change-conditional-header', updateName);
    }, []);
    const { dashUpdatesMessage, instructionalVid, hideConditionalHeaderSelector: incompatiblePro, } = window.SolaceReactCustomize;
    // Disable conditional headers on old versions of the plugin.
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
        if (!incompatiblePro || builder !== 'header') {
            return;
        }
        const control = window.wp.customize.control('solace_header_conditional_selector');
        if (control) {
            return;
        }
        const transparentControl = window.wp.customize.control('solace_transparent_header');
        if (!transparentControl) {
            return;
        }
        const sectionToNotify = transparentControl.params.section;
        window.wp.customize.section(sectionToNotify).notifications.add(new window.wp.customize.Notification('solace-incompatible-conditional', {
            type: 'warning',
            message: dashUpdatesMessage,
        }));
    });
    const renderInstruction = () => {
        if (builder !== 'header' || !currentHeaderName) {
            return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null,
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("strong", null, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.sprintf)(
                /* translators: %1$s builder name (ie: Header) */
                (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('%1$s Builder', 'solace'), builderName) + ':'),
                (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Click on any empty space to add components, or existing components to adjust settings.', 'solace')));
        }
        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null));
    };
    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "builder-instructions" },
        renderInstruction(),
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Button, { style: { padding: 0 }, isLink: true, icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], iconSize: 20, onClick: toggleModal }),
        modalVisible && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Modal, { title: '', className: "solace-ui-modal-wrap", onRequestClose: toggleModal, shouldCloseOnClickOutside: true, isDismissible: true },
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("video", { style: { margin: '0 auto', display: 'block' }, autoPlay: true, muted: true, loop: true, playsInline: true },
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("source", { src: instructionalVid, type: "video/mp4" }))))));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BuilderHeaderNotification);


/***/ }),

/***/ "./assets/apps/customizer-controls/src/builder/components/BuilderItem.tsx":
/*!********************************************************************************!*\
  !*** ./assets/apps/customizer-controls/src/builder/components/BuilderItem.tsx ***!
  \********************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/drag-handle.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close-small.js");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _BuilderContext__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../BuilderContext */ "./assets/apps/customizer-controls/src/builder/BuilderContext.tsx");







const BuilderItem = (props) => {
    const { componentId, currentSection, slot, row, index } = props;
    const { actions, builder, sidebarItems, usedSidebarItems } = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useContext)(_BuilderContext__WEBPACK_IMPORTED_MODULE_5__["default"]);
    const itemDetails = window.SolaceReactCustomize.HFG[builder].items[componentId];
    if (!itemDetails) {
        return null;
    }
    const { name, section } = itemDetails;
    const { removeItem, setSidebarItems, setUsedSidebarItems } = actions;
    const isBlockWidget = section && section.includes('solace_sidebar-widgets');
    const isActive = currentSection === section;
    const currentSection2 = 'solace_' + currentSection;
    const isActiveWidget = currentSection2 === section;
    const itemSection = window.wp.customize.section(section);
    const focusItemWidget = () => {
        const newSection = section.replace('solace_', '');
        window.wp.customize.section(newSection).focus();
    };
    const focusItemSection = () => {
        itemSection.focus();
    };
    const remove = () => {
        removeItem(row, slot, index);
        itemSection.expanded(false);
        setSidebarItems([...sidebarItems, { id: componentId }].sort((a, b) => {
            return a.id < b.id ? -1 : 1;
        }));
        setUsedSidebarItems(usedSidebarItems
            .filter(item => item.id !== componentId)
            .sort((a, b) => {
            return a.id < b.id ? -1 : 1;
        }));
        const items = document.querySelectorAll(`.solace-builder-sidebar-content .sidebar-items .builder-item[data-id="${componentId}"]`);
        items.forEach(item => item.classList.remove('active', 'no-drag'));
    };
    const iconSize = 18;
    const itemClasses = classnames__WEBPACK_IMPORTED_MODULE_4___default()('builder-item', { active: isActive }, { active: isActiveWidget });
    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: itemClasses, "component-id": componentId },
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, { className: "handle", icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], size: 15, onClick: !isBlockWidget ? focusItemSection : focusItemWidget }),
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "name", onClick: !isBlockWidget ? focusItemSection : focusItemWidget }, name),
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "actions" },
            isBlockWidget && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, { icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], iconSize: iconSize, className: "settings", onClick: focusItemSection, label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Widget Settings', 'solace'), showTooltip: false })),
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, { iconSize: iconSize, icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"], className: "remove", onClick: remove, label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Remove Item', 'solace'), showTooltip: false }))));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BuilderItem);


/***/ }),

/***/ "./assets/apps/customizer-controls/src/builder/components/ComponentsPopover.tsx":
/*!**************************************************************************************!*\
  !*** ./assets/apps/customizer-controls/src/builder/components/ComponentsPopover.tsx ***!
  \**************************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/search.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _BuilderContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../BuilderContext */ "./assets/apps/customizer-controls/src/builder/BuilderContext.tsx");






const ComponentsPopover = ({ closePopup, items, rowId, slotId, }) => {
    const [searchQuery, setSearchQuery] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useState)('');
    // const url = window.SolaceReactCustomize.upsellComponentsLink;
    const { builder, actions, sidebarItems, usedSidebarItems } = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useContext)(_BuilderContext__WEBPACK_IMPORTED_MODULE_4__["default"]);
    const { updateLayout, setSidebarItems, setUsedSidebarItems } = actions;
    const allItems = window.SolaceReactCustomize.HFG[builder].items;
    const allItemsAlphabetically = Object.values(allItems).map(item => ({ id: item.id }));
    const addItemToSlot = (itemId) => {
        const itemSection = window.SolaceReactCustomize.HFG[builder].items[itemId].section;
        const componentId = window.SolaceReactCustomize.HFG[builder].items[itemId].id;
        const selectors = document.querySelectorAll(`.solace-builder-sidebar-content .sidebar-items .builder-item[data-id="${componentId}"]`);
        selectors.forEach(selector => selector.classList.add('active', 'no-drag'));
        // console.log( 'window.SolaceReactCustomize.HFG[builder].items[itemId] : ' + JSON.stringify( window.SolaceReactCustomize.HFG[builder].items[itemId], null, 5 ) );
        // window.SolaceReactCustomize.HFG[builder].items[itemId] : {
        // 	"name": "Button Two",
        // 	"description": null,
        // 	"id": "button_base2",
        // 	"width": 2,
        // 	"section": "header_button2",
        // 	"icon": "admin-links",
        // 	"previewImage": null,
        // 	"componentSlug": "hfg-button2",
        // 	"fromTheme": true
        // }			
        window.wp.customize.section(itemSection).focus();
        const nextItems = [...items];
        nextItems.push({ id: itemId });
        updateLayout(rowId, slotId, nextItems);
        setSidebarItems(sidebarItems.filter((i) => i.id !== itemId));
        setUsedSidebarItems([...usedSidebarItems, { id: itemId }]);
        closePopup();
    };
    const searchHandler = (e) => {
        setSearchQuery(e.target.value.toLowerCase());
    };
    const getSidebarItems = (booster = false) => {
        return sidebarItems.filter((item) => {
            const { name, fromTheme } = allItems[item.id];
            if (!booster && !fromTheme) {
                return false;
            }
            if (booster && fromTheme) {
                return false;
            }
            return (name.toLowerCase().includes(searchQuery) ||
                item.id.toString().includes(searchQuery));
        });
    };
    const renderItem = (item, idx, status) => {
        if (!item.id) {
            return null;
        }
        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, { className: `popover-item ${status ? 'active' : ''}`, key: `${item.id}-${idx}`, "data-id": item.id, onClick: () => {
                const isAlreadyUsed = usedSidebarItems.some(used => used.id === item.id);
                if (!isAlreadyUsed) {
                    addItemToSlot(item.id.toString());
                }
            } },
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "name", "data-id": item.id }, allItems[item.id].name)));
    };
    const renderUpsell = (idx, icon, name) => {
        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, { key: idx, className: "popover-item ext", disabled: true, icon: icon },
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "name" }, name),
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "nv-lock" },
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, { icon: "lock", size: 10 }))));
    };
    const renderItems = () => {
        const themeItems = getSidebarItems();
        const boosterItems = getSidebarItems(true);
        const usedIds = new Set(usedSidebarItems.map(item => item.id));
        let noComponents = null;
        if (allItemsAlphabetically.length === 0 && boosterItems.length === 0) {
            noComponents = (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "no-components" },
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", null, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('All available components are used inside the builder', 'solace'))));
        }
        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, noComponents ? (noComponents) : (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null,
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "items-popover-list theme-list popup-list-elements" }, allItemsAlphabetically.map((item, index) => renderItem(item, index, usedIds.has(item.id)))),
            boosterItems.length > 0 && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null,
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h4", null,
                    (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('PRO', 'solace'),
                    ' ',
                    (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Components', 'solace')),
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "items-popover-list booster-list" }, boosterItems.map((item, index) => renderItem(item, index, usedIds.has(item.id))))))))));
    };
    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, { noArrow: false, position: "top center", className: "items-popover", onFocusOutside: closePopup },
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "popover-header list-components", style: { display: 'none' } },
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, { icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"] }),
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("input", { onChange: searchHandler, disabled: sidebarItems.length < 1, type: "search", placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Search for a component…', 'solace') }),
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, { isLink: true, icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], onClick: closePopup })),
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "items-popover-content" }, renderItems())));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ComponentsPopover);


/***/ }),

/***/ "./assets/apps/customizer-controls/src/builder/components/ResponsiveSwitches.tsx":
/*!***************************************************************************************!*\
  !*** ./assets/apps/customizer-controls/src/builder/components/ResponsiveSwitches.tsx ***!
  \***************************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _BuilderContext__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../BuilderContext */ "./assets/apps/customizer-controls/src/builder/BuilderContext.tsx");
/* harmony import */ var _BuilderHeaderNotification__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./BuilderHeaderNotification */ "./assets/apps/customizer-controls/src/builder/components/BuilderHeaderNotification.tsx");







const ResponsiveSwitches = ({ device }) => {
    const { actions, builder } = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useContext)(_BuilderContext__WEBPACK_IMPORTED_MODULE_5__["default"]);
    const { setDevice } = actions;
    const buttons = [
        { title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Desktop', 'solace'), icon: 'desktop', slug: 'desktop' },
        { title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Mobile', 'solace'), icon: 'smartphone', slug: 'mobile' },
    ];
    const { devices, title: builderName } = window.SolaceReactCustomize.HFG[builder];
    const shownButtons = buttons.filter(({ slug }) => Object.keys(devices).includes(slug));
    const switchDevice = (nextDevice) => {
        if (device === nextDevice) {
            return false;
        }
        window.wp.customize.previewedDevice(nextDevice);
        setDevice(nextDevice);
    };
    const [isActive, setIsActive] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(false);
    const handleButtonHide = () => {
        builderHide(builder); // Panggil fungsi builderHide dengan parameter builder di dalam fungsi ini
    };
    const builderHide = (e) => {
        const bodyElement = document.body;
        const portalWrapElement = document.querySelector('.solace-builder-portal-wrap');
        bodyElement.classList.toggle('hide-builder-' + e);
        setIsActive(prevState => !prevState);
    };
    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "builder-header" },
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "responsive-switches" }, shownButtons.map((button, index) => {
            const { title, icon, slug } = button;
            const buttonClasses = classnames__WEBPACK_IMPORTED_MODULE_1___default()('device-switcher', {
                active: slug === device,
            });
            return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Button, { className: buttonClasses, key: index, icon: icon, onClick: () => switchDevice(slug) }, title));
        })),
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_BuilderHeaderNotification__WEBPACK_IMPORTED_MODULE_6__["default"], { builder: builder, builderName: builderName }),
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "hide-builder" },
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Button, { onClick: handleButtonHide },
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("svg", { width: "13", height: "14", viewBox: "0 0 13 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M0.515267 6.38145C0.596444 6.30014 0.692854 6.23564 0.798983 6.19163C0.905111 6.14762 1.01888 6.12497 1.13377 6.12497C1.24866 6.12497 1.36242 6.14762 1.46855 6.19163C1.57468 6.23564 1.67109 6.30014 1.75227 6.38145L6.37627 11.0074L11.0013 6.38145C11.081 6.29388 11.1778 6.22342 11.2856 6.17434C11.3934 6.12526 11.51 6.09858 11.6285 6.09592C11.7469 6.09326 11.8646 6.11468 11.9745 6.15886C12.0844 6.20305 12.1842 6.26909 12.2678 6.35299C12.3514 6.43688 12.4172 6.53688 12.461 6.64693C12.5048 6.75698 12.5259 6.87478 12.5228 6.99319C12.5198 7.11161 12.4927 7.22817 12.4433 7.33582C12.3939 7.44347 12.3231 7.53996 12.2353 7.61945L6.99627 12.8624C6.91509 12.9438 6.81868 13.0083 6.71255 13.0523C6.60642 13.0963 6.49266 13.1189 6.37777 13.1189C6.26288 13.1189 6.14911 13.0963 6.04298 13.0523C5.93685 13.0083 5.84044 12.9438 5.75927 12.8624L0.515267 7.61945C0.433962 7.53827 0.36946 7.44186 0.325451 7.33573C0.281442 7.2296 0.258789 7.11584 0.258789 7.00095C0.258789 6.88606 0.281442 6.77229 0.325451 6.66616C0.36946 6.56003 0.433962 6.46262 0.515267 6.38145Z", fill: "#FD9507" }),
                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6.37742 0.882813C6.60922 0.882813 6.83152 0.974895 6.99543 1.1388C7.15934 1.30271 7.25142 1.52501 7.25142 1.75681V10.4948C7.25142 10.7266 7.15934 10.9489 6.99543 11.1128C6.83152 11.2767 6.60922 11.3688 6.37742 11.3688C6.14562 11.3688 5.92331 11.2767 5.75941 11.1128C5.5955 10.9489 5.50342 10.7266 5.50342 10.4948V1.75781C5.50329 1.64295 5.5258 1.52919 5.56966 1.42304C5.61352 1.31689 5.67788 1.22042 5.75905 1.13915C5.84022 1.05789 5.93662 0.993422 6.04272 0.949437C6.14883 0.905452 6.26256 0.882812 6.37742 0.882813Z", fill: "#FD9507" })),
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: `text ${builder}` }, isActive ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Show Builder', 'solace') : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Hide Builder', 'solace'))))));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ResponsiveSwitches);


/***/ }),

/***/ "./assets/apps/customizer-controls/src/builder/components/Row.tsx":
/*!************************************************************************!*\
  !*** ./assets/apps/customizer-controls/src/builder/components/Row.tsx ***!
  \************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/cog.js");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _Slot__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Slot */ "./assets/apps/customizer-controls/src/builder/components/Slot.tsx");
/* harmony import */ var _BuilderContext__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../BuilderContext */ "./assets/apps/customizer-controls/src/builder/BuilderContext.tsx");








const Row = ({ items, rowId }) => {
    const { actions, dragging, builder, hasColumns, previewSidebar } = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useContext)(_BuilderContext__WEBPACK_IMPORTED_MODULE_6__["default"]);
    const { updateLayout, togglePreviewSidebar, updateSidebarItems, updateUsedSidebarItems } = actions;
    const slots = ['left', 'c-left', 'center', 'c-right', 'right'];
    const section = `hfg_${builder}_layout_${rowId}`;
    const columnsSetting = `${section}_columns_number`;
    const columnsLayoutSetting = `${section}_columns_layout`;
    const [columns, setColumns] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useState)(0);
    const [colLayout, setColLayout] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useState)('equal');
    const [currentRow, setCurrentRow] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useState)(false);
    const focusRowSection = () => {
        if (rowId === 'sidebar') {
            toggleThemeSidebar(true);
        }
        window.wp.customize.section(section).focus();
    };
    /**
     * Check if the section is active when sections are expanded.
     */
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useEffect)(() => {
        window.wp.customize.state('expandedSection').bind(rowSettingsHandler);
        if (hasColumns) {
            bindColumnsSync();
        }
        return () => {
            window.wp.customize
                .state('expandedSection')
                .unbind(rowSettingsHandler);
        };
    }, []);
    const rowSettingsHandler = (expandedSection) => {
        if (!expandedSection || expandedSection.id !== section) {
            setCurrentRow(false);
            return false;
        }
        if (expandedSection.id === section) {
            setCurrentRow(true);
        }
    };
    const bindColumnsSync = () => {
        const colNumber = window.wp.customize
            .control(columnsSetting)
            .setting.get();
        setColumns(parseInt(colNumber));
        setColLayout(window.wp.customize.control(columnsLayoutSetting).setting.get());
        const syncColNumber = (nextValue) => {
            const parsedColNumber = parseInt(nextValue);
            slots.forEach((slot, index) => {
                if (index + 1 > parsedColNumber) {
                    updateLayout(rowId, slot, []);
                }
            });
            setColumns(parsedColNumber);
            updateSidebarItems();
            updateUsedSidebarItems();
        };
        window.wp.customize.control(columnsSetting, (control) => {
            control.setting.bind((nextValue) => {
                syncColNumber(nextValue);
            });
        });
        window.wp.customize.control(columnsLayoutSetting, (control) => {
            control.setting.bind((nextValue) => {
                setColLayout(nextValue);
            });
        });
    };
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useEffect)(() => {
        if (rowId !== 'sidebar') {
            return;
        }
        // Toggle sidebar button when sidebar is toggled from preview.
        window.wp.customize.previewer.bind('solace-toggle-navbar', (e) => {
            const { status } = e;
            togglePreviewSidebar(status);
        });
    }, []);
    // Toggle sidebar in preview.
    const toggleThemeSidebar = (status) => {
        window.wp.customize.previewer.send(status ? 'header_sidebar_open' : 'header_sidebar_close');
        togglePreviewSidebar(status);
    };
    if (rowId === 'sidebar') {
        const hasItems = items && items.length > 0;
        const rowClasses = classnames__WEBPACK_IMPORTED_MODULE_4___default()('row', rowId, { 'has-items': hasItems });
        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: rowClasses },
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "sidebar-actions" },
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, { icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], iconSize: 18, className: "row-settings", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Row Setting', 'solace'), onClick: focusRowSection, isPrimary: currentRow }),
                hasItems && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, { onClick: () => {
                        toggleThemeSidebar(!previewSidebar);
                    }, icon: previewSidebar ? 'hidden' : 'visibility', className: "row-settings", isPrimary: previewSidebar, label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Toggle Sidebar', 'solace') }))),
            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "row-inner" },
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Slot__WEBPACK_IMPORTED_MODULE_5__["default"], { slotId: rowId, rowId: rowId, items: items || [] }))));
    }
    const hasCenterItems = items.center && items.center.length > 0;
    const centerItemsClass = hasCenterItems || hasColumns ? 'has-center' : 'no-center';
    const centerWrapClass = classnames__WEBPACK_IMPORTED_MODULE_4___default()('slots-wrap', 'slots-center-wrap', {
        expanded: dragging,
    });
    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: `row ${rowId} ${centerItemsClass}` },
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, { icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], iconSize: 18, className: "row-settings", onClick: focusRowSection, isPrimary: currentRow }),
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "inner-row" },
            !hasColumns && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null,
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "slots-wrap slots-left-wrap" }, ['left', 'c-left'].map((slotId, index) => {
                    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Slot__WEBPACK_IMPORTED_MODULE_5__["default"], { key: index, rowId: rowId, slotId: slotId, items: items[slotId] || [] }));
                })),
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: centerWrapClass },
                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Slot__WEBPACK_IMPORTED_MODULE_5__["default"], { rowId: rowId, slotId: 'center', items: items.center || [] })),
                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "slots-wrap slots-right-wrap" }, ['c-right', 'right'].map((slotId, index) => {
                    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Slot__WEBPACK_IMPORTED_MODULE_5__["default"], { key: index, rowId: rowId, slotId: slotId, items: items[slotId] || [] }));
                })))),
            hasColumns && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: `slots-wrap column-slots-wrap col-${columns} ${colLayout}` }, slots.map((slotId, index) => {
                const slotClasses = classnames__WEBPACK_IMPORTED_MODULE_4___default()({
                    hide: index >= columns,
                    last: index === columns - 1,
                    single: index === 0 && columns === 1,
                });
                return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Slot__WEBPACK_IMPORTED_MODULE_5__["default"], { key: index, rowId: rowId, slotId: slotId, items: items[slotId] || [], className: slotClasses }));
            }))))));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Row);


/***/ }),

/***/ "./assets/apps/customizer-controls/src/builder/components/Slot.tsx":
/*!*************************************************************************!*\
  !*** ./assets/apps/customizer-controls/src/builder/components/Slot.tsx ***!
  \*************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/plus.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _BuilderItem__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./BuilderItem */ "./assets/apps/customizer-controls/src/builder/components/BuilderItem.tsx");
/* harmony import */ var _BuilderContext__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../BuilderContext */ "./assets/apps/customizer-controls/src/builder/BuilderContext.tsx");
/* harmony import */ var _ComponentsPopover__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ComponentsPopover */ "./assets/apps/customizer-controls/src/builder/components/ComponentsPopover.tsx");









const Slot = ({ items, slotId, rowId, className }) => {
    const { currentSection, builder, actions, dragging } = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useContext)(_BuilderContext__WEBPACK_IMPORTED_MODULE_6__["default"]);
    const { updateLayout, onDragStart } = actions;
    const [popupOpen, setPopupOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(false);
    const slotClasses = classnames__WEBPACK_IMPORTED_MODULE_1___default()('droppable-wrap', slotId, className, {
        'has-popover': popupOpen,
        overflowed: items.length >= 3 && rowId !== 'sidebar',
    });
    const openPopup = () => setPopupOpen(true);
    const closePopup = () => setPopupOpen(false);
    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: slotClasses },
        react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_sortablejs__WEBPACK_IMPORTED_MODULE_2__.ReactSortable, { animation: 60, className: 'droppable', onStart: onDragStart, group: builder, list: items, setList: (newState) => {
                const nextState = newState.map((item) => {
                    return { id: item.id };
                });
                updateLayout(rowId, slotId, nextState);
            } }, items &&
            items.length > 0 &&
            items.map((item, index) => {
                return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_BuilderItem__WEBPACK_IMPORTED_MODULE_5__["default"], { key: index, row: rowId, slot: slotId, index: index, componentId: item.id, currentSection: currentSection }));
            })),
        !dragging && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Button, { className: "open-popover", onClick: openPopup, icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"], isPrimary: true })),
        popupOpen && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ComponentsPopover__WEBPACK_IMPORTED_MODULE_7__["default"], { items: items, rowId: rowId, slotId: slotId, closePopup: closePopup }))));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Slot);


/***/ })

}]);
//# sourceMappingURL=a2a12cb4309e627d16de.js.map