← All changes | includes/widgets/custom-table.php +231 -203 1.2.2 → 1.3.17 View file →

		@@ -1,5 +1,6 @@
1	1	<?php
	2	+
2	3	namespace UiCoreElements;
3	4
4	5	use Elementor\Plugin;
5	6	use Elementor\Controls_Manager;
		@@ -8,9 +9,10 @@
8	9	use UiCoreElements\Utils\Animation_Trait;
9	10
10	11	defined('ABSPATH') || exit();
11	12
12		-class CustomTable extends UiCoreNestedWidget {
	13	+class CustomTable extends UiCoreNestedWidget
	14	+{
13	15
14	16	use Animation_Trait;
15	17
16	18	public function get_name()
		@@ -40,50 +42,61 @@
40	42	public function get_scripts()
41	43	{
42	44	return [];
43	45	}
44		- public function has_widget_inner_wrapper(): bool {
45		- // TODO: remove after 3.30, when the full deprecation of widget innet wrapper is ready
46		- return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
47		- }
	46	+ public function has_widget_inner_wrapper(): bool
	47	+ {
	48	+ // TODO: remove after Optmized Markup experiment is merged to the core
	49	+ return ! \Elementor\Plugin::$instance->experiments->is_feature_active('e_optimized_markup');
	50	+ }
48	51
49		- protected function carousel_content_container( int $index ) {
50		- return [
51		- 'elType' => 'container',
52		- 'settings' => [
	52	+ protected function carousel_content_container(int $index)
	53	+ {
	54	+ return [
	55	+ 'elType' => 'container',
	56	+ 'settings' => [
53	57	/* translators: %s: Item index */
54		- '_title' => sprintf( __( 'Cel #%s', 'uicore-elements' ), $index ),
55		- 'content_width' => 'full',
56		- ],
	58	+ '_title' => sprintf(__('Cel #%s', 'uicore-elements'), $index),
	59	+ 'content_width' => 'full',
	60	+ ],
57	61	];
58		- }
	62	+ }
59	63
60		- protected function get_default_children_elements() {
61		- return [
62		- $this->carousel_content_container( 1 ),
63		- $this->carousel_content_container( 2 ),
64		- $this->carousel_content_container( 3 ),
65		- ];
66		- }
	64	+ protected function get_default_children_elements()
	65	+ {
	66	+ return [
	67	+ $this->carousel_content_container(1),
	68	+ $this->carousel_content_container(2),
	69	+ $this->carousel_content_container(3),
	70	+ ];
	71	+ }
67	72
68		- protected function get_default_repeater_title_setting_key() {
69		- return 'table_cels';
70		- }
	73	+ protected function get_default_repeater_title_setting_key()
	74	+ {
	75	+ return 'item';
	76	+ }
71	77
72		- protected function get_default_children_title() {
73		- /* translators: %d: Item index */
74		- return esc_html__( 'Cel #%d', 'uicore-elements' );
75		- }
76		- protected function get_default_children_placeholder_selector() {
77		- return '.ui-e-table';
78		- }
	78	+ protected function get_default_children_title()
	79	+ {
	80	+ /* translators: %d: Item index */
	81	+ return esc_html__('Cel #%d', 'uicore-elements');
	82	+ }
	83	+ protected function get_default_children_placeholder_selector()
	84	+ {
	85	+ return '.ui-e-table';
	86	+ }
79	87
	88	+ protected function get_default_children_container_placeholder_selector()
	89	+ {
	90	+ return '.ui-e-table-editor-placeholder';
	91	+ }
	92	+
80	93	protected function register_controls()
81	94	{
82		- if( !Plugin::$instance->experiments->is_feature_active('nested-elements') ) {
83		- $this->nesting_fallback('controls');
84		- return;
85		- }
	95	+ if (!Plugin::$instance->experiments->is_feature_active('nested-elements')) {
	96	+ $this->nesting_fallback('controls');
	97	+ return;
	98	+ }
86	99
87	100	$this->start_controls_section(
88	101	'section_content',
89	102	[
		@@ -91,8 +104,18 @@
91	104	'tab' => Controls_Manager::TAB_CONTENT,
92	105	]
93	106	);
94	107
	108	+ $this->add_control(
	109	+ 'rerender_table',
	110	+ [
	111	+ 'label' => esc_html__('Preview', 'uicore-elements'),
	112	+ 'type' => Controls_Manager::BUTTON,
	113	+ 'text' => esc_html__('Refresh Table', 'uicore-elements'),
	114	+ 'separator' => 'before',
	115	+ 'event' => 'ui-e-custom-table-rerender',
	116	+ ]
	117	+ );
95	118
96	119	//Columns
97	120	$columns = new Repeater();
98	121	$columns->add_responsive_control(
		@@ -99,9 +122,9 @@
99	122	'col_size',
100	123	[
101	124	'label' => __('Column Size', 'uicore-elements'),
102	125	'type' => Controls_Manager::SLIDER,
103		- 'size_units' => ['px', 'fr','custom'],
	126	+ 'size_units' => ['px', 'fr', 'custom'],
104	127	'default' => [
105	128	'size' => 300,
106	129	'unit' => 'px',
107	130	],
		@@ -114,9 +137,9 @@
114	137	'min' => 1,
115	138	'max' => 12,
116	139	],
117	140	],
118		- 'render_type' => 'template',
	141	+ 'render_type' => 'ui',
119	142	'selectors' => [
120	143	'{{WRAPPER}}' => '--ui-e-last:{{SIZE}}{{UNIT}};',
121	144	],
122	145	]
		@@ -127,13 +150,13 @@
127	150	[
128	151	'type' => Controls_Manager::REPEATER,
129	152	'fields' => $columns->get_controls(),
130	153	'title_field' => 'Column',
131		- 'render_type' => 'template',
	154	+ 'render_type' => 'ui',
132	155	'default' => [
133		- [ 'col_size' => [ 'size' => 1, 'unit' => 'fr' ] ],
134		- [ 'col_size' => [ 'size' => 1, 'unit' => 'fr' ] ],
135		- [ 'col_size' => [ 'size' => 1, 'unit' => 'fr' ] ],
	156	+ ['col_size' => ['size' => 1, 'unit' => 'fr']],
	157	+ ['col_size' => ['size' => 1, 'unit' => 'fr']],
	158	+ ['col_size' => ['size' => 1, 'unit' => 'fr']],
136	159	],
137	160	]
138	161	);
139	162
		@@ -145,8 +168,9 @@
145	168	'item',
146	169	[
147	170	'label' => __('Title', 'uicore-elements'),
148	171	'type' => Controls_Manager::TEXT,
	172	+ 'render_type' => 'ui'
149	173	]
150	174	);
151	175
152	176	$this->add_control(
		@@ -156,11 +180,11 @@
156	180	'fields' => $repeater->get_controls(),
157	181	'title_field' => '{{{ item }}}',
158	182	'allow_empty' => false,
159	183	'default' => [
160		- [ 'item' => __( 'Cel #1', 'uicore-elements' ) ],
161		- [ 'item' => __( 'Cel #2', 'uicore-elements' ) ],
162		- [ 'item' => __( 'Cel #3', 'uicore-elements' ) ],
	184	+ ['item' => __('Cel #1', 'uicore-elements')],
	185	+ ['item' => __('Cel #2', 'uicore-elements')],
	186	+ ['item' => __('Cel #3', 'uicore-elements')],
163	187	],
164	188	]
165	189	);
166	190
		@@ -179,97 +203,97 @@
