fix(HotLoader): Using aliased hotloader breaks consumers without hotl…

…oader
HHogg · Mar 3, 2020 · 31ab6cf · 31ab6cf
1 parent d2dd4ee
commit 31ab6cf
Show file tree

Hide file tree

Showing 11 changed files with 35 additions and 114 deletions.
diff --git a/package.json b/package.json
@@ -40,7 +40,6 @@
     "resize-observer-polyfill": "^1.5.0"
   },
   "devDependencies": {
-    "@hot-loader/react-dom": "^16.11.0",
     "@semantic-release/changelog": "^2.0.2",
     "@semantic-release/git": "^9.0.0",
     "@svgr/cli": "^5.0.1",
@@ -70,7 +69,6 @@
     "react": ">=16.6.0",
     "react-dom": ">=16.6.0",
     "react-element-to-jsx-string": "^14.2.0",
-    "react-hot-loader": "^4.12.18",
     "react-router-dom": "^5.1.2",
     "react-snap": "^1.23.0",
     "react-test-renderer": "^16.3.2",
@@ -83,8 +81,7 @@
     "typescript": "^3.4.5"
   },
   "alias": {
-    "preshape": "./src",
-    "react-dom": "@hot-loader/react-dom"
+    "preshape": "./src"
   },
   "resolutions": {
     "fast-glob": "3.1.1",

diff --git a/preshape.sketch b/preshape.sketch
diff --git a/site/components/APIViewer/TypeTooltipIntrinsic.tsx b/site/components/APIViewer/TypeTooltipIntrinsic.tsx
@@ -10,7 +10,7 @@ import {
   PlacementReference,
 } from 'preshape';
 import { Renderer } from './Types';
-import SiteContext from '../SiteContext';
+import { RootContext } from '../Root';
 
 export interface Props extends Renderer {
   children: (props: {
@@ -24,7 +24,7 @@ export interface Props extends Renderer {
 
 export default (props: Props) => {
   const { children, context, state, onStateChange, placeholder } = props;
-  const { theme } = React.useContext(SiteContext);
+  const { theme } = React.useContext(RootContext);
   const [visible, setVisible] = React.useState(false);
   const [textValue, setTextValue] = React.useState((state || '').toString());
 

diff --git a/site/components/Documentation/Showcase.tsx b/site/components/Documentation/Showcase.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import toJsxString from 'react-element-to-jsx-string';
 import { CodeBlock, Appear, Flex, Icon, Link, Text, ThemeSwitcher } from 'preshape';
-import SiteContext from '../SiteContext';
+import { RootContext } from '../Root';
 
 export const ShowcaseContext = React.createContext<{
   setShowcaseCode: (node: React.ReactNode) => void;
@@ -32,7 +32,7 @@ interface Props {
 }
 
 export default ({ children, disableCode }: Props) => {
-  const { onChangeTheme, theme } = React.useContext(SiteContext);
+  const { onChangeTheme, theme } = React.useContext(RootContext);
   const [code, setCode] = React.useState(getCodeString(children));
   const [isIsolatedExample, setIsIsolatedExample] = React.useState(false);
   const [isCodeExpanded, setIsCodeExpanded] = React.useState(false);

diff --git a/site/components/Landing/Landing.tsx b/site/components/Landing/Landing.tsx
@@ -10,15 +10,14 @@ import {
   ThemeSwitcher,
 } from 'preshape';
 import { version } from '../../../package.json';
-import { widthSmall, widthMedium } from '../Root';
+import { RootContext, widthSmall, widthMedium } from '../Root';
 import Documentation from '../Documentation/Documentation';
 import landingSections from '../LandingSections';
 import LandingSection from './LandingSection';
 import Logo from '../Logo/Logo';
-import SiteContext from '../SiteContext';
 
 export default () => {
-  const { onChangeTheme, theme } = React.useContext(SiteContext);
+  const { onChangeTheme, theme } = React.useContext(RootContext);
 
   return (
     <Base>

diff --git a/site/components/LandingSections/Themes.tsx b/site/components/LandingSections/Themes.tsx
@@ -9,7 +9,7 @@ import {
   Motion,
   ThemeSwitcher,
 } from 'preshape';
-import SiteContext from '../SiteContext';
+import { RootContext } from '../Root';
 import LandingSection, { Props } from '../Landing/LandingSection';
 
 interface ThemeVariants extends Variants {
@@ -84,7 +84,7 @@ const stars: { size: number; x: number; y: number }[] = [
 ];
 
 export default (props: Props) => {
-  const { onChangeTheme, theme } = React.useContext(SiteContext);
+  const { onChangeTheme, theme } = React.useContext(RootContext);
 
   return (
     <LandingSection { ...props }>

diff --git a/site/components/Root.tsx b/site/components/Root.tsx
@@ -1,16 +1,34 @@
 import * as React from 'react';
-import { BrowserRouter } from 'react-router-dom';
-import Site from './Site';
+import { BrowserRouter, Route, Switch } from 'react-router-dom';
+import { useTheme, TypeTheme } from 'preshape';
+import Landing from './Landing/Landing';
 
 export const widthContainer = '1152px';
 export const widthLarge = '1024px';
 export const widthMedium = '832px';
 export const widthSmall = '480px';
 
+export const RootContext = React.createContext<{
+  onChangeTheme: (theme: TypeTheme) => void;
+  theme: TypeTheme;
+}>({
+  onChangeTheme: () => {},
+  theme: 'day',
+});
+
+
 export default () => {
+  const [theme, onChangeTheme] = React.useState<TypeTheme>('day');
+
+  useTheme(theme);
+
   return (
     <BrowserRouter>
-      <Site />
+      <Switch>
+        <RootContext.Provider value={ { onChangeTheme, theme } }>
+          <Route component={ Landing } path="/" />
+        </RootContext.Provider>
+      </Switch>
     </BrowserRouter>
   );
 };
diff --git a/site/components/Site.tsx b/site/components/Site.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { Route, Switch } from 'react-router-dom';
-import { hot } from 'react-hot-loader';
 import { useTheme, Base, TypeTheme } from 'preshape';
 import Landing from './Landing/Landing';
 import SiteContext from './SiteContext';
 
-const Site = () => {
+export default () => {
   const [theme, onChangeTheme] = React.useState<TypeTheme>('day');
 
   useTheme(theme);
@@ -20,5 +19,3 @@ const Site = () => {
     </Base>
   );
 };
-
-export default hot(module)(Site);
diff --git a/site/components/ThemeIcon/ThemeIcon.tsx b/site/components/ThemeIcon/ThemeIcon.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react' ;
 import { Icon, IconProps } from 'preshape';
-import SiteContext from '../SiteContext';
+import { RootContext } from '../Root';
 
 const ThemeIcon: React.FC<Omit<IconProps, 'name'>> = (props) => {
-  const { theme } = React.useContext(SiteContext);
+  const { theme } = React.useContext(RootContext);
 
   return (
     <Icon { ...props } name={ theme === 'day' ? 'Sun' : 'Moon' } />

diff --git a/site/index.tsx b/site/index.tsx
@@ -12,7 +12,3 @@ if (rootElement) {
     render(<Root />, rootElement);
   }
 }
-
-if (module.hot) {
-  module.hot.accept();
-}
diff --git a/yarn.lock b/yarn.lock
@@ -837,16 +837,6 @@
   resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb"
   integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==
 
-"@hot-loader/react-dom@^16.11.0":
-  version "16.11.0"
-  resolved "https://registry.yarnpkg.com/@hot-loader/react-dom/-/react-dom-16.11.0.tgz#c0b483923b289db5431516f56ee2a69448ebf9bd"
-  integrity sha512-cIOVB8YgT4EVCNiXK+gGuYl6adW/TKlW3N7GvgY5QgpL2NTWagF/oJxVscHSdR3O7NjJsoxdseB5spqwCHNIhA==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-    prop-types "^15.6.2"
-    scheduler "^0.17.0"
-
 "@iarna/cli@^1.2.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@iarna/cli/-/cli-1.2.0.tgz#0f7af5e851afe895104583c4ca07377a8094d641"
@@ -2081,11 +2071,6 @@ before-after-hook@^2.0.0:
   resolved "https://registry.yarnpkg.com/before-after-hook/-/before-after-hook-2.1.0.tgz#b6c03487f44e24200dd30ca5e6a1979c5d2fb635"
   integrity sha512-IWIbu7pMqyw3EAJHzzHbWa85b6oud/yfKYg5rqB5hNE8CeMi3nX+2C2sj0HswfblST86hpVEOAb9x34NZd6P7A==
 
-big.js@^5.2.2:
-  version "5.2.2"
-  resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328"
-  integrity sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==
-
 bin-links@^1.1.2, bin-links@^1.1.7:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/bin-links/-/bin-links-1.1.7.tgz#34b79ea9d0e575d7308afeff0c6b2fc24c793359"
@@ -3771,11 +3756,6 @@ dom-serializer@~0.1.0:
     domelementtype "^1.3.0"
     entities "^1.1.1"
 
-dom-walk@^0.1.0:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/dom-walk/-/dom-walk-0.1.1.tgz#672226dc74c8f799ad35307df936aba11acd6018"
-  integrity sha1-ZyIm3HTI95mtNTB9+TaroRrNYBg=
-
 domain-browser@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.2.0.tgz#3d31f50191a6749dd1375a7f522e823d42e54eda"
@@ -3920,11 +3900,6 @@ emoji-regex@^8.0.0:
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-8.0.0.tgz#e818fd69ce5ccfcb404594f842963bf53164cc37"
   integrity sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==
 
-emojis-list@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-2.1.0.tgz#4daa4d9db00f9819880c79fa457ae5b09a1fd389"
-  integrity sha1-TapNnbAPmBmIDHn6RXrlsJof04k=
-
 encodeurl@~1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
@@ -4403,7 +4378,7 @@ fast-json-stable-stringify@^2.0.0:
   resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
   integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
 
-fast-levenshtein@^2.0.6, fast-levenshtein@~2.0.6:
+fast-levenshtein@~2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
   integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=
@@ -4937,14 +4912,6 @@ global-prefix@^3.0.0:
     kind-of "^6.0.2"
     which "^1.3.1"
 
-global@^4.3.0:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/global/-/global-4.4.0.tgz#3e7b105179006a323ed71aafca3e9c57a5cc6406"
-  integrity sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==
-  dependencies:
-    min-document "^2.19.0"
-    process "^0.11.10"
-
 globals@^11.1.0, globals@^11.7.0:
   version "11.12.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
@@ -5215,7 +5182,7 @@ hmac-drbg@^1.0.0:
     minimalistic-assert "^1.0.0"
     minimalistic-crypto-utils "^1.0.1"
 
-hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.3.0:
+hoist-non-react-statics@^3.1.0:
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
   integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
@@ -6535,15 +6502,6 @@ load-json-file@^4.0.0:
     pify "^3.0.0"
     strip-bom "^3.0.0"
 
-loader-utils@^1.1.0:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7"
-  integrity sha512-fkpz8ejdnEMG3s37wGL07iSBDg99O9D5yflE9RGNH3hRdx9SOwYfnGYdZOUIZitN8E+E2vkq3MUMYMvPYl5ZZA==
-  dependencies:
-    big.js "^5.2.2"
-    emojis-list "^2.0.0"
-    json5 "^1.0.1"
-
 locate-path@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e"
@@ -7157,13 +7115,6 @@ mimic-response@^1.0.0, mimic-response@^1.0.1:
   resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-1.0.1.tgz#4923538878eef42063cb8a3e3b0798781487ab1b"
   integrity sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ==
 
-min-document@^2.19.0:
-  version "2.19.0"
-  resolved "https://registry.yarnpkg.com/min-document/-/min-document-2.19.0.tgz#7bd282e3f5842ed295bb748cdd9f1ffa2c824685"
-  integrity sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU=
-  dependencies:
-    dom-walk "^0.1.0"
-
 min-indent@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.0.tgz#cfc45c37e9ec0d8f0a0ec3dd4ef7f7c3abe39256"
@@ -9665,30 +9616,11 @@ react-element-to-jsx-string@^14.2.0:
     "@base2/pretty-print-object" "1.0.0"
     is-plain-object "3.0.0"
 
-react-hot-loader@^4.12.18:
-  version "4.12.19"
-  resolved "https://registry.yarnpkg.com/react-hot-loader/-/react-hot-loader-4.12.19.tgz#99a1c763352828f404fa51cd887c5e16bb5b74d1"
-  integrity sha512-p8AnA4QE2GtrvkdmqnKrEiijtVlqdTIDCHZOwItkI9kW51bt5XnQ/4Anz8giiWf9kqBpEQwsmnChDCAFBRyR/Q==
-  dependencies:
-    fast-levenshtein "^2.0.6"
-    global "^4.3.0"
-    hoist-non-react-statics "^3.3.0"
-    loader-utils "^1.1.0"
-    prop-types "^15.6.1"
-    react-lifecycles-compat "^3.0.4"
-    shallowequal "^1.1.0"
-    source-map "^0.7.3"
-
 react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.6:
   version "16.12.0"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.12.0.tgz#2cc0fe0fba742d97fd527c42a13bec4eeb06241c"
   integrity sha512-rPCkf/mWBtKc97aLL9/txD8DZdemK0vkA3JMLShjlJB3Pj3s+lpf1KaBzMfQrAmhMQB0n1cU/SUGgKKBCe837Q==
 
-react-lifecycles-compat@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
-  integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==
-
 react-popper@^1.3.7:
   version "1.3.7"
   resolved "https://registry.yarnpkg.com/react-popper/-/react-popper-1.3.7.tgz#f6a3471362ef1f0d10a4963673789de1baca2324"
@@ -10401,14 +10333,6 @@ saxes@^3.1.9:
   dependencies:
     xmlchars "^2.1.1"
 
-scheduler@^0.17.0:
-  version "0.17.0"
-  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.17.0.tgz#7c9c673e4ec781fac853927916d1c426b6f3ddfe"
-  integrity sha512-7rro8Io3tnCPuY4la/NuI5F2yfESpnfZyT6TtkXnSWVkcu0BCDJ+8gk5ozUaFaxpIyNuWAPXrH0yFcSi28fnDA==
-  dependencies:
-    loose-envify "^1.1.0"
-    object-assign "^4.1.1"
-
 scheduler@^0.18.0:
   version "0.18.0"
   resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.18.0.tgz#5901ad6659bc1d8f3fdaf36eb7a67b0d6746b1c4"
@@ -10628,11 +10552,6 @@ shallow-copy@~0.0.1:
   resolved "https://registry.yarnpkg.com/shallow-copy/-/shallow-copy-0.0.1.tgz#415f42702d73d810330292cc5ee86eae1a11a170"
   integrity sha1-QV9CcC1z2BAzApLMXuhurhoRoXA=
 
-shallowequal@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
-  integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
-
 shebang-command@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-1.2.0.tgz#44aac65b695b03398968c39f363fee5deafdf1ea"
@@ -10824,11 +10743,6 @@ source-map@^0.5.0, source-map@^0.5.3, source-map@^0.5.6, source-map@^0.5.7:
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
   integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=
 
-source-map@^0.7.3:
-  version "0.7.3"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383"
-  integrity sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==
-
 [email protected]:
   version "2.1.8"
   resolved "https://registry.yarnpkg.com/sourcemapped-stacktrace-node/-/sourcemapped-stacktrace-node-2.1.8.tgz#96fd64263051e252ce8dabf9801bea29dc7e5990"