<?php
if ( ! defined( 'ABSPATH' ) ) { exit; }
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Background;
use Elementor\Icons_Manager;
use Elementor\Repeater;
use Sifency\Traits\Sifency_Addons_Master_Typography;
use Sifency\Traits\Sifency_Addons_Button_Style_Controls;
use Sifency\Traits\Sifency_Addons_Item_Style_Controls;
use Sifency\Traits\Sifency_Addons_Animation_Controls;
use Sifency\Traits\Sifency_Addons_Animation_Manager;
use Sifency\Traits\Sifency_Addons_Flex_Controls;
use Sifency\Traits\Sifency_Addons_Help_Controls;
use Sifency\Classes\Sifency_Addons_Widget_Base;
class Sifency_Vertical_Tabs extends Widget_Base {
    use Sifency_Addons_Master_Typography;
    use Sifency_Addons_Button_Style_Controls;
    use Sifency_Addons_Item_Style_Controls;
	use Sifency_Addons_Animation_Controls;
	use Sifency_Addons_Flex_Controls;
	use Sifency_Addons_Help_Controls;
	public function __construct( $data = [], $args = null ) {
		parent::__construct( $data, $args );
		$this->wg_config = [
        'name'       => 'sifency_vertical_tabs',
        'title'      => 'Sifency Vertical Tabs',
        'icon'       => 'eicon-tabs',
        'category' 	 => [ 'sifency-addons-widgets' ],
        'style_depends'     => [ 'sifency-vertical-tab-style' ],
        'script_depends'    => [ 'sifency-vertical-tab-script' ],
		'keywords'      => ['vertical tab', 'tabbed content', 'tab switcher', 'content switcher', 'tabbed interface'],
    ];}
	protected function register_controls() {
		$this->start_controls_section(
			'section_content',
			[ 'label' => esc_html__( 'Tabs Content', 'sifency-addons' ) ]
		);
		$this->add_control(
			'tab_skin',
			[
				'label'   => esc_html__( 'Style Preset (Skin)', 'sifency-addons' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'classic',
				'options' => [
					'classic' => 'Classic (Bordered)',
					'minimal' => 'Minimal (Left Line)',
					'cards'   => 'Cards (Shadow Box)',
					'pills'   => 'Pills (Rounded)',
					'neon'    => 'Neon (Dark Glow)',
				],
				'prefix_class' => 'sifency-vtabs-skin-',
			]
		);
		$repeater = new Repeater();

		$repeater->add_control( 'tab_title', [
			'label' => esc_html__( 'Title', 'sifency-addons' ),
			'type' => Controls_Manager::TEXT,
			'default' => 'Tab Title',
			'label_block' => true,
		]);
		$repeater->add_control( 'tab_subtitle', [
			'label' => esc_html__( 'Subtitle', 'sifency-addons' ),
			'type' => Controls_Manager::TEXT,
		]);
		$repeater->add_control( 'tab_icon', [
			'label' => esc_html__( 'Icon', 'sifency-addons' ),
			'type' => Controls_Manager::ICONS,
		]);
        $repeater->add_control( 'content_type', [
            'label'   => esc_html__( 'Content Source', 'sifency-addons' ),
            'type'    => Controls_Manager::SELECT,
            'default' => 'content',
            'options' => [
                'content'  => esc_html__( 'Custom Content', 'sifency-addons' ),
                'template' => esc_html__( 'Elementor Template', 'sifency-addons' ),
            ],
        ]);
		$repeater->add_control( 'tab_content', [
			'label' => esc_html__( 'Content', 'sifency-addons' ),
			'type' => Controls_Manager::WYSIWYG,
			'default' => 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.',
			'condition' => [ 'content_type' => 'content' ],
		]);
        $repeater->add_control( 'template_id', [
            'label'       => esc_html__( 'Choose Template', 'sifency-addons' ),
            'type'        => Controls_Manager::SELECT2,
            'label_block' => true,
            'options'     => function_exists('sifency_addons_get_elementor_templates') ? sifency_addons_get_elementor_templates() : [],
            'condition'   => [ 'content_type' => 'template' ],
        ]);
		$this->add_control(
			'tabs',
			[
				'label' => esc_html__( 'Tabs Items', 'sifency-addons' ),
				'type' => Controls_Manager::REPEATER,
				'fields' => $repeater->get_controls(),
				'default' => [
					[ 'tab_title' => 'Development' ],
					[ 'tab_title' => 'Design' ],
					[ 'tab_title' => 'Marketing' ],
				],
				'title_field' => '{{{ tab_title }}}',
			]
		);
		$this->end_controls_section();
		$this->add_sifency_addons_help_controls();
		$this->start_controls_section( 'style_layout', [ 'label' => 'Layout', 'tab' => Controls_Manager::TAB_STYLE ] );
		$this->add_responsive_control( 'nav_width', [
			'label' => 'Navigation Width (%)',
			'type' => Controls_Manager::SLIDER,
			'size_units' => [ '%', 'px' ],
			'range' => [ '%' => [ 'min' => 10, 'max' => 50 ] ],
			'default' => [ 'unit' => '%', 'size' => 30 ],
			'tablet_default' => [ 'unit' => '%', 'size' => 100 ],
			'mobile_default' => [ 'unit' => '%', 'size' => 100 ],
			'selectors' => [ 
				'{{WRAPPER}} .sifency-vtabs-nav' => 'width: {{SIZE}}{{UNIT}};',
				'{{WRAPPER}} .sifency-vtabs-content-wrap' => 'width: calc(100% - {{SIZE}}{{UNIT}});',
			],
		]);
		$this->add_responsive_control( 'gap', [
			'label' => 'Gap',
			'type' => Controls_Manager::SLIDER,
			'size_units' => [ 'px' ],
			'selectors' => [ '{{WRAPPER}} .sifency-vtabs-wrapper' => 'gap: {{SIZE}}px;' ],
		]);
		$this->add_responsive_control( 'nav_item_spacing', [
			'label' => 'Nav Item Spacing',
			'type' => Controls_Manager::SLIDER,
			'selectors' => [ '{{WRAPPER}} .sifency-vtabs-nav-item' => 'margin-bottom: {{SIZE}}px;' ],
		]);
        $this->add_sifency_addons_flex_alignment_controls([
            'prefix'   => 'flex_wrapper',
            'label'    => 'Allignment',
            'selector' => '.sifency-vtabs-wrapper',
        ]);
		$this->end_controls_section();
		$this->start_controls_section(
			'section_style_indicator',
			[
				'label'     => esc_html__( 'Active Indicator (Minimal)', 'sifency-addons' ),
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => [ 'tab_skin' => 'minimal' ],
			]
		);
		$this->add_control(
			'indicator_side',
			[
				'label'   => esc_html__( 'Indicator Side', 'sifency-addons' ),
				'type'    => Controls_Manager::CHOOSE,
				'default' => 'before',
				'options' => [
					'before' => [ 'title' => 'Left (Before)', 'icon' => 'eicon-h-align-left' ],
					'after'  => [ 'title' => 'Right (After)', 'icon' => 'eicon-h-align-right' ],
				],
				'prefix_class' => 'sifency-vtabs-indicator-',
			]
		);
		$this->start_controls_tabs( 'tabs_indicator_style' );
		$this->start_controls_tab( 'tab_indicator_normal', [ 'label' => 'Normal' ] );
		$this->add_control( 'indicator_color', [
			'label'     => 'Color',
			'type'      => Controls_Manager::COLOR,
			'selectors' => [ '{{WRAPPER}} .sifency-vtabs-nav-item::before' => 'background: {{VALUE}};' ],
		]);
		$this->end_controls_tab();

		$this->start_controls_tab( 'tab_indicator_active', [ 'label' => 'Active' ] );
		$this->add_control( 'indicator_active_color', [
			'label'     => 'Active Color',
			'type'      => Controls_Manager::COLOR,
			'selectors' => [ '{{WRAPPER}} .sifency-vtabs-nav-item.active::before' => 'background: {{VALUE}};' ],
		]);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->add_responsive_control( 'indicator_spacing', [
			'label'      => 'Distance from Text',
			'type'       => Controls_Manager::SLIDER,
			'range'      => [ 'px' => [ 'min' => -50, 'max' => 50 ] ],
			'selectors'  => [
				'{{WRAPPER}}.sifency-vtabs-indicator-before .sifency-vtabs-nav-item::before' => 'left: {{SIZE}}px; right: auto;',
				'{{WRAPPER}}.sifency-vtabs-indicator-after .sifency-vtabs-nav-item::before'  => 'right: {{SIZE}}px; left: auto;',
			],
		]);
		$this->end_controls_section();
		$this->add_sifency_addons_item_style_controls([
			'prefix'   => 'nav_wrapper_style',
			'label'    => 'Nav Wrapper',
			'selector' => '.sifency-vtabs-nav',
			'exclude' => [ 'tabs', 'transition' ],
		]);
        $this->add_Sifency_Addons_Button_Style_Controls([
            'prefix'   => 'nav_item_style',
            'label'    => 'Nav Item',
            'selector' => '.sifency-vtabs-nav-item',
			'hover_selector' => '.sifency-vtabs-nav-item.active',
			'hover_tab_label' => esc_html__( 'Active', 'sifency-addons' ),
			'target_children' => true,
        ]);
        $this->add_sifency_addons_master_typography_controls([
            'prefix'   => 'content_style',
            'label'    => 'Content',
            'selector' => '.sifency-content-style',
			'color_only' => true,
			'show_max_width' => true,
			'exclude'    => [ 'stroke', 'shadow', 'tabs', 'transition' ],
        ]);
		$this->add_Sifency_Addons_Animation_Controls();
		$this->update_control('sifency_animation_target', [ 'type' => Controls_Manager::HIDDEN, 'default' => 'wrapper', ] );
	}

	protected function render() {
		$settings = $this->get_settings_for_display();
		$animation_manager = new Sifency_Addons_Animation_Manager( $settings );
		$animation_wrapper_attrs = $animation_manager->get_wrapper_attributes();
		?>
		<div class="sifency-vtabs-wrapper">
			
			<div class="sifency-vtabs-nav">
				<?php foreach ( $settings['tabs'] as $index => $tab ) : 
					$active = ( 0 === $index ) ? 'active' : '';
				?>
					<div class="sifency-vtabs-nav-item <?php echo esc_attr($active); ?>" data-index="<?php echo esc_attr($index); ?>">
						<?php if ( ! empty( $tab['tab_icon']['value'] ) ) : ?>
							<span class="sifency-vtab-icon">
								<?php \Elementor\Icons_Manager::render_icon( $tab['tab_icon'], [ 'aria-hidden' => 'true' ] ); ?>
							</span>
						<?php endif; ?>
						<div class="sifency-vtab-text">
							<span class="sifency-vtab-title"><?php echo esc_html( $tab['tab_title'] ); ?></span>
							<?php if ( ! empty( $tab['tab_subtitle'] ) ) : ?>
								<span class="sifency-vtab-subtitle"><?php echo esc_html( $tab['tab_subtitle'] ); ?></span>
							<?php endif; ?>
						</div>
					</div>
				<?php endforeach; ?>
			</div>

			<div class="sifency-vtabs-content-wrap">
				<?php foreach ( $settings['tabs'] as $index => $tab ) : 
					$active = ( 0 === $index ) ? 'active' : '';
				?>
					<div class="sifency-vtabs-content-item <?php echo esc_attr($active); ?>" data-index="<?php echo esc_attr($index); ?>">
						<div class="sifency-vtabs-inner sifency-content-style">
							<?php 
                                if ( 'template' === $tab['content_type'] && ! empty( $tab['template_id'] ) ) {
                                     // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Elementor already escapes content internally.
									echo \Elementor\Plugin::instance()->frontend->get_builder_content_for_display( $tab['template_id'] );
                                } else {
                                    echo do_shortcode( $tab['tab_content'] ); 
                                }
                            ?>
						</div>
					</div>
				<?php endforeach; ?>
			</div>

		</div>
		<?php
	}
}