@sociallane/elements 1.0.0

package/widgets/services/services.php

@@ -0,0 +1,198 @@
+<?php
+/**
+ * Widget: Services
+ *
+ * Section with eyebrow, headline, intro text, then two columns: visual (image)
+ * and a list of services (title + description per item, with dividers).
+ *
+ * @package SocialLane_Elements
+ */
+
+namespace SocialLane\Elements;
+
+use Elementor\Widget_Base;
+use Elementor\Controls_Manager;
+use Elementor\Repeater;
+use SocialLane\Elements\Traits\Common_Controls;
+use SocialLane\Elements\Traits\Animation_Controls;
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+/**
+ * Services Widget
+ */
+class Services extends Widget_Base {
+
+	use Common_Controls;
+	use Animation_Controls;
+
+	public function get_name(): string {
+		return 'services';
+	}
+
+	public function get_title(): string {
+		return esc_html__( 'Services', 'sociallane-elements' );
+	}
+
+	public function get_icon(): string {
+		return 'eicon-gallery-grid';
+	}
+
+	public function get_categories(): array {
+		return [ 'sociallane-content' ];
+	}
+
+	public function get_keywords(): array {
+		return [ 'services', 'offerings', 'two column', 'image', 'list' ];
+	}
+
+	protected function register_controls(): void {
+		$this->register_header_section();
+		$this->register_media_section();
+		$this->register_services_section();
+		$this->register_layout_section();
+		$this->register_animation_controls( false, true );
+	}
+
+	private function register_header_section(): void {
+		$this->start_controls_section(
+			'section_header',
+			[
+				'label' => esc_html__( 'Header', 'sociallane-elements' ),
+				'tab'   => Controls_Manager::TAB_CONTENT,
+			]
+		);
+		$this->register_eyebrow_controls( [ 'condition' => true, 'eyebrow_default' => esc_html__( 'Services', 'sociallane-elements' ) ] );
+		$this->register_headline_controls( 'h2', [
+			'condition'   => true,
+			'label'       => esc_html__( 'Headline', 'sociallane-elements' ),
+			'placeholder' => esc_html__( 'We help you identify, explore and respond to new opportunities.', 'sociallane-elements' ),
+			'type'        => Controls_Manager::TEXTAREA,
+			'rows'        => 2,
+		] );
+		$this->register_description_controls( [
+			'condition' => true,
+			'label'     => esc_html__( 'Intro text', 'sociallane-elements' ),
+			'default'   => esc_html__( "As long as those opportunities involve giving us money to re-purpose old projects - we can come up with an endless number of those.", 'sociallane-elements' ),
+			'rows'      => 3,
+		] );
+		$this->end_controls_section();
+	}
+
+	private function register_media_section(): void {
+		$this->start_controls_section(
+			'section_media',
+			[
+				'label' => esc_html__( 'Image', 'sociallane-elements' ),
+				'tab'   => Controls_Manager::TAB_CONTENT,
+			]
+		);
+		$this->register_image_controls( [ 'condition' => true ] );
+		$this->add_control(
+			'image_grayscale',
+			[
+				'label'     => esc_html__( 'Grayscale image', 'sociallane-elements' ),
+				'type'      => Controls_Manager::SWITCHER,
+				'default'   => 'yes',
+				'condition' => [ 'show_image' => 'yes' ],
+			]
+		);
+
+		$this->end_controls_section();
+	}
+
+	private function register_services_section(): void {
+		$this->start_controls_section(
+			'section_services',
+			[
+				'label' => esc_html__( 'Services', 'sociallane-elements' ),
+				'tab'   => Controls_Manager::TAB_CONTENT,
+			]
+		);
+
+		$repeater = new Repeater();
+		$repeater->add_control(
+			'title',
+			[
+				'label'       => esc_html__( 'Title', 'sociallane-elements' ),
+				'type'        => Controls_Manager::TEXT,
+				'default'     => esc_html__( 'Lorem ipsum', 'sociallane-elements' ),
+				'label_block' => true,
+			]
+		);
+		$repeater->add_control(
+			'description',
+			[
+				'label'   => esc_html__( 'Description', 'sociallane-elements' ),
+				'type'    => Controls_Manager::TEXTAREA,
+				'default' => esc_html__( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.', 'sociallane-elements' ),
+			]
+		);
+
+		$default_services = [
+			[
+				'title'       => 'Web development.',
+				'description' => 'We specialise in crafting beautiful, high quality marketing pages. The rest of the website will be a shell that uses lorem ipsum everywhere.',
+			],
+			[
+				'title'       => 'Application development.',
+				'description' => 'We have a team of skilled developers who are experts in the latest app frameworks, like Angular 1 and Google Web Toolkit.',
+			],
+			[
+				'title'       => 'E-commerce.',
+				'description' => "We are at the forefront of modern e-commerce development. Which mainly means adding your logo to the Shopify store template we've used for the past six years.",
+			],
+			[
+				'title'       => 'Custom content management.',
+				'description' => "At Studio we understand the importance of having a robust and customised CMS. That's why we run all of our client projects out of a single, enormous Joomla instance.",
+			],
+		];
+
+		$this->add_control(
+			'services_list',
+			[
+				'label'       => esc_html__( 'Services', 'sociallane-elements' ),
+				'type'        => Controls_Manager::REPEATER,
+				'fields'      => $repeater->get_controls(),
+				'default'     => $default_services,
+				'title_field' => '{{{ title }}}',
+			]
+		);
+
+		$this->end_controls_section();
+	}
+
+	private function register_layout_section(): void {
+		$this->start_controls_section(
+			'section_layout',
+			[
+				'label' => esc_html__( 'Layout', 'sociallane-elements' ),
+				'tab'   => Controls_Manager::TAB_CONTENT,
+			]
+		);
+
+		$this->add_control(
+			'image_position',
+			[
+				'label'   => esc_html__( 'Image position', 'sociallane-elements' ),
+				'type'    => Controls_Manager::SELECT,
+				'default' => 'left',
+				'options' => [
+					'left'  => esc_html__( 'Left', 'sociallane-elements' ),
+					'right' => esc_html__( 'Right', 'sociallane-elements' ),
+				],
+			]
+		);
+
+		$this->end_controls_section();
+	}
+
+	protected function render(): void {
+		$settings = $this->get_settings_for_display();
+		require_once __DIR__ . '/data/view.php';
+		$view = prepare_services_view( $settings, $this->get_id() );
+		include __DIR__ . '/templates/wrapper.php';
+	}
+}

package/widgets/services/templates/partials/service-item.php

@@ -0,0 +1,35 @@
+<?php
+/**
+ * Partial: Services – single service item
+ *
+ * Expects $service (title, description), $is_last, and $view['classes'].
+ *
+ * @package SocialLane_Elements
+ */
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+if ( empty( $service ) ) {
+	return;
+}
+
+$classes = $view['classes'] ?? [];
+?>
+
+<li class="pb-6 md:pb-8 mb-6 md:mb-8 last:mb-0 last:pb-0">
+	<?php if ( $service['title'] !== '' ) : ?>
+		<h3 class="<?php echo esc_attr( $classes['service_title'] ?? '' ); ?> text-lg md:text-xl font-bold font-heading mb-2">
+			<?php echo $service['title']; ?>
+		</h3>
+	<?php endif; ?>
+	<?php if ( $service['description'] !== '' ) : ?>
+		<div class="<?php echo esc_attr( $classes['service_desc'] ?? '' ); ?> text-base leading-relaxed">
+			<?php echo $service['description']; ?>
+		</div>
+	<?php endif; ?>
+	<?php if ( ! $is_last ) : ?>
+		<div class="<?php echo esc_attr( $classes['divider'] ?? '' ); ?> border-b w-24 mt-6 md:mt-8"></div>
+	<?php endif; ?>
+</li>

package/widgets/services/templates/wrapper.php

@@ -0,0 +1,92 @@
+<?php
+/**
+ * Template: Services Wrapper
+ *
+ * Header (eyebrow, headline, intro) and two-column: image | services list.
+ * AVAILABLE DATA ($view): show_eyebrow, show_headline, show_description, show_image,
+ * eyebrow, headline, headline_tag, description, image, services, content_order,
+ * media_order, classes, widget_id
+ *
+ * @package SocialLane_Elements
+ */
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+if ( empty( $view ) ) {
+	return;
+}
+
+$section_id   = 'services-' . $view['widget_id'];
+$has_heading  = ( $view['show_headline'] && $view['headline'] !== '' ) || ( $view['show_eyebrow'] && $view['eyebrow'] !== '' ) || ( $view['show_description'] && $view['description'] !== '' );
+$has_services = ! empty( $view['services'] );
+$has_image    = $view['show_image'] && ! empty( $view['image']['src'] );
+$anim         = $view['animation'] ?? [];
+$section_attrs = sociallane_section_animation_attrs( $anim );
+$header = [
+	'id'                => $section_id,
+	'use_wrapper'       => true,
+	'alignment'         => 'left',
+	'block_class'       => '',
+	'margin_bottom'     => 'mb-12 md:mb-16',
+	'show_eyebrow'      => $view['show_eyebrow'] && $view['eyebrow'] !== '',
+	'eyebrow'           => $view['eyebrow'] ?? '',
+	'eyebrow_class'     => $view['classes']['eyebrow'] ?? '',
+	'eyebrow_extras'    => 'text-sm font-normal mb-2',
+	'show_headline'     => $view['show_headline'] && $view['headline'] !== '',
+	'headline'          => $view['headline'] ?? '',
+	'headline_tag'      => $view['headline_tag'] ?? 'h2',
+	'headline_class'    => $view['classes']['headline'] ?? '',
+	'headline_extras'   => 'text-3xl sm:text-4xl max-w-[50%] md:text-5xl font-bold font-heading leading-tight',
+	'show_description'  => $view['show_description'] && $view['description'] !== '',
+	'description'       => $view['description'] ?? '',
+	'description_class' => $view['classes']['description'] ?? '',
+	'description_extras'=> 'mt-4 md:mt-6 text-base md:text-lg leading-relaxed max-w-3xl',
+];
+$elements_path = SOCIALLANE_ELEMENTS_PATH . 'elements';
+?>
+
+<?php // ========== SERVICES START ========== ?>
+
+<section
+	class="<?php echo esc_attr( $view['classes']['section'] ); ?> py-16 md:py-20 lg:py-24"
+	<?php echo $section_attrs ? ' ' . $section_attrs : ''; ?>
+	<?php if ( $has_heading ) : ?>aria-labelledby="<?php echo esc_attr( $section_id ); ?>"<?php endif; ?>
+>
+	<div class="container mx-auto px-4 sm:px-6 lg:px-8">
+		<?php if ( $has_heading ) : ?>
+			<?php include $elements_path . '/section-header/templates/render.php'; ?>
+		<?php endif; ?>
+
+		<?php if ( $has_image || $has_services ) : ?>
+			<div class="grid grid-cols-1 lg:grid-cols-2 gap-10 lg:gap-16 items-start">
+				<?php if ( $has_image ) : ?>
+					<div class="<?php echo esc_attr( $view['media_order'] ); ?>">
+						<?php
+						$image = $view['image'];
+						$image['class'] = 'w-full object-cover rounded-2xl ' . ( $image['class'] ?? '' );
+						include $elements_path . '/image/templates/render.php';
+						?>
+					</div>
+				<?php endif; ?>
+
+				<div class="<?php echo esc_attr( $view['content_order'] ); ?>">
+					<?php if ( $has_services ) : ?>
+						<?php $stagger_attrs = sociallane_stagger_attrs( $anim ); ?>
+						<ul class="list-none p-0 m-0 space-y-0" <?php echo $stagger_attrs ? ' ' . $stagger_attrs : ''; ?>>
+							<?php foreach ( $view['services'] as $i => $service ) : ?>
+								<?php
+								$is_last = $i === count( $view['services'] ) - 1;
+								include __DIR__ . '/partials/service-item.php';
+								?>
+							<?php endforeach; ?>
+						</ul>
+					<?php endif; ?>
+				</div>
+			</div>
+		<?php endif; ?>
+	</div>
+</section>
+
+<?php // ========== SERVICES END ========== ?>

package/widgets/simple-page-hero/data/view.php

@@ -0,0 +1,52 @@
+<?php
+/**
+ * Data Preparation: Simple Page Hero
+ *
+ * @package SocialLane_Elements
+ */
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+/**
+ * Prepare view data for Simple Page Hero widget
+ *
+ * @param array  $settings  Raw Elementor settings
+ * @param string $widget_id Unique widget ID
+ * @return array Template-ready data
+ */
+function prepare_simple_page_hero_view( array $settings, string $widget_id ): array {
+	$show_title = ( $settings['show_title'] ?? 'yes' ) === 'yes';
+	$show_text  = ( $settings['show_text'] ?? 'yes' ) === 'yes';
+	$title      = $show_title ? esc_html( $settings['title'] ?? '' ) : '';
+	$text       = $show_text ? esc_html( $settings['text'] ?? '' ) : '';
+	$title_tag  = in_array( $settings['title_tag'] ?? 'h1', [ 'h1', 'h2', 'h3' ], true )
+		? $settings['title_tag']
+		: 'h1';
+
+	$layout = ( $settings['layout'] ?? 'left' ) === 'center' ? 'center' : 'left';
+	$align_class = $layout === 'center' ? 'text-center' : 'text-left';
+
+	$animation = sociallane_animation_view_data( $settings, [ 'headline' => true ] );
+
+	// Light/dark: dark hero background; title white, text muted
+	$classes = [
+		'section' => 'bg-neutral-100 dark:bg-zinc-900',
+		'title'   => 'text-zinc-900 dark:text-neutral-100',
+		'text'    => 'text-zinc-900 dark:text-neutral-100',
+	];
+
+	return [
+		'show_title'  => $show_title,
+		'show_text'   => $show_text,
+		'title'       => $title,
+		'title_tag'   => $title_tag,
+		'text'        => $text,
+		'layout'      => $layout,
+		'align_class' => $align_class,
+		'classes'     => $classes,
+		'widget_id'   => $widget_id,
+		'animation'   => $animation,
+	];
+}

package/widgets/simple-page-hero/simple-page-hero.php

@@ -0,0 +1,147 @@
+<?php
+/**
+ * Widget: Simple Page Hero
+ *
+ * A minimal hero block with title and text. Dark background, optional
+ * rounded bottom corners. Layout: left or center alignment.
+ *
+ * @package SocialLane_Elements
+ */
+
+namespace SocialLane\Elements;
+
+use Elementor\Widget_Base;
+use Elementor\Controls_Manager;
+use SocialLane\Elements\Traits\Animation_Controls;
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+/**
+ * Simple Page Hero Widget
+ */
+class Simple_Page_Hero extends Widget_Base {
+
+	use Animation_Controls;
+
+	public function get_name(): string {
+		return 'simple-page-hero';
+	}
+
+	public function get_title(): string {
+		return esc_html__( 'Simple Page Hero', 'sociallane-elements' );
+	}
+
+	public function get_icon(): string {
+		return 'eicon-heading';
+	}
+
+	public function get_categories(): array {
+		return [ 'sociallane-heroes' ];
+	}
+
+	public function get_keywords(): array {
+		return [ 'hero', 'page', 'title', 'heading', 'support' ];
+	}
+
+	protected function register_controls(): void {
+		$this->register_content_section();
+		$this->register_layout_section();
+		$this->register_animation_controls( true );
+	}
+
+	private function register_content_section(): void {
+		$this->start_controls_section(
+			'section_content',
+			[
+				'label' => esc_html__( 'Content', 'sociallane-elements' ),
+				'tab'   => Controls_Manager::TAB_CONTENT,
+			]
+		);
+
+		$this->add_control(
+			'show_title',
+			[
+				'label'   => esc_html__( 'Show Title', 'sociallane-elements' ),
+				'type'    => Controls_Manager::SWITCHER,
+				'default' => 'yes',
+			]
+		);
+
+		$this->add_control(
+			'title',
+			[
+				'label'       => esc_html__( 'Title', 'sociallane-elements' ),
+				'type'        => Controls_Manager::TEXT,
+				'default'     => esc_html__( 'Support center', 'sociallane-elements' ),
+				'label_block' => true,
+				'condition'   => [ 'show_title' => 'yes' ],
+			]
+		);
+
+		$this->add_control(
+			'title_tag',
+			[
+				'label'     => esc_html__( 'Title Tag', 'sociallane-elements' ),
+				'type'      => Controls_Manager::SELECT,
+				'default'   => 'h1',
+				'options'   => [ 'h1' => 'H1', 'h2' => 'H2', 'h3' => 'H3' ],
+				'condition' => [ 'show_title' => 'yes' ],
+			]
+		);
+
+		$this->add_control(
+			'show_text',
+			[
+				'label'   => esc_html__( 'Show Text', 'sociallane-elements' ),
+				'type'    => Controls_Manager::SWITCHER,
+				'default' => 'yes',
+			]
+		);
+
+		$this->add_control(
+			'text',
+			[
+				'label'     => esc_html__( 'Text', 'sociallane-elements' ),
+				'type'      => Controls_Manager::TEXTAREA,
+				'default'   => esc_html__( 'Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat fugiat.', 'sociallane-elements' ),
+				'condition' => [ 'show_text' => 'yes' ],
+			]
+		);
+
+		$this->end_controls_section();
+	}
+
+	private function register_layout_section(): void {
+		$this->start_controls_section(
+			'section_layout',
+			[
+				'label' => esc_html__( 'Layout', 'sociallane-elements' ),
+				'tab'   => Controls_Manager::TAB_CONTENT,
+			]
+		);
+
+		$this->add_control(
+			'layout',
+			[
+				'label'   => esc_html__( 'Layout', 'sociallane-elements' ),
+				'type'    => Controls_Manager::SELECT,
+				'default' => 'left',
+				'options' => [
+					'left'   => esc_html__( 'Left', 'sociallane-elements' ),
+					'center' => esc_html__( 'Center', 'sociallane-elements' ),
+				],
+			]
+		);
+
+		$this->end_controls_section();
+	}
+
+	protected function render(): void {
+		$settings = $this->get_settings_for_display();
+		require_once __DIR__ . '/data/view.php';
+		$view = prepare_simple_page_hero_view( $settings, $this->get_id() );
+		include __DIR__ . '/templates/wrapper.php';
+	}
+}

package/widgets/simple-page-hero/templates/wrapper.php

@@ -0,0 +1,54 @@
+<?php
+/**
+ * Template: Simple Page Hero Wrapper
+ *
+ * AVAILABLE DATA ($view): show_title, show_text, title, title_tag, text,
+ * align_class, classes, widget_id
+ *
+ * @package SocialLane_Elements
+ */
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+if ( empty( $view ) ) {
+	return;
+}
+
+$anim          = $view['animation'] ?? [];
+$section_attrs = sociallane_section_animation_attrs( $anim );
+$headline_attrs = sociallane_headline_animation_attrs( $anim );
+$section_id = 'simple-page-hero-' . $view['widget_id'];
+$has_heading = $view['show_title'] && ! empty( $view['title'] );
+?>
+
+<?php // ========== SIMPLE PAGE HERO START ========== ?>
+
+<section
+	class="<?php echo esc_attr( $view['classes']['section'] ); ?> py-12 md:py-16 lg:py-20 rounded-b-2xl"
+	<?php echo $section_attrs ? ' ' . $section_attrs : ''; ?>
+	<?php if ( $has_heading ) : ?>aria-labelledby="<?php echo esc_attr( $section_id ); ?>"<?php endif; ?>
+>
+	<div class="container mx-auto px-4 sm:px-6 lg:px-8">
+		<div class="max-w-4xl <?php echo esc_attr( $view['align_class'] ); ?> <?php echo ( $view['layout'] ?? 'left' ) === 'center' ? 'mx-auto' : ''; ?>">
+			<?php if ( $view['show_title'] && ! empty( $view['title'] ) ) : ?>
+				<<?php echo $view['title_tag']; ?>
+					id="<?php echo esc_attr( $section_id ); ?>"
+					class="<?php echo esc_attr( $view['classes']['title'] ); ?> text-3xl md:text-4xl lg:text-5xl font-bold font-heading leading-tight mt-0 mb-4"
+					<?php echo ! empty( $headline_attrs ) ? ' ' . $headline_attrs : ''; ?>
+				>
+					<?php echo $view['title']; ?>
+				</<?php echo $view['title_tag']; ?>>
+			<?php endif; ?>
+
+			<?php if ( $view['show_text'] && ! empty( $view['text'] ) ) : ?>
+				<p class="<?php echo esc_attr( $view['classes']['text'] ); ?> text-base md:text-lg leading-relaxed mt-0 mb-0">
+					<?php echo $view['text']; ?>
+				</p>
+			<?php endif; ?>
+		</div>
+	</div>
+</section>
+
+<?php // ========== SIMPLE PAGE HERO END ========== ?>