Separate UI and tools into different entrypoints to create a fully headless editor with minimal bundle size

Aperta
  • Qualcosa non va?
#702 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
5/5
Tempo stimato
Più di una settimana
Idoneità per principianti
25/100
Tipo di issue
Refactoring
Chiarezza
Da chiarire
Stato di attività
Ferma
Stack tecnologico
react, typescript
Ambito
frontend

Direzione di ricerca

La issue propone entrypoint o pacchetti separati core e ui, con i comandi, le utility, i tipi, gli helper di TextArea, Context e gli export di Editor elencati. Inizia mappando gli export e le dipendenze attuali del package intorno a questi componenti; non sono indicati file o test. Il lavoro sarà considerato completato quando sarà disponibile un entrypoint headless documentato che escluda i componenti UI e un entrypoint UI che fornisca l’Editor e gli stili.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

First of all, love the package and I think it fills a gap in the ecosystem.

I'm creating this issue to discuss and get alignment on a possible future refactor that would allow this package to be even more useful.

After https://github.com/uiwjs/react-md-editor/pull/697 the package already allows to replace all UI elements and use your own, which is great for uses when the look and feel is meant to come from an external component/design system. The only problem is that right now the bundle still includes some UI components, so they are added to the application's final bundle size even if they're not needed.

What do you think about separating the package like this:

  1. @uiwjs/react-md-editor/core: exports all headless tools and utilities, allowing the user the build a fully custom UI with them

Exports:

  • commands
  • utils
  • types
  • components/TextArea/shortcuts
  • components/TextArea/handleKeyDown
  • Context
  1. @uiwjs/react-md-editor/ui: ready-made React components, allowing the user to quickly integrate an existing editor into their application

Exports:

  • Editor

Bundles LESS styles
Uses the core package internally

Alternatively, they could be separate packages, published separately.

I may be forgetting an import here or there, but I hope this describes the idea.

Do you have any questions, concerns, thoughts on this? Maybe we could agree on a final scope and take this into consideration for the next major version?

Lingua principale
TypeScript
Stelle
2.9k
Fork
200
Merge medio
6h 38m
PR unite (30g)
16

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di uiwjs/react-md-editor

Tutte le issue di uiwjs/react-md-editor

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.