├── .codedoc ├── build.ts ├── components │ └── table.tsx ├── config.ts ├── content │ ├── footer.tsx │ ├── header.tsx │ ├── index.tsx │ └── theme.ts ├── package-lock.json ├── package.json ├── serve.ts ├── theme.ts └── tsconfig.json ├── .eslintrc ├── .github └── workflows │ ├── deploy-to-gh-pages.yml │ ├── publish-to-npm.yml │ └── test-and-report-coverage.yml ├── .gitignore ├── LICENSE ├── README.md ├── callbag-jsx-banner.svg ├── conf ├── rollup │ ├── base.js │ ├── es5.js │ └── es6.js ├── typescript │ ├── base.json │ ├── build.json │ ├── es5.json │ ├── es6.json │ └── test.json └── webpack │ ├── base.conf.ts │ ├── dev.conf.ts │ └── prod.conf.ts ├── docs ├── assets │ ├── callbag-jsx-banner.svg │ ├── callbag-jsx-dark-banner.svg │ ├── callbag-jsx.svg │ ├── callbag.svg │ ├── keyed-list-explained-1.png │ ├── keyed-list-explained-1.svg │ ├── keyed-list-explained-2.png │ ├── keyed-list-explained-2.svg │ └── logo.png └── md │ ├── _toc.md │ ├── basics │ ├── attributes.md │ ├── classes.md │ ├── conditionals.md │ ├── content.md │ ├── events.md │ ├── inputs.md │ ├── lists.md │ ├── references.md │ ├── styles.md │ └── wait.md │ ├── components │ ├── hooks.md │ ├── overview.md │ └── tracking.md │ ├── getting-started.md │ ├── in-depth │ ├── renderer.md │ └── under-the-hood.md │ ├── index.md │ ├── install.md │ ├── jsx.md │ ├── meta │ ├── compare.md │ └── why.md │ ├── reactivity │ ├── callbags.md │ ├── expressions.md │ └── states.md │ └── tools.md ├── favicon.ico ├── package-lock.json ├── package.json ├── plugins ├── index.d.ts └── package.json ├── samples └── index.tsx ├── src ├── components │ ├── conditional.tsx │ ├── for.tsx │ ├── index.ts │ ├── keyed-for.tsx │ ├── keyed-list.tsx │ ├── list.tsx │ ├── simple-for.tsx │ ├── simple-list.tsx │ ├── test │ │ ├── conditional.test.tsx │ │ ├── for.test.tsx │ │ ├── index.ts │ │ ├── list.test.tsx │ │ ├── util.ts │ │ └── wait.test.tsx │ ├── util │ │ ├── ensure-state.ts │ │ ├── keyed-collections.tsx │ │ └── simple-collections.tsx │ └── wait.tsx ├── index.ts ├── plugins │ ├── append.plugin.ts │ ├── class.plugin.ts │ ├── content.plugin.ts │ ├── event-handler.plugin.ts │ ├── index.ts │ ├── input-state.plugin.ts │ ├── input-value.plugin.ts │ ├── prop.plugin.ts │ ├── style.plugin.ts │ ├── test │ │ ├── append.plugin.test.tsx │ │ ├── class.plugin.test.tsx │ │ ├── content.plugin.test.tsx │ │ ├── event-handler.plugin.test.tsx │ │ ├── index.ts │ │ ├── input-state.plugin.test.tsx │ │ ├── input-value.plugin.test.tsx │ │ ├── prop.plugin.test.tsx │ │ ├── spec │ │ │ ├── append.spec.tsx │ │ │ ├── class.spec.tsx │ │ │ ├── content.spec.tsx │ │ │ ├── event-handler.spec.tsx │ │ │ ├── input-state.spec.tsx │ │ │ ├── input-value.spec.tsx │ │ │ ├── prop.spec.tsx │ │ │ ├── style.spec.tsx │ │ │ └── track.spec.tsx │ │ ├── style.plugin.test.tsx │ │ └── track.plugin.test.tsx │ └── track.plugin.ts ├── test │ └── index.ts ├── types.ts └── util │ ├── index.ts │ ├── log.ts │ ├── make-hook.ts │ ├── map-distinct.ts │ ├── subject.ts │ ├── tap-one.ts │ └── tap.ts ├── test.ts └── tsconfig.json /.codedoc/build.ts: -------------------------------------------------------------------------------- 1 | import { build } from '@codedoc/core'; 2 | 3 | import { config } from './config'; 4 | import { installTheme$ } from './content/theme'; 5 | import { content } from './content'; 6 | 7 | 8 | build(config, content, installTheme$, { 9 | resolve: { 10 | modules: ['.codedoc/node_modules'] 11 | }, 12 | resolveLoader: { 13 | modules: ['.codedoc/node_modules'] 14 | } 15 | }); 16 | -------------------------------------------------------------------------------- /.codedoc/components/table.tsx: -------------------------------------------------------------------------------- 1 | import { RendererLike } from '@connectv/html'; 2 | 3 | export function Table({header, body}: {header: any, body: any}, renderer: RendererLike, content: any) { 4 | 5 | return
6 | 7 | {header} 8 | {body} 9 |
10 |
; 11 | } 12 | -------------------------------------------------------------------------------- /.codedoc/config.ts: -------------------------------------------------------------------------------- 1 | 2 | import { configuration, DefaultMarkdownCustomInlineComponents } from '@codedoc/core'; 3 | import { Button } from '@codedoc/core/components'; 4 | 5 | import { Table } from './components/table'; 6 | import { theme } from './theme'; 7 | 8 | 9 | export const config = /*#__PURE__*/configuration({ 10 | theme, 11 | dest: { 12 | namespace: '/callbag-jsx', 13 | html: 'dist', 14 | assets: process.env.GITHUB_BUILD === 'true' ? 'dist' : '.', 15 | bundle: process.env.GITHUB_BUILD === 'true' ? 'bundle' : 'dist/bundle', 16 | styles: process.env.GITHUB_BUILD === 'true' ? 'styles' : 'dist/styles', 17 | }, 18 | page: { 19 | title: { 20 | extractor: (content) => { 21 | const base = 'Callbag JSX'; 22 | const pt = content.querySelector('h1')?.textContent; 23 | 24 | return pt ? `${base} | ${pt}` : base; 25 | } 26 | }, 27 | favicon: '/favicon.ico' 28 | }, 29 | markdown: { 30 | Table, 31 | customInlineComponents: { 32 | ...DefaultMarkdownCustomInlineComponents, 33 | Button 34 | } 35 | }, 36 | misc: { 37 | github: { 38 | user: 'loreanvictor', 39 | repo: 'callbag-jsx', 40 | }, 41 | gitter: { 42 | room: 'callbag-jsx/community' 43 | } 44 | }, 45 | }); 46 | -------------------------------------------------------------------------------- /.codedoc/content/footer.tsx: -------------------------------------------------------------------------------- 1 | import { CodedocConfig } from '@codedoc/core'; 2 | import { Footer as _Footer, GitterToggle$, Watermark} from '@codedoc/core/components'; 3 | 4 | 5 | export function Footer(config: CodedocConfig, renderer: any) { 6 | let github$; 7 | if (config.misc?.github) 8 | github$ = GitHub; 10 | 11 | let community$; 12 | if (config.misc?.gitter) 13 | community$ = 14 | 15 | if (github$ && community$) return <_Footer>{github$}
{community$}; 16 | else if (github$) return <_Footer>{github$}; 17 | else if (community$) return <_Footer>{community$}; 18 | else return <_Footer>; 19 | } 20 | -------------------------------------------------------------------------------- /.codedoc/content/header.tsx: -------------------------------------------------------------------------------- 1 | import { CodedocConfig } from '@codedoc/core'; 2 | import { Header as _Header, GithubButton, Watermark } from '@codedoc/core/components'; 3 | 4 | 5 | export function Header(config: CodedocConfig, renderer: any) { 6 | return ( 7 | <_Header>{config.misc?.github ? 8 | 9 | 15 |

16 |
17 | : ''} 18 | 19 | 20 | ) 21 | } 22 | -------------------------------------------------------------------------------- /.codedoc/content/index.tsx: -------------------------------------------------------------------------------- 1 | import { RendererLike } from '@connectv/html'; 2 | import { File } from 'rxline/fs'; 3 | import { Page, Meta, ContentNav, Fonts, ToC, GithubSearch$ } from '@codedoc/core/components'; 4 | 5 | import { config } from '../config'; 6 | import { Header } from './header'; 7 | import { Footer } from './footer'; 8 | 9 | 10 | export function content(_content: HTMLElement, toc: HTMLElement, renderer: RendererLike, file: File) { 11 | return ( 12 | } 15 | fonts={} 16 | 17 | scripts={config.page.scripts} 18 | stylesheets={config.page.stylesheets} 19 | 20 | header={
} 21 | footer={