Add Select API helpers

.github/workflows/ci.yml

@@ -14,6 +14,15 @@ jobs:
           node-version: 16
       - run: yarn install --immutable
       - run: yarn build
+  deps:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+      - run: yarn install --immutable
+      - run: yarn dedupe --check
   docs:
     runs-on: ubuntu-latest
     steps:

examples/hooks.test.ts

@@ -1,4 +1,3 @@
-// @vitest-environment jsdom
 import { describe, expect, it } from 'vitest'
 import { mockAll } from '/test/helpers/dom'
 

examples/minimal.test.ts

@@ -1,4 +1,3 @@
-// @vitest-environment jsdom
 import { describe, expect, it } from 'vitest'
 import { mockAll } from '/test/helpers/dom'
 

package.json

@@ -81,6 +81,7 @@
     "build": "yarn build:root && yarn build:vue",
     "build:root": "tsc && vite build && VITE_SSR=1 vite build --ssr ./src/index.tsx && tsc --project ./tsconfig.types.json && cp ./types/ink.d.ts ./dist/index.d.ts && mv ./dist/index.js ./dist/server.js && mv ./dist/index.cjs ./dist/server.cjs",
     "build:vue": "vue-tsc --project ./vue/tsconfig.json && vite build -c ./vue/vite.config.ts && VITE_SSR=1 vite build -c ./vue/vite.config.ts --ssr ./vue/src/InkMde.vue && vue-tsc --project ./vue/tsconfig.types.json && mv ./vue/dist/InkMde.vue.d.ts ./vue/dist/index.d.ts && mv ./vue/dist/InkMde.js ./vue/dist/server.js && mv ./vue/dist/InkMde.cjs ./vue/dist/server.cjs",
+    "ci": "yarn build && yarn test:once && yarn lint && yarn dedupe --check",
     "dev": "vite",
     "dev:vue": "tsx ./vue/server.ts",
     "docs:check": "embedme --verify README.md",
@@ -124,17 +125,17 @@
     "@vitejs/plugin-vue": "^3.0.3",
     "@vue/tsconfig": "^0.1.3",
     "embedme": "git+https://github.com/voracious/embedme.git#live-fork",
-    "eslint": "^8.23.0",
-    "eslint-plugin-solid": "^0.7.1",
+    "eslint": "^8.25.0",
+    "eslint-plugin-solid": "^0.7.3",
     "express": "^4.18.1",
-    "jsdom": "^20.0.0",
+    "jsdom": "^20.0.1",
     "tsx": "^3.9.0",
     "typescript": "^4.8.2",
-    "vite": "^3.0.9",
-    "vite-plugin-externalize-deps": "^0.1.4",
-    "vite-plugin-solid": "^2.3.0",
-    "vitest": "^0.22.1",
-    "vue": "^3.2.38",
+    "vite": "^3.1.6",
+    "vite-plugin-externalize-deps": "^0.4.0",
+    "vite-plugin-solid": "2.3.0",
+    "vitest": "^0.24.0",
+    "vue": "^3.2.40",
     "vue-tsc": "^0.40.5"
   },
   "publishConfig": {

src/api/destroy.ts

@@ -0,0 +1,7 @@
+import type InkInternal from '/types/internal'
+
+export const destroy = ([state]: InkInternal.Store) => {
+  const { editor } = state()
+
+  editor.destroy()
+}

src/api/focus.ts

@@ -0,0 +1,9 @@
+import type InkInternal from '/types/internal'
+
+export const focus = ([state]: InkInternal.Store) => {
+  const { editor } = state()
+
+  if (!editor.hasFocus) {
+    editor.focus()
+  }
+}

src/formatter.ts → src/api/format.ts

@@ -1,7 +1,6 @@
 import { syntaxTree } from '@codemirror/language'
-import { insert, selections, wrap } from '/src/instance'
+import { insert, selections, wrap } from '/src/api'
 import * as InkValues from '/types/values'
-
 import type { NodeType } from '@lezer/common'
 import type * as Ink from '/types/ink'
 import type InkInternal from '/types/internal'
@@ -251,7 +250,7 @@ const formatInline = ([state, setState]: InkInternal.Store, definition: FormatDe
   }
 }
 
