1#@!#!123s

: / home / aramrprl / www / wp-content / plugins / wpforms-lite / src / Integrations / Elementor /
Filename : WidgetModern.php
back
<?php

// phpcs:disable Generic.Commenting.DocComment.MissingShort
/** @noinspection PhpUndefinedNamespaceInspection */
/** @noinspection PhpUndefinedClassInspection */
/** @noinspection PhpUndefinedMethodInspection */
// phpcs:enable Generic.Commenting.DocComment.MissingShort

namespace WPForms\Integrations\Elementor;

use Elementor\Plugin;
use Elementor\Controls_Manager;
use Exception;
use WPForms\Frontend\CSSVars;

/**
 * WPForms modern widget for Elementor page builder.
 *
 * @since 1.8.3
 */
class WidgetModern extends Widget {

	/**
	 * Size options for widget settings.
	 *
	 * @since 1.8.3
	 *
	 * @var array
	 */
	protected $size_options;

	/**
	 * Border type options for widget settings.
	 *
	 * @since 1.9.6
	 *
	 * @var array
	 */
	private $border_options;

	/**
	 * Instance of CSSVars class.
	 *
	 * @since 1.8.3
	 *
	 * @var CSSVars
	 */
	protected $css_vars_obj;

	/**
	 * Widget constructor.
	 *
	 * @since 1.8.3
	 *
	 * @param array $data Widget data.
	 * @param array $args Widget arguments.
	 *
	 * @throws Exception If arguments are missing when initializing a full widget.
	 * @noinspection PhpMissingParamTypeInspection
	 */
	public function __construct( $data = [], $args = null ) {

		parent::__construct( $data, $args );

		$this->load();
	}

	/**
	 * Load widget.
	 *
	 * @since 1.8.3
	 */
	private function load(): void {

		$this->size_options = [
			'small'  => esc_html__( 'Small', 'wpforms-lite' ),
			'medium' => esc_html__( 'Medium', 'wpforms-lite' ),
			'large'  => esc_html__( 'Large', 'wpforms-lite' ),
		];

		$this->border_options = [
			'none'   => esc_html__( 'None', 'wpforms-lite' ),
			'solid'  => esc_html__( 'Solid', 'wpforms-lite' ),
			'dashed' => esc_html__( 'Dashed', 'wpforms-lite' ),
			'dotted' => esc_html__( 'Dotted', 'wpforms-lite' ),
		];

		$this->css_vars_obj = wpforms()->obj( 'css_vars' );
	}

	/**
	 * Register widget controls.
	 *
	 * Adds different input fields to allow the user to change and customize the widget settings.
	 *
	 * @since 1.8.3
	 */
	protected function register_controls() {

		$this->content_controls();
		$this->style_controls();
	}

	/**
	 * Register widget controls for the Style section.
	 *
	 * Adds different input fields into the "Style" section to allow the user to change and customize the widget style
	 * settings.
	 *
	 * @since 1.8.3
	 */
	private function style_controls(): void {

		$this->add_theme_style_controls();

		if ( $this->is_admin() ) {
			$this->add_field_style_controls();
			$this->add_label_style_controls();
			$this->add_button_style_controls();
			$this->add_container_style_controls();
			$this->add_background_style_controls();
			$this->add_other_style_controls();
		}

		$this->add_advanced_style_controls();
	}

