fix #103. update dependencies (#104)

* fix #103. update dependencies - related to #3 update for React 16 and 17 - mention RxJS import change in changelog - remove max version from React peerDependency for conduit-rxjs-react - combine rxjs imports into one line per file - fix imports in non-CHANGLOG ".md" files - add package-lock.json to .gitignore - add link to RxJS v7.2 CHANGELOG - fix examples. update CHANGELOG Co-authored-by: James Anderson <[email protected]>
indiana-university · Jan 13, 2022 · 8d98f5d · 8d98f5d
1 parent 42de9a6
commit 8d98f5d
Show file tree

Hide file tree

Showing 46 changed files with 311 additions and 50,513 deletions.
diff --git a/.gitignore b/.gitignore
@@ -3,4 +3,5 @@ dist
 bundles
 .DS_Store
 lerna-debug.log
-npm-debug.log
+npm-debug.log
+package-lock.json
diff --git a/examples/intro-to-rxjs.md b/examples/intro-to-rxjs.md
@@ -48,8 +48,7 @@ Static operators (otherwise known as a producers) are used to initiate observabl
 In RxJS v6, static operators and pipeable operators are imported from different locations.
 
 ```js
-import { combineLatest, from, merge, of } from 'rxjs'
-import { distinctUntilChanged, filter, map, mapTo, mergeMap } from 'rxjs/operators'
+import { combineLatest, distinctUntilChanged, filter, from, map, mapTo, merge, mergeMap, of } from 'rxjs'
 ```
 
 ## Custom operators
@@ -58,13 +57,13 @@ If there's an operator configuration or sequence that is often used, it is now e
 
 ```js
 // operators.js
-import { distinctUntilChanged } from 'rxjs/operators'
+import { distinctUntilChanged } from 'rxjs'
 
 export const distinctUntilObjectChanged = () => (source) =>
   source.pipe(distinctUntilChanged(null, (value) => JSON.stringify(value)))
 
 // app.js
-import { of } from 'rxjs/operators'
+import { of } from 'rxjs'
 import { distinctUntilObjectChanged } from './operators'
 
 of(
@@ -93,8 +92,7 @@ If needing to do any work outside of the stream, the best places to do that is w
 If wanting to inspect the values emitted at different stages in a stream, an easy way is to `log` the output. It may be tempting to inject these calls within other operations, but ultimately, it starts to uncomfortably intertwine temporary debug code with app code.
 
 ```js
