Shows how to override the Widget_Base class to create a custom widget that can be used in the Elementor page editor.

custom-elementor-widget.php

<?php
namespace Elementor; // Custom widgets must be defined in the Elementor namespace

if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly (security measure)

class Schedule extends Widget_Base { // Extend ELementor's Widget_Base class

	// Machine name or "handle" for the widget
	public function get_name() {
		return __( 'schedule', 'mld' );
	}
	
	// Widget title which is displayed in the Elementor editor's "widget gallery"
	public function get_title() {
		return __( 'Schedule', 'mld' );
	}

	/**
	 * Name of element icon which is displayed next to title in "widget gallery".
	 * You can get a sense of which icon names are available by looking at the already created widgets
	 * in elementor/includes/widgets/ and seeing which names they return for get_icon().
	 */
   public function get_icon() {
      return 'eicon-wordpress';
   }

	/**
	* You register the widget controls (data fields) in this function.
	* A controls reference is available at: https://github.com/pojome/elementor/blob/master/docs/content/controls/reference.
	* Elementor has a fair number of interesting control fields to choose from, and decent documentation describing each type of available control. 
	* However, the available controls are not as extensive as Advanced Custom Fields Pro, and it’s not currently possible to use ACF Pro to create 
	* controls for Elementor Widgets (with Elementor 1.9.7). However, Elementor 2.0 is coming out soon, and it has placed integration with ACF Pro 
	* on it’s roadmap, so I’m excited about that!
	*/
	protected function _register_controls() {
		
		/*
		 * Creates a section called 'section_schedule' inside the Content tab. The editing interface for each Elementor widget
		 * is organized into three tabs: Content, Style, and Advanced. Inside each tab, you can define sections, which can be collapsed by the user.
		 */
		$this->start_controls_section(
			'section_schedule', // Section key
			[
				'label' => __( 'Schedule', 'mld' ), // Section display name
				'type' => Controls_Manager::SECTION, 
				'tab' => Controls_Manager::TAB_CONTENT, // Which tab to display the section in.
			]
		);

		/*
		 * After you start the section, you can put as many controls inside the section as you want.
		 */
		$this->add_control(
			'title', // Control key
			[
				'label' => __( 'Schedule Title', 'mld' ), // Control label
				'type' => Controls_Manager::TEXT, // Type of control
				'default' => '', // Default value for control
			]
		);
		
		/* 
		 * Repeaters allow users to add as many of a given data value as the want. Unfortunately, as of Elementor 1.9.7, you cannot nest 
		 * repeater fields inside repeater fields.
		 */
		$this->add_control(
			'column_headings',
			[
				'label' => __( 'Column Headings', 'mld' ),
				'type' => Controls_Manager::REPEATER,
				'default' => [
					[
						'heading' => __( 'Semester', 'mld' ),
					],
					[
						'heading' => __( 'Requirements\\Credits', 'mld' ),
					],
					[
						'heading' => __( 'Type', 'mld' ),
					],
				],
				'fields' => [
					[
						'name' => 'heading',
						'label' => __( 'Heading', 'mld' ),
						'type' => Controls_Manager::TEXT,
						'default' => __( 'Semester' , 'mld' ),
						'label_block' => true,
					],
				],
				// Which subfield is shown when the repeater field is collapsed
				'title_field' => '{{{ heading }}}',
			]
		);

		$this->add_control(
			'rows',
			[
				'label' => __( 'Rows', 'mld' ),
				'type' => Controls_Manager::REPEATER,
				'description' => 'The body rows of the schedule table. If you leave the Semester field blank, it will add subsequent that item to the same semester row in the Schedule table. If you put text in the Semester field, it will start a new row in the Schedule table.',
				'fields' => [
					[
						'name' => 'semester',
						'label' => __( 'Semester', 'mld' ),
						'type' => Controls_Manager::TEXT,
						'default' => __( 'Fall' , 'mld' ),
						'label_block' => true,
					],
					[
						'name' => 'requirement',
						'label' => __( 'Requirement', 'mld' ),
						'type' => Controls_Manager::TEXT,
						'default' => 'Methods of Learning and Design (3)',
						'description' => 'Include credit hours in this field.',
						'label_block' => true,
					],
					[
						'name' => 'type',
						'label' => __( 'Type', 'mld' ),
						'type' => Controls_Manager::SELECT,
						'default' => __( 'Core Course' , 'mld' ),
						'options' => [
							'Core Course' => 'Core Course',
							'Track Course' => 'Track Course',
							'Studio Course' => 'Studio Course',
							'ePortfolio' => 'Program Introduction',
						],
						'label_block' => true,
					],
				],
				// Which subfield's value is shown when the repeater field is collapsed
				'title_field' => '{{{ requirement }}}',
			]
		);

		// Ends the controls section
		$this->end_controls_section();

		// You can add as many sections as you wish.

	}
	
	/**
	 * This function is run when Elementor renders the element when the WordPress function the_content() is 
	 * called (all Elementor elements are rendered via the_content()). This function is also used to render
	 * the element in the Elementor page preview as you edit the page.
	 */
	protected function render() {
		// get_settings() gets all data associated with the instance of this Widget (values for controls, etc)
		$sample_schedule = $this->get_settings();
		
		// Separate out my PHP template into it's own file
		include( get_template_directory() . '/template-parts/schedule.php' );
	}
	
	/**
	 * This function controls what category the widget is filed under in the All Widgets toolbar.
	 * The MLD category is a custom category that I added in functions.php.
	 */
	public function get_categories() {
		return [ 'mld' ];
	}

}

// After the Schedule class is defined, I must register the new widget class with Elementor:
Plugin::instance()->widgets_manager->register_widget_type( new \Elementor\Schedule() );