Move react-datepicker types into EUI (#1618)

* Move react-datepicker types into EUI

* changelog

* Re-added basic popper-based props that do not require popper dependency

CHANGELOG.md

@@ -11,6 +11,7 @@
 
 - `EuiBasicTable` select all shows up on mobile ([#1462](https://github.com/elastic/eui/pull/1462))
 - Adds missing `hasActiveFilters` prop for `EuiFilterButton` type and fixes `onChange` signature for `EuiButtonGroup` ([#1603](https://github.com/elastic/eui/pull/1603))
+- Included `react-datepicker` TS types in EUI itself to avoid outside dependency ([#1618](https://github.com/elastic/eui/pull/1618))
 - Prevent `EuiGlobalToastList` from attempting calculations on `null` DOM elements ([#1606](https://github.com/elastic/eui/pull/1606))
 
 **Breaking changes**

package.json

@@ -79,7 +79,6 @@
     "@types/enzyme": "^3.1.13",
     "@types/jest": "^24.0.6",
     "@types/react": "^16.8.4",
-    "@types/react-datepicker": "1.8.0",
     "@types/react-is": "~16.3.0",
     "@types/react-virtualized": "^9.18.6",
     "@types/uuid": "^3.4.4",

scripts/dtsgenerator.js

@@ -54,7 +54,7 @@ const generator = dtsGenerator({
         params.importedModuleId,
         {
           basedir: importFromBaseDir,
-          extensions: ['.ts', '.tsx'],
+          extensions: ['.ts', '.tsx', '.d.ts'],
         }
       );
 

src-docs/src/i18ntokens.json

@@ -5,11 +5,11 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 421,
+        "line": 432,
         "column": 10
       },
       "end": {
-        "line": 425,
+        "line": 436,
         "column": 12
       }
     },
@@ -21,12 +21,12 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 458,
-        "column": 10
+        "line": 468,
+        "column": 6
       },
       "end": {
-        "line": 458,
-        "column": 81
+        "line": 468,
+        "column": 77
       }
     },
     "filepath": "src/components/basic_table/basic_table.js"
@@ -37,11 +37,11 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 736,
+        "line": 769,
         "column": 8
       },
       "end": {
-        "line": 736,
+        "line": 769,
         "column": 79
       }
     },

src/components/date_picker/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { CommonProps } from '../common';
 import { IconType } from '../icon';
-import ReactDatePicker, { ReactDatePickerProps } from 'react-datepicker';
+import _ReactDatePicker, { ReactDatePickerProps as _ReactDatePickerProps } from './react-datepicker';
 import { Moment } from 'moment';
 
 declare module '@elastic/eui' {
@@ -17,12 +17,12 @@ declare module '@elastic/eui' {
     refreshInterval: number;
   }
 
-  interface EuiExtendedDatePickerProps extends ReactDatePickerProps {
+  interface EuiExtendedDatePickerProps extends _ReactDatePickerProps {
     fullWidth?: boolean;
     isInvalid?: boolean;
     isLoading?: boolean;
     injectTimes?: Moment[]; // added here because the type is missing in @types/[email protected]
-    inputRef?: React.Ref<typeof ReactDatePicker>;
+    inputRef?: React.Ref<typeof _ReactDatePicker>;
     placeholder?: string;
     shadow?: boolean;
     showIcon?: boolean;
@@ -73,4 +73,7 @@ declare module '@elastic/eui' {
   };
 
   export const EuiSuperDatePicker: React.SFC<EuiSuperDatePickerProps>;
+
+  export const ReactDatePicker: typeof _ReactDatePicker;
+  export const ReactDatePickerProps: _ReactDatePickerProps;
 }

src/components/date_picker/react-datepicker.d.ts

@@ -0,0 +1,102 @@
+// Type definitions for react-datepicker 1.8
+// Project: https://github.com/Hacker0x01/react-datepicker
+// Definitions by: Rajab Shakirov <https://github.com/radziksh>,
+//                 Andrey Balokha <https://github.com/andrewBalekha>,
+//                 Greg Smith <https://github.com/smrq>,
+//                 Platon Pronko <https://github.com/Rogach>
+//                 Roy Xue <https://github.com/royxue>
+//                 Koala Human <https://github.com/KoalaHuman>
+//                 Sean Kelley <https://github.com/seansfkelley>
+//                 Justin Grant <https://github.com/justingrant>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 2.8
+
+import * as React from "react";
+import * as moment from "moment";
+
+export interface ReactDatePickerProps {
+  adjustDateOnChange?: boolean;
+  allowSameDay?: boolean;
+  autoComplete?: string;
+  autoFocus?: boolean;
+  calendarClassName?: string;
+  children?: React.ReactNode;
+  className?: string;
+  customInput?: React.ReactNode;
+  customInputRef?: string;
+  dateFormat?: string | string[];
+  dateFormatCalendar?: string;
+  dayClassName?(date: moment.Moment): string | null;
+  disabled?: boolean;
+  disabledKeyboardNavigation?: boolean;
+  dropdownMode?: 'scroll' | 'select';
+  endDate?: moment.Moment;
+  excludeDates?: moment.Moment[];
+  excludeTimes?: moment.Moment[];
+  filterDate?(date: moment.Moment): boolean;
+  fixedHeight?: boolean;
+  forceShowMonthNavigation?: boolean;
+  formatWeekNumber?(date: moment.Moment): string | number;
+  highlightDates?: moment.Moment[];
+  id?: string;
+  includeDates?: moment.Moment[];
+  includeTimes?: moment.Moment[];
+  inline?: boolean;
+  isClearable?: boolean;
+  locale?: string;
+  maxDate?: moment.Moment;
+  maxTime?: moment.Moment;
+  minDate?: moment.Moment;
+  minTime?: moment.Moment;
+  monthsShown?: number;
+  name?: string;
+  onBlur?(event: React.FocusEvent<HTMLInputElement>): void;
+  onChange(date: moment.Moment | null, event: React.SyntheticEvent<any> | undefined): void;
+  onChangeRaw?(event: React.FocusEvent<HTMLInputElement>): void;
+  onClickOutside?(event: React.MouseEvent<HTMLDivElement>): void;
+  onFocus?(event: React.FocusEvent<HTMLInputElement>): void;
+  onKeyDown?(event: React.KeyboardEvent<HTMLDivElement>): void;
+  onMonthChange?(date: moment.Moment): void;
+  onSelect?(date: moment.Moment, event: React.SyntheticEvent<any> | undefined): void;
+  onWeekSelect?(firstDayOfWeek: moment.Moment, weekNumber: string | number, event: React.SyntheticEvent<any> | undefined): void;
+  onYearChange?(date: moment.Moment): void;
+  openToDate?: moment.Moment;
+  peekNextMonth?: boolean;
+  placeholderText?: string;
+  popperClassName?: string;
+  popperContainer?(props: { children: React.ReactNode[] }): React.ReactNode;
+  popperPlacement?: string;
+  preventOpenOnFocus?: boolean;
+  readOnly?: boolean;
+  required?: boolean;
+  scrollableMonthYearDropdown?: boolean;
+  scrollableYearDropdown?: boolean;
+  selected?: moment.Moment | null;
+  selectsEnd?: boolean;
+  selectsStart?: boolean;
+  shouldCloseOnSelect?: boolean;
+  showDisabledMonthNavigation?: boolean;
+  showMonthDropdown?: boolean;
+  showMonthYearDropdown?: boolean;
+  showTimeSelect?: boolean;
+  showTimeSelectOnly?: boolean;
+  showWeekNumbers?: boolean;
+  showYearDropdown?: boolean;
+  startDate?: moment.Moment;
+  startOpen?: boolean;
+  tabIndex?: number;
+  timeCaption?: string;
+  timeFormat?: string;
+  timeIntervals?: number;
+  title?: string;
+  todayButton?: string;
+  useShortMonthInDropdown?: boolean;
+  useWeekdaysShort?: boolean;
+  utcOffset?: number;
+  value?: string;
+  weekLabel?: string;
+  withPortal?: boolean;
+  yearDropdownItemNumber?: number;
+}
+declare const ReactDatePicker: React.ClassicComponentClass<ReactDatePickerProps>;
+export default ReactDatePicker;

yarn.lock

@@ -977,15 +977,6 @@
   resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.5.9.tgz#f2d14df87b0739041bc53a7d75e3d77d726a3ec0"
   integrity sha512-Nha5b+jmBI271jdTMwrHiNXM+DvThjHOfyZtMX9kj/c/LUj2xiLHsG/1L3tJ8DjAoQN48cHwUwtqBotjyXaSdQ==
 
-"@types/[email protected]":
-  version "1.8.0"
-  resolved "https://registry.yarnpkg.com/@types/react-datepicker/-/react-datepicker-1.8.0.tgz#b8b4f69d3e5398500c136f5338e0746ed98d46e8"
-  integrity sha512-QyHMOFCOFIkcyDCXUGnL7OyM+Gj2aG95d3t18wgrLTxQJseVQXeQFTVnUeXmmF2cZxeWtGTfRl1uYPTr3/rAFg==
-  dependencies:
-    "@types/react" "*"
-    moment ">=2.14.0"
-    popper.js "^1.14.1"
-
 "@types/react-is@~16.3.0":
   version "16.3.1"
   resolved "https://registry.yarnpkg.com/@types/react-is/-/react-is-16.3.1.tgz#f3e1dee9d0eb58c049825540cb061b5588022a9e"
@@ -9005,11 +8996,6 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.21.0.tgz#2a114b51d2a6ec9e6d83cf803f838a878d8a023a"
   integrity sha512-TCZ36BjURTeFTM/CwRcViQlfkMvL1/vFISuNLO5GkcVm1+QHfbSiNqZuWeMFjj1/3+uAjXswgRk30j1kkLYJBQ==
 
-moment@>=2.14.0:
-  version "2.24.0"
-  resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
-  integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
-
 moment@^2.20.1:
   version "2.20.1"
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.20.1.tgz#d6eb1a46cbcc14a2b2f9434112c1ff8907f313fd"
@@ -10359,11 +10345,6 @@ pngjs@~2.2.0:
   resolved "https://registry.yarnpkg.com/pngjs/-/pngjs-2.2.0.tgz#649663609a0ebab87c8f08b3fe724048b51d9d7f"
   integrity sha1-ZJZjYJoOurh8jwiz/nJASLUdnX8=
 
-popper.js@^1.14.1:
-  version "1.14.7"
-  resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.14.7.tgz#e31ec06cfac6a97a53280c3e55e4e0c860e7738e"
-  integrity sha512-4q1hNvoUre/8srWsH7hnoSJ5xVmIL4qgz+s4qf2TnJIMyZFUFMGH+9vE7mXynAlHSZ/NdTmmow86muD0myUkVQ==
-
 portfinder@^1.0.9:
   version "1.0.13"
   resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.13.tgz#bb32ecd87c27104ae6ee44b5a3ccbf0ebb1aede9"