-export const format = ([state, setState]: InkInternal.Store, formatType: `${Ink.Values.Markup}`, userSelection?: Ink.Editor.Selection) => {
+export const format = ([state, setState]: InkInternal.Store, formatType: Ink.EnumString<Ink.Values.Markup>, { selection: userSelection }: Ink.Instance.FormatOptions = {}) => {
   const definition = formatting[formatType]
   const selection = getSelection([state, setState], userSelection)
 

src/api/get_doc.ts

@@ -0,0 +1,7 @@
+import type InkInternal from '/types/internal'
+
+export const getDoc = ([state]: InkInternal.Store) => {
+  const { editor } = state()
+
+  return editor.state.sliceDoc()
+}

src/api/index.ts

@@ -0,0 +1,12 @@
+export * from './destroy'
+export * from './focus'
+export * from './format'
+export * from './get_doc'
+export * from './insert'
+export * from './load'
+export * from './options'
+export * from './reconfigure'
+export * from './select'
+export * from './selections'
+export * from './update'
+export * from './wrap'

src/api/insert.ts

@@ -0,0 +1,30 @@
+import { selections } from './selections'
+import type * as Ink from '/types/ink'
+import type InkInternal from '/types/internal'
+
+export const insert = ([state, setState]: InkInternal.Store, text: string, selection?: Ink.Editor.Selection, updateSelection = false) => {
+  const { editor } = state()
+
+  let start = selection?.start
+  let end = selection?.end || selection?.start
+
+  if (typeof start === 'undefined') {
+    const current = selections([state, setState]).pop() as Ink.Editor.Selection
+
+    start = current.start
+    end = current.end
+  }
+
+  const updates = { changes: { from: start, to: end, insert: text } }
+
+  if (updateSelection) {
+    const anchor = start === end ? start + text.length : start
+    const head = start === end ? start + text.length : start + text.length
+
+    Object.assign(updates, { selection: { anchor, head } })
+  }
+
+  editor.dispatch(
+    editor.state.update(updates),
+  )
+}

src/api/load.ts

@@ -0,0 +1,9 @@
+import { override } from '/src/utils/merge'
+import { makeState } from '/src/vendor/state'
+import type InkInternal from '/types/internal'
+
+export const load = ([state, setState]: InkInternal.Store, doc: string) => {
+  setState(override(state(), { options: { doc } }))
+
+  state().editor.setState(makeState(state()))
+}

src/api/options.ts

@@ -0,0 +1,5 @@
+import type InkInternal from '/types/internal'
+
+export const options = ([state]: InkInternal.Store) => {
+  return state().options
+}

src/api/reconfigure.ts

@@ -0,0 +1,12 @@
+import { buildVendorUpdates } from '/src/extensions'
+import { override } from '/src/utils/merge'
+import type * as Ink from '/types/ink'
+import type InkInternal from '/types/internal'
+
+export const reconfigure = ([state, setState]: InkInternal.Store, options: Ink.Options) => {
+  const effects = buildVendorUpdates(setState(override(state(), { options })))
+
+  state().editor.dispatch({
+    effects,
+  })
+}

src/api/select.ts

@@ -0,0 +1,40 @@
+import { toCodeMirror } from '/src/vendor/adapters/selections'
+import * as InkValues from '/types/values'
+import type * as Ink from '/types/ink'
+import type InkInternal from '/types/internal'
+
+export const select = (store: InkInternal.Store, options: Ink.Instance.SelectOptions = {}) => {
+  if (options.selections)
+    return selectMultiple(store, options.selections)
+  if (options.selection)
+    return selectOne(store, options.selection)
+  if (options.at)
+    return selectAt(store, options.at)
+}
+
+export const selectAt = (store: InkInternal.Store, at: Ink.Values.Selection) => {
+  const [state] = store
+
+  if (at === InkValues.Selection.Start)
+    return selectOne(store, { start: 0, end: 0 })
+
+  if (at === InkValues.Selection.End) {
+    const position = state().editor.state.doc.length
+
+    return selectOne(store, { start: position, end: position })
+  }
+}
+
+export const selectMultiple = ([state]: InkInternal.Store, selections: Ink.Editor.Selection[]) => {
+  const { editor } = state()
+
+  editor.dispatch(
+    editor.state.update({
+      selection: toCodeMirror(selections),
+    }),
+  )
+}
+
+export const selectOne = (store: InkInternal.Store, selection: Ink.Editor.Selection) => {
+  return selectMultiple(store, [selection])
+}

src/api/selections.ts

@@ -0,0 +1,9 @@
+import { toInk } from '/src/vendor/adapters/selections'
+import type * as Ink from '/types/ink'
+import type InkInternal from '/types/internal'
+
+export const selections = ([state]: InkInternal.Store): Ink.Editor.Selection[] => {
+  const { editor } = state()
+
+  return toInk(editor.state.selection)
+}

src/api/update.ts

@@ -0,0 +1,15 @@
+import type InkInternal from '/types/internal'
+
+export const update = ([state]: InkInternal.Store, doc: string) => {
+  const { editor } = state()
+
+  editor.dispatch(
+    editor.state.update({
+      changes: {
+        from: 0,
+        to: editor.state.doc.length,
+        insert: doc,
+      },
+    }),
+  )
+}

src/api/wrap.ts

@@ -0,0 +1,15 @@
+import { insert } from './insert'
+import { select } from './select'
+import { selections } from './selections'
+import type * as Ink from '/types/ink'
+import type InkInternal from '/types/internal'
+
+export const wrap = ([state, setState]: InkInternal.Store, { after, before, selection: userSelection }: Ink.Instance.WrapOptions) => {
+  const { editor } = state()
+
+  const selection = userSelection || selections([state, setState]).pop() || { start: 0, end: 0 }
+  const text = editor.state.sliceDoc(selection.start, selection.end)
+
+  insert([state, setState], `${before}${text}${after}`, selection)
+  select([state, setState], { selections: [{ start: selection.start + before.length, end: selection.end + before.length }] })
+}