EuiTableHeaderCellCheckbox convert to TS

elastic · May 29, 2019 · e89d4b2 · e89d4b2
1 parent 0d3c199
commit e89d4b2
Show file tree

Hide file tree

Showing 6 changed files with 37 additions and 53 deletions.
diff --git a/src/components/basic_table/__snapshots__/basic_table.test.js.snap b/src/components/basic_table/__snapshots__/basic_table.test.js.snap
@@ -759,7 +759,6 @@ exports[`EuiBasicTable footers render with pagination, selection, sorting, and f
       <EuiTableHeader>
         <EuiTableHeaderCellCheckbox
           key="_selection_column_h"
-          scope="col"
           width="24px"
         >
           <EuiI18n
@@ -1769,7 +1768,6 @@ exports[`EuiBasicTable with pagination and selection 1`] = `
       <EuiTableHeader>
         <EuiTableHeaderCellCheckbox
           key="_selection_column_h"
-          scope="col"
           width="24px"
         >
           <EuiI18n
@@ -2082,7 +2080,6 @@ exports[`EuiBasicTable with pagination, selection and sorting 1`] = `
       <EuiTableHeader>
         <EuiTableHeaderCellCheckbox
           key="_selection_column_h"
-          scope="col"
           width="24px"
         >
           <EuiI18n
@@ -2274,7 +2271,6 @@ exports[`EuiBasicTable with pagination, selection, sorting and a single record a
       <EuiTableHeader>
         <EuiTableHeaderCellCheckbox
           key="_selection_column_h"
-          scope="col"
           width="24px"
         >
           <EuiI18n
@@ -2580,7 +2576,6 @@ exports[`EuiBasicTable with pagination, selection, sorting and column dataType 1
       <EuiTableHeader>
         <EuiTableHeaderCellCheckbox
           key="_selection_column_h"
-          scope="col"
           width="24px"
         >
           <EuiI18n
@@ -2772,7 +2767,6 @@ exports[`EuiBasicTable with pagination, selection, sorting and column renderer 1
       <EuiTableHeader>
         <EuiTableHeaderCellCheckbox
           key="_selection_column_h"
-          scope="col"
           width="24px"
         >
           <EuiI18n
@@ -2964,7 +2958,6 @@ exports[`EuiBasicTable with pagination, selection, sorting and multiple record a
       <EuiTableHeader>
         <EuiTableHeaderCellCheckbox
           key="_selection_column_h"
-          scope="col"
           width="24px"
         >
           <EuiI18n
@@ -3288,7 +3281,6 @@ exports[`EuiBasicTable with pagination, selection, sorting, column renderer and
       <EuiTableHeader>
         <EuiTableHeaderCellCheckbox
           key="_selection_column_h"
-          scope="col"
           width="24px"
         >
           <EuiI18n

diff --git a/..._/table_header_cell_checkbox.test.js.snap → .../table_header_cell_checkbox.test.tsx.snap b/..._/table_header_cell_checkbox.test.js.snap → .../table_header_cell_checkbox.test.tsx.snap
@@ -5,7 +5,6 @@ exports[`EuiTableHeaderCellCheckbox is rendered 1`] = `
   aria-label="aria-label"
   class="euiTableHeaderCellCheckbox testClass1 testClass2"
   data-test-subj="test subject string"
-  scope="col"
 >
   <div
     class="euiTableCellContent"

diff --git a/src/components/table/index.d.ts b/src/components/table/index.d.ts
@@ -3,6 +3,11 @@
 import { CommonProps, NoArgCallback } from '../common';
 import { IconType } from '../icon';
 import { HorizontalAlignment } from '../../services/alignment';
+import {
+  EuiTableHeaderCellCheckboxScope as TableHeaderCellCheckboxScope,
+  EuiTableHeaderCellCheckboxProps as TableHeaderCellCheckboxProps,
+  EuiTableHeaderCellCheckbox as TableHeaderCellCheckbox,
+} from './table_header_cell_checkbox';
 
 import {
   FunctionComponent,
@@ -101,22 +106,9 @@ declare module '@elastic/eui' {
    * @see './table_header_cell_checkbox.js'
    */
 
-  export type EuiTableHeaderCellCheckboxScope =
-    | 'col'
-    | 'row'
-    | 'colgroup'
-    | 'rowgroup';
-
-  export interface EuiTableHeaderCellCheckboxProps {
-    width?: string;
-    scope?: EuiTableHeaderCellCheckboxScope;
-  }
-
-  export const EuiTableHeaderCellCheckbox: FunctionComponent<
-    CommonProps &
-      TdHTMLAttributes<HTMLTableCellElement> &
-      EuiTableHeaderCellCheckboxProps
-  >;
+  export type EuiTableHeaderCellCheckboxScope = TableHeaderCellCheckboxScope;
+  export interface EuiTableHeaderCellCheckboxProps extends TableHeaderCellCheckboxProps {}
+  export const EuiTableHeaderCellCheckbox: typeof TableHeaderCellCheckbox;
 
   /**
    * table row type defs

diff --git a/src/components/table/table_header_cell_checkbox.js b/src/components/table/table_header_cell_checkbox.js
diff --git a/.../table/table_header_cell_checkbox.test.js → ...table/table_header_cell_checkbox.test.tsx b/.../table/table_header_cell_checkbox.test.js → ...table/table_header_cell_checkbox.test.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from 'enzyme';
-import { requiredProps } from '../../test/required_props';
+import { requiredProps } from '../../test';
 
 import { EuiTableHeaderCellCheckbox } from './table_header_cell_checkbox';
 

diff --git a/src/components/table/table_header_cell_checkbox.tsx b/src/components/table/table_header_cell_checkbox.tsx
@@ -0,0 +1,28 @@
+import React, { FunctionComponent, TdHTMLAttributes } from 'react';
+import classNames from 'classnames';
+import { CommonProps } from '../common';
+
+export type EuiTableHeaderCellCheckboxScope =
+  | 'col'
+  | 'row'
+  | 'colgroup'
+  | 'rowgroup';
+
+export interface EuiTableHeaderCellCheckboxProps {
+  width?: string;
+  scope?: EuiTableHeaderCellCheckboxScope;
+}
+
+export const EuiTableHeaderCellCheckbox: FunctionComponent<
+  CommonProps &
+    TdHTMLAttributes<HTMLTableCellElement> &
+    EuiTableHeaderCellCheckboxProps
+> = ({ children, className, ...rest }) => {
+  const classes = classNames('euiTableHeaderCellCheckbox', className);
+
+  return (
+    <th className={classes} {...rest}>
+      <div className="euiTableCellContent">{children}</div>
+    </th>
+  );
+};