179	203	$this->start_controls_tabs(
180	204	'row_tabs'
181	205	);
182	206
183		- $this->start_controls_tab(
184		- 'odd_row',
185		- [
186		- 'label' => esc_html__( 'Odd row', 'textdomain' ),
187		- ]
188		- );
	207	+ $this->start_controls_tab(
	208	+ 'odd_row',
	209	+ [
	210	+ 'label' => esc_html__('Odd row', 'textdomain'),
	211	+ ]
	212	+ );
189	213
190		- $this->add_control(
191		- 'odd_row_bg_color',
192		- [
193		- 'label' => __('Row background', 'uicore-elements'),
194		- 'type' => Controls_Manager::COLOR,
195		- 'selectors' => [
196		- '{{WRAPPER}} .ui-e-table > .ui-e-odd' => 'background-color: {{VALUE}};',
197		- ],
198		- ]
199		- );
	214	+ $this->add_control(
	215	+ 'odd_row_bg_color',
	216	+ [
	217	+ 'label' => __('Row background', 'uicore-elements'),
	218	+ 'type' => Controls_Manager::COLOR,
	219	+ 'selectors' => [
	220	+ '{{WRAPPER}} .ui-e-table > .ui-e-odd' => 'background-color: {{VALUE}};',
	221	+ ],
	222	+ ]
	223	+ );
