Early design of InPageEdit core architecture

ipe-early-design-demo.ts

/** Core types */
class InPageEdit {
  constructor(options?: Partial<AppOptions>) {}
  private plugins: Plugin[]
  private pages: Page[]
  fn: Record<string, any>
  use: (payload: Plugin) => this
  createPage: (title?: string) => Page
  createPlugin: (name: string, apply: (ctx: Context) => VueInstance) => Plugin
}
interface AppOptions {
  summary: string
  // ...
}
interface Context {
  page: Page
  plugins: Plugin[]
  utis: Utils
}
interface Utils {
  edit: (payload) => this
}
interface Plugin {
  name: string
  apply: (ctx) => VueInstance
}
type Site = ApiQuerySiteMeta
interface User {
  name: string
  uid: number
  groups: string[]
  rights: string[]
  blocked: boolean
}
interface Page {
  title: string
  pageid: number
  query: ApiQueryPage
  parse: ApiParse
  fn: Record<string, any>
}

// +------------------------------+ //

/** Demo for quickEdit current page */
// Construct ipe app
const app = await new InPageEdit({
  summary: 'Edit via InPageEdit',
  // ...
})

// Plugin quickEdit
const quickEdit = app.createPlugin(
  'quick-edit' /* will be: quickEdit */,
  (ctx) => {
    // ...
    return Vue.createApp(/* ... */)
  }
)
app.use(quickEdit)

// Init current page
const curPage = await app.createPage(mw.config.values.wgPageName)

// Call quickEdit plugin
curPage.fn.quickEdit()
// or
// app.plugins.quickEdit(curPage)