feat(UiKit): Tab Navigation Block (#1095)

Author: tiagoevanp

packages/ui-kit/src/blocks/LayoutBlock.ts

@@ -6,6 +6,7 @@ import type { ImageBlock } from './layout/ImageBlock';
 import type { InputBlock } from './layout/InputBlock';
 import type { PreviewBlock } from './layout/PreviewBlock';
 import type { SectionBlock } from './layout/SectionBlock';
+import type { TabNavigationBlock } from './layout/TabNavigationBlock';
 import type { VideoConferenceBlock } from './layout/VideoConferenceBlock';
 
 export type LayoutBlock =
@@ -18,4 +19,5 @@ export type LayoutBlock =
   | InputBlock
   | SectionBlock
   | VideoConferenceBlock
-  | PreviewBlock;
+  | PreviewBlock
+  | TabNavigationBlock;

packages/ui-kit/src/blocks/LayoutBlockType.ts

@@ -9,6 +9,7 @@ export enum LayoutBlockType {
   INPUT = 'input',
   CONDITIONAL = 'conditional',
   PREVIEW = 'preview',
+  TAB_NAVIGATION = 'tab_navigation',
   VIDEO_CONF = 'video_conf',
 }
 

packages/ui-kit/src/blocks/layout/TabNavigationBlock.ts

@@ -0,0 +1,15 @@
+import type { Block } from '../Block';
+import type { LayoutBlockish } from '../LayoutBlockish';
+import type { TextObject } from '../TextObject';
+
+export type TabItem = {
+  title: TextObject;
+  disabled?: boolean;
+  selected?: boolean;
+  elements: readonly Block[];
+};
+
+export type TabNavigationBlock = LayoutBlockish<{
+  type: 'tab_navigation';
+  tabs: readonly TabItem[];
+}>;

packages/ui-kit/src/index.ts

@@ -34,6 +34,7 @@ export { InputBlock } from './blocks/layout/InputBlock';
 export { SectionBlock } from './blocks/layout/SectionBlock';
 export { VideoConferenceBlock } from './blocks/layout/VideoConferenceBlock';
 export { LayoutBlock } from './blocks/LayoutBlock';
+export { TabNavigationBlock } from './blocks/layout/TabNavigationBlock';
 
 export { InputElementDispatchAction } from './blocks/InputElementDispatchAction';