200	224
201		- $this->add_control(
202		- 'odd_row_padding',
203		- [
204		- 'label' => esc_html__( 'Row Padding', 'uicore-elements' ),
205		- 'type' => Controls_Manager::DIMENSIONS,
206		- 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
207		- 'selectors' => [
208		- "{{WRAPPER}} .ui-e-table > .ui-e-odd" => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
209		- ],
210		- ]
211		- );
	225	+ $this->add_control(
	226	+ 'odd_row_padding',
	227	+ [
	228	+ 'label' => esc_html__('Row Padding', 'uicore-elements'),
	229	+ 'type' => Controls_Manager::DIMENSIONS,
	230	+ 'size_units' => ['px', 'em', 'rem', 'custom'],
	231	+ 'selectors' => [
	232	+ "{{WRAPPER}} .ui-e-table > .ui-e-odd" => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	233	+ ],
	234	+ ]
	235	+ );
212	236
213		- $this->add_control(
214		- 'odd_row_radius',
215		- [
216		- 'label' => esc_html__( 'Row Border Radius', 'uicore-elements' ),
217		- 'type' => Controls_Manager::DIMENSIONS,
218		- 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
219		- 'selectors' => [
220		- "{{WRAPPER}} .ui-e-table > .ui-e-odd.ui-e-first-row-cel" => 'border-radius: {{TOP}}{{UNIT}} 0 0 {{LEFT}}{{UNIT}};',
221		- "{{WRAPPER}} .ui-e-table > .ui-e-odd.ui-e-last-row-cel" => 'border-radius: 0 {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} 0;'
222		- ],
223		- ]
224		- );
	237	+ $this->add_control(
	238	+ 'odd_row_radius',
	239	+ [
	240	+ 'label' => esc_html__('Row Border Radius', 'uicore-elements'),
	241	+ 'type' => Controls_Manager::DIMENSIONS,
	242	+ 'size_units' => ['px', 'em', 'rem', 'custom'],
	243	+ 'selectors' => [
	244	+ "{{WRAPPER}} .ui-e-table > .ui-e-odd.ui-e-first-row-cel" => 'border-radius: {{TOP}}{{UNIT}} 0 0 {{LEFT}}{{UNIT}};',
	245	+ "{{WRAPPER}} .ui-e-table > .ui-e-odd.ui-e-last-row-cel" => 'border-radius: 0 {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} 0;'
	246	+ ],
	247	+ ]
	248	+ );
225	249
226		- $this->end_controls_tab();
	250	+ $this->end_controls_tab();
227	251
228		- $this->start_controls_tab(
229		- 'even_row',
230		- [
231		- 'label' => esc_html__( 'Even row', 'textdomain' ),
232		- ]
233		- );
	252	+ $this->start_controls_tab(
	253	+ 'even_row',
	254	+ [
	255	+ 'label' => esc_html__('Even row', 'textdomain'),
	256	+ ]
	257	+ );