	/**
	 * Register widget controls for the Theme Style section.
	 *
	 * @since 1.9.6
	 */
	private function add_theme_style_controls(): void {

		$this->start_controls_section(
			'themes',
			[
				'label' => esc_html__( 'Themes', 'wpforms-lite' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'lead_forms_notice',
			[
				'show_label'      => false,
				'type'            => Controls_Manager::RAW_HTML,
				'raw'             => sprintf(
					'<strong>%s</strong>%s',
					esc_html__( 'Form Styles are disabled because Lead Form Mode is turned on.', 'wpforms-lite' ),
					esc_html__( 'To change the styling for this form, open it in the form builder and edit the options in the Lead Forms settings.', 'wpforms-lite' )
				),
				'classes'         => 'wpforms-elementor-lead-forms-notice',
				'content_classes' => 'elementor-panel-alert elementor-panel-alert-warning',
			]
		);

		$this->add_control(
			'wpformsTheme',
			[
				'type'    => 'wpforms_themes',
				'default' => 'default',
			]
		);

		if ( $this->is_admin() ) {
			$this->add_control(
				'isCustomTheme',
				[
					'type' => Controls_Manager::HIDDEN,
				]
			);

			$this->add_control(
				'isMigrated',
				[
					'type'    => Controls_Manager::HIDDEN,
					'default' => 'false',
				]
			);

			$this->add_control(
				'customThemeName',
				[
					'type'      => Controls_Manager::TEXT,
					'label'     => esc_html__( 'Theme Name', 'wpforms-lite' ),
					'ai'        => [
						'active' => false,
					],
					'condition' => [
						'isCustomTheme!' => '',
					],
				]
			);

			$this->add_control(
				'deleteThemeButton',
				[
					'type'        => Controls_Manager::BUTTON,
					'event'       => 'WPFormsDeleteThemeButtonClick',
					'button_type' => 'danger',
					'text'        => esc_html__( 'DELETE THEME', 'wpforms-lite' ),
					'condition'   => [
						'isCustomTheme!' => '',
					],
				]
			);
		}

		$this->end_controls_section();
	}

	/**
	 * Register widget controls for the Field Style section.
	 *
	 * Adds controls to the "Field Styles" section of the Widget Style settings.
	 *
	 * @since 1.8.3
	 */
	protected function add_field_style_controls(): void {

		$this->start_controls_section(
			'field_styles',
			[
				'label' => esc_html__( 'Field Styles', 'wpforms-lite' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'fieldSize',
			[
				'label'   => esc_html__( 'Size', 'wpforms-lite' ),
				'type'    => Controls_Manager::SELECT,
				'options' => $this->size_options,
				'default' => 'medium',
			]
		);

		$this->add_control(
			'fieldBorderStyle',
			[
				'label'   => esc_html__( 'Border', 'wpforms-lite' ),
				'type'    => Controls_Manager::SELECT,
				'options' => $this->border_options,
				'default' => 'solid',
			]
		);

		$this->add_control(
			'fieldBorderSize',
			[
				'label'     => esc_html__( 'Border Size (px)', 'wpforms-lite' ),
				'type'      => Controls_Manager::NUMBER,
				'default'   => '1',
				'min'       => '0',
				'condition' => [
					'fieldBorderStyle!' => 'none',
				],
			]
		);

		$this->add_control(
			'fieldBorderRadius',
			[
				'label'   => esc_html__( 'Border Radius (px)', 'wpforms-lite' ),
				'type'    => Controls_Manager::NUMBER,
				'min'     => '0',
				'default' => '3',
			]
		);

		$this->add_control(
			'fieldBackgroundColor',
			[
				'label'   => esc_html__( 'Background', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'default' => CSSVars::ROOT_VARS['field-background-color'],
			]
		);

		$this->add_control(
			'fieldBorderColor',
			[
				'label'   => esc_html__( 'Border', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'alpha'   => true,
				'default' => CSSVars::ROOT_VARS['field-border-color'],
			]
		);

		$this->add_control(
			'fieldTextColor',
			[
				'label'   => esc_html__( 'Text', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'alpha'   => true,
				'default' => CSSVars::ROOT_VARS['field-text-color'],
			]
		);

		$this->add_control(
			'fieldMenuColor',
			[
				'type'    => Controls_Manager::HIDDEN,
				'default' => CSSVars::ROOT_VARS['field-menu-color'],
			]
		);

		$this->end_controls_section();
	}

	/**
	 * Register widget controls for the Label Style section.
	 *
	 * Adds controls to the "Label Styles" section of the Widget Style settings.
	 *
	 * @since 1.8.3
	 */
	private function add_label_style_controls(): void {

		$this->start_controls_section(
			'label_styles',
			[
				'label' => esc_html__( 'Label Styles', 'wpforms-lite' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'labelSize',
			[
				'label'   => esc_html__( 'Size', 'wpforms-lite' ),
				'type'    => Controls_Manager::SELECT,
				'options' => $this->size_options,
				'default' => 'medium',
			]
		);

		$this->add_control(
			'labelColor',
			[
				'label'   => esc_html__( 'Label', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'alpha'   => true,
				'default' => CSSVars::ROOT_VARS['label-color'],
			]
		);

		$this->add_control(
			'labelSublabelColor',
			[
				'label'   => esc_html__( 'Sublabel & Hint', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'alpha'   => true,
				'default' => CSSVars::ROOT_VARS['label-sublabel-color'],
			]
		);

		$this->add_control(
			'labelErrorColor',
			[
				'label'   => esc_html__( 'Error', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'default' => CSSVars::ROOT_VARS['label-error-color'],
			]
		);

		$this->end_controls_section();
	}

	/**
	 * Register widget controls for the "Button Style" section.
	 *
	 * Adds controls to the "Button Styles" section of the Widget Style settings.
	 *
	 * @since 1.8.3
	 */
	private function add_button_style_controls(): void {

		$this->start_controls_section(
			'button_styles',
			[
				'label' => esc_html__( 'Button Styles', 'wpforms-lite' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'buttonSize',
			[
				'label'   => esc_html__( 'Size', 'wpforms-lite' ),
				'type'    => Controls_Manager::SELECT,
				'options' => $this->size_options,
				'default' => 'medium',
			]
		);

		$this->add_control(
			'buttonBorderStyle',
			[
				'label'   => esc_html__( 'Border', 'wpforms-lite' ),
				'type'    => Controls_Manager::SELECT,
				'options' => $this->border_options,
				'default' => CSSVars::ROOT_VARS['button-border-style'],
			]
		);

		$this->add_control(
			'buttonBorderSize',
			[
				'label'     => esc_html__( 'Border Size (px)', 'wpforms-lite' ),
				'type'      => Controls_Manager::NUMBER,
				'default'   => CSSVars::ROOT_VARS['button-border-size'],
				'min'       => '0',
				'condition' => [
					'buttonBorderStyle!' => 'none',
				],
			]
		);

		$this->add_control(
			'buttonBorderRadius',
			[
				'label'   => esc_html__( 'Border Radius (px)', 'wpforms-lite' ),
				'type'    => Controls_Manager::NUMBER,
				'min'     => '0',
				'default' => '3',
			]
		);

		$this->add_control(
			'buttonBackgroundColor',
			[
				'label'   => esc_html__( 'Background', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'default' => CSSVars::ROOT_VARS['button-background-color'],
			]
		);

		$this->add_control(
			'buttonBorderColor',
			[
				'label'     => esc_html__( 'Border', 'wpforms-lite' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => CSSVars::ROOT_VARS['button-border-color'],
				'condition' => [
					'buttonBorderStyle!' => 'none',
				],
			]
		);

		$this->add_control(
			'buttonTextColor',
			[
				'label'   => esc_html__( 'Text', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'default' => CSSVars::ROOT_VARS['button-text-color'],
			]
		);

		$this->end_controls_section();
	}

	/**
	 * Register widget controls for the "Container Style" section.
	 *
	 * @since 1.9.6
	 */
	private function add_container_style_controls(): void {

		$this->start_controls_section(
			'container_styles',
			[
				'label' => esc_html__( 'Container Styles', 'wpforms-lite' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'containerPadding',
			[
				'label'   => esc_html__( 'Padding (px)', 'wpforms-lite' ),
				'type'    => Controls_Manager::NUMBER,
				'default' => CSSVars::ROOT_VARS['container-padding'],
				'min'     => '0',
			]
		);

		$this->add_control(
			'containerBorderStyle',
			[
				'label'   => esc_html__( 'Border', 'wpforms-lite' ),
				'type'    => Controls_Manager::SELECT,
				'options' => $this->border_options,
				'default' => CSSVars::ROOT_VARS['container-border-style'],
			]
		);

		$this->add_control(
			'containerBorderWidth',
			[
				'label'     => esc_html__( 'Border Size (px)', 'wpforms-lite' ),
				'type'      => Controls_Manager::NUMBER,
				'default'   => CSSVars::ROOT_VARS['container-border-width'],
				'min'       => '0',
				'condition' => [
					'containerBorderStyle!' => 'none',
				],
			]
		);

		$this->add_control(
			'containerBorderRadius',
			[
				'label'   => esc_html__( 'Border Radius (px)', 'wpforms-lite' ),
				'type'    => Controls_Manager::NUMBER,
				'min'     => '0',
				'default' => '3',
			]
		);

		$this->add_control(
			'containerShadowSize',
			[
				'label'   => esc_html__( 'Shadow', 'wpforms-lite' ),
				'type'    => Controls_Manager::SELECT,
				'options' => [
					'none'   => esc_html__( 'None', 'wpforms-lite' ),
					'small'  => esc_html__( 'Small', 'wpforms-lite' ),
					'medium' => esc_html__( 'Medium', 'wpforms-lite' ),
					'large'  => esc_html__( 'Large', 'wpforms-lite' ),
				],
				'default' => CSSVars::CONTAINER_SHADOW_SIZE['none']['box-shadow'],
			]
		);

		$this->add_control(
			'containerBorderColor',
			[
				'label'     => esc_html__( 'Border', 'wpforms-lite' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => CSSVars::ROOT_VARS['container-border-color'],
				'condition' => [
					'containerBorderStyle!' => 'none',
				],
			]
		);

		$this->end_controls_section();
	}

	/**
	 * Register widget controls for the "Background Style" section.
	 *
	 * @since 1.9.6
	 */
	private function add_background_style_controls(): void {

		$this->start_controls_section(
			'background_styles',
			[
				'label' => esc_html__( 'Background Styles', 'wpforms-lite' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'backgroundImage',
			[
				'label'   => esc_html__( 'Image', 'wpforms-lite' ),
				'type'    => Controls_Manager::SELECT,
				'options' => [
					'none'    => esc_html__( 'None', 'wpforms-lite' ),
					'library' => esc_html__( 'Media Library', 'wpforms-lite' ),
					'stock'   => esc_html__( 'Stock Photo', 'wpforms-lite' ),
				],
				'default' => 'none',
			]
		);

		$this->add_control(
			'backgroundPosition',
			[
				'label'     => esc_html__( 'Position', 'wpforms-lite' ),
				'type'      => Controls_Manager::SELECT,
				'options'   => [
					'top left'      => esc_html__( 'Top Left', 'wpforms-lite' ),
					'top center'    => esc_html__( 'Top Center', 'wpforms-lite' ),
					'top right'     => esc_html__( 'Top Right', 'wpforms-lite' ),
					'center left'   => esc_html__( 'Center Left', 'wpforms-lite' ),
					'center center' => esc_html__( 'Center Center', 'wpforms-lite' ),
					'center right'  => esc_html__( 'Center Right', 'wpforms-lite' ),
					'bottom left'   => esc_html__( 'Bottom Left', 'wpforms-lite' ),
					'bottom center' => esc_html__( 'Bottom Center', 'wpforms-lite' ),
					'bottom right'  => esc_html__( 'Bottom Right', 'wpforms-lite' ),
				],
				'default'   => CSSVars::ROOT_VARS['background-position'],
				'condition' => [
					'backgroundImage!' => 'none',
				],
			]
		);

		$this->add_control(
			'backgroundRepeat',
			[
				'label'     => esc_html__( 'Repeat', 'wpforms-lite' ),
				'type'      => Controls_Manager::SELECT,
				'options'   => [
					'no-repeat' => esc_html__( 'No Repeat', 'wpforms-lite' ),
					'repeat'    => esc_html__( 'Tile', 'wpforms-lite' ),
					'repeat-x'  => esc_html__( 'Repeat X', 'wpforms-lite' ),
					'repeat-y'  => esc_html__( 'Repeat Y', 'wpforms-lite' ),
				],
				'default'   => CSSVars::ROOT_VARS['background-repeat'],
				'condition' => [
					'backgroundImage!' => 'none',
				],
			]
		);

		$this->add_control(
			'backgroundSize',
			[
				'label'     => esc_html__( 'Size', 'wpforms-lite' ),
				'type'      => Controls_Manager::SELECT,
				'options'   => [
					'dimensions' => esc_html__( 'Dimensions', 'wpforms-lite' ),
					'cover'      => esc_html__( 'Cover', 'wpforms-lite' ),
				],
				'default'   => CSSVars::ROOT_VARS['background-size'],
				'condition' => [
					'backgroundImage!' => 'none',
				],
			]
		);

		$this->add_control(
			'backgroundSizeMode',
			[
				'type'    => Controls_Manager::HIDDEN,
				'default' => CSSVars::ROOT_VARS['background-size'],
			]
		);

		$this->add_control(
			'backgroundWidth',
			[
				'label'     => esc_html__( 'Width (px)', 'wpforms-lite' ),
				'type'      => Controls_Manager::NUMBER,
				'default'   => '100',
				'min'       => '0',
				'condition' => [
					'backgroundImage!' => 'none',
					'backgroundSize'   => 'dimensions',
				],
			]
		);

		$this->add_control(
			'backgroundHeight',
			[
				'label'     => esc_html__( 'Height (px)', 'wpforms-lite' ),
				'type'      => Controls_Manager::NUMBER,
				'default'   => '100',
				'min'       => '0',
				'condition' => [
					'backgroundImage!' => 'none',
					'backgroundSize'   => 'dimensions',
				],
			]
		);

		$this->add_control(
			'backgroundUrl',
			[
				'label'     => esc_html__( 'Choose Image', 'wpforms-lite' ),
				'type'      => Controls_Manager::MEDIA,
				'default'   => [
					'url' => CSSVars::ROOT_VARS['background-url'],
				],
				'ai'        => [
					'active' => false,
				],
				'separator' => 'after',
				'condition' => [
					'backgroundImage!' => 'none',
				],
			]
		);

		$this->add_control(
			'backgroundColor',
			[
				'label'   => esc_html__( 'Background', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'default' => CSSVars::ROOT_VARS['background-color'],
			]
		);

		$this->end_controls_section();
	}

	/**
	 * Register widget controls for the "Other Styles" section.
	 *
	 * @since 1.9.6
	 */
	private function add_other_style_controls(): void {

		$this->start_controls_section(
			'other_styles',
			[
				'label' => esc_html__( 'Other Styles', 'wpforms-lite' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'pageBreakColor',
			[
				'label'   => esc_html__( 'Page Break', 'wpforms-lite' ),
				'type'    => Controls_Manager::COLOR,
				'default' => CSSVars::ROOT_VARS['page-break-color'],
			]
		);

		$this->end_controls_section();
	}

	/**
	 * Register widget controls for the "Advanced" section.
	 *
	 * Adds controls to the "Button Styles" section of the Widget Style settings.
	 *
	 * @since 1.8.3
	 */
	private function add_advanced_style_controls(): void {

		$this->start_controls_section(
			'advanced',
			[
				'label' => esc_html__( 'Advanced', 'wpforms-lite' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'className',
			[
				'label'        => esc_html__( 'Additional Classes', 'wpforms-lite' ),
				'type'         => Controls_Manager::TEXT,
				'description'  => esc_html__( 'Separate multiple classes with spaces.', 'wpforms-lite' ),
				'ai'           => [
					'active' => false,
				],
				'prefix_class' => '', // Prevents re-rendering of the widget.
			]
		);
		if ( $this->is_admin() ) {
			$this->add_control(
				'ACDivider',
				[
					'type' => Controls_Manager::DIVIDER,
				]
			);

			$this->add_control(
				'copyPasteJsonValue',
				[
					'label'       => esc_html__( 'Copy / Paste Style Settings', 'wpforms-lite' ),
					'type'        => Controls_Manager::TEXTAREA,
					'description' => esc_html__( 'If you\'ve copied style settings from another form, you can paste them here to add the same styling to this form. Any current style settings will be overwritten.', 'wpforms-lite' ),
					'ai'          => [
						'active' => false,
					],
				]
			);

			$this->add_control(
				'CPDivider',
				[
					'type' => Controls_Manager::DIVIDER,
				]
			);
		}

		$this->end_controls_section();
	}

	/**
	 * Render widget output on the frontend.
	 *
	 * @since 1.8.3
	 */
	protected function render_frontend() {

		if ( empty( $this->css_vars_obj ) ) {
			return;
		}

		$widget_id      = $this->get_id();
		$attr           = $this->get_settings_for_display();
		$css_vars       = $this->css_vars_obj->get_customized_css_vars( $attr );
		$custom_classes = ! empty( $attr['className'] ) ? trim( $attr['className'] ) : '';

		if ( ! empty( $css_vars ) ) {

			$style_id = 'wpforms-css-vars-elementor-widget-' . $widget_id;

			/**
			 * Filter the CSS selector for output CSS variables for styling the form in Elementor widget.
			 *
			 * @since 1.8.3
			 *
			 * @param string $selector The CSS selector for output CSS variables for styling the Elementor Widget.
			 * @param array  $attr     Attributes passed by Elementor Widget.
			 * @param array  $css_vars CSS variables data.
			 */
			$vars_selector = apply_filters(
				'wpforms_integrations_elementor_widget_modern_output_css_vars_selector',
				".elementor-widget-wpforms.elementor-element-{$widget_id}",
				$attr,
				$css_vars
			);

			$this->css_vars_obj->output_selector_vars( $vars_selector, $css_vars, $style_id );
		}

		// Add custom classes.
		if ( $custom_classes ) {
			$this->add_render_attribute(
				'_wrapper',
				[
					'class' => [
						$custom_classes,
					],
				]
			);
		}

		// Render selected form.
		$this->render_form();
	}

	/**
	 * Get settings for display.
	 *
	 * @since 1.8.3
	 *
	 * @param string|null $setting_key Optional. The key of the requested setting. Default is null.
	 *
	 * @return mixed The settings.
	 */
	public function get_settings_for_display( $setting_key = null ) {

		$settings = parent::get_settings_for_display( $setting_key );

		if ( ! empty( $setting_key ) ) {
			return $settings;
		}

		$settings = $this->remove_empty_settings( $settings );
		$settings = $this->apply_dimension_settings( $settings );
		$settings = $this->apply_complex_settings( $settings );

		if ( isset( $settings['__globals__'] ) ) {
			$settings = $this->check_global_styles( $settings );
		}

		return $settings;
	}

	/**
	 * Remove empty settings.
	 *
	 * @since 1.9.6
	 *
	 * @param mixed $settings Widget settings.
	 *
	 * @return mixed Updated settings.
	 */
	private function remove_empty_settings( $settings ) {

		if ( ! is_array( $settings ) ) {
			return $settings;
		}

		return array_filter(
			$settings,
			static function ( $value ) {

				return ! empty( $value );
			}
		);
	}

	/**
	 * Apply complex settings values.
	 *
	 * @since 1.9.6
	 *
	 * @param mixed $settings Widget settings.
	 *
	 * @return mixed Updated settings.
	 */
	private function apply_complex_settings( $settings ) {

		if ( isset( $settings['backgroundUrl'] ) && is_array( $settings['backgroundUrl'] ) ) {
			$image_url                 = $settings['backgroundUrl']['url'] ?? '';
			$settings['backgroundUrl'] = 'url( ' . $image_url . ' )';
		}

		if ( isset( $settings['backgroundSize'] ) && $settings['backgroundSize'] === 'dimensions' ) {
			$bg_width  = $settings['backgroundWidth'] ?? CSSVars::ROOT_VARS['background-width'];
			$bg_height = $settings['backgroundHeight'] ?? CSSVars::ROOT_VARS['background-height'];

			$settings['backgroundSize'] = "{$bg_width} {$bg_height}";
		}

		return $settings;
	}

	/**
	 * Apply dimension settings with pixel units.
	 *
	 * @since 1.9.6
	 *
	 * @param mixed $settings Widget settings.
	 *
	 * @return mixed Updated settings with dimension values.
	 */
	private function apply_dimension_settings( $settings ) {

		$dimension_properties = [
			'fieldBorderRadius'     => 'field-border-radius',
			'fieldBorderSize'       => 'field-border-size',
			'buttonBorderRadius'    => 'button-border-radius',
			'buttonBorderSize'      => 'button-border-size',
			'containerPadding'      => 'container-padding',
			'containerBorderWidth'  => 'container-border-width',
			'containerBorderRadius' => 'container-border-radius',
			'backgroundWidth'       => 'background-width',
			'backgroundHeight'      => 'background-height',
		];

		foreach ( $dimension_properties as $property => $root_var ) {
			if ( ! isset( $settings[ $property ] ) ) {
				$settings[ $property ] = CSSVars::ROOT_VARS[ $root_var ];

				continue;
			}

			$value = (string) $settings[ $property ];

			if ( $value !== '' && substr( $value, -2 ) !== 'px' ) {
				$settings[ $property ] = $value . 'px';
			}
		}

		return $settings;
	}

	/**
	 * Check if global styles are used in colors controls and update its values with the real ones.
	 *
	 * @since 1.8.3
	 *
	 * @param mixed $settings Widget settings.
	 *
	 * @return mixed Updated settings.
	 */
	private function check_global_styles( $settings ) {

		$global_settings = $settings['__globals__'] ?? [];
		$kit             = Plugin::$instance->kits_manager->get_active_kit_for_frontend();
		$system_colors   = $kit->get_settings_for_display( 'system_colors' );
		$custom_colors   = $kit->get_settings_for_display( 'custom_colors' );
		$global_colors   = array_merge( $system_colors, $custom_colors );

		foreach ( $global_settings as $key => $value ) {
			if ( empty( $value ) ) {
				continue;
			}

			$color_id = str_replace( 'globals/colors?id=', '', $value );

			foreach ( $global_colors as $color ) {
				if ( $color['_id'] === $color_id ) {
					$settings[ $key ] = $color['color'];
				}
			}
		}

		return $settings;
	}

	/**
	 * Check if the user is an admin.
	 *
	 * @since 1.9.6
	 *
	 * @return bool True if the user is an admin, false otherwise.
	 */
	private function is_admin(): bool {

		return current_user_can( 'manage_options' );
	}
}