From 8e353543d4fb3176e3101267aeef83e0a8324adb Mon Sep 17 00:00:00 2001 From: Ken Date: Fri, 15 Feb 2019 12:55:21 -0800 Subject: [PATCH] swapped step2-01 to TS focused, and moved onto latest OUFR to take stack from there --- package-lock.json | 216 ++++++++------------- package.json | 5 +- playground/src/components/TodoApp.tsx | 2 +- playground/src/components/TodoFooter.tsx | 5 +- playground/src/components/TodoHeader.tsx | 4 +- playground/src/components/TodoList.tsx | 2 +- playground/src/components/TodoListItem.tsx | 3 +- step2-01/src/async/index.ts | 0 step2-01/src/components/TodoApp.tsx | 87 --------- step2-01/src/components/TodoFooter.tsx | 22 --- step2-01/src/components/TodoHeader.tsx | 59 ------ step2-01/src/components/TodoList.tsx | 29 --- step2-01/src/components/TodoListItem.tsx | 88 --------- step2-01/src/generics/index.ts | 0 step2-01/src/index.tsx | 20 +- step2-01/src/interfaces/index.ts | 0 step2-01/src/modules/default.ts | 3 + step2-01/src/modules/index.ts | 14 ++ step2-01/src/modules/named.ts | 9 + step2-01/src/store/index.ts | 14 -- step2-01/src/types/index.ts | 0 step2-02/src/components/TodoApp.tsx | 2 +- step2-02/src/components/TodoFooter.tsx | 3 +- step2-02/src/components/TodoHeader.tsx | 3 +- step2-02/src/components/TodoList.tsx | 2 +- step2-02/src/components/TodoListItem.tsx | 3 +- tsconfig.json | 6 +- webpack.config.js | 2 +- 28 files changed, 142 insertions(+), 461 deletions(-) create mode 100644 step2-01/src/async/index.ts delete mode 100644 step2-01/src/components/TodoApp.tsx delete mode 100644 step2-01/src/components/TodoFooter.tsx delete mode 100644 step2-01/src/components/TodoHeader.tsx delete mode 100644 step2-01/src/components/TodoList.tsx delete mode 100644 step2-01/src/components/TodoListItem.tsx create mode 100644 step2-01/src/generics/index.ts create mode 100644 step2-01/src/interfaces/index.ts create mode 100644 step2-01/src/modules/default.ts create mode 100644 step2-01/src/modules/index.ts create mode 100644 step2-01/src/modules/named.ts delete mode 100644 step2-01/src/store/index.ts create mode 100644 step2-01/src/types/index.ts diff --git a/package-lock.json b/package-lock.json index 96ed139..62799b8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -33,9 +33,9 @@ } }, "@microsoft/load-themed-styles": { - "version": "1.8.54", - "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.8.54.tgz", - "integrity": "sha512-AjburzIHn1IWeraJ3KkV79pGyH7No4A/CqNXO2c9S78BqIMvKs9sHkx0MkMdrrWDHhBKzjfGHzGANl0E6umswQ==" + "version": "1.8.59", + "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.8.59.tgz", + "integrity": "sha512-FbOAj3EaGgexBGUKvvGRHzsDEmtlbCvgnqhkX754Oh7lDCX2RSjg080nM1TW/rOPYDZReixeyC0uO541Rt9w6Q==" }, "@types/body-parser": { "version": "1.17.0", @@ -79,9 +79,9 @@ } }, "@types/d3-path": { - "version": "1.0.7", - "resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-1.0.7.tgz", - "integrity": "sha512-U8dFRG+8WhkLJr2sxZ9Cw/5WeRgBnNqMxGdA1+Z0+ZG6tK0s75OQ4OXnxeyfKuh6E4wQPY8OAKr1+iNDx01BEQ==" + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-1.0.8.tgz", + "integrity": "sha512-AZGHWslq/oApTAHu9+yH/Bnk63y9oFOMROtqPAtxl5uB6qm1x2lueWdVEjsjjV3Qc2+QfuzKIwIR5MvVBakfzA==" }, "@types/d3-scale": { "version": "2.0.0", @@ -97,22 +97,22 @@ "integrity": "sha512-1SJhi3kTk/SHHIE6XkHuHU2REYkbSOjkQuo3HT71FOTs8/tjeGcvtXMsX4N3kU1UE1nVG+A5pg7TSjuJ4zUN3A==" }, "@types/d3-shape": { - "version": "1.2.8", - "resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-1.2.8.tgz", - "integrity": "sha512-eHAi4Nuw1/69hjBFNXNWYifcNTFhwy360PI969ssMX22Si9henYiNKLeJoBhNfyXFajeFjI1HGsYzyCWKOozdA==", + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-1.3.1.tgz", + "integrity": "sha512-usqdvUvPJ7AJNwpd2drOzRKs1ELie53p2m2GnPKr076/ADM579jVTJ5dPsoZ5E/CMNWk8lvPWYQSvilpp6jjwg==", "requires": { "@types/d3-path": "*" } }, "@types/d3-time": { - "version": "1.0.9", - "resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-1.0.9.tgz", - "integrity": "sha512-m+D4NbQdDlTVaO7QgXAnatR3IDxQYDMBtRhgSCi5rs9R1LPq1y7/2aqa1FJ2IWjFm1mOV63swDxonnCDlHgHMA==" + "version": "1.0.10", + "resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-1.0.10.tgz", + "integrity": "sha512-aKf62rRQafDQmSiv1NylKhIMmznsjRN+MnXRXTqHoqm0U/UZzVpdrtRnSIfdiLS616OuC1soYeX1dBg2n1u8Xw==" }, "@types/d3-time-format": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@types/d3-time-format/-/d3-time-format-2.1.0.tgz", - "integrity": "sha512-/myT3I7EwlukNOX2xVdMzb8FRgNzRMpsZddwst9Ld/VFe6LyJyRp0s32l/V9XoUzk+Gqu56F/oGk6507+8BxrA==" + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/@types/d3-time-format/-/d3-time-format-2.1.1.tgz", + "integrity": "sha512-tJSyXta8ZyJ52wDDHA96JEsvkbL6jl7wowGmuf45+fAkj5Y+SQOnz0N7/H68OWmPshPsAaWMQh+GAws44IzH3g==" }, "@types/express": { "version": "4.16.1", @@ -223,37 +223,20 @@ } }, "@uifabric/azure-themes": { - "version": "0.1.1", - "resolved": "https://registry.npmjs.org/@uifabric/azure-themes/-/azure-themes-0.1.1.tgz", - "integrity": "sha512-WbP1LYK9Fnho4eKb8ISTBYcoJFDfpCikRWTyEYMeRyp3ZsxpNycD5uQuBLNAKYMDhKwMj7VxXZpV6I7/Sj/8yA==", + "version": "0.1.5", + "resolved": "https://registry.npmjs.org/@uifabric/azure-themes/-/azure-themes-0.1.5.tgz", + "integrity": "sha512-KCxnqpn+KtjLzNKAXYAC3Zs3PBsGqHUBb0oAIH8iaG+4RY5Y/kkD6M0LCuD1owpssfvqWwEug6eW3gA06GtJyQ==", "requires": { - "@uifabric/merge-styles": ">=6.15.0 <7.0.0", + "@uifabric/merge-styles": ">=6.15.2 <7.0.0", "@uifabric/set-version": ">=1.1.3 <2.0.0", - "office-ui-fabric-react": ">=6.129.0 <7.0.0", + "office-ui-fabric-react": ">=6.132.0 <7.0.0", "tslib": "^1.7.1" - }, - "dependencies": { - "office-ui-fabric-react": { - "version": "6.129.1", - "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-6.129.1.tgz", - "integrity": "sha512-PuQne4hdA/9K54925ycADght3uEJHhTEfBoquna1kCdjOgVflNc/GDzhMFidAVKryHUhbeFky+Tnm8039PeY+w==", - "requires": { - "@microsoft/load-themed-styles": "^1.7.13", - "@uifabric/icons": ">=6.3.0 <7.0.0", - "@uifabric/merge-styles": ">=6.15.0 <7.0.0", - "@uifabric/set-version": ">=1.1.3 <2.0.0", - "@uifabric/styling": ">=6.41.0 <7.0.0", - "@uifabric/utilities": ">=6.28.0 <7.0.0", - "prop-types": "^15.5.10", - "tslib": "^1.7.1" - } - } } }, "@uifabric/charting": { - "version": "0.28.5", - "resolved": "https://registry.npmjs.org/@uifabric/charting/-/charting-0.28.5.tgz", - "integrity": "sha512-iFwuoFUQoS6H6paxrRsVCxQnw2SqnxhS+EBh54Gb3A6HxS2IKzGAE5c4tnZcqjXNPxXTvXgt5iQg3xycIa95cg==", + "version": "0.28.7", + "resolved": "https://registry.npmjs.org/@uifabric/charting/-/charting-0.28.7.tgz", + "integrity": "sha512-JWQOcUGQpSxunTOiVmWqOqDYk1vuyK/8EHmhGrs2Imm1aArSCROVwJ8xiMzgF3x15OWJIu8uZdLnrhAcmuLehA==", "requires": { "@microsoft/load-themed-styles": "^1.7.13", "@types/d3-array": "1.2.1", @@ -270,50 +253,33 @@ "d3-selection": "1.3.0", "d3-shape": "^1.2.0", "d3-time-format": "^2.1.3", - "office-ui-fabric-react": ">=6.121.0 <7.0.0", + "office-ui-fabric-react": ">=6.139.0 <7.0.0", "prop-types": "^15.5.10", "tslib": "^1.7.1" } }, "@uifabric/experiments": { - "version": "6.51.1", - "resolved": "https://registry.npmjs.org/@uifabric/experiments/-/experiments-6.51.1.tgz", - "integrity": "sha512-fPC+DnDsF63/PPbQgKfx0i65DZHiCpVq5RgGKZv0aro8uUuDST6DVgtB9SZcvuLWBYOacJBCe9ucrRRVVzdtUQ==", + "version": "6.57.0", + "resolved": "https://registry.npmjs.org/@uifabric/experiments/-/experiments-6.57.0.tgz", + "integrity": "sha512-jA787O630Vcgme1hkWfvMpxht1nY/+Xe3k1EoFnexHBgINorxap5VXYBIQygc8x84DmODgvxOaDP9XsewDIdFQ==", "requires": { "@microsoft/load-themed-styles": "^1.7.13", - "@uifabric/azure-themes": ">=0.1.1 <1.0.0", - "@uifabric/charting": "^0.28.5", + "@uifabric/azure-themes": ">=0.1.5 <1.0.0", + "@uifabric/charting": "^0.28.7", "@uifabric/file-type-icons": ">=6.4.1 <7.0.0", - "@uifabric/fluent-theme": ">=0.13.2 <1.0.0", - "@uifabric/foundation": ">=0.6.0 <1.0.0", + "@uifabric/fluent-theme": ">=0.14.1 <1.0.0", + "@uifabric/foundation": ">=0.7.1 <1.0.0", "@uifabric/icons": ">=6.3.0 <7.0.0", - "@uifabric/merge-styles": ">=6.15.0 <7.0.0", + "@uifabric/merge-styles": ">=6.15.2 <7.0.0", "@uifabric/set-version": ">=1.1.3 <2.0.0", "@uifabric/styling": ">=6.41.0 <7.0.0", "@uifabric/theme-samples": ">=0.1.4 <1.0.0", - "@uifabric/utilities": ">=6.28.0 <7.0.0", + "@uifabric/utilities": ">=6.29.1 <7.0.0", "@uifabric/variants": ">=6.14.0 <7.0.0", "deep-assign": "^2.0.0", - "office-ui-fabric-react": ">=6.129.0 <7.0.0", + "office-ui-fabric-react": ">=6.140.0 <7.0.0", "prop-types": "^15.5.10", "tslib": "^1.7.1" - }, - "dependencies": { - "office-ui-fabric-react": { - "version": "6.129.1", - "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-6.129.1.tgz", - "integrity": "sha512-PuQne4hdA/9K54925ycADght3uEJHhTEfBoquna1kCdjOgVflNc/GDzhMFidAVKryHUhbeFky+Tnm8039PeY+w==", - "requires": { - "@microsoft/load-themed-styles": "^1.7.13", - "@uifabric/icons": ">=6.3.0 <7.0.0", - "@uifabric/merge-styles": ">=6.15.0 <7.0.0", - "@uifabric/set-version": ">=1.1.3 <2.0.0", - "@uifabric/styling": ">=6.41.0 <7.0.0", - "@uifabric/utilities": ">=6.28.0 <7.0.0", - "prop-types": "^15.5.10", - "tslib": "^1.7.1" - } - } } }, "@uifabric/file-type-icons": { @@ -327,26 +293,26 @@ } }, "@uifabric/fluent-theme": { - "version": "0.13.2", - "resolved": "https://registry.npmjs.org/@uifabric/fluent-theme/-/fluent-theme-0.13.2.tgz", - "integrity": "sha512-iAuzjYALgKPYvwEsg00mTeVlMS39Gr6h1vVsYCR88nw7y/ep74Ex7yqFAO51pjCMFSCWyPHQ3Ukhp+lUvVZheQ==", + "version": "0.14.1", + "resolved": "https://registry.npmjs.org/@uifabric/fluent-theme/-/fluent-theme-0.14.1.tgz", + "integrity": "sha512-HQZxnpcSMejMES2uuw4iFgjVAFWbjatxuYEho0sb7NXWEeCO9JME2MKJJ1XWM4/G4tul8sKByMX4NoDss4OSPA==", "requires": { - "@uifabric/merge-styles": ">=6.15.0 <7.0.0", + "@uifabric/merge-styles": ">=6.15.2 <7.0.0", "@uifabric/set-version": ">=1.1.3 <2.0.0", - "@uifabric/styling": ">=6.40.0 <7.0.0", + "@uifabric/styling": ">=6.41.0 <7.0.0", "@uifabric/variants": ">=6.14.0 <7.0.0", - "office-ui-fabric-react": ">=6.123.0 <7.0.0", + "office-ui-fabric-react": ">=6.139.1 <7.0.0", "tslib": "^1.7.1" } }, "@uifabric/foundation": { - "version": "0.6.0", - "resolved": "https://registry.npmjs.org/@uifabric/foundation/-/foundation-0.6.0.tgz", - "integrity": "sha512-vEjgu8Spv6E4b+NFuQrv7wRLFQJg5e10Tea1J5N0pAYqwYztyefVZtbHmREx1gVE8TxpPfa1PnJy+MVEPVKyxA==", + "version": "0.7.1", + "resolved": "https://registry.npmjs.org/@uifabric/foundation/-/foundation-0.7.1.tgz", + "integrity": "sha512-YrdaJXAe4x7whaj7/x1fhFsBGao0vAec6mVIAYCvC09AK+puEYDahIloVWA6vLTRlWzzOZWsvN3S3Z1tzfhIRw==", "requires": { "@uifabric/set-version": ">=1.1.3 <2.0.0", - "@uifabric/styling": ">=6.39.0 <7.0.0", - "@uifabric/utilities": ">=6.27.0 <7.0.0", + "@uifabric/styling": ">=6.41.0 <7.0.0", + "@uifabric/utilities": ">=6.29.0 <7.0.0", "tslib": "^1.7.1" } }, @@ -361,9 +327,9 @@ } }, "@uifabric/merge-styles": { - "version": "6.15.0", - "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-6.15.0.tgz", - "integrity": "sha512-VtwdCPhEkfNk8l9qSw2Ix/R7a3/GguvQ2avR5RxLs7jSMmW2Oc3B0CwROB6h4zajwZK7OBR+a6UsiT7H6VN4vg==", + "version": "6.15.2", + "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-6.15.2.tgz", + "integrity": "sha512-ES/9vqHy69Do5oIDFNCJGWVRSCgXEuj/4MSZt7Rw8LCvslkeh2bYsyZh9banqDazqREWvHrPrDCaKvDzEuakTA==", "requires": { "@uifabric/set-version": ">=1.1.3 <2.0.0", "tslib": "^1.7.1" @@ -401,11 +367,11 @@ } }, "@uifabric/utilities": { - "version": "6.28.0", - "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-6.28.0.tgz", - "integrity": "sha512-HHC4J7L9UQcV5rNe0YlmW8mCswLTTPvO/SdfCU4alMrkkmrOAB/Z1OSryvIcXnLLPlqmnyoW2PwXyQrO5nBl0Q==", + "version": "6.29.1", + "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-6.29.1.tgz", + "integrity": "sha512-OJ0an/Sb4KYwJLACVtNlmndG/40LrrAgKQwkH5Z5eyyfsvSeEQNKYJnVwam6rAtKs3I+m8udBYw+TV140gMJgA==", "requires": { - "@uifabric/merge-styles": ">=6.15.0 <7.0.0", + "@uifabric/merge-styles": ">=6.15.2 <7.0.0", "@uifabric/set-version": ">=1.1.3 <2.0.0", "prop-types": "^15.5.10", "tslib": "^1.7.1" @@ -2219,17 +2185,17 @@ "integrity": "sha512-qgpUOg9tl5CirdqESUAu0t9MU/t3O9klYfGfyKsXEmhyxyzLpzpeh08gaxBUTQw1uXIOkr/30Ut2YRjSSxlmHA==" }, "d3-shape": { - "version": "1.2.2", - "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-1.2.2.tgz", - "integrity": "sha512-hUGEozlKecFZ2bOSNt7ENex+4Tk9uc/m0TtTEHBvitCBxUNjhzm5hS2GrrVRD/ae4IylSmxGeqX5tWC2rASMlQ==", + "version": "1.3.4", + "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-1.3.4.tgz", + "integrity": "sha512-izaz4fOpOnY3CD17hkZWNxbaN70sIGagLR/5jb6RS96Y+6VqX+q1BQf1av6QSBRdfULi3Gb8Js4CzG4+KAPjMg==", "requires": { "d3-path": "1" } }, "d3-time": { - "version": "1.0.10", - "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-1.0.10.tgz", - "integrity": "sha512-hF+NTLCaJHF/JqHN5hE8HVGAXPStEq6/omumPE/SxyHVrR7/qQxusFDo0t0c/44+sCGHthC7yNGFZIEgju0P8g==" + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-1.0.11.tgz", + "integrity": "sha512-Z3wpvhPLW4vEScGeIMUckDW7+3hWKOQfAWg/U7PlWBnQmeKQ00gCUsTtWSYulrKNA7ta8hJ+xXc6MHrMuITwEw==" }, "d3-time-format": { "version": "2.1.3", @@ -3389,8 +3355,7 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "aproba": { "version": "1.2.0", @@ -3411,14 +3376,12 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, - "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -3433,20 +3396,17 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "core-util-is": { "version": "1.0.2", @@ -3563,8 +3523,7 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "ini": { "version": "1.3.5", @@ -3576,7 +3535,6 @@ "version": "1.0.0", "bundled": true, "dev": true, - "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -3591,7 +3549,6 @@ "version": "3.0.4", "bundled": true, "dev": true, - "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -3599,14 +3556,12 @@ "minimist": { "version": "0.0.8", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "minipass": { "version": "2.3.5", "bundled": true, "dev": true, - "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -3625,7 +3580,6 @@ "version": "0.5.1", "bundled": true, "dev": true, - "optional": true, "requires": { "minimist": "0.0.8" } @@ -3706,8 +3660,7 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "object-assign": { "version": "4.1.1", @@ -3719,7 +3672,6 @@ "version": "1.4.0", "bundled": true, "dev": true, - "optional": true, "requires": { "wrappy": "1" } @@ -3805,8 +3757,7 @@ "safe-buffer": { "version": "5.1.2", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "safer-buffer": { "version": "2.1.2", @@ -3842,7 +3793,6 @@ "version": "1.0.2", "bundled": true, "dev": true, - "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -3862,7 +3812,6 @@ "version": "3.0.1", "bundled": true, "dev": true, - "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -3906,14 +3855,12 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true, - "optional": true + "dev": true }, "yallist": { "version": "3.0.3", "bundled": true, - "dev": true, - "optional": true + "dev": true } } }, @@ -4125,9 +4072,9 @@ "dev": true }, "handlebars": { - "version": "4.0.12", - "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.12.tgz", - "integrity": "sha512-RhmTekP+FZL+XNhwS1Wf+bTTZpdLougwt5pcgA1tuz6Jcx0fpH/7z0qd71RKnZHBCxIRBHfBOnio4gViPemNzA==", + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.1.0.tgz", + "integrity": "sha512-l2jRuU1NAWK6AW5qqcTATWQJvNPEwkM7NEKSiv/gqOsoSQbVoWyqVEY5GS+XPQ88zLNmqASRpzfdm8d79hJS+w==", "dev": true, "requires": { "async": "^2.5.0", @@ -4137,12 +4084,12 @@ }, "dependencies": { "async": { - "version": "2.6.1", - "resolved": "https://registry.npmjs.org/async/-/async-2.6.1.tgz", - "integrity": "sha512-fNEiL2+AZt6AlAw/29Cr0UDe4sRAHCpEHh54WMz+Bb7QfNcFw4h3loofyJpLeQs4Yx7yuqu/2dLgM5hKOs6HlQ==", + "version": "2.6.2", + "resolved": "https://registry.npmjs.org/async/-/async-2.6.2.tgz", + "integrity": "sha512-H1qVYh1MYhEEFLsP97cVKqCGo7KfCyTt6uEWqsTBr9SO84oK9Uwbyd/yCW+6rKJLHksBNUVWZDAjfS+Ccx0Bbg==", "dev": true, "requires": { - "lodash": "^4.17.10" + "lodash": "^4.17.11" } }, "source-map": { @@ -7232,16 +7179,17 @@ "dev": true }, "office-ui-fabric-react": { - "version": "6.128.0", - "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-6.128.0.tgz", - "integrity": "sha512-IRZ1tmX91K9EAyPX5jQAo80O0GUhEAz65+v0v1xf6d2LYB7PFW4MQJvt8MpLGSUJJghUZe0Lnmt4F77oLTt+JQ==", + "version": "6.140.0", + "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-6.140.0.tgz", + "integrity": "sha512-fYW9LnB+JYCCHC56gtA1T6wIj3owElLaiYwlJuRmve7MU/1u73cxCLhKfBojXcD9cK+aIsjYMN/IJCJga119Zg==", "requires": { "@microsoft/load-themed-styles": "^1.7.13", + "@uifabric/foundation": ">=0.7.1 <1.0.0", "@uifabric/icons": ">=6.3.0 <7.0.0", - "@uifabric/merge-styles": ">=6.15.0 <7.0.0", + "@uifabric/merge-styles": ">=6.15.2 <7.0.0", "@uifabric/set-version": ">=1.1.3 <2.0.0", "@uifabric/styling": ">=6.41.0 <7.0.0", - "@uifabric/utilities": ">=6.28.0 <7.0.0", + "@uifabric/utilities": ">=6.29.1 <7.0.0", "prop-types": "^15.5.10", "tslib": "^1.7.1" } diff --git a/package.json b/package.json index 893f5ca..7415989 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,6 @@ "main": "index.js", "scripts": { "start:client": "webpack-dev-server --mode development --progress --open", - "build": "webpack --mode production", "test": "jest --watch", "start:server": "nodemon -w server server/index.js", "start": "run-p start:server start:client" @@ -41,10 +40,10 @@ "uuid": "^3.3.2" }, "dependencies": { - "@uifabric/experiments": "^6.51.1", + "@uifabric/experiments": "^6.57.0", "express": "^4.16.4", "immer": "^1.12.1", - "office-ui-fabric-react": "^6.128.0", + "office-ui-fabric-react": "^6.140.0", "react": "^16.7.0", "react-dom": "^16.7.0", "react-redux": "^6.0.0", diff --git a/playground/src/components/TodoApp.tsx b/playground/src/components/TodoApp.tsx index 82a6530..c297d13 100644 --- a/playground/src/components/TodoApp.tsx +++ b/playground/src/components/TodoApp.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Stack } from '@uifabric/experiments'; +import { Stack } from 'office-ui-fabric-react'; import { TodoFooter } from './TodoFooter'; import { TodoHeader } from './TodoHeader'; import { TodoList } from './TodoList'; diff --git a/playground/src/components/TodoFooter.tsx b/playground/src/components/TodoFooter.tsx index eca19d4..fa0a9c3 100644 --- a/playground/src/components/TodoFooter.tsx +++ b/playground/src/components/TodoFooter.tsx @@ -1,6 +1,7 @@ import React from 'react'; -import { Text, Stack } from '@uifabric/experiments'; -import { TodoItem, Store } from '../store'; +import { Text } from '@uifabric/experiments'; +import { Stack } from 'office-ui-fabric-react'; +import { Store } from '../store'; import { DefaultButton } from 'office-ui-fabric-react'; import { actionsWithService } from '../actions'; import { connect } from 'react-redux'; diff --git a/playground/src/components/TodoHeader.tsx b/playground/src/components/TodoHeader.tsx index 71e4d15..79a5648 100644 --- a/playground/src/components/TodoHeader.tsx +++ b/playground/src/components/TodoHeader.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { Text, Stack } from '@uifabric/experiments'; -import { Pivot, PivotItem, TextField } from 'office-ui-fabric-react'; +import { Text } from '@uifabric/experiments'; +import { Pivot, PivotItem, TextField, Stack } from 'office-ui-fabric-react'; import { FilterTypes, Store } from '../store'; import { actionsWithService, actions } from '../actions'; import { connect } from 'react-redux'; diff --git a/playground/src/components/TodoList.tsx b/playground/src/components/TodoList.tsx index 73cb6f2..c80d9c0 100644 --- a/playground/src/components/TodoList.tsx +++ b/playground/src/components/TodoList.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Stack } from '@uifabric/experiments'; +import { Stack } from 'office-ui-fabric-react'; import { TodoListItem } from './TodoListItem'; import { Store } from '../store'; import { connect } from 'react-redux'; diff --git a/playground/src/components/TodoListItem.tsx b/playground/src/components/TodoListItem.tsx index f296c58..c8132cf 100644 --- a/playground/src/components/TodoListItem.tsx +++ b/playground/src/components/TodoListItem.tsx @@ -1,6 +1,5 @@ import React from 'react'; -import { Stack } from '@uifabric/experiments'; -import { Checkbox, IconButton, TextField } from 'office-ui-fabric-react'; +import { Stack, Checkbox, IconButton, TextField } from 'office-ui-fabric-react'; import { mergeStyles } from '@uifabric/styling'; import { Store } from '../store'; import { actionsWithService } from '../actions'; diff --git a/step2-01/src/async/index.ts b/step2-01/src/async/index.ts new file mode 100644 index 0000000..e69de29 diff --git a/step2-01/src/components/TodoApp.tsx b/step2-01/src/components/TodoApp.tsx deleted file mode 100644 index 9966c46..0000000 --- a/step2-01/src/components/TodoApp.tsx +++ /dev/null @@ -1,87 +0,0 @@ -import React from 'react'; -import { Stack } from '@uifabric/experiments'; -import { TodoFooter } from './TodoFooter'; -import { TodoHeader } from './TodoHeader'; -import { TodoList } from './TodoList'; -import { Store } from '../store'; - -let index = 0; - -export class TodoApp extends React.Component { - constructor(props) { - super(props); - this.state = { - todos: {}, - filter: 'all' - }; - } - render() { - const { filter, todos } = this.state; - return ( - - - - - - - - ); - } - - private _addTodo = label => { - const { todos } = this.state; - const id = index++; - - this.setState({ - todos: { ...todos, [id]: { label } } - }); - }; - - private _remove = id => { - const newTodos = { ...this.state.todos }; - delete newTodos[id]; - - this.setState({ - todos: newTodos - }); - }; - - private _complete = id => { - const newTodos = { ...this.state.todos }; - newTodos[id].completed = !newTodos[id].completed; - - this.setState({ - todos: newTodos - }); - }; - - private _edit = (id, label) => { - const newTodos = { ...this.state.todos }; - newTodos[id] = { ...newTodos[id], label }; - - this.setState({ - todos: newTodos - }); - }; - - private _clear = () => { - const { todos } = this.state; - const newTodos = {}; - - Object.keys(this.state.todos).forEach(id => { - if (!todos[id].completed) { - newTodos[id] = todos[id]; - } - }); - - this.setState({ - todos: newTodos - }); - }; - - private _setFilter = filter => { - this.setState({ - filter: filter - }); - }; -} diff --git a/step2-01/src/components/TodoFooter.tsx b/step2-01/src/components/TodoFooter.tsx deleted file mode 100644 index 54129c1..0000000 --- a/step2-01/src/components/TodoFooter.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import React from 'react'; -import { Text, Stack } from '@uifabric/experiments'; -import { Store } from '../store'; -import { DefaultButton } from 'office-ui-fabric-react'; - -interface TodoFooterProps { - clear: () => void; - todos: Store['todos']; -} - -export const TodoFooter = (props: TodoFooterProps) => { - const itemCount = Object.keys(props.todos).filter(id => !props.todos[id].completed).length; - - return ( - - - {itemCount} item{itemCount > 1 ? 's' : ''} left - - props.clear()}>Clear Completed - - ); -}; diff --git a/step2-01/src/components/TodoHeader.tsx b/step2-01/src/components/TodoHeader.tsx deleted file mode 100644 index 45c4507..0000000 --- a/step2-01/src/components/TodoHeader.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import React from 'react'; -import { Text, Stack } from '@uifabric/experiments'; -import { Pivot, PivotItem, TextField } from 'office-ui-fabric-react'; -import { FilterTypes } from '../store'; - -interface TodoHeaderProps { - addTodo: (label: string) => void; - setFilter: (filter: FilterTypes) => void; - filter: FilterTypes; -} - -interface TodoHeaderState { - labelInput: string; -} - -export class TodoHeader extends React.Component { - constructor(props: TodoHeaderProps) { - super(props); - this.state = { labelInput: undefined }; - } - - onKeyPress = (evt: React.KeyboardEvent) => { - if (evt.charCode === 13) { - this.props.addTodo(this.state.labelInput); - this.setState({ labelInput: undefined }); - } - }; - - onChange = (evt: React.FormEvent, newValue: string) => { - this.setState({ labelInput: newValue }); - }; - - onFilter = (item: PivotItem) => { - this.props.setFilter(item.props.headerText as FilterTypes); - }; - - render() { - return ( - - - todos - - - - - - - - - - - ); - } -} diff --git a/step2-01/src/components/TodoList.tsx b/step2-01/src/components/TodoList.tsx deleted file mode 100644 index 0e10b82..0000000 --- a/step2-01/src/components/TodoList.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import React from 'react'; -import { Stack } from '@uifabric/experiments'; -import { TodoListItem } from './TodoListItem'; -import { Store, FilterTypes } from '../store'; - -interface TodoListProps { - complete: (id: string) => void; - remove: (id: string) => void; - todos: Store['todos']; - filter: FilterTypes; - edit: (id: string, label: string) => void; -} - -export class TodoList extends React.Component { - render() { - const { filter, todos, complete, remove, edit } = this.props; - const filteredTodos = Object.keys(todos).filter(id => { - return filter === 'all' || (filter === 'completed' && todos[id].completed) || (filter === 'active' && !todos[id].completed); - }); - - return ( - - {filteredTodos.map(id => ( - - ))} - - ); - } -} diff --git a/step2-01/src/components/TodoListItem.tsx b/step2-01/src/components/TodoListItem.tsx deleted file mode 100644 index 42face0..0000000 --- a/step2-01/src/components/TodoListItem.tsx +++ /dev/null @@ -1,88 +0,0 @@ -import React from 'react'; -import { Stack } from '@uifabric/experiments'; -import { Checkbox, IconButton, TextField } from 'office-ui-fabric-react'; -import { mergeStyles } from '@uifabric/styling'; -import { Store } from '../store'; - -interface TodoListItemProps { - id: string; - todos: Store['todos']; - remove: (id: string) => void; - complete: (id: string) => void; - edit: (id: string, label: string) => void; -} - -interface TodoListItemState { - editing: boolean; - editLabel: string; -} - -const className = mergeStyles({ - selectors: { - '.clearButton': { - visibility: 'hidden' - }, - '&:hover .clearButton': { - visibility: 'visible' - } - } -}); - -export class TodoListItem extends React.Component { - /** - * - */ - constructor(props: TodoListItemProps) { - super(props); - this.state = { editing: false, editLabel: undefined }; - } - - onEdit = () => { - const { todos, id } = this.props; - const { label } = todos[id]; - - this.setState(prevState => ({ - editing: true, - editLabel: prevState.editLabel || label - })); - }; - - onDoneEdit = () => { - this.props.edit(this.props.id, this.state.editLabel); - this.setState(prevState => ({ - editing: false, - editLabel: undefined - })); - }; - - onKeyDown = (evt: React.KeyboardEvent) => { - if (evt.which === 13) { - this.onDoneEdit(); - } - }; - - onChange = (evt: React.FormEvent, newValue: string) => { - this.setState({ editLabel: newValue }); - }; - - render() { - const { todos, id, complete, remove } = this.props; - const item = todos[id]; - - return ( - - {!this.state.editing && ( - <> - complete(id)} /> -
- - remove(id)} /> -
- - )} - - {this.state.editing && } - - ); - } -} diff --git a/step2-01/src/generics/index.ts b/step2-01/src/generics/index.ts new file mode 100644 index 0000000..e69de29 diff --git a/step2-01/src/index.tsx b/step2-01/src/index.tsx index 2587243..395ba15 100644 --- a/step2-01/src/index.tsx +++ b/step2-01/src/index.tsx @@ -1,10 +1,14 @@ -import React from 'react'; -import ReactDOM from 'react-dom'; -import { TodoApp } from './components/TodoApp'; -import { initializeIcons } from '@uifabric/icons'; +// - modularity +import './modules'; -// Initializes the UI Fabric icons that we can use -// Choose one from this list: https://developer.microsoft.com/en-us/fabric#/styles/icons -initializeIcons(); +// - interface +import './interfaces'; -ReactDOM.render(, document.getElementById('app')); +// - function typing +import './types'; + +// - generics +import './generics'; + +// - await / async +import './async'; diff --git a/step2-01/src/interfaces/index.ts b/step2-01/src/interfaces/index.ts new file mode 100644 index 0000000..e69de29 diff --git a/step2-01/src/modules/default.ts b/step2-01/src/modules/default.ts new file mode 100644 index 0000000..6a9f1db --- /dev/null +++ b/step2-01/src/modules/default.ts @@ -0,0 +1,3 @@ +export default class DefaultClass { + hello = 'world'; +} diff --git a/step2-01/src/modules/index.ts b/step2-01/src/modules/index.ts new file mode 100644 index 0000000..cba0500 --- /dev/null +++ b/step2-01/src/modules/index.ts @@ -0,0 +1,14 @@ +import { namedConst, namedFn, namedObj } from './named'; +import * as named from './named'; + +console.log(namedConst); +console.log(namedFn()); +console.log(namedObj); + +console.log(named.namedConst); +console.log(named.namedFn()); +console.log(named.namedObj); + +import DefaultClass from './default'; + +console.log(new DefaultClass().hello); diff --git a/step2-01/src/modules/named.ts b/step2-01/src/modules/named.ts new file mode 100644 index 0000000..149e31e --- /dev/null +++ b/step2-01/src/modules/named.ts @@ -0,0 +1,9 @@ +export const namedConst = 5; + +export function namedFn() { + return 5; +} + +export const namedObj = { + hello: 'world' +}; diff --git a/step2-01/src/store/index.ts b/step2-01/src/store/index.ts deleted file mode 100644 index 221b5f4..0000000 --- a/step2-01/src/store/index.ts +++ /dev/null @@ -1,14 +0,0 @@ -export type FilterTypes = 'all' | 'active' | 'completed'; - -export interface TodoItem { - label: string; - completed: boolean; -} - -export interface Store { - todos: { - [id: string]: TodoItem; - }; - - filter: FilterTypes; -} diff --git a/step2-01/src/types/index.ts b/step2-01/src/types/index.ts new file mode 100644 index 0000000..e69de29 diff --git a/step2-02/src/components/TodoApp.tsx b/step2-02/src/components/TodoApp.tsx index 9966c46..3d5a649 100644 --- a/step2-02/src/components/TodoApp.tsx +++ b/step2-02/src/components/TodoApp.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Stack } from '@uifabric/experiments'; +import { Stack } from 'office-ui-fabric-react'; import { TodoFooter } from './TodoFooter'; import { TodoHeader } from './TodoHeader'; import { TodoList } from './TodoList'; diff --git a/step2-02/src/components/TodoFooter.tsx b/step2-02/src/components/TodoFooter.tsx index 54129c1..6a44d83 100644 --- a/step2-02/src/components/TodoFooter.tsx +++ b/step2-02/src/components/TodoFooter.tsx @@ -1,5 +1,6 @@ import React from 'react'; -import { Text, Stack } from '@uifabric/experiments'; +import { Text } from '@uifabric/experiments'; +import { Stack } from 'office-ui-fabric-react'; import { Store } from '../store'; import { DefaultButton } from 'office-ui-fabric-react'; diff --git a/step2-02/src/components/TodoHeader.tsx b/step2-02/src/components/TodoHeader.tsx index fb6aef3..0f91255 100644 --- a/step2-02/src/components/TodoHeader.tsx +++ b/step2-02/src/components/TodoHeader.tsx @@ -1,5 +1,6 @@ import React from 'react'; -import { Text, Stack } from '@uifabric/experiments'; +import { Text } from '@uifabric/experiments'; +import { Stack } from 'office-ui-fabric-react'; import { Pivot, PivotItem, TextField, DefaultButton } from 'office-ui-fabric-react'; import { FilterTypes } from '../store'; diff --git a/step2-02/src/components/TodoList.tsx b/step2-02/src/components/TodoList.tsx index 0e10b82..c5d96d2 100644 --- a/step2-02/src/components/TodoList.tsx +++ b/step2-02/src/components/TodoList.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Stack } from '@uifabric/experiments'; +import { Stack } from 'office-ui-fabric-react'; import { TodoListItem } from './TodoListItem'; import { Store, FilterTypes } from '../store'; diff --git a/step2-02/src/components/TodoListItem.tsx b/step2-02/src/components/TodoListItem.tsx index e2d7909..1944c37 100644 --- a/step2-02/src/components/TodoListItem.tsx +++ b/step2-02/src/components/TodoListItem.tsx @@ -1,6 +1,5 @@ import React from 'react'; -import { Stack } from '@uifabric/experiments'; -import { Checkbox, IconButton, TextField, DefaultButton } from 'office-ui-fabric-react'; +import { Stack, Checkbox, IconButton, TextField, DefaultButton } from 'office-ui-fabric-react'; import { mergeStyles } from '@uifabric/styling'; import { Store } from '../store'; diff --git a/tsconfig.json b/tsconfig.json index 202579f..38839b0 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -9,6 +9,8 @@ "jsx": "react", "allowJs": true, "lib": ["es2015", "dom"], - "skipLibCheck": true - } + "skipLibCheck": true, + "skipDefaultLibCheck": true + }, + "exclude": ["node_modules"] } diff --git a/webpack.config.js b/webpack.config.js index 8330b18..b10fdd7 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -37,7 +37,7 @@ module.exports = Object.keys(entries).map(entryPoint => { }), new ForkTsCheckerWebpackPlugin({ silent: true, - async: false + useTypescriptIncrementalApi: true }) ], resolve: {