-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
add svelte bindings and example. FIX #53
- Loading branch information
Showing
15 changed files
with
234 additions
and
34 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -8,6 +8,7 @@ yarn-error.log | |
| *.key | ||
| *.re | ||
| *.rei | ||
| *.svelte | ||
| *.tsbuildinfo | ||
|
|
||
| .DS_Store | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -3,7 +3,7 @@ | |
| <head> | ||
| <meta charset="utf-8" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | ||
| <title>Example Rx React App</title> | ||
| <title>Example React App</title> | ||
| </head> | ||
| <body> | ||
| <div id="root"></div> | ||
|
|
@@ -15,6 +15,6 @@ | |
| crossorigin | ||
| src="https://unpkg.com/[email protected]/umd/react-dom.development.js" | ||
| ></script> | ||
| <script src="build/bundle.js"></script> | ||
| <script src="build/react.js"></script> | ||
| </body> | ||
| </html> | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| import commonjs from "@rollup/plugin-commonjs"; | ||
| import resolve from "@rollup/plugin-node-resolve"; | ||
| import svelte from "rollup-plugin-svelte"; | ||
| import { terser } from "rollup-plugin-terser"; | ||
|
|
||
| export default { | ||
| input: "src/svelte/example.js", | ||
| output: { | ||
| format: "iife", | ||
| name: "ExampleSvelte", | ||
| file: "build/svelte.js", | ||
| }, | ||
| plugins: [ | ||
| svelte({ | ||
| dev: false, | ||
| }), | ||
| resolve({ | ||
| browser: true, | ||
| dedupe: ["svelte"], | ||
| }), | ||
| commonjs(), | ||
| terser({ | ||
| output: { | ||
| comments: false, | ||
| }, | ||
| }), | ||
| ], | ||
| }; |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,8 @@ | ||
| import App from "./example.svelte"; | ||
|
|
||
| const app = new App({ | ||
| target: document.body, | ||
| props: {}, | ||
| }); | ||
|
|
||
| export default app; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,46 @@ | ||
| <script> | ||
| import { | ||
| pipe, | ||
| returns, | ||
| increment, | ||
| compose, | ||
| } from "@reactive-js/core/functions"; | ||
| import { generate, throttle } from "@reactive-js/core/observable"; | ||
| import { fromObservable } from "@reactive-js/core/flowable"; | ||
| import { | ||
| createHostScheduler, | ||
| toPriorityScheduler, | ||
| toSchedulerWithPriority, | ||
| } from "@reactive-js/core/scheduler"; | ||
| import { writable } from "svelte/store"; | ||
| import { stream } from "@reactive-js/core/experimental/svelte"; | ||
| const scheduler = pipe( | ||
| createHostScheduler(), | ||
| toPriorityScheduler, | ||
| toSchedulerWithPriority(1), | ||
| ); | ||
| const [value, setMode] = pipe( | ||
| generate(increment, returns(0)), | ||
| throttle(15), | ||
| fromObservable(), | ||
| stream(scheduler), | ||
| ); | ||
| let mode = 2; | ||
| let label = "RESUME"; | ||
| const onClick = () => { | ||
| mode = mode === 1 ? 2 : 1; | ||
| label = mode === 2 ? "RESUME" : "PAUSE"; | ||
| setMode(mode); | ||
| }; | ||
| </script> | ||
|
|
||
| <main> | ||
| <h1>{$value || 0}</h1> | ||
|
|
||
| <button on:click={onClick}>{label}</button> | ||
| </main> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <meta name="viewport" content="width=device-width,initial-scale=1" /> | ||
|
|
||
| <title>Example Svelte App</title> | ||
|
|
||
| <link rel="stylesheet" href="build/svelte.css" /> | ||
|
|
||
| <script defer src="build/svelte.js"></script> | ||
| </head> | ||
|
|
||
| <body></body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,74 @@ | ||
| import { onDestroy, onMount } from "svelte"; | ||
| import { writable, Readable, Writable } from "svelte/store"; | ||
| import { dispose } from "../disposable"; | ||
| import { Function1, Factory, pipe, defer, SideEffect1 } from "../functions"; | ||
| import { | ||
| dispatch as dispatchToStream, | ||
| ObservableLike, | ||
| subscribe as subscribeObs, | ||
| StreamLike, | ||
| throttle, | ||
| } from "../observable"; | ||
| import { Option, none, isSome } from "../option"; | ||
| import { SchedulerLike } from "../scheduler"; | ||
| import { StreamableLike, lift, onNotify, stream as streamableStream } from "../streamable"; | ||
|
|
||
| class ObservableSvelteStore<T> implements Readable<Option<T>> { | ||
| constructor( | ||
| private readonly observable: ObservableLike<T>, | ||
| private readonly scheduler: SchedulerLike, | ||
| ) {} | ||
|
|
||
| subscribe(callback: (next: Option<T>) => void): Factory<void> { | ||
| callback(none); | ||
| const subscription = pipe( | ||
| this.observable, | ||
| onNotify(callback), | ||
| subscribeObs(this.scheduler), | ||
| ); | ||
|
|
||
| return defer(subscription, dispose); | ||
| } | ||
| } | ||
|
|
||
| export const subscribe = <T>( | ||
| scheduler: SchedulerLike, | ||
| ): Function1<ObservableLike<T>, Readable<Option<T>>> => obs => | ||
| new ObservableSvelteStore(obs, scheduler); | ||
|
|
||
| export const stream = <TReq, T>( | ||
| scheduler: SchedulerLike, | ||
| options: { | ||
| replay?: number; | ||
| } = {}, | ||
| ): Function1< | ||
| StreamableLike<TReq, T>, | ||
| [Readable<Option<T>>, SideEffect1<TReq>] | ||
| > => streamable => { | ||
| const store: Writable<Option<T>> = writable(none); | ||
| const liftedStreamable = pipe( | ||
| streamable, | ||
| lift(throttle(8)), | ||
| onNotify(v => store.set(v)), | ||
| ); | ||
|
|
||
| let stream: Option<StreamLike<TReq, T>> = none; | ||
|
|
||
| onMount(() => { | ||
| stream = streamableStream(liftedStreamable, scheduler, options); | ||
| }); | ||
|
|
||
| onDestroy(() => { | ||
| if (isSome(stream)) { | ||
| dispose(stream); | ||
| } | ||
| }); | ||
|
|
||
| const dispatch = (req: TReq) => { | ||
| if (isSome(stream)) { | ||
| dispatchToStream(stream, req); | ||
| } | ||
| }; | ||
|
|
||
| return [store, dispatch]; | ||
| }; |
Oops, something went wrong.