EuiModal, EuiConfirmModal: converted to Typescript

CHANGELOG.md

@@ -1,5 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Converted `EuiModal` and `EuiConfirmModal` to TypeScript ([#2742](https://github.com/elastic/eui/pull/2742))
 - Fixed bug in `EuiCard` where button text was not properly aligned ([#2741](https://github.com/elastic/eui/pull/2741))
 - Converted `EuiRange` to TypeScript ([#2732](https://github.com/elastic/eui/pull/2732))
 - Converted `EuiDualRange` to TypeScript ([#2732](https://github.com/elastic/eui/pull/2732))

package.json

@@ -48,8 +48,8 @@
     "@types/lodash": "^4.14.116",
     "@types/numeral": "^0.0.25",
     "@types/react-beautiful-dnd": "^10.1.0",
-    "classnames": "^2.2.5",
     "chroma-js": "^2.0.4",
+    "classnames": "^2.2.5",
     "highlight.js": "^9.12.0",
     "html": "^1.0.0",
     "keymirror": "^0.1.1",

scripts/babel/proptypes-from-ts-props/index.js

@@ -1151,7 +1151,10 @@ const typeDefinitionExtractors = {
    */
   VariableDeclaration: node => {
     return node.declarations.reduce((declarations, declaration) => {
-      if (declaration.init.type === 'ObjectExpression') {
+      if (
+        declaration.init != null &&
+        declaration.init.type === 'ObjectExpression'
+      ) {
         declarations.push({
           name: declaration.id.name,
           definition: declaration.init,

scripts/babel/proptypes-from-ts-props/index.test.js

@@ -2613,6 +2613,18 @@ FooComponent.propTypes = {
       });
     });
 
+    describe('misc', () => {
+      it('supports non-initialized variable declarations', () => {
+        const result = transform(
+          `
+let something: any;
+`,
+          babelOptions
+        );
+
+        expect(result.code).toBe('let something;');
+      });
+    });
   });
 
   describe('remove types from exports', () => {

src/components/modal/__snapshots__/modal.test.tsx.snap

@@ -0,0 +1,53 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders EuiModal 1`] = `
+Array [
+  <div
+    data-focus-guard="true"
+    style="width:1px;height:0px;padding:0;overflow:hidden;position:fixed;top:1px;left:1px"
+    tabindex="0"
+  />,
+  <div
+    data-focus-guard="true"
+    style="width:1px;height:0px;padding:0;overflow:hidden;position:fixed;top:1px;left:1px"
+    tabindex="1"
+  />,
+  <div
+    data-focus-lock-disabled="false"
+  >
+    <div
+      aria-label="aria-label"
+      class="euiModal euiModal--maxWidth-default testClass1 testClass2"
+      data-test-subj="test subject string"
+      tabindex="0"
+    >
+      <button
+        aria-label="Closes this modal window"
+        class="euiButtonIcon euiButtonIcon--text euiModal__closeIcon"
+        type="button"
+      >
+        <svg
+          aria-hidden="true"
+          class="euiIcon euiIcon--medium euiIcon-isLoading euiButtonIcon__icon"
+          focusable="false"
+          height="16"
+          role="img"
+          viewBox="0 0 16 16"
+          width="16"
+          xmlns="http://www.w3.org/2000/svg"
+        />
+      </button>
+      <div
+        class="euiModal__flex"
+      >
+        children
+      </div>
+    </div>
+  </div>,
+  <div
+    data-focus-guard="true"
+    style="width:1px;height:0px;padding:0;overflow:hidden;position:fixed;top:1px;left:1px"
+    tabindex="0"
+  />,
+]
+`;