GitXplorerGitXplorer
k

inclusion-vapor

public
29 stars
0 forks
14 issues

Commits

List of commits on branch main.
Unverified
a75472f9c951d17b7672cfde6c76fda026b314c6

docs: update

kkazupon committed 23 days ago
Verified
fbe522139f2f488e3b84a13f44b24ce6834af44e

Merge pull request #41 from kazupon/feat/svelte-scoped-css

kkazupon committed 23 days ago
Unverified
998955e00abef235e1fcf66b8a3e5d289333b0d8

fix: support fully svelte scoped css

kkazupon committed 23 days ago
Unverified
27a44924c5c25dfedeed054274987c345ec94e83

fix: support combinator for slot

kkazupon committed 24 days ago
Unverified
519a4db415ff3049a5885d56b765fb35f6ba27d3

fix: structuring for await block

kkazupon committed 24 days ago
Unverified
dd0ece9c6515dcae8a5e408dcc9d2de253779842

fix: extend ast types

kkazupon committed 24 days ago

README

The README file for this repository.

🫶 Inclusion Vapor

Component Interoperability based on vapor

About this project

This Research & Development project is for running various components in vapor.

This project started with my day job project and was inspired by vue-jsx, which was announced at VueConf China 2024.

[!WARNING] This is WIP 👷, so don't use in production

This project try to work whether interoperability can be provided between components of different frameworks on vapor.

inclusion-vapor

🚂 Current working status:

Currently, I’m working on svelte vapor, which is necessary for my day job, so that’s a priority.

  • react-vapor (PoC Done): react for vapor
  • svelte-vapor (PoC Done): svelte for vapor,

🍭 Playground

pnpm build # build the packages
pnpm play # start playground

⚛️ react-vapor

Based on React v18 latest

🎩 svelte-vapor

Based on Svelte v4 (maybe v3 compatible)

✅ TODO

react-vapor

  • [ ] transform for jsx
    • [x] NodeTransform (Basic implementation done)
    • [x] DirectiveTransform (Basic implementation done)
  • [ ] hooks
    • [ ] useActionState
    • [ ] useCallback
    • [ ] useContext
    • [ ] useDebugValue
    • [ ] useDefferdValue
    • [ ] useEffect
    • [ ] useId
    • [ ] useImperativeHandle
    • [ ] useInsertionEffect
    • [ ] useLayoutEffect
    • [ ] useMemo
    • [ ] useOptimistic
    • [ ] useReducer
    • [ ] useRef
    • [x] useState
    • [ ] useSyncExternalStore
    • [ ] useTransition
  • [ ] Components
    • [ ] <Fragments>
    • [ ] <Profiler>
    • [ ] <StrictMode>
    • [ ] <Suspense>
    • [ ] Server components
  • [ ] APIs
    • [ ] act
    • [ ] cache
    • [ ] createContext
    • [ ] forwardRef
    • [ ] lazy
    • [ ] memo
    • [ ] startTransition
    • [ ] use
    • [ ] experimental_taintObjectReference
    • [ ] experimental_taintUniqueValue
  • [x] Template Explorer
  • [ ] Vite plugin with unplugin (PoC done)
    • [ ] analysis dependencies
    • [ ] runtime transform
    • [ ] reactivity transform
  • [x] Counter App
    • [x] simple bindings
    • [x] simple events
  • [ ] Repl
  • [ ] TODO-MVC App

svelte-vapor

  • [x] transform
    • [x] NodeTransform
    • [x] DirectiveTransform
  • [ ] Svelte Component
    • [x] prop
    • [x] attrs
    • [x] prop export
    • [ ] $$props
    • [ ] $$restProps
    • [x] $
    • [x] context="module"
    • [x] style
  • [ ] Logic blocks
    • [x] {#if} / {:else} / {:else if}
    • [x] {#each}
    • [ ] {#await}
    • [ ] {#key}
  • [ ] Special tags
    • [x] {@html}
    • [ ] {@debug}
    • [ ] {@const}
  • [ ] Element directives
    • [x] on:eventname
    • [x] bind:property
    • [x] Binding <select> value
    • [ ] Media element bindings
    • [ ] Image element bindings
    • [ ] Block-level element bindings
    • [x] bind:group
    • [x] bind:this
    • [x] class:name (multiple classes hasn't supported yet)
    • [x] style:property (mulple styles, modifier has'nt supported yes)
    • [ ] use:action
    • [ ] transition:fn
    • [ ] Transition parameters
    • [ ] Custom transition functinos
    • [ ] Transition events
    • [ ] in:fn/out:fn
    • [ ] animate:fn
    • [ ] Animation Parameters
    • [ ] Custom animation functions
  • [ ] Component directives
    • [x] on:eventname
    • [ ] --style-props
    • [x] bind:property
    • [x] bind:this
  • [ ] Special elements
    • [ ] <slot>
      • [x] default
      • [x] <slot name="name">
      • [ ] $$slots
      • [x] <slot key={value}>
    • [ ] <svelte:self>
    • [x] <svelte:component>
    • [ ] <svelte:element>
    • [ ] <svelte:window>
    • [ ] <svelte:document>
    • [ ] <svelte:body>
    • [ ] <svelte:head>
    • [ ] <svelte:options>
    • [x] <svelte:fragment>
  • [ ] Runtime
    • [x] svelte
      • [x] onMount (not still support return unmount fn)
      • [x] beforeUpdate
      • [x] afterUpdate
      • [x] onDestroy (vapor not still support)
      • [x] tick
      • [x] setContext
      • [x] getContext
      • [x] hasContext
      • [x] getAllContext
      • [x] createEventDispatcher
    • [x] store
    • [ ] motion
    • [ ] transition
    • [ ] animate
    • [ ] eashing
    • [ ] action
  • [x] Template Explorer
  • [ ] SFC-flavoured component compiler (PoC Done)
    • [ ] template
    • [ ] script
    • [ ] styles
  • [ ] Vite plugin with unplugin (PoC Done)
    • [ ] HMR
    • [ ] analysis dependencies
    • [ ] runtime transform
    • [ ] reactivity transform
  • [x] Counter App
    • [x] simple bindings
    • [x] simple events
  • [ ] Repl
  • [ ] TODO-MVC App

🛣️ Roadmap

This is the roadmap for inclusion-vapor. Currently, we are focusing on day job project, so the roadmap only includes svelte-vapor. If needed, we will continue implementing react-vapor, but We hope to develop through contribution of the community.

This roadmap depends on vapor project so that the milestones may change.

Milestone 1: svelte-vapor basic implementation

  • Goal: To be able to use svelte-vapor instead of svelte 3 and 4 as experimental
  • Key Tasks:
    • [ ] Basic implementation for svelte 3 and 4 features in day job project (see more task details here)
    • [ ] Building with unplugin-svelte
    • [ ] E2E testing (Snapshot consistency) based on svelte 4 testing

Milestone 2: svelte-vapor advanced implementation

  • Goal: To be able to use svelte-vapor instead of svelte 5, 3, and 4
  • Key Tasks:
    • [ ] Implementation of svelte 3 and 4 remaining features to make them available for use by external projects
    • [ ] Rust compiler implementation for Svelte template
    • [ ] Implementation for svelte 5 (Support for runes)

💖 Credits

This project is supported by:

And Inspired by:

Thank you! ❤️

©️ License

MIT