react-rx 1.0.0 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.idea/compiler.xml +1 -1
- package/.idea/inspectionProfiles/Project_Default.xml +1 -0
- package/.idea/markdown.xml +9 -0
- package/.idea/misc.xml +0 -6
- package/dist/cjs/displayName.js +1 -1
- package/dist/cjs/useAsObservable.js +9 -17
- package/dist/cjs/useObservable.js +25 -30
- package/dist/cjs/withPropsStream.js +5 -1
- package/dist/es2015/useAsObservable.js +10 -18
- package/dist/es2015/useObservable.js +24 -31
- package/dist/esm/displayName.js +1 -1
- package/dist/esm/useAsObservable.js +10 -18
- package/dist/esm/useObservable.js +26 -31
- package/package.json +6 -4
- package/src/useAsObservable.ts +13 -18
- package/src/useObservable.ts +39 -34
- package/.idea/workspace.xml +0 -226
- package/jest.config.js +0 -5
- package/website/.babelrc +0 -21
- package/website/.prettierrc +0 -7
- package/website/README.mdx +0 -1
- package/website/package.json +0 -84
- package/website/src/@types/babel.d.ts +0 -4
- package/website/src/@types/mdx.d.ts +0 -11
- package/website/src/@types/react-css-burger.d.ts +0 -4
- package/website/src/App.tsx +0 -68
- package/website/src/components/Header.tsx +0 -118
- package/website/src/components/Link.tsx +0 -18
- package/website/src/components/LoadPage.tsx +0 -60
- package/website/src/components/Sidebar.tsx +0 -88
- package/website/src/components/logos/Github.tsx +0 -10
- package/website/src/components/logos/React.tsx +0 -27
- package/website/src/components/logos/ReactRxLogo.tsx +0 -39
- package/website/src/components/logos/RxJs.tsx +0 -69
- package/website/src/components/repl/Checkerboard.tsx +0 -25
- package/website/src/components/repl/CodeBlock.tsx +0 -147
- package/website/src/components/repl/CodeMirror.tsx +0 -37
- package/website/src/components/repl/CodeMirrorMode.tsx +0 -67
- package/website/src/components/repl/EvalCode.tsx +0 -55
- package/website/src/components/repl/Prelude.tsx +0 -50
- package/website/src/components/repl/ShowError.tsx +0 -27
- package/website/src/components/repl/codemirror-lib.ts +0 -8
- package/website/src/components/repl/codemirror-theme.css +0 -131
- package/website/src/components/repl/compile/babel.ts +0 -21
- package/website/src/components/repl/eval/evalCallback.ts +0 -27
- package/website/src/components/repl/eval/evalCode.ts +0 -7
- package/website/src/components/repl/eval/evalExpression.ts +0 -4
- package/website/src/components/repl/eval/evalReactDomRender.ts +0 -23
- package/website/src/components/repl/index.ts +0 -1
- package/website/src/components/repl/runMode.ts +0 -42
- package/website/src/datastores/location.ts +0 -14
- package/website/src/datastores/page.ts +0 -11
- package/website/src/datastores/pageTransition.ts +0 -97
- package/website/src/entries/main.css +0 -2
- package/website/src/entries/main.tsx +0 -6
- package/website/src/examples/FizzBuzz/FizzBuzzExample.tsx +0 -39
- package/website/src/examples/FizzBuzz/index.tsx +0 -9
- package/website/src/examples/_utils/globalScope.ts +0 -45
- package/website/src/examples/animation/AnimationExample.tsx +0 -152
- package/website/src/examples/animation/easings.ts +0 -0
- package/website/src/examples/animation/index.tsx +0 -15
- package/website/src/examples/context/Context.example.jsx +0 -67
- package/website/src/examples/context/index.tsx +0 -9
- package/website/src/examples/errors/Errors.example.jsx +0 -69
- package/website/src/examples/errors/index.tsx +0 -9
- package/website/src/examples/event-handlers/EventHandlersExample.tsx +0 -48
- package/website/src/examples/event-handlers/index.tsx +0 -9
- package/website/src/examples/fetch/FetchExample.jsx +0 -43
- package/website/src/examples/fetch/a.txt +0 -1
- package/website/src/examples/fetch/b.txt +0 -1
- package/website/src/examples/fetch/index.tsx +0 -9
- package/website/src/examples/form-data/FormDataExample.jsx +0 -119
- package/website/src/examples/form-data/index.tsx +0 -12
- package/website/src/examples/form-data/storage.ts +0 -27
- package/website/src/examples/forward-ref/ForwardRefExample.tsx +0 -55
- package/website/src/examples/forward-ref/index.tsx +0 -9
- package/website/src/examples/hello-world/HelloWorld.example.jsx +0 -6
- package/website/src/examples/hello-world/index.tsx +0 -9
- package/website/src/examples/hooks-interop/HooksInterop.example.tsx +0 -42
- package/website/src/examples/hooks-interop/index.tsx +0 -9
- package/website/src/examples/passthrough-props/PassThroughPropsExample.jsx +0 -57
- package/website/src/examples/passthrough-props/index.tsx +0 -11
- package/website/src/examples/reactive-state/ReactiveState.example.jsx +0 -43
- package/website/src/examples/reactive-state/index.ts +0 -9
- package/website/src/examples/readme-examples/README.mdx +0 -0
- package/website/src/examples/readme-examples/index.ts +0 -11
- package/website/src/examples/shared-state/SharedState.example.tsx +0 -59
- package/website/src/examples/shared-state/index.tsx +0 -9
- package/website/src/examples/simple/Counter.example.tsx +0 -14
- package/website/src/examples/simple/index.tsx +0 -9
- package/website/src/examples/sync/Sync.example.tsx +0 -9
- package/website/src/examples/sync/index.tsx +0 -9
- package/website/src/examples/tick/TickExample.jsx +0 -51
- package/website/src/examples/tick/index.ts +0 -9
- package/website/src/examples/todo-app/TodoApp.example.tsx +0 -88
- package/website/src/examples/todo-app/index.tsx +0 -12
- package/website/src/examples/todo-app/storage.ts +0 -27
- package/website/src/examples/use-element/UseElementExample.tsx +0 -70
- package/website/src/examples/use-element/index.tsx +0 -9
- package/website/src/examples/use-observable/search/SearchExample.tsx +0 -82
- package/website/src/examples/use-observable/search/index.tsx +0 -8
- package/website/src/examples/use-observable/use-observable/UseObservableExample.tsx +0 -70
- package/website/src/examples/use-observable/use-observable/index.tsx +0 -9
- package/website/src/index.html +0 -10
- package/website/src/mdx-components.tsx +0 -74
- package/website/src/pages/Api/Api.mdx +0 -134
- package/website/src/pages/Api/ApiPage.tsx +0 -25
- package/website/src/pages/Examples/Examples.tsx +0 -105
- package/website/src/pages/Examples/ExamplesPage.tsx +0 -13
- package/website/src/pages/Guide/Guide.mdx +0 -275
- package/website/src/pages/Guide/GuidePage.tsx +0 -25
- package/website/src/pages/Index/IndexPage.tsx +0 -50
- package/website/src/pages/Index/ReactRxReadme.md +0 -20
- package/website/src/pages/NotFound.tsx +0 -3
- package/website/src/pages/pages.ts +0 -46
- package/website/src/pages/styles.tsx +0 -24
- package/website/src/theme.ts +0 -61
- package/website/src/utils/parseCodeFenceHeader.ts +0 -32
- package/website/tsconfig.json +0 -30
- package/website/vercel.json +0 -4
- package/website/webpack/config.js +0 -5
- package/website/webpack/createConfig.js +0 -95
- package/website/webpack/mdx-toc-loader.js +0 -38
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import {NotFoundPage} from './NotFound'
|
|
2
|
-
|
|
3
|
-
export interface Page {
|
|
4
|
-
id: string
|
|
5
|
-
title: string
|
|
6
|
-
route: string
|
|
7
|
-
load: () => Promise<React.ComponentType<any>>
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
function get<T extends {}, K extends keyof T>(key: K): (res: T) => T[K] {
|
|
11
|
-
return (res: T) => res[key]
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
export const pages: Page[] = [
|
|
15
|
-
{
|
|
16
|
-
id: 'home',
|
|
17
|
-
title: 'Home',
|
|
18
|
-
route: '/',
|
|
19
|
-
load: () => import('./Index/IndexPage').then(get('IndexPage'))
|
|
20
|
-
},
|
|
21
|
-
{
|
|
22
|
-
id: 'guide',
|
|
23
|
-
title: 'Guide',
|
|
24
|
-
route: '/guide',
|
|
25
|
-
load: () => import('./Guide/GuidePage').then(get('GuidePage'))
|
|
26
|
-
},
|
|
27
|
-
{
|
|
28
|
-
id: 'api',
|
|
29
|
-
title: 'API',
|
|
30
|
-
route: '/api',
|
|
31
|
-
load: () => import('./Api/ApiPage').then(get('ApiPage'))
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
id: 'examples',
|
|
35
|
-
title: 'Examples',
|
|
36
|
-
route: '/examples',
|
|
37
|
-
load: () => import('./Examples/ExamplesPage').then(get('ExamplesPage'))
|
|
38
|
-
}
|
|
39
|
-
]
|
|
40
|
-
|
|
41
|
-
export const NOT_FOUND: Page = {
|
|
42
|
-
id: 'not-found',
|
|
43
|
-
title: 'Not found',
|
|
44
|
-
route: '',
|
|
45
|
-
load: () => Promise.resolve(NotFoundPage)
|
|
46
|
-
}
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import styled from 'styled-components'
|
|
2
|
-
import * as React from 'react'
|
|
3
|
-
|
|
4
|
-
export const Container = styled.div`
|
|
5
|
-
margin-top: 7em;
|
|
6
|
-
display: flex;
|
|
7
|
-
flex-direction: row;
|
|
8
|
-
`
|
|
9
|
-
|
|
10
|
-
export const ContentWrapper = styled.div`
|
|
11
|
-
width: 100%;
|
|
12
|
-
margin: 0;
|
|
13
|
-
`
|
|
14
|
-
|
|
15
|
-
export const ContentInner = styled.div`
|
|
16
|
-
padding: 0 1em;
|
|
17
|
-
`
|
|
18
|
-
export const Content = (props: {children: React.ReactNode}) => {
|
|
19
|
-
return (
|
|
20
|
-
<ContentWrapper>
|
|
21
|
-
<ContentInner>{props.children}</ContentInner>
|
|
22
|
-
</ContentWrapper>
|
|
23
|
-
)
|
|
24
|
-
}
|
package/website/src/theme.ts
DELETED
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
const SIZES = {
|
|
2
|
-
xsmall: {min: 0, max: 599},
|
|
3
|
-
small: {min: 600, max: 779},
|
|
4
|
-
medium: {min: 780, max: 979},
|
|
5
|
-
large: {min: 980, max: 1279},
|
|
6
|
-
xlarge: {min: 1280, max: 1339},
|
|
7
|
-
xxlarge: {min: 1340, max: Infinity}
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
export type Size = keyof typeof SIZES
|
|
11
|
-
|
|
12
|
-
export const media = {
|
|
13
|
-
between(smallKey: Size, largeKey: Size, excludeLarge = false) {
|
|
14
|
-
if (excludeLarge) {
|
|
15
|
-
return `@media (min-width: ${
|
|
16
|
-
SIZES[smallKey].min
|
|
17
|
-
}px) and (max-width: ${SIZES[largeKey].min - 1}px)`
|
|
18
|
-
} else {
|
|
19
|
-
if (SIZES[largeKey].max === Infinity) {
|
|
20
|
-
return `@media (min-width: ${SIZES[smallKey].min}px)`
|
|
21
|
-
} else {
|
|
22
|
-
return `@media (min-width: ${SIZES[smallKey].min}px) and (max-width: ${SIZES[largeKey].max}px)`
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
},
|
|
26
|
-
|
|
27
|
-
greaterThan(key: Size) {
|
|
28
|
-
return `@media (min-width: ${SIZES[key].min}px)`
|
|
29
|
-
},
|
|
30
|
-
|
|
31
|
-
lessThan(key: Size) {
|
|
32
|
-
return `@media (max-width: ${SIZES[key].min - 1}px)`
|
|
33
|
-
},
|
|
34
|
-
|
|
35
|
-
size(key: Size) {
|
|
36
|
-
const size = SIZES[key]
|
|
37
|
-
|
|
38
|
-
if (size.min == null) {
|
|
39
|
-
return media.lessThan(key)
|
|
40
|
-
} else if (size.max == null) {
|
|
41
|
-
return media.greaterThan(key)
|
|
42
|
-
} else {
|
|
43
|
-
return media.between(key, key)
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
const PRIMARY = '#d9376e'
|
|
49
|
-
const LIGHT = '#eff0f3'
|
|
50
|
-
export const COLORS = {
|
|
51
|
-
header: {
|
|
52
|
-
background: PRIMARY,
|
|
53
|
-
text: LIGHT
|
|
54
|
-
},
|
|
55
|
-
background: LIGHT,
|
|
56
|
-
text: '#2a2a2a',
|
|
57
|
-
link: PRIMARY,
|
|
58
|
-
secondary: '#ff8e3c',
|
|
59
|
-
tertiary: '#ff8e3c',
|
|
60
|
-
shadow: '#444'
|
|
61
|
-
}
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import {flatten, range, uniq} from 'lodash'
|
|
2
|
-
|
|
3
|
-
const regex = /^([a-z0-9\s_-]+)({([0-9,-]+)})*/
|
|
4
|
-
|
|
5
|
-
function isNum(v: any) {
|
|
6
|
-
return !isNaN(v)
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
export function parseCodeFenceHeader(header: string): [string, number[]?] {
|
|
10
|
-
const match = regex.exec(header)
|
|
11
|
-
if (!match) {
|
|
12
|
-
throw new Error(`Unparseable code fence header: ${header}`)
|
|
13
|
-
}
|
|
14
|
-
const [, lang, , range] = match
|
|
15
|
-
|
|
16
|
-
return range ? [lang, parseRange(range)] : [lang]
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
function parseRange(nums: string) {
|
|
20
|
-
return uniq(flatten(nums.split(',').map(expandRange))).filter(isNum)
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
function expandRange(rangeStr: string) {
|
|
24
|
-
if (rangeStr.includes('-')) {
|
|
25
|
-
const numRange = rangeStr
|
|
26
|
-
.split('-')
|
|
27
|
-
.map(n => Number(n))
|
|
28
|
-
.sort()
|
|
29
|
-
return range(numRange[numRange.length - 1], numRange[0])
|
|
30
|
-
}
|
|
31
|
-
return [Number(rangeStr)]
|
|
32
|
-
}
|
package/website/tsconfig.json
DELETED
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"//": "NOTE: TypeScript is only used for typechecking, not transpiling as that's handled by babel",
|
|
3
|
-
"include": [
|
|
4
|
-
"src/**/*"
|
|
5
|
-
],
|
|
6
|
-
"exclude": [
|
|
7
|
-
"node_modules/**/*"
|
|
8
|
-
],
|
|
9
|
-
"compilerOptions": {
|
|
10
|
-
"types": [
|
|
11
|
-
"./webpack/type-stubs.d.ts"
|
|
12
|
-
],
|
|
13
|
-
"strict": true,
|
|
14
|
-
"forceConsistentCasingInFileNames": true,
|
|
15
|
-
"noEmit": true,
|
|
16
|
-
"lib": [
|
|
17
|
-
"dom",
|
|
18
|
-
"ES2015"
|
|
19
|
-
],
|
|
20
|
-
"target": "es2015",
|
|
21
|
-
"moduleResolution": "node",
|
|
22
|
-
"module": "esnext",
|
|
23
|
-
"esModuleInterop": true,
|
|
24
|
-
"skipLibCheck": true,
|
|
25
|
-
"jsx": "preserve",
|
|
26
|
-
"allowJs": true,
|
|
27
|
-
"resolveJsonModule": true,
|
|
28
|
-
"isolatedModules": true
|
|
29
|
-
}
|
|
30
|
-
}
|
package/website/vercel.json
DELETED
|
@@ -1,95 +0,0 @@
|
|
|
1
|
-
const path = require('path')
|
|
2
|
-
const CopyPlugin = require('copy-webpack-plugin')
|
|
3
|
-
const HtmlWebpackPlugin = require('html-webpack-plugin')
|
|
4
|
-
const webpack = require('webpack')
|
|
5
|
-
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
|
|
6
|
-
|
|
7
|
-
module.exports = function createConfig(env) {
|
|
8
|
-
return {
|
|
9
|
-
mode: env,
|
|
10
|
-
entry: './src/entries/main.tsx',
|
|
11
|
-
output: {
|
|
12
|
-
path: path.resolve(__dirname, '..', 'public'),
|
|
13
|
-
filename: '[name]-[hash].js'
|
|
14
|
-
},
|
|
15
|
-
resolve: {
|
|
16
|
-
extensions: ['.tsx', '.ts', '.js']
|
|
17
|
-
},
|
|
18
|
-
plugins: [
|
|
19
|
-
new CleanWebpackPlugin(),
|
|
20
|
-
env === 'development' && new webpack.ProgressPlugin(),
|
|
21
|
-
new CopyPlugin({
|
|
22
|
-
patterns: ['a', 'b'].map((n) => ({
|
|
23
|
-
from: `src/examples/fetch/${n}.txt`,
|
|
24
|
-
to: `${n}.txt`
|
|
25
|
-
}))
|
|
26
|
-
}),
|
|
27
|
-
new HtmlWebpackPlugin({
|
|
28
|
-
template: 'src/index.html',
|
|
29
|
-
inject: true
|
|
30
|
-
})
|
|
31
|
-
].filter(Boolean),
|
|
32
|
-
node: {
|
|
33
|
-
global: true,
|
|
34
|
-
fs: 'empty',
|
|
35
|
-
__filename: 'mock',
|
|
36
|
-
__dirname: 'mock'
|
|
37
|
-
},
|
|
38
|
-
module: {
|
|
39
|
-
rules: [
|
|
40
|
-
{
|
|
41
|
-
test: /\.([tj])sx?$/,
|
|
42
|
-
use: 'babel-loader',
|
|
43
|
-
exclude: /node_modules/
|
|
44
|
-
},
|
|
45
|
-
{
|
|
46
|
-
test: /\.mdx?$/,
|
|
47
|
-
use: ['babel-loader', path.resolve(__dirname, './mdx-toc-loader.js')]
|
|
48
|
-
},
|
|
49
|
-
{
|
|
50
|
-
test: /\.html$/,
|
|
51
|
-
use: 'html-loader'
|
|
52
|
-
},
|
|
53
|
-
{
|
|
54
|
-
test: /\.css$/i,
|
|
55
|
-
use: ['style-loader', 'css-loader']
|
|
56
|
-
}
|
|
57
|
-
]
|
|
58
|
-
},
|
|
59
|
-
...(env === 'development' && {
|
|
60
|
-
devServer: {
|
|
61
|
-
port: 3000,
|
|
62
|
-
host: '0.0.0.0',
|
|
63
|
-
historyApiFallback: true,
|
|
64
|
-
disableHostCheck: true
|
|
65
|
-
}
|
|
66
|
-
}),
|
|
67
|
-
devtool: env === 'development' ? 'source-map' : false,
|
|
68
|
-
...(env === 'production' && {
|
|
69
|
-
optimization: {
|
|
70
|
-
usedExports: true,
|
|
71
|
-
minimize: true,
|
|
72
|
-
splitChunks: {
|
|
73
|
-
chunks: 'async',
|
|
74
|
-
minSize: 30000,
|
|
75
|
-
maxSize: 0,
|
|
76
|
-
minChunks: 1,
|
|
77
|
-
maxAsyncRequests: 6,
|
|
78
|
-
maxInitialRequests: 4,
|
|
79
|
-
automaticNameDelimiter: '~',
|
|
80
|
-
cacheGroups: {
|
|
81
|
-
defaultVendors: {
|
|
82
|
-
test: /[\\/]node_modules[\\/]/,
|
|
83
|
-
priority: -10
|
|
84
|
-
},
|
|
85
|
-
default: {
|
|
86
|
-
minChunks: 2,
|
|
87
|
-
priority: -20,
|
|
88
|
-
reuseExistingChunk: true
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
})
|
|
94
|
-
}
|
|
95
|
-
}
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
const mdx = require('@mdx-js/mdx')
|
|
2
|
-
const toc = require('markdown-toc')
|
|
3
|
-
const slug = require('remark-slug')
|
|
4
|
-
const ghSlugger = require('github-slugger')
|
|
5
|
-
const emoji = require('remark-emoji')
|
|
6
|
-
|
|
7
|
-
const slugify = ghSlugger()
|
|
8
|
-
|
|
9
|
-
module.exports = async function MdxTocLoader(src) {
|
|
10
|
-
const callback = this.async()
|
|
11
|
-
|
|
12
|
-
if (!callback) {
|
|
13
|
-
return
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
const mdxConfig = {
|
|
17
|
-
skipExport: true,
|
|
18
|
-
remarkPlugins: [emoji, slug]
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
const tocResult = toc(src, {slugify})
|
|
22
|
-
|
|
23
|
-
const compiled = mdx(src, mdxConfig)
|
|
24
|
-
const compiledToc = mdx(tocResult.content, mdxConfig)
|
|
25
|
-
|
|
26
|
-
const code = `/* @jsx mdx */
|
|
27
|
-
import React from 'react';
|
|
28
|
-
import { mdx } from '@mdx-js/react'
|
|
29
|
-
export default ${iife(await compiled)};
|
|
30
|
-
export const Toc = ${iife(await compiledToc)}
|
|
31
|
-
`
|
|
32
|
-
return callback(null, code)
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
function iife(body) {
|
|
36
|
-
return `(function() {${body}
|
|
37
|
-
return MDXContent})()`
|
|
38
|
-
}
|