/******/ (function() { // webpackBootstrap /******/ var __webpack_modules__ = ({ /***/ "./src/ast-checkbox.js": /*!*****************************!*\ !*** ./src/ast-checkbox.js ***! \*****************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* 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__); const { ToggleControl } = wp.components; const AstCheckboxControl = props => { return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(ToggleControl, { className: props.name, label: props.label, checked: props.value, onChange: val => { val = true === val ? 'disabled' : ''; props.onChange(val); } }); }; /* harmony default export */ __webpack_exports__["default"] = (AstCheckboxControl); /***/ }), /***/ "./src/ast-radio-image.js": /*!********************************!*\ !*** ./src/ast-radio-image.js ***! \********************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* 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 _assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../assets/svg/svgs.json */ "../../../assets/svg/svgs.json"); const AstRadioImageControl = props => { const { label, description, id, choices, metavalue } = props; const onLayoutChange = value => { props.onChange(value); }; let htmlLabel = null, htmlDescription = null, htmlRadio; const counterClass = Object.keys(choices).length ? 'ast-radio-option-' + Object.keys(choices).length : ''; if (label) { htmlLabel = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "customize-control-title" }, label); } if (description) { htmlDescription = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "description customize-control-description" }, description); } htmlRadio = Object.entries(choices).map(_ref => { let [key, data] = _ref; let value = data.value; let checked = metavalue === value ? true : false; return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, { key: key }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", { className: "image-select", type: "radio", value: value, name: id, id: id + '-' + value, checked: checked, onChange: () => onLayoutChange(value) }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", { htmlFor: id + '-' + value, className: "ast-radio-img-svg" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "ast-meta-image-tooltip" }, data.label), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { dangerouslySetInnerHTML: { __html: _assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_1__[value] } }))); }); return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-radio-image-controller" }, (htmlLabel || htmlDescription) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, htmlLabel, htmlDescription), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { id: `input_${id}`, className: `options-wrapper ${counterClass}` }, htmlRadio)); }; /* harmony default export */ __webpack_exports__["default"] = (AstRadioImageControl); /***/ }), /***/ "./src/ast-selector.js": /*!*****************************!*\ !*** ./src/ast-selector.js ***! \*****************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* 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_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__); const AstSelectorControl = props => { const { label, description, id, metavalue, choices } = props; const onValueChange = value => { props.onChange(value); }; if (!choices) { return; } let labelHtml = null; let descriptionHtml = null; if (label) { labelHtml = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "ast-meta-sortable-title" }, label); } if (description) { descriptionHtml = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "ast-meta-sortable-description" }, description); } let optionsHtml = Object.entries(choices).map(_ref => { let [key, data] = _ref; let value = data.value; var html = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-selector-inner-wrap", key: key }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, { key: key, onClick: () => onValueChange(value), "aria-pressed": value === metavalue, isPrimary: value === metavalue, label: data.label }, data.label)); return html; }); return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { id: id, className: "ast-meta-selector-controller" }, (labelHtml || descriptionHtml) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, labelHtml, descriptionHtml), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-meta-selector-wrapper" }, optionsHtml)); }; /* harmony default export */ __webpack_exports__["default"] = (AstSelectorControl); /***/ }), /***/ "./src/astra-color-picker-control.js": /*!*******************************************!*\ !*** ./src/astra-color-picker-control.js ***! \*******************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* 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 prop_types__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! prop-types */ "./node_modules/prop-types/index.js"); /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_4__); /* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n"); /* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_media_utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/media-utils */ "@wordpress/media-utils"); /* harmony import */ var _wordpress_media_utils__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_media_utils__WEBPACK_IMPORTED_MODULE_3__); const AstraGradientPicker = astMetaParams.isWP_5_9 ? _wordpress_components__WEBPACK_IMPORTED_MODULE_2__.GradientPicker : _wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalGradientPicker; const defaultGradient = 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)'; const maybeGetColorForVariable = (color, palette) => { const paletteColors = palette.palette; if (undefined !== color && color.includes('var')) { // Get color index from palette for color variable. const colorIndex = color.charAt(color.length - 2); color = paletteColors[colorIndex]; } return color; }; const globalIconSVG = () => { return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", className: "astra-globe-dashicon" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", { d: "M7.99997 0.499249C12.143 0.499249 15.5015 3.85775 15.5015 8.00075C15.5015 12.143 12.143 15.5015 7.99997 15.5015C3.85697 15.5015 0.498474 12.143 0.498474 8.00075C0.498474 3.85775 3.85697 0.499249 7.99997 0.499249ZM10.2042 11.375H5.79497C6.28397 13.1855 7.13447 14.3765 7.99922 14.3765C8.86397 14.3765 9.71447 13.1855 10.2035 11.375H10.2042ZM4.63172 11.375H2.58872C3.31285 12.5337 4.38885 13.4302 5.65922 13.9332C5.26772 13.3182 4.94447 12.5487 4.70672 11.672L4.63022 11.3757L4.63172 11.375ZM13.4105 11.375H11.369C11.126 12.3762 10.775 13.25 10.3392 13.9332C11.5294 13.4625 12.5509 12.6455 13.2717 11.588L13.4105 11.3757V11.375ZM4.32047 6.5H1.80122L1.79747 6.51275C1.68111 7.00019 1.62246 7.49962 1.62272 8.00075C1.62272 8.79275 1.76747 9.551 2.03147 10.2507H4.41122C4.2301 9.00898 4.19912 7.74992 4.31897 6.50075L4.32047 6.5ZM10.5477 6.5H5.45222C5.32027 7.74899 5.35432 9.00995 5.55347 10.25H10.4465C10.6456 9.00994 10.6796 7.74899 10.5477 6.5ZM14.1987 6.5H11.6802C11.7267 6.98525 11.7515 7.48775 11.7515 8C11.7527 8.75301 11.698 9.50507 11.588 10.25H13.9677C14.2385 9.5308 14.3767 8.76849 14.3757 8C14.3757 7.48325 14.3142 6.98 14.1987 6.5ZM5.65997 2.0675L5.64272 2.0735C4.10779 2.68641 2.86957 3.86953 2.18747 5.375H4.47347C4.70897 4.061 5.11847 2.9165 5.66072 2.0675H5.65997ZM7.99997 1.62425L7.91297 1.628C6.96497 1.715 6.04697 3.2165 5.62247 5.375H10.379C9.95447 3.2225 9.04172 1.72325 8.09522 1.62875L7.99997 1.625V1.62425ZM10.34 2.06675L10.4202 2.198C10.922 3.032 11.303 4.127 11.5265 5.37575H13.8125C13.1614 3.93881 12.0025 2.793 10.5582 2.15825L10.34 2.0675V2.06675Z" })); }; class AstraColorPickerControl extends _wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Component { constructor(props) { super(...arguments); this.onChangeComplete = this.onChangeComplete.bind(this); this.onOverlayChangeComplete = this.onOverlayChangeComplete.bind(this); this.onChangeOverlayGradientComplete = this.onChangeOverlayGradientComplete.bind(this); this.onPaletteChangeComplete = this.onPaletteChangeComplete.bind(this); this.onChangeGradientComplete = this.onChangeGradientComplete.bind(this); this.renderImageSettings = this.renderImageSettings.bind(this); this.onRemoveImage = this.onRemoveImage.bind(this); this.onSelectImage = this.onSelectImage.bind(this); this.open = this.open.bind(this); this.onColorClearClick = this.onColorClearClick.bind(this); this.onColorResetClick = this.onColorResetClick.bind(this); this.state = { isVisible: false, refresh: false, color: this.props.color, modalCanClose: true, backgroundType: this.props.backgroundType, overlayType: this.props.overlayType, supportGradient: undefined === AstraGradientPicker ? false : true }; } onResetRefresh() { if (this.state.refresh === true) { this.setState({ refresh: false }); } else { this.setState({ refresh: true }); } } componentDidMount() { // Add a click event listener to the document when the component mounts. document.addEventListener('click', this.handleClickOutside); } componentDidUpdate() { // If the color picker is already open, hide the second color picker. if (document.querySelectorAll('.open').length > 1) { const colorPickerPosition = 1; const otherColorPicker = document.querySelectorAll('.astra-popover-color')[colorPickerPosition]; if (otherColorPicker) { otherColorPicker.style.display = 'none'; } } } componentWillUnmount() { // Remove the event listener when the component unmounts. document.removeEventListener('click', this.handleClickOutside); } handleClickOutside = event => { // If clicked on elements outside the range then close the modal. const isOutsideClickRange = !event.target.closest('.astra-popover-color') && !event.target.closest('.astra-advanced-color-indicate') && !event.target.closest('.media-modal-content') && !event.target.closest('.dashicons-format-image') && !event.target.closest('.components-popover__content') && !event.target.closest('.ast-bg-img-remove'); if (this.state.isVisible && isOutsideClickRange) { // If the click is outside the modal, close it. this.closePicker(); } }; closePicker = () => { if (this.state.isVisible === true) { this.setState({ isVisible: false }); } }; render() { const { refresh, modalCanClose, isVisible, supportGradient, backgroundType } = this.state; const { allowGradient, allowImage } = this.props; var disablePalette = this.props.disablePalette; var enableDeleteIcon = this.props.enableDeleteIcon; const toggleVisible = () => { if (refresh === true) { this.setState({ refresh: false }); } else { this.setState({ refresh: true }); } this.setState({ isVisible: true }); }; const toggleClose = () => { if (modalCanClose) { if (isVisible === true) { this.setState({ isVisible: false }); } } }; const showingGradient = allowGradient && supportGradient ? true : false; let tabs = [{ name: 'color', title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Color', 'astra'), className: 'astra-color-background' }]; if (showingGradient) { let gradientTab = { name: 'gradient', title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Gradient', 'astra'), className: 'astra-image-background' }; tabs.push(gradientTab); } if (allowImage) { let imageTab = { name: 'image', title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Image', 'astra'), className: 'astra-image-background' }; tabs.push(imageTab); } let finalpaletteColors = []; const defaultGradient = 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)'; let globalColorPalette = { 'palette': ["#046bd2", "#045cb4", "#1e293b", "#334155", "#f9fafb", "#FFFFFF", "#e2e8f0", "#cbd5e1", "#94a3b8"] }; if (astMetaParams.global_color_palette) { globalColorPalette = { 'palette': astMetaParams.global_color_palette.palette }; } Object.entries(globalColorPalette.palette).forEach(_ref => { let [index, color] = _ref; let palettePrefix = '--ast-global-color-'; const paletteLables = ['Color 1', 'Color 2', 'Color 3', 'Color 4', 'Color 5', 'Color 6', 'Color 7', 'Color 8', 'Color 9']; let paletteColors = {}; Object.assign(paletteColors, { name: paletteLables[index], color: 'var(' + palettePrefix + index + ')' }); finalpaletteColors.push(paletteColors); }); return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: this.props.color && this.props.color.includes('var') ? 'color-button-wrap has-global-palette-color' : 'color-button-wrap' }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Button, { className: isVisible ? 'astra-color-icon-indicate open' : 'astra-color-icon-indicate', onClick: () => { isVisible ? toggleClose() : toggleVisible(); } }, ('color' === backgroundType || 'gradient' === backgroundType) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorIndicator, { className: "astra-advanced-color-indicate", colorValue: this.props.color }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "global-color" }, globalIconSVG())), 'image' === backgroundType && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorIndicator, { className: "astra-advanced-color-indicate", colorValue: "#ffffff" }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Dashicon, { icon: "format-image" })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "astra-color-picker-wrap " + (isVisible ? 'picker-open' : '') }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, isVisible && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "astra-popover-color", onClose: toggleClose }, 1 < tabs.length && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.TabPanel, { className: "astra-popover-tabs astra-background-tabs", activeClass: "active-tab", initialTabName: backgroundType, tabs: tabs }, tab => { let tabout; if (tab.name) { if ('gradient' === tab.name) { tabout = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(AstraGradientPicker, { className: `ast-gradient-color-picker ${astMetaParams.isWP_5_9 ? 'ast-gradient-ui' : ''}`, gradients: [], value: this.props.color && this.props.color.includes('gradient') ? this.props.color : defaultGradient, onChange: gradient => this.onChangeGradientComplete(gradient) })); } if ('image' === tab.name) { tabout = this.renderImageSettings(); } else if ('color' === tab.name) { tabout = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !disablePalette && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPalette, { colors: finalpaletteColors, value: this.props.color, clearable: false, disableCustomColors: true, className: "ast-color-palette", onChange: color => this.onPaletteChangeComplete(color) })), refresh && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { color: maybeGetColorForVariable(this.props.color, globalColorPalette), onChangeComplete: color => this.onChangeComplete(color) })), !refresh && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { color: maybeGetColorForVariable(this.props.color, globalColorPalette), onChangeComplete: color => this.onChangeComplete(color) })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { type: "button", onClick: () => { this.onColorClearClick(); }, className: "ast-clear-btn-inside-picker components-button common components-circular-option-picker__clear is-secondary is-small" }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Clear', 'astra'))); } } return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, tabout); }), 1 === tabs.length && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !disablePalette && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPalette, { colors: finalpaletteColors, value: this.props.color, clearable: false, disableCustomColors: true, className: "ast-color-palette", onChange: color => this.onPaletteChangeComplete(color) })), refresh && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { color: maybeGetColorForVariable(this.props.color, globalColorPalette), onChangeComplete: color => this.onChangeComplete(color) })), !refresh && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { color: maybeGetColorForVariable(this.props.color, globalColorPalette), onChangeComplete: color => this.onChangeComplete(color) })), !disablePalette && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { type: "button", onClick: () => { this.onColorClearClick(); }, className: "ast-clear-btn-inside-picker components-button components-circular-option-picker__clear is-secondary is-small" }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Clear', 'astra'))), disablePalette && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { type: "button", onClick: () => { this.onColorResetClick(); }, className: "ast-reset-btn-inside-picker components-button common components-circular-option-picker__reset is-secondary is-small" }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Reset', 'astra'))))))); } onColorClearClick() { if (this.state.refresh === true) { this.setState({ refresh: false }); } else { this.setState({ refresh: true }); } this.props.onChangeComplete('', 'color'); } onColorResetClick() { if (this.state.refresh === true) { this.setState({ refresh: false }); } else { this.setState({ refresh: true }); } this.props.onColorResetClick('', 'color'); } onChangeGradientComplete(gradient) { this.setState({ backgroundType: 'gradient' }); this.props.onChangeComplete(gradient, 'gradient'); } onChangeComplete(color) { let newColor; if (color.rgb && color.rgb.a && 1 !== color.rgb.a) { newColor = 'rgba(' + color.rgb.r + ',' + color.rgb.g + ',' + color.rgb.b + ',' + color.rgb.a + ')'; } else { newColor = color.hex; } this.setState({ backgroundType: 'color' }); this.props.onChangeComplete(color, 'color'); } onOverlayChangeComplete(color) { let newColor; if (color.rgb && color.rgb.a && 1 !== color.rgb.a) { newColor = 'rgba(' + color.rgb.r + ',' + color.rgb.g + ',' + color.rgb.b + ',' + color.rgb.a + ')'; } else { newColor = color.hex; } this.onChangeImageOptions('overlayType', 'overlay-type', 'classic'); this.onChangeImageOptions('overlayColor', 'overlay-color', newColor); } onChangeOverlayGradientComplete(gradient) { this.onChangeImageOptions('overlayType', 'overlay-type', 'gradient'); this.onChangeImageOptions('overlayGradient', 'overlay-gradient', gradient); } onOverlayTabSelect(tabName) { this.onChangeImageOptions('overlayType', 'overlay-type', tabName); } onPaletteChangeComplete(color) { this.setState({ color: color }); if (this.state.refresh === true) { this.setState({ refresh: false }); } else { this.setState({ refresh: true }); } this.props.onChangeComplete(color, 'color'); } onSelectImage(media) { this.setState({ modalCanClose: true }); this.setState({ backgroundType: 'image' }); this.props.onSelectImage(media, 'image'); } onRemoveImage() { this.setState({ modalCanClose: true }); this.props.onSelectImage(''); } open(open) { this.setState({ modalCanClose: false }); open(); } onChangeImageOptions(tempKey, mainkey, value) { this.setState({ backgroundType: 'image' }); this.props.onChangeImageOptions(mainkey, value, 'image'); } toggleMoreSettings() { let parent = event.target.parentElement.parentElement; let trigger = parent.querySelector('.more-settings'); let wrapper = parent.querySelector('.media-position-setting'); let dataDirection = trigger.dataset.direction; let dataId = trigger.dataset.id; if ('down' === dataDirection) { trigger.setAttribute('data-direction', 'up'); parent.querySelector('.message').innerHTML = (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Less Settings"); parent.querySelector('.icon').innerHTML = '↑'; } else { trigger.setAttribute('data-direction', 'down'); parent.querySelector('.message').innerHTML = (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("More Settings"); parent.querySelector('.icon').innerHTML = '↓'; } if (wrapper.classList.contains('hide-settings')) { wrapper.classList.remove('hide-settings'); } else { wrapper.classList.add('hide-settings'); } } renderImageSettings() { let overlayTabs = [{ name: 'none', title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('None', 'astra'), className: 'astra-none-overlay-bg' }, { name: 'classic', title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Classic', 'astra'), className: 'astra-classic-overlay-bg' }, { name: 'gradient', title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Gradient', 'astra'), className: 'astra-gradient-overlay-bg' }]; let finalpaletteColors = []; const defaultGradient = 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)'; let globalColorPalette = { 'palette': ["#046bd2", "#045cb4", "#1e293b", "#334155", "#f9fafb", "#FFFFFF", "#e2e8f0", "#cbd5e1", "#94a3b8"] }; if (astMetaParams.global_color_palette) { globalColorPalette = { 'palette': astMetaParams.global_color_palette.palette }; } Object.entries(globalColorPalette.palette).forEach(_ref2 => { let [index, color] = _ref2; let palettePrefix = '--ast-global-color-'; const paletteLables = ['Color 1', 'Color 2', 'Color 3', 'Color 4', 'Color 5', 'Color 6', 'Color 7', 'Color 8', 'Color 9']; let paletteColors = {}; Object.assign(paletteColors, { name: paletteLables[index], color: 'var(' + palettePrefix + index + ')' }); finalpaletteColors.push(paletteColors); }); return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (this.props.media.url || this.props.backgroundImage) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", { src: this.props.media.url ? this.props.media.url : this.props.backgroundImage }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_media_utils__WEBPACK_IMPORTED_MODULE_3__.MediaUpload, { title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Select Background Image", 'astra'), onSelect: media => this.onSelectImage(media), allowedTypes: ["image"], value: this.props.media && this.props.media ? this.props.media : '', render: _ref3 => { let { open } = _ref3; return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Button, { className: "upload-button button-add-media", isDefault: true, onClick: () => this.open(open) }, !this.props.media.url && !this.props.backgroundImage ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Select Background Image", 'astra') : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Replace image", 'astra')); } }), (this.props.media.url || this.props.backgroundImage) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Button, { className: "ast-bg-img-remove", onClick: this.onRemoveImage, isLink: true, isDestructive: true }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Remove Image", 'astra')), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", { href: "#", className: "more-settings", onClick: this.toggleMoreSettings, "data-direction": "down", "data-id": "desktop" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "message" }, " ", (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("More Settings"), " "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "icon" }, " \u2193 ")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "media-position-setting hide-settings" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, { label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Image Position"), value: this.props.backgroundPosition, onChange: value => this.onChangeImageOptions('backgroundPosition', 'background-position', value), options: [{ value: "left top", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Left Top", 'astra') }, { value: "left center", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Left Center", 'astra') }, { value: "left bottom", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Left Bottom", 'astra') }, { value: "right top", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Right Top", 'astra') }, { value: "right center", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Right Center", 'astra') }, { value: "right bottom", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Right Bottom", 'astra') }, { value: "center top", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Center Top", 'astra') }, { value: "center center", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Center Center", 'astra') }, { value: "center bottom", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Center Bottom", 'astra') }] }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, { label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Attachment", 'astra'), value: this.props.backgroundAttachment, onChange: value => this.onChangeImageOptions('backgroundAttachment', 'background-attachment', value), options: [{ value: "fixed", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Fixed", 'astra') }, { value: "scroll", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Scroll", 'astra') }] }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, { label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Repeat", 'astra'), value: this.props.backgroundRepeat, onChange: value => this.onChangeImageOptions('backgroundRepeat', 'background-repeat', value), options: [{ value: "no-repeat", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("No Repeat", 'astra') }, { value: "repeat", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Repeat All", 'astra') }, { value: "repeat-x", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Repeat Horizontally", 'astra') }, { value: "repeat-y", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Repeat Vertically", 'astra') }] }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, { label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Size", 'astra'), value: this.props.backgroundSize, onChange: value => this.onChangeImageOptions('backgroundSize', 'background-size', value), options: [{ value: "auto", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Auto", 'astra') }, { value: "cover", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Cover", 'astra') }, { value: "contain", label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Contain", 'astra') }] }), 1 < overlayTabs.length && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, " ", (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Image Overlay", 'astra'), " "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.TabPanel, { className: "astra-popover-tabs astra-background-tabs", activeClass: "active-tab", initialTabName: this.props.overlayType, onSelect: tabName => this.onOverlayTabSelect(tabName), tabs: overlayTabs }, tab => { let tabout; if (tab.name) { if ('gradient' === tab.name) { tabout = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(AstraGradientPicker, { className: `ast-gradient-color-picker ${astMetaParams.isWP_5_9 ? 'ast-gradient-ui' : ''}`, gradients: [], value: this.props.overlayGradient || defaultGradient, onChange: gradient => this.onChangeOverlayGradientComplete(gradient) })); } else if ('classic' === tab.name) { tabout = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { color: maybeGetColorForVariable(this.props.overlayColor, globalColorPalette), onChangeComplete: color => this.onOverlayChangeComplete(color) }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { type: "button", onClick: () => this.onChangeImageOptions('overlayColor', 'overlay-color', ''), className: "ast-clear-btn-inside-picker components-button common components-circular-option-picker__clear is-secondary is-small" }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Clear', 'astra'))); } } return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, tabout); }))))); } } AstraColorPickerControl.propTypes = { color: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string), usePalette: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().bool), palette: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().string), presetColors: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().object), onChangeComplete: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func), onPaletteChangeComplete: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func), onPaletteChangeComplete: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func), onChangeOverlayGradientComplete: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func), onChange: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().func), customizer: (prop_types__WEBPACK_IMPORTED_MODULE_4___default().object) }; /* harmony default export */ __webpack_exports__["default"] = (AstraColorPickerControl); /***/ }), /***/ "./src/responsive-background.js": /*!**************************************!*\ !*** ./src/responsive-background.js ***! \**************************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* 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 prop_types__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! prop-types */ "./node_modules/prop-types/index.js"); /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_7__); /* 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 _astra_color_picker_control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./astra-color-picker-control */ "./src/astra-color-picker-control.js"); /* 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 react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__); /* harmony import */ var html_react_parser__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! html-react-parser */ "./node_modules/html-react-parser/index.mjs"); /* harmony import */ var _assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../assets/svg/svgs.json */ "../../../assets/svg/svgs.json"); const ResponsiveBackground = props => { const { metavalue } = props; let defaultPropsValue = props.control.default; const [state, setState] = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)({ value: metavalue }); const updateValues = obj => { setState(prevState => ({ ...prevState, value: obj })); props.control.setMetaFieldValue(obj, props.control.controlName); }; const updateBackgroundType = device => { let value = props.metavalue; let obj = { ...value }; if (!state.value[device]['background-type']) { let deviceObj = { ...obj[device] }; if (state.value[device]['background-color']) { deviceObj['background-type'] = 'color'; obj[device] = deviceObj; updateValues(obj); if (state.value[device]['background-color'].includes('gradient')) { deviceObj['background-type'] = 'gradient'; obj[device] = deviceObj; updateValues(obj); } } if (state.value[device]['background-image']) { deviceObj['background-type'] = 'image'; obj[device] = deviceObj; updateValues(obj); } } }; const renderReset = () => { let reserBtnDisabled = true; let devices = ['desktop', 'mobile', 'tablet']; for (let device of devices) { if (state.value[device]['background-color'] !== defaultPropsValue[device]['background-image'] || state.value[device]['background-image'] !== defaultPropsValue[device]['background-color'] || state.value[device]['background-media'] !== defaultPropsValue[device]['background-media']) { reserBtnDisabled = false; } } return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-color-btn-reset-wrap" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { className: "ast-reset-btn components-button components-circular-option-picker__clear is-secondary is-small", disabled: reserBtnDisabled, onClick: e => { e.preventDefault(); let value = JSON.parse(JSON.stringify(defaultPropsValue)); if (undefined !== value && '' !== value) { for (let device in value) { if (undefined === value[device]['background-color'] || '' === value[device]['background-color']) { value[device]['background-color'] = ''; } if (undefined === value[device]['background-image'] || '' === value[device]['background-image']) { value[device]['background-image'] = ''; } if (undefined === value[device]['background-media'] || '' === value[device]['background-media']) { value[device]['background-media'] = ''; } } } updateValues(value); } }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dashicon, { icon: "image-rotate" }))); }; const onSelectImage = (media, key, backgroundType) => { let obj = { ...state.value }; let deviceObj = { ...obj[key] }; deviceObj['background-image'] = media.url; deviceObj['background-media'] = toString(media.id); deviceObj['background-type'] = backgroundType; obj[key] = deviceObj; updateValues(obj); }; const onChangeImageOptions = (mainKey, value, device, backgroundType) => { let obj = { ...state.value }; let deviceObj = { ...obj[device] }; deviceObj[mainKey] = value; deviceObj['background-type'] = backgroundType; obj[device] = deviceObj; updateValues(obj); }; (0,react__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => { let devices = ['desktop', 'mobile', 'tablet']; for (let device of devices) { updateBackgroundType(device); } }, []); const renderSettings = key => { return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_astra_color_picker_control__WEBPACK_IMPORTED_MODULE_2__["default"], { color: undefined !== state.value[key]['background-color'] && state.value[key]['background-color'] ? state.value[key]['background-color'] : '', onChangeComplete: (color, backgroundType) => handleChangeComplete(color, key, backgroundType), media: undefined !== state.value[key]['background-media'] && state.value[key]['background-media'] ? state.value[key]['background-media'] : '', backgroundImage: undefined !== state.value[key]['background-image'] && state.value[key]['background-image'] ? state.value[key]['background-image'] : '', backgroundAttachment: undefined !== state.value[key]['background-attachment'] && state.value[key]['background-attachment'] ? state.value[key]['background-attachment'] : '', backgroundPosition: undefined !== state.value[key]['background-position'] && state.value[key]['background-position'] ? state.value[key]['background-position'] : '', backgroundRepeat: undefined !== state.value[key]['background-repeat'] && state.value[key]['background-repeat'] ? state.value[key]['background-repeat'] : '', backgroundSize: undefined !== state.value[key]['background-size'] && state.value[key]['background-size'] ? state.value[key]['background-size'] : '', onSelectImage: (media, backgroundType) => onSelectImage(media, key, backgroundType), onChangeImageOptions: (mainKey, value, backgroundType) => onChangeImageOptions(mainKey, value, key, backgroundType), backgroundType: undefined !== state.value[key]['background-type'] && state.value[key]['background-type'] ? state.value[key]['background-type'] : 'color', overlayType: undefined !== state.value[key]['overlay-type'] && state.value[key]['overlay-type'] ? state.value[key]['overlay-type'] : 'none', overlayColor: undefined !== state.value[key]['overlay-color'] && state.value[key]['overlay-color'] ? state.value[key]['overlay-color'] : '', overlayGradient: undefined !== state.value[key]['overlay-gradient'] && state.value[key]['overlay-gradient'] ? state.value[key]['overlay-gradient'] : '', allowGradient: true, allowImage: true })); }; const handleChangeComplete = (color, key, backgroundType) => { let value = ''; if (color) { if (typeof color === 'string' || color instanceof String) { value = color; } else if (undefined !== color.rgb && undefined !== color.rgb.a && 1 !== color.rgb.a) { value = `rgba(${color.rgb.r},${color.rgb.g},${color.rgb.b},${color.rgb.a})`; } else { value = color.hex; } } let obj = { ...state.value }; let deviceObj = { ...obj[key] }; deviceObj['background-color'] = value; deviceObj['background-type'] = backgroundType; obj[key] = deviceObj; updateValues(obj); }; const { label, description } = props.control; let labelHtml = null; let descriptionHtml = null; let responsiveHtml = null; let inputHtml = null; const responsiveDesktop = (0,html_react_parser__WEBPACK_IMPORTED_MODULE_5__["default"])(_assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_6__["desktop-responsive"]); const responsiveTablet = (0,html_react_parser__WEBPACK_IMPORTED_MODULE_5__["default"])(_assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_6__["tablet-responsive"]); const responsiveMobile = (0,html_react_parser__WEBPACK_IMPORTED_MODULE_5__["default"])(_assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_6__["mobile-responsive"]); if (label && '' !== label && undefined !== label) { labelHtml = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, label); } else { labelHtml = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Background', 'astra')); } if (description) { descriptionHtml = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "description customize-control-description" }, description); } const skipResponsiveTriggers = undefined !== props.control.ignore_responsive_btns && props.control.ignore_responsive_btns ? true : false; const [activeDevice, setActiveDevice] = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)('desktop'); // Initialize with 'desktop' as active device const handleDeviceChange = device => { if ('desktop' === device) { setActiveDevice('tablet'); } else if ('tablet' === device) { setActiveDevice('mobile'); } else { setActiveDevice('desktop'); } }; responsiveHtml = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ul", { className: "ast-responsive-btns" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", { className: `desktop ${activeDevice === 'desktop' ? 'active' : ''}`, onClick: () => handleDeviceChange('desktop') }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { type: "button", className: "preview-desktop", "data-device": "desktop" }, responsiveDesktop)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", { className: `tablet ${activeDevice === 'tablet' ? 'active' : ''}`, onClick: () => handleDeviceChange('tablet') }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { type: "button", className: "preview-tablet", "data-device": "tablet" }, responsiveTablet)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", { className: `mobile ${activeDevice === 'mobile' ? 'active' : ''}`, onClick: () => handleDeviceChange('mobile') }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { type: "button", className: "preview-mobile", "data-device": "mobile" }, responsiveMobile))); inputHtml = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "background-wrapper" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: `background-container desktop ${activeDevice === 'desktop' ? 'active' : ''}` }, renderSettings('desktop')), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: `background-container tablet ${activeDevice === 'tablet' ? 'active' : ''}` }, renderSettings('tablet')), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: `background-container mobile ${activeDevice === 'mobile' ? 'active' : ''}` }, renderSettings('mobile'))); return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-bg-control-left" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, labelHtml, descriptionHtml), !skipResponsiveTriggers && responsiveHtml), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-bg-control-right" }, renderReset(), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "customize-control-content" }, inputHtml))); }; ResponsiveBackground.propTypes = { control: (prop_types__WEBPACK_IMPORTED_MODULE_7___default().object).isRequired }; /* harmony default export */ __webpack_exports__["default"] = (React.memo(ResponsiveBackground)); /***/ }), /***/ "./src/settings.js": /*!*************************!*\ !*** ./src/settings.js ***! \*************************/ /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* 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 react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var _wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/edit-post */ "@wordpress/edit-post"); /* harmony import */ var _wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__); /* harmony import */ var _wordpress_compose__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/compose */ "@wordpress/compose"); /* harmony import */ var _wordpress_compose__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_compose__WEBPACK_IMPORTED_MODULE_3__); /* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data"); /* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__); /* harmony import */ var _ast_checkbox_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./ast-checkbox.js */ "./src/ast-checkbox.js"); /* harmony import */ var _ast_radio_image_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./ast-radio-image.js */ "./src/ast-radio-image.js"); /* harmony import */ var _ast_selector_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ast-selector.js */ "./src/ast-selector.js"); /* harmony import */ var _assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../assets/svg/svgs.json */ "../../../assets/svg/svgs.json"); /* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components"); /* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__); /* harmony import */ var html_react_parser__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! html-react-parser */ "./node_modules/html-react-parser/index.mjs"); /* harmony import */ var _responsive_background_js__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./responsive-background.js */ "./src/responsive-background.js"); /** * Meta Options build. */ const { __ } = wp.i18n; const MetaSettings = props => { const modalIcon = (0,html_react_parser__WEBPACK_IMPORTED_MODULE_10__["default"])(_assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_8__["meta-popup-icon"]); const astraLogo = (0,html_react_parser__WEBPACK_IMPORTED_MODULE_10__["default"])(_assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_8__["astra-brand-icon"]); const brandIcon = (0,html_react_parser__WEBPACK_IMPORTED_MODULE_10__["default"])(_assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_8__["astra-brand-icon"]); const [isOpen, setOpen] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false); const openModal = () => setOpen(true); const closeModal = () => setOpen(false); const [showHelpText, setShowHelpText] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false); const is_hide_content_layout_sidebar = astMetaParams.is_hide_content_layout_sidebar; // Adjust spacing & borders for table. const topTableSpacing = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("tr", { className: "ast-extra-spacing" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-border" }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", null)); const bottomTableSpacing = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("tr", { className: "ast-extra-spacing ast-extra-spacing-bottom" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-border" }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", null)); const icon = (0,html_react_parser__WEBPACK_IMPORTED_MODULE_10__["default"])(_assets_svg_svgs_json__WEBPACK_IMPORTED_MODULE_8__["astra-meta-settings"]); const sidebarOptions = Object.entries(astMetaParams.sidebar_options).map(_ref => { let [key, name] = _ref; return { label: name, value: key }; }); const contentLayoutOptions = Object.entries(astMetaParams.content_layout).map(_ref2 => { let [key, name] = _ref2; return { label: name, value: key }; }); const contentStyleOptions = Object.entries(astMetaParams.content_style).map(_ref3 => { let [key, name] = _ref3; return { label: name, value: key }; }); const sidebarStyleOptions = Object.entries(astMetaParams.content_style).map(_ref4 => { let [key, name] = _ref4; return { label: name, value: key }; }); // Taransparent and Sticky Header Options. const headerOptions = Object.entries(astMetaParams.header_options).map(_ref5 => { let [key, name] = _ref5; return { label: name, value: key }; }); // Page header optins. const pageHeaderOptions = Object.entries(astMetaParams.page_header_options).map(_ref6 => { let [key, name] = _ref6; return { label: name, value: key }; }); // Page header optins. const pageBgToggleOptions = Object.entries(astMetaParams.page_bg_toggle_options).map(_ref7 => { let [key, name] = _ref7; return { label: name, value: key }; }); // Checkbox control const disableSections = Object.entries(astMetaParams.disable_sections).map(_ref8 => { let [key, value] = _ref8; let sectionValue = 'disabled' === props.meta[value['key']] ? true : false; return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_checkbox_js__WEBPACK_IMPORTED_MODULE_5__["default"], { label: value['label'], value: sectionValue, key: key, name: value['key'], onChange: val => { props.setMetaFieldValue(val, value['key']); } }); }); const headers_meta_options = Object.entries(astMetaParams.headers_meta_options).map(_ref9 => { let [key, value] = _ref9; let sectionValue = 'disabled' === props.meta[value['key']] ? true : false; return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_checkbox_js__WEBPACK_IMPORTED_MODULE_5__["default"], { label: value['label'], value: sectionValue, key: key, name: value['key'], onChange: val => { props.setMetaFieldValue(val, value['key']); } }); }); // Checkbox control const stickyHeadderOptions = Object.entries(astMetaParams.sticky_header_options).map(_ref10 => { let [key, value] = _ref10; let stickyValue = 'disabled' === props.meta[value['key']] ? true : false; return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_checkbox_js__WEBPACK_IMPORTED_MODULE_5__["default"], { label: value['label'], value: stickyValue, key: key, name: value['key'], onChange: val => { props.setMetaFieldValue(val, value['key']); } }); }); // Migrate meta layout, content style and sidebar options if old user. (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => { if (astMetaParams.v4_1_6_migration && undefined !== props.meta['astra-migrate-meta-layouts'] && 'set' !== props.meta['astra-migrate-meta-layouts']) { props.setMetaFieldValue('set', 'astra-migrate-meta-layouts'); switch (props.meta['site-content-layout']) { case 'plain-container': props.setMetaFieldValue('normal-width-container', 'ast-site-content-layout'); props.setMetaFieldValue('unboxed', 'site-content-style'); props.setMetaFieldValue('unboxed', 'site-sidebar-style'); break; case 'boxed-container': props.setMetaFieldValue('normal-width-container', 'ast-site-content-layout'); props.setMetaFieldValue('boxed', 'site-content-style'); props.setMetaFieldValue('boxed', 'site-sidebar-style'); break; case 'content-boxed-container': props.setMetaFieldValue('normal-width-container', 'ast-site-content-layout'); props.setMetaFieldValue('boxed', 'site-content-style'); props.setMetaFieldValue('unboxed', 'site-sidebar-style'); break; case 'page-builder': props.setMetaFieldValue('full-width-container', 'ast-site-content-layout'); props.setMetaFieldValue('unboxed', 'site-content-style'); props.setMetaFieldValue('unboxed', 'site-sidebar-style'); break; case 'narrow-container': props.setMetaFieldValue('narrow-width-container', 'ast-site-content-layout'); props.setMetaFieldValue('unboxed', 'site-content-style'); props.setMetaFieldValue('unboxed', 'site-sidebar-style'); break; default: props.setMetaFieldValue('default', 'ast-site-content-layout'); props.setMetaFieldValue('default', 'site-content-style'); props.setMetaFieldValue('default', 'site-sidebar-style'); break; } } }, [props.meta['astra-migrate-meta-layouts']]); return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__.PluginSidebarMoreMenuItem, { target: "theme-meta-panel", icon: icon }, astMetaParams.title), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__.PluginSidebar, { isPinnable: true, icon: icon, name: "theme-meta-panel", title: astMetaParams.title }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-sidebar-container components-panel__body is-opened", id: "astra_settings_meta_box" }, !is_hide_content_layout_sidebar && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, { title: __('Container', 'astra'), initialOpen: true }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", { id: "ast-label-container-layout", className: "ast-sub-section-title" }, __('Container Layout', 'astra')), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-sidebar-layout-meta-wrap components-base-control__field" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_radio_image_js__WEBPACK_IMPORTED_MODULE_6__["default"], { metavalue: undefined !== props.meta['ast-site-content-layout'] && '' !== props.meta['ast-site-content-layout'] ? props.meta['ast-site-content-layout'] : 'default', choices: contentLayoutOptions, id: 'ast-site-content-layout', onChange: val => { if (val === 'narrow-container') props.setMetaFieldValue('no-sidebar', 'site-sidebar-layout'); props.setMetaFieldValue(val, 'ast-site-content-layout'); } })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", { id: "ast-label-container-style", className: "ast-sub-section-title" }, __('Container Style', 'astra')), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-sidebar-layout-meta-wrap components-base-control__field" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_selector_js__WEBPACK_IMPORTED_MODULE_7__["default"], { metavalue: undefined !== props.meta['site-content-style'] && '' !== props.meta['site-content-style'] ? props.meta['site-content-style'] : 'default', choices: contentStyleOptions, id: 'site-content-style', onChange: val => { props.setMetaFieldValue(val, 'site-content-style'); } })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", { className: "description" }, __('Container style will apply only when layout is set to either normal or narrow.', 'astra'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, { title: __('Sidebar', 'astra'), initialOpen: false }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", { id: "ast-label-sidebar-layout", className: "ast-sub-section-title" }, __('Sidebar Layout', 'astra')), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-sidebar-layout-meta-wrap components-base-control__field" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_radio_image_js__WEBPACK_IMPORTED_MODULE_6__["default"], { metavalue: undefined !== props.meta['site-sidebar-layout'] && '' !== props.meta['site-sidebar-layout'] ? props.meta['site-sidebar-layout'] : 'default', choices: sidebarOptions, id: 'site-sidebar-layout', onChange: val => { props.setMetaFieldValue(val, 'site-sidebar-layout'); } })), !astMetaParams.v4_1_6_migration && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", { className: "description" }, __('Sidebar will only apply when container layout is set to normal.', 'astra')), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", { id: "ast-label-sidebar-style", className: "ast-sub-section-title" }, __('Sidebar Style', 'astra')), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-sidebar-layout-meta-wrap components-base-control__field" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_selector_js__WEBPACK_IMPORTED_MODULE_7__["default"], { metavalue: undefined !== props.meta['site-sidebar-style'] && '' !== props.meta['site-sidebar-style'] ? props.meta['site-sidebar-style'] : 'default', choices: sidebarStyleOptions, id: 'site-sidebar-style', onChange: val => { props.setMetaFieldValue(val, 'site-sidebar-style'); } }))), !is_hide_content_layout_sidebar && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, { title: __('Disable Elements', 'astra'), initialOpen: false }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-sidebar-layout-meta-wrap components-base-control__field" }, disableSections)), is_hide_content_layout_sidebar && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, { title: __('Disable Elements', 'astra'), initialOpen: true }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-sidebar-layout-meta-wrap components-base-control__field" }, disableSections)), !is_hide_content_layout_sidebar && undefined !== props.meta['ast-global-header-display'] && 'disabled' !== props.meta['ast-global-header-display'] && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-custom-layout-panel components-panel__body" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("h2", { className: "components-panel__body-title" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { className: "components-button components-panel__body-toggle", onClick: openModal }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "ast-title-container" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-title" }, " ", __('Advanced Settings', 'astra'))), modalIcon))), isOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.Modal, { title: __('Advanced Settings', 'astra'), className: "ast-header-settings-modal", shouldCloseOnClickOutside: false, onRequestClose: closeModal, icon: brandIcon }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-meta-settings-content" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("table", { className: "ast-meta-settings-hook-table widefat" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("tbody", null, topTableSpacing, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("tr", { className: "ast-advanced-hook-row" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-heading" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, " ", __('Header Rows', 'astra'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-content" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", { className: "components-base-control__field" }, headers_meta_options))), bottomTableSpacing, topTableSpacing, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("tr", { className: "ast-advanced-hook-row" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-heading" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, " ", astMetaParams.transparent_header_title)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-content" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "components-base-control__field" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_selector_js__WEBPACK_IMPORTED_MODULE_7__["default"], { metavalue: undefined !== props.meta['theme-transparent-header-meta'] && '' !== props.meta['theme-transparent-header-meta'] ? props.meta['theme-transparent-header-meta'] : 'default', choices: headerOptions, id: 'theme-transparent-header-meta', onChange: val => { props.setMetaFieldValue(val, 'theme-transparent-header-meta'); } }))))), 'disabled' !== props.meta['ast-main-header-display'] && astMetaParams.is_addon_activated && astMetaParams.sticky_addon_enabled && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, bottomTableSpacing, topTableSpacing, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("tr", { className: "ast-advanced-hook-row" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-heading" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, " ", astMetaParams.sticky_header_title)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-content" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_selector_js__WEBPACK_IMPORTED_MODULE_7__["default"], { metavalue: undefined !== props.meta['stick-header-meta'] && '' !== props.meta['stick-header-meta'] ? props.meta['stick-header-meta'] : 'default', choices: headerOptions, id: 'stick-header-meta', onChange: val => { props.setMetaFieldValue(val, 'stick-header-meta'); } }))))), astMetaParams.is_addon_activated && astMetaParams.sticky_addon_enabled && 'enabled' == props.meta['stick-header-meta'] && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, topTableSpacing, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("tr", { className: "ast-advanced-hook-row" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-heading" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, " ", astMetaParams.sticky_header_title)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-content" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-sticky-header-options components-base-control__field" }, stickyHeadderOptions))))), astMetaParams.is_addon_activated && astMetaParams.color_addon_enabled && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, bottomTableSpacing, topTableSpacing, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("tr", { className: "ast-advanced-hook-row" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-heading ast-show-help-text-container" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, " ", astMetaParams.ast_page_bg_title), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("i", { className: "ast-control-tooltip dashicons dashicons-editor-help" }), undefined !== props.meta['ast-page-background-enabled'] && 'enabled' === props.meta['ast-page-background-enabled'] ? (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "ast-dashicons-custom-tooltip" }, " ", astMetaParams.surface_color_help_text) : (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "ast-dashicons-custom-tooltip", style: { bottom: '15px', top: 'unset' } }, " ", astMetaParams.surface_color_help_text))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("td", { className: "ast-advanced-hook-row-content" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "components-base-control__field" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_ast_selector_js__WEBPACK_IMPORTED_MODULE_7__["default"], { metavalue: undefined !== props.meta['ast-page-background-enabled'] && '' !== props.meta['ast-page-background-enabled'] ? props.meta['ast-page-background-enabled'] : 'default', choices: pageBgToggleOptions, id: 'ast-page-background-enabled', onChange: val => { props.setMetaFieldValue(val, 'ast-page-background-enabled'); } })), undefined !== props.meta['ast-page-background-enabled'] && 'enabled' === props.meta['ast-page-background-enabled'] && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { id: "customize-control-astra-settings-site-layout-outside-bg-obj-responsive", className: "customize-control customize-control-ast-responsive-background" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_responsive_background_js__WEBPACK_IMPORTED_MODULE_11__["default"], { metavalue: undefined !== props.meta['ast-page-background-meta'] && '' !== props.meta['ast-page-background-meta'] ? props.meta['ast-page-background-meta'] : 'default', control: { 'controlName': 'ast-page-background-meta', 'default': astMetaParams.site_page_bg_meta_default, 'ignore_responsive_btns': false, 'setMetaFieldValue': props.setMetaFieldValue, 'label': astMetaParams.page_bg_dynamic_title, 'description': '' }, id: 'ast-page-background-meta' })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { id: "customize-control-astra-settings-content-bg-obj-responsive", className: "customize-control customize-control-ast-responsive-background" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_responsive_background_js__WEBPACK_IMPORTED_MODULE_11__["default"], { metavalue: undefined !== props.meta['ast-content-background-meta'] && '' !== props.meta['ast-content-background-meta'] ? props.meta['ast-content-background-meta'] : 'default', control: { 'controlName': 'ast-content-background-meta', 'default': astMetaParams.content_page_bg_meta_default, 'ignore_responsive_btns': false, 'setMetaFieldValue': props.setMetaFieldValue, 'label': 'Content Background', 'description': '' }, id: 'ast-content-background-meta' })))))), topTableSpacing)))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-cl-footer-container" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-button-container" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", { className: "ast-cl-popup-notice" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("i", { className: "dashicons dashicons-warning" }), __('Make sure to update your post for changes to take effect.', 'astra'), " "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("button", { className: "button button-default", onClick: closeModal }, " ", __('Return To Post', 'astra'))))), astMetaParams.is_bb_themer_layout && astMetaParams.is_addon_activated && astMetaParams.page_header_availability && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, { title: astMetaParams.page_header_title, initialOpen: false }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-sidebar-layout-meta-wrap components-base-control__field" }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, { value: undefined !== props.meta['adv-header-id-meta'] && '' !== props.meta['adv-header-id-meta'] ? props.meta['adv-header-id-meta'] : '', options: pageHeaderOptions.reverse(), onChange: val => { props.setMetaFieldValue(val, 'adv-header-id-meta'); } })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("br", null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", { className: "description" }, __('If you would like to apply custom header for this page, select the one from the list above. Page headers can be created and customized from ', 'astra'), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", { href: astMetaParams.page_header_edit_link, target: "__blank" }, __('here.', 'astra')))), !astMetaParams.is_addon_activated && astMetaParams.show_upgrade_notice && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { className: "ast-pro-upgrade-cta-wrapper" }, astraLogo, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", { className: "ast-upgrade-description" }, " ", __('Unlock your full design potential and build a website to be proud of with Astra Pro.', 'astra'), " "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", { href: astMetaParams.upgrade_pro_link, className: "ast-pro-upgrade-link", target: "_blank" }, " ", __('Upgrade Now', 'astra'), " "))))); }; /* harmony default export */ __webpack_exports__["default"] = ((0,_wordpress_compose__WEBPACK_IMPORTED_MODULE_3__.compose)((0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.withSelect)(select => { const postMeta = select('core/editor').getEditedPostAttribute('meta'); const oldPostMeta = select('core/editor').getCurrentPostAttribute('meta'); return { meta: { ...oldPostMeta, ...postMeta }, oldMeta: oldPostMeta }; }), (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.withDispatch)(dispatch => ({ setMetaFieldValue: (value, field) => dispatch('core/editor').editPost({ meta: { [field]: value } }) })))(MetaSettings)); /***/ }), /***/ "./node_modules/domelementtype/lib/index.js": /*!**************************************************!*\ !*** ./node_modules/domelementtype/lib/index.js ***! \**************************************************/ /***/ (function(__unused_webpack_module, exports) { "use strict"; Object.defineProperty(exports, "__esModule", ({ value: true })); exports.Doctype = exports.CDATA = exports.Tag = exports.Style = exports.Script = exports.Comment = exports.Directive = exports.Text = exports.Root = exports.isTag = exports.ElementType = void 0; /** Types of elements found in htmlparser2's DOM */ var ElementType; (function (ElementType) { /** Type for the root element of a document */ ElementType["Root"] = "root"; /** Type for Text */ ElementType["Text"] = "text"; /** Type for */ ElementType["Directive"] = "directive"; /** Type for */ ElementType["Comment"] = "comment"; /** Type for