Converted EuiTableHeaderMobile to TS

CHANGELOG.md

@@ -1,13 +1,12 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
-No public interface changes since `9.8.0`.
+- Converted `EuiTableHeaderMobile` to TS ([#1786](https://github.com/elastic/eui/pull/1786))
 
 ## [`9.8.0`](https://github.com/elastic/eui/tree/v9.8.0)
 
 - **[Beta]** Added new `EuiSelectable` component  ([#1699](https://github.com/elastic/eui/pull/1699))
 - **[Beta]** Added new drag and drop components: `EuiDragDropContext`, `EuiDraggable`, and `EuiDroppable` ([#1733](https://github.com/elastic/eui/pull/1733))
 
-
 ## [`9.7.2`](https://github.com/elastic/eui/tree/v9.7.2)
 
 - Converted `EuiFormErrorText` to TS ([#1772](https://github.com/elastic/eui/pull/1772))

src/components/table/index.d.ts

@@ -1,4 +1,5 @@
 /// <reference path="./table_pagination/index.d.ts" />
+/// <reference path="./mobile/index.d.ts" />
 import { CommonProps, NoArgCallback } from '../common';
 import { IconType } from '../icon';
 import { HorizontalAlignment } from '../../services/alignment';

src/components/table/mobile/index.d.ts

@@ -0,0 +1 @@
+export { EuiTableHeaderMobile } from './table_header_mobile';

src/components/table/mobile/table_header_mobile.test.js → src/components/table/mobile/table_header_mobile.test.tsx

@@ -6,11 +6,8 @@ import { EuiTableHeaderMobile } from './table_header_mobile';
 
 describe('EuiTableHeaderMobile', () => {
   test('is rendered', () => {
-    const component = render(
-      <EuiTableHeaderMobile {...requiredProps} />
-    );
+    const component = render(<EuiTableHeaderMobile {...requiredProps} />);
 
-    expect(component)
-      .toMatchSnapshot();
+    expect(component).toMatchSnapshot();
   });
 });

src/components/table/mobile/table_header_mobile.tsx

@@ -0,0 +1,15 @@
+import React, { FunctionComponent, HTMLAttributes } from 'react';
+import classNames from 'classnames';
+import { CommonProps } from '../../common';
+
+export const EuiTableHeaderMobile: FunctionComponent<
+  CommonProps & HTMLAttributes<HTMLDivElement>
+> = ({ children, className, ...rest }) => {
+  const classes = classNames('euiTableHeaderMobile', className);
+
+  return (
+    <div className={classes} {...rest}>
+      {children}
+    </div>
+  );
+};