Add missing signals and slots to content switcher

Signed-off-by: Zvonimir Fras <zvonimir@zvonimirfras.com>

Author: zvonimirfras

player/react/src/lib/components/ui-content-switcher.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { ContentSwitcher, Switch } from '@carbon/react';
-import { CssClasses } from '../types';
+import { CssClasses, SendSignal } from '../types';
 import { stringToCssClassName } from '../utils';
 import { commonSlots } from '../common-slots';
 
@@ -9,6 +9,7 @@ export interface ContentSwitcherState {
 	items: [];
 	size: [];
 	selectedIndex: number;
+	id: string | number;
 	disabled?: boolean;
 	hidden?: boolean;
 	cssClasses?: CssClasses[];
@@ -21,14 +22,15 @@ export interface ContentSwitcherState {
 export const type = 'content-switcher';
 
 export const slots = {
-	...commonSlots
+	...commonSlots,
+	selectedIndex: 'number'
 };
 
-export const UIContentSwitcher = ({ state }: {
+export const UIContentSwitcher = ({ state, sendSignal }: {
 	state: ContentSwitcherState;
 	setState: (state: any) => void;
 	setGlobalState: (state: any) => void;
-	sendSignal: (id: number | string, signal: string) => void;
+	sendSignal: SendSignal;
 }) => {
 	if (state.type !== 'content-switcher') {
 		// eslint-disable-next-line react/jsx-no-useless-fragment
@@ -47,7 +49,10 @@ export const UIContentSwitcher = ({ state }: {
 	return <ContentSwitcher
 	size={state.size}
 	selectedIndex={state.selectedIndex}
-	className={cssClasses}>
+	className={cssClasses}
+	onChange={({ index }: any) => {
+		sendSignal(state.id, 'change', [index], { ...state, selectedIndex: index });
+	}}>
 		{
 			state.items.map((step: any, index: number) => <Switch
 				className={step.className}