234	258
235		- $this->add_control(
236		- 'even_row_bg_color',
237		- [
238		- 'label' => __('Row background', 'uicore-elements'),
239		- 'type' => Controls_Manager::COLOR,
240		- 'selectors' => [
241		- '{{WRAPPER}} .ui-e-table > .ui-e-even' => 'background-color: {{VALUE}};',
242		- ],
243		- ]
244		- );
	259	+ $this->add_control(
	260	+ 'even_row_bg_color',
	261	+ [
	262	+ 'label' => __('Row background', 'uicore-elements'),
	263	+ 'type' => Controls_Manager::COLOR,
	264	+ 'selectors' => [
	265	+ '{{WRAPPER}} .ui-e-table > .ui-e-even' => 'background-color: {{VALUE}};',
	266	+ ],
	267	+ ]
	268	+ );
245	269
246		- $this->add_control(
247		- 'even_row_padding',
248		- [
249		- 'label' => esc_html__( 'Row Padding', 'uicore-elements' ),
250		- 'type' => Controls_Manager::DIMENSIONS,
251		- 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
252		- 'selectors' => [
253		- "{{WRAPPER}} .ui-e-table > .ui-e-even" => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
254		- ],
255		- ]
256		- );
	270	+ $this->add_control(
	271	+ 'even_row_padding',
	272	+ [
	273	+ 'label' => esc_html__('Row Padding', 'uicore-elements'),
	274	+ 'type' => Controls_Manager::DIMENSIONS,
	275	+ 'size_units' => ['px', 'em', 'rem', 'custom'],
	276	+ 'selectors' => [
	277	+ "{{WRAPPER}} .ui-e-table > .ui-e-even" => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	278	+ ],
	279	+ ]
	280	+ );
257	281
258		- $this->add_control(
259		- 'even_row_radius',
260		- [
261		- 'label' => esc_html__( 'Row Border Radius', 'uicore-elements' ),
262		- 'type' => Controls_Manager::DIMENSIONS,
263		- 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
264		- 'selectors' => [
265		- "{{WRAPPER}} .ui-e-table > .ui-e-even.ui-e-first-row-cel" => 'border-radius: {{TOP}}{{UNIT}} 0 0 {{LEFT}}{{UNIT}};',
266		- "{{WRAPPER}} .ui-e-table > .ui-e-even.ui-e-last-row-cel" => 'border-radius: 0 {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} 0;'
267		- ],
268		- ]
269		- );
	282	+ $this->add_control(
	283	+ 'even_row_radius',
	284	+ [
	285	+ 'label' => esc_html__('Row Border Radius', 'uicore-elements'),
	286	+ 'type' => Controls_Manager::DIMENSIONS,
	287	+ 'size_units' => ['px', 'em', 'rem', 'custom'],
	288	+ 'selectors' => [
	289	+ "{{WRAPPER}} .ui-e-table > .ui-e-even.ui-e-first-row-cel" => 'border-radius: {{TOP}}{{UNIT}} 0 0 {{LEFT}}{{UNIT}};',
	290	+ "{{WRAPPER}} .ui-e-table > .ui-e-even.ui-e-last-row-cel" => 'border-radius: 0 {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} 0;'
	291	+ ],
	292	+ ]
	293	+ );
270	294
271		- $this->end_controls_tab();
	295	+ $this->end_controls_tab();
272	296
273	297	$this->end_controls_tabs();
274	298
275	299
		@@ -286,13 +310,11 @@
286	310
287	311	foreach ($cols as $index => $item) {
288	312
289	313	// Set desktop column size
290		- $grid_columns['desktop'][] = $this->get_option_size(
291		- 'col_size',
292		- ['size' => 2, 'unit' => 'fr'],
293		- true
294		- );
	314	+ $grid_columns['desktop'][] = isset($item['col_size']['size']) && isset($item['col_size']['unit'])
	315	+ ? $item['col_size']['size'] . $item['col_size']['unit']
	316	+ : '1fr'; // fallback
295	317
296	318	foreach ($breakpoints as $breakpoint => $object) {
297	319	$size_slug = 'col_size_' . $breakpoint;
298	320
		@@ -315,12 +337,12 @@
315	337	}
316	338
317	339	public function render()
318	340	{
319		- if(!Plugin::$instance->experiments->is_feature_active('nested-elements')) {
320		- $this->nesting_fallback();
321		- return;
322		- }
	341	+ if (!Plugin::$instance->experiments->is_feature_active('nested-elements')) {
	342	+ $this->nesting_fallback();
	343	+ return;
	344	+ }
323	345
324	346	$cells = $this->get_settings_for_display('cells');
325	347	$cols = $this->get_settings_for_display('columns');
326	348	$grid_css = $this->build_grid_css($cols);
		@@ -327,110 +349,116 @@
327	349
328	350	// Add it to the widget wrapper
329	351	$this->add_render_attribute('_wrapper', ['style' => $grid_css]);
330	352
331		- ?>
	353	+?>
332	354	<div class="ui-e-table">
333	355	<?php
334	356
335		- $columns = count($cols);
	357	+ $columns = count($cols);
336	358
337		- foreach ($cells as $index => $item) {
338		- $row_class = floor($index / $columns) % 2 !== 0
339		- ? 'ui-e-even'
340		- : 'ui-e-odd';
	359	+ foreach ($cells as $index => $item) {
	360	+ $row_class = floor($index / $columns) % 2 !== 0
	361	+ ? 'ui-e-even'
	362	+ : 'ui-e-odd';
341	363
342		- // TODO: in the future experiment a nth-child approach so we don't need this first/last classes
343		- // Add classes to the first and last items of each row
344		- if ($index % $columns === 0) {
345		- $row_class .= ' ui-e-first-row-cel';
346		- } else if (($index + 1) % $columns === 0) {
347		- $row_class .= ' ui-e-last-row-cel';
348		- }
	364	+ // TODO: in the future experiment a nth-child approach so we don't need this first/last classes
	365	+ // Add classes to the first and last items of each row
	366	+ if ($index % $columns === 0) {
	367	+ $row_class .= ' ui-e-first-row-cel';
	368	+ } else if (($index + 1) % $columns === 0) {
	369	+ $row_class .= ' ui-e-last-row-cel';
	370	+ }
349	371
350		- $this->print_child($index, ['class' => $row_class]);
351		- }
	372	+ $this->print_child($index, ['class' => $row_class]);
	373	+ }
352	374	?>
353	375	</div>
354		- <?php
	376	+ <?php
355	377	}
356	378
357		- public function print_child( $index , array $atts = []) {
358		- $children = $this->get_children();
	379	+ public function print_child($index, array $atts = [])
	380	+ {
	381	+ $children = $this->get_children();
359	382
360		- if ( ! empty( $children[ $index ] ) ) {
	383	+ if (! empty($children[$index])) {
361	384
362	385	// Add custom attributes to each child container.
363		- if( !empty($atts) ){
	386	+ if (!empty($atts)) {
364	387	//$child_settings = $children[ $index ]->get_settings_for_display();
365		- foreach($atts as $key => $value){
366		- $children[ $index ]->add_render_attribute( '_wrapper', $key, $value );
	388	+ foreach ($atts as $key => $value) {
	389	+ $children[$index]->add_render_attribute('_wrapper', $key, $value);
367	390	}
368	391	}
369	392
370		- $children[ $index ]->print_element();
371		- }
372		- }
	393	+ $children[$index]->print_element();
	394	+ }
	395	+ }
373	396
374		- protected function get_initial_config(): array {
375		- if (Plugin::$instance->experiments->is_feature_active('e_nested_atomic_repeaters')) {
376		- return array_merge(parent::get_initial_config(), [
377		- 'support_improved_repeaters' => true,
378		- 'node' => '.ui-e-table'
379		- ]);
380		- }
	397	+ protected function get_initial_config(): array
	398	+ {
	399	+ if (Plugin::$instance->experiments->is_feature_active('e_nested_atomic_repeaters')) {
	400	+ return array_merge(parent::get_initial_config(), [
	401	+ 'support_improved_repeaters' => true,
	402	+ 'node' => '.ui-e-table'
	403	+ ]);
	404	+ }
381	405
382		- return parent::get_initial_config();
383		- }
	406	+ return parent::get_initial_config();
	407	+ }
384	408
385	409
386		- protected function content_template() {
387		- ?>
	410	+ protected function content_template()
	411	+ {
	412	+ ?>
388	413	<#
389		- const cols = settings.columns;
390		- const cols_qty = '--ui-e-cols-qty:' + settings.columns.length;
	414	+ const cols=settings.columns || [];
	415	+ const cells=settings.cells || [];
	416	+ const cols_qty='--ui-e-cols-qty:' + cols.length;
391	417
392	418	if ( cols ) {
393		- let gridCss = '';
394		- const gridColumns = {};
395		- const breakpoints = elementorFrontend.config.responsive.activeBreakpoints;
	419	+ let gridCss='' ;
	420	+ const gridColumns={};
	421	+ const breakpoints=elementorFrontend.config.responsive.activeBreakpoints;
396	422
397		- _.each( cols, function( item, index ) {
	423	+ _.each( cols, function( item, index ) {
398	424
399		- if ( ! gridColumns.desktop ) {
400		- gridColumns.desktop = [];
401		- }
	425	+ if ( ! gridColumns.desktop ) {
	426	+ gridColumns.desktop=[];
	427	+ }
402	428
403		- gridColumns.desktop.push( item.col_size.size + item.col_size.unit );
	429	+ gridColumns.desktop.push( item.col_size.size + item.col_size.unit );
404	430
405		- _.each( breakpoints, function( object, breakpoint ) {
406		- const sizeSlug = 'col_size_' + breakpoint;
	431	+ _.each( breakpoints, function( object, breakpoint ) {
	432	+ const sizeSlug='col_size_' + breakpoint;
407	433
408		- if ( item[sizeSlug] && item[sizeSlug].size ) {
409		- if ( ! gridColumns[breakpoint] ) {
410		- gridColumns[breakpoint] = [];
411		- }
412		- gridColumns[breakpoint].push( item[sizeSlug].size + item[sizeSlug].unit );
413		- } else {
414		- if ( ! gridColumns[breakpoint] ) {
415		- gridColumns[breakpoint] = [];
416		- }
417		- gridColumns[breakpoint].push( item.col_size.size + item.col_size.unit );
418		- }
419		- });
420		- });
	434	+ if ( item[sizeSlug] && item[sizeSlug].size ) {
	435	+ if ( ! gridColumns[breakpoint] ) {
	436	+ gridColumns[breakpoint]=[];
	437	+ }
	438	+ gridColumns[breakpoint].push( item[sizeSlug].size + item[sizeSlug].unit );
	439	+ } else {
	440	+ if ( ! gridColumns[breakpoint] ) {
	441	+ gridColumns[breakpoint]=[];
	442	+ }
	443	+ gridColumns[breakpoint].push( item.col_size.size + item.col_size.unit );
	444	+ }
	445	+ });
	446	+ });
421	447
422		- _.each( gridColumns, function( values, device ) {
423		- const breakpoint = device === 'desktop' ? '' : '-' + device;
424		- gridCss += '--ui-e-table-cols' + breakpoint + ':' + values.join(' ') + ';';
425		- });
	448	+ _.each( gridColumns, function( values, device ) {
	449	+ const breakpoint=device==='desktop' ? '' : '-' + device;
	450	+ gridCss +='--ui-e-table-cols' + breakpoint + ':' + values.join(' ') + ' ;';
	451	+ });
426	452
427		- view.addRenderAttribute('table', 'style', [gridCss, cols_qty].join(' '));
	453	+ view.addRenderAttribute('table', 'data-cell-count' , cells.length);
	454	+ view.addRenderAttribute('table', 'style' , [gridCss, cols_qty].join(' '));
428	455	}
429		- #>
430		- <div class="ui-e-table" {{{ view.getRenderAttributeString('table') }}}>
	456	+ #>
	457	+ <div class="ui-e-table" {{{ view.getRenderAttributeString('table') }}}>
431	458
432		- </div>
433		- <?php
	459	+ </div>
	460	+ <div class="ui-e-table-editor-placeholder"></div>
	461	+ <?php
434	462	}
435	463	}
436		-\Elementor\Plugin::instance()->widgets_manager->register(new CustomTable());
	464	+\Elementor\Plugin::instance()->widgets_manager->register(new CustomTable());