-import { interval } from 'rxjs'
-import { map } from 'rxjs/operators'
+import { interval, map } from 'rxjs'
 
 interval(1000).pipe(
   map((i) => {
@@ -108,8 +106,7 @@ interval(1000).pipe(
 Instead, isolate these side effects in the `tap` operator, as it only inspects input and never modifies its output.
 
 ```js
-import { interval } from 'rxjs'
-import { map, tap } from 'rxjs/operators'
+import { interval, map, tap } from 'rxjs'
 
 interval(1000).pipe(
   map((i) => i * 2),
@@ -120,8 +117,7 @@ interval(1000).pipe(
 If wanting to simplify this even more, consider using the [`rxjs-console-logger`](https://github.com/donaldaverill/rxjs-console-logger-operator) package or creating a custom operator.
 
 ```js
-import { interval } from 'rxjs'
-import { map } from 'rxjs/operators'
+import { interval, map } from 'rxjs'
 import { debug } from 'rxjs-console-logger'
 
 interval(1000).pipe(
@@ -133,8 +129,7 @@ interval(1000).pipe(
 Remember to always subscribe to a stream. Otherwise, no operators will ever be executed.
 
 ```js
-import { interval } from 'rxjs'
-import { map } from 'rxjs/operators'
+import { interval, map } from 'rxjs'
 import { debug } from 'rxjs-console-logger'
 
 interval(1000).pipe(
@@ -195,7 +190,7 @@ e$  |           f$  |
 In order to ensure the work by `d$` occurs only once, its value needs to be explicitly shared with `e$` and `f$`. To do this, use the `share` operator as the last operatation on `d$`. A stream that behaves this way is commonly called a *hot observable*.
 
 ```js
-import { share, skip } from 'rxjs/operators'
+import { share, skip } from 'rxjs'
 
 const d$ = c$.pipe(
   skip(3),
@@ -208,7 +203,7 @@ const d$ = c$.pipe(
 In order to ensure late subscribers like `f$` receive the latest value as soon as they subscribe, use `shareReplay(1)` rather than `share`. The first argument is the number of values remembered and shared by `d$`. In most cases, only one (the latest) is needed.
 
 ```js
-import { shareReplay, skip } from 'rxjs/operators'
+import { shareReplay, skip } from 'rxjs'
 
 const d$ = c$.pipe(
   skip(3),

diff --git a/examples/timer/.babelrc b/examples/timer/.babelrc
@@ -1,3 +1,3 @@
 {
-  "presets": ["env", "react"]
+  "presets": ["@babel/preset-env", "@babel/preset-react"]
 }
diff --git a/examples/timer/README.md b/examples/timer/README.md
@@ -99,8 +99,7 @@ map         {0}-{1}-{2}-{3}--...
 ```jsx
 import React from 'react'
 import { render } from 'react-dom'
-import { interval } from 'rxjs'
-import { map, startWith } from 'rxjs/operators'
+import { interval, map, startWith } from 'rxjs'
 
 class Timer extends React.Component {
   constructor (props) {
@@ -138,8 +137,7 @@ Let's take the component and abstract it into a [higher-order component factory]
 ```jsx
 import React from 'react'
 import { render } from 'react-dom'
-import { interval } from 'rxjs'
-import { map, startWith } from 'rxjs/operators'
+import { interval, map, startWith } from 'rxjs'
 
 function connect (WrappedComponent, state$) {
   return class Connect extends React.Component {
@@ -187,8 +185,7 @@ Rather than providing your own higher-order component factory, you can use the `
 ```jsx
 import React from 'react'
 import { render } from 'react-dom'
-import { interval } from 'rxjs'
-import { map, startWith } from 'rxjs/operators'
+import { interval, map, startWith } from 'rxjs'
 import { connect } from 'conduit-rxjs-react'
 
 const timerState$ = interval(1000).pipe(
@@ -215,8 +212,7 @@ Perhaps you want to create several timers, each with different starting times an
 ```jsx
 import React from 'react'
 import { render } from 'react-dom'
-import { interval } from 'rxjs'
-import { map, startWith } from 'rxjs/operators'
+import { interval, map, startWith } from 'rxjs'
 import { connect } from 'conduit-rxjs-react'
 
 function createTimer (config = {}) {
@@ -256,8 +252,7 @@ Instead of manually creating several instances of the same connected component,
 ```js
 import React from 'react'
 import { render } from 'react-dom'
-import { interval } from 'rxjs'
-import { map, startWith, switchMap } from 'rxjs/operators'
+import { interval, map, startWith, switchMap } from 'rxjs'
 import { connect } from 'conduit-rxjs-react'
 
 function createTimer () {

diff --git a/examples/timer/index.html b/examples/timer/index.html
@@ -24,9 +24,9 @@ <h2>Part 6</h2>
   <div id="timer6"></div>
   <h2>Part 7</h2>
   <div id="timer7"></div>
-  <script crossorigin src="https://unpkg.com/[email protected].2/umd/react.production.min.js"></script>
-  <script crossorigin src="https://unpkg.com/[email protected].2/umd/react-dom.production.min.js"></script>
-  <script crossorigin src="https://unpkg.com/rxjs@6.2.1/bundles/rxjs.umd.min.js"></script>
+  <script crossorigin src="https://unpkg.com/[email protected].0/umd/react.production.min.js"></script>
+  <script crossorigin src="https://unpkg.com/[email protected].0/umd/react-dom.production.min.js"></script>
+  <script crossorigin src="https://unpkg.com/rxjs@7.2.0/dist/bundles/rxjs.umd.min.js"></script>
   <script src="./conduit-rxjs/bundles/conduit-rxjs.umd.min.js"></script>
   <script src="./conduit-rxjs-react/bundles/conduit-rxjs-react.umd.min.js"></script>
   <script src="./main.